diff --git a/webclient/room/room-controller.js b/webclient/room/room-controller.js
index 09dac85d26..c6028f874e 100644
--- a/webclient/room/room-controller.js
+++ b/webclient/room/room-controller.js
@@ -88,7 +88,7 @@ angular.module('RoomController', ['ngSanitize', 'mFileInput'])
call.onHangup = $scope.onCallHangup;
$scope.currentCall = call;
});
-
+
$scope.memberCount = function() {
return Object.keys($scope.members).length;
};
@@ -175,6 +175,8 @@ angular.module('RoomController', ['ngSanitize', 'mFileInput'])
// set target_user_id to keep things clear
var target_user_id = chunk.state_key;
+
+ var now = new Date().getTime();
var isNewMember = !(target_user_id in $scope.members);
if (isNewMember) {
@@ -185,44 +187,14 @@ angular.module('RoomController', ['ngSanitize', 'mFileInput'])
if ("mtime_age" in chunk.content) {
chunk.mtime_age = chunk.content.mtime_age;
}
- // Once the HS reliably returns the displaynames & avatar_urls for both
- // local and remote users, we should use this rather than the evalAsync block
- // below
if ("displayname" in chunk.content) {
chunk.displayname = chunk.content.displayname;
}
if ("avatar_url" in chunk.content) {
chunk.avatar_url = chunk.content.avatar_url;
}
- $scope.members[target_user_id] = chunk;
-
-/*
- // Stale code for explicitly hammering the homeserver for every displayname & avatar_url
-
- // get their display name and profile picture and set it to their
- // member entry in $scope.members. We HAVE to use $timeout with 0 delay
- // to make this function run AFTER the current digest cycle, else the
- // response may update a STALE VERSION of the member list (manifesting
- // as no member names appearing, or appearing sporadically).
- $scope.$evalAsync(function() {
- matrixService.getDisplayName(chunk.target_user_id).then(
- function(response) {
- var member = $scope.members[chunk.target_user_id];
- if (member !== undefined) {
- member.displayname = response.data.displayname;
- }
- }
- );
- matrixService.getProfilePictureUrl(chunk.target_user_id).then(
- function(response) {
- var member = $scope.members[chunk.target_user_id];
- if (member !== undefined) {
- member.avatar_url = response.data.avatar_url;
- }
- }
- );
- });
-*/
+ chunk.last_updated = now;
+ $scope.members[target_user_id] = chunk;
if (target_user_id in $rootScope.presence) {
updatePresence($rootScope.presence[target_user_id]);
@@ -234,6 +206,12 @@ angular.module('RoomController', ['ngSanitize', 'mFileInput'])
member.content.membership = chunk.content.membership;
}
};
+
+ var updateMemberListPresenceAge = function() {
+ $scope.now = new Date().getTime();
+ // TODO: don't bother polling every 5s if we know none of our counters are younger than 1 minute
+ $timeout(updateMemberListPresenceAge, 5 * 1000);
+ };
var updatePresence = function(chunk) {
if (!(chunk.content.user_id in $scope.members)) {
@@ -275,6 +253,10 @@ angular.module('RoomController', ['ngSanitize', 'mFileInput'])
if ($scope.textInput.indexOf("/me") === 0) {
promise = matrixService.sendEmoteMessage($scope.room_id, $scope.textInput.substr(4));
}
+ else if ($scope.textInput.indexOf("/nick ") === 0) {
+ // Change user display name
+ promise = matrixService.setDisplayName($scope.textInput.substr(6));
+ }
else {
promise = matrixService.sendTextMessage($scope.room_id, $scope.textInput);
}
@@ -395,8 +377,10 @@ angular.module('RoomController', ['ngSanitize', 'mFileInput'])
// Make recents highlight the current room
$scope.recentsSelectedRoomID = $scope.room_id;
-
+
paginate(MESSAGES_PER_PAGINATION);
+
+ updateMemberListPresenceAge();
};
$scope.inviteUser = function(user_id) {
@@ -404,18 +388,13 @@ angular.module('RoomController', ['ngSanitize', 'mFileInput'])
matrixService.invite($scope.room_id, user_id).then(
function() {
console.log("Invited.");
- $scope.feedback = "Request for invitation succeeds";
+ $scope.feedback = "Invite sent successfully";
},
function(reason) {
$scope.feedback = "Failure: " + reason;
});
};
- // Open the user profile page
- $scope.goToUserPage = function(user_id) {
- $location.url("/user/" + user_id);
- };
-
$scope.leaveRoom = function() {
matrixService.leave($scope.room_id).then(
@@ -487,7 +466,5 @@ angular.module('RoomController', ['ngSanitize', 'mFileInput'])
}
$scope.onCallHangup = function() {
- $scope.feedback = "Call ended";
- $scope.currentCall = undefined;
}
}]);
diff --git a/webclient/room/room.html b/webclient/room/room.html
index a3514c3a91..e5e454864b 100644
--- a/webclient/room/room.html
+++ b/webclient/room/room.html
@@ -1,13 +1,15 @@
-<div ng-controller="RoomController" data-ng-init="onInit()" class="room">
- <h1 id="roomLogo">[matrix]</h1>
+<div ng-controller="RoomController" data-ng-init="onInit()" class="room" style="height: 100%;">
- <div id="page">
- <div id="wrapper">
-
- <div id="roomName">
- {{ room_alias || room_id }}
+ <div id="roomHeader">
+ <a href ng-click="goToPage('/')"><img src="img/logo-small.png" width="100" height="43" alt="[matrix]"/></a>
+ <div id="roomName">
+ {{ room_alias || room_id }}
+ </div>
</div>
+ <div id="roomPage">
+ <div id="roomWrapper">
+
<div id="roomRecentsTableWrapper">
<div ng-include="'recents/recents.html'"></div>
</div>
@@ -15,17 +17,17 @@
<div id="usersTableWrapper">
<table id="usersTable">
<tr ng-repeat="member in members | orderMembersList">
- <td class="userAvatar mouse-pointer" ng-click="goToUserPage(member.id)">
+ <td class="userAvatar mouse-pointer" ng-click="$parent.goToUserPage(member.id)" ng-class="member.membership == 'invite' ? 'invited' : ''">
<img class="userAvatarImage"
- ng-src="{{member.avatar_url || 'img/default-profile.jpg'}}"
+ ng-src="{{member.avatar_url || 'img/default-profile.png'}}"
alt="{{ member.displayname || member.id.substr(0, member.id.indexOf(':')) }}"
title="{{ member.id }}"
width="80" height="80"/>
<img class="userAvatarGradient" src="img/gradient.png" title="{{ member.id }}" width="80" height="24"/>
<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.presenceState === 'online' ? 'online' : (member.presenceState === 'unavailable' ? 'unavailable' : '')">
- {{ member.mtime_age | duration }}<br/>{{ member.mtime_age ? "ago" : "" }}
+ <td class="userPresence" ng-class="(member.presenceState === 'online' ? 'online' : (member.presenceState === 'unavailable' ? 'unavailable' : '')) + ' ' + (member.membership == 'invite' ? 'invited' : '')">
+ <span ng-show="member.mtime_age">{{ member.mtime_age + (now - member.last_updated) | duration }}<br/>ago</span>
</td>
</table>
</div>
@@ -40,7 +42,7 @@
<div class="timestamp">{{ (msg.content.hsob_ts || msg.ts) | date:'MMM d HH:mm' }}</div>
</td>
<td class="avatar">
- <img class="avatarImage" ng-src="{{ members[msg.user_id].avatar_url || 'img/default-profile.jpg' }}" width="32" height="32"
+ <img class="avatarImage" ng-src="{{ members[msg.user_id].avatar_url || 'img/default-profile.png' }}" width="32" height="32"
ng-hide="events.rooms[room_id].messages[$index - 1].user_id === msg.user_id || msg.user_id === state.user_id"/>
</td>
<td ng-class="!msg.content.membership ? (msg.content.msgtype === 'm.emote' ? 'emote text' : 'text') : 'membership text'">
@@ -64,7 +66,7 @@
</div>
</td>
<td class="rightBlock">
- <img class="avatarImage" ng-src="{{ members[msg.user_id].avatar_url || 'img/default-profile.jpg' }}" width="32" height="32"
+ <img class="avatarImage" ng-src="{{ members[msg.user_id].avatar_url || 'img/default-profile.png' }}" width="32" height="32"
ng-hide="events.rooms[room_id].messages[$index - 1].user_id === msg.user_id || msg.user_id !== state.user_id"/>
</td>
</tr>
@@ -86,12 +88,12 @@
</td>
<td id="buttonsCell">
<button ng-click="send()">Send</button>
- <button m-file-input="imageFileToSend">Image</button>
+ <button m-file-input="imageFileToSend" class="extraControls">Image</button>
</td>
</tr>
</table>
- <div id="extraControls">
+ <div class="extraControls">
<span>
Invite a user:
<input ng-model="userIDToInvite" size="32" type="text" placeholder="User ID (ex:@user:homeserver)"/>
@@ -105,6 +107,10 @@
<button ng-click="hangupCall()">Reject</button>
</div>
<button ng-click="hangupCall()" ng-show="currentCall && currentCall.state != 'ringing'">Hang up</button>
+ <span ng-show="currentCall.state == 'invite_sent'">Calling...</span>
+ <span ng-show="currentCall.state == 'connecting'">Call Connecting...</span>
+ <span ng-show="currentCall.state == 'connected'">Call Connected</span>
+ <span ng-show="currentCall.state == 'ended'">Call Ended</span>
<span style="display: none; ">{{ currentCall.state }}</span>
</div>
|
