summary refs log tree commit diff
path: root/webclient/room
diff options
context:
space:
mode:
authorEmmanuel ROHEE <erohee@amdocs.com>2014-08-19 18:29:41 +0200
committerEmmanuel ROHEE <erohee@amdocs.com>2014-08-19 18:30:02 +0200
commit9ca5bc7892410ed396d4cab8e30a1fc4b5f41513 (patch)
tree2c47e50ae87bf1207c029a48962032834359108a /webclient/room
parentAdded registration/login jsfiddle, formatted so it can be loaded directly fro... (diff)
downloadsynapse-9ca5bc7892410ed396d4cab8e30a1fc4b5f41513.tar.xz
keepScroll: a directive to anchor the scroller position at the bottom when the browser is resizing
Diffstat (limited to 'webclient/room')
-rw-r--r--webclient/room/room-controller.js27
1 files changed, 27 insertions, 0 deletions
diff --git a/webclient/room/room-controller.js b/webclient/room/room-controller.js
index b585e338ed..0ab2fc20a6 100644
--- a/webclient/room/room-controller.js
+++ b/webclient/room/room-controller.js
@@ -104,6 +104,33 @@ angular.module('RoomController', ['ngSanitize'])
         });
     };
 }])
+
+// A directive to anchor the scroller position at the bottom when the browser is resizing.
+// When the screen resizes, the bottom of the element remains the same, not the top.
+.directive('keepScroll', ['$window', function($window) {
+    return {
+        link: function(scope, elem, attrs) {
+
+            scope.windowHeight = $window.innerHeight;
+
+            // Listen to window size change
+            angular.element($window).bind('resize', function() {
+
+                // If the scroller is scrolled to the bottom, there is nothing to do.
+                // The browser will move it as expected
+                if (elem.scrollTop() + elem.height() !== elem[0].scrollHeight) {
+                    // Else, move the scroller position according to the window height change delta
+                    var windowHeightDelta = $window.innerHeight - scope.windowHeight;
+                    elem.scrollTop(elem.scrollTop() - windowHeightDelta);
+                }
+
+                // Store the new window height for the next screen size change
+                scope.windowHeight = $window.innerHeight;
+            });
+        }
+    };
+}])
+
 .controller('RoomController', ['$scope', '$http', '$timeout', '$routeParams', '$location', 'matrixService', 'eventStreamService', 'eventHandlerService',
                                function($scope, $http, $timeout, $routeParams, $location, matrixService, eventStreamService, eventHandlerService) {
    'use strict';