diff --git a/src/styles/components/_buddycondensed.scss b/src/styles/components/_buddycondensed.scss index fbab8add..8a003bca 100644 --- a/src/styles/components/_buddycondensed.scss +++ b/src/styles/components/_buddycondensed.scss @@ -19,13 +19,9 @@ * */ #buddycondensed { - display: table; - float: left; - height: 50px; - overflow: hidden; + display: inline-block; + position: fixed; padding-left: 20px; - vertical-align: bottom; - min-width: 355px; } .buddycondensed { &.buddy { @@ -34,6 +30,7 @@ cursor: auto; min-height: 50px; vertical-align: bottom; + overflow: visible; .buddyPicture { margin: 2px; } @@ -44,6 +41,7 @@ background: #f8f8f8; display: none; position: fixed; + top: 49px; &:hover { display: block; } @@ -52,11 +50,45 @@ display: inline-block; font-weight: bold; padding-left: 10px; + cursor: default; &:hover ~ .overDefaultDisplayNum { display: block; } } + .actions { + background: #FFF; + border: 1px solid rgba(128, 128, 128, 0.16); + box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2); + border-radius: 2px; + display: none; + cursor: default; + height: 51px; + padding: 0 15px; + bottom: 10px; + position: relative; + white-space: nowrap; + z-index: 10; + .btn-group { + margin-bottom: 5px; + width: 55px; + } + .btn-primary { + padding: 2px 4px; + } + .fa { + font-size: 20px; + color: #FFF; + line-height: 24px; + } + .displayName { + margin-right: 10px; + } + } .buddyPicture { cursor: pointer; + overflow: visible; + &:hover .actions { + display: inline-block; + } } } diff --git a/static/js/directives/buddycondensed.js b/static/js/directives/buddycondensed.js index 2cfc0cab..b794d7c9 100644 --- a/static/js/directives/buddycondensed.js +++ b/static/js/directives/buddycondensed.js @@ -25,6 +25,29 @@ define(['angular', 'text!partials/buddycondensed.html'], function(angular, templ var controller = ['$scope', 'mediaStream', 'contacts', function($scope, mediaStream, contacts) { var buddycondensed = []; + var empty = function(x) { + return x === null || x === undefined || isNaN(x) || x === ""; + }; + var sortCondensed = function() { + var unnamed = buddycondensed.length; + buddycondensed.sort(function(current, next) { + if(!current.Status || current.Status && empty(current.Status.displayName)) { + return 1; + } else { + if(next.Status && !empty(next.Status.displayName)) { + if (current.Status.displayName < next.Status.displayName) { + return -1; + } else if (current.Status.displayName > next.Status.displayName) { + return 1; + } else { + return 0; + } + } else { + return 0; + } + } + }); + }; var joined = function(buddy) { buddycondensed.push(buddy); }; @@ -37,13 +60,14 @@ define(['angular', 'text!partials/buddycondensed.html'], function(angular, templ } $scope.$apply(); }; - // replace session data with contact data var contactadded = function(data) { //console.log('contactadded', data); var hasSession = false; for (var i in buddycondensed) { + // replace session data with contact data if(buddycondensed[i].Userid === data.Userid) { - buddycondensed[i] = angular.extend(buddycondensed[i], data); + buddycondensed[i] = data; + //console.log('contactadded replaced', 'data', data.Status && data.Status.displayName, 'buddycondensed[i]', buddycondensed[i].Status && buddycondensed[i].Status.displayName); hasSession = true; break; } @@ -70,6 +94,7 @@ define(['angular', 'text!partials/buddycondensed.html'], function(angular, templ $scope.maxBuddiesToShow = 5; contacts.e.on("contactadded", function(event, data) { contactadded(data); + sortCondensed(); }); mediaStream.api.e.on("received.userleftorjoined", function(event, dataType, data) { //console.log("received.userleftorjoined", data.Id); @@ -78,6 +103,7 @@ define(['angular', 'text!partials/buddycondensed.html'], function(angular, templ } else { joined(data); } + sortCondensed(); }); mediaStream.api.e.on("received.users", function(event, data) { //console.log("received.users", data); @@ -87,6 +113,7 @@ define(['angular', 'text!partials/buddycondensed.html'], function(angular, templ joined(x); } }); + sortCondensed(); $scope.$apply(); }); }]; diff --git a/static/partials/buddycondensed.html b/static/partials/buddycondensed.html index 326afa13..846c72e1 100644 --- a/static/partials/buddycondensed.html +++ b/static/partials/buddycondensed.html @@ -3,12 +3,32 @@ + {{listOverDefault().length - maxBuddiesToShow}} {{_("more")}}
- + + + + + {{buddy.Userid|displayName}} +
+ + +
+
+
- + + + + + {{buddy.Userid|displayName}} +
+ + +
+
+