diff options
Diffstat (limited to 'webclient/room')
| -rw-r--r-- | webclient/room/room-controller.js | 109 | ||||
| -rw-r--r-- | webclient/room/room.html | 12 |
2 files changed, 111 insertions, 10 deletions
diff --git a/webclient/room/room-controller.js b/webclient/room/room-controller.js index 6e1d83a23d..de50058743 100644 --- a/webclient/room/room-controller.js +++ b/webclient/room/room-controller.js @@ -32,7 +32,8 @@ angular.module('RoomController', ['ngSanitize', 'matrixFilter', 'mFileInput']) can_paginate: false, // this is toggled off when we are not ready yet to paginate or when we run out of items paginating: false, // used to avoid concurrent pagination requests pulling in dup contents stream_failure: undefined, // the response when the stream fails - waiting_for_joined_event: false // true when the join request is pending. Back to false once the corresponding m.room.member event is received + waiting_for_joined_event: false, // true when the join request is pending. Back to false once the corresponding m.room.member event is received + messages_visibility: "hidden" // In order to avoid flickering when scrolling down the message table at the page opening, delay the message table display }; $scope.members = {}; $scope.autoCompleting = false; @@ -53,8 +54,13 @@ angular.module('RoomController', ['ngSanitize', 'matrixFilter', 'mFileInput']) return; }; - // Use the filter applied in html to set the input value - $scope.name.newNameText = $filter('mRoomName')($scope.room_id); + var nameEvent = $rootScope.events.rooms[$scope.room_id]['m.room.name']; + if (nameEvent) { + $scope.name.newNameText = nameEvent.content.name; + } + else { + $scope.name.newNameText = ""; + } // Force focus to the input $timeout(function() { @@ -131,6 +137,13 @@ angular.module('RoomController', ['ngSanitize', 'matrixFilter', 'mFileInput']) $timeout(function() { objDiv.scrollTop = objDiv.scrollHeight; + + // Show the message table once the first scrolldown is done + if ("visible" !== $scope.state.messages_visibility) { + $timeout(function() { + $scope.state.messages_visibility = "visible"; + }, 0); + } }, 0); } }; @@ -404,12 +417,15 @@ angular.module('RoomController', ['ngSanitize', 'matrixFilter', 'mFileInput']) }; $scope.send = function() { - if ($scope.textInput === "") { + if (undefined === $scope.textInput || $scope.textInput === "") { return; } scrollToBottom(true); - + + // Store the command in the history + history.push($scope.textInput); + var promise; var cmd; var args; @@ -735,7 +751,10 @@ angular.module('RoomController', ['ngSanitize', 'matrixFilter', 'mFileInput']) // Make recents highlight the current room $scope.recentsSelectedRoomID = $scope.room_id; - // Get the up-to-date the current member list + // Init the history for this room + history.init(); + + // Get the up-to-date the current member list matrixService.getMemberList($scope.room_id).then( function(response) { for (var i = 0; i < response.data.chunk.length; i++) { @@ -847,4 +866,82 @@ angular.module('RoomController', ['ngSanitize', 'matrixFilter', 'mFileInput']) $rootScope.currentCall = call; }; + // Manage history of typed messages + // History is saved in sessionStoratge so that it survives when the user + // navigates through the rooms and when it refreshes the page + var history = { + // The list of typed messages. Index 0 is the more recents + data: [], + + // The position in the history currently displayed + position: -1, + + // The message the user has started to type before going into the history + typingMessage: undefined, + + // Init/load data for the current room + init: function() { + var data = sessionStorage.getItem("history_" + $scope.room_id); + if (data) { + this.data = JSON.parse(data); + } + }, + + // Store a message in the history + push: function(message) { + this.data.unshift(message); + + // Update the session storage + sessionStorage.setItem("history_" + $scope.room_id, JSON.stringify(this.data)); + + // Reset history position + this.position = -1; + this.typingMessage = undefined; + }, + + // Move in the history + go: function(offset) { + + if (-1 === this.position) { + // User starts to go to into the history, save the current line + this.typingMessage = $scope.textInput; + } + else { + // If the user modified this line in history, keep the change + this.data[this.position] = $scope.textInput; + } + + // Bounds the new position to valid data + var newPosition = this.position + offset; + newPosition = Math.max(-1, newPosition); + newPosition = Math.min(newPosition, this.data.length - 1); + this.position = newPosition; + + if (-1 !== this.position) { + // Show the message from the history + $scope.textInput = this.data[this.position]; + } + else if (undefined !== this.typingMessage) { + // Go back to the message the user started to type + $scope.textInput = this.typingMessage; + } + } + }; + + // Make history singleton methods available from HTML + $scope.history = { + goUp: function($event) { + if ($scope.room_id) { + history.go(1); + } + $event.preventDefault(); + }, + goDown: function($event) { + if ($scope.room_id) { + history.go(-1); + } + $event.preventDefault(); + } + }; + }]); diff --git a/webclient/room/room.html b/webclient/room/room.html index 886c2afe64..44a0e34d9f 100644 --- a/webclient/room/room.html +++ b/webclient/room/room.html @@ -9,7 +9,7 @@ {{ room_id | mRoomName }} </div> <form ng-submit="name.updateName()" ng-show="name.isEditing" class="roomNameForm"> - <input ng-model="name.newNameText" ng-blur="name.cancelEdit()" class="roomNameInput" /> + <input ng-model="name.newNameText" ng-blur="name.cancelEdit()" class="roomNameInput" placeholder="Room name"/> </form> </div> @@ -23,7 +23,7 @@ {{ events.rooms[room_id]['m.room.topic'].content.topic | limitTo: 200}} </div> <form ng-submit="topic.updateTopic()" ng-show="topic.isEditing" class="roomTopicForm"> - <input ng-model="topic.newTopicText" ng-blur="topic.cancelEdit()" class="roomTopicInput" /> + <input ng-model="topic.newTopicText" ng-blur="topic.cancelEdit()" class="roomTopicInput" placeholder="Topic"/> </form> </div> </div> @@ -56,7 +56,10 @@ </table> </div> - <div id="messageTableWrapper" ng-hide="state.permission_denied" keep-scroll> + <div id="messageTableWrapper" + ng-hide="state.permission_denied" + ng-style="{ 'visibility': state.messages_visibility }" + keep-scroll> <!-- FIXME: need to have better timestamp semantics than the (msg.content.hsob_ts || msg.ts) hack below --> <table id="messageTable" infinite-scroll="paginateMore()"> <tr ng-repeat="msg in events.rooms[room_id].messages" @@ -156,7 +159,8 @@ <td width="*"> <textarea id="mainInput" rows="1" ng-model="textInput" ng-enter="send()" ng-disabled="state.permission_denied" - ng-focus="true" autocomplete="off" tab-complete/> + ng-keydown="(38 === $event.which) ? history.goUp($event) : ((40 === $event.which) ? history.goDown($event) : 0)" + ng-focus="true" autocomplete="off" tab-complete/> </td> <td id="buttonsCell"> <button ng-click="send()" ng-disabled="state.permission_denied">Send</button> |