From ef3fc51e53361cf71a0fa6e9c5fa7e65a7c66821 Mon Sep 17 00:00:00 2001 From: Igor Zhukov Date: Tue, 25 Mar 2014 18:39:17 +0400 Subject: [PATCH] Performance improvements --- app/css/app.css | 4 + app/index.html | 1 + app/js/app.js | 1 + app/js/directives.js | 5 +- app/js/services.js | 4 +- app/partials/chat_modal.html | 2 +- app/partials/dialog.html | 32 ++- app/partials/head.html | 4 +- app/partials/im.html | 59 +++--- app/partials/message.html | 62 +++--- app/partials/settings_modal.html | 2 +- app/vendor/bindonce/bindonce.js | 321 +++++++++++++++++++++++++++++++ 12 files changed, 412 insertions(+), 85 deletions(-) create mode 100644 app/vendor/bindonce/bindonce.js diff --git a/app/css/app.css b/app/css/app.css index 2cbd7676..689e5522 100644 --- a/app/css/app.css +++ b/app/css/app.css @@ -1413,6 +1413,10 @@ span.emoji { font-size: 1.5em; padding: 0 50px; } +.im_history_to_bottom .im_history_not_selected, +.im_history_to_bottom .im_history_empty { + display: none; +} .im_send_panel_wrap { max-width: 526px; diff --git a/app/index.html b/app/index.html index d1ffecab..c8c26a16 100644 --- a/app/index.html +++ b/app/index.html @@ -36,6 +36,7 @@ + diff --git a/app/js/app.js b/app/js/app.js index 9fd79c00..31a38e29 100644 --- a/app/js/app.js +++ b/app/js/app.js @@ -30,6 +30,7 @@ angular.module('myApp', [ 'ngAnimate', 'ngSanitize', 'ui.bootstrap', + 'pasvaz.bindonce', 'mtproto.services', 'myApp.filters', 'myApp.services', diff --git a/app/js/directives.js b/app/js/directives.js index c586a0c6..70f17ef4 100644 --- a/app/js/directives.js +++ b/app/js/directives.js @@ -318,6 +318,9 @@ angular.module('myApp.directives', ['myApp.filters']) }); function updateSizes (heightOnly) { + if (!element.is(':visible') || !$(element[0].parentNode).is(':visible')) { + return; + } if ($(sendFormWrap).is(':visible')) { $(sendFormWrap).css({ height: $(sendForm).height() @@ -851,7 +854,7 @@ angular.module('myApp.directives', ['myApp.filters']) }) - .directive('myTypingDots', function($interval) { + .directive('myLoadingDots', function($interval) { return { link: link, diff --git a/app/js/services.js b/app/js/services.js index 7cdbd953..a952dcb4 100644 --- a/app/js/services.js +++ b/app/js/services.js @@ -671,7 +671,7 @@ angular.module('myApp.services', []) } }) -.service('AppMessagesManager', function ($q, $rootScope, $location, ApiUpdatesManager, AppUsersManager, AppChatsManager, AppPeersManager, AppPhotosManager, AppVideoManager, AppDocsManager, AppAudioManager, MtpApiManager, MtpApiFileManager, RichTextProcessor, NotificationsManager, SearchIndexManager) { +.service('AppMessagesManager', function ($q, $rootScope, $location, $filter, ApiUpdatesManager, AppUsersManager, AppChatsManager, AppPeersManager, AppPhotosManager, AppVideoManager, AppDocsManager, AppAudioManager, MtpApiManager, MtpApiFileManager, RichTextProcessor, NotificationsManager, SearchIndexManager) { var messagesStorage = {}; var messagesForHistory = {}; @@ -1482,6 +1482,8 @@ angular.module('myApp.services', []) message.richMessage = RichTextProcessor.wrapRichText(message.message.substr(0, 64), {noLinks: true, noLinebreaks: true}); } + message.dateText = $filter('dateOrTime')(message.date); + return messagesForDialogs[msgID] = message; } diff --git a/app/partials/chat_modal.html b/app/partials/chat_modal.html index 4965ee7b..c6528642 100644 --- a/app/partials/chat_modal.html +++ b/app/partials/chat_modal.html @@ -16,7 +16,7 @@ thumb="chatFull.thumb" />
-
Updating
+
Updating
diff --git a/app/partials/dialog.html b/app/partials/dialog.html index dd3432ca..5479ed8f 100644 --- a/app/partials/dialog.html +++ b/app/partials/dialog.html @@ -1,9 +1,7 @@
-
- {{dialogMessage.date | dateOrTime}} -
+
-
- - +
+ + + -
@@ -59,22 +57,22 @@ changed group photo removed group photo - - - invited - - + + returned to group + + invited + - - - kicked - - + + left group + + kicked + diff --git a/app/partials/head.html b/app/partials/head.html index 3bc7b618..9c203b82 100644 --- a/app/partials/head.html +++ b/app/partials/head.html @@ -22,9 +22,9 @@
    diff --git a/app/partials/im.html b/app/partials/im.html index 76978803..1bf0d667 100644 --- a/app/partials/im.html +++ b/app/partials/im.html @@ -63,7 +63,7 @@ Please select a chat to start messaging
- Loading history + Loading history
@@ -90,25 +90,26 @@ +{{missedCount}} -

- Photos - Videos - Documents -

- -

- - - - - -

- -

- - {{historyPeer.data | userStatus}} -

+
+

Photos

+

Videos

+

Documents

+ +

+
+ + {{historyPeer.data | userStatus}} +
+
+ + + + + +
+

+
@@ -127,13 +128,13 @@ No messages here yet...
-
+
- is typing + is typing
@@ -145,17 +146,13 @@
-
+
- - Clear History - - - Delete Chat - - - Cancel + + Delete Chat + Clear History + Cancel
Forward diff --git a/app/partials/message.html b/app/partials/message.html index 7214d9cc..037b9459 100644 --- a/app/partials/message.html +++ b/app/partials/message.html @@ -1,4 +1,4 @@ -
+
@@ -7,51 +7,51 @@
-
+
-
+
- - + + created the group «{{historyMessage.action.title}}» - + changed group name to «» - + changed group photo - + removed group photo - - + + invited - + returned to group - - + + kicked - + left group - + unsupported action {{historyMessage.action}}
- + -
+
- + - + +
- {{historyMessage.date | dateOrTime}} +
- - - + + -
+
Forwarded message from , {{historyMessage.fwd_date | dateOrTime}}
-
+
- -
+ +
Download - Open + Open
@@ -220,7 +220,7 @@
@@ -232,7 +232,7 @@
diff --git a/app/partials/settings_modal.html b/app/partials/settings_modal.html index 3dccb899..1b8b789d 100644 --- a/app/partials/settings_modal.html +++ b/app/partials/settings_modal.html @@ -18,7 +18,7 @@ thumb="profile.photo" />
-
Updating
+
Updating
diff --git a/app/vendor/bindonce/bindonce.js b/app/vendor/bindonce/bindonce.js new file mode 100644 index 00000000..e08a3677 --- /dev/null +++ b/app/vendor/bindonce/bindonce.js @@ -0,0 +1,321 @@ +(function () { + "use strict"; + /** + * Bindonce - Zero watches binding for AngularJs + * @version v0.3.1 + * @link https://github.com/Pasvaz/bindonce + * @author Pasquale Vazzana + * @license MIT License, http://www.opensource.org/licenses/MIT + */ + + var bindonceModule = angular.module('pasvaz.bindonce', []); + + bindonceModule.directive('bindonce', function () + { + var toBoolean = function (value) + { + if (value && value.length !== 0) + { + var v = angular.lowercase("" + value); + value = !(v === 'f' || v === '0' || v === 'false' || v === 'no' || v === 'n' || v === '[]'); + } + else + { + value = false; + } + return value; + }; + + var msie = parseInt((/msie (\d+)/.exec(angular.lowercase(navigator.userAgent)) || [])[1], 10); + if (isNaN(msie)) + { + msie = parseInt((/trident\/.*; rv:(\d+)/.exec(angular.lowercase(navigator.userAgent)) || [])[1], 10); + } + + var bindonceDirective = + { + restrict: "AM", + controller: ['$scope', '$element', '$attrs', '$interpolate', function ($scope, $element, $attrs, $interpolate) + { + var showHideBinder = function (elm, attr, value) + { + var show = (attr === 'show') ? '' : 'none'; + var hide = (attr === 'hide') ? '' : 'none'; + elm.css('display', toBoolean(value) ? show : hide); + }; + var classBinder = function (elm, value) + { + if (angular.isObject(value) && !angular.isArray(value)) + { + var results = []; + angular.forEach(value, function (value, index) + { + if (value) results.push(index); + }); + value = results; + } + if (value) + { + elm.addClass(angular.isArray(value) ? value.join(' ') : value); + } + }; + var transclude = function (transcluder, scope) + { + transcluder.transclude(scope, function (clone) + { + var parent = transcluder.element.parent(); + var afterNode = transcluder.element && transcluder.element[transcluder.element.length - 1]; + var parentNode = parent && parent[0] || afterNode && afterNode.parentNode; + var afterNextSibling = (afterNode && afterNode.nextSibling) || null; + angular.forEach(clone, function (node) + { + parentNode.insertBefore(node, afterNextSibling); + }); + }); + }; + + var ctrl = + { + watcherRemover: undefined, + binders: [], + group: $attrs.boName, + element: $element, + ran: false, + + addBinder: function (binder) + { + this.binders.push(binder); + + // In case of late binding (when using the directive bo-name/bo-parent) + // it happens only when you use nested bindonce, if the bo-children + // are not dom children the linking can follow another order + if (this.ran) + { + this.runBinders(); + } + }, + + setupWatcher: function (bindonceValue) + { + var that = this; + this.watcherRemover = $scope.$watch(bindonceValue, function (newValue) + { + if (newValue === undefined) return; + that.removeWatcher(); + that.checkBindonce(newValue); + }, true); + }, + + checkBindonce: function (value) + { + var that = this, promise = (value.$promise) ? value.$promise.then : value.then; + // since Angular 1.2 promises are no longer + // undefined until they don't get resolved + if (typeof promise === 'function') + { + promise(function () + { + that.runBinders(); + }); + } + else + { + that.runBinders(); + } + }, + + removeWatcher: function () + { + if (this.watcherRemover !== undefined) + { + this.watcherRemover(); + this.watcherRemover = undefined; + } + }, + + runBinders: function () + { + while (this.binders.length > 0) + { + var binder = this.binders.shift(); + if (this.group && this.group != binder.group) continue; + var value = binder.scope.$eval((binder.interpolate) ? $interpolate(binder.value) : binder.value); + switch (binder.attr) + { + case 'boIf': + if (toBoolean(value)) + { + transclude(binder, binder.scope.$new()); + } + break; + case 'boSwitch': + var selectedTranscludes, switchCtrl = binder.controller[0]; + if ((selectedTranscludes = switchCtrl.cases['!' + value] || switchCtrl.cases['?'])) + { + binder.scope.$eval(binder.attrs.change); + angular.forEach(selectedTranscludes, function (selectedTransclude) + { + transclude(selectedTransclude, binder.scope.$new()); + }); + } + break; + case 'boSwitchWhen': + var ctrl = binder.controller[0]; + ctrl.cases['!' + binder.attrs.boSwitchWhen] = (ctrl.cases['!' + binder.attrs.boSwitchWhen] || []); + ctrl.cases['!' + binder.attrs.boSwitchWhen].push({ transclude: binder.transclude, element: binder.element }); + break; + case 'boSwitchDefault': + var ctrl = binder.controller[0]; + ctrl.cases['?'] = (ctrl.cases['?'] || []); + ctrl.cases['?'].push({ transclude: binder.transclude, element: binder.element }); + break; + case 'hide': + case 'show': + showHideBinder(binder.element, binder.attr, value); + break; + case 'class': + classBinder(binder.element, value); + break; + case 'text': + binder.element.text(value); + break; + case 'html': + binder.element.html(value); + break; + case 'style': + binder.element.css(value); + break; + case 'src': + binder.element.attr(binder.attr, value); + if (msie) binder.element.prop('src', value); + break; + case 'attr': + angular.forEach(binder.attrs, function (attrValue, attrKey) + { + var newAttr, newValue; + if (attrKey.match(/^boAttr./) && binder.attrs[attrKey]) + { + newAttr = attrKey.replace(/^boAttr/, '').replace(/([a-z])([A-Z])/g, '$1-$2').toLowerCase(); + newValue = binder.scope.$eval(binder.attrs[attrKey]); + binder.element.attr(newAttr, newValue); + } + }); + break; + case 'href': + case 'alt': + case 'title': + case 'id': + case 'value': + binder.element.attr(binder.attr, value); + break; + } + } + this.ran = true; + } + }; + + return ctrl; + }], + + link: function (scope, elm, attrs, bindonceController) + { + var value = attrs.bindonce && scope.$eval(attrs.bindonce); + if (value !== undefined) + { + bindonceController.checkBindonce(value); + } + else + { + bindonceController.setupWatcher(attrs.bindonce); + elm.bind("$destroy", bindonceController.removeWatcher); + } + } + }; + + return bindonceDirective; + }); + + angular.forEach( + [ + { directiveName: 'boShow', attribute: 'show' }, + { directiveName: 'boHide', attribute: 'hide' }, + { directiveName: 'boClass', attribute: 'class' }, + { directiveName: 'boText', attribute: 'text' }, + { directiveName: 'boBind', attribute: 'text' }, + { directiveName: 'boHtml', attribute: 'html' }, + { directiveName: 'boSrcI', attribute: 'src', interpolate: true }, + { directiveName: 'boSrc', attribute: 'src' }, + { directiveName: 'boHrefI', attribute: 'href', interpolate: true }, + { directiveName: 'boHref', attribute: 'href' }, + { directiveName: 'boAlt', attribute: 'alt' }, + { directiveName: 'boTitle', attribute: 'title' }, + { directiveName: 'boId', attribute: 'id' }, + { directiveName: 'boStyle', attribute: 'style' }, + { directiveName: 'boValue', attribute: 'value' }, + { directiveName: 'boAttr', attribute: 'attr' }, + + { directiveName: 'boIf', transclude: 'element', terminal: true, priority: 1000 }, + { directiveName: 'boSwitch', require: 'boSwitch', controller: function () { this.cases = {}; } }, + { directiveName: 'boSwitchWhen', transclude: 'element', priority: 800, require: '^boSwitch' }, + { directiveName: 'boSwitchDefault', transclude: 'element', priority: 800, require: '^boSwitch' } + ], + function (boDirective) + { + var childPriority = 200; + return bindonceModule.directive(boDirective.directiveName, function () + { + var bindonceDirective = + { + priority: boDirective.priority || childPriority, + transclude: boDirective.transclude || false, + terminal: boDirective.terminal || false, + require: ['^bindonce'].concat(boDirective.require || []), + controller: boDirective.controller, + compile: function (tElement, tAttrs, transclude) + { + return function (scope, elm, attrs, controllers) + { + var bindonceController = controllers[0]; + var name = attrs.boParent; + if (name && bindonceController.group !== name) + { + var element = bindonceController.element.parent(); + bindonceController = undefined; + var parentValue; + + while (element[0].nodeType !== 9 && element.length) + { + if ((parentValue = element.data('$bindonceController')) + && parentValue.group === name) + { + bindonceController = parentValue; + break; + } + element = element.parent(); + } + if (!bindonceController) + { + throw new Error("No bindonce controller: " + name); + } + } + + bindonceController.addBinder( + { + element: elm, + attr: boDirective.attribute || boDirective.directiveName, + attrs: attrs, + value: attrs[boDirective.directiveName], + interpolate: boDirective.interpolate, + group: name, + transclude: transclude, + controller: controllers.slice(1), + scope: scope + }); + }; + } + }; + + return bindonceDirective; + }); + }) +})(); \ No newline at end of file