forked from MirrorHub/synapse
File organisation sanity: put directives and filters into dedicated files
This commit is contained in:
parent
f4839ea042
commit
ecce301632
6 changed files with 254 additions and 197 deletions
38
webclient/app-directive.js
Normal file
38
webclient/app-directive.js
Normal file
|
@ -0,0 +1,38 @@
|
|||
/*
|
||||
Copyright 2014 matrix.org
|
||||
|
||||
Licensed under the Apache License, Version 2.0 (the "License");
|
||||
you may not use this file except in compliance with the License.
|
||||
You may obtain a copy of the License at
|
||||
|
||||
http://www.apache.org/licenses/LICENSE-2.0
|
||||
|
||||
Unless required by applicable law or agreed to in writing, software
|
||||
distributed under the License is distributed on an "AS IS" BASIS,
|
||||
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
||||
See the License for the specific language governing permissions and
|
||||
limitations under the License.
|
||||
*/
|
||||
|
||||
'use strict';
|
||||
|
||||
angular.module('matrixWebClient')
|
||||
.directive('ngEnter', function () {
|
||||
return function (scope, element, attrs) {
|
||||
element.bind("keydown keypress", function (event) {
|
||||
if(event.which === 13) {
|
||||
scope.$apply(function () {
|
||||
scope.$eval(attrs.ngEnter);
|
||||
});
|
||||
event.preventDefault();
|
||||
}
|
||||
});
|
||||
};
|
||||
})
|
||||
.directive('ngFocus', ['$timeout', function($timeout) {
|
||||
return {
|
||||
link: function(scope, element, attr) {
|
||||
$timeout(function() { element[0].focus(); }, 0);
|
||||
}
|
||||
};
|
||||
}]);
|
79
webclient/app-filter.js
Normal file
79
webclient/app-filter.js
Normal file
|
@ -0,0 +1,79 @@
|
|||
/*
|
||||
Copyright 2014 matrix.org
|
||||
|
||||
Licensed under the Apache License, Version 2.0 (the "License");
|
||||
you may not use this file except in compliance with the License.
|
||||
You may obtain a copy of the License at
|
||||
|
||||
http://www.apache.org/licenses/LICENSE-2.0
|
||||
|
||||
Unless required by applicable law or agreed to in writing, software
|
||||
distributed under the License is distributed on an "AS IS" BASIS,
|
||||
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
||||
See the License for the specific language governing permissions and
|
||||
limitations under the License.
|
||||
*/
|
||||
|
||||
'use strict';
|
||||
|
||||
angular.module('matrixWebClient')
|
||||
.filter('duration', function() {
|
||||
return function(time) {
|
||||
if (!time) return;
|
||||
var t = parseInt(time / 1000);
|
||||
var s = t % 60;
|
||||
var m = parseInt(t / 60) % 60;
|
||||
var h = parseInt(t / (60 * 60)) % 24;
|
||||
var d = parseInt(t / (60 * 60 * 24));
|
||||
if (t < 60) {
|
||||
return s + "s";
|
||||
}
|
||||
if (t < 60 * 60) {
|
||||
return m + "m "; // + s + "s";
|
||||
}
|
||||
if (t < 24 * 60 * 60) {
|
||||
return h + "h "; // + m + "m";
|
||||
}
|
||||
return d + "d "; // + h + "h";
|
||||
};
|
||||
})
|
||||
.filter('orderMembersList', function($sce) {
|
||||
return function(members) {
|
||||
var filtered = [];
|
||||
|
||||
var displayNames = {};
|
||||
angular.forEach(members, function(value, key) {
|
||||
value["id"] = key;
|
||||
filtered.push( value );
|
||||
if (value["displayname"]) {
|
||||
if (!displayNames[value["displayname"]]) {
|
||||
displayNames[value["displayname"]] = [];
|
||||
}
|
||||
displayNames[value["displayname"]].push(key);
|
||||
}
|
||||
});
|
||||
|
||||
// FIXME: we shouldn't disambiguate displayNames on every orderMembersList
|
||||
// invocation but keep track of duplicates incrementally somewhere
|
||||
angular.forEach(displayNames, function(value, key) {
|
||||
if (value.length > 1) {
|
||||
// console.log(key + ": " + value);
|
||||
for (i=0; i < value.length; i++) {
|
||||
var v = value[i];
|
||||
members[v].displayname += " (" + v + ")";
|
||||
// console.log(v + " " + members[v]);
|
||||
};
|
||||
}
|
||||
});
|
||||
|
||||
filtered.sort(function (a, b) {
|
||||
return ((a["mtime_age"] || 10e10) > (b["mtime_age"] || 10e10) ? 1 : -1);
|
||||
});
|
||||
return filtered;
|
||||
};
|
||||
})
|
||||
.filter('unsafe', ['$sce', function($sce) {
|
||||
return function(text) {
|
||||
return $sce.trustAsHtml(text);
|
||||
};
|
||||
}]);
|
|
@ -83,84 +83,3 @@ matrixWebClient.run(['$location', 'matrixService', 'eventStreamService', functio
|
|||
eventStreamService.resume();
|
||||
}
|
||||
}]);
|
||||
|
||||
matrixWebClient
|
||||
.directive('ngEnter', function () {
|
||||
return function (scope, element, attrs) {
|
||||
element.bind("keydown keypress", function (event) {
|
||||
if(event.which === 13) {
|
||||
scope.$apply(function () {
|
||||
scope.$eval(attrs.ngEnter);
|
||||
});
|
||||
event.preventDefault();
|
||||
}
|
||||
});
|
||||
};
|
||||
})
|
||||
.directive('ngFocus', ['$timeout', function($timeout) {
|
||||
return {
|
||||
link: function(scope, element, attr) {
|
||||
$timeout(function() { element[0].focus() }, 0);
|
||||
}
|
||||
};
|
||||
}])
|
||||
.filter('duration', function() {
|
||||
return function(time) {
|
||||
if (!time) return;
|
||||
var t = parseInt(time / 1000);
|
||||
var s = t % 60;
|
||||
var m = parseInt(t / 60) % 60;
|
||||
var h = parseInt(t / (60 * 60)) % 24;
|
||||
var d = parseInt(t / (60 * 60 * 24));
|
||||
if (t < 60) {
|
||||
return s + "s"
|
||||
}
|
||||
if (t < 60 * 60) {
|
||||
return m + "m "; // + s + "s";
|
||||
}
|
||||
if (t < 24 * 60 * 60) {
|
||||
return h + "h "; // + m + "m";
|
||||
}
|
||||
return d + "d "; // + h + "h";
|
||||
}
|
||||
})
|
||||
.filter('orderMembersList', function($sce) {
|
||||
return function(members) {
|
||||
var filtered = [];
|
||||
|
||||
var displayNames = {};
|
||||
angular.forEach(members, function(value, key) {
|
||||
value["id"] = key;
|
||||
filtered.push( value );
|
||||
if (value["displayname"]) {
|
||||
if (!displayNames[value["displayname"]]) {
|
||||
displayNames[value["displayname"]] = [];
|
||||
}
|
||||
displayNames[value["displayname"]].push(key);
|
||||
}
|
||||
});
|
||||
|
||||
// FIXME: we shouldn't disambiguate displayNames on every orderMembersList
|
||||
// invocation but keep track of duplicates incrementally somewhere
|
||||
angular.forEach(displayNames, function(value, key) {
|
||||
if (value.length > 1) {
|
||||
// console.log(key + ": " + value);
|
||||
for (i=0; i < value.length; i++) {
|
||||
var v = value[i];
|
||||
members[v].displayname += " (" + v + ")";
|
||||
// console.log(v + " " + members[v]);
|
||||
};
|
||||
}
|
||||
});
|
||||
|
||||
filtered.sort(function (a, b) {
|
||||
return ((a["mtime_age"] || 10e10) > (b["mtime_age"] || 10e10) ? 1 : -1);
|
||||
});
|
||||
return filtered;
|
||||
};
|
||||
})
|
||||
.filter('unsafe', ['$sce', function($sce) {
|
||||
return function(text) {
|
||||
return $sce.trustAsHtml(text);
|
||||
};
|
||||
}]);
|
||||
|
|
|
@ -13,8 +13,11 @@
|
|||
<script type='text/javascript' src='js/ng-infinite-scroll-matrix.js'></script>
|
||||
<script src="app.js"></script>
|
||||
<script src="app-controller.js"></script>
|
||||
<script src="app-directive.js"></script>
|
||||
<script src="app-filter.js"></script>
|
||||
<script src="login/login-controller.js"></script>
|
||||
<script src="room/room-controller.js"></script>
|
||||
<script src="room/room-directive.js"></script>
|
||||
<script src="rooms/rooms-controller.js"></script>
|
||||
<script src="user/user-controller.js"></script>
|
||||
<script src="components/matrix/matrix-service.js"></script>
|
||||
|
|
|
@ -15,122 +15,6 @@ limitations under the License.
|
|||
*/
|
||||
|
||||
angular.module('RoomController', ['ngSanitize'])
|
||||
|
||||
.directive('autoComplete', ['$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
|
||||
// console.log("caching " + element[0].value);
|
||||
scope.autoCompleteOriginal = element[0].value;
|
||||
scope.autoCompleting = true;
|
||||
}
|
||||
|
||||
if (event.shiftKey) {
|
||||
scope.autoCompleteIndex--;
|
||||
if (scope.autoCompleteIndex < 0) {
|
||||
scope.autoCompleteIndex = 0;
|
||||
}
|
||||
}
|
||||
else {
|
||||
scope.autoCompleteIndex++;
|
||||
}
|
||||
|
||||
var searchIndex = 0;
|
||||
var targetIndex = scope.autoCompleteIndex;
|
||||
var text = scope.autoCompleteOriginal;
|
||||
|
||||
// console.log("targetIndex: " + targetIndex + ", text=" + text);
|
||||
|
||||
// FIXME: use the correct regexp to recognise userIDs
|
||||
var search = /@?([a-zA-Z0-9_\-:\.]+)$/.exec(text);
|
||||
if (targetIndex === 0) {
|
||||
element[0].value = text;
|
||||
}
|
||||
else if (search && search[1]) {
|
||||
// console.log("search found: " + search);
|
||||
var expansion;
|
||||
|
||||
// FIXME: could do better than linear search here
|
||||
angular.forEach(scope.members, function(item, name) {
|
||||
if (item.displayname && searchIndex < targetIndex) {
|
||||
if (item.displayname.toLowerCase().indexOf(search[1].toLowerCase()) == 0) {
|
||||
expansion = item.displayname;
|
||||
searchIndex++;
|
||||
}
|
||||
}
|
||||
});
|
||||
if (searchIndex < targetIndex) { // then search raw mxids
|
||||
angular.forEach(scope.members, function(item, name) {
|
||||
if (searchIndex < targetIndex) {
|
||||
if (name.toLowerCase().indexOf(search[1].toLowerCase()) == 1) {
|
||||
expansion = name;
|
||||
searchIndex++;
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
if (searchIndex === targetIndex) {
|
||||
// xchat-style tab complete
|
||||
if (search[0].length === text.length)
|
||||
expansion += " : ";
|
||||
else
|
||||
expansion += " ";
|
||||
element[0].value = text.replace(/@?([a-zA-Z0-9_\-:\.]+)$/, expansion);
|
||||
// cancel blink
|
||||
element[0].className = "";
|
||||
}
|
||||
else {
|
||||
// console.log("wrapped!");
|
||||
element[0].className = "blink"; // XXX: slightly naughty to bypass angular
|
||||
$timeout(function() {
|
||||
element[0].className = "";
|
||||
}, 150);
|
||||
element[0].value = text;
|
||||
scope.autoCompleteIndex = 0;
|
||||
}
|
||||
}
|
||||
else {
|
||||
scope.autoCompleteIndex = 0;
|
||||
}
|
||||
event.preventDefault();
|
||||
}
|
||||
else if (event.which != 16 && scope.autoCompleting) {
|
||||
scope.autoCompleting = false;
|
||||
scope.autoCompleteIndex = 0;
|
||||
}
|
||||
});
|
||||
};
|
||||
}])
|
||||
|
||||
// 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';
|
||||
|
|
134
webclient/room/room-directive.js
Normal file
134
webclient/room/room-directive.js
Normal file
|
@ -0,0 +1,134 @@
|
|||
/*
|
||||
Copyright 2014 matrix.org
|
||||
|
||||
Licensed under the Apache License, Version 2.0 (the "License");
|
||||
you may not use this file except in compliance with the License.
|
||||
You may obtain a copy of the License at
|
||||
|
||||
http://www.apache.org/licenses/LICENSE-2.0
|
||||
|
||||
Unless required by applicable law or agreed to in writing, software
|
||||
distributed under the License is distributed on an "AS IS" BASIS,
|
||||
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
||||
See the License for the specific language governing permissions and
|
||||
limitations under the License.
|
||||
*/
|
||||
|
||||
'use strict';
|
||||
|
||||
angular.module('RoomController')
|
||||
.directive('autoComplete', ['$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
|
||||
// console.log("caching " + element[0].value);
|
||||
scope.autoCompleteOriginal = element[0].value;
|
||||
scope.autoCompleting = true;
|
||||
}
|
||||
|
||||
if (event.shiftKey) {
|
||||
scope.autoCompleteIndex--;
|
||||
if (scope.autoCompleteIndex < 0) {
|
||||
scope.autoCompleteIndex = 0;
|
||||
}
|
||||
}
|
||||
else {
|
||||
scope.autoCompleteIndex++;
|
||||
}
|
||||
|
||||
var searchIndex = 0;
|
||||
var targetIndex = scope.autoCompleteIndex;
|
||||
var text = scope.autoCompleteOriginal;
|
||||
|
||||
// console.log("targetIndex: " + targetIndex + ", text=" + text);
|
||||
|
||||
// FIXME: use the correct regexp to recognise userIDs
|
||||
var search = /@?([a-zA-Z0-9_\-:\.]+)$/.exec(text);
|
||||
if (targetIndex === 0) {
|
||||
element[0].value = text;
|
||||
}
|
||||
else if (search && search[1]) {
|
||||
// console.log("search found: " + search);
|
||||
var expansion;
|
||||
|
||||
// FIXME: could do better than linear search here
|
||||
angular.forEach(scope.members, function(item, name) {
|
||||
if (item.displayname && searchIndex < targetIndex) {
|
||||
if (item.displayname.toLowerCase().indexOf(search[1].toLowerCase()) === 0) {
|
||||
expansion = item.displayname;
|
||||
searchIndex++;
|
||||
}
|
||||
}
|
||||
});
|
||||
if (searchIndex < targetIndex) { // then search raw mxids
|
||||
angular.forEach(scope.members, function(item, name) {
|
||||
if (searchIndex < targetIndex) {
|
||||
if (name.toLowerCase().indexOf(search[1].toLowerCase()) === 1) {
|
||||
expansion = name;
|
||||
searchIndex++;
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
if (searchIndex === targetIndex) {
|
||||
// xchat-style tab complete
|
||||
if (search[0].length === text.length)
|
||||
expansion += " : ";
|
||||
else
|
||||
expansion += " ";
|
||||
element[0].value = text.replace(/@?([a-zA-Z0-9_\-:\.]+)$/, expansion);
|
||||
// cancel blink
|
||||
element[0].className = "";
|
||||
}
|
||||
else {
|
||||
// console.log("wrapped!");
|
||||
element[0].className = "blink"; // XXX: slightly naughty to bypass angular
|
||||
$timeout(function() {
|
||||
element[0].className = "";
|
||||
}, 150);
|
||||
element[0].value = text;
|
||||
scope.autoCompleteIndex = 0;
|
||||
}
|
||||
}
|
||||
else {
|
||||
scope.autoCompleteIndex = 0;
|
||||
}
|
||||
event.preventDefault();
|
||||
}
|
||||
else if (event.which !== 16 && scope.autoCompleting) {
|
||||
scope.autoCompleting = false;
|
||||
scope.autoCompleteIndex = 0;
|
||||
}
|
||||
});
|
||||
};
|
||||
}])
|
||||
|
||||
// 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;
|
||||
});
|
||||
}
|
||||
};
|
||||
}]);
|
||||
|
Loading…
Reference in a new issue