diff options
-rw-r--r-- | webclient/app.css | 45 | ||||
-rw-r--r-- | webclient/home/home-controller.js | 4 | ||||
-rw-r--r-- | webclient/home/home.html | 61 |
3 files changed, 102 insertions, 8 deletions
diff --git a/webclient/app.css b/webclient/app.css index dfa17fae62..bc23f76f00 100644 --- a/webclient/app.css +++ b/webclient/app.css @@ -342,6 +342,51 @@ h1 { top: 0; } +/*** Recents ***/ +.recentsTable { + max-width: 480px; + width: 100%; + border-collapse: collapse; + table-layout: fixed; +} + +.recentsTable tr { + width: 100%; +} +.recentsTable td { + vertical-align: text-top; + overflow: hidden; + white-space: nowrap; + text-overflow: ellipsis; +} + +.recentsRoom { + cursor: pointer; +} + +.recentsRoom:hover { + background-color: #f8f8ff; +} + +.recentsRoomName { + font-size: 16px; + padding-top: 7px; + width: auto; +} + +.recentsRoomSummaryTS { + color: #888; + font-size: 12px; + width: 7em; + text-align: right; +} + +.recentsRoomSummary { + color: #888; + font-size: 12px; + padding-bottom: 5px; +} + /*** Profile ***/ .profile-avatar { diff --git a/webclient/home/home-controller.js b/webclient/home/home-controller.js index 3be7fca909..f0c2ccea2f 100644 --- a/webclient/home/home-controller.js +++ b/webclient/home/home-controller.js @@ -86,7 +86,9 @@ angular.module('HomeController', ['matrixService', 'mFileInput', 'mFileUpload', $scope.rooms[data[i].room_id] = data[i]; // Create a shortcut for the last message of this room - $scope.rooms[data[i].room_id].lastMsg = data[i].messages.chunk[0]; + if (data[i].messages && data[i].messages.chunk && data[i].messages.chunk[0]) { + $scope.rooms[data[i].room_id].lastMsg = data[i].messages.chunk[0]; + } } var presence = response.data.presence; diff --git a/webclient/home/home.html b/webclient/home/home.html index 4084f4c388..49eb56a602 100644 --- a/webclient/home/home.html +++ b/webclient/home/home.html @@ -23,13 +23,60 @@ </form> </div> - <h3>My rooms</h3> - - <div class="rooms" ng-repeat="(rm_id, room) in rooms"> - <div> - <a href="#/room/{{ room.room_alias ? room.room_alias : rm_id }}" >{{ room.room_display_name }}</a> {{room.membership === 'invite' ? ' (invited)' : ''}} - </div> - </div> + <h3>Recents</h3> + + <div class="recentsTableWrapper"> + <table class="recentsTable"> + <tbody ng-repeat="(rm_id, room) in rooms" ng-click="goToPage('room/' + (room.room_alias ? room.room_alias : rm_id) )" class ="recentsRoom" > + <tr> + <td class="recentsRoomName"> + {{ room.room_display_name }} + </td> + <td class="recentsRoomSummaryTS"> + {{ (room.lastMsg.ts) | date:'MMM d HH:mm' }} + </td> + </tr> + + <tr> + <td colspan="2" class="recentsRoomSummary"> + + <div ng-show="room.membership === 'invite'" > + {{ room.inviter }} invited you + </div> + + <div ng-hide="room.membership === 'invite'" ng-switch="room.lastMsg.type" > + <div ng-switch-when="m.room.member"> + {{ room.lastMsg.user_id }} + {{ {"join": "joined", "leave": "left", "invite": "invited"}[room.lastMsg.content.membership] }} + {{ room.lastMsg.content.membership === "invite" ? (room.lastMsg.state_key || '') : '' }} + </div> + + <div ng-switch-when="m.room.message"> + <div ng-switch="room.lastMsg.content.msgtype"> + <div ng-switch-when="m.text"> + {{ room.lastMsg.user_id }} : + <span ng-bind-html="(room.lastMsg.content.body) | linky:'_blank'"> + </span> + </div> + + <div ng-switch-when="m.image"> + {{ room.lastMsg.user_id }} sent an image + </div> + + <div ng-switch-default> + {{ room.lastMsg.content }} + </div> + </div> + </div> + + <div ng-switch-default> + {{ room.lastMsg }} + </div> + </div> + </td> + </tr> + </tbody> + </table> <br/> <h3>Public rooms</h3> |