From aac52fce15a592ac0715f72864f144600e4c15a1 Mon Sep 17 00:00:00 2001 From: Emmanuel ROHEE Date: Thu, 21 Aug 2014 14:30:41 +0200 Subject: Generate thumbnail client side and send its URL and info with the image message body --- webclient/room/room-controller.js | 34 ++++++++++++---------------------- 1 file changed, 12 insertions(+), 22 deletions(-) (limited to 'webclient/room') diff --git a/webclient/room/room-controller.js b/webclient/room/room-controller.js index 35abeeca06..7de50dd960 100644 --- a/webclient/room/room-controller.js +++ b/webclient/room/room-controller.js @@ -19,6 +19,7 @@ angular.module('RoomController', ['ngSanitize', 'mUtilities']) function($scope, $http, $timeout, $routeParams, $location, matrixService, eventStreamService, eventHandlerService, mFileUpload, mUtilities) { 'use strict'; var MESSAGES_PER_PAGINATION = 30; + var THUMBNAIL_SIZE = 320; // Room ids. Computed and resolved in onInit $scope.room_id = undefined; @@ -386,33 +387,22 @@ angular.module('RoomController', ['ngSanitize', 'mUtilities']) $scope.state.sending = true; - // First, get the image sise - mUtilities.getImageSize($scope.imageFileToSend).then( - function(size) { - - // Upload the image to the Internet - console.log("Uploading image..."); - mFileUpload.uploadFile($scope.imageFileToSend).then( - function(url) { - // Build the image info data - var imageInfo = { - size: $scope.imageFileToSend.size, - mimetype: $scope.imageFileToSend.type, - w: size.width, - h: size.height - }; - - // Then share the URL and the metadata - $scope.sendImage(url, imageInfo); + // Upload this image with its thumbnail to Internet + mFileUpload.uploadImageAndThumbnail($scope.imageFileToSend, THUMBNAIL_SIZE).then( + function(imageMessage) { + // imageMessage is complete message structure, send it as is + matrixService.sendMessage($scope.room_id, undefined, imageMessage).then( + function() { + console.log("Image message sent"); + $scope.state.sending = false; }, function(error) { - $scope.feedback = "Can't upload image"; + $scope.feedback = "Failed to send image message: " + error.data.error; $scope.state.sending = false; - } - ); + }); }, function(error) { - $scope.feedback = "Can't get selected image size"; + $scope.feedback = "Can't upload image"; $scope.state.sending = false; } ); -- cgit 1.4.1 From e4f0e1af1aa075e6d86921d46e824d85855c1def Mon Sep 17 00:00:00 2001 From: Emmanuel ROHEE Date: Thu, 21 Aug 2014 14:58:26 +0200 Subject: If there are available, show image thumbnails in the messages list --- webclient/room/room.html | 10 +++++++--- 1 file changed, 7 insertions(+), 3 deletions(-) (limited to 'webclient/room') diff --git a/webclient/room/room.html b/webclient/room/room.html index db6add4ee7..5dcc8caa1e 100644 --- a/webclient/room/room.html +++ b/webclient/room/room.html @@ -41,9 +41,13 @@
-
- +
+
+ +
+
+ +
-- cgit 1.4.1 From bb4490c2d78d4e0dcae01853513e0308776055a5 Mon Sep 17 00:00:00 2001 From: Emmanuel ROHEE Date: Thu, 21 Aug 2014 16:09:42 +0200 Subject: Show image fullscreen when clicking on the thumbnail --- webclient/app.css | 25 ++++++++++++++++++++++++- webclient/room/room.html | 9 +++++++-- 2 files changed, 31 insertions(+), 3 deletions(-) (limited to 'webclient/room') diff --git a/webclient/app.css b/webclient/app.css index 869db69cd6..d2b951d3b6 100644 --- a/webclient/app.css +++ b/webclient/app.css @@ -66,6 +66,10 @@ h1 { background-color: #faa; } +.mouse-pointer { + cursor: pointer; +} + /*** Participant list ***/ #usersTableWrapper { @@ -89,7 +93,6 @@ h1 { height: 100px; position: relative; background-color: #000; - cursor: pointer; } .userAvatar .userAvatarImage { @@ -245,6 +248,26 @@ h1 { text-align: left ! important; } +#room-fullscreen-image { + position: absolute; + top: 0px; + height: 0px; + width: 100%; + height: 100%; +} + +#room-fullscreen-image img { + max-width: 100%; + max-height: 100%; + bottom: 0; + left: 0; + margin: auto; + overflow: auto; + position: fixed; + right: 0; + top: 0; +} + /*** Profile ***/ .profile-avatar { diff --git a/webclient/room/room.html b/webclient/room/room.html index 5dcc8caa1e..cb9cf1d1f3 100644 --- a/webclient/room/room.html +++ b/webclient/room/room.html @@ -10,7 +10,7 @@
-
+ {{ member.displayname || member.id.substr(0, member.id.indexOf(':')) }}
- +
@@ -96,4 +97,8 @@ +
+ +
+ -- cgit 1.4.1 From 14b99896604c8860ebb2a6ed607fae40fe04494b Mon Sep 17 00:00:00 2001 From: Emmanuel ROHEE Date: Thu, 21 Aug 2014 16:27:15 +0200 Subject: Fixed first pagination detection --- webclient/room/room-controller.js | 5 +++-- 1 file changed, 3 insertions(+), 2 deletions(-) (limited to 'webclient/room') diff --git a/webclient/room/room-controller.js b/webclient/room/room-controller.js index 35abeeca06..6d714151f1 100644 --- a/webclient/room/room-controller.js +++ b/webclient/room/room-controller.js @@ -28,6 +28,7 @@ angular.module('RoomController', ['ngSanitize', 'mUtilities']) user_id: matrixService.config().user_id, events_from: "END", // when to start the event stream from. earliest_token: "END", // stores how far back we've paginated. + first_pagination: true, // this is toggled off when the first pagination is done can_paginate: true, // this is toggled off 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 @@ -99,7 +100,6 @@ angular.module('RoomController', ['ngSanitize', 'mUtilities']) var originalTopRow = $("#messageTable>tbody>tr:first")[0]; matrixService.paginateBackMessages($scope.room_id, $scope.state.earliest_token, numItems).then( function(response) { - var firstPagination = !$scope.events.rooms[$scope.room_id]; eventHandlerService.handleEvents(response.data.chunk, false); $scope.state.earliest_token = response.data.end; if (response.data.chunk.length < MESSAGES_PER_PAGINATION) { @@ -125,8 +125,9 @@ angular.module('RoomController', ['ngSanitize', 'mUtilities']) }, 0); } - if (firstPagination) { + if ($scope.state.first_pagination) { scrollToBottom(); + $scope.state.first_pagination = false; } else { // lock the scroll position -- cgit 1.4.1 From ad869fa4b30d660bb3307e8bdab26c36c52a7221 Mon Sep 17 00:00:00 2001 From: Matthew Hodgson Date: Thu, 21 Aug 2014 15:43:47 +0100 Subject: stop hammering the HS for displayname and avatar URLs --- webclient/room/room-controller.js | 8 +++++--- 1 file changed, 5 insertions(+), 3 deletions(-) (limited to 'webclient/room') diff --git a/webclient/room/room-controller.js b/webclient/room/room-controller.js index 8dea64a804..eee805dafb 100644 --- a/webclient/room/room-controller.js +++ b/webclient/room/room-controller.js @@ -160,8 +160,7 @@ angular.module('RoomController', ['ngSanitize', 'mUtilities']) if ("mtime_age" in chunk.content) { chunk.mtime_age = chunk.content.mtime_age; } -/* - // FIXME: once the HS reliably returns the displaynames & avatar_urls for both + // 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) { @@ -170,9 +169,11 @@ angular.module('RoomController', ['ngSanitize', 'mUtilities']) if ("avatar_url" in chunk.content) { chunk.avatar_url = chunk.content.avatar_url; } - */ $scope.members[chunk.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 @@ -196,6 +197,7 @@ angular.module('RoomController', ['ngSanitize', 'mUtilities']) } ); }); +*/ } else { // selectively update membership else it will nuke the picture and displayname too :/ -- cgit 1.4.1 From 2e1ab9db08e3fe41822a65fdf38feafbd22173b6 Mon Sep 17 00:00:00 2001 From: Erik Johnston Date: Thu, 21 Aug 2014 17:55:41 +0100 Subject: Only start event streaming after having set up the controllers. --- demo/start.sh | 3 ++- webclient/app-controller.js | 2 +- webclient/app.js | 2 +- webclient/components/matrix/event-stream-service.js | 10 ++++++++++ webclient/room/room-controller.js | 1 + webclient/rooms/rooms-controller.js | 6 ++++-- 6 files changed, 19 insertions(+), 5 deletions(-) (limited to 'webclient/room') diff --git a/demo/start.sh b/demo/start.sh index 4701872926..fa2998a5e9 100755 --- a/demo/start.sh +++ b/demo/start.sh @@ -15,7 +15,8 @@ for port in "8080" "8081" "8082"; do -f "$DIR/$port.log" \ -d "$DIR/$port.db" \ -vv \ - -D --pid-file "$DIR/$port.pid" + -D --pid-file "$DIR/$port.pid"\ + -w done echo "Starting webclient on port 8000..." diff --git a/webclient/app-controller.js b/webclient/app-controller.js index 96656e12c3..c53f29aa77 100644 --- a/webclient/app-controller.js +++ b/webclient/app-controller.js @@ -53,7 +53,7 @@ angular.module('MatrixWebClientController', ['matrixService']) }; if (matrixService.isUserLoggedIn()) { - eventStreamService.resume(); + // eventStreamService.resume(); } // Logs the user out diff --git a/webclient/app.js b/webclient/app.js index f27ebedc6f..944b8ec270 100644 --- a/webclient/app.js +++ b/webclient/app.js @@ -80,6 +80,6 @@ matrixWebClient.run(['$location', 'matrixService', 'eventStreamService', functio $location.path("login"); } else { - eventStreamService.resume(); + // eventStreamService.resume(); } }]); diff --git a/webclient/components/matrix/event-stream-service.js b/webclient/components/matrix/event-stream-service.js index 9a8f6eac4c..a1a98b2a36 100644 --- a/webclient/components/matrix/event-stream-service.js +++ b/webclient/components/matrix/event-stream-service.js @@ -106,6 +106,16 @@ angular.module('eventStreamService', []) // FIXME: We are discarding all the messages. matrixService.rooms().then( function(response) { + var rooms = response.data.rooms; + for (var i = 0; i < rooms.length; ++i) { + var room = rooms[i]; + if ("state" in room) { + for (var j = 0; j < room.state.length; ++j) { + eventHandlerService.handleEvents(room.state[j], false); + } + } + } + var presence = response.data.presence; for (var i = 0; i < presence.length; ++i) { eventHandlerService.handleEvent(presence[i], false); diff --git a/webclient/room/room-controller.js b/webclient/room/room-controller.js index eee805dafb..214166a434 100644 --- a/webclient/room/room-controller.js +++ b/webclient/room/room-controller.js @@ -328,6 +328,7 @@ angular.module('RoomController', ['ngSanitize', 'mUtilities']) var chunk = response.data.chunk[i]; updateMemberList(chunk); } + eventStreamService.resume(); }, function(error) { $scope.feedback = "Failed get member list: " + error.data.error; diff --git a/webclient/rooms/rooms-controller.js b/webclient/rooms/rooms-controller.js index 6bbb2b2ba1..c2d7bcb6f3 100644 --- a/webclient/rooms/rooms-controller.js +++ b/webclient/rooms/rooms-controller.js @@ -17,8 +17,8 @@ limitations under the License. 'use strict'; angular.module('RoomsController', ['matrixService', 'mFileInput', 'mFileUpload', 'eventHandlerService']) -.controller('RoomsController', ['$scope', '$location', 'matrixService', 'mFileUpload', 'eventHandlerService', - function($scope, $location, matrixService, mFileUpload, eventHandlerService) { +.controller('RoomsController', ['$scope', '$location', 'matrixService', 'mFileUpload', 'eventHandlerService', 'eventStreamService', + function($scope, $location, matrixService, mFileUpload, eventHandlerService, eventStreamService) { $scope.rooms = {}; $scope.public_rooms = []; @@ -113,6 +113,8 @@ angular.module('RoomsController', ['matrixService', 'mFileInput', 'mFileUpload', $scope.public_rooms = assignRoomAliases(response.data.chunk); } ); + + eventStreamService.resume(); }; $scope.createNewRoom = function(room_id, isPrivate) { -- cgit 1.4.1 From 3277a650529d4ecaf816987e6cbcb87fdf3371da Mon Sep 17 00:00:00 2001 From: Matthew Hodgson Date: Thu, 21 Aug 2014 19:02:00 +0100 Subject: actually display room metadata based on m.room.membe events --- webclient/app.css | 4 ++++ webclient/components/matrix/event-handler-service.js | 11 +++++++++++ webclient/room/room.html | 10 ++++++++-- 3 files changed, 23 insertions(+), 2 deletions(-) (limited to 'webclient/room') diff --git a/webclient/app.css b/webclient/app.css index 83b0c9c65a..a63b5db4d6 100644 --- a/webclient/app.css +++ b/webclient/app.css @@ -245,6 +245,10 @@ h1 { background-color: #fff ! important; } +.mine .membership { + background-color: #fff ! important; +} + .mine .text .bubble { text-align: left ! important; } diff --git a/webclient/components/matrix/event-handler-service.js b/webclient/components/matrix/event-handler-service.js index b8529895fe..6a01b3fb55 100644 --- a/webclient/components/matrix/event-handler-service.js +++ b/webclient/components/matrix/event-handler-service.js @@ -69,6 +69,17 @@ angular.module('eventHandlerService', []) var handleRoomMember = function(event, isLiveEvent) { initRoom(event.room_id); + + // add membership changes as if they were a room message if something interesting changed + if (event.content.prev !== event.content.membership) { + if (isLiveEvent) { + $rootScope.events.rooms[event.room_id].messages.push(event); + } + else { + $rootScope.events.rooms[event.room_id].messages.unshift(event); + } + } + $rootScope.events.rooms[event.room_id].members[event.user_id] = event; $rootScope.$broadcast(MEMBER_EVENT, event, isLiveEvent); }; diff --git a/webclient/room/room.html b/webclient/room/room.html index cb9cf1d1f3..4a07dfdaaf 100644 --- a/webclient/room/room.html +++ b/webclient/room/room.html @@ -26,19 +26,25 @@
+ -
{{ members[msg.user_id].displayname || msg.user_id }}
-
{{ msg.content.hsob_ts | date:'MMM d HH:mm:ss' }}
+
{{ (msg.content.hsob_ts || msg.ts) | date:'MMM d HH:mm:ss' }}
 +
+ + {{ members[msg.user_id].displayname || msg.user_id }} + {{ {"join": "joined", "leave": "left", "invite": "invited"}[msg.content.membership] }} + {{ msg.content.target_id || '' }} +
-- cgit 1.4.1 From ab27b49deddbd6f74bad126b9a275b015a7fb6cd Mon Sep 17 00:00:00 2001 From: Matthew Hodgson Date: Fri, 22 Aug 2014 01:33:05 +0100 Subject: rename autoComplete directive as tabComplete to avoid confusion with the autocomplete html attribute --- webclient/room/room-directive.js | 30 +++++++++++++++--------------- 1 file changed, 15 insertions(+), 15 deletions(-) (limited to 'webclient/room') diff --git a/webclient/room/room-directive.js b/webclient/room/room-directive.js index 94655336df..1a99a37abb 100644 --- a/webclient/room/room-directive.js +++ b/webclient/room/room-directive.js @@ -17,30 +17,30 @@ 'use strict'; angular.module('RoomController') -.directive('autoComplete', ['$timeout', function ($timeout) { +.directive('tabComplete', ['$timeout', function ($timeout) { return function (scope, element, attrs) { element.bind("keydown keypress", function (event) { // console.log("event: " + event.which); if (event.which === 9) { - if (!scope.autoCompleting) { // cache our starting text + if (!scope.tabCompleting) { // cache our starting text // console.log("caching " + element[0].value); - scope.autoCompleteOriginal = element[0].value; - scope.autoCompleting = true; + scope.tabCompleteOriginal = element[0].value; + scope.tabCompleting = true; } if (event.shiftKey) { - scope.autoCompleteIndex--; - if (scope.autoCompleteIndex < 0) { - scope.autoCompleteIndex = 0; + scope.tabCompleteIndex--; + if (scope.tabCompleteIndex < 0) { + scope.tabCompleteIndex = 0; } } else { - scope.autoCompleteIndex++; + scope.tabCompleteIndex++; } var searchIndex = 0; - var targetIndex = scope.autoCompleteIndex; - var text = scope.autoCompleteOriginal; + var targetIndex = scope.tabCompleteIndex; + var text = scope.tabCompleteOriginal; // console.log("targetIndex: " + targetIndex + ", text=" + text); @@ -90,17 +90,17 @@ angular.module('RoomController') element[0].className = ""; }, 150); element[0].value = text; - scope.autoCompleteIndex = 0; + scope.tabCompleteIndex = 0; } } else { - scope.autoCompleteIndex = 0; + scope.tabCompleteIndex = 0; } event.preventDefault(); } - else if (event.which !== 16 && scope.autoCompleting) { - scope.autoCompleting = false; - scope.autoCompleteIndex = 0; + else if (event.which !== 16 && scope.tabCompleting) { + scope.tabCompleting = false; + scope.tabCompleteIndex = 0; } }); }; -- cgit 1.4.1 From fd47f55e943dc6950a1a84414e0ed8a08fbc504c Mon Sep 17 00:00:00 2001 From: Matthew Hodgson Date: Fri, 22 Aug 2014 01:33:34 +0100 Subject: sacrifice a goat or two to make wordwrap actually work properly --- webclient/app.css | 45 +++++++++++++++++++-------------------------- webclient/room/room.html | 4 ++-- 2 files changed, 21 insertions(+), 28 deletions(-) (limited to 'webclient/room') diff --git a/webclient/app.css b/webclient/app.css index a63b5db4d6..dfc919e4c0 100644 --- a/webclient/app.css +++ b/webclient/app.css @@ -145,6 +145,7 @@ h1 { max-width: 1280px; width: 100%; border-collapse: collapse; + table-layout: fixed; } #messageTable td { @@ -190,25 +191,13 @@ h1 { object-fit: cover; } -.text { - background-color: #eee; - border: 1px solid #d8d8d8; - height: 31px; - display: inline-table; - margin-top: -1px; - max-width: 90%; - font-size: 16px; - /* word-wrap: break-word; */ - word-break: break-all; -} - .emote { - background-color: #fff ! important; + background-color: transparent ! important; border: 0px ! important; } .membership { - background-color: #fff ! important; + background-color: transparent ! important; border: 0px ! important; } @@ -221,6 +210,13 @@ h1 { } .bubble { + background-color: #eee; + border: 1px solid #d8d8d8; + display: inline-block; + margin-bottom: -1px; + max-width: 90%; + font-size: 16px; + word-wrap: break-word; padding-top: 7px; padding-bottom: 5px; padding-left: 1em; @@ -229,27 +225,24 @@ h1 { } .differentUser td { - padding-top: 5px ! important; - margin-top: 5px ! important; + padding-bottom: 5px ! important; } .mine { text-align: right; } -.mine .text { - background-color: #f8f8ff ! important; -} - -.mine .emote { - background-color: #fff ! important; -} - -.mine .membership { - background-color: #fff ! important; +.text.emote .bubble, +.text.membership .bubble, +.mine .text.emote .bubble, +.mine .text.membership .bubble + { + background-color: transparent ! important; + border: 0px ! important; } .mine .text .bubble { + background-color: #f8f8ff ! important; text-align: left ! important; } diff --git a/webclient/room/room.html b/webclient/room/room.html index 4a07dfdaaf..e7560a5dc4 100644 --- a/webclient/room/room.html +++ b/webclient/room/room.html @@ -29,7 +29,7 @@ + ng-class="(events.rooms[room_id].messages[$index + 1].user_id !== msg.user_id ? 'differentUser' : '') + (msg.user_id === state.user_id ? ' mine' : '')" scroll-item>
{{ members[msg.user_id].displayname || msg.user_id }}
{{ (msg.content.hsob_ts || msg.ts) | date:'MMM d HH:mm:ss' }}
@@ -77,7 +77,7 @@ {{ state.user_id }} 		- + -- cgit 1.4.1 From 3248aed03b03e0eba3a4b43776ef2f7685b27701 Mon Sep 17 00:00:00 2001 From: Matthew Hodgson Date: Fri, 22 Aug 2014 01:54:37 +0100 Subject: fix mainInput retaining focus between sending consecutive messages by disabling commit 955662d6 --- webclient/room/room-controller.js | 4 ++-- webclient/room/room.html | 4 ++-- 2 files changed, 4 insertions(+), 4 deletions(-) (limited to 'webclient/room') diff --git a/webclient/room/room-controller.js b/webclient/room/room-controller.js index 214166a434..451c6242f6 100644 --- a/webclient/room/room-controller.js +++ b/webclient/room/room-controller.js @@ -33,6 +33,7 @@ angular.module('RoomController', ['ngSanitize', 'mUtilities']) can_paginate: true, // this is toggled off 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 + // FIXME: sending has been disabled, as surely messages should be sent in the background rather than locking the UI synchronously --Matthew sending: false // true when a message is being sent. It helps to disable the UI when a process is running }; $scope.members = {}; @@ -239,7 +240,7 @@ angular.module('RoomController', ['ngSanitize', 'mUtilities']) } $scope.state.sending = true; - + // Send the text message var promise; // FIXME: handle other commands too @@ -263,7 +264,6 @@ angular.module('RoomController', ['ngSanitize', 'mUtilities']) }; $scope.onInit = function() { - // $timeout(function() { document.getElementById('textInput').focus() }, 0); console.log("onInit"); // Does the room ID provided in the URL? diff --git a/webclient/room/room.html b/webclient/room/room.html index e7560a5dc4..95da067714 100644 --- a/webclient/room/room.html +++ b/webclient/room/room.html @@ -77,10 +77,10 @@ {{ state.user_id }} - + - + -- cgit 1.4.1 From dde50d4245136cdbd11ac3b4af42102945cd14f9 Mon Sep 17 00:00:00 2001 From: Emmanuel ROHEE Date: Fri, 22 Aug 2014 11:43:54 +0200 Subject: Use $location.url instead of $location.path to get clean page URL without hash arguments of the previous page. This happpens with room URL like http://127.0.0.1:8080/matrix/client/#/room/#public:localhost. The second hash part is transferred to the next page when using $location.path. --- webclient/app-controller.js | 2 +- webclient/login/login-controller.js | 4 ++-- webclient/room/room-controller.js | 6 +++--- webclient/rooms/rooms-controller.js | 8 ++++---- 4 files changed, 10 insertions(+), 10 deletions(-) (limited to 'webclient/room') diff --git a/webclient/app-controller.js b/webclient/app-controller.js index c53f29aa77..92ad01e4f9 100644 --- a/webclient/app-controller.js +++ b/webclient/app-controller.js @@ -66,7 +66,7 @@ angular.module('MatrixWebClientController', ['matrixService']) matrixService.saveConfig(); // And go to the login page - $location.path("login"); + $location.url("login"); }; // Listen to the event indicating that the access token is no longer valid. diff --git a/webclient/login/login-controller.js b/webclient/login/login-controller.js index 67d0b7b90c..2f1f224a94 100644 --- a/webclient/login/login-controller.js +++ b/webclient/login/login-controller.js @@ -53,7 +53,7 @@ angular.module('LoginController', ['matrixService']) matrixService.saveConfig(); eventStreamService.resume(); // Go to the user's rooms list page - $location.path("rooms"); + $location.url("rooms"); }, function(error) { if (error.data) { @@ -84,7 +84,7 @@ angular.module('LoginController', ['matrixService']) }); matrixService.saveConfig(); eventStreamService.resume(); - $location.path("rooms"); + $location.url("rooms"); } else { $scope.feedback = "Failed to login: " + JSON.stringify(response.data); diff --git a/webclient/room/room-controller.js b/webclient/room/room-controller.js index 451c6242f6..26d1836fc2 100644 --- a/webclient/room/room-controller.js +++ b/webclient/room/room-controller.js @@ -293,7 +293,7 @@ angular.module('RoomController', ['ngSanitize', 'mUtilities']) else { // In case of issue, go to the default page console.log("Error: cannot extract room alias"); - $location.path("/"); + $location.url("/"); return; } } @@ -310,7 +310,7 @@ angular.module('RoomController', ['ngSanitize', 'mUtilities']) function () { // In case of issue, go to the default page console.log("Error: cannot resolve room alias"); - $location.path("/"); + $location.url("/"); }); } }; @@ -364,7 +364,7 @@ angular.module('RoomController', ['ngSanitize', 'mUtilities']) matrixService.leave($scope.room_id).then( function(response) { console.log("Left room "); - $location.path("rooms"); + $location.url("rooms"); }, function(error) { $scope.feedback = "Failed to leave room: " + error.data.error; diff --git a/webclient/rooms/rooms-controller.js b/webclient/rooms/rooms-controller.js index c2d7bcb6f3..557fbe2378 100644 --- a/webclient/rooms/rooms-controller.js +++ b/webclient/rooms/rooms-controller.js @@ -141,17 +141,17 @@ angular.module('RoomsController', ['matrixService', 'mFileInput', 'mFileUpload', // Go to a room $scope.goToRoom = function(room_id) { // Simply open the room page on this room id - //$location.path("room/" + room_id); + //$location.url("room/" + room_id); matrixService.join(room_id).then( function(response) { if (response.data.hasOwnProperty("room_id")) { if (response.data.room_id != room_id) { - $location.path("room/" + response.data.room_id); + $location.url("room/" + response.data.room_id); return; } } - $location.path("room/" + room_id); + $location.url("room/" + room_id); }, function(error) { $scope.feedback = "Can't join room: " + error.data; @@ -163,7 +163,7 @@ angular.module('RoomsController', ['matrixService', 'mFileInput', 'mFileUpload', matrixService.joinAlias(room_alias).then( function(response) { // Go to this room - $location.path("room/" + room_alias); + $location.url("room/" + room_alias); }, function(error) { $scope.feedback = "Can't join room: " + error.data; -- cgit 1.4.1 From 74c90f78159e8067b25bfa8a009d2e68419947c8 Mon Sep 17 00:00:00 2001 From: Erik Johnston Date: Fri, 22 Aug 2014 10:50:10 +0100 Subject: Reinitialize room when creating a RoomController so that we start off with a clean slate, as it expects/ --- webclient/components/matrix/event-handler-service.js | 12 +++++++++++- webclient/room/room-controller.js | 2 ++ 2 files changed, 13 insertions(+), 1 deletion(-) (limited to 'webclient/room') diff --git a/webclient/components/matrix/event-handler-service.js b/webclient/components/matrix/event-handler-service.js index 6a01b3fb55..aa8867425e 100644 --- a/webclient/components/matrix/event-handler-service.js +++ b/webclient/components/matrix/event-handler-service.js @@ -44,6 +44,12 @@ angular.module('eventHandlerService', []) $rootScope.events.rooms[room_id].members = {}; } } + + var reInitRoom = function(room_id) { + $rootScope.events.rooms[room_id] = {}; + $rootScope.events.rooms[room_id].messages = []; + $rootScope.events.rooms[room_id].members = {}; + } var handleMessage = function(event, isLiveEvent) { if ("membership_target" in event.content) { @@ -118,6 +124,10 @@ angular.module('eventHandlerService', []) for (var i=0; i Date: Fri, 22 Aug 2014 10:50:38 +0100 Subject: Keep track of people's presence and query that when we update the members list. --- webclient/components/matrix/event-handler-service.js | 3 +++ webclient/room/room-controller.js | 10 +++++++--- 2 files changed, 10 insertions(+), 3 deletions(-) (limited to 'webclient/room') diff --git a/webclient/components/matrix/event-handler-service.js b/webclient/components/matrix/event-handler-service.js index aa8867425e..b5eb73d92b 100644 --- a/webclient/components/matrix/event-handler-service.js +++ b/webclient/components/matrix/event-handler-service.js @@ -35,6 +35,8 @@ angular.module('eventHandlerService', []) $rootScope.events = { rooms: {}, // will contain roomId: { messages:[], members:{userid1: event} } }; + + $rootScope.presence = {}; var initRoom = function(room_id) { if (!(room_id in $rootScope.events.rooms)) { @@ -91,6 +93,7 @@ angular.module('eventHandlerService', []) }; var handlePresence = function(event, isLiveEvent) { + $rootScope.presence[event.content.user_id] = event; $rootScope.$broadcast(PRESENCE_EVENT, event, isLiveEvent); }; diff --git a/webclient/room/room-controller.js b/webclient/room/room-controller.js index a0485e84e8..e204a27e04 100644 --- a/webclient/room/room-controller.js +++ b/webclient/room/room-controller.js @@ -15,8 +15,8 @@ limitations under the License. */ angular.module('RoomController', ['ngSanitize', 'mUtilities']) -.controller('RoomController', ['$scope', '$http', '$timeout', '$routeParams', '$location', 'matrixService', 'eventStreamService', 'eventHandlerService', 'mFileUpload', 'mUtilities', - function($scope, $http, $timeout, $routeParams, $location, matrixService, eventStreamService, eventHandlerService, mFileUpload, mUtilities) { +.controller('RoomController', ['$scope', '$http', '$timeout', '$routeParams', '$location', 'matrixService', 'eventStreamService', 'eventHandlerService', 'mFileUpload', 'mUtilities', '$rootScope', + function($scope, $http, $timeout, $routeParams, $location, matrixService, eventStreamService, eventHandlerService, mFileUpload, mUtilities, $rootScope) { 'use strict'; var MESSAGES_PER_PAGINATION = 30; var THUMBNAIL_SIZE = 320; @@ -199,6 +199,10 @@ angular.module('RoomController', ['ngSanitize', 'mUtilities']) ); }); */ + + if (chunk.target_user_id in $rootScope.presence) { + updatePresence($rootScope.presence[chunk.target_user_id]); + } } else { // selectively update membership else it will nuke the picture and displayname too :/ @@ -265,7 +269,7 @@ angular.module('RoomController', ['ngSanitize', 'mUtilities']) $scope.onInit = function() { console.log("onInit"); - + // Does the room ID provided in the URL? var room_id_or_alias; if ($routeParams.room_id_or_alias) { -- cgit 1.4.1 From f3cea238b9c51861965d31cd9352153338d6705b Mon Sep 17 00:00:00 2001 From: Erik Johnston Date: Fri, 22 Aug 2014 10:56:09 +0100 Subject: Check if the membership message was for the room we were in before updating the membership list --- webclient/room/room-controller.js | 2 ++ 1 file changed, 2 insertions(+) (limited to 'webclient/room') diff --git a/webclient/room/room-controller.js b/webclient/room/room-controller.js index e204a27e04..58ba432ce5 100644 --- a/webclient/room/room-controller.js +++ b/webclient/room/room-controller.js @@ -152,6 +152,8 @@ angular.module('RoomController', ['ngSanitize', 'mUtilities']) }; var updateMemberList = function(chunk) { + if (chunk.room_id != $scope.room_id) return; + var isNewMember = !(chunk.target_user_id in $scope.members); if (isNewMember) { // FIXME: why are we copying these fields around inside chunk? -- cgit 1.4.1 From de0706493affc7d8aa6d294fbd531fa0b75ef49c Mon Sep 17 00:00:00 2001 From: Emmanuel ROHEE Date: Fri, 22 Aug 2014 18:08:03 +0200 Subject: Use /home everywhere --- webclient/app.js | 10 +++++----- webclient/home/home-controller.js | 4 ++-- webclient/home/home.html | 2 +- webclient/index.html | 2 +- webclient/login/login-controller.js | 4 ++-- webclient/room/room-controller.js | 2 +- 6 files changed, 12 insertions(+), 12 deletions(-) (limited to 'webclient/room') diff --git a/webclient/app.js b/webclient/app.js index f666a63bf8..e5d8513944 100644 --- a/webclient/app.js +++ b/webclient/app.js @@ -19,7 +19,7 @@ var matrixWebClient = angular.module('matrixWebClient', [ 'MatrixWebClientController', 'LoginController', 'RoomController', - 'RoomsController', + 'HomeController', 'SettingsController', 'UserController', 'matrixService', @@ -45,9 +45,9 @@ matrixWebClient.config(['$routeProvider', '$provide', '$httpProvider', templateUrl: 'room/room.html', controller: 'RoomController' }). - when('/rooms', { - templateUrl: 'rooms/rooms.html', - controller: 'RoomsController' + when('/home', { + templateUrl: 'home/home.html', + controller: 'HomeController' }). when('/settings', { templateUrl: 'settings/settings.html', @@ -58,7 +58,7 @@ matrixWebClient.config(['$routeProvider', '$provide', '$httpProvider', controller: 'UserController' }). otherwise({ - redirectTo: '/rooms' + redirectTo: '/home' }); $provide.factory('AccessTokenInterceptor', ['$q', '$rootScope', diff --git a/webclient/home/home-controller.js b/webclient/home/home-controller.js index d891558be5..a3d7308312 100644 --- a/webclient/home/home-controller.js +++ b/webclient/home/home-controller.js @@ -16,8 +16,8 @@ limitations under the License. 'use strict'; -angular.module('RoomsController', ['matrixService', 'mFileInput', 'mFileUpload', 'eventHandlerService']) -.controller('RoomsController', ['$scope', '$location', 'matrixService', 'mFileUpload', 'eventHandlerService', 'eventStreamService', +angular.module('HomeController', ['matrixService', 'mFileInput', 'mFileUpload', 'eventHandlerService']) +.controller('HomeController', ['$scope', '$location', 'matrixService', 'mFileUpload', 'eventHandlerService', 'eventStreamService', function($scope, $location, matrixService, mFileUpload, eventHandlerService, eventStreamService) { $scope.config = matrixService.config(); diff --git a/webclient/home/home.html b/webclient/home/home.html index 2e25c0f084..4818d414b6 100644 --- a/webclient/home/home.html +++ b/webclient/home/home.html @@ -1,4 +1,4 @@ -
+
diff --git a/webclient/index.html b/webclient/index.html index 95f682580e..ed1d9bb031 100644 --- a/webclient/index.html +++ b/webclient/index.html @@ -15,10 +15,10 @@ + - diff --git a/webclient/login/login-controller.js b/webclient/login/login-controller.js index 2f1f224a94..cd13dcea82 100644 --- a/webclient/login/login-controller.js +++ b/webclient/login/login-controller.js @@ -53,7 +53,7 @@ angular.module('LoginController', ['matrixService']) matrixService.saveConfig(); eventStreamService.resume(); // Go to the user's rooms list page - $location.url("rooms"); + $location.url("home"); }, function(error) { if (error.data) { @@ -84,7 +84,7 @@ angular.module('LoginController', ['matrixService']) }); matrixService.saveConfig(); eventStreamService.resume(); - $location.url("rooms"); + $location.url("home"); } else { $scope.feedback = "Failed to login: " + JSON.stringify(response.data); diff --git a/webclient/room/room-controller.js b/webclient/room/room-controller.js index 26d1836fc2..65a33dd60b 100644 --- a/webclient/room/room-controller.js +++ b/webclient/room/room-controller.js @@ -364,7 +364,7 @@ angular.module('RoomController', ['ngSanitize', 'mUtilities']) matrixService.leave($scope.room_id).then( function(response) { console.log("Left room "); - $location.url("rooms"); + $location.url("home"); }, function(error) { $scope.feedback = "Failed to leave room: " + error.data.error; -- cgit 1.4.1 From d2bb28d2df6ffe58db1a56e7aec85c34d9d1425f Mon Sep 17 00:00:00 2001 From: Matthew Hodgson Date: Sat, 23 Aug 2014 20:45:00 +0100 Subject: very quick and dirty responsive design for iPhones --- webclient/app.css | 98 ++++++++++++++++++++++++++++++++++++++++------ webclient/index.html | 6 +-- webclient/login/login.html | 4 +- webclient/room/room.html | 30 +++++++------- webclient/rooms/rooms.html | 1 + webclient/user/user.html | 1 + 6 files changed, 110 insertions(+), 30 deletions(-) (limited to 'webclient/room') diff --git a/webclient/app.css b/webclient/app.css index 207f35f5f3..6f320414b1 100644 --- a/webclient/app.css +++ b/webclient/app.css @@ -1,3 +1,71 @@ +/*** Mobile voodoo ***/ +@media all and (max-device-width: 640px) { + + #messageTableWrapper { + margin-right: 0px ! important; + } + + .leftBlock { + width: 8em ! important; + } + + #header, + #messageTable, + #wrapper, + #roomName, + #controls { + max-width: 640px ! important; + } + + #userIdCell, + #usersTableWrapper, + #extraControls { + display: none; + } + + #buttonsCell { + width: 60px ! important; + padding-left: 20px ! important; + } + + #roomLogo { + display: none; + } + + #roomName { + text-align: left ! important; + top: -35px ! important; + } + + .bubble { + font-size: 12px ! important; + height: 20px ! important; + } + + #page { + top: 35px ! important; + bottom: 70px ! important; + } + + #header, + #page { + margin: 5px ! important; + } + + #header { + padding: 5px ! important; + } + + /* stop zoom on select */ + select:focus, + textarea, + input + { + font-size: 16px ! important; + } + +} + body { font-family: "Myriad Pro", "Myriad", Helvetica, Arial, sans-serif; font-size: 12pt; @@ -17,7 +85,6 @@ h1 { left: 0px; right: 0px; margin: 20px; - margin: 20px; } #wrapper { @@ -32,8 +99,7 @@ h1 { text-align: right; top: -40px; position: absolute; - font-size: 16pt; - margin-bottom: 10px; + font-size: 16px; } #controlPanel { @@ -50,6 +116,10 @@ h1 { margin: auto; } +#buttonsCell { + width: 150px; +} + #inputBarTable { width: 100%; } @@ -111,13 +181,13 @@ h1 { color: #fff; margin: 2px; bottom: 0px; - font-size: 8pt; + font-size: 12px; word-break: break-all; } .userPresence { text-align: center; - font-size: 8pt; + font-size: 12px; color: #fff; background-color: #aaa; border-bottom: 1px #ddd solid; @@ -159,7 +229,7 @@ h1 { background-color: #fff; color: #888; font-weight: medium; - font-size: 8pt; + font-size: 12px; text-align: right; border-top: 1px #ddd solid; } @@ -277,7 +347,7 @@ h1 { .profile-avatar { width: 160px; height: 160px; - display:table-cell; + display: table-cell; vertical-align: middle; text-align: center; } @@ -293,13 +363,19 @@ h1 { } #user-displayname { - font-size: 16pt; + font-size: 24px; } /******************************/ -#header { - padding-left: 20px; - padding-right: 20px; +#header +{ + padding: 20px; + max-width: 1280px; + margin: auto; +} + +#logo, +#roomLogo { max-width: 1280px; margin: auto; } diff --git a/webclient/index.html b/webclient/index.html index 27d9208193..5b8e27fa6d 100644 --- a/webclient/index.html +++ b/webclient/index.html @@ -2,10 +2,12 @@ [matrix] - + + + @@ -36,8 +38,6 @@
- -

[matrix]

diff --git a/webclient/login/login.html b/webclient/login/login.html index b1488b37f0..4b2ea60928 100644 --- a/webclient/login/login.html +++ b/webclient/login/login.html @@ -1,4 +1,6 @@ -
{{ members[msg.user_id].displayname || msg.user_id }}
-
{{ (msg.content.hsob_ts || msg.ts) | date:'MMM d HH:mm:ss' }}
+
{{ (msg.content.hsob_ts || msg.ts) | date:'MMM d HH:mm' }}
 - - - -
+ {{ state.user_id }} + + - - - +
- - Invite a user: - - - - - +
+ + Invite a user: + + + + +
+ {{ feedback }}
{{ state.stream_failure.data.error || "Connection failure" }} diff --git a/webclient/rooms/rooms.html b/webclient/rooms/rooms.html index 5e422bf83b..2a12cbc8ae 100644 --- a/webclient/rooms/rooms.html +++ b/webclient/rooms/rooms.html @@ -1,4 +1,5 @@
+

[matrix]

diff --git a/webclient/user/user.html b/webclient/user/user.html index 47db09d1ee..4c91c8a48a 100644 --- a/webclient/user/user.html +++ b/webclient/user/user.html @@ -1,4 +1,5 @@
+

[matrix]

-- cgit 1.4.1 From 5796232cb19927612957db3fcf4b77cd383187a6 Mon Sep 17 00:00:00 2001 From: Kegan Dougal Date: Tue, 26 Aug 2014 10:24:47 +0100 Subject: Adjusted webclient to use new state paths. Updated membership msg template to actually show the person invited. Factored out common membership functions in matrix service. --- synapse/rest/room.py | 3 +- .../components/matrix/event-handler-service.js | 4 -- webclient/components/matrix/matrix-service.js | 47 ++++++---------------- webclient/home/home-controller.js | 2 +- webclient/room/room-controller.js | 13 +++--- webclient/room/room.html | 2 +- 6 files changed, 24 insertions(+), 47 deletions(-) (limited to 'webclient/room') diff --git a/synapse/rest/room.py b/synapse/rest/room.py index a07e031984..2d681bd893 100644 --- a/synapse/rest/room.py +++ b/synapse/rest/room.py @@ -318,7 +318,8 @@ class RoomMemberListRestServlet(RestServlet): user_id=user.to_string()) for event in members["chunk"]: - target_user = self.hs.parse_userid(event["state_key"]) + # FIXME: should probably be state_key here, not user_id + target_user = self.hs.parse_userid(event["user_id"]) # Presence is an optional cache; don't fail if we can't fetch it try: presence_state = yield self.handlers.presence_handler.get_state( diff --git a/webclient/components/matrix/event-handler-service.js b/webclient/components/matrix/event-handler-service.js index b5eb73d92b..6ea0f58bc5 100644 --- a/webclient/components/matrix/event-handler-service.js +++ b/webclient/components/matrix/event-handler-service.js @@ -54,10 +54,6 @@ angular.module('eventHandlerService', []) } var handleMessage = function(event, isLiveEvent) { - if ("membership_target" in event.content) { - event.user_id = event.content.membership_target; - } - initRoom(event.room_id); if (isLiveEvent) { diff --git a/webclient/components/matrix/matrix-service.js b/webclient/components/matrix/matrix-service.js index d5738e01c8..b5b1815cf9 100644 --- a/webclient/components/matrix/matrix-service.js +++ b/webclient/components/matrix/matrix-service.js @@ -115,19 +115,7 @@ angular.module('matrixService', []) // Joins a room join: function(room_id) { - // The REST path spec - var path = "/rooms/$room_id/members/$user_id/state"; - - // Like the cmd client, escape room ids - room_id = encodeURIComponent(room_id); - - // Customize it - path = path.replace("$room_id", room_id); - path = path.replace("$user_id", config.user_id); - - return doRequest("PUT", path, undefined, { - membership: "join" - }); + return this.membershipChange(room_id, config.user_id, "join"); }, joinAlias: function(room_alias) { @@ -141,34 +129,23 @@ angular.module('matrixService', []) // Invite a user to a room invite: function(room_id, user_id) { - // The REST path spec - var path = "/rooms/$room_id/members/$user_id/state"; - - // Like the cmd client, escape room ids - room_id = encodeURIComponent(room_id); - - // Customize it - path = path.replace("$room_id", room_id); - path = path.replace("$user_id", user_id); - - return doRequest("PUT", path, undefined, { - membership: "invite" - }); + return this.membershipChange(room_id, user_id, "invite"); }, // Leaves a room leave: function(room_id) { - // The REST path spec - var path = "/rooms/$room_id/members/$user_id/state"; - - // Like the cmd client, escape room ids - room_id = encodeURIComponent(room_id); + return this.membershipChange(room_id, config.user_id, "leave"); + }, - // Customize it - path = path.replace("$room_id", room_id); - path = path.replace("$user_id", config.user_id); + membershipChange: function(room_id, user_id, membershipValue) { + // The REST path spec + var path = "/rooms/$room_id/state/m.room.member/$user_id"; + path = path.replace("$room_id", encodeURIComponent(room_id)); + path = path.replace("$user_id", encodeURIComponent(user_id)); - return doRequest("DELETE", path, undefined, undefined); + return doRequest("PUT", path, undefined, { + membership: membershipValue + }); }, // Retrieves the room ID corresponding to a room alias diff --git a/webclient/home/home-controller.js b/webclient/home/home-controller.js index 35d0ef1654..a5576759fa 100644 --- a/webclient/home/home-controller.js +++ b/webclient/home/home-controller.js @@ -41,7 +41,7 @@ angular.module('HomeController', ['matrixService', 'mFileInput', 'mFileUpload', $scope.$on(eventHandlerService.MEMBER_EVENT, function(ngEvent, event, isLive) { var config = matrixService.config(); - if (event.target_user_id === config.user_id && event.content.membership === "invite") { + if (event.state_key === config.user_id && event.content.membership === "invite") { console.log("Invited to room " + event.room_id); // FIXME push membership to top level key to match /im/sync event.membership = event.content.membership; diff --git a/webclient/room/room-controller.js b/webclient/room/room-controller.js index 3311618825..f49deaa489 100644 --- a/webclient/room/room-controller.js +++ b/webclient/room/room-controller.js @@ -154,7 +154,10 @@ angular.module('RoomController', ['ngSanitize', 'mUtilities']) var updateMemberList = function(chunk) { if (chunk.room_id != $scope.room_id) return; - var isNewMember = !(chunk.target_user_id in $scope.members); + // set target_user_id to keep things clear + var target_user_id = chunk.state_key; + + var isNewMember = !(target_user_id in $scope.members); if (isNewMember) { // FIXME: why are we copying these fields around inside chunk? if ("state" in chunk.content) { @@ -172,7 +175,7 @@ angular.module('RoomController', ['ngSanitize', 'mUtilities']) if ("avatar_url" in chunk.content) { chunk.avatar_url = chunk.content.avatar_url; } - $scope.members[chunk.target_user_id] = chunk; + $scope.members[target_user_id] = chunk; /* // Stale code for explicitly hammering the homeserver for every displayname & avatar_url @@ -202,13 +205,13 @@ angular.module('RoomController', ['ngSanitize', 'mUtilities']) }); */ - if (chunk.target_user_id in $rootScope.presence) { - updatePresence($rootScope.presence[chunk.target_user_id]); + if (target_user_id in $rootScope.presence) { + updatePresence($rootScope.presence[target_user_id]); } } else { // selectively update membership else it will nuke the picture and displayname too :/ - var member = $scope.members[chunk.target_user_id]; + var member = $scope.members[target_user_id]; member.content.membership = chunk.content.membership; } } diff --git a/webclient/room/room.html b/webclient/room/room.html index 06ca63d2ea..c167819f15 100644 --- a/webclient/room/room.html +++ b/webclient/room/room.html @@ -44,7 +44,7 @@ {{ members[msg.user_id].displayname || msg.user_id }} {{ {"join": "joined", "leave": "left", "invite": "invited"}[msg.content.membership] }} - {{ msg.content.target_id || '' }} + {{ msg.content.membership === "invite" ? (msg.state_key || '') : '' }} -- cgit 1.4.1