diff --git a/assets/css/pages/groups/pages/members.css b/assets/css/pages/groups/pages/members.css
new file mode 100644
index 00000000..5911bd15
--- /dev/null
+++ b/assets/css/pages/groups/pages/members.css
@@ -0,0 +1,34 @@
+/**
+ * Groups members page stylesheet
+ *
+ * @author Pierre HUBERT
+ */
+
+.group-members-page {
+ float: none;
+ margin: auto;
+ margin-top: 40px;
+}
+
+.group-members-page .backward-link {
+ margin-bottom: 10px;
+}
+
+.group-members-page .title {
+ text-align: center;
+}
+
+.group-members-page .member {
+ margin-bottom: 10px;
+}
+
+.group-members-page .member .user-image {
+ border-radius: 50%;
+ max-width: 50px;
+ height: auto;
+}
+
+.group-members-page .member .member-name {
+ margin-left: 5px;
+ font-weight: bold;
+}
\ No newline at end of file
diff --git a/assets/js/common/functionsSchema.js b/assets/js/common/functionsSchema.js
index 9cb93aaf..c4ead3dc 100644
--- a/assets/js/common/functionsSchema.js
+++ b/assets/js/common/functionsSchema.js
@@ -1007,6 +1007,12 @@ var ComunicWeb = {
//TODO : implement
},
+ /**
+ * Groups utilities
+ */
+ utils: {
+ //TODO : implement
+ },
},
},
@@ -1226,6 +1232,13 @@ var ComunicWeb = {
//TODO : implement
},
+ /**
+ * Group members page
+ */
+ members: {
+ //TODO : implement
+ },
+
/**
* Access to group forbidden page
*/
diff --git a/assets/js/components/groups/interface.js b/assets/js/components/groups/interface.js
index b63381d1..e0719af0 100644
--- a/assets/js/components/groups/interface.js
+++ b/assets/js/components/groups/interface.js
@@ -160,4 +160,18 @@ ComunicWeb.components.groups.interface = {
ComunicWeb.common.api.makeAPIrequest(apiURI, params, true, callback);
},
+ /**
+ * Get the members of a group
+ *
+ * @param {Number} id The ID of the target group
+ * @param {Function} callback
+ */
+ getMembers: function(id, callback){
+ //Perform the request over the API
+ var apiURI = "groups/get_members";
+ var params = {
+ id: id
+ };
+ ComunicWeb.common.api.makeAPIrequest(apiURI, params, true, callback);
+ }
};
\ No newline at end of file
diff --git a/assets/js/components/groups/utils.js b/assets/js/components/groups/utils.js
new file mode 100644
index 00000000..02fc15c6
--- /dev/null
+++ b/assets/js/components/groups/utils.js
@@ -0,0 +1,28 @@
+/**
+ * Groups utilities
+ *
+ * @author Pierre HUBERT
+ */
+
+ComunicWeb.components.groups.utils = {
+
+ /**
+ * Extract users ids from members list
+ *
+ * @param {Array} list The list of members to process
+ * @return {Array} The list of the IDs of the members of group
+ */
+ getMembersIDs: function(list){
+
+ var IDs = [];
+
+ //Process the list of IDs
+ list.forEach(function(member){
+ IDs.push(member.user_id);
+ });
+
+ return IDs;
+
+ }
+
+}
\ No newline at end of file
diff --git a/assets/js/pages/groups/main.js b/assets/js/pages/groups/main.js
index dee13698..36453a23 100644
--- a/assets/js/pages/groups/main.js
+++ b/assets/js/pages/groups/main.js
@@ -61,6 +61,9 @@ ComunicWeb.pages.groups.main = {
else if(page == "settings")
ComunicWeb.pages.groups.pages.settings.open(groupID, target);
+
+ else if(page == "members")
+ ComunicWeb.pages.groups.pages.members.open(groupID, target);
//Unrecognized page
diff --git a/assets/js/pages/groups/pages/members.js b/assets/js/pages/groups/pages/members.js
new file mode 100644
index 00000000..9306cbe9
--- /dev/null
+++ b/assets/js/pages/groups/pages/members.js
@@ -0,0 +1,162 @@
+/**
+ * Group members page
+ *
+ * @author Pierre HubERT
+ */
+
+ComunicWeb.pages.groups.pages.members = {
+
+ /**
+ * Open member settings page
+ *
+ * @param {Number} id The ID of group
+ * @param {HTMLElement} target The target of the page
+ */
+ open: function(id, target){
+
+ //Create container
+ var membersContainer = createElem2({
+ appendTo: target,
+ type: "div",
+ class: "col-md-6 group-members-page"
+ });
+
+ //Add backward link
+ var backwardLink = createElem2({
+ appendTo: membersContainer,
+ type: "div",
+ class: "a backward-link",
+ innerHTML: " Go back to the group"
+ });
+ backwardLink.addEventListener("click", function(e){
+ openPage("groups/" + id);
+ });
+
+ //Loading message
+ var loadingMsg = ComunicWeb.common.messages.createCalloutElem(
+ "Loading",
+ "Please wait while we load a few information...",
+ "info"
+ );
+ membersContainer.appendChild(loadingMsg);
+
+ //Get information about the group
+ ComunicWeb.components.groups.interface.getInfo(id, function(info){
+
+ //Check for errors
+ if(info.error){
+ loadingMsg.remove();
+ membersContainer.appendChild(
+ ComunicWeb.common.messages.createCalloutElem(
+ "Error",
+ "Could not get group information !",
+ "danger"
+ )
+ );
+ return;
+ }
+
+ //Get the list of members of the group
+ ComunicWeb.components.groups.interface.getMembers(id, function(members){
+
+ //Check for errors
+ if(members.error){
+ loadingMsg.remove();
+ membersContainer.appendChild(
+ ComunicWeb.common.messages.createCalloutElem(
+ "Error",
+ "Could not get group members !",
+ "danger"
+ )
+ );
+ return;
+ }
+
+ //Get the ID of the members of the group
+ var membersIDs = ComunicWeb.components.groups.utils.getMembersIDs(members);
+
+ //Get information about the members of the group
+ ComunicWeb.user.userInfos.getMultipleUsersInfos(membersIDs, function(users){
+
+ //Check for errors
+ if(users.error){
+ loadingMsg.remove();
+ membersContainer.appendChild(
+ ComunicWeb.common.messages.createCalloutElem(
+ "Error",
+ "Could not get group members information !",
+ "danger"
+ )
+ );
+ return;
+ }
+
+ //Remove loading message
+ loadingMsg.remove();
+
+ //Display the members list
+ ComunicWeb.pages.groups.pages.members.displayList(info, members, users, membersContainer);
+
+ });
+
+
+ });
+
+
+ });
+ },
+
+ /**
+ * Display the list of members of the group
+ *
+ * @param {Object} info Information about the group
+ * @param {Array} list The list of members of the group
+ * @param {Object} users The list of users of the group
+ * @param {HTMLElement} target The target for the list
+ */
+ displayList: function(info, list, users, target){
+
+ //Append the title of the group
+ createElem2({
+ appendTo: target,
+ type: "h2",
+ class: "title",
+ innerHTML: "Members of " + info.name
+ });
+
+ //Process the list of the members
+ var membersList = createElem2({
+ appendTo: target,
+ type: "div",
+ class: "members-list"
+ });
+
+ list.forEach(function(member){
+
+ //Fetch user information
+ var userInfo = users["user-" + member.user_id];
+
+ //Create member container
+ var memberContainer = createElem2({
+ appendTo: membersList,
+ type: "div",
+ class: "member"
+ });
+
+ //User account image and name
+ createElem2({
+ appendTo: memberContainer,
+ type: "img",
+ class: "user-image",
+ src: userInfo.accountImage
+ });
+
+ createElem2({
+ appendTo: memberContainer,
+ type: "span",
+ class: "member-name",
+ innerHTML: userFullName(userInfo)
+ });
+ });
+ }
+}
\ No newline at end of file
diff --git a/assets/js/pages/groups/sections/header.js b/assets/js/pages/groups/sections/header.js
index ac000545..d3dbae9f 100644
--- a/assets/js/pages/groups/sections/header.js
+++ b/assets/js/pages/groups/sections/header.js
@@ -69,19 +69,32 @@ ComunicWeb.pages.groups.sections.header = {
});
//Add join date
- var joinDate = createElem2({
+ createElem2({
appendTo: thirdColumn,
type: "div",
innerHTML: ' Created '+ComunicWeb.common.date.timeDiffToStr(info.time_create)+' ago'
});
//Add number of members
- var joinDate = createElem2({
+ var members = createElem2({
appendTo: thirdColumn,
type: "div",
innerHTML: ' '+ info.number_members+' members'
});
+ //Check if the user is a moderator or an admin
+ if(info.membership == "administrator" || info.membership == "moderator"){
+
+ //Turn members information into a link
+ members.className = "a";
+
+ members.addEventListener("click", function(e){
+
+ openPage("groups/" + info.id + "/members");
+
+ });
+ }
+
//Group visibility
var visibility = {
open: "Open group",
diff --git a/system/config/dev.config.php b/system/config/dev.config.php
index 28b44c41..127e1c65 100644
--- a/system/config/dev.config.php
+++ b/system/config/dev.config.php
@@ -222,6 +222,7 @@ class Dev {
"css/pages/groups/pages/create.css",
"css/pages/groups/pages/group.css",
"css/pages/groups/pages/settings.css",
+ "css/pages/groups/pages/members.css",
"css/pages/groups/pages/forbidden.css",
//Groups sections
@@ -389,6 +390,7 @@ class Dev {
//Groups component
"js/components/groups/interface.js",
+ "js/components/groups/utils.js",
//User scripts
"js/user/loginTokens.js",
@@ -429,6 +431,7 @@ class Dev {
"js/pages/groups/pages/create.js",
"js/pages/groups/pages/group.js",
"js/pages/groups/pages/settings.js",
+ "js/pages/groups/pages/members.js",
"js/pages/groups/pages/forbidden.js",
//Groups sections