Comunic/ComunicWeb
1
0
Fork 0
mirror of https://github.com/pierre42100/ComunicWeb synced 2024-12-25 02:18:51 +00:00
Code Issues Projects Releases Wiki Activity

Upgraded friends bar

Browse Source
This commit is contained in:
Pierre 2018-01-03 09:17:00 +01:00
parent 5671c259e6
commit 57599bc47f
2 changed files with 67 additions and 23 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

29
assets/css/components/friends/friendsBar.css
View File

@ -90,8 +90,17 @@
} }
} }
#friendsList td { #friendsList ul {
vertical-align: middle; padding-left: 0px;
}
#friendsList li {
list-style: none;
}
#friendsList li:hover {
background: #f4f4f4;
text-decoration: none;
} }
#friendsList .account-image { #friendsList .account-image {
@ -102,7 +111,17 @@
visibility: visible visibility: visible
} }
#friendsList .statusRow { #friendsList h4 {
width: 58px; padding: 0;
text-align: center; margin: 0 0 0 45px;
color: #444444;
font-size: 15px;
position: relative;
}
#friendsList a {
border-bottom: 1px solid #f4f4f4;
display: block;
white-space: nowrap;
padding: 5px 5px 5px 5px;
} }

61
assets/js/components/friends/friendsBar.js
View File

@ -54,9 +54,11 @@ ComunicWeb.components.friends.bar = {
init: function(friendsListContainer){ init: function(friendsListContainer){
//First, create the table container //First, create the table container
var listFriendsElemTable = createElem("table", friendsListContainer); var listFriendsElem = createElem2({
listFriendsElemTable.className = "table table-condensed"; appendTo: friendsListContainer,
var listFriendsElem = createElem("tbody", listFriendsElemTable); type: "ul",
class: "menu"
});
//Refresh friends list //Refresh friends list
this.refresh(listFriendsElem); this.refresh(listFriendsElem);
@ -118,16 +120,16 @@ ComunicWeb.components.friends.bar = {
//Check if the friends hasn't any friend //Check if the friends hasn't any friend
if(friendsList.length == 0){ if(friendsList.length == 0){
//Display adapted message //Display adapted message
var noFriendMessageRow = createElem("tr", listFriendsElem); var noFriendMessageRow = createElem("li", listFriendsElem);
var noFriendMessageColumn = createElem("td", noFriendMessageRow); var noFriendMessage = createElem("span", noFriendMessageRow);
var noFriendMessage = createElem("span", noFriendMessageColumn);
noFriendMessage.style.color = "#3c8dbc"; noFriendMessage.style.color = "#3c8dbc";
noFriendMessage.style.fontSize = "150%"; noFriendMessage.style.fontSize = "150%";
noFriendMessage.innerHTML = "You have no friends yet! <br /> We can't display anything here for you for now... :(" noFriendMessage.style.textAlign = "justify";
noFriendMessage.innerHTML = "You have no friends yet! We can't display anything here for you for now... :("
} }
//Enable slimscroll //Enable slimscroll
$(listFriendsElem.parentNode.parentNode).slimScroll({ $(listFriendsElem.parentNode).slimScroll({
height: '100%;' height: '100%;'
}); });
}); });
@ -147,21 +149,44 @@ ComunicWeb.components.friends.bar = {
var friendID = friendshipInfos.ID_friend; var friendID = friendshipInfos.ID_friend;
//Create a row //Create a row
var friendRow = createElem("tr", listFriendsElem); var friendRow = createElem("li", listFriendsElem);
//Add user avatar //Create link
var imageRow = createElem("td", friendRow); var friendLink = createElem2({
var imageElem = createElem("img", imageRow); appendTo: friendRow,
imageElem.src = userInfos.accountImage; type: "a"
imageElem.className = "account-image"; });
//Make the link lives
friendLink.onclick = function(){
openUserPage(userIDorPath(userInfos));
}
//Add user account image
var imageRow = createElem2({
appendTo: friendLink,
type: "div",
class: "pull-left"
});
var imageElem = createElem2({
appendTo: imageRow,
type: "img",
class: "account-image",
src: userInfos.accountImage
});
//Add user name //Add user name
var nameRow = createElem("td", friendRow); var nameRow = createElem2({
nameRow.innerHTML = userInfos.firstName + " " + userInfos.lastName; appendTo: friendLink,
type: "h4",
innerHTML: userInfos.firstName + " " + userInfos.lastName
});
//Add user login status //Add user login status
var statusRow = createElem("td", friendRow); var statusRow = createElem2({
statusRow.className = "statusRow"; appendTo: friendLink,
type: "p",
});
//Check if the user was accepted or not //Check if the user was accepted or not
if(friendshipInfos.accepted == "1"){ if(friendshipInfos.accepted == "1"){