diff --git a/webclient/app-filter.js b/webclient/app-filter.js
index 31d4ac4421..27f435674f 100644
--- a/webclient/app-filter.js
+++ b/webclient/app-filter.js
@@ -107,18 +107,18 @@ angular.module('matrixWebClient')
if (2 === Object.keys(room.members).length) {
for (var i in room.members) {
var member = room.members[i];
- if (member.user_id !== matrixService.config().user_id) {
+ if (member.state_key !== matrixService.config().user_id) {
- if (member.user_id in $rootScope.presence) {
+ if (member.state_key in $rootScope.presence) {
// If the user is available in presence, use the displayname there
// as it is the most uptodate
- roomName = $rootScope.presence[member.user_id].content.displayname;
+ roomName = $rootScope.presence[member.state_key].content.displayname;
}
else if (member.content.displayname) {
roomName = member.content.displayname;
}
else {
- roomName = member.user_id;
+ roomName = member.state_key;
}
}
}
@@ -145,7 +145,7 @@ angular.module('matrixWebClient')
roomName = $rootScope.presence[userID].content.displayname;
}
else {
- roomName = member.user_id;
+ roomName = userID;
}
}
}
diff --git a/webclient/components/matrix/event-handler-service.js b/webclient/components/matrix/event-handler-service.js
index a2fbad796d..ee478d2eb0 100644
--- a/webclient/components/matrix/event-handler-service.js
+++ b/webclient/components/matrix/event-handler-service.js
@@ -97,7 +97,7 @@ angular.module('eventHandlerService', [])
}
}
- $rootScope.events.rooms[event.room_id].members[event.user_id] = event;
+ $rootScope.events.rooms[event.room_id].members[event.state_key] = event;
$rootScope.$broadcast(MEMBER_EVENT, event, isLiveEvent);
};
diff --git a/webclient/room/room-controller.js b/webclient/room/room-controller.js
index 0ffbe8761f..52c57856ee 100644
--- a/webclient/room/room-controller.js
+++ b/webclient/room/room-controller.js
@@ -253,6 +253,29 @@ angular.module('RoomController', ['ngSanitize', 'mFileInput'])
var member = $scope.members[user_id];
if (member) {
member.powerLevel = matrixService.getUserPowerLevel($scope.room_id, user_id);
+
+ normaliseMembersPowerLevels();
+ }
+ }
+
+ // Normalise users power levels so that the user with the higher power level
+ // will have a bar covering 100% of the width of his avatar
+ var normaliseMembersPowerLevels = function() {
+ // Find the max power level
+ var maxPowerLevel = 0;
+ for (var i in $scope.members) {
+ var member = $scope.members[i];
+ if (member.powerLevel) {
+ maxPowerLevel = Math.max(maxPowerLevel, member.powerLevel);
+ }
+ }
+
+ // Normalized them on a 0..100% scale to be use in css width
+ if (maxPowerLevel) {
+ for (var i in $scope.members) {
+ var member = $scope.members[i];
+ member.powerLevelNorm = (member.powerLevel * 100) / maxPowerLevel;
+ }
}
}
diff --git a/webclient/room/room.html b/webclient/room/room.html
index 05e87387a5..e29f511ecf 100644
--- a/webclient/room/room.html
+++ b/webclient/room/room.html
@@ -24,7 +24,7 @@
title="{{ member.id }}"
width="80" height="80"/>
<img class="userAvatarGradient" src="img/gradient.png" title="{{ member.id }}" width="80" height="24"/>
- <div class="userPowerLevel" ng-style="{'width': (10 * member.powerLevel) +'%'}"></div>
+ <div class="userPowerLevel" ng-style="{'width': member.powerLevelNorm +'%'}"></div>
<div class="userName">{{ member.displayname || member.id.substr(0, member.id.indexOf(':')) }}<br/>{{ member.displayname ? "" : member.id.substr(member.id.indexOf(':')) }}</div>
</td>
<td class="userPresence" ng-class="(member.presence === 'online' ? 'online' : (member.presence === 'unavailable' ? 'unavailable' : '')) + ' ' + (member.membership == 'invite' ? 'invited' : '')">
|