mirror of
https://github.com/pierre42100/ComunicWeb
synced 2024-11-26 05:49:22 +00:00
Improved friend list appearance
This commit is contained in:
parent
38dadde06b
commit
8732c40b36
35
assets/css/components/friends/friendsBar.css
Normal file
35
assets/css/components/friends/friendsBar.css
Normal file
@ -0,0 +1,35 @@
|
||||
/**
|
||||
* Friends bar style sheet
|
||||
*
|
||||
* @author Pierre HUBERT
|
||||
*/
|
||||
|
||||
#friendsList {
|
||||
position: fixed;
|
||||
right: 0px;
|
||||
border-left: 1px black solid;
|
||||
z-index: 999;
|
||||
background-color: #fff3ff80;
|
||||
top: 0px;
|
||||
height: 100%;
|
||||
padding: 10px;
|
||||
padding-top: 50px;
|
||||
width: 70px;
|
||||
transition: width 1s;
|
||||
}
|
||||
|
||||
#friendsList:hover {
|
||||
width: 230px;
|
||||
background-color: #ffffff;
|
||||
}
|
||||
|
||||
#friendsList td {
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
#friendsList .account-image {
|
||||
margin: auto 10px auto auto;
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
border-radius: 50%;
|
||||
}
|
@ -54,8 +54,9 @@ ComunicWeb.components.friends.bar = {
|
||||
init: function(friendsListContainer){
|
||||
|
||||
//First, create the table container
|
||||
var listFriendsElem = createElem("table", friendsListContainer);
|
||||
listFriendsElem.className = "table table-condensed";
|
||||
var listFriendsElemTable = createElem("table", friendsListContainer);
|
||||
listFriendsElemTable.className = "table table-condensed";
|
||||
var listFriendsElem = createElem("tbody", listFriendsElemTable);
|
||||
|
||||
//Refresh friends list
|
||||
this.refresh(listFriendsElem);
|
||||
@ -72,9 +73,9 @@ ComunicWeb.components.friends.bar = {
|
||||
*/
|
||||
refresh: function(listFriendsElem){
|
||||
//Refresh it
|
||||
ComunicWeb.components.friends.list.refresh(function(list){
|
||||
ComunicWeb.components.friends.list.refresh(function(friendsList){
|
||||
//Check for error
|
||||
if(!list){
|
||||
if(!friendsList){
|
||||
//Log information
|
||||
ComunicWeb.debug.logMessage("ERROR : Can't refresh menubar without the latest list !");
|
||||
|
||||
@ -84,16 +85,38 @@ ComunicWeb.components.friends.bar = {
|
||||
|
||||
//Get users list to get information about them
|
||||
usersID = {};
|
||||
for(i in list){
|
||||
for(i in friendsList){
|
||||
//Extract user id
|
||||
var processID = list[i].ID_friend;
|
||||
var processID = friendsList[i].ID_friend;
|
||||
|
||||
usersID["user_"+processID] = processID;
|
||||
}
|
||||
|
||||
//Get users ID informations
|
||||
ComunicWeb.user.userInfos.getMultipleUsersInfos(usersID, function(usersInfo){
|
||||
console.log(usersInfo);
|
||||
ComunicWeb.user.userInfos.getMultipleUsersInfos(usersID, function(usersInfos){
|
||||
|
||||
//Show each friend
|
||||
for(i in friendsList){
|
||||
|
||||
//Extract friend ID
|
||||
var friendID = friendsList[i].ID_friend;
|
||||
|
||||
//Create a row
|
||||
var friendRow = createElem("tr", listFriendsElem);
|
||||
|
||||
//Add user avatar
|
||||
var imageRow = createElem("td", friendRow);
|
||||
var imageElem = createElem("img", imageRow);
|
||||
imageElem.src = usersInfos["user-"+friendID].accountImage;
|
||||
imageElem.className = "account-image";
|
||||
|
||||
//Add user name
|
||||
var nameRow = createElem("td", friendRow);
|
||||
nameRow.innerHTML = usersInfos["user-"+friendID].firstName + " " + usersInfos["user-"+friendID].lastName;
|
||||
|
||||
console.log(usersInfos["user-"+friendID]);
|
||||
}
|
||||
|
||||
});
|
||||
});
|
||||
},
|
||||
|
@ -25,6 +25,7 @@ $config['CSSfiles'] = array(
|
||||
//Components stylesheets
|
||||
"%PATH_ASSETS%css/components/menuBar.css",
|
||||
"%PATH_ASSETS%css/components/searchForm.css",
|
||||
"%PATH_ASSETS%css/components/friends/friendsBar.css",
|
||||
);
|
||||
|
||||
//JS files to include (at the end of the page)
|
||||
|
Loading…
Reference in New Issue
Block a user