diff --git a/assets/css/components/friends/listModal.css b/assets/css/components/friends/listModal.css new file mode 100644 index 00000000..b68338a0 --- /dev/null +++ b/assets/css/components/friends/listModal.css @@ -0,0 +1,5 @@ +/** + * Friends list modal stylesheet + * + * @author Pierre HUBERT + */ \ No newline at end of file diff --git a/assets/js/common/functionsSchema.js b/assets/js/common/functionsSchema.js index b84d62dd..dd17c02f 100644 --- a/assets/js/common/functionsSchema.js +++ b/assets/js/common/functionsSchema.js @@ -554,6 +554,13 @@ var ComunicWeb = { */ listModal: { //TODO : implement + }, + + /** + * Friends interface + */ + interface: { + //TODO : implement } }, diff --git a/assets/js/components/friends/interface.js b/assets/js/components/friends/interface.js new file mode 100644 index 00000000..4b586cf2 --- /dev/null +++ b/assets/js/components/friends/interface.js @@ -0,0 +1,49 @@ +/** + * Friends list interface + * + * @author Pierre HUBERT + */ + +ComunicWeb.components.friends.interface = { + + /** + * Get the list of friends of the current user + * + * @param {boolean} complete Specify whether the complete list + * should be returned or not + * @param {function} callback The callback function to call once + * we got a response from the server + */ + get_current_list: function(complete, callback){ + + //Prepare the API request + var apiURI = "friends/getList"; + var params = { + complete: complete + }; + + //Perform API request + ComunicWeb.common.api.makeAPIrequest(apiURI, params, true, callback); + + }, + + /** + * Get the list of friends of a specified user + * + * @param {number} userID The ID of the target user ID + * @param {function} callback What to do once we get a response + * from the server + */ + get_user_list: function(userID, callback){ + + //Prepare API request + var apiURI = "friends/get_user_list"; + var params = { + userID: userID + }; + + //Perform API request + ComunicWeb.common.api.makeAPIrequest(apiURI, params, true, callback); + } + +} \ No newline at end of file diff --git a/assets/js/components/friends/listModal.js b/assets/js/components/friends/listModal.js index 57f49d26..7e21ec12 100644 --- a/assets/js/components/friends/listModal.js +++ b/assets/js/components/friends/listModal.js @@ -9,10 +9,214 @@ ComunicWeb.components.friends.listModal = { /** * Display the box that contains the list of friends of the user * - * @param {number} userID The ID of the target user + * @param {number} user The ID of the target user */ - display: function(userID){ - alert(userID); - } + display: function(user){ + + //Check if the user is requesting its own friends list or not + if(user == userID()){ + + //Get the list of friends of the current user + ComunicWeb.components.friends.interface.get_current_list(true, function(r){ + + //Check for error + if(r.error){ + ComunicWeb.common.notificationSystem.showNotification("Could not get your list of friends !", "danger"); + return; + } + + //Show the list + ComunicWeb.components.friends.listModal._show(user, r); + }); + + } + + else + + //Try to get the list of friends of the specified user + ComunicWeb.components.friends.interface.get_user_list(user, function(r){ + + //Check for error + if(r.error){ + ComunicWeb.common.notificationSystem.showNotification("Could not get the of friends of the user (it may be private) !", "danger"); + return; + } + + //Show the list + ComunicWeb.components.friends.listModal._show(user, r); + + }); + + }, + + /** + * Show the list of friends of a user + * + * @param {number} user The ID of the target user + * @param {object} list The list of users to display + */ + _show: function(user, list){ + + //Create a modal root + var modal = createElem2({ + type: "div", + class: "modal modal-primary input-string-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 closeModal = createElem2({ + appendTo: modalHeader, + type: "button", + class: "close", + }); + + createElem2({ + appendTo: closeModal, + type: "span", + innerHTML: "x" + }); + + var modalTitle = createElem2({ + appendTo: modalHeader, + type: "h4", + class: "modal-title", + innerHTML: "Friends list" + }); + + //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 closeButton = createElem2({ + appendTo: modalFooter, + type: "button", + class: "btn btn-default", + innerHTML: "Close" + }); + + //Create the response function + var respond = function(){ + + //Close modal + $(modal).modal('hide'); + emptyElem(modal); + modal.remove(); + } + + //Make the buttons live + closeButton.onclick = respond; + closeModal.onclick = respond; + + //Display the right version of the friends list + if(userID() != user){ + + //Display a read-only list of friends + this._show_read_only(modalBody, list, user); + + } + + //Show the modal + $(modal).modal('show'); + }, + + /** + * Display a read-only list of friends + * + * @param {HTMLElement} target The target for the list of friends + * @param {array} ids The list of IDs of the target users + * @param {userID} user The ID of the related user + */ + _show_read_only: function(target, ids, user){ + + //Create the friends list contener + var list = createElem2({ + appendTo: target, + type: "div", + class: "friends-list-ro" + }); + + //Get informations about the users + ComunicWeb.user.userInfos.getMultipleUsersInfos(ids, function(users){ + + //Check for errors + if(users.error){ + ComunicWeb.common.notificationSystem.showNotification("An error occured while retrieving informations about the friends !", "danger"); + return; + } + + //Parse the list of friends + ids.forEach(id => { + + //Display the user + const userContener = createElem2({ + appendTo: list, + type: "div", + class: "friend" + }); + + //Create user link + const userLink = createElem2({ + appendTo: userContener, + type: "a" + }); + + //Add user account image + createElem2({ + appendTo: userLink, + type: "img", + src: users["user-" + id].accountImage + }); + + //Add users name + createElem2({ + appendTo: userLink, + type: "span", + class: "friends-name", + innerHTML: userFullName(users["user-" + id]) + }); + + //Make the link button lives + userLink.onclick = function(){ + + //Open user page + openUserPage(userIDorPath(users["user-" + id])); + + //Close all modals + $(".modal").modal("hide"); + + } + }); + + }); + + }, }; \ No newline at end of file diff --git a/system/config/dev.config.php b/system/config/dev.config.php index e0ec5c46..5db28dc1 100644 --- a/system/config/dev.config.php +++ b/system/config/dev.config.php @@ -122,6 +122,7 @@ class Dev { //Friendbar stylesheet "css/components/friends/friendsBar.css", + "css/components/friends/listModal.css", //Conversations stylesheet "css/components/conversations/manager.css", @@ -214,6 +215,7 @@ class Dev { "js/components/friends/friendsList.js", "js/components/friends/friendsBar.js", "js/components/friends/listModal.js", + "js/components/friends/interface.js", //Private conversations "js/components/conversations/manager.js",