From c7488d40319d9b2038486f867c6316b2c2fb3024 Mon Sep 17 00:00:00 2001 From: Pierre Date: Sun, 14 Jan 2018 08:56:17 +0100 Subject: [PATCH] Make a request on the API to update message content --- assets/css/components/posts/edit.css | 9 ++ assets/js/common/functionsSchema.js | 9 +- assets/js/components/posts/edit.js | 159 ++++++++++++++++++++++++ assets/js/components/posts/interface.js | 23 +++- assets/js/components/posts/ui.js | 3 +- system/config/dev.config.php | 2 + 6 files changed, 202 insertions(+), 3 deletions(-) create mode 100644 assets/css/components/posts/edit.css create mode 100644 assets/js/components/posts/edit.js diff --git a/assets/css/components/posts/edit.css b/assets/css/components/posts/edit.css new file mode 100644 index 00000000..54aaa440 --- /dev/null +++ b/assets/css/components/posts/edit.css @@ -0,0 +1,9 @@ +/** + * Posts edition stylesheet + * + * @author Pierre HUBERT + */ + +.edit-post-modal { + +} \ No newline at end of file diff --git a/assets/js/common/functionsSchema.js b/assets/js/common/functionsSchema.js index 949cd7da..43bc8ab3 100644 --- a/assets/js/common/functionsSchema.js +++ b/assets/js/common/functionsSchema.js @@ -682,7 +682,14 @@ var ComunicWeb = { */ form: { //TODO : implement - } + }, + + /** + * Post editor + */ + edit: { + //TODO : implement + }, }, diff --git a/assets/js/components/posts/edit.js b/assets/js/components/posts/edit.js new file mode 100644 index 00000000..159a31ed --- /dev/null +++ b/assets/js/components/posts/edit.js @@ -0,0 +1,159 @@ +/** + * Post editor + * + * @author Pierre HUBERT + */ + +ComunicWeb.components.posts.edit = { + + /** + * Open post editor + * + * @param {Object} infos Informations about the post to edit + * @param {HTMLElement} root Post root element + */ + open: function(infos, root){ + + //Create editor modal + var modal = createElem2({ + type: "div", + class: "modal modal-default edit-post-modal" + }); + + var modalDialog = createElem2({ + appendTo: modal, + type: "div", + class: "modal-dialog" + }); + + var modalContent = createElem2({ + appendTo: modalDialog, + type: "div", + class: "modal-content", + }); + + //Modal header + var modalHeader = createElem2({ + appendTo: modalContent, + type: "div", + class: "modal-header" + }); + + var closeModalBtn = createElem2({ + appendTo: modalHeader, + type: "button", + class: "close", + }); + closeModalBtn.setAttribute("data-confirm", "false"); + + createElem2({ + appendTo: closeModalBtn, + type: "span", + innerHTML: "x" + }); + + var modalTitle = createElem2({ + appendTo: modalHeader, + type: "h4", + class: "modal-title", + innerHTML: "Update the post" + }); + + //Modal body + var modalBody = createElem2({ + appendTo: modalContent, + type: "div", + class: "modal-body", + }); + + //Modal footer + var modalFooter = createElem2({ + appendTo: modalContent, + type: "div", + class: "modal-footer" + }); + + var cancelButton = createElem2({ + appendTo: modalFooter, + type: "button", + class: "btn btn-default pull-left", + innerHTML: "Cancel" + }); + cancelButton.setAttribute("data-confirm", "false"); + + var confirmButton = createElem2({ + appendTo: modalFooter, + type: "button", + class: "btn btn-primary", + innerHTML: "Update" + }); + confirmButton.setAttribute("data-confirm", "true"); + + //Show the modal + $(modal).modal('show'); + + //Create the update area + var updateDiv = createElem2({ + appendTo: modalBody, + type: "div", + class: "editor-contener" + }); + + //Create update editor + var editorDiv = createElem2({ + appendTo: updateDiv, + type: "div", + class: "editor", + innerHTML: infos.content + }); + $(editorDiv).wysiwyg(); + + //Create function to close modal + var closeModal = function(){ + $(modal).modal('hide'); + emptyElem(modal); + modal.remove(); + } + + //Handles update request + var callback = function(){ + + //Check if the update was cancelled + if(this.getAttribute("data-confirm") !== "true"){ + closeModal(); + return; //Cancel operation + } + + //Get the new post content + var new_content = editorDiv.innerHTML; + + //Check the new post content + if(!ComunicWeb.components.posts.form._check_message(new_content)){ + ComunicWeb.common.notificationSystem.showNotification("Please check your message content !", "danger"); + return; + } + + //Lock update button + confirmButton.disabled = "true"; + + //Perform a request on the API to update message content + ComunicWeb.components.posts.interface.update_content(infos.ID, new_content, function(response){ + + //Check for errors + if(response.error){ + ComunicWeb.common.notificationSystem.showNotification("An error occured while trying to udpate post !", "danger"); + confirmButton.disabled = false; + return; + } + + //Display success + ComunicWeb.common.notificationSystem.showNotification("The post has been updated !", "success"); + + }); + } + closeModalBtn.onclick = callback; + cancelButton.onclick = callback; + confirmButton.onclick = callback; + } + +} \ No newline at end of file diff --git a/assets/js/components/posts/interface.js b/assets/js/components/posts/interface.js index 57dbb08b..e6d34a85 100644 --- a/assets/js/components/posts/interface.js +++ b/assets/js/components/posts/interface.js @@ -85,6 +85,27 @@ ComunicWeb.components.posts.interface = { //Perform the request ComunicWeb.common.api.makeAPIrequest(apiURI, params, true, callback); - } + }, + + /** + * Update a message content + * + * @param {int} postID The ID of the post to update + * @param {string} content The new content of the post + * @param {function} callback What to do once post has been updated + */ + update_content: function(postID, content, callback){ + + //Prepare an API request + apiURI = "posts/update_content"; + params = { + postID: postID, + new_content: content + }; + + //Perform the request + ComunicWeb.common.api.makeAPIrequest(apiURI, params, true, callback); + + }, } \ No newline at end of file diff --git a/assets/js/components/posts/ui.js b/assets/js/components/posts/ui.js index d7482b71..b384595c 100644 --- a/assets/js/components/posts/ui.js +++ b/assets/js/components/posts/ui.js @@ -187,7 +187,8 @@ ComunicWeb.components.posts.ui = { //Make buttons lives editButtonLink.onclick = function(){ - + //Open post editor + ComunicWeb.components.posts.edit.open(infos, postRoot); }; } diff --git a/system/config/dev.config.php b/system/config/dev.config.php index 514b72e6..9df9ad47 100644 --- a/system/config/dev.config.php +++ b/system/config/dev.config.php @@ -137,6 +137,7 @@ class Dev { //Posts component "css/components/posts/ui.css", "css/components/posts/form.css", + "css/components/posts/edit.css", //Movies picker "css/components/movies/picker.css", @@ -223,6 +224,7 @@ class Dev { "js/components/posts/interface.js", "js/components/posts/ui.js", "js/components/posts/form.js", + "js/components/posts/edit.js", //Modern textarea handler "js/components/textarea.js",