Can request a membership deletion on the API

assets/css/pages/groups/pages/main.css

@@ -27,4 +27,16 @@
 
 .groups-main-page .group-item .group-name {
     width: 180px;
-} 
+}
+
+.groups-main-page .group-item .buttons-area {
+    width: 20px;
+}
+
+.groups-main-page .group-item .buttons-area .fa {
+    color: #b5bbc8;
+}
+
+.groups-main-page .group-item .buttons-area .fa:active {
+    color: black;
+}

assets/js/components/groups/interface.js

@@ -34,6 +34,21 @@ ComunicWeb.components.groups.interface = {
 		ComunicWeb.common.api.makeAPIrequest(apiURI, params, true, callback);
 	},
 
+	/**
+	 * Remove a user membership
+	 * 
+	 * @param {Number} groupID The ID of the target group
+	 * @param {Function} callback
+	 */
+	removeMembership: function(groupID, callback){
+		//Perform the request over the API
+		var apiURI = "groups/remove_membership";
+		var params = {
+			id: groupID
+		};
+		ComunicWeb.common.api.makeAPIrequest(apiURI, params, true, callback);
+	},
+
 	/**
 	 * Get information about a group
 	 * 

assets/js/pages/groups/pages/main.js

@@ -95,6 +95,36 @@ ComunicWeb.pages.groups.pages.main = {
                 openPage("groups/" + group.id); 
             });
 
+            //Offer the user to delete its membership
+            var deleteButton = createElem2({
+                appendTo: groupItem,
+                type: "div",
+                class: "buttons-area a",
+                innerHTML: "<i class='fa fa-trash'></i>"
+            });
+
+            deleteButton.addEventListener("click", function(e){
+
+                //Ask user confirmation
+                ComunicWeb.common.messages.confirm("Do you really want to delete your membership of this group ?", function(r){
+                    if(!r) return;
+
+                    groupItem.style.visibility = "hidden";
+
+                    ComunicWeb.components.groups.interface.removeMembership(group.id, function(result){
+
+                        groupItem.style.visibility = "visible";
+
+                        if(result.error)
+                            return notify("Could not your membership to this group!", "error");
+                        
+                        groupItem.remove();
+
+                    });
+                });
+
+            });
+
             //Display membership status
             ComunicWeb.pages.groups.sections.membershipBlock.display(group, groupItem);
         });