Friend bar responsive

assets/js/components/friends/friendsBar.js

@@ -138,4 +138,30 @@ ComunicWeb.components.friends.bar = {
 			});
 		});
 	},
+
+	/**
+	 * Toogle show / hide friends bar
+	 * 
+	 * @return {Boolean} True for a success
+	 */
+	toggleShowHide: function(){
+		//Get friends list element
+		var friendListElem = byId("friendsList");
+
+		//Log action
+		ComunicWeb.debug.logMessage("Toggle friends list");
+
+		//Check current bar state
+		if(friendListElem.className == ""){
+			//Show the bar
+			friendListElem.className = "visible-bar";
+		}
+		else
+			//Hide the bar
+			friendListElem.className = "";
+
+		//Success
+		return true;
+	}
+
 }

assets/js/components/menuBar/authenticated.js

@@ -32,6 +32,9 @@ ComunicWeb.components.menuBar.authenticated = {
 		//Add user name
 		this.addUserName(navbarRightElemList);
 
+		//Add friends list button
+		this.addFriendListButton(navbarRightElemList);
+
 		//Add dropdown menu
 		this.addDropdown(navbarRightElemList);
 		
@@ -79,6 +82,30 @@ ComunicWeb.components.menuBar.authenticated = {
 		return dropdownContent;
 	},
 
+	/**
+	 * Add friendsList toggle button
+	 * 
+	 * @param {HTMLElement} navbarElem The target navbarlist element 
+	 * @return {HTMLElement} The button element
+	 */
+	addFriendListButton: function(navbarElem){
+		//Create button
+		var friendButton = createElem("li", navbarElem);
+		friendButton.className = "friendToggleButton";
+
+		//Create link
+		var friendButtonLink = createElem("a", friendButton);
+		var friendIcon = createElem("i", friendButtonLink);
+		friendIcon.className = "fa fa-users";
+
+		//Makes link live
+		friendButtonLink.onclick = function(){
+			ComunicWeb.components.friends.bar.toggleShowHide();
+		};
+
+		return friendButtonLink;
+	},
+
 	/**
 	 * Add user name element
 	 *