diff options
Diffstat (limited to 'webclient/room')
| -rw-r--r-- | webclient/room/room-controller.js | 61 | ||||
| -rw-r--r-- | webclient/room/room.html | 36 |
2 files changed, 40 insertions, 57 deletions
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> |