From cce8193ebcedbeebade2f3aaf08d2a86ccdc2442 Mon Sep 17 00:00:00 2001 From: Igor Zhukov Date: Thu, 11 Sep 2014 17:06:06 +0400 Subject: [PATCH 01/11] Init separate mobile version Attach desktop/mobile styles conditionally Separate templates for mobile Make ConfigStorage angular-independent --- app/css/desktop.css | 0 app/css/{app_mobile.css => mobile.css} | 7 +- app/index.html | 3 +- app/js/app.js | 18 +- app/js/controllers.js | 38 +-- app/js/directives.js | 44 +-- app/js/filters.js | 2 +- app/js/init.js | 28 +- app/js/lib/config.js | 129 ++++++++ app/js/lib/ng_utils.js | 129 +------- app/js/lib/utils.js | 4 + app/js/services.js | 57 ++-- .../{ => desktop}/changelog_modal.html | 0 .../{ => desktop}/chat_create_modal.html | 0 .../{ => desktop}/chat_edit_modal.html | 0 app/partials/{ => desktop}/chat_modal.html | 0 app/partials/{ => desktop}/confirm_modal.html | 0 .../{ => desktop}/contacts_modal.html | 0 .../{ => desktop}/country_select_modal.html | 0 app/partials/{ => desktop}/dialog.html | 0 .../{ => desktop}/edit_contact_modal.html | 0 app/partials/{ => desktop}/error_modal.html | 0 app/partials/{ => desktop}/full_gif.html | 0 app/partials/{ => desktop}/full_photo.html | 0 app/partials/{ => desktop}/full_video.html | 0 app/partials/{ => desktop}/head.html | 0 app/partials/{ => desktop}/im.html | 0 .../{ => desktop}/import_contact_modal.html | 0 app/partials/{ => desktop}/login.html | 0 app/partials/{ => desktop}/message.html | 0 .../{ => desktop}/message_attach_audio.html | 0 .../{ => desktop}/message_attach_contact.html | 0 .../message_attach_document.html | 0 .../{ => desktop}/message_attach_map.html | 0 .../{ => desktop}/message_attach_pending.html | 0 .../{ => desktop}/message_attach_photo.html | 0 .../{ => desktop}/message_attach_video.html | 0 .../{ => desktop}/message_service.html | 0 app/partials/{ => desktop}/peer_select.html | 0 app/partials/{ => desktop}/photo_modal.html | 0 .../{ => desktop}/profile_edit_modal.html | 0 .../{ => desktop}/settings_modal.html | 0 app/partials/{ => desktop}/user_modal.html | 0 app/partials/{ => desktop}/video_modal.html | 0 app/partials/{ => desktop}/welcome.html | 0 app/partials/mobile/changelog_modal.html | 199 +++++++++++++ app/partials/mobile/chat_create_modal.html | 24 ++ app/partials/mobile/chat_edit_modal.html | 24 ++ app/partials/mobile/confirm_modal.html | 65 ++++ app/partials/mobile/dialog.html | 89 ++++++ app/partials/mobile/edit_contact_modal.html | 30 ++ app/partials/mobile/error_modal.html | 87 ++++++ app/partials/mobile/full_gif.html | 25 ++ app/partials/mobile/full_photo.html | 19 ++ app/partials/mobile/full_video.html | 26 ++ app/partials/mobile/head.html | 132 +++++++++ app/partials/mobile/im.html | 278 ++++++++++++++++++ app/partials/mobile/import_contact_modal.html | 31 ++ app/partials/mobile/login.html | 84 ++++++ app/partials/mobile/message.html | 79 +++++ app/partials/mobile/message_attach_audio.html | 33 +++ .../mobile/message_attach_contact.html | 8 + .../mobile/message_attach_document.html | 39 +++ app/partials/mobile/message_attach_map.html | 3 + .../mobile/message_attach_pending.html | 17 ++ app/partials/mobile/message_attach_photo.html | 7 + app/partials/mobile/message_attach_video.html | 31 ++ app/partials/mobile/message_service.html | 32 ++ app/partials/mobile/photo_modal.html | 22 ++ app/partials/mobile/profile_edit_modal.html | 27 ++ app/partials/mobile/video_modal.html | 21 ++ app/partials/mobile/welcome.html | 56 ++++ app/webogram.appcache | 2 +- 73 files changed, 1730 insertions(+), 219 deletions(-) create mode 100644 app/css/desktop.css rename app/css/{app_mobile.css => mobile.css} (99%) rename app/partials/{ => desktop}/changelog_modal.html (100%) rename app/partials/{ => desktop}/chat_create_modal.html (100%) rename app/partials/{ => desktop}/chat_edit_modal.html (100%) rename app/partials/{ => desktop}/chat_modal.html (100%) rename app/partials/{ => desktop}/confirm_modal.html (100%) rename app/partials/{ => desktop}/contacts_modal.html (100%) rename app/partials/{ => desktop}/country_select_modal.html (100%) rename app/partials/{ => desktop}/dialog.html (100%) rename app/partials/{ => desktop}/edit_contact_modal.html (100%) rename app/partials/{ => desktop}/error_modal.html (100%) rename app/partials/{ => desktop}/full_gif.html (100%) rename app/partials/{ => desktop}/full_photo.html (100%) rename app/partials/{ => desktop}/full_video.html (100%) rename app/partials/{ => desktop}/head.html (100%) rename app/partials/{ => desktop}/im.html (100%) rename app/partials/{ => desktop}/import_contact_modal.html (100%) rename app/partials/{ => desktop}/login.html (100%) rename app/partials/{ => desktop}/message.html (100%) rename app/partials/{ => desktop}/message_attach_audio.html (100%) rename app/partials/{ => desktop}/message_attach_contact.html (100%) rename app/partials/{ => desktop}/message_attach_document.html (100%) rename app/partials/{ => desktop}/message_attach_map.html (100%) rename app/partials/{ => desktop}/message_attach_pending.html (100%) rename app/partials/{ => desktop}/message_attach_photo.html (100%) rename app/partials/{ => desktop}/message_attach_video.html (100%) rename app/partials/{ => desktop}/message_service.html (100%) rename app/partials/{ => desktop}/peer_select.html (100%) rename app/partials/{ => desktop}/photo_modal.html (100%) rename app/partials/{ => desktop}/profile_edit_modal.html (100%) rename app/partials/{ => desktop}/settings_modal.html (100%) rename app/partials/{ => desktop}/user_modal.html (100%) rename app/partials/{ => desktop}/video_modal.html (100%) rename app/partials/{ => desktop}/welcome.html (100%) create mode 100644 app/partials/mobile/changelog_modal.html create mode 100644 app/partials/mobile/chat_create_modal.html create mode 100644 app/partials/mobile/chat_edit_modal.html create mode 100644 app/partials/mobile/confirm_modal.html create mode 100644 app/partials/mobile/dialog.html create mode 100644 app/partials/mobile/edit_contact_modal.html create mode 100644 app/partials/mobile/error_modal.html create mode 100644 app/partials/mobile/full_gif.html create mode 100644 app/partials/mobile/full_photo.html create mode 100644 app/partials/mobile/full_video.html create mode 100644 app/partials/mobile/head.html create mode 100644 app/partials/mobile/im.html create mode 100644 app/partials/mobile/import_contact_modal.html create mode 100644 app/partials/mobile/login.html create mode 100644 app/partials/mobile/message.html create mode 100644 app/partials/mobile/message_attach_audio.html create mode 100644 app/partials/mobile/message_attach_contact.html create mode 100644 app/partials/mobile/message_attach_document.html create mode 100644 app/partials/mobile/message_attach_map.html create mode 100644 app/partials/mobile/message_attach_pending.html create mode 100644 app/partials/mobile/message_attach_photo.html create mode 100644 app/partials/mobile/message_attach_video.html create mode 100644 app/partials/mobile/message_service.html create mode 100644 app/partials/mobile/photo_modal.html create mode 100644 app/partials/mobile/profile_edit_modal.html create mode 100644 app/partials/mobile/video_modal.html create mode 100644 app/partials/mobile/welcome.html diff --git a/app/css/desktop.css b/app/css/desktop.css new file mode 100644 index 00000000..e69de29b diff --git a/app/css/app_mobile.css b/app/css/mobile.css similarity index 99% rename from app/css/app_mobile.css rename to app/css/mobile.css index 855f6739..38f15631 100644 --- a/app/css/app_mobile.css +++ b/app/css/mobile.css @@ -1,5 +1,3 @@ -@media (max-width: 479px) { - html { background: #FFF; } @@ -1286,7 +1284,4 @@ a.mobile_modal_action .tg_checkbox_label { } .countries_scrollable_wrap a.countries_modal_country { padding: 8px 8px; -} - - -} +} \ No newline at end of file diff --git a/app/index.html b/app/index.html index 503713d9..8828f037 100644 --- a/app/index.html +++ b/app/index.html @@ -1,5 +1,5 @@ - + @@ -10,7 +10,6 @@ - diff --git a/app/js/app.js b/app/js/app.js index c382122c..3f4f3b4a 100644 --- a/app/js/app.js +++ b/app/js/app.js @@ -53,21 +53,9 @@ config(['$locationProvider', '$routeProvider', '$compileProvider', 'StorageProvi StorageProvider.setPrefix('t_'); } - $routeProvider.when('/', {templateUrl: 'partials/welcome.html', controller: 'AppWelcomeController'}); - $routeProvider.when('/login', {templateUrl: 'partials/login.html', controller: 'AppLoginController'}); - $routeProvider.when('/im', {templateUrl: 'partials/im.html', controller: 'AppIMController', reloadOnSearch: false}); + $routeProvider.when('/', {templateUrl: templateUrl('welcome'), controller: 'AppWelcomeController'}); + $routeProvider.when('/login', {templateUrl: templateUrl('login'), controller: 'AppLoginController'}); + $routeProvider.when('/im', {templateUrl: templateUrl('im'), controller: 'AppIMController', reloadOnSearch: false}); $routeProvider.otherwise({redirectTo: '/'}); }]); - - -(function () { - var classes = [ - Config.Navigator.osX ? 'osx' : 'non_osx', - Config.Navigator.retina ? 'is_2x' : 'is_1x' - ]; - if (Config.Modes.ios_standalone) { - classes.push('ios_standalone'); - } - $(document.body).addClass(classes.join(' ')); -})(); \ No newline at end of file diff --git a/app/js/controllers.js b/app/js/controllers.js index 4a8dbcac..df1f32bc 100644 --- a/app/js/controllers.js +++ b/app/js/controllers.js @@ -42,16 +42,13 @@ angular.module('myApp.controllers', []) $scope.callPending = {}; $scope.chooseCountry = function () { - var tUrl = 'partials/country_select_modal.html', - className = 'countries_modal_window page_modal'; - - if (Config.Navigator.mobile) { - tUrl = 'partials/mobile/country_select_modal.html'; + var className = 'countries_modal_window page_modal'; + if (Config.Mobile) { className += ' mobile_modal'; } var modal = $modal.open({ - templateUrl: tUrl, + templateUrl: templateUrl('country_select_modal'), controller: 'CountrySelectModalController', windowClass: className }); @@ -62,7 +59,7 @@ angular.module('myApp.controllers', []) function initPhoneCountry () { var langCode = (navigator.language || '').toLowerCase(), countryIso2 = Config.LangCountries[langCode], - shouldPregenerate = !Config.Navigator.mobile; + shouldPregenerate = !Config.Mobile; if (['en', 'en-us', 'en-uk'].indexOf(langCode) == -1) { if (countryIso2 !== undefined) { @@ -316,16 +313,13 @@ angular.module('myApp.controllers', []) $scope.historyState = {selectActions: false, typing: []}; $scope.openSettings = function () { - var tUrl = 'partials/settings_modal.html', - className = 'settings_modal_window page_modal'; - - if (Config.Navigator.mobile) { - tUrl = 'partials/mobile/settings_modal.html'; + var className = 'settings_modal_window page_modal'; + if (Config.Mobile) { className += ' mobile_modal'; } $modal.open({ - templateUrl: tUrl, + templateUrl: templateUrl('settings_modal'), controller: 'SettingsModalController', windowClass: className }); @@ -347,7 +341,7 @@ angular.module('myApp.controllers', []) scope.userIDs = userIDs; $modal.open({ - templateUrl: 'partials/chat_create_modal.html', + templateUrl: templateUrl('chat_create_modal'), controller: 'ChatCreateModalController', scope: scope, windowClass: 'group_edit_modal_window' @@ -535,7 +529,7 @@ angular.module('myApp.controllers', []) } }); - if (Config.Navigator.mobile) { + if (Config.Mobile) { $scope.$watch('curDialog.peer', function () { $scope.$broadcast('ui_dialogs_update') }); @@ -879,7 +873,7 @@ angular.module('myApp.controllers', []) var curJump = jump, curMoreJump = moreJump, inputMediaFilter = $scope.historyFilter.mediaType && {_: inputMediaFilters[$scope.historyFilter.mediaType]}, - limit = Config.Navigator.mobile ? 20 : 0, + limit = Config.Mobile ? 20 : 0, getMessagesPromise = inputMediaFilter ? AppMessagesManager.getSearch($scope.curDialog.inputPeer, '', inputMediaFilter, maxID, limit) : AppMessagesManager.getHistory($scope.curDialog.inputPeer, maxID, limit); @@ -920,7 +914,7 @@ angular.module('myApp.controllers', []) else if (forceRecent) { limit = 10; } - else if (Config.Navigator.mobile) { + else if (Config.Mobile) { limit = 20; } @@ -1330,7 +1324,7 @@ angular.module('myApp.controllers', []) AppPhotosManager.downloadPhoto($scope.photoID); }; - if (!$scope.messageID || Config.Navigator.mobile) { + if (!$scope.messageID || Config.Mobile) { $scope.nav.next = function () { $modalInstance.close(); } @@ -1352,7 +1346,7 @@ angular.module('myApp.controllers', []) }; - if (Config.Navigator.mobile) { + if (Config.Mobile) { $scope.canForward = true; $scope.canDelete = true; return; @@ -1676,7 +1670,7 @@ angular.module('myApp.controllers', []) }; $modal.open({ - templateUrl: edit ? 'partials/edit_contact_modal.html' : 'partials/import_contact_modal.html', + templateUrl: templateUrl(edit ? 'edit_contact_modal' : 'import_contact_modal'), controller: 'ImportContactModalController', windowClass: 'import_contact_modal_window page_modal', scope: scope @@ -1873,7 +1867,7 @@ angular.module('myApp.controllers', []) scope.chatID = $scope.chatID; $modal.open({ - templateUrl: 'partials/chat_edit_modal.html', + templateUrl: templateUrl('chat_edit_modal'), controller: 'ChatEditModalController', scope: scope, windowClass: 'group_edit_modal_window' @@ -1966,7 +1960,7 @@ angular.module('myApp.controllers', []) $scope.editProfile = function () { $modal.open({ - templateUrl: 'partials/profile_edit_modal.html', + templateUrl: templateUrl('profile_edit_modal'), controller: 'ProfileEditModalController', windowClass: 'profile_edit_modal_window page_modal' }); diff --git a/app/js/directives.js b/app/js/directives.js index 6eee4a3e..cb777e31 100644 --- a/app/js/directives.js +++ b/app/js/directives.js @@ -15,61 +15,61 @@ angular.module('myApp.directives', ['myApp.filters']) .directive('myHead', function() { return { restrict: 'AE', - templateUrl: 'partials/head.html' + templateUrl: templateUrl('head') }; }) .directive('myDialog', function() { return { restrict: 'AE', - templateUrl: 'partials/dialog.html' + templateUrl: templateUrl('dialog') }; }) .directive('myMessage', function() { return { - templateUrl: 'partials/message.html' + templateUrl: templateUrl('message') }; }) .directive('myServiceMessage', function() { return { - templateUrl: 'partials/message_service.html' + templateUrl: templateUrl('message_service') }; }) .directive('myMessagePhoto', function() { return { - templateUrl: 'partials/message_attach_photo.html' + templateUrl: templateUrl('message_attach_photo') }; }) .directive('myMessageVideo', function() { return { - templateUrl: 'partials/message_attach_video.html' + templateUrl: templateUrl('message_attach_video') }; }) .directive('myMessageDocument', function() { return { - templateUrl: 'partials/message_attach_document.html' + templateUrl: templateUrl('message_attach_document') }; }) .directive('myMessageAudio', function() { return { - templateUrl: 'partials/message_attach_audio.html' + templateUrl: templateUrl('message_attach_audio') }; }) .directive('myMessageMap', function() { return { - templateUrl: 'partials/message_attach_map.html' + templateUrl: templateUrl('message_attach_map') }; }) .directive('myMessageContact', function() { return { - templateUrl: 'partials/message_attach_contact.html' + templateUrl: templateUrl('message_attach_contact') }; }) .directive('myMessagePending', function() { return { - templateUrl: 'partials/message_attach_pending.html' + templateUrl: templateUrl('message_attach_pending') }; }) @@ -241,7 +241,7 @@ angular.module('myApp.directives', ['myApp.filters']) dialogsColWrap = $('.im_dialogs_col_wrap')[0], scrollableWrap = $('.im_dialogs_scrollable_wrap', element)[0], headWrap = $('.tg_page_head')[0], - panelWrapSelector = Config.Navigator.mobile && attrs.modal + panelWrapSelector = Config.Mobile && attrs.modal ? '.mobile_modal_body .im_dialogs_panel' : '.im_dialogs_panel', panelWrap = $(panelWrapSelector)[0], @@ -311,7 +311,7 @@ angular.module('myApp.directives', ['myApp.filters']) $(element).css({ height: $($window).height() - (panelWrap ? panelWrap.offsetHeight : 58) - - (Config.Navigator.mobile ? 46 : 200) + (Config.Mobile ? 46 : 200) }); updateScroller(); return; @@ -367,7 +367,7 @@ angular.module('myApp.directives', ['myApp.filters']) height: $($window).height() - (panelWrap && panelWrap.offsetHeight || 0) - (searchWrap && searchWrap.offsetHeight || 0) - - (Config.Navigator.mobile ? 64 : 200) + (Config.Mobile ? 64 : 200) }); $(contactsWrap).nanoScroller(); } @@ -401,7 +401,7 @@ angular.module('myApp.directives', ['myApp.filters']) height: $($window).height() - (panelWrap && panelWrap.offsetHeight || 0) - (searchWrap && searchWrap.offsetHeight || 0) - - (Config.Navigator.mobile ? 46 + 18 : 200) + - (Config.Mobile ? 46 + 18 : 200) }); $(countriesWrap).nanoScroller(); } @@ -679,7 +679,7 @@ angular.module('myApp.directives', ['myApp.filters']) var marginTop = scrollableWrap.offsetHeight - historyMessagesEl.offsetHeight - 20 - - (Config.Navigator.mobile ? 0 : 49); + - (Config.Mobile ? 0 : 49); if (historyMessagesEl.offsetHeight > 0 && marginTop > 0) { $(historyMessagesEl).css({marginTop: marginTop}); @@ -743,7 +743,7 @@ angular.module('myApp.directives', ['myApp.filters']) var self = this; $scope.$apply(function () { $scope.draftMessage.files = Array.prototype.slice.call(self.files); - $scope.draftMessage.isMedia = $(self).hasClass('im_media_attach_input') || Config.Navigator.mobile; + $scope.draftMessage.isMedia = $(self).hasClass('im_media_attach_input') || Config.Mobile; setTimeout(function () { try { self.value = ''; @@ -1054,7 +1054,7 @@ angular.module('myApp.directives', ['myApp.filters']) return { link: link, transclude: true, - templateUrl: 'partials/full_photo.html', + templateUrl: templateUrl('full_photo'), scope: { fullPhoto: '=', thumbLocation: '=' @@ -1133,7 +1133,7 @@ angular.module('myApp.directives', ['myApp.filters']) return { link: link, transclude: true, - templateUrl: 'partials/full_video.html', + templateUrl: templateUrl('full_video'), scope: { video: '=' } @@ -1196,7 +1196,7 @@ angular.module('myApp.directives', ['myApp.filters']) return { link: link, - templateUrl: 'partials/full_gif.html', + templateUrl: templateUrl('full_gif'), scope: { document: '=' } @@ -1393,7 +1393,7 @@ angular.module('myApp.directives', ['myApp.filters']) function link($scope, element, attrs) { attrs.$observe('myModalWidth', function (newW) { - $(element[0].parentNode.parentNode).css({width: parseInt(newW) + (Config.Navigator.mobile ? 0 : 36)}); + $(element[0].parentNode.parentNode).css({width: parseInt(newW) + (Config.Mobile ? 0 : 36)}); }); }; @@ -1496,7 +1496,7 @@ angular.module('myApp.directives', ['myApp.filters']) function link($scope, element, attrs) { var updateMargin = function () { - if (Config.Navigator.mobile && + if (Config.Mobile && $(element[0].parentNode.parentNode.parentNode).hasClass('page_modal')) { return; } diff --git a/app/js/filters.js b/app/js/filters.js index 6f0f428a..c7e9afe0 100644 --- a/app/js/filters.js +++ b/app/js/filters.js @@ -78,7 +78,7 @@ angular.module('myApp.filters', []) .filter('time', ['$filter', function($filter) { var cachedDates = {}, dateFilter = $filter('date'), - format = Config.Navigator.mobile ? 'HH:mm' : 'HH:mm:ss'; + format = Config.Mobile ? 'HH:mm' : 'HH:mm:ss'; return function (timestamp) { if (cachedDates[timestamp]) { diff --git a/app/js/init.js b/app/js/init.js index 0aea81b7..2311d528 100644 --- a/app/js/init.js +++ b/app/js/init.js @@ -1,4 +1,4 @@ -;(function () { +;(function initAutoUpgrade () { // Prevent click-jacking try { @@ -61,3 +61,29 @@ scheduleUpdate(3000); window.addEventListener('load', attach); })(); + +(function initApplication () { + var classes = [ + Config.Navigator.osX ? 'osx' : 'non_osx', + Config.Navigator.retina ? 'is_2x' : 'is_1x' + ]; + if (Config.Modes.ios_standalone) { + classes.push('ios_standalone'); + } + $(document.body).addClass(classes.join(' ')); + + ConfigStorage.get('current_layout', function (layout) { + switch (layout) { + case 'mobile': Config.Mobile = true; break; + case 'desktop': Config.Mobile = false; break; + default: Config.Mobile = Config.Mobile; break; + } + + $('head').append( + '' + ); + $(document).ready(function() { + angular.bootstrap(document, ['myApp']); + }); + }); +})(); \ No newline at end of file diff --git a/app/js/lib/config.js b/app/js/lib/config.js index 9d33d8a5..2ec5cbd7 100644 --- a/app/js/lib/config.js +++ b/app/js/lib/config.js @@ -62,3 +62,132 @@ Config.EmojiCategorySpritesheetDimens = [[7, 27], [4, 29], [7, 33], [3, 34], [6, Config.CountryCodes = [["AB", "Abkhazia", "+7 840", "+7 940", "+995 44"], ["AF", "Afghanistan", "+93"], ["AX", "Åland Islands", "+358 18"], ["AL", "Albania", "+355"], ["DZ", "Algeria", "+213"], ["AS", "American Samoa", "+1 684"], ["AD", "Andorra", "+376"], ["AO", "Angola", "+244"], ["AI", "Anguilla", "+1 264"], ["AG", "Antigua and Barbuda", "+1 268"], ["AR", "Argentina", "+54"], ["AM", "Armenia", "+374"], ["AW", "Aruba", "+297"], ["SH", "Ascension", "+247"], ["AU", "Australia", "+61"], ["AU", "Australian External Territories", "+672"], ["AT", "Austria", "+43"], ["AZ", "Azerbaijan", "+994"], ["BS", "Bahamas", "+1 242"], ["BH", "Bahrain", "+973"], ["BD", "Bangladesh", "+880"], ["BB", "Barbados", "+1 246"], ["AG", "Barbuda", "+1 268"], ["BY", "Belarus", "+375"], ["BE", "Belgium", "+32"], ["BZ", "Belize", "+501"], ["BJ", "Benin", "+229"], ["BM", "Bermuda", "+1 441"], ["BT", "Bhutan", "+975"], ["BO", "Bolivia", "+591"], ["BQ", "Bonaire", "+599 7"], ["BA", "Bosnia and Herzegovina", "+387"], ["BW", "Botswana", "+267"], ["BR", "Brazil", "+55"], ["IO", "British Indian Ocean Territory", "+246"], ["VG", "British Virgin Islands", "+1 284"], ["BN", "Brunei Darussalam", "+673"], ["BG", "Bulgaria", "+359"], ["BF", "Burkina Faso", "+226"], ["MY", "Burma", "+95"], ["BI", "Burundi", "+257"], ["KH", "Cambodia", "+855"], ["CM", "Cameroon", "+237"], ["CA", "Canada", "+1"], ["CV", "Cape Verde", "+238"], ["KY", "Cayman Islands", "+1 345"], ["CF", "Central African Republic", "+236"], ["TD", "Chad", "+235"], ["CL", "Chile", "+56"], ["CN", "China", "+86"], ["CX", "Christmas Island", "+61"], ["CC", "Cocos (Keeling) Islands", "+61"], ["CO", "Colombia", "+57"], ["KM", "Comoros", "+269"], ["CG", "Congo", "+242"], ["CD", "Congo, Democratic Republic of the (Zaire)", "+243"], ["CK", "Cook Islands", "+682"], ["CR", "Costa Rica", "+506"], ["CI", "Côte d'Ivoire", "+225"], ["HR", "Croatia", "+385"], ["CU", "Cuba", "+53"], ["CW", "Curaçao", "+599 9"], ["CY", "Cyprus", "+357"], ["CZ", "Czech Republic", "+420"], ["DK", "Denmark", "+45"], ["DG", "Diego Garcia", "+246"], ["DJ", "Djibouti", "+253"], ["DM", "Dominica", "+1 767"], ["DO", "Dominican Republic", "+1 809", "+1 829", "+1 849"], ["TL", "East Timor", "+670"], ["EC", "Ecuador", "+593"], ["EG", "Egypt", "+20"], ["SV", "El Salvador", "+503"], ["GQ", "Equatorial Guinea", "+240"], ["ER", "Eritrea", "+291"], ["EE", "Estonia", "+372"], ["ET", "Ethiopia", "+251"], ["FK", "Falkland Islands", "+500"], ["FO", "Faroe Islands", "+298"], ["FJ", "Fiji", "+679"], ["FI", "Finland", "+358"], ["FR", "France", "+33"], ["GF", "French Guiana", "+594"], ["PF", "French Polynesia", "+689"], ["GA", "Gabon", "+241"], ["GM", "Gambia", "+220"], ["GE", "Georgia", "+995"], ["DE", "Germany", "+49"], ["GH", "Ghana", "+233"], ["GI", "Gibraltar", "+350"], ["GR", "Greece", "+30"], ["GL", "Greenland", "+299"], ["GD", "Grenada", "+1 473"], ["GP", "Guadeloupe", "+590"], ["GU", "Guam", "+1 671"], ["GT", "Guatemala", "+502"], ["GG", "Guernsey", "+44"], ["GN", "Guinea", "+224"], ["GW", "Guinea-Bissau", "+245"], ["GY", "Guyana", "+592"], ["HT", "Haiti", "+509"], ["HN", "Honduras", "+504"], ["HK", "Hong Kong", "+852"], ["HU", "Hungary", "+36"], ["IS", "Iceland", "+354"], ["IN", "India", "+91"], ["ID", "Indonesia", "+62"], ["IR", "Iran", "+98"], ["IQ", "Iraq", "+964"], ["IE", "Ireland", "+353"], ["IL", "Israel", "+972"], ["IT", "Italy", "+39"], ["JM", "Jamaica", "+1 876"], ["SJ", "Jan Mayen", "+47 79"], ["JP", "Japan", "+81"], ["JE", "Jersey", "+44"], ["JO", "Jordan", "+962"], ["KZ", "Kazakhstan", "+7 6", "+7 7"], ["KE", "Kenya", "+254"], ["KI", "Kiribati", "+686"], ["KP", "Korea, North", "+850"], ["KR", "Korea, South", "+82"], ["KW", "Kuwait", "+965"], ["KG", "Kyrgyzstan", "+996"], ["LA", "Laos", "+856"], ["LV", "Latvia", "+371"], ["LB", "Lebanon", "+961"], ["LS", "Lesotho", "+266"], ["LR", "Liberia", "+231"], ["LY", "Libya", "+218"], ["LI", "Liechtenstein", "+423"], ["LT", "Lithuania", "+370"], ["LU", "Luxembourg", "+352"], ["MO", "Macau", "+853"], ["MK", "Macedonia", "+389"], ["MG", "Madagascar", "+261"], ["MW", "Malawi", "+265"], ["MY", "Malaysia", "+60"], ["MV", "Maldives", "+960"], ["ML", "Mali", "+223"], ["MT", "Malta", "+356"], ["MH", "Marshall Islands", "+692"], ["MQ", "Martinique", "+596"], ["MR", "Mauritania", "+222"], ["MU", "Mauritius", "+230"], ["YT", "Mayotte", "+262"], ["MX", "Mexico", "+52"], ["FM", "Micronesia, Federated States of", "+691"], ["MD", "Moldova", "+373"], ["MC", "Monaco", "+377"], ["MN", "Mongolia", "+976"], ["ME", "Montenegro", "+382"], ["MS", "Montserrat", "+1 664"], ["MA", "Morocco", "+212"], ["MZ", "Mozambique", "+258"], ["NA", "Namibia", "+264"], ["NR", "Nauru", "+674"], ["NP", "Nepal", "+977"], ["NL", "Netherlands", "+31"], ["NC", "New Caledonia", "+687"], ["NZ", "New Zealand", "+64"], ["NI", "Nicaragua", "+505"], ["NE", "Niger", "+227"], ["NG", "Nigeria", "+234"], ["NU", "Niue", "+683"], ["NF", "Norfolk Island", "+672"], ["MP", "Northern Mariana Islands", "+1 670"], ["NO", "Norway", "+47"], ["OM", "Oman", "+968"], ["PK", "Pakistan", "+92"], ["PW", "Palau", "+680"], ["PS", "Palestinian territories", "+970"], ["PA", "Panama", "+507"], ["PG", "Papua New Guinea", "+675"], ["PY", "Paraguay", "+595"], ["PE", "Peru", "+51"], ["PH", "Philippines", "+63"], ["PN", "Pitcairn Islands", "+64"], ["PL", "Poland", "+48"], ["PT", "Portugal", "+351"], ["PR", "Puerto Rico", "+1 787", "+1 939"], ["QA", "Qatar", "+974"], ["RE", "Réunion", "+262"], ["RO", "Romania", "+40"], ["RU", "Russia", "+7"], ["RW", "Rwanda", "+250"], ["BL", "Saint Barthélemy", "+590"], ["SH", "Saint Helena", "+290"], ["KN", "Saint Kitts and Nevis", "+1 869"], ["LC", "Saint Lucia", "+1 758"], ["MF", "Saint Martin (France)", "+590"], ["PM", "Saint Pierre and Miquelon", "+508"], ["VC", "Saint Vincent and the Grenadines", "+1 784"], ["WS", "Samoa", "+685"], ["SM", "San Marino", "+378"], ["ST", "São Tomé and Príncipe", "+239"], ["SA", "Saudi Arabia", "+966"], ["SN", "Senegal", "+221"], ["RS", "Serbia", "+381"], ["SC", "Seychelles", "+248"], ["SL", "Sierra Leone", "+232"], ["SG", "Singapore", "+65"], ["BQ", "Sint Eustatius", "+599 3"], ["SX", "Sint Maarten (Netherlands)", "+1 721"], ["SK", "Slovakia", "+421"], ["SI", "Slovenia", "+386"], ["SB", "Solomon Islands", "+677"], ["SO", "Somalia", "+252"], ["ZA", "South Africa", "+27"], ["GS", "South Georgia and the South Sandwich Islands", "+500"], [false, "South Ossetia", "+995 34"], ["SS", "South Sudan", "+211"], ["ES", "Spain", "+34"], ["LK", "Sri Lanka", "+94"], ["SD", "Sudan", "+249"], ["SR", "Suriname", "+597"], ["SJ", "Svalbard", "+47 79"], ["SZ", "Swaziland", "+268"], ["SE", "Sweden", "+46"], ["CH", "Switzerland", "+41"], ["SY", "Syria", "+963"], ["TW", "Taiwan", "+886"], ["TJ", "Tajikistan", "+992"], ["TZ", "Tanzania", "+255"], ["TH", "Thailand", "+66"], ["TG", "Togo", "+228"], ["TK", "Tokelau", "+690"], ["TO", "Tonga", "+676"], ["TT", "Trinidad and Tobago", "+1 868"], ["TN", "Tunisia", "+216"], ["TR", "Turkey", "+90"], ["TM", "Turkmenistan", "+993"], ["TC", "Turks and Caicos Islands", "+1 649"], ["TV", "Tuvalu", "+688"], ["UG", "Uganda", "+256"], ["UA", "Ukraine", "+380"], ["AE", "United Arab Emirates", "+971"], ["UK", "United Kingdom", "+44"], ["US", "United States", "+1"], ["UY", "Uruguay", "+598"], ["VI", "US Virgin Islands", "+1 340"], ["UZ", "Uzbekistan", "+998"], ["VU", "Vanuatu", "+678"], ["VE", "Venezuela", "+58"], ["VA", "Vatican City State (Holy See)", "+39 06 698", "+379"], ["VN", "Vietnam", "+84"], ["WF", "Wallis and Futuna", "+681"], ["YE", "Yemen", "+967"], ["ZM", "Zambia", "+260"], [false, "Zanzibar", "+255"], ["ZW", "Zimbabwe", "+263"] ]; Config.LangCountries = {"es": "ES", "ru": "RU", "en": "US", "de": "DE", "it": "IT", "nl": "NL", "fr": "FR", "ca": "ES", "es-419": "MX", "ar": "SA", "he": "IL", "tr": "TR", "id": "ID", "pl": "PL"}; + + + + + +// ConfigStorage +(function (window) { + var keyPrefix = ''; + var noPrefix = false; + var cache = {}; + var useCs = !!(window.chrome && chrome.storage && chrome.storage.local); + var useLs = !useCs && !!window.localStorage; + + function storageSetPrefix (newPrefix) { + keyPrefix = newPrefix; + } + + function storageSetNoPrefix() { + noPrefix = true; + } + + function storageGetPrefix () { + if (noPrefix) { + noPrefix = false; + return ''; + } + return keyPrefix; + } + + function storageGetValue() { + var keys = Array.prototype.slice.call(arguments), + callback = keys.pop(), + result = [], + single = keys.length == 1, + allFound = true, + prefix = storageGetPrefix(), + i, key; + + for (i = 0; i < keys.length; i++) { + key = keys[i] = prefix + keys[i]; + if (cache[key] !== undefined) { + result.push(cache[key]); + } + else if (useLs) { + var value = localStorage.getItem(key); + value = (value === undefined || value === null) ? false : JSON.parse(value); + result.push(cache[key] = value); + } + else if (!useCs) { + result.push(cache[key] = false); + } + else { + allFound = false; + } + } + + if (allFound) { + return callback(single ? result[0] : result); + } + + chrome.storage.local.get(keys, function (resultObj) { + var value; + result = []; + for (i = 0; i < keys.length; i++) { + key = keys[i]; + value = resultObj[key]; + value = value === undefined || value === null ? false : JSON.parse(value); + result.push(cache[key] = value); + } + + callback(single ? result[0] : result); + }); + }; + + function storageSetValue(obj, callback) { + var keyValues = {}, + prefix = storageGetPrefix(), + key, value; + + for (key in obj) { + if (obj.hasOwnProperty(key)) { + value = obj[key]; + key = prefix + key; + cache[key] = value; + value = JSON.stringify(value); + if (useLs) { + localStorage.setItem(key, value); + } else { + keyValues[key] = value; + } + } + } + + if (useLs || !useCs) { + if (callback) { + callback(); + } + return; + } + + chrome.storage.local.set(keyValues, callback); + }; + + function storageRemoveValue () { + var keys = Array.prototype.slice.call(arguments), + prefix = storageGetPrefix(), + i, key; + + for (i = 0; i < keys.length; i++) { + key = keys[i] = prefix + keys[i]; + delete cache[key]; + if (useLs) { + localStorage.removeItem(key); + } + } + if (useCs) { + chrome.storage.local.remove(keys); + } + }; + + window.ConfigStorage = { + prefix: storageSetPrefix, + noPrefix: storageSetNoPrefix, + get: storageGetValue, + set: storageSetValue, + remove: storageRemoveValue + }; + +})(this); diff --git a/app/js/lib/ng_utils.js b/app/js/lib/ng_utils.js index c0df4d27..aea2a9bc 100644 --- a/app/js/lib/ng_utils.js +++ b/app/js/lib/ng_utils.js @@ -9,127 +9,26 @@ angular.module('izhukov.utils', []) .provider('Storage', function () { - var keyPrefix = ''; - var cache = {}; - var useCs = !!(window.chrome && chrome.storage && chrome.storage.local); - var useLs = !useCs && !!window.localStorage; - this.setPrefix = function (newPrefix) { - keyPrefix = newPrefix + ConfigStorage.prefix(newPrefix); }; this.$get = ['$q', function ($q) { - function getValue() { - var keys = Array.prototype.slice.call(arguments), - result = [], - single = keys.length == 1, - allFound = true; - - for (var i = 0; i < keys.length; i++) { - keys[i] = keyPrefix + keys[i]; - } - - angular.forEach(keys, function (key) { - if (cache[key] !== undefined) { - result.push(cache[key]); - } - else if (useLs) { - var value = localStorage.getItem(key); - value = (value === undefined || value === null) ? false : JSON.parse(value); - result.push(cache[key] = value); - } - else if (!useCs) { - result.push(cache[key] = false); - } - else { - allFound = false; - } - }); - - if (allFound) { - return $q.when(single ? result[0] : result); - } - - var deferred = $q.defer(); - - chrome.storage.local.get(keys, function (resultObj) { - result = []; - angular.forEach(keys, function (key) { - var value = resultObj[key]; - value = value === undefined || value === null ? false : JSON.parse(value); - result.push(cache[key] = value); - }); - - deferred.resolve(single ? result[0] : result); - }); - - return deferred.promise; - }; - - function setValue(obj) { - var keyValues = {}; - angular.forEach(obj, function (value, key) { - keyValues[keyPrefix + key] = JSON.stringify(value); - cache[keyPrefix + key] = value; - }); - - if (useLs) { - angular.forEach(keyValues, function (value, key) { - localStorage.setItem(key, value); - }); - return $q.when(); - } - - if (!useCs) { - return $q.when(); - } - - var deferred = $q.defer(); - - chrome.storage.local.set(keyValues, function () { - deferred.resolve(); - }); - - return deferred.promise; - }; - - function removeValue () { - var keys = Array.prototype.slice.call(arguments); - - for (var i = 0; i < keys.length; i++) { - keys[i] = keyPrefix + keys[i]; - } - - angular.forEach(keys, function(key){ - delete cache[key]; - }); + var methods = {}; + angular.forEach(['get', 'set', 'remove'], function (methodName) { + methods[methodName] = function () { + var deferred = $q.defer(), + args = Array.prototype.slice.call(arguments); - if (useLs) { - angular.forEach(keys, function(key){ - localStorage.removeItem(key); + args.push(function (result) { + deferred.resolve(result); }); + ConfigStorage[methodName].apply(ConfigStorage, args); - return $q.when(); - } - - if (!useCs) { - return $q.when(); - } - - var deferred = $q.defer(); - - chrome.storage.local.remove(keys, function () { - deferred.resolve(); - }); - - return deferred.promise; - }; - - return { - get: getValue, - set: setValue, - remove: removeValue - }; + return deferred.promise; + }; + }); + return methods; }]; }) @@ -284,7 +183,7 @@ angular.module('izhukov.utils', []) } function downloadFile (url, mimeType, fileName) { - // if (Config.Navigator.mobile) { + // if (Config.Mobile) { // window.open(url, '_blank'); // return; // } diff --git a/app/js/lib/utils.js b/app/js/lib/utils.js index 1af066ea..82031834 100644 --- a/app/js/lib/utils.js +++ b/app/js/lib/utils.js @@ -135,3 +135,7 @@ if (!Function.prototype.bind) { }; } +function templateUrl (tplName) { + return 'partials/' + (Config.Navigator.mobile ? 'mobile' : 'desktop') + '/' + tplName + '.html'; +} + diff --git a/app/js/services.js b/app/js/services.js index 28381f99..a6ffe2f2 100644 --- a/app/js/services.js +++ b/app/js/services.js @@ -180,16 +180,13 @@ angular.module('myApp.services', []) var scope = $rootScope.$new(); scope.userID = userID; - var tUrl = 'partials/user_modal.html', - className = 'user_modal_window page_modal'; - - if (Config.Navigator.mobile) { - tUrl = 'partials/mobile/user_modal.html'; + var className = 'user_modal_window page_modal'; + if (Config.Mobile) { className += ' mobile_modal'; } var modalInstance = $modal.open({ - templateUrl: tUrl, + templateUrl: templateUrl('user_modal'), controller: 'UserModalController', scope: scope, windowClass: className @@ -283,7 +280,7 @@ angular.module('myApp.services', []) function openImportContact () { return $modal.open({ - templateUrl: 'partials/import_contact_modal.html', + templateUrl: templateUrl('import_contact_modal'), controller: 'ImportContactModalController', windowClass: 'import_contact_modal_window' }).result.then(function (foundUserID) { @@ -358,7 +355,7 @@ angular.module('myApp.services', []) }; function isAvailable () { - if (Config.Navigator.mobile && Config.Navigator.ffos && Config.Modes.packed) { + if (Config.Mobile && Config.Navigator.ffos && Config.Modes.packed) { try { return navigator.mozContacts && navigator.mozContacts.getAll; } catch (e) { @@ -371,7 +368,7 @@ angular.module('myApp.services', []) function openPhonebookImport () { return $modal.open({ - templateUrl: 'partials/mobile/phonebook_modal.html', + templateUrl: templateUrl('phonebook_modal'), controller: 'PhonebookModalController', windowClass: 'phonebook_modal_window page_modal mobile_modal' }); @@ -516,16 +513,13 @@ angular.module('myApp.services', []) var scope = $rootScope.$new(); scope.chatID = chatID; - var tUrl = 'partials/chat_modal.html', - className = 'chat_modal_window page_modal'; - - if (Config.Navigator.mobile) { - tUrl = 'partials/mobile/chat_modal.html'; + var className = 'chat_modal_window page_modal'; + if (Config.Mobile) { className += ' mobile_modal'; } var modalInstance = $modal.open({ - templateUrl: tUrl, + templateUrl: templateUrl('chat_modal'), controller: 'ChatModalController', scope: scope, windowClass: className @@ -2058,7 +2052,7 @@ angular.module('myApp.services', []) $rootScope.$broadcast('dialogs_update', dialog); - if ((Config.Navigator.mobile && $rootScope.selectedPeerID != peerID || $rootScope.idle.isIDLE) && + if ((Config.Mobile && $rootScope.selectedPeerID != peerID || $rootScope.idle.isIDLE) && !message.out && message.unread) { NotificationsManager.getPeerMuted(peerID).then(function (muted) { @@ -2321,7 +2315,7 @@ angular.module('myApp.services', []) function wrapForFull (photoID) { var photo = wrapForHistory(photoID), - fullWidth = $(window).width() - (Config.Navigator.mobile ? 20 : 36), + fullWidth = $(window).width() - (Config.Mobile ? 20 : 36), fullHeight = $($window).height() - 150, fullPhotoSize = choosePhotoSize(photo, fullWidth, fullHeight), full = { @@ -2347,7 +2341,7 @@ angular.module('myApp.services', []) } } - if (!Config.Navigator.mobile && full.width >= fullPhotoSize.w && full.height >= fullPhotoSize.h) { + if (!Config.Mobile && full.width >= fullPhotoSize.w && full.height >= fullPhotoSize.h) { full.width = fullPhotoSize.w; full.height = fullPhotoSize.h; } @@ -2379,7 +2373,7 @@ angular.module('myApp.services', []) } var modalInstance = $modal.open({ - templateUrl: 'partials/photo_modal.html', + templateUrl: templateUrl('photo_modal'), controller: scope.userID ? 'UserpicModalController' : 'PhotoModalController', scope: scope, windowClass: 'photo_modal_window' @@ -2534,7 +2528,7 @@ angular.module('myApp.services', []) scope.messageID = messageID; var modalInstance = $modal.open({ - templateUrl: 'partials/video_modal.html', + templateUrl: templateUrl('video_modal'), controller: 'VideoModalController', scope: scope, windowClass: 'video_modal_window' @@ -3730,7 +3724,7 @@ angular.module('myApp.services', []) shownBoxes++; var modal = $modal.open({ - templateUrl: 'partials/error_modal.html', + templateUrl: templateUrl('error_modal'), scope: scope, windowClass: options.windowClass || 'error_modal_window' }); @@ -3755,7 +3749,7 @@ angular.module('myApp.services', []) angular.extend(scope, params); var modal = $modal.open({ - templateUrl: 'partials/confirm_modal.html', + templateUrl: templateUrl('confirm_modal'), scope: scope, windowClass: options.windowClass || 'confirm_modal_window' }); @@ -3791,16 +3785,14 @@ angular.module('myApp.services', []) angular.extend(scope, options); } - var tUrl = 'partials/peer_select.html', - className = 'peer_select_window page_modal'; + var className = 'peer_select_window page_modal'; - if (Config.Navigator.mobile) { - tUrl = 'partials/mobile/peer_select.html'; + if (Config.Mobile) { className += ' mobile_modal'; } return $modal.open({ - templateUrl: tUrl, + templateUrl: templateUrl('peer_select'), controller: 'PeerSelectController', scope: scope, windowClass: className @@ -3826,16 +3818,13 @@ angular.module('myApp.services', []) scope.action = 'select'; } - var tUrl = 'partials/contacts_modal.html', - className = 'contacts_modal_window page_modal'; - - if (Config.Navigator.mobile) { - tUrl = 'partials/mobile/contacts_modal.html'; + var className = 'contacts_modal_window page_modal'; + if (Config.Mobile) { className += ' mobile_modal'; } return $modal.open({ - templateUrl: tUrl, + templateUrl: templateUrl('contacts_modal'), controller: 'ContactsModalController', scope: scope, windowClass: className @@ -3906,7 +3895,7 @@ angular.module('myApp.services', []) }; $modal.open({ - templateUrl: 'partials/changelog_modal.html', + templateUrl: templateUrl('changelog_modal'), scope: $scope, windowClass: 'changelog_modal_window page_modal' }); diff --git a/app/partials/changelog_modal.html b/app/partials/desktop/changelog_modal.html similarity index 100% rename from app/partials/changelog_modal.html rename to app/partials/desktop/changelog_modal.html diff --git a/app/partials/chat_create_modal.html b/app/partials/desktop/chat_create_modal.html similarity index 100% rename from app/partials/chat_create_modal.html rename to app/partials/desktop/chat_create_modal.html diff --git a/app/partials/chat_edit_modal.html b/app/partials/desktop/chat_edit_modal.html similarity index 100% rename from app/partials/chat_edit_modal.html rename to app/partials/desktop/chat_edit_modal.html diff --git a/app/partials/chat_modal.html b/app/partials/desktop/chat_modal.html similarity index 100% rename from app/partials/chat_modal.html rename to app/partials/desktop/chat_modal.html diff --git a/app/partials/confirm_modal.html b/app/partials/desktop/confirm_modal.html similarity index 100% rename from app/partials/confirm_modal.html rename to app/partials/desktop/confirm_modal.html diff --git a/app/partials/contacts_modal.html b/app/partials/desktop/contacts_modal.html similarity index 100% rename from app/partials/contacts_modal.html rename to app/partials/desktop/contacts_modal.html diff --git a/app/partials/country_select_modal.html b/app/partials/desktop/country_select_modal.html similarity index 100% rename from app/partials/country_select_modal.html rename to app/partials/desktop/country_select_modal.html diff --git a/app/partials/dialog.html b/app/partials/desktop/dialog.html similarity index 100% rename from app/partials/dialog.html rename to app/partials/desktop/dialog.html diff --git a/app/partials/edit_contact_modal.html b/app/partials/desktop/edit_contact_modal.html similarity index 100% rename from app/partials/edit_contact_modal.html rename to app/partials/desktop/edit_contact_modal.html diff --git a/app/partials/error_modal.html b/app/partials/desktop/error_modal.html similarity index 100% rename from app/partials/error_modal.html rename to app/partials/desktop/error_modal.html diff --git a/app/partials/full_gif.html b/app/partials/desktop/full_gif.html similarity index 100% rename from app/partials/full_gif.html rename to app/partials/desktop/full_gif.html diff --git a/app/partials/full_photo.html b/app/partials/desktop/full_photo.html similarity index 100% rename from app/partials/full_photo.html rename to app/partials/desktop/full_photo.html diff --git a/app/partials/full_video.html b/app/partials/desktop/full_video.html similarity index 100% rename from app/partials/full_video.html rename to app/partials/desktop/full_video.html diff --git a/app/partials/head.html b/app/partials/desktop/head.html similarity index 100% rename from app/partials/head.html rename to app/partials/desktop/head.html diff --git a/app/partials/im.html b/app/partials/desktop/im.html similarity index 100% rename from app/partials/im.html rename to app/partials/desktop/im.html diff --git a/app/partials/import_contact_modal.html b/app/partials/desktop/import_contact_modal.html similarity index 100% rename from app/partials/import_contact_modal.html rename to app/partials/desktop/import_contact_modal.html diff --git a/app/partials/login.html b/app/partials/desktop/login.html similarity index 100% rename from app/partials/login.html rename to app/partials/desktop/login.html diff --git a/app/partials/message.html b/app/partials/desktop/message.html similarity index 100% rename from app/partials/message.html rename to app/partials/desktop/message.html diff --git a/app/partials/message_attach_audio.html b/app/partials/desktop/message_attach_audio.html similarity index 100% rename from app/partials/message_attach_audio.html rename to app/partials/desktop/message_attach_audio.html diff --git a/app/partials/message_attach_contact.html b/app/partials/desktop/message_attach_contact.html similarity index 100% rename from app/partials/message_attach_contact.html rename to app/partials/desktop/message_attach_contact.html diff --git a/app/partials/message_attach_document.html b/app/partials/desktop/message_attach_document.html similarity index 100% rename from app/partials/message_attach_document.html rename to app/partials/desktop/message_attach_document.html diff --git a/app/partials/message_attach_map.html b/app/partials/desktop/message_attach_map.html similarity index 100% rename from app/partials/message_attach_map.html rename to app/partials/desktop/message_attach_map.html diff --git a/app/partials/message_attach_pending.html b/app/partials/desktop/message_attach_pending.html similarity index 100% rename from app/partials/message_attach_pending.html rename to app/partials/desktop/message_attach_pending.html diff --git a/app/partials/message_attach_photo.html b/app/partials/desktop/message_attach_photo.html similarity index 100% rename from app/partials/message_attach_photo.html rename to app/partials/desktop/message_attach_photo.html diff --git a/app/partials/message_attach_video.html b/app/partials/desktop/message_attach_video.html similarity index 100% rename from app/partials/message_attach_video.html rename to app/partials/desktop/message_attach_video.html diff --git a/app/partials/message_service.html b/app/partials/desktop/message_service.html similarity index 100% rename from app/partials/message_service.html rename to app/partials/desktop/message_service.html diff --git a/app/partials/peer_select.html b/app/partials/desktop/peer_select.html similarity index 100% rename from app/partials/peer_select.html rename to app/partials/desktop/peer_select.html diff --git a/app/partials/photo_modal.html b/app/partials/desktop/photo_modal.html similarity index 100% rename from app/partials/photo_modal.html rename to app/partials/desktop/photo_modal.html diff --git a/app/partials/profile_edit_modal.html b/app/partials/desktop/profile_edit_modal.html similarity index 100% rename from app/partials/profile_edit_modal.html rename to app/partials/desktop/profile_edit_modal.html diff --git a/app/partials/settings_modal.html b/app/partials/desktop/settings_modal.html similarity index 100% rename from app/partials/settings_modal.html rename to app/partials/desktop/settings_modal.html diff --git a/app/partials/user_modal.html b/app/partials/desktop/user_modal.html similarity index 100% rename from app/partials/user_modal.html rename to app/partials/desktop/user_modal.html diff --git a/app/partials/video_modal.html b/app/partials/desktop/video_modal.html similarity index 100% rename from app/partials/video_modal.html rename to app/partials/desktop/video_modal.html diff --git a/app/partials/welcome.html b/app/partials/desktop/welcome.html similarity index 100% rename from app/partials/welcome.html rename to app/partials/desktop/welcome.html diff --git a/app/partials/mobile/changelog_modal.html b/app/partials/mobile/changelog_modal.html new file mode 100644 index 00000000..bc41f668 --- /dev/null +++ b/app/partials/mobile/changelog_modal.html @@ -0,0 +1,199 @@ +
+ + + +
+ +
+
+
+

Recent updates in Telegram Web

+
+
+
+

Telegram Web has been updated!

+
+
+ +
+ +
+

+ current version + Version 0.3.0 +

+
+
    +
  • Added online statuses automatic update
    • +
  • Fixed scrollbar invalid width bug
    • +
  • [Desktop] Added phone country detection
    • +
  • [FirefoxOS] Improved PUSH-notifications for <= 1.1
    • +
  • [FirefoxOS] Fixed emoji in notifications
    • +
  • [FirefoxOS] Fixed attachment bug for <= 1.1
    • +
  • [FirefoxOS] Added phonebook permissions handling
    • +
  • [FirefoxOS] Added ability to share Gallery photos in Telegram
    • +
  • Supported international hashtags in messages
    • +
+
+
+ +
+

+ Version 0.2.9 +

+
+
    +
  • Updated mobile layout
    • +
  • Bugfixes
    • +
+
+
+ +
+

+ Version 0.2.5 +

+
+
    +
  • Updated mobile layout
    • +
  • Improved performance
    • +
  • Improved messages grouping
    • +
  • [FirefoxOS] Fixed notifications for <= 1.1
    • +
  • [FirefoxOS] Fixed phonebook import
    • +
+
+
+ +
+

+ Version 0.2.1 +

+
+
    +
  • Improved key generation performance on slow devices
    • +
  • Added network sleep for mobile devices
    • +
  • [FirefoxOS] Added support of PUSH notifications
    • +
+
+
+ +
+

+ Version 0.2 +

+
+
    +
  • Updated contacts list, added edit mode
    • +
  • First Firefox OS release. See Firefox Marketplace
    • +
+
+
+ +
+

+ Version 0.1.9 +

+
+
    +
  • Improvements of performance
    • +
  • Bugfixes
    • +
+
+
+ +
+

+ Version 0.1.8 +

+
+
    +
  • Improved mobile layout
    • +
  • Bugfixes
    • +
+
+
+ +
+

+ Version 0.1.7 +

+
+
    +
  • Improved mobile layout
    • +
  • Added file cache for Firefox and Android
    • +
  • New design for forwarded messages
    • +
  • Hash-tags support
    • +
  • Messaging bugfixes
    • +
+
+
+ +
+

+ Version 0.1.6 +

+
+
    +
  • Added search of messages
    • +
  • Improved performance of chats with lots of unread messages
    • +
  • Bugfixes
    • +
+
+
+ +
+

+ Version 0.1.5 +

+
+
    +
  • Added registration
    • +
  • Improved experience for newly registered users
    • +
+
+
+ +
+

+ Version 0.1.4 +

+
+
    +
  • Browse userpic history (click on the photo in user info)
    • +
  • New GitHub, Twitter buttons in Settings
    • +
  • Updated keyboard shortcuts:
    • +
      +
    • Alt+Home - switch to first (most recent) conversation
      • +
    • Removed Alt+1, 2, 3.. shortcuts due to conflicts in different browsers
      • +
    +
+
+
+ +
+

+ Version 0.1.3 +

+
+
    +
  • Added version history to welcome screen
    • +
  • Added keyboard shortcuts:
    • +
      +
    • Tab - set focus to message field
      • +
    • Esc or Shift+Tab - set focus to search field
      • +
    • Up/Down (while in search field) - move between conversations
      • +
    • Enter (while in search field) - open selected or first conversation
      • +
    • Alt+Up/Down - move to previous/next conversation
      • +
    +
  • Improved grouping for messages
    • +
  • Fixed video modal positioning bug
    • +
  • Fixed focusing issues on mobile
    • +
+
+
+ +
+ +
+ +
\ No newline at end of file diff --git a/app/partials/mobile/chat_create_modal.html b/app/partials/mobile/chat_create_modal.html new file mode 100644 index 00000000..28cb5493 --- /dev/null +++ b/app/partials/mobile/chat_create_modal.html @@ -0,0 +1,24 @@ +
+ + + +
+ +
+ +

Create Group

+ +
+ +
+ +
+ +
+ +
+ Cancel + +
+ +
\ No newline at end of file diff --git a/app/partials/mobile/chat_edit_modal.html b/app/partials/mobile/chat_edit_modal.html new file mode 100644 index 00000000..a73bb27c --- /dev/null +++ b/app/partials/mobile/chat_edit_modal.html @@ -0,0 +1,24 @@ +
+ + + +
+ +
+ +

Edit Group

+ +
+ +
+ +
+ +
+ +
+ Cancel + +
+ +
\ No newline at end of file diff --git a/app/partials/mobile/confirm_modal.html b/app/partials/mobile/confirm_modal.html new file mode 100644 index 00000000..a5840e6f --- /dev/null +++ b/app/partials/mobile/confirm_modal.html @@ -0,0 +1,65 @@ +
+ + + +
+ +
+ Are you sure you want to log out? + A new version of Webogram has been downloaded. Launch it? + Are you sure? This can not be undone! + Are you sure you want to log out all devices except for the current one? + + Your browser does not support mixed content which is neccessary for MTProto support on https. Learn more »

+ Would you like use http-version instead? + + + + + + + Are you sure to send file(s) from clipboard? + Are you sure you want to delete the message? + Telegram will now sync your contacts in order to find your friends. +
+ Is this phone number correct? +
+
+ Forward to + + + ? + Send to + + + ? + Share with + + + ? + +
+ +
+ +
+ + Cancel + + +
+ +
\ No newline at end of file diff --git a/app/partials/mobile/dialog.html b/app/partials/mobile/dialog.html new file mode 100644 index 00000000..208e1a2c --- /dev/null +++ b/app/partials/mobile/dialog.html @@ -0,0 +1,89 @@ + + +
+
+ + +
+ +
+ +
+ +
+ +
+ + + + +
+ +
+
+ deleted message +
+
+ + You{{((dialogMessage.out || dialogMessage.peerID < 0) && (dialogMessage.message.length || dialogMessage.media && dialogMessage.media._ != 'messageMediaEmpty')) ? ':' : ''}} + + + + Photo + Video + Document + Audio + Location + Contact + + + + created the group + changed group name + changed group photo + removed group photo + + + + returned to group + + + invited + + + + + + left group + + + kicked + + + + + +
+
+ +
+ diff --git a/app/partials/mobile/edit_contact_modal.html b/app/partials/mobile/edit_contact_modal.html new file mode 100644 index 00000000..237ae51b --- /dev/null +++ b/app/partials/mobile/edit_contact_modal.html @@ -0,0 +1,30 @@ +
+ + + +
+ +
+ +

Edit contact

+ +
+ +
+
+ +
+
+ +
+ +
+ +
+ +
+ Cancel + +
+ +
\ No newline at end of file diff --git a/app/partials/mobile/error_modal.html b/app/partials/mobile/error_modal.html new file mode 100644 index 00000000..d8115053 --- /dev/null +++ b/app/partials/mobile/error_modal.html @@ -0,0 +1,87 @@ +
+ + + +
+ +

+ No account + + Error + Unauthorized + Access denied + Not found + Network error + Too fast + Server error + +

+

+ +
+ + Please check your internet connection. + + + Please check your internet connection. + + + The first name you entered is invalid. + + + The last name you entered is invalid. + + + The phone number you entered is invalid. + + + You have selected too much users. + + + The photo dimensions are invalid, please select another file. + + + The video file extension is invalid or unsupported, please select another file. + + + The photo you provided is too small. + + + Sorry, there is no Telegram account for {{phone | phoneNumber}}

+ Please sign up using our mobile apps for iOS or Android. + + + Sorry, there is no Telegram account with the phone number you provided. + + + Sorry, there are no Telegram accounts with the phone numbers you provided. + + + Telegram needs access to phonebook to import contacts. + + +
+ One of the params is missing or invalid. + This action requires authorization access. Please log in. + You are not allowed for this action. + The page was not found. + You are performing too many actions. Please try again later. + Internal server error occured. Please try again later. +
+ +
+ +
+ +
+ Technical details here +
+
+ +
+ +
+ +
\ No newline at end of file diff --git a/app/partials/mobile/full_gif.html b/app/partials/mobile/full_gif.html new file mode 100644 index 00000000..cffc8140 --- /dev/null +++ b/app/partials/mobile/full_gif.html @@ -0,0 +1,25 @@ + + +
+ + + + +
+ +
+ +
+
+
+
+
+ +
+
GIF
+
+
+ +
+ + \ No newline at end of file diff --git a/app/partials/mobile/full_photo.html b/app/partials/mobile/full_photo.html new file mode 100644 index 00000000..1c26c433 --- /dev/null +++ b/app/partials/mobile/full_photo.html @@ -0,0 +1,19 @@ +
+
+
+
+
+
+
+
+
+
+ + + +
+
+
+
+
+
\ No newline at end of file diff --git a/app/partials/mobile/full_video.html b/app/partials/mobile/full_video.html new file mode 100644 index 00000000..c06f6ad7 --- /dev/null +++ b/app/partials/mobile/full_video.html @@ -0,0 +1,26 @@ +
+
+
+
+
+
+
+
+
+ +
+
+ + +
+
+
+
+
+
\ No newline at end of file diff --git a/app/partials/mobile/head.html b/app/partials/mobile/head.html new file mode 100644 index 00000000..0de2e01f --- /dev/null +++ b/app/partials/mobile/head.html @@ -0,0 +1,132 @@ +
+ +
diff --git a/app/partials/mobile/im.html b/app/partials/mobile/im.html new file mode 100644 index 00000000..ecea3ec2 --- /dev/null +++ b/app/partials/mobile/im.html @@ -0,0 +1,278 @@ +
+ +
+ +
+ +
+
+
+ + + + + + +
+
+ + +
+ +
+
+ Conversations + Messages +
+
+
+ +
+
+
+ +
+

No contacts yet

+

Get started by adding a contact to chat with

+ + +
+ +
+
    +
  • +
+
    +
  • +
+
+ +
+
Contacts
+ +
+ +
+
+
+
+ +
+
+
+

Get started

+

Welcome to Telegram Web. You can always set your profile photo and change your name in Settings.

+ +
+
+ Please select a chat to start messaging +
+
+
+ Loading history +
+ +
+
+ +
+ +
+
+ + Info + Edit + +
+ Media + +
+ + Show recent messages + Show all messages + + + +
+

Photos

+

Videos

+

Documents

+

Voice messages

+ +

+
+ + +
+
+ + + + + +
+

+
+ +
+ +
+ +
+ +
+ +
+ +
+
+
+ Loading history + No messages here yet... +
+ +
+
+
+
+ +
+ +
+ + is typing + + + and are typing + + + , and {{historyState.typing.length - 2}} more are typing + +
+
+ +
+ +
+ +
+ +
+ +
+
+ + Delete Chat + Clear History + + Cancel +
+ + Forward + + Delete + +
+
+ +
+ +
+ +
+
+ + +
+
+ +
+
+ +
+
Drop photos here to send
+ +
+ +
+ + +
+ +
+ + +
+ +
+ +
+ + +
+
+ +
+ +
+ +
+ +
+
+ +
+ +
+ + +
+ +
+ Telegram beta by izhukov & toberg +
+ +
diff --git a/app/partials/mobile/import_contact_modal.html b/app/partials/mobile/import_contact_modal.html new file mode 100644 index 00000000..9cd14722 --- /dev/null +++ b/app/partials/mobile/import_contact_modal.html @@ -0,0 +1,31 @@ +
+ + + +
+ +
+ +

Add new contact

+ +
+ +
+
+ +
+
+ +
+ +
+ +
+ +
+ Phonebook + Cancel + +
+ +
\ No newline at end of file diff --git a/app/partials/mobile/login.html b/app/partials/mobile/login.html new file mode 100644 index 00000000..143dfc92 --- /dev/null +++ b/app/partials/mobile/login.html @@ -0,0 +1,84 @@ +
+ + +
+
+ +
+ + + + + +
+ +
+ + +
+
+ + +
+ +
+ + +
+
+ + +
+
+ + + +
+
+ +
+ + +
+ + +
+ +
+ + + + + +
+ + +
+ + +
+ +
diff --git a/app/partials/mobile/message.html b/app/partials/mobile/message.html new file mode 100644 index 00000000..59461d7f --- /dev/null +++ b/app/partials/mobile/message.html @@ -0,0 +1,79 @@ +
+ Unread messages +
+ +
+
+
+ +
+ + +
+ +
+
+ + +
+ + + + + +
+ +
+
+ +
+ + + + + + + + + +
+ + +
+ +
+ + + +
+
Forwarded message
+ +
+ +
+
+ +
+ +
+
+
+
+
+
+
+ +
+ +
+
+ +
+
+ +
+ diff --git a/app/partials/mobile/message_attach_audio.html b/app/partials/mobile/message_attach_audio.html new file mode 100644 index 00000000..d964bd3e --- /dev/null +++ b/app/partials/mobile/message_attach_audio.html @@ -0,0 +1,33 @@ +
+ + + + + +
+
+ + Voice message + + + +
+
+ Play +
+
+ Cancel +
+
+
+
+
+
+
+ +
+
+
\ No newline at end of file diff --git a/app/partials/mobile/message_attach_contact.html b/app/partials/mobile/message_attach_contact.html new file mode 100644 index 00000000..755e386d --- /dev/null +++ b/app/partials/mobile/message_attach_contact.html @@ -0,0 +1,8 @@ +
+ +
+ + +
+
+
\ No newline at end of file diff --git a/app/partials/mobile/message_attach_document.html b/app/partials/mobile/message_attach_document.html new file mode 100644 index 00000000..91c58065 --- /dev/null +++ b/app/partials/mobile/message_attach_document.html @@ -0,0 +1,39 @@ +
+ +
+ +
+ + + +
+ +
+ + +
+
+ + + +
+
+ Download + Open +
+
+ Cancel +
+
+
+
+
+
+
+ +
+
\ No newline at end of file diff --git a/app/partials/mobile/message_attach_map.html b/app/partials/mobile/message_attach_map.html new file mode 100644 index 00000000..ab127f85 --- /dev/null +++ b/app/partials/mobile/message_attach_map.html @@ -0,0 +1,3 @@ + + + \ No newline at end of file diff --git a/app/partials/mobile/message_attach_pending.html b/app/partials/mobile/message_attach_pending.html new file mode 100644 index 00000000..308f8fcc --- /dev/null +++ b/app/partials/mobile/message_attach_pending.html @@ -0,0 +1,17 @@ +
+ +
+
+ + +
+
+ Cancel +
+
+
+
+
+
+
+
\ No newline at end of file diff --git a/app/partials/mobile/message_attach_photo.html b/app/partials/mobile/message_attach_photo.html new file mode 100644 index 00000000..5bb9b925 --- /dev/null +++ b/app/partials/mobile/message_attach_photo.html @@ -0,0 +1,7 @@ + + + \ No newline at end of file diff --git a/app/partials/mobile/message_attach_video.html b/app/partials/mobile/message_attach_video.html new file mode 100644 index 00000000..f463cd15 --- /dev/null +++ b/app/partials/mobile/message_attach_video.html @@ -0,0 +1,31 @@ +
+ + + + + + +
+
+ Video + + +
+
+ Download + Play video +
+
+ Cancel +
+
+
+
+
+
+
+
\ No newline at end of file diff --git a/app/partials/mobile/message_service.html b/app/partials/mobile/message_service.html new file mode 100644 index 00000000..689d6612 --- /dev/null +++ b/app/partials/mobile/message_service.html @@ -0,0 +1,32 @@ + + + created the group «» + + + changed group name to «» + + + changed group photo + + + removed group photo + + + + invited + + + returned to group + + + + + kicked + + + left group + + + + + \ No newline at end of file diff --git a/app/partials/mobile/photo_modal.html b/app/partials/mobile/photo_modal.html new file mode 100644 index 00000000..6f10fb04 --- /dev/null +++ b/app/partials/mobile/photo_modal.html @@ -0,0 +1,22 @@ +
+ +
+ +
+ +
+
+ Download + Forward + Delete +
+ +

+ , +

+
+ + +
+ +
\ No newline at end of file diff --git a/app/partials/mobile/profile_edit_modal.html b/app/partials/mobile/profile_edit_modal.html new file mode 100644 index 00000000..dd0e0e40 --- /dev/null +++ b/app/partials/mobile/profile_edit_modal.html @@ -0,0 +1,27 @@ +
+ + + +
+ +
+ +

Edit Profile

+ +
+ +
+
+ +
+ +
+ +
+ +
+ Cancel + +
+ +
\ No newline at end of file diff --git a/app/partials/mobile/video_modal.html b/app/partials/mobile/video_modal.html new file mode 100644 index 00000000..e23f29ab --- /dev/null +++ b/app/partials/mobile/video_modal.html @@ -0,0 +1,21 @@ +
+ +
+ +
+ +
+
+ Download + Forward + Delete +
+ +

+ , +

+
+ +
+ +
\ No newline at end of file diff --git a/app/partials/mobile/welcome.html b/app/partials/mobile/welcome.html new file mode 100644 index 00000000..6149e88b --- /dev/null +++ b/app/partials/mobile/welcome.html @@ -0,0 +1,56 @@ +
+ +
+ +
+ + +

Telegram Web

+ +
+

This is an unofficial web-client for the Telegram Messenger.

+

It's still an alpha-version and may not be 200% reliable

+
+
+ Start Messaging +
+
+ +
+
+ +
+
+
+
+
+

Fast messaging

+
Send messages with rich emoji support right from your desktop or laptop computer
+
+
+ +
+
+
+

Easy file sharing

+
Share files of any type using drag-and-drop or the attachment icon
+
+
+ +
+
+
+

Powerful tools

+
Browse shared media and files by type
and set custom notifications
+
+
+ +
+
+
+ +
+ + + +
diff --git a/app/webogram.appcache b/app/webogram.appcache index 0b7c5e7e..7ff0f8c9 100644 --- a/app/webogram.appcache +++ b/app/webogram.appcache @@ -1,6 +1,6 @@ CACHE MANIFEST -# 28 +# 30 NETWORK: * From 0dbe741a1676a65afb94398393d4f316e69cd22b Mon Sep 17 00:00:00 2001 From: Igor Zhukov Date: Thu, 11 Sep 2014 17:08:11 +0400 Subject: [PATCH 02/11] Moved emojiarea recent tab to ConfigStorage --- .../jquery.emojiarea/jquery.emojiarea.js | 85 +++++++++---------- 1 file changed, 38 insertions(+), 47 deletions(-) diff --git a/app/vendor/jquery.emojiarea/jquery.emojiarea.js b/app/vendor/jquery.emojiarea/jquery.emojiarea.js index df7b370e..91585625 100644 --- a/app/vendor/jquery.emojiarea/jquery.emojiarea.js +++ b/app/vendor/jquery.emojiarea/jquery.emojiarea.js @@ -172,31 +172,27 @@ This function was added by Igor Zhukov to save recent used emojis. */ util.emojiInserted = function (emojiKey, menu) { - try { - var curEmojisStr = localStorage.getItem('emojis_recent'); - } catch (e) { - return false; - } + ConfigStorage.get('emojis_recent', function (curEmojis) { + curEmojis = curEmojis || []; - var curEmojis = curEmojisStr && curEmojisStr.split(',') || [], - pos = curEmojis.indexOf(emojiKey); - - if (!pos) { - return false; - } - if (pos != -1) { - curEmojis.splice(pos, 1); - } - curEmojis.unshift(emojiKey); - if (curEmojis.length > 42) { - curEmojis = curEmojis.slice(42); - } + var pos = curEmojis.indexOf(emojiKey); + if (!pos) { + return false; + } + if (pos != -1) { + curEmojis.splice(pos, 1); + } + curEmojis.unshift(emojiKey); + if (curEmojis.length > 42) { + curEmojis = curEmojis.slice(42); + } - localStorage.setItem('emojis_recent', curEmojis.join(',')); + ConfigStorage.set({emojis_recent: curEmojis}); - if (menu) { - menu.updateRecentTab(curEmojis); - } + if (menu) { + menu.updateRecentTab(curEmojis); + } + }) }; /*! MODIFICATION END */ @@ -246,7 +242,7 @@ var column = emoji[2]; var name = emoji[3]; var filename = $.emojiarea.spritesheetPath; - var iconSize = menu && Config.Navigator.mobile ? 26 : $.emojiarea.iconSize + var iconSize = menu && Config.Mobile ? 26 : $.emojiarea.iconSize var xoffset = -(iconSize * column); var yoffset = -(iconSize * row); var scaledWidth = ($.emojiarea.spritesheetDimens[category][1] * iconSize); @@ -562,8 +558,10 @@ /* MODIFICATION: Following line was modified by Andre Staltz, in order to select a default category. */ this.selectCategory(0); - /* MODIFICATION: Following line was added by Igor Zhukov, in order to update emoji tab visibility */ - this.updateRecentTab(); + /* MODIFICATION: Following 3 lines was added by Igor Zhukov, in order to update emoji tab visibility */ + ConfigStorage.get('emojis_recent', function (curEmojis) { + self.updateRecentTab(curEmojis); + }); }; /*! MODIFICATION START @@ -601,10 +599,19 @@ var html = []; var options = $.emojiarea.icons; var path = $.emojiarea.path; + var self = this; if (path.length && path.charAt(path.length - 1) !== '/') { path += '/'; } - + + /*! MODIFICATION: Following function was added by Igor Zhukov, in order to add scrollbars to EmojiMenu */ + var updateItems = function () { + self.$items.html(html.join('')); + + setTimeout(function () { + self.$itemsWrap.nanoScroller(); + }, 100); + } if (category > 0) { for (var key in options) { @@ -613,41 +620,25 @@ html.push('' + EmojiArea.createIcon(options[key], true) + '' + util.htmlEntities(key) + ''); } } + updateItems(); } else { - try { - var curEmojis = (localStorage.getItem('emojis_recent') || '').split(','), - key, i; + ConfigStorage.get('emojis_recent', function (curEmojis) { + var key, i; for (i = 0; i < curEmojis.length; i++) { key = curEmojis[i] if (options[key]) { html.push('' + EmojiArea.createIcon(options[key], true) + '' + util.htmlEntities(key) + ''); } } - } catch (e) {} + updateItems(); + }); } - - this.$items.html(html.join('')); - - /*! MODIFICATION: Following 4 lines were added by Igor Zhukov, in order to add scrollbars to EmojiMenu */ - var self = this; - setTimeout(function () { - self.$itemsWrap.nanoScroller(); - }, 100); }; /*! MODIFICATION START This function was added by Igor Zhukov to update recent emojis tab state. */ EmojiMenu.prototype.updateRecentTab = function(curEmojis) { - if (curEmojis === undefined) { - try { - var curEmojisStr = localStorage.getItem('emojis_recent'); - curEmojis = curEmojisStr && curEmojisStr.split(',') || []; - } catch (e) { - curEmojis = []; - } - } - if (this.hasRecent != (curEmojis.length > 1)) { var tabEl = this.$categoryTabs.find('.emoji-menu-tab').eq(0); if (this.hasRecent) { From cb6aaad4178835192c896f5b9d35e10364f0dfda Mon Sep 17 00:00:00 2001 From: Igor Zhukov Date: Thu, 11 Sep 2014 18:40:10 +0400 Subject: [PATCH 03/11] Supported dialogs scrolling --- app/css/app.css | 100 ----- app/css/desktop.css | 153 +++++++ app/css/mobile.css | 23 +- app/index.html | 1 + app/js/directives_mobile.js | 381 ++++++++++++++++++ app/js/init.js | 2 +- app/js/lib/utils.js | 2 +- app/partials/mobile/im.html | 109 ++--- .../jquery.nanoscroller/nanoscroller.css | 55 --- app/webogram.appcache | 2 +- 10 files changed, 587 insertions(+), 241 deletions(-) create mode 100644 app/js/directives_mobile.js diff --git a/app/css/app.css b/app/css/app.css index 4ea9aa11..63909419 100644 --- a/app/css/app.css +++ b/app/css/app.css @@ -799,48 +799,7 @@ a.tg_radio_on:hover i.icon-radio { -.im_page_wrap { - background: #FFF; - max-width: 1000px; - min-width: 300px; - margin: 0 auto; - -webkit-box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.1); - -moz-box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.1); - box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.1); - - border-radius: 0 0 3px 3px; - overflow: hidden; -} - - -.im_page_footer { - font-size: 11px; - text-align: center; - color: #9cacb9; - line-height: 40px; -} -.im_page_footer_brand { - color: #9cacb9; - font-weight: bold; -} -.im_page_footer_brand:hover, -.im_page_footer_brand:active { - color: #8499aa; - text-decoration: none; -} - -.im_dialogs_col_wrap { - float: left; - width: 31%; - border-right: 2px solid #E9EBED; - padding-bottom: 10px; -} - -.im_history_col_wrap { - float: left; - width: 69%; -} /* Dialogs list */ @@ -861,10 +820,6 @@ a.tg_radio_on:hover i.icon-radio { margin-top: 10px; } -.im_dialogs_col { - margin-right: -7px; -} - .im_dialogs_col .nano > .nano-pane { background : rgba(0,0,0,0.0); @@ -984,11 +939,7 @@ a.tg_radio_on:hover i.icon-radio { - -.im_dialogs_wrap { -} .im_dialogs_scrollable_wrap { - padding: 0 19px 0 12px; outline: none ! important; } .im_dialogs_scrollable_wrap .im_dialog_wrap { @@ -1127,57 +1078,6 @@ a.im_dialog_selected .im_dialog_date { /* IM history */ -.im_history_col { -} - -.im_history_col .nano > .nano-pane, -.contacts_modal_col .nano > .nano-pane, -.im_dialogs_modal_col .nano > .nano-pane { - background : rgba(3,36,64,0.08); - width : 9px; - right: 0; - top: 0; - /*-webkit-transition : .2s; - -moz-transition : .2s; - -o-transition : .2s; - transition : .2s;*/ - -moz-border-radius : 2px; - -webkit-border-radius : 2px; - border-radius : 2px; - - -webkit-transition : none; - -moz-transition : none; - -o-transition : none; - transition : none; -} - -.contacts_modal_col .nano > .nano-pane { - width: 6px; - right: 7px; -} - -.im_dialogs_modal_col .nano > .nano-pane { - width: 6px; - right: 2px; -} -.im_dialogs_modal_col .im_dialogs_scrollable_wrap { - padding: 0 12px 0 12px; -} - -.im_history_col .nano > .nano-pane { - top: 10px; - right: 8px; -} -.im_history_col .nano > .nano-pane > .nano-slider, -.contacts_modal_col .nano > .nano-pane > .nano-slider, -.im_dialogs_modal_col .nano > .nano-pane > .nano-slider { - background : rgba(3,46,79,0.22); - margin: 0; - -moz-border-radius : 2px; - -webkit-border-radius : 2px; - border-radius : 2px; -} - .im_history_panel_wrap { margin: 0 23px 0 15px; cursor: pointer; diff --git a/app/css/desktop.css b/app/css/desktop.css index e69de29b..dcc86ff6 100644 --- a/app/css/desktop.css +++ b/app/css/desktop.css @@ -0,0 +1,153 @@ +/** initial setup **/ +.nano { + position : relative; + width : 100%; + height : 100%; + overflow : hidden; +} +.nano > .nano-content { + position : absolute; + overflow : scroll; + overflow-x : hidden; + top : 0; + right : 0; + bottom : 0; + left : 0; +} +.nano > .nano-content:focus { + outline: thin dotted; +} +.nano > .nano-content::-webkit-scrollbar { + display: none; +} +.has-scrollbar > .nano-content::-webkit-scrollbar { + display: block; +} +.nano > .nano-pane { + background : rgba(0,0,0,.25); + position : absolute; + width : 10px; + right : 0; + top : 0; + bottom : 0; + visibility : hidden\9; /* Target only IE7 and IE8 with this hack */ + opacity : .01; + -webkit-transition : .2s; + -moz-transition : .2s; + -o-transition : .2s; + transition : .2s; + -moz-border-radius : 5px; + -webkit-border-radius : 5px; + border-radius : 5px; +} +.nano > .nano-pane > .nano-slider { + background: #444; + background: rgba(0,0,0,.5); + position : relative; + margin : 0 1px; + -moz-border-radius : 3px; + -webkit-border-radius : 3px; + border-radius : 3px; +} +.nano:hover > .nano-pane, .nano-pane.active, .nano-pane.flashed { + visibility : visible\9; /* Target only IE7 and IE8 with this hack */ + opacity : 0.99; +} + + + +.im_page_wrap { + background: #FFF; + max-width: 1000px; + min-width: 300px; + margin: 0 auto; + + -webkit-box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.1); + -moz-box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.1); + box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.1); + + border-radius: 0 0 3px 3px; + overflow: hidden; +} + + +.im_page_footer { + font-size: 11px; + text-align: center; + color: #9cacb9; + line-height: 40px; +} +.im_page_footer_brand { + color: #9cacb9; + font-weight: bold; +} +.im_page_footer_brand:hover, +.im_page_footer_brand:active { + color: #8499aa; + text-decoration: none; +} + +.im_dialogs_col { + margin-right: -7px; +} +.im_dialogs_col_wrap { + float: left; + width: 31%; + border-right: 2px solid #E9EBED; + padding-bottom: 10px; +} +.im_dialogs_scrollable_wrap { + padding: 0 19px 0 12px; +} + +.im_history_col_wrap { + float: left; + width: 69%; +} +.im_history_col .nano > .nano-pane, +.contacts_modal_col .nano > .nano-pane, +.im_dialogs_modal_col .nano > .nano-pane { + background : rgba(3,36,64,0.08); + width : 9px; + right: 0; + top: 0; + /*-webkit-transition : .2s; + -moz-transition : .2s; + -o-transition : .2s; + transition : .2s;*/ + -moz-border-radius : 2px; + -webkit-border-radius : 2px; + border-radius : 2px; + + -webkit-transition : none; + -moz-transition : none; + -o-transition : none; + transition : none; +} + +.contacts_modal_col .nano > .nano-pane { + width: 6px; + right: 7px; +} + +.im_dialogs_modal_col .nano > .nano-pane { + width: 6px; + right: 2px; +} +.im_dialogs_modal_col .im_dialogs_scrollable_wrap { + padding: 0 12px 0 12px; +} + +.im_history_col .nano > .nano-pane { + top: 10px; + right: 8px; +} +.im_history_col .nano > .nano-pane > .nano-slider, +.contacts_modal_col .nano > .nano-pane > .nano-slider, +.im_dialogs_modal_col .nano > .nano-pane > .nano-slider { + background : rgba(3,46,79,0.22); + margin: 0; + -moz-border-radius : 2px; + -webkit-border-radius : 2px; + border-radius : 2px; +} \ No newline at end of file diff --git a/app/css/mobile.css b/app/css/mobile.css index 38f15631..70655f0e 100644 --- a/app/css/mobile.css +++ b/app/css/mobile.css @@ -775,16 +775,11 @@ a.im_message_from_photo { display: block; } .im_dialogs_col { - margin-right: 0; -} -.im_page_peer_not_selected .im_dialogs_col_wrap .nano-pane { - width: 6px; - right: 3px; } -.im_page_peer_not_selected .im_dialogs_col_wrap .nano-pane > .nano-slider { - background : rgba(3,46,79,0.22); - border-radius: 3px; - margin: 0; +.im_dialogs_scrollable_wrap { + overflow: hidden; + overflow-y: scroll; + -webkit-overflow-scrolling: touch; } .im_dialogs_panel { @@ -801,14 +796,10 @@ a.im_message_from_photo { .im_page_split .im_dialogs_search { margin-right: 0; } -.im_dialogs_modal_col .im_dialogs_scrollable_wrap, -.im_dialogs_scrollable_wrap { - padding: 0; -} .im_dialogs_scrollable_wrap a.im_dialog { - border-bottom: 1px solid #d4d4d4; - border-top: 1px solid #d4d4d4; + border-bottom: 1px solid #eee; + border-top: 1px solid #eee; margin-top: -1px; border-radius: 0 !important; padding-right: 11px; @@ -914,7 +905,7 @@ a.im_message_fwd_author { .im_dialogs_scrollable_wrap .active a.im_dialog:hover, .im_dialogs_scrollable_wrap .active a.im_dialog_selected { border-radius: 0; - background-color: #f0f0f0; + background-color: #f4f4f4; } diff --git a/app/index.html b/app/index.html index 8828f037..1cb83cf0 100644 --- a/app/index.html +++ b/app/index.html @@ -73,6 +73,7 @@ PRODUCTION_ONLY_END--> + diff --git a/app/js/directives_mobile.js b/app/js/directives_mobile.js new file mode 100644 index 00000000..fad0ca7b --- /dev/null +++ b/app/js/directives_mobile.js @@ -0,0 +1,381 @@ +/*! + * Webogram v0.3.0 - messaging web application for MTProto + * https://github.com/zhukov/webogram + * Copyright (C) 2014 Igor Zhukov + * https://github.com/zhukov/webogram/blob/master/LICENSE + */ + +'use strict'; + +/* Directives */ + + +angular.module('myApp.directives') + + .directive('myDialogsListMobile', function($window, $timeout) { + + return { + link: link + }; + + + function link ($scope, element, attrs) { + var dialogsColWrap = $('.im_dialogs_col_wrap')[0], + scrollableWrap = element[0], + headWrap = $('.tg_page_head')[0], + panelWrapSelector = attrs.modal + ? '.mobile_modal_body .im_dialogs_panel' + : '.im_dialogs_panel', + panelWrap = $(panelWrapSelector)[0], + hasTabs = false, + moreNotified = false; + + $scope.$on('ui_dialogs_tabs', function (e, newHasTabs) { + hasTabs = newHasTabs; + updateSizes(); + }); + $scope.$on('ui_dialogs_search', updateSizes); + $scope.$on('ui_dialogs_update', updateSizes); + + + $scope.$on('ui_dialogs_append', function () { + onContentLoaded(function () { + moreNotified = false; + + $timeout(function () { + $(scrollableWrap).trigger('scroll'); + }); + }); + }); + + $scope.$on('ui_dialogs_change', function () { + onContentLoaded(function () { + moreNotified = false; + + $timeout(function () { + $(scrollableWrap).trigger('scroll'); + }); + }); + }); + + $(scrollableWrap).on('scroll', function (e) { + if (!element.is(':visible')) return; + if (!moreNotified && scrollableWrap.scrollTop >= scrollableWrap.scrollHeight - scrollableWrap.clientHeight - 300) { + $scope.$emit('dialogs_need_more'); + moreNotified = true; + } + }); + + + function updateSizes () { + if (!panelWrap || !panelWrap.offsetHeight) { + panelWrap = $(panelWrapSelector)[0]; + } + + if (attrs.modal) { + $(element).css({ + height: $($window).height() - + (panelWrap ? panelWrap.offsetHeight : 58) - 46 + }); + return; + } + + if (!headWrap || !headWrap.offsetHeight) { + headWrap = $('.tg_page_head')[0]; + } + + if (!dialogsColWrap || !dialogsColWrap.offsetHeight) { + dialogsColWrap = $('.im_dialogs_col_wrap')[0]; + } + $(element).css({ + height: $($window).height() - + (headWrap ? headWrap.offsetHeight : 44) - + (panelWrap ? panelWrap.offsetHeight : 58) - + parseInt($(dialogsColWrap).css('paddingBottom') || 0) + }); + } + + $($window).on('resize', updateSizes); + + updateSizes(); + setTimeout(updateSizes, 1000); + }; + + }) + + .directive('myHistoryMobile', function ($window, $timeout, $rootScope, $transition) { + + return { + link: link + }; + + function link ($scope, element, attrs) { + var historyWrap = $('.im_history_wrap', element)[0], + historyMessagesEl = $('.im_history_messages', element)[0], + historyEl = $('.im_history', element)[0], + scrollableWrap = $('.im_history_scrollable_wrap', element)[0], + scrollable = $('.im_history_scrollable', element)[0], + panelWrap = $('.im_history_panel_wrap', element)[0], + bottomPanelWrap = $('.im_bottom_panel_wrap', element)[0], + sendFormWrap = $('.im_send_form_wrap', element)[0], + headWrap = $('.tg_page_head')[0], + sendForm = $('.im_send_form', element)[0], + moreNotified = false, + lessNotified = false; + + onContentLoaded(function () { + scrollableWrap.scrollTop = scrollableWrap.scrollHeight; + }); + $(historyWrap).nanoScroller({preventPageScrolling: true, tabIndex: -1, iOSNativeScrolling: true}); + + var updateScroller = function (delay) { + // console.trace('scroller update', delay); + $timeout(function () { + if (!$(scrollableWrap).hasClass('im_history_to_bottom')) { + $(historyWrap).nanoScroller(); + } + }, delay || 0); + } + + var transform = false, + trs = ['transform', 'webkitTransform', 'MozTransform', 'msTransform', 'OTransform'], + i; + for (i = 0; i < trs.length; i++) { + if (trs[i] in historyMessagesEl.style) { + transform = trs[i]; + break; + } + } + + var animated = transform ? true : false, + curAnimation = false; + + $scope.$on('ui_history_append_new', function (e, options) { + if (!atBottom && !options.my) { + return; + } + var curAnimated = animated && + !$rootScope.idle.isIDLE && + historyMessagesEl.clientHeight > 0, + wasH; + + if (curAnimated) { + wasH = scrollableWrap.scrollHeight; + } else { + $(scrollable).css({bottom: 0}); + $(scrollableWrap).addClass('im_history_to_bottom'); + } + + onContentLoaded(function () { + if (curAnimated) { + curAnimation = true; + $(historyMessagesEl).removeClass('im_history_appending'); + scrollableWrap.scrollTop = scrollableWrap.scrollHeight; + $(historyMessagesEl).css(transform, 'translate(0px, ' + (scrollableWrap.scrollHeight - wasH) + 'px)'); + $(historyWrap).nanoScroller(); + var styles = {}; + styles[transform] = 'translate(0px, 0px)'; + $(historyMessagesEl).addClass('im_history_appending'); + $transition($(historyMessagesEl), styles).then(function () { + curAnimation = false; + $(historyMessagesEl).removeClass('im_history_appending'); + updateBottomizer(); + }); + } else { + $(scrollableWrap).removeClass('im_history_to_bottom'); + $(scrollable).css({bottom: ''}); + scrollableWrap.scrollTop = scrollableWrap.scrollHeight; + updateBottomizer(); + } + }); + }); + + function changeScroll () { + var unreadSplit, focusMessage; + + if (focusMessage = $('.im_message_focus', scrollableWrap)[0]) { + scrollableWrap.scrollTop = Math.max(0, focusMessage.offsetTop - Math.floor(scrollableWrap.clientHeight / 2) + 26); + atBottom = false; + } else if (unreadSplit = $('.im_message_unread_split', scrollableWrap)[0]) { + scrollableWrap.scrollTop = Math.max(0, unreadSplit.offsetTop - 52); + atBottom = false; + } else { + scrollableWrap.scrollTop = scrollableWrap.scrollHeight; + atBottom = true; + } + updateScroller(); + $timeout(function () { + $(scrollableWrap).trigger('scroll'); + }); + }; + + $scope.$on('ui_history_change', function () { + $(scrollableWrap).addClass('im_history_to_bottom'); + $(scrollable).css({bottom: 0}); + onContentLoaded(function () { + $(scrollableWrap).removeClass('im_history_to_bottom'); + $(scrollable).css({bottom: ''}); + updateSizes(true); + moreNotified = false; + lessNotified = false; + changeScroll(); + }); + }); + + $scope.$on('ui_history_change_scroll', function () { + onContentLoaded(changeScroll) + }); + + $scope.$on('ui_history_focus', function () { + if (!atBottom) { + scrollableWrap.scrollTop = scrollableWrap.scrollHeight; + updateScroller(); + atBottom = true; + } + }); + + $scope.$on('ui_history_prepend', function () { + var sh = scrollableWrap.scrollHeight, + st = scrollableWrap.scrollTop, + pr = parseInt($(scrollableWrap).css('paddingRight')), + ch = scrollableWrap.clientHeight; + + $(scrollableWrap).addClass('im_history_to_bottom'); + scrollableWrap.scrollHeight; // Some strange Chrome bug workaround + $(scrollable).css({bottom: -(sh - st - ch), marginLeft: -Math.ceil(pr / 2)}); + + var upd = function () { + $(scrollableWrap).removeClass('im_history_to_bottom'); + $(scrollable).css({bottom: '', marginLeft: ''}); + scrollableWrap.scrollTop = st + scrollableWrap.scrollHeight - sh; + + updateBottomizer(); + moreNotified = false; + + $timeout(function () { + if (scrollableWrap.scrollHeight != sh) { + $(scrollableWrap).trigger('scroll'); + } + }); + + clearTimeout(timer); + unreg(); + }, + timer = setTimeout(upd, 0), + unreg = $scope.$on('$viewContentLoaded', upd); + }); + + $scope.$on('ui_history_append', function () { + var sh = scrollableWrap.scrollHeight; + onContentLoaded(function () { + atBottom = false; + updateBottomizer(); + lessNotified = false; + + $timeout(function () { + if (scrollableWrap.scrollHeight != sh) { + $(scrollableWrap).trigger('scroll'); + } + }); + }); + }); + + $scope.$on('ui_panel_update', function () { + onContentLoaded(function () { + updateSizes(); + $scope.$broadcast('ui_message_send'); + + $timeout(function () { + $(scrollableWrap).trigger('scroll'); + }); + }); + }); + + $scope.$on('ui_selection_clear', function () { + if (window.getSelection) { + if (window.getSelection().empty) { // Chrome + window.getSelection().empty(); + } else if (window.getSelection().removeAllRanges) { // Firefox + window.getSelection().removeAllRanges(); + } + } else if (document.selection) { // IE? + document.selection.empty(); + } + }); + + $scope.$on('ui_editor_resize', updateSizes); + $scope.$on('ui_height', function () { + onContentLoaded(updateSizes); + // updateSizes(); + }); + + var atBottom = true; + $(scrollableWrap).on('scroll', function (e) { + if (!element.is(':visible') || + $(scrollableWrap).hasClass('im_history_to_bottom') || + curAnimation) { + return; + } + atBottom = scrollableWrap.scrollTop >= scrollableWrap.scrollHeight - scrollableWrap.clientHeight; + + if (!moreNotified && scrollableWrap.scrollTop <= 300) { + moreNotified = true; + $scope.$emit('history_need_more'); + } + else if (!lessNotified && scrollableWrap.scrollTop >= scrollableWrap.scrollHeight - scrollableWrap.clientHeight - 300) { + lessNotified = true; + $scope.$emit('history_need_less'); + } + }); + + function updateSizes (heightOnly) { + if (!element.is(':visible') && !$(element[0].parentNode.parentNode).is(':visible')) { + return; + } + if ($(sendFormWrap).is(':visible')) { + $(sendFormWrap).css({ + height: $(sendForm).height() + }); + } + + if (!headWrap || !headWrap.offsetHeight) { + headWrap = $('.tg_page_head')[0]; + } + var historyH = $($window).height() - panelWrap.offsetHeight - bottomPanelWrap.offsetHeight - (headWrap ? headWrap.offsetHeight : 44); + $(historyWrap).css({ + height: historyH + }); + + updateBottomizer(); + + + if (heightOnly === true) return; + if (atBottom) { + onContentLoaded(function () { + scrollableWrap.scrollTop = scrollableWrap.scrollHeight; + updateScroller(); + }); + } + updateScroller(100); + } + + function updateBottomizer () { + $(historyMessagesEl).css({marginTop: 0}); + var marginTop = scrollableWrap.offsetHeight + - historyMessagesEl.offsetHeight + - 20 + - (Config.Mobile ? 0 : 49); + + if (historyMessagesEl.offsetHeight > 0 && marginTop > 0) { + $(historyMessagesEl).css({marginTop: marginTop}); + } + $(historyWrap).nanoScroller(); + } + + $($window).on('resize', updateSizes); + + updateSizes(); + onContentLoaded(updateSizes); + } + + }) \ No newline at end of file diff --git a/app/js/init.js b/app/js/init.js index 2311d528..c179712f 100644 --- a/app/js/init.js +++ b/app/js/init.js @@ -76,7 +76,7 @@ switch (layout) { case 'mobile': Config.Mobile = true; break; case 'desktop': Config.Mobile = false; break; - default: Config.Mobile = Config.Mobile; break; + default: Config.Mobile = Config.Navigator.mobile; break; } $('head').append( diff --git a/app/js/lib/utils.js b/app/js/lib/utils.js index 82031834..837593b0 100644 --- a/app/js/lib/utils.js +++ b/app/js/lib/utils.js @@ -136,6 +136,6 @@ if (!Function.prototype.bind) { } function templateUrl (tplName) { - return 'partials/' + (Config.Navigator.mobile ? 'mobile' : 'desktop') + '/' + tplName + '.html'; + return 'partials/' + (Config.Mobile ? 'mobile' : 'desktop') + '/' + tplName + '.html'; } diff --git a/app/partials/mobile/im.html b/app/partials/mobile/im.html index ecea3ec2..0141fd8e 100644 --- a/app/partials/mobile/im.html +++ b/app/partials/mobile/im.html @@ -4,21 +4,8 @@
-
+
-
- - - - - - -
@@ -32,73 +19,65 @@
-
-
-
- -
-

No contacts yet

-

Get started by adding a contact to chat with

- - -
+
-
-
    -
  • -
-
    -
  • -
-
+
+

No contacts yet

+

Get started by adding a contact to chat with

+ + +
-
-
Contacts
- -
+
+
    +
  • +
+
    +
  • +
+
-
+
+
Contacts
+
-
-
+
+

Get started

Welcome to Telegram Web. You can always set your profile photo and change your name in Settings.

-
- Please select a chat to start messaging -
Loading history
-
+
@@ -271,8 +250,4 @@
-
- Telegram beta by izhukov & toberg -
-
diff --git a/app/vendor/jquery.nanoscroller/nanoscroller.css b/app/vendor/jquery.nanoscroller/nanoscroller.css index 5b2c5229..e69de29b 100644 --- a/app/vendor/jquery.nanoscroller/nanoscroller.css +++ b/app/vendor/jquery.nanoscroller/nanoscroller.css @@ -1,55 +0,0 @@ -/** initial setup **/ -.nano { - position : relative; - width : 100%; - height : 100%; - overflow : hidden; -} -.nano > .nano-content { - position : absolute; - overflow : scroll; - overflow-x : hidden; - top : 0; - right : 0; - bottom : 0; - left : 0; -} -.nano > .nano-content:focus { - outline: thin dotted; -} -.nano > .nano-content::-webkit-scrollbar { - display: none; -} -.has-scrollbar > .nano-content::-webkit-scrollbar { - display: block; -} -.nano > .nano-pane { - background : rgba(0,0,0,.25); - position : absolute; - width : 10px; - right : 0; - top : 0; - bottom : 0; - visibility : hidden\9; /* Target only IE7 and IE8 with this hack */ - opacity : .01; - -webkit-transition : .2s; - -moz-transition : .2s; - -o-transition : .2s; - transition : .2s; - -moz-border-radius : 5px; - -webkit-border-radius : 5px; - border-radius : 5px; -} -.nano > .nano-pane > .nano-slider { - background: #444; - background: rgba(0,0,0,.5); - position : relative; - margin : 0 1px; - -moz-border-radius : 3px; - -webkit-border-radius : 3px; - border-radius : 3px; -} -.nano:hover > .nano-pane, .nano-pane.active, .nano-pane.flashed { - visibility : visible\9; /* Target only IE7 and IE8 with this hack */ - opacity : 0.99; -} diff --git a/app/webogram.appcache b/app/webogram.appcache index 7ff0f8c9..5c193fde 100644 --- a/app/webogram.appcache +++ b/app/webogram.appcache @@ -1,6 +1,6 @@ CACHE MANIFEST -# 30 +# 31 NETWORK: * From ff3bb02fa0b16ae71165209687436a18f7dae638 Mon Sep 17 00:00:00 2001 From: Igor Zhukov Date: Mon, 15 Sep 2014 19:30:13 +0400 Subject: [PATCH 04/11] Fixed JSON.parse exceptions --- app/js/lib/config.js | 6 +++++- 1 file changed, 5 insertions(+), 1 deletion(-) diff --git a/app/js/lib/config.js b/app/js/lib/config.js index 2ec5cbd7..ca75667b 100644 --- a/app/js/lib/config.js +++ b/app/js/lib/config.js @@ -107,7 +107,11 @@ Config.LangCountries = {"es": "ES", "ru": "RU", "en": "US", "de": "DE", "it": "I } else if (useLs) { var value = localStorage.getItem(key); - value = (value === undefined || value === null) ? false : JSON.parse(value); + try { + value = (value === undefined || value === null) ? false : JSON.parse(value); + } catch (e) { + value = false; + } result.push(cache[key] = value); } else if (!useCs) { From 4b3f3744a728de7e91ffd1895342d4575e9e7623 Mon Sep 17 00:00:00 2001 From: Igor Zhukov Date: Mon, 15 Sep 2014 19:56:28 +0400 Subject: [PATCH 05/11] Improved mobile history layout --- app/css/app.css | 70 ------------------------------------- app/css/desktop.css | 67 +++++++++++++++++++++++++++++++++++ app/css/mobile.css | 10 ++++-- app/js/directives_mobile.js | 20 ++--------- app/partials/mobile/im.html | 51 +++++++++++++-------------- 5 files changed, 102 insertions(+), 116 deletions(-) diff --git a/app/css/app.css b/app/css/app.css index 07e3367a..bc163257 100644 --- a/app/css/app.css +++ b/app/css/app.css @@ -1177,10 +1177,6 @@ a.im_dialog_selected .im_dialog_date { -.im_history_wrap { - /*overflow: hidden;*/ - /*overflow-y: scroll;*/ -} .im_history_scrollable_wrap { outline: none ! important; -webkit-user-select: text; @@ -1684,39 +1680,9 @@ img.im_message_document_thumb { .im_content_message_wrap { margin: 8px 0px 8px 16px } -.icon-message-status { - background: #43A4DB; - border: 0; - display: block; - width: 10px; - height: 10px; - border-radius: 7px; - position: absolute; - margin-left: -26px; - margin-top: 13px; - opacity: 0; -} -.im_message_unread .icon-message-status { - opacity: 1.0; -} -.im_message_pending .icon-message-status { - opacity: 0.5; -} - .im_message_error_btn { display: none; } -.im_message_error .im_message_error_btn { - display: inline; -} -.im_message_error_btn .icon-message-status { - background: #da564d; - opacity: 0.85; -} -.im_message_error_btn .icon-message-status:hover { - opacity: 1; -} - .im_message_date, .im_message_fwd_date { color: #adadad; @@ -1725,42 +1691,6 @@ img.im_message_document_thumb { } -@media (max-width: 900px) { - - /* Status ticks */ - .icon-message-status, - .im_message_error_btn, - .icon-message-status-tick { - display: none; - } - .im_message_out .icon-message-status-tick { - display: inline-block; - width: 16px; - height: 10px; - background: url(../img/icons/Checks2_2x.png); - background-size: 16px 10px; - top: 2px; - position: relative; - } - .is_1x .im_message_out .icon-message-status-tick { - background-image: url(../img/icons/Checks2_1x.png); - } - .im_message_pending .icon-message-status-tick { - display: none; - } - .im_message_unread .icon-message-status-tick { - background: url(../img/icons/Checks1_2x.png); - background-size: 16px 10px; - } - .is_1x .im_message_unread .icon-message-status-tick { - background-image: url(../img/icons/Checks1_1x.png); - } - .im_message_date { - padding: 0; - } -} - - div.im_message_author, div.im_message_body { display: block; diff --git a/app/css/desktop.css b/app/css/desktop.css index dcc86ff6..0ae380b2 100644 --- a/app/css/desktop.css +++ b/app/css/desktop.css @@ -150,4 +150,71 @@ -moz-border-radius : 2px; -webkit-border-radius : 2px; border-radius : 2px; +} + + +.icon-message-status { + background: #43A4DB; + border: 0; + display: block; + width: 10px; + height: 10px; + border-radius: 7px; + position: absolute; + margin-left: -26px; + margin-top: 13px; + opacity: 0; +} +.im_message_unread .icon-message-status { + opacity: 1.0; +} +.im_message_pending .icon-message-status { + opacity: 0.5; +} + +.im_message_error .im_message_error_btn { + display: inline; +} +.im_message_error_btn .icon-message-status { + background: #da564d; + opacity: 0.85; +} +.im_message_error_btn .icon-message-status:hover { + opacity: 1; +} + + +@media (max-width: 900px) { + + /* Status ticks */ + .icon-message-status, + .im_message_error_btn, + .icon-message-status-tick { + display: none; + } + .im_message_out .icon-message-status-tick { + display: inline-block; + width: 16px; + height: 10px; + background: url(../img/icons/Checks2_2x.png); + background-size: 16px 10px; + top: 2px; + position: relative; + } + .is_1x .im_message_out .icon-message-status-tick { + background-image: url(../img/icons/Checks2_1x.png); + } + .im_message_pending .icon-message-status-tick { + display: none; + } + .im_message_unread .icon-message-status-tick { + background: url(../img/icons/Checks1_2x.png); + background-size: 16px 10px; + } + .is_1x .im_message_unread .icon-message-status-tick { + background-image: url(../img/icons/Checks1_1x.png); + } + .im_message_date { + padding: 0; + } } \ No newline at end of file diff --git a/app/css/mobile.css b/app/css/mobile.css index 70655f0e..98107881 100644 --- a/app/css/mobile.css +++ b/app/css/mobile.css @@ -506,12 +506,18 @@ img.im_message_video_thumb, .im_send_panel_wrap { padding: 10px 0 12px; } -.icon-select-tick { - margin: 10px 0 0 -24px +.im_history_scrollable_wrap { + overflow: hidden; + overflow-y: scroll; + -webkit-overflow-scrolling: touch; } .im_history { position: static; } + +.icon-select-tick { + margin: 10px 0 0 -24px +} .im_message_wrap { padding: 0 8px; } diff --git a/app/js/directives_mobile.js b/app/js/directives_mobile.js index fad0ca7b..d20dec94 100644 --- a/app/js/directives_mobile.js +++ b/app/js/directives_mobile.js @@ -126,16 +126,6 @@ angular.module('myApp.directives') onContentLoaded(function () { scrollableWrap.scrollTop = scrollableWrap.scrollHeight; }); - $(historyWrap).nanoScroller({preventPageScrolling: true, tabIndex: -1, iOSNativeScrolling: true}); - - var updateScroller = function (delay) { - // console.trace('scroller update', delay); - $timeout(function () { - if (!$(scrollableWrap).hasClass('im_history_to_bottom')) { - $(historyWrap).nanoScroller(); - } - }, delay || 0); - } var transform = false, trs = ['transform', 'webkitTransform', 'MozTransform', 'msTransform', 'OTransform'], @@ -172,7 +162,6 @@ angular.module('myApp.directives') $(historyMessagesEl).removeClass('im_history_appending'); scrollableWrap.scrollTop = scrollableWrap.scrollHeight; $(historyMessagesEl).css(transform, 'translate(0px, ' + (scrollableWrap.scrollHeight - wasH) + 'px)'); - $(historyWrap).nanoScroller(); var styles = {}; styles[transform] = 'translate(0px, 0px)'; $(historyMessagesEl).addClass('im_history_appending'); @@ -193,17 +182,16 @@ angular.module('myApp.directives') function changeScroll () { var unreadSplit, focusMessage; - if (focusMessage = $('.im_message_focus', scrollableWrap)[0]) { + if (focusMessage = $('.im_message_focus:visible', scrollableWrap)[0]) { scrollableWrap.scrollTop = Math.max(0, focusMessage.offsetTop - Math.floor(scrollableWrap.clientHeight / 2) + 26); atBottom = false; - } else if (unreadSplit = $('.im_message_unread_split', scrollableWrap)[0]) { + } else if (unreadSplit = $('.im_message_unread_split:visible', scrollableWrap)[0]) { scrollableWrap.scrollTop = Math.max(0, unreadSplit.offsetTop - 52); atBottom = false; } else { scrollableWrap.scrollTop = scrollableWrap.scrollHeight; atBottom = true; } - updateScroller(); $timeout(function () { $(scrollableWrap).trigger('scroll'); }); @@ -229,7 +217,6 @@ angular.module('myApp.directives') $scope.$on('ui_history_focus', function () { if (!atBottom) { scrollableWrap.scrollTop = scrollableWrap.scrollHeight; - updateScroller(); atBottom = true; } }); @@ -353,10 +340,8 @@ angular.module('myApp.directives') if (atBottom) { onContentLoaded(function () { scrollableWrap.scrollTop = scrollableWrap.scrollHeight; - updateScroller(); }); } - updateScroller(100); } function updateBottomizer () { @@ -369,7 +354,6 @@ angular.module('myApp.directives') if (historyMessagesEl.offsetHeight > 0 && marginTop > 0) { $(historyMessagesEl).css({marginTop: marginTop}); } - $(historyWrap).nanoScroller(); } $($window).on('resize', updateSizes); diff --git a/app/partials/mobile/im.html b/app/partials/mobile/im.html index 0141fd8e..54036d94 100644 --- a/app/partials/mobile/im.html +++ b/app/partials/mobile/im.html @@ -130,38 +130,37 @@
-
+
-
- -
-
-
- Loading history - No messages here yet... -
- -
-
-
+
+
+
+ Loading history + No messages here yet...
-
- -
- - is typing - - - and are typing - - - , and {{historyState.typing.length - 2}} more are typing - +
+
+
-
+
+ +
+ +
+ + is typing + + + and are typing + + + , and {{historyState.typing.length - 2}} more are typing + +
+
From 5880113b70de4e9878898b97515f0c609119cd34 Mon Sep 17 00:00:00 2001 From: Igor Zhukov Date: Mon, 15 Sep 2014 23:24:19 +0400 Subject: [PATCH 06/11] Improved mobile scrollers --- app/css/app.css | 74 +------ app/css/desktop.css | 60 +++++- app/css/mobile.css | 81 ++------ app/js/directives_mobile.js | 194 ++++++++++++------ app/partials/desktop/head.html | 104 ---------- app/partials/mobile/contacts_modal.html | 30 +-- app/partials/mobile/country_select_modal.html | 26 +-- app/partials/mobile/edit_contact_modal.html | 2 +- app/partials/mobile/head.html | 7 - app/partials/mobile/im.html | 64 +----- app/partials/mobile/peer_select.html | 60 +++--- app/partials/mobile/phonebook_modal.html | 54 +++-- 12 files changed, 287 insertions(+), 469 deletions(-) diff --git a/app/css/app.css b/app/css/app.css index 11f8fb9e..a9051b24 100644 --- a/app/css/app.css +++ b/app/css/app.css @@ -231,12 +231,6 @@ input[type="number"] { line-height: 20px; } -.navbar-peer-wrap { - display: none; -} -.navbar-toggle-wrap { - display: none; -} .tg_page_head .navbar-menu .navbar-nav.navbar-right { margin-right: 0; } @@ -825,29 +819,7 @@ a.tg_radio_on:hover i.icon-radio { } -.im_dialogs_col .nano > .nano-pane { - background : rgba(0,0,0,0.0); - width : 12px; - right: 0px; - -moz-border-radius : 0; - -webkit-border-radius : 0; - border-radius : 0; - /*-webkit-transition : .2s; - -moz-transition : .2s; - -o-transition : .2s; - transition : .2s;*/ - -webkit-transition : none; - -moz-transition : none; - -o-transition : none; - transition : none; -} -.im_dialogs_col .nano > .nano-pane > .nano-slider { - background: #A5B1B9; - margin: 0 5px; - -moz-border-radius : 0; - -webkit-border-radius : 0; - border-radius : 0; -} + .im_dialogs_panel { padding: 12px 12px 6px; @@ -1190,7 +1162,10 @@ a.im_dialog_selected .im_dialog_date { -webkit-perspective: 1000; -webkit-backface-visibility: hidden; } - +.im_history_to_bottom { + overflow: hidden; + position: relative; +} .im_history_to_bottom .im_history_scrollable { position: absolute; bottom: 0; @@ -1892,10 +1867,6 @@ textarea.im_message_field { background-position: -10px -36px; opacity: 1; } - -.im_head_attach { - display: none; -} .im_attach_input, .im_media_attach_input { cursor: pointer; @@ -2358,16 +2329,6 @@ img.chat_modal_participant_photo { } -.emoji-menu .nano > .nano-pane { - background : rgba(255,255,255,0.0); - right: -2px; -} -.emoji-menu .nano > .nano-pane > .nano-slider { - background: #d1d1d1; - margin: 0 3px 0 4px; -} - - .error_modal_window .modal-dialog { max-width: 350px; } @@ -2727,11 +2688,7 @@ a:hover .icon-twitter { opacity: 1; } -.contacts_modal_col { - margin-right: -17px; -} .contacts_scrollable_wrap { - padding: 0 17px 0 0; outline: none ! important; } .contacts_modal_contacts_empty { @@ -3206,27 +3163,6 @@ ce671b orange padding: 14px 0; } -.countries_modal_col .nano > .nano-pane { - background : rgba(3,36,64,0.08); - width : 3px; - right: 6px; - top: 0; - -webkit-transition : .2s; - -moz-transition : .2s; - -o-transition : .2s; - transition : .2s; - -moz-border-radius : 0; - -webkit-border-radius : 0; - border-radius : 0; -} -.countries_modal_col .nano > .nano-pane > .nano-slider { - background : rgba(3,46,79,0.22); - margin: 0; - -moz-border-radius : 0; - -webkit-border-radius : 0; - border-radius : 0; -} - .countries_scrollable_wrap a.countries_modal_country { clear: both; diff --git a/app/css/desktop.css b/app/css/desktop.css index 0ae380b2..40b06895 100644 --- a/app/css/desktop.css +++ b/app/css/desktop.css @@ -54,6 +54,36 @@ opacity : 0.99; } +.emoji-menu .nano > .nano-pane { + background : rgba(255,255,255,0.0); + right: -2px; +} +.emoji-menu .nano > .nano-pane > .nano-slider { + background: #d1d1d1; + margin: 0 3px 0 4px; +} + +.countries_modal_col .nano > .nano-pane { + background : rgba(3,36,64,0.08); + width : 3px; + right: 6px; + top: 0; + -webkit-transition : .2s; + -moz-transition : .2s; + -o-transition : .2s; + transition : .2s; + -moz-border-radius : 0; + -webkit-border-radius : 0; + border-radius : 0; +} +.countries_modal_col .nano > .nano-pane > .nano-slider { + background : rgba(3,46,79,0.22); + margin: 0; + -moz-border-radius : 0; + -webkit-border-radius : 0; + border-radius : 0; +} + .im_page_wrap { @@ -99,6 +129,29 @@ .im_dialogs_scrollable_wrap { padding: 0 19px 0 12px; } +.im_dialogs_col .nano > .nano-pane { + background : rgba(0,0,0,0.0); + width : 12px; + right: 0px; + -moz-border-radius : 0; + -webkit-border-radius : 0; + border-radius : 0; + /*-webkit-transition : .2s; + -moz-transition : .2s; + -o-transition : .2s; + transition : .2s;*/ + -webkit-transition : none; + -moz-transition : none; + -o-transition : none; + transition : none; +} +.im_dialogs_col .nano > .nano-pane > .nano-slider { + background: #A5B1B9; + margin: 0 5px; + -moz-border-radius : 0; + -webkit-border-radius : 0; + border-radius : 0; +} .im_history_col_wrap { float: left; @@ -124,7 +177,6 @@ -o-transition : none; transition : none; } - .contacts_modal_col .nano > .nano-pane { width: 6px; right: 7px; @@ -137,6 +189,12 @@ .im_dialogs_modal_col .im_dialogs_scrollable_wrap { padding: 0 12px 0 12px; } +.contacts_modal_col { + margin-right: -17px; +} +.contacts_scrollable_wrap { + padding: 0 17px 0 0; +} .im_history_col .nano > .nano-pane { top: 10px; diff --git a/app/css/mobile.css b/app/css/mobile.css index 98107881..f82e4196 100644 --- a/app/css/mobile.css +++ b/app/css/mobile.css @@ -38,7 +38,7 @@ html { } .tg_page_head .navbar-inverse .navbar-toggle:hover, -.tg_page_head .navbar-inverse .navbar-toggle:active, +/*.tg_page_head .navbar-inverse .navbar-toggle:active,*/ .tg_page_head .navbar-inverse .navbar-toggle:focus, .tg_page_head .navbar-inverse .open .navbar-toggle { background-color: rgba(0,0,0,0.1); @@ -158,8 +158,8 @@ html { font-size: 13px; height: 46px; } -.tg_page_head .navbar-inverse .navbar-quick-nav > li > a:hover, -.tg_page_head .navbar-inverse .navbar-quick-nav > li > a:active { +.tg_page_head .navbar-inverse .navbar-quick-nav > li > a:hover/*, +.tg_page_head .navbar-inverse .navbar-quick-nav > li > a:active*/ { background-color: rgba(0,0,0,0.1); } .navbar-quick-nav .icon-back { @@ -281,6 +281,12 @@ html { text-align: center; } +.mobile_scrollable_wrap { + overflow: hidden; + overflow-y: scroll; + -webkit-overflow-scrolling: touch; +} + .login_form_wrap { border-radius: 0; @@ -506,10 +512,10 @@ img.im_message_video_thumb, .im_send_panel_wrap { padding: 10px 0 12px; } -.im_history_scrollable_wrap { + +.im_history_scrollable_wrap.im_history_to_bottom { overflow: hidden; - overflow-y: scroll; - -webkit-overflow-scrolling: touch; + position: relative; } .im_history { position: static; @@ -746,19 +752,6 @@ a.im_message_from_photo { padding: 5px 0; margin: 0; } -.im_history_col .nano > .nano-pane { - top: 3px; - right: 3px; - width: 6px; -} -.im_history_col .nano > .nano-pane > .nano-slider, -.contacts_modal_col .nano > .nano-pane > .nano-slider, -.im_dialogs_modal_col .nano > .nano-pane > .nano-slider { - background : rgba(3,46,79,0.22); - border-radius: 3px; - margin: 0; -} - .im_dialogs_col_wrap { @@ -783,9 +776,6 @@ a.im_message_from_photo { .im_dialogs_col { } .im_dialogs_scrollable_wrap { - overflow: hidden; - overflow-y: scroll; - -webkit-overflow-scrolling: touch; } .im_dialogs_panel { @@ -1196,58 +1186,17 @@ a.mobile_modal_action .tg_checkbox_label { padding: 5px; } -.im_head_attach { - display: block; - float: right; - cursor: pointer; - overflow: hidden; - position: relative; - margin: 5px 0 5px 5px; - height: 34px; - border-radius: 4px; - padding: 3px 7px; - border: 1px solid #497495; -} -.navbar_peer_not_selected .im_head_attach { - display: none; -} -.im_head_attach:active { - background-color: rgba(255,255,255,0.1); -} - -.im_head_attach .icon-paperclip { - display: inline-block; - width: 21px; - height: 22px; - vertical-align: text-top; - opacity: 0.8; - background: url(../img/icons/MobileIcons_2x.png) 0 -30px no-repeat; - background-size: 21px 52px; -} -.is_1x .im_head_attach .icon-paperclip { - background-image: url(../img/icons/MobileIcons_1x.png); -} -.im_head_attach:active .icon-paperclip { - opacity: 1; -} .contacts_modal_search { padding: 3px 0 12px; } .contacts_modal_col { - margin-right: -12px; -} -.contacts_scrollable_wrap { - padding-right: 12px; -} -.contacts_modal_col .nano > .nano-pane { - width: 6px; - right: 5px; + margin: 0 -9px; } .contacts_modal_members_list a.contacts_modal_contact { - padding: 8px 0; + padding: 8px 9px; border-radius: 0; - border-bottom: 1px solid #e0e0e0; + border-bottom: 1px solid #eee; } .contacts_modal_members_list li.contacts_modal_contact_wrap { margin: 0; diff --git a/app/js/directives_mobile.js b/app/js/directives_mobile.js index d20dec94..5e3374a7 100644 --- a/app/js/directives_mobile.js +++ b/app/js/directives_mobile.js @@ -89,7 +89,7 @@ angular.module('myApp.directives') } $(element).css({ height: $($window).height() - - (headWrap ? headWrap.offsetHeight : 44) - + (headWrap ? headWrap.offsetHeight : 46) - (panelWrap ? panelWrap.offsetHeight : 58) - parseInt($(dialogsColWrap).css('paddingBottom') || 0) }); @@ -112,10 +112,8 @@ angular.module('myApp.directives') function link ($scope, element, attrs) { var historyWrap = $('.im_history_wrap', element)[0], historyMessagesEl = $('.im_history_messages', element)[0], - historyEl = $('.im_history', element)[0], scrollableWrap = $('.im_history_scrollable_wrap', element)[0], scrollable = $('.im_history_scrollable', element)[0], - panelWrap = $('.im_history_panel_wrap', element)[0], bottomPanelWrap = $('.im_bottom_panel_wrap', element)[0], sendFormWrap = $('.im_send_form_wrap', element)[0], headWrap = $('.tg_page_head')[0], @@ -127,82 +125,58 @@ angular.module('myApp.directives') scrollableWrap.scrollTop = scrollableWrap.scrollHeight; }); - var transform = false, - trs = ['transform', 'webkitTransform', 'MozTransform', 'msTransform', 'OTransform'], - i; - for (i = 0; i < trs.length; i++) { - if (trs[i] in historyMessagesEl.style) { - transform = trs[i]; - break; - } - } - - var animated = transform ? true : false, - curAnimation = false; - $scope.$on('ui_history_append_new', function (e, options) { if (!atBottom && !options.my) { return; } - var curAnimated = animated && - !$rootScope.idle.isIDLE && - historyMessagesEl.clientHeight > 0, - wasH; - - if (curAnimated) { - wasH = scrollableWrap.scrollHeight; - } else { - $(scrollable).css({bottom: 0}); - $(scrollableWrap).addClass('im_history_to_bottom'); - } + + var pr = parseInt($(scrollableWrap).css('paddingRight')) + $(scrollableWrap).addClass('im_history_to_bottom'); + $(scrollable).css({bottom: 0, marginLeft: -Math.ceil(pr / 2)}); onContentLoaded(function () { - if (curAnimated) { - curAnimation = true; - $(historyMessagesEl).removeClass('im_history_appending'); - scrollableWrap.scrollTop = scrollableWrap.scrollHeight; - $(historyMessagesEl).css(transform, 'translate(0px, ' + (scrollableWrap.scrollHeight - wasH) + 'px)'); - var styles = {}; - styles[transform] = 'translate(0px, 0px)'; - $(historyMessagesEl).addClass('im_history_appending'); - $transition($(historyMessagesEl), styles).then(function () { - curAnimation = false; - $(historyMessagesEl).removeClass('im_history_appending'); - updateBottomizer(); - }); - } else { - $(scrollableWrap).removeClass('im_history_to_bottom'); - $(scrollable).css({bottom: ''}); - scrollableWrap.scrollTop = scrollableWrap.scrollHeight; - updateBottomizer(); - } + $(scrollableWrap).removeClass('im_history_to_bottom'); + $(scrollable).css({bottom: '', marginLeft: ''}); + scrollableWrap.scrollTop = scrollableWrap.scrollHeight; + updateBottomizer(); }); }); function changeScroll () { var unreadSplit, focusMessage; + // console.trace('change scroll'); if (focusMessage = $('.im_message_focus:visible', scrollableWrap)[0]) { - scrollableWrap.scrollTop = Math.max(0, focusMessage.offsetTop - Math.floor(scrollableWrap.clientHeight / 2) + 26); + var ch = scrollableWrap.clientHeight, + st = scrollableWrap.scrollTop, + ot = focusMessage.offsetTop, + h = focusMessage.clientHeight; + if (!st || st + ch < ot || st > ot + h) { + scrollableWrap.scrollTop = Math.max(0, ot - Math.floor(ch / 2) + 26); + } atBottom = false; } else if (unreadSplit = $('.im_message_unread_split:visible', scrollableWrap)[0]) { + // console.log('change scroll unread', unreadSplit.offsetTop); scrollableWrap.scrollTop = Math.max(0, unreadSplit.offsetTop - 52); atBottom = false; } else { + // console.log('change scroll bottom'); scrollableWrap.scrollTop = scrollableWrap.scrollHeight; atBottom = true; } $timeout(function () { $(scrollableWrap).trigger('scroll'); + scrollTopInitial = scrollableWrap.scrollTop; }); }; $scope.$on('ui_history_change', function () { + var pr = parseInt($(scrollableWrap).css('paddingRight')) $(scrollableWrap).addClass('im_history_to_bottom'); - $(scrollable).css({bottom: 0}); + $(scrollable).css({bottom: 0, marginLeft: -Math.ceil(pr / 2)}); onContentLoaded(function () { $(scrollableWrap).removeClass('im_history_to_bottom'); - $(scrollable).css({bottom: ''}); + $(scrollable).css({bottom: '', marginLeft: ''}); updateSizes(true); moreNotified = false; lessNotified = false; @@ -227,14 +201,18 @@ angular.module('myApp.directives') pr = parseInt($(scrollableWrap).css('paddingRight')), ch = scrollableWrap.clientHeight; + $(scrollable).css({marginBottom: -(sh - st - ch - 4), marginLeft: -Math.ceil(pr / 2)}); $(scrollableWrap).addClass('im_history_to_bottom'); - scrollableWrap.scrollHeight; // Some strange Chrome bug workaround - $(scrollable).css({bottom: -(sh - st - ch), marginLeft: -Math.ceil(pr / 2)}); + var upd = function () { $(scrollableWrap).removeClass('im_history_to_bottom'); - $(scrollable).css({bottom: '', marginLeft: ''}); - scrollableWrap.scrollTop = st + scrollableWrap.scrollHeight - sh; + $(scrollable).css({marginBottom: '', marginLeft: ''}); + if (scrollTopInitial >= 0) { + changeScroll(); + } else { + scrollableWrap.scrollTop = st + scrollableWrap.scrollHeight - sh; + } updateBottomizer(); moreNotified = false; @@ -259,6 +237,10 @@ angular.module('myApp.directives') updateBottomizer(); lessNotified = false; + if (scrollTopInitial >= 0) { + changeScroll(); + } + $timeout(function () { if (scrollableWrap.scrollHeight != sh) { $(scrollableWrap).trigger('scroll'); @@ -293,23 +275,26 @@ angular.module('myApp.directives') $scope.$on('ui_editor_resize', updateSizes); $scope.$on('ui_height', function () { onContentLoaded(updateSizes); - // updateSizes(); }); - var atBottom = true; + var atBottom = true, + scrollTopInitial = -1; $(scrollableWrap).on('scroll', function (e) { if (!element.is(':visible') || - $(scrollableWrap).hasClass('im_history_to_bottom') || - curAnimation) { + $(scrollableWrap).hasClass('im_history_to_bottom')) { return; } - atBottom = scrollableWrap.scrollTop >= scrollableWrap.scrollHeight - scrollableWrap.clientHeight; + var st = scrollableWrap.scrollTop; + atBottom = st >= scrollableWrap.scrollHeight - scrollableWrap.clientHeight; + if (scrollTopInitial >= 0 && scrollTopInitial != st) { + scrollTopInitial = -1; + } - if (!moreNotified && scrollableWrap.scrollTop <= 300) { + if (!moreNotified && st <= 300) { moreNotified = true; $scope.$emit('history_need_more'); } - else if (!lessNotified && scrollableWrap.scrollTop >= scrollableWrap.scrollHeight - scrollableWrap.clientHeight - 300) { + else if (!lessNotified && st >= scrollableWrap.scrollHeight - scrollableWrap.clientHeight - 300) { lessNotified = true; $scope.$emit('history_need_less'); } @@ -328,7 +313,7 @@ angular.module('myApp.directives') if (!headWrap || !headWrap.offsetHeight) { headWrap = $('.tg_page_head')[0]; } - var historyH = $($window).height() - panelWrap.offsetHeight - bottomPanelWrap.offsetHeight - (headWrap ? headWrap.offsetHeight : 44); + var historyH = $($window).height() - bottomPanelWrap.offsetHeight - (headWrap ? headWrap.offsetHeight : 46); $(historyWrap).css({ height: historyH }); @@ -345,11 +330,11 @@ angular.module('myApp.directives') } function updateBottomizer () { + return; $(historyMessagesEl).css({marginTop: 0}); var marginTop = scrollableWrap.offsetHeight - historyMessagesEl.offsetHeight - - 20 - - (Config.Mobile ? 0 : 49); + - 20; if (historyMessagesEl.offsetHeight > 0 && marginTop > 0) { $(historyMessagesEl).css({marginTop: marginTop}); @@ -362,4 +347,87 @@ angular.module('myApp.directives') onContentLoaded(updateSizes); } + }) + + .directive('myContactsListMobile', function($window, $timeout) { + + return { + link: link + }; + + function link ($scope, element, attrs) { + var searchWrap = $('.contacts_modal_search')[0], + panelWrap = $('.contacts_modal_panel')[0]; + + function updateSizes () { + $(element).css({ + height: $($window).height() - + (panelWrap && panelWrap.offsetHeight || 0) - + (searchWrap && searchWrap.offsetHeight || 0) - + 64 + }); + } + + $($window).on('resize', updateSizes); + $scope.$on('contacts_change', function () { + onContentLoaded(updateSizes) + }); + onContentLoaded(updateSizes); + }; + + }) + + .directive('myCountriesListMobile', function($window, $timeout) { + + return { + link: link + }; + + function link ($scope, element, attrs) { + var searchWrap = $('.countries_modal_search')[0], + panelWrap = $('.countries_modal_panel')[0]; + + function updateSizes () { + $(element).css({ + height: $($window).height() + - (panelWrap && panelWrap.offsetHeight || 0) + - (searchWrap && searchWrap.offsetHeight || 0) + - (46 + 18) + }); + } + + $($window).on('resize', updateSizes); + onContentLoaded(updateSizes); + }; + + }) + + .directive('myInfiniteScrollerMobile', function () { + + return { + link: link, + scope: true + }; + + function link($scope, element, attrs) { + + var scrollableWrap = element[0], + moreNotified = false; + + $(scrollableWrap).on('scroll', function (e) { + if (!element.is(':visible')) return; + if (!moreNotified && + scrollableWrap.scrollTop >= scrollableWrap.scrollHeight - scrollableWrap.clientHeight - 300) { + moreNotified = true; + $scope.$apply(function () { + $scope.slice.limit += ($scope.slice.limitDelta || 20); + }); + + onContentLoaded(function () { + moreNotified = false; + }); + } + }); + + }; }) \ No newline at end of file diff --git a/app/partials/desktop/head.html b/app/partials/desktop/head.html index 0de2e01f..510ec950 100644 --- a/app/partials/desktop/head.html +++ b/app/partials/desktop/head.html @@ -2,112 +2,8 @@ diff --git a/app/partials/mobile/im.html b/app/partials/mobile/im.html index 54036d94..0b7c25ec 100644 --- a/app/partials/mobile/im.html +++ b/app/partials/mobile/im.html @@ -19,7 +19,7 @@
-
+

No contacts yet

@@ -65,13 +65,6 @@
-
-
-

Get started

-

Welcome to Telegram Web. You can always set your profile photo and change your name in Settings.

- -
-
Loading history
@@ -79,58 +72,7 @@
-
- -
-
- - Info - Edit - -
- Media - -
- - Show recent messages - Show all messages - - - -
-

Photos

-

Videos

-

Documents

-

Voice messages

- -

-
- - -
-
- - - - - -
-

-
- -
- -
- -
- -
+
@@ -140,7 +82,7 @@
-
+
diff --git a/app/partials/mobile/peer_select.html b/app/partials/mobile/peer_select.html index c7dbcb61..f36ceaab 100644 --- a/app/partials/mobile/peer_select.html +++ b/app/partials/mobile/peer_select.html @@ -32,41 +32,37 @@
- +
-
-
-
-
    -
  • -
-
-
Contacts
- -
-
+
+
    +
  • +
+
+
Contacts
+
diff --git a/app/partials/mobile/phonebook_modal.html b/app/partials/mobile/phonebook_modal.html index c3dae07f..18ef0623 100644 --- a/app/partials/mobile/phonebook_modal.html +++ b/app/partials/mobile/phonebook_modal.html @@ -37,45 +37,41 @@
-
+
+
-
-
- -
- Your phonebook is empty. -
+
+ Your phonebook is empty. +
- -
-
From e6260ac10743239c1a359225d844e4b30751f49d Mon Sep 17 00:00:00 2001 From: Igor Zhukov Date: Mon, 15 Sep 2014 23:31:26 +0400 Subject: [PATCH 07/11] Fixed countries modal scroll --- app/css/app.css | 3 +++ app/js/controllers.js | 2 +- app/partials/desktop/login.html | 2 +- app/partials/mobile/country_select_modal.html | 2 +- app/partials/mobile/login.html | 2 +- 5 files changed, 7 insertions(+), 4 deletions(-) diff --git a/app/css/app.css b/app/css/app.css index a9051b24..78e56e2a 100644 --- a/app/css/app.css +++ b/app/css/app.css @@ -788,6 +788,9 @@ a.tg_radio_on:hover i.icon-radio { .login_phone_number { width: 198px; } +.login_phone_code { + text-align: center; +} .login_first_name_wrap { margin-bottom: 11px; } diff --git a/app/js/controllers.js b/app/js/controllers.js index 8fa9163e..ed58abab 100644 --- a/app/js/controllers.js +++ b/app/js/controllers.js @@ -59,7 +59,7 @@ angular.module('myApp.controllers', []) function initPhoneCountry () { var langCode = (navigator.language || '').toLowerCase(), countryIso2 = Config.LangCountries[langCode], - shouldPregenerate = !Config.Mobile; + shouldPregenerate = !Config.Navigator.mobile; if (['en', 'en-us', 'en-uk'].indexOf(langCode) == -1) { if (countryIso2 !== undefined) { diff --git a/app/partials/desktop/login.html b/app/partials/desktop/login.html index 143dfc92..8f1a8b45 100644 --- a/app/partials/desktop/login.html +++ b/app/partials/desktop/login.html @@ -52,7 +52,7 @@
- +
-
+
  • diff --git a/app/partials/mobile/login.html b/app/partials/mobile/login.html index 143dfc92..8f1a8b45 100644 --- a/app/partials/mobile/login.html +++ b/app/partials/mobile/login.html @@ -52,7 +52,7 @@
    - +
    - - - -
-
\ No newline at end of file diff --git a/app/partials/mobile/im.html b/app/partials/mobile/im.html index 0b7c25ec..4c466fd9 100644 --- a/app/partials/mobile/im.html +++ b/app/partials/mobile/im.html @@ -21,11 +21,15 @@
-
+

No contacts yet

Get started by adding a contact to chat with

- - + +
diff --git a/app/partials/mobile/login.html b/app/partials/mobile/login.html index 8f1a8b45..4a83c9b7 100644 --- a/app/partials/mobile/login.html +++ b/app/partials/mobile/login.html @@ -1,7 +1,7 @@
- diff --git a/app/partials/mobile/head.html b/app/partials/mobile/head.html index 76f0ced5..072f8646 100644 --- a/app/partials/mobile/head.html +++ b/app/partials/mobile/head.html @@ -19,7 +19,7 @@ diff --git a/app/vendor/jquery.emojiarea/jquery.emojiarea.js b/app/vendor/jquery.emojiarea/jquery.emojiarea.js index 91585625..0eb0a93e 100644 --- a/app/vendor/jquery.emojiarea/jquery.emojiarea.js +++ b/app/vendor/jquery.emojiarea/jquery.emojiarea.js @@ -484,15 +484,17 @@ '' + '' + '').appendTo(this.$itemsTailWrap); - this.$itemsWrap = $('
').appendTo(this.$itemsTailWrap); + this.$itemsWrap = $('
').appendTo(this.$itemsTailWrap); this.$items = $('
').appendTo(this.$itemsWrap); $('
').appendTo(this.$menu); /*! MODIFICATION END */ $body.append(this.$menu); - /*! MODIFICATION: Following line is added by Igor Zhukov, in order to add scrollbars to EmojiMenu */ - this.$itemsWrap.nanoScroller({preventPageScrolling: true, tabIndex: -1}); + /*! MODIFICATION: Following 3 lines were added by Igor Zhukov, in order to add scrollbars to EmojiMenu */ + if (!Config.Mobile) { + this.$itemsWrap.nanoScroller({preventPageScrolling: true, tabIndex: -1}); + } $body.on('keydown', function(e) { if (e.keyCode === KEY_ESC || e.keyCode === KEY_TAB) { @@ -583,7 +585,9 @@ }); this.currentCategory = category; this.load(category); - this.$itemsWrap.nanoScroller({ scroll: 'top' }); + if (!Config.Mobile) { + this.$itemsWrap.nanoScroller({ scroll: 'top' }); + } }; /*! MODIFICATION END */ @@ -608,9 +612,11 @@ var updateItems = function () { self.$items.html(html.join('')); - setTimeout(function () { - self.$itemsWrap.nanoScroller(); - }, 100); + if (!Config.Mobile) { + setTimeout(function () { + self.$itemsWrap.nanoScroller(); + }, 100); + } } if (category > 0) { From 8131aae27943cb50fbfe715b0f71d79e0b4ae98a Mon Sep 17 00:00:00 2001 From: Igor Zhukov Date: Thu, 18 Sep 2014 23:39:47 +0400 Subject: [PATCH 10/11] Unread history bugfixes --- app/js/controllers.js | 6 +++--- app/js/directives.js | 44 +++++++++++++++++++++++-------------------- app/js/services.js | 3 +++ 3 files changed, 30 insertions(+), 23 deletions(-) diff --git a/app/js/controllers.js b/app/js/controllers.js index 54b0ce5b..22939611 100644 --- a/app/js/controllers.js +++ b/app/js/controllers.js @@ -1018,9 +1018,6 @@ angular.module('myApp.controllers', []) else if (forceRecent) { limit = 10; } - else if (Config.Mobile) { - limit = 20; - } moreActive = false; morePending = false; @@ -1064,6 +1061,9 @@ angular.module('myApp.controllers', []) if ($scope.skippedHistory) { delete message.unread; } + if (historyResult.unreadOffset) { + message.unreadAfter = true; + } peerHistory.messages.push(message); }); peerHistory.messages.reverse(); diff --git a/app/js/directives.js b/app/js/directives.js index 5e194280..8fcfe73c 100644 --- a/app/js/directives.js +++ b/app/js/directives.js @@ -101,29 +101,33 @@ angular.module('myApp.directives', ['myApp.filters']) } }); - if ($scope.historyMessage.unread) { - var deregisterUnreadAfter; - if (!$scope.historyMessage.out) { - var applyUnreadAfter = function () { - if (unreadAfter != ($scope.historyUnreadAfter == $scope.historyMessage.id)) { - unreadAfter = !unreadAfter; - if (unreadAfter) { - if (unreadAfterSplit) { - unreadAfterSplit.show(); - } else { - unreadAfterSplit = $(unreadSplitHtml).prependTo(element); - } + var deregisterUnreadAfter; + if (!$scope.historyMessage.out && + ($scope.historyMessage.unread || $scope.historyMessage.unreadAfter)) { + var applyUnreadAfter = function () { + if ($scope.peerHistory.peerID != $scope.historyPeer.id) { + return; + } + if (unreadAfter != ($scope.historyUnreadAfter == $scope.historyMessage.id)) { + unreadAfter = !unreadAfter; + if (unreadAfter) { + if (unreadAfterSplit) { + unreadAfterSplit.show(); } else { - unreadAfterSplit.hide(); - if (deregisterUnreadAfter) { - deregisterUnreadAfter(); - } + unreadAfterSplit = $(unreadSplitHtml).prependTo(element); + } + } else { + unreadAfterSplit.hide(); + if (deregisterUnreadAfter) { + deregisterUnreadAfter(); } } - }; - applyUnreadAfter(); - deregisterUnreadAfter = $scope.$on('messages_unread_after', applyUnreadAfter); - } + } + }; + applyUnreadAfter(); + deregisterUnreadAfter = $scope.$on('messages_unread_after', applyUnreadAfter); + } + if ($scope.historyMessage.unread) { element.addClass(unreadClass); var deregisterUnread = $scope.$on('messages_read', function () { if (!$scope.historyMessage.unread) { diff --git a/app/js/services.js b/app/js/services.js index f4d16e54..356e2d2d 100644 --- a/app/js/services.js +++ b/app/js/services.js @@ -929,6 +929,9 @@ angular.module('myApp.services', []) unreadOffset = unreadCount; } } + else if (Config.Mobile) { + limit = 20; + } } else if (maxID > 0) { offsetNotFound = true; From 8849072e930915e505f9723a3469185d78fb8ea0 Mon Sep 17 00:00:00 2001 From: Igor Zhukov Date: Fri, 19 Sep 2014 10:20:05 +0400 Subject: [PATCH 11/11] Improved mobile layout Refactor styles Remove unused mobile styles Added new modals for mobile --- app/css/app.css | 775 ++---------------- app/css/desktop.css | 605 +++++++++++++- app/css/mobile.css | 72 +- app/js/controllers.js | 22 +- app/js/directives.js | 2 +- app/js/services.js | 35 +- app/partials/desktop/im.html | 10 - app/partials/desktop/message.html | 1 - app/partials/mobile/changelog_modal.html | 2 +- app/partials/mobile/chat_create_modal.html | 41 +- app/partials/mobile/chat_edit_modal.html | 41 +- app/partials/mobile/contacts_modal.html | 5 + app/partials/mobile/edit_contact_modal.html | 45 +- app/partials/mobile/im.html | 47 +- app/partials/mobile/import_contact_modal.html | 46 +- app/partials/mobile/message.html | 8 - app/partials/mobile/message_attach_audio.html | 3 - .../mobile/message_attach_document.html | 4 - app/partials/mobile/message_attach_video.html | 20 - app/partials/mobile/profile_edit_modal.html | 47 +- .../jquery.emojiarea/jquery.emojiarea.js | 1 - 21 files changed, 846 insertions(+), 986 deletions(-) diff --git a/app/css/app.css b/app/css/app.css index 5265cf30..1b060270 100644 --- a/app/css/app.css +++ b/app/css/app.css @@ -4,14 +4,12 @@ html { display: none; background: #dee4e9 url(../img/bg_tile.png) 0 0 repeat; overflow: visible; - /*background-size: 300px 468px;*/ } body { color: #000; background: none; font: 12px/18px "Lucida Grande", "Lucida Sans Unicode", Arial, Helvetica, Verdana, sans-serif; overflow: visible; - /*-webkit-font-smoothing: antialiased;*/ } .font-light { font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Light", Helvetica, Arial , Verdana, sans-serif; @@ -186,7 +184,7 @@ input[type="number"] { .ios_standalone .tg_page_head .navbar > .container { margin-top: 20px; } -.ios_standalone .modal.page_modal { +.ios_standalone .modal.mobile_modal { border-top: 20px solid #497495; } .tg_page_head .navbar > .container .navbar-brand { @@ -315,9 +313,6 @@ input[type="number"] { overflow-y: auto; padding: 10px; } -.mobile_modal { - padding: 0; -} .modal-dialog { margin: 0 auto; } @@ -539,9 +534,6 @@ a.tg_checkbox:hover { line-height: 18px; vertical-align: middle; } -/*a.tg_checkbox:hover span.icon-checkbox-outer { - -webkit-filter: brightness(95%); -}*/ a.tg_checkbox:hover span.icon-checkbox-outer { background: #bdbdbd; } @@ -584,9 +576,6 @@ a.tg_radio:hover { line-height: 20px; vertical-align: middle; } -/*a.tg_radio:hover i.icon-radio { - -webkit-filter: brightness(95%); -}*/ a.tg_radio:hover i.icon-radio { background: #f2f2f2; border-color: #ccc; @@ -595,6 +584,56 @@ a.tg_radio_on:hover i.icon-radio { border-color: #5785aa; } +.tg_range_wrap { + line-height: 18px; +} +input.tg_range { + cursor: pointer; + outline: none !important; + -webkit-appearance: none; + width: 100%; + max-width: 362px; + display: inline-block; + background: #c7c7c7; + height: 3px; + line-height: 18px; + vertical-align: top; + margin: 8px 0; + border-radius: 2px; +} +input.tg_range::-moz-range-track { + cursor: pointer; + outline: none !important; + -webkit-appearance: none; + width: 100%; + max-width: 362px; + display: inline-block; + background: #c7c7c7; + height: 3px; + line-height: 18px; + vertical-align: top; + margin: 8px 0; + border-radius: 2px; +} +input.tg_range::-webkit-slider-thumb { + border: 0; + -webkit-appearance: none; + background: #568cb5; + width: 12px; + height: 12px; + border-radius: 6px; + overflow: hidden; +} + +input.tg_range::-moz-range-thumb { + border: 0; + background: #568cb5; + width: 12px; + height: 12px; + border-radius: 6px; + overflow: hidden; +} + .tg_form_group { padding: 6px 0; @@ -610,7 +649,6 @@ a.tg_radio_on:hover i.icon-radio { .img_fullsize_with_progress_wrap { position: relative; - /*margin: 0 auto 20px;*/ margin: 0 auto; } .img_fullsize_progress_overlay { @@ -619,7 +657,6 @@ a.tg_radio_on:hover i.icon-radio { height: 100%; } .img_fullsize_progress_wrap { - /*background: rgba(0,0,0, .1);*/ position: relative; } .img_fullsize_progress { @@ -1064,57 +1101,6 @@ a.im_dialog_selected .im_dialog_date { /* IM history */ -.im_history_panel_wrap { - margin: 0 23px 0 15px; - cursor: pointer; - position: relative; - -webkit-box-shadow: 0px 1px 0px rgba(0, 0, 0, 0.12); - -moz-box-shadow: 0px 1px 0px rgba(0, 0, 0, 0.12); - box-shadow: 0px 1px 0px rgba(0, 0, 0, 0.12); - - position: relative; - z-index: 2; - min-height: 44px; -} -.im_history_panel { - padding: 10px 4px 0; -} -.im_history_panel_title h4 { - font-size: 17px; - line-height: 20px; - white-space: nowrap; - text-overflow: ellipsis; - overflow: hidden; - margin: 8px 0 6px; -} -.im_history_panel_title h4 small { - color: #999; - font-size: 13px; - margin-left: 5px; -} -.im_history_panel_info_link, -.im_history_panel_edit_link, -.im_history_panel_return_link, -.im_history_panel_media_dropdown .dropdown-toggle { - font-size: 13px; - font-weight: normal; - padding-top: 5px; - line-height: 1; -} -.im_history_panel_media_dropdown { - padding-top: 2px; -} -.im_history_panel_edit_link, -.im_history_panel_return_link, -.im_history_panel_media_dropdown { - font-size: 13px; - margin-right: 20px; -} -.im_history_panel_media_dropdown, -.im_history_panel_return_count { - margin-left: 5px; -} - .icon-caret { width: 8px; height: 4px; @@ -1131,22 +1117,7 @@ a.im_dialog_selected .im_dialog_date { background-image: url(../img/icons/IconsetW_1x.png); } -.im_history_panel_media_dropdown .dropdown-menu { - border-radius: 2px; - right: auto; - left: -15px; - margin-top: 11px; - padding: 0; - - -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.175); - box-shadow: 0 1px 3px rgba(0, 0, 0, 0.175); -} - -.im_history_no_dialogs_wrap { - margin: 122px 170px 60px; - text-align: center; -} .im_dialogs_empty_header { font-size: 15px; color: #808080; @@ -1166,10 +1137,10 @@ a.im_dialog_selected .im_dialog_date { -webkit-transform: translateZ(0); -webkit-perspective: 1000; -webkit-backface-visibility: hidden; + position: relative; } .im_history_to_bottom { overflow: hidden; - position: relative; } .im_history_to_bottom .im_history_scrollable { position: absolute; @@ -1177,30 +1148,16 @@ a.im_dialog_selected .im_dialog_date { width: 100%; } -.im_history_appending { - -webkit-transition: all ease-in-out 0.2s; - -moz-transition: all ease-in-out 0.2s; - -ms-transition: all ease-in-out 0.2s; - -o-transition: all ease-in-out 0.2s; - transition: all ease-in-out 0.2s; -} - .im_history { - /*padding: 20px 0 0 3px;*/ padding: 20px 0 0 0; - /*max-width: 500px;*/ - /*margin: 0 auto;*/ position: relative; } .im_history_typing_wrap { - /*margin-top: 13px;*/ - /*height: 18px;*/ line-height: 18px; width: 100%; height: 49px; - /*margin-bottom: 13px;*/ padding: 13px 0 18px; overflow: hidden; -webkit-user-select: none; @@ -1307,7 +1264,6 @@ a.im_message_contact_photo { } .im_message_contact_name { font-weight: bold; - /*color: #3C6E97;*/ } a.im_message_photo_thumb, a.im_message_video_thumb { @@ -1441,8 +1397,6 @@ div.im_message_video_thumb { margin-top: 3px; border-radius: 3px; display: inline-block; - /*line-height: 0;*/ - width: 340px; } .icon-document, @@ -1500,12 +1454,6 @@ img.im_message_document_thumb { max-width: 100px; max-height: 100px; vertical-align: middle; - /*-webkit-filter: blur(1px); - -moz-filter: blur(1px); - -o-filter: blur(1px); - -ms-filter: blur(1px); - filter: blur(1px); - filter:progid:DXImageTransform.Microsoft.Blur(PixelRadius='1');*/ } .im_message_document_name_wrap { overflow: hidden; @@ -1665,9 +1613,6 @@ img.im_message_document_thumb { .im_content_message_wrap { margin: 8px 0px 8px 16px } -.im_message_error_btn { - display: none; -} .im_message_date, .im_message_fwd_date { color: #adadad; @@ -1681,9 +1626,6 @@ div.im_message_body { display: block; overflow: hidden; } -.im_message_fwd_title { - display: none; -} .im_message_fwd_from { margin-top: 5px; } @@ -1694,11 +1636,7 @@ div.im_message_body { margin-top: 4px; margin-bottom: 4px; } -.im_message_fwd .im_message_fwd_author_wrap, -.im_message_fwd .im_message_text, -.im_message_fwd .im_message_media { - margin-left: 42px; -} + a.im_message_fwd_photo { position: absolute; margin-top: 1px; @@ -1770,7 +1708,6 @@ span.emoji { } .im_send_panel_wrap { - max-width: 526px; margin: 0 auto; padding: 10px 15px 22px 15px; } @@ -1778,12 +1715,9 @@ span.emoji { position: relative; } .im_send_form { - max-width: 389px; margin: 0 auto; position: absolute; bottom: 0; - left: 62px; - right: 62px; } .im_send_dropbox_wrap { @@ -1870,7 +1804,6 @@ textarea.im_message_field { .im_media_attach_input { cursor: pointer; font-size: 72px !important; - /*visibility: hidden;*/ opacity: 0.01; position: absolute; z-index: 100; @@ -1916,34 +1849,7 @@ textarea.im_message_field { opacity: 1; } -.im_panel_peer_photo, -.im_panel_own_photo { - width: 50px; - height: 50px; - border-radius: 3px; - overflow: hidden; -} -div.im_panel_peer_photo { - cursor: pointer; - margin-left: 12px; - height: 55px; -} -div.im_panel_own_photo { - margin-right: 12px; -} -.im_panel_peer_online { - background: #6DBF69; - border: 1px solid #FFF; - display: block; - width: 11px; - height: 11px; - border-radius: 6px; - overflow: hidden; - position: absolute; - margin-top: -7px; - margin-left: 43px; -} .icon-online { background: #6DBF69; border: 1px solid #FFF; @@ -1985,188 +1891,6 @@ img.img_fullsize { font-size: 12px; } -.user_modal_window .modal-dialog { - max-width: 506px; -} - - - -.user_modal_photo_profile_wrap { - padding: 13px 12px; - margin-bottom: 15px; -} -.user_modal_image_wrap { - display: block; - width: 100px; - margin-right: 22px; - overflow: hidden; - border-radius: 3px; -} -.user_modal_image { - width: 100px; - height: 100px; -} -.user_modal_header { - font-weight: bold; - margin: 2px 0 7px; -} -.user_modal_status { - color: #999; - margin-bottom: 16px; -} - -.user_modal_main_btn { - border: 0; - font-size: 12px; - padding-left: 16px; - padding-right: 16px; - margin: 8px 10px 0 0; - float: left; -} -.user_modal_other_btn { - margin: 8px 0 0 0; - float: left; -} -.user_modal_other_btn .dropdown-toggle { - border: 0; - font-size: 12px; -} -.user_modal_other_btn .dropdown-menu { - margin-left: -3px; -} - -.user_modal_settings_wrap { - margin-top: 25px; -} -.user_modal_notifications { - font-weight: bold; -} -.user_modal_clear { - margin-top: 20px; -} - - -.chat_modal_window .modal-dialog { - max-width: 506px; -} - -.chat_modal_header { - font-weight: bold; - margin: 0 0 10px; -} -.chat_modal_members_count { - color: #999; - margin-bottom: 16px; -} - -.chat_modal_actions_wrap { - position: relative; -} - -.chat_modal_main_btn { - border: 0; - font-size: 12px; - padding-left: 16px; - padding-right: 16px; - float: left; - position: relative; - overflow: hidden; - margin-right: 10px; - margin-top: 8px; -} -.chat_modal_invite_btn { - border: 0; - font-size: 12px; - padding-left: 16px; - padding-right: 16px; - float: left; - position: relative; - margin-right: 10px; - margin-top: 8px; -} -.chat_modal_delete_btn { - border: 0; - font-size: 12px; - padding-left: 16px; - padding-right: 16px; - float: left; - margin-right: 10px; - margin-top: 8px; -} -.chat_modal_other_btn { - margin-top: 8px; - float: left; -} -.chat_modal_other_btn .dropdown-toggle { - border: 0; - font-size: 12px; -} -.chat_modal_other_btn .dropdown-menu { - margin-left: -3px; -} - -.chat_modal_photo_update_link { - display: block; - padding: 5px 14px; - clear: both; - font-weight: normal; - line-height: 1.428571429; - color: #333333; - white-space: nowrap; - font-size: 13px; - overflow: hidden; - position: relative; -} -.chat_modal_photo_update_link:hover { - text-decoration: none; - color: #262626; - background-color: #f5f5f5; -} - -.chat_modal_settings_wrap { - margin-top: 10px; -} - -.chat_modal_participant_wrap { - padding: 8px 0; - border-top: 1px solid #F0F0F0; -} -.chat_modal_participant_wrap:first-child { - border-top: 0; -} -.chat_modal_participant_kick { - padding: 11px 0; - display: block; -} -.chat_modal_participant_name { - display: block; - color: #3C6E97; - font-weight: bold; - margin: 1px 0 2px; -} -.non_osx .chat_modal_participant_name { - font-size: 12px; -} -.chat_modal_participant_status { - color: #999; -} -a.chat_modal_participant_photo { - width: 40px; - height: 40px; - margin-right: 10px; - border-radius: 2px; - overflow: hidden; -} -img.chat_modal_participant_photo { - width: 40px; - height: 40px; -} -.chat_modal_members_forbidden { - color: #999; -} - - - /* Emoji area */ @@ -2303,7 +2027,6 @@ img.chat_modal_participant_photo { border-radius: 2px; } .emoji-menu .emoji-items a:hover { - /*background-color: rgba(0,0,0, 0.5);*/ background-color: #edf2f5; } .emoji-menu:after { @@ -2315,18 +2038,6 @@ img.chat_modal_participant_photo { display: none; } -.emoji-menu-tail { - display: none; - background: url(../img/icons/IconsetW.png) -14px -268px no-repeat; - background-size: 42px 891px; - width: 14px; - height: 7px; - margin: 0 83px; -} -.is_1x .emoji-menu-tail { - background-image: url(../img/icons/IconsetW_1x.png); -} - .error_modal_window .modal-dialog { max-width: 350px; @@ -2411,183 +2122,14 @@ img.chat_modal_participant_photo { } - - - - -.settings_modal_window .modal-dialog { - max-width: 482px; -} - .settings_modal_wrap .im_attach_input { z-index: 999; } -.settings_modal_settings { - padding: 4px 0; - margin: 0; -} - -.settings_modal_wrap .user_modal_main_btn { - position: relative; - overflow: hidden; -} - -.settings_profile_edit_form { - margin-bottom: 15px; -} -.settings_profile_image_wrap { - float: left; - width: 120px; - margin-right: 22px; -} -.settings_profile_first_name, -.settings_profile_last_name { - width: 180px; - float: left; - margin-bottom: 0; -} -.settings_profile_first_name label, -.settings_profile_last_name label { - margin-bottom: 3px; -} -.settings_profile_first_name { - margin-right: 22px; - margin-bottom: 10px; -} -.settings_profile_last_name { - margin-right: 10px; - margin-bottom: 15px; -} -.settings_profile_save { - padding-top: 21px; - float: left; -} -.settings_profile_save_btn { - width: 50px; -} - -.settings_profile_edit_form { - margin-bottom: 0; -} -.settings_profile_edit_form input { - font-size: 12px; - line-height: normal; - background: #F2F2F2; - border: 1px solid #F2F2F2; - border-radius: 0; - padding: 6px 6px 6px 6px; - margin-bottom: 0; - margin: 0; -} -.settings_profile_edit_form input:focus, -.settings_profile_edit_form input:active { - background-color: #FFF; -} - -.settings_send_choose_form input { - margin-top: 2px; -} -.settings_send_choose_form { - margin-bottom: 20px; -} - -.settings_user_phone, -.settings_version { - color: #999; -} - - -.tg_range_wrap { - line-height: 18px; -} -input.tg_range { - cursor: pointer; - outline: none !important; - -webkit-appearance: none; - width: 100%; - max-width: 362px; - display: inline-block; - background: #c7c7c7; - height: 3px; - line-height: 18px; - vertical-align: top; - margin: 8px 0; - border-radius: 2px; -} -input.tg_range::-moz-range-track { - cursor: pointer; - outline: none !important; - -webkit-appearance: none; - width: 100%; - max-width: 362px; - display: inline-block; - background: #c7c7c7; - height: 3px; - line-height: 18px; - vertical-align: top; - margin: 8px 0; - border-radius: 2px; -} -input.tg_range::-webkit-slider-thumb { - border: 0; - -webkit-appearance: none; - background: #568cb5; - width: 12px; - height: 12px; - border-radius: 6px; - overflow: hidden; -} - -input.tg_range::-moz-range-thumb { - border: 0; - background: #568cb5; - width: 12px; - height: 12px; - border-radius: 6px; - overflow: hidden; -} - -.icon-volume-outer { +.settings_external_service { + line-height: 0; display: inline-block; - background: #c7c7c7; - border-radius: 10px; - overflow: hidden; - height: 18px; - padding: 5px 8px; - margin: 0 9px 0 0; - width: 32px; -} -.icon-volume-inner { - display: block; - background: #fff; - float: left; - width: 2px; - vertical-align: bottom; - margin: 0 1px 0; - height: 8px; -} -.icon-volume-inner1 { - height: 2px; - margin-top: 6px; -} -.icon-volume-inner2 { - height: 4px; - margin-top: 4px; -} -.icon-volume-inner3 { - height: 6px; - margin-top: 2px; -} - -.icon-volume-outer1 .icon-volume-inner2, -.icon-volume-outer1 .icon-volume-inner3, -.icon-volume-outer1 .icon-volume-inner4, -.icon-volume-outer2 .icon-volume-inner3, -.icon-volume-outer2 .icon-volume-inner4, -.icon-volume-outer3 .icon-volume-inner4 { - display: none; + padding: 7px 9px; } - .settings_about_section_body { padding-right: 0; } @@ -2595,11 +2137,6 @@ input.tg_range::-moz-range-thumb { margin-top: 7px; margin-bottom: 3px; } -.settings_external_service { - line-height: 0; - display: inline-block; - padding: 7px 9px; -} .icon-github { display: inline-block; width: 59px; @@ -2629,27 +2166,6 @@ a:hover .icon-twitter { } /* Contacts modal */ -.contacts_modal_window .modal-dialog { - max-width: 456px; -} -.contacts_modal_header { - padding: 6px 0 18px; -} -.contacts_modal_edit_wrap { - position: absolute; - margin-top: -1px; -} -.contacts_modal_edit_link { - font-size: 14px; - padding: 5px 7px; -} -.contacts_modal_title { - font-size: 14px; - margin: 0; - text-align: center; - font-weight: bold; -} - .contacts_modal_search { padding: 0 0 14px; position: relative; @@ -2764,9 +2280,6 @@ a.contacts_modal_contact:hover .contacts_modal_contact_status, .contacts_modal_members_list .contacts_modal_contact_wrap:hover .icon-contact-tick { background-position: -9px -481px; opacity: 0.5; -} -.contacts_modal_members_list .contacts_modal_contact_wrap.active { - } .contacts_modal_members_list .contacts_modal_contact_wrap.active .icon-contact-tick { background-position: -9px -481px; @@ -2802,28 +2315,8 @@ a.contacts_modal_contact:hover .contacts_modal_contact_status, .im_panel_to_top .im_edit_panel_wrap { background: #FFF; position: absolute; - /*width: 652px;*/ width: 100%; } -.im_edit_flush_link, -.im_edit_cancel_link { - display: block; - padding: 6px 17px; - border-radius: 2px; - overflow: hidden; - margin: 6px 6px; -} -.im_edit_cancel_link { - float: left; -} -.im_edit_flush_link { - float: right; -} -.im_edit_flush_link:hover, -.im_edit_cancel_link:hover { - background: #f2f6fa; - text-decoration: none; -} .im_edit_selected_actions { text-align: center; @@ -2845,76 +2338,14 @@ a.contacts_modal_contact:hover .contacts_modal_contact_status, line-height: 34px; } -.icon-delete { - display: inline-block; - width: 12px; - height: 15px; - - background: url(../img/icons/IconsetW.png) -15px -319px no-repeat; - background-size: 42px 891px; -} -.is_1x .icon-delete { - background-image: url(../img/icons/IconsetW_1x.png); -} -.im_message_selected .im_message_outer_wrap, -.im_message_focus .im_message_outer_wrap { - background: #f2f6fa; -} - -.im_history_selectable .im_message_outer_wrap { - cursor: pointer; -} -.im_history_selectable .im_message_outer_wrap:hover { - background: #f2f6fa; -} - -.im_message_selected .im_message_date, -.im_message_selected .im_message_document_size, -.im_message_selected .im_message_audio_duration, -.im_message_selected .im_message_audio_size, -.im_message_selected .im_message_fwd_date, .im_message_focus .im_message_date, .im_message_focus .im_message_document_size, .im_message_focus .im_message_audio_duration, .im_message_focus .im_message_audio_size, -.im_message_focus .im_message_fwd_date, -.im_history_selectable .im_message_outer_wrap:hover .im_message_date, -.im_history_selectable .im_message_outer_wrap:hover .im_message_document_size, -.im_history_selectable .im_message_outer_wrap:hover .im_message_audio_duration, -.im_history_selectable .im_message_outer_wrap:hover .im_message_audio_size, -.im_history_selectable .im_message_outer_wrap:hover .im_message_fwd_date { +.im_message_focus .im_message_fwd_date { color: #68839c; } -.im_message_wrap { - max-width: 526px; - padding: 0 15px; - margin: 0 auto; - position: static; -} -@media (min-width: 901px) { - .im_message_wrap { - position: relative; - } -} -.im_content_message_select_area { - display: none; - cursor: pointer; - position: absolute; - width: 112px; - height: 52px; - margin: -8px 0 0 -112px; - -webkit-user-select: text; -} -@media (min-width: 1024px) { - .im_content_message_select_area { - display: block; - } - .im_message_wrap { - position: relative; - } -} - .icon-select-tick { display: none; width: 26px; @@ -2926,28 +2357,6 @@ a.contacts_modal_contact:hover .contacts_modal_contact_status, .is_1x .icon-select-tick { background-image: url(../img/icons/IconsetW_1x.png); } -.im_history_selectable .icon-select-tick, -.im_content_message_select_area:hover .icon-select-tick { - display: inline-block; -} -.im_message_selected .icon-select-tick, -.im_history_selectable .im_message_outer_wrap:hover .icon-select-tick, -.im_content_message_select_area:hover .icon-select-tick { - background-position: -9px -481px; - opacity: 0.5; -} -.im_message_selected .icon-select-tick { - opacity: 1 !important; -} - - -/* Dialogs modal */ -.peer_select_window .modal-dialog { - max-width: 506px; -} -.peer_select_modal_wrap .modal-body { - padding: 0 2px 14px; -} /* Colorized user names @@ -2985,58 +2394,6 @@ ce671b orange margin-left: 8px; } - -.tooltip-inner { - background: rgba(0,0,0, 0.8); -} -.tooltip-arrow { - opacity: 0.8; -} - - -.im_dialogs_panel_dropdown { - margin-left: 8px; -} - -.im_dialogs_panel_dropdown .dropdown-toggle { - background: #F2F2F2; - display: block; - border-radius: 2px; - overflow: hidden; - padding: 11px 12px; - width: 38px; - height: 34px; -} -.im_dialogs_panel_dropdown .dropdown-toggle .icon-bar { - background: #b3b3b3; - display: block; - height: 2px; - margin-bottom: 3px; -} -.im_dialogs_panel_dropdown .dropdown-toggle .icon-bar:last-child { - margin-bottom: 0; -} - - - -.im_dialogs_panel_dropdown.open .dropdown-toggle { - background: #6690b0; -} -.im_dialogs_panel_dropdown.open .dropdown-toggle .icon-bar { - background: #fff; -} - -/* Import contact modal */ -.import_contact_modal_window .modal-dialog { - max-width: 480px; -} - -.modal-content-animated { - -webkit-transition: margin-top linear 0.2s; - transition: margin-top linear 0.2s; -} - - /* Gif documents */ .img_gif_with_progress_wrap { position: relative; @@ -3057,15 +2414,9 @@ ce671b orange padding: 1px; max-width: 100%; } - .img_gif_image { max-width: 100%; } -/*.img_gif_image_wrap img { - overflow: hidden; - border-radius: 2px; -}*/ - .img_gif_info_wrap { color: #FFF; font-size: 10px; @@ -3111,16 +2462,11 @@ ce671b orange font-weight: normal; } -.countries_modal_col { - max-height: 350px; -} - .countries_modal_search { padding: 0 0 12px; margin: 0 20px; position: relative; } - .countries_modal_search_field { font-size: 12px; line-height: normal; @@ -3157,12 +2503,9 @@ ce671b orange .countries_modal_search_clear:hover { opacity: 1; } - .countries_modal_wrap .modal-body { padding: 14px 0; } - - .countries_scrollable_wrap a.countries_modal_country { clear: both; overflow: hidden; @@ -3272,10 +2615,6 @@ ce671b orange } } - -.changelog_modal_window .modal-dialog { - max-width: 506px; -} .changelog_card_wrap { text-align: center; padding: 12px 0 18px; diff --git a/app/css/desktop.css b/app/css/desktop.css index 4663e0ad..96950dc3 100644 --- a/app/css/desktop.css +++ b/app/css/desktop.css @@ -136,10 +136,6 @@ -moz-border-radius : 0; -webkit-border-radius : 0; border-radius : 0; - /*-webkit-transition : .2s; - -moz-transition : .2s; - -o-transition : .2s; - transition : .2s;*/ -webkit-transition : none; -moz-transition : none; -o-transition : none; @@ -164,10 +160,6 @@ width : 9px; right: 0; top: 0; - /*-webkit-transition : .2s; - -moz-transition : .2s; - -o-transition : .2s; - transition : .2s;*/ -moz-border-radius : 2px; -webkit-border-radius : 2px; border-radius : 2px; @@ -211,6 +203,103 @@ } +.im_history_panel_wrap { + margin: 0 23px 0 15px; + cursor: pointer; + position: relative; + -webkit-box-shadow: 0px 1px 0px rgba(0, 0, 0, 0.12); + -moz-box-shadow: 0px 1px 0px rgba(0, 0, 0, 0.12); + box-shadow: 0px 1px 0px rgba(0, 0, 0, 0.12); + + position: relative; + z-index: 2; + min-height: 44px; +} +.im_history_panel { + padding: 10px 4px 0; +} +.im_history_panel_title h4 { + font-size: 17px; + line-height: 20px; + white-space: nowrap; + text-overflow: ellipsis; + overflow: hidden; + margin: 8px 0 6px; +} +.im_history_panel_title h4 small { + color: #999; + font-size: 13px; + margin-left: 5px; +} +.im_history_panel_info_link, +.im_history_panel_edit_link, +.im_history_panel_return_link, +.im_history_panel_media_dropdown .dropdown-toggle { + font-size: 13px; + font-weight: normal; + padding-top: 5px; + line-height: 1; +} +.im_history_panel_media_dropdown { + padding-top: 2px; +} +.im_history_panel_edit_link, +.im_history_panel_return_link, +.im_history_panel_media_dropdown { + font-size: 13px; + margin-right: 20px; +} +.im_history_panel_media_dropdown, +.im_history_panel_return_count { + margin-left: 5px; +} + +.im_history_panel_media_dropdown .dropdown-menu { + border-radius: 2px; + right: auto; + left: -15px; + margin-top: 11px; + padding: 0; + + -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.175); + box-shadow: 0 1px 3px rgba(0, 0, 0, 0.175); +} + +.im_history_no_dialogs_wrap { + margin: 122px 170px 60px; + text-align: center; +} + +.im_history_appending { + -webkit-transition: all ease-in-out 0.2s; + -moz-transition: all ease-in-out 0.2s; + -ms-transition: all ease-in-out 0.2s; + -o-transition: all ease-in-out 0.2s; + transition: all ease-in-out 0.2s; +} + +/* Contacts modal */ +.contacts_modal_window .modal-dialog { + max-width: 456px; +} +.contacts_modal_header { + padding: 6px 0 18px; +} +.contacts_modal_edit_wrap { + position: absolute; + margin-top: -1px; +} +.contacts_modal_edit_link { + font-size: 14px; + padding: 5px 7px; +} +.contacts_modal_title { + font-size: 14px; + margin: 0; + text-align: center; + font-weight: bold; +} + .icon-message-status { background: #43A4DB; border: 0; @@ -229,7 +318,9 @@ .im_message_pending .icon-message-status { opacity: 0.5; } - +.im_message_error_btn { + display: none; +} .im_message_error .im_message_error_btn { display: inline; } @@ -241,6 +332,27 @@ opacity: 1; } + +.im_edit_flush_link, +.im_edit_cancel_link { + display: block; + padding: 6px 17px; + border-radius: 2px; + overflow: hidden; + margin: 6px 6px; +} +.im_edit_cancel_link { + float: left; +} +.im_edit_flush_link { + float: right; +} +.im_edit_flush_link:hover, +.im_edit_cancel_link:hover { + background: #f2f6fa; + text-decoration: none; +} + .im_submit { padding: 6px 13px; font-size: 13px; @@ -248,6 +360,59 @@ min-width: 60px; } +.im_message_selected .im_message_date, +.im_message_selected .im_message_document_size, +.im_message_selected .im_message_audio_duration, +.im_message_selected .im_message_audio_size, +.im_message_selected .im_message_fwd_date, +.im_history_selectable .im_message_outer_wrap:hover .im_message_date, +.im_history_selectable .im_message_outer_wrap:hover .im_message_document_size, +.im_history_selectable .im_message_outer_wrap:hover .im_message_audio_duration, +.im_history_selectable .im_message_outer_wrap:hover .im_message_audio_size, +.im_history_selectable .im_message_outer_wrap:hover .im_message_fwd_date { + color: #68839c; +} + +.im_content_message_select_area { + display: none; + cursor: pointer; + position: absolute; + width: 112px; + height: 52px; + margin: -8px 0 0 -112px; + -webkit-user-select: text; +} +@media (min-width: 1024px) { + .im_content_message_select_area { + display: block; + } + .im_message_wrap { + position: relative; + } +} + +.im_history_selectable .icon-select-tick, +.im_content_message_select_area:hover .icon-select-tick { + display: inline-block; +} +.im_message_selected .icon-select-tick, +.im_history_selectable .im_message_outer_wrap:hover .icon-select-tick, +.im_content_message_select_area:hover .icon-select-tick { + background-position: -9px -481px; + opacity: 0.5; +} +.im_message_selected .icon-select-tick { + opacity: 1 !important; +} + +/* Dialogs modal */ +.peer_select_window .modal-dialog { + max-width: 506px; +} +.peer_select_modal_wrap .modal-body { + padding: 0 2px 14px; +} + @media (max-width: 900px) { @@ -282,4 +447,426 @@ .im_message_date { padding: 0; } +} + + +.im_message_fwd .im_message_fwd_author_wrap, +.im_message_fwd .im_message_text, +.im_message_fwd .im_message_media { + margin-left: 42px; +} + +.im_send_panel_wrap { + max-width: 526px; +} +.im_send_form { + max-width: 389px; + left: 62px; + right: 62px; +} + +.im_panel_peer_photo, +.im_panel_own_photo { + width: 50px; + height: 50px; + border-radius: 3px; + overflow: hidden; +} +div.im_panel_peer_photo { + cursor: pointer; + margin-left: 12px; + height: 55px; +} +div.im_panel_own_photo { + margin-right: 12px; +} + +.im_panel_peer_online { + background: #6DBF69; + border: 1px solid #FFF; + display: block; + width: 11px; + height: 11px; + border-radius: 6px; + overflow: hidden; + position: absolute; + margin-top: -7px; + margin-left: 43px; +} + +/* Peer modals */ +.user_modal_window .modal-dialog { + max-width: 506px; +} +.user_modal_photo_profile_wrap { + padding: 13px 12px; + margin-bottom: 15px; +} +.user_modal_image_wrap { + display: block; + width: 100px; + margin-right: 22px; + overflow: hidden; + border-radius: 3px; +} +.user_modal_image { + width: 100px; + height: 100px; +} +.user_modal_header { + font-weight: bold; + margin: 2px 0 7px; +} +.user_modal_status { + color: #999; + margin-bottom: 16px; +} + +.user_modal_main_btn { + border: 0; + font-size: 12px; + padding-left: 16px; + padding-right: 16px; + margin: 8px 10px 0 0; + float: left; +} +.user_modal_other_btn { + margin: 8px 0 0 0; + float: left; +} +.user_modal_other_btn .dropdown-toggle { + border: 0; + font-size: 12px; +} +.user_modal_other_btn .dropdown-menu { + margin-left: -3px; +} + +.user_modal_settings_wrap { + margin-top: 25px; +} +.user_modal_notifications { + font-weight: bold; +} +.user_modal_clear { + margin-top: 20px; +} + + +.chat_modal_window .modal-dialog { + max-width: 506px; +} + +.chat_modal_header { + font-weight: bold; + margin: 0 0 10px; +} +.chat_modal_members_count { + color: #999; + margin-bottom: 16px; +} + +.chat_modal_actions_wrap { + position: relative; +} + +.chat_modal_main_btn { + border: 0; + font-size: 12px; + padding-left: 16px; + padding-right: 16px; + float: left; + position: relative; + overflow: hidden; + margin-right: 10px; + margin-top: 8px; +} +.chat_modal_invite_btn { + border: 0; + font-size: 12px; + padding-left: 16px; + padding-right: 16px; + float: left; + position: relative; + margin-right: 10px; + margin-top: 8px; +} +.chat_modal_delete_btn { + border: 0; + font-size: 12px; + padding-left: 16px; + padding-right: 16px; + float: left; + margin-right: 10px; + margin-top: 8px; +} +.chat_modal_other_btn { + margin-top: 8px; + float: left; +} +.chat_modal_other_btn .dropdown-toggle { + border: 0; + font-size: 12px; +} +.chat_modal_other_btn .dropdown-menu { + margin-left: -3px; +} + +.chat_modal_photo_update_link { + display: block; + padding: 5px 14px; + clear: both; + font-weight: normal; + line-height: 1.428571429; + color: #333333; + white-space: nowrap; + font-size: 13px; + overflow: hidden; + position: relative; +} +.chat_modal_photo_update_link:hover { + text-decoration: none; + color: #262626; + background-color: #f5f5f5; +} + +.chat_modal_settings_wrap { + margin-top: 10px; +} + +.chat_modal_participant_wrap { + padding: 8px 0; + border-top: 1px solid #F0F0F0; +} +.chat_modal_participant_wrap:first-child { + border-top: 0; +} +.chat_modal_participant_kick { + padding: 11px 0; + display: block; +} +.chat_modal_participant_name { + display: block; + color: #3C6E97; + font-weight: bold; + margin: 1px 0 2px; +} +.non_osx .chat_modal_participant_name { + font-size: 12px; +} +.chat_modal_participant_status { + color: #999; +} +a.chat_modal_participant_photo { + width: 40px; + height: 40px; + margin-right: 10px; + border-radius: 2px; + overflow: hidden; +} +img.chat_modal_participant_photo { + width: 40px; + height: 40px; +} +.chat_modal_members_forbidden { + color: #999; +} + +.settings_modal_window .modal-dialog { + max-width: 482px; +} +.settings_modal_settings { + padding: 4px 0; + margin: 0; +} +.settings_modal_wrap .user_modal_main_btn { + position: relative; + overflow: hidden; +} +.settings_profile_edit_form { + margin-bottom: 15px; +} +.settings_profile_image_wrap { + float: left; + width: 120px; + margin-right: 22px; +} +.settings_profile_first_name, +.settings_profile_last_name { + width: 180px; + float: left; + margin-bottom: 0; +} +.settings_profile_first_name label, +.settings_profile_last_name label { + margin-bottom: 3px; +} +.settings_profile_first_name { + margin-right: 22px; + margin-bottom: 10px; +} +.settings_profile_last_name { + margin-right: 10px; + margin-bottom: 15px; +} +.settings_profile_save { + padding-top: 21px; + float: left; +} +.settings_profile_save_btn { + width: 50px; +} + +.settings_profile_edit_form { + margin-bottom: 0; +} +.settings_profile_edit_form input { + font-size: 12px; + line-height: normal; + background: #F2F2F2; + border: 1px solid #F2F2F2; + border-radius: 0; + padding: 6px 6px 6px 6px; + margin-bottom: 0; + margin: 0; +} +.settings_profile_edit_form input:focus, +.settings_profile_edit_form input:active { + background-color: #FFF; +} + +.settings_send_choose_form input { + margin-top: 2px; +} +.settings_send_choose_form { + margin-bottom: 20px; +} + +.settings_user_phone, +.settings_version { + color: #999; +} +.icon-volume-outer { + display: inline-block; + background: #c7c7c7; + border-radius: 10px; + overflow: hidden; + height: 18px; + padding: 5px 8px; + margin: 0 9px 0 0; + width: 32px; +} +.icon-volume-inner { + display: block; + background: #fff; + float: left; + width: 2px; + vertical-align: bottom; + margin: 0 1px 0; + height: 8px; +} +.icon-volume-inner1 { + height: 2px; + margin-top: 6px; +} +.icon-volume-inner2 { + height: 4px; + margin-top: 4px; +} +.icon-volume-inner3 { + height: 6px; + margin-top: 2px; +} + +.icon-volume-outer1 .icon-volume-inner2, +.icon-volume-outer1 .icon-volume-inner3, +.icon-volume-outer1 .icon-volume-inner4, +.icon-volume-outer2 .icon-volume-inner3, +.icon-volume-outer2 .icon-volume-inner4, +.icon-volume-outer3 .icon-volume-inner4 { + display: none; +} + + +.im_message_selected .im_message_outer_wrap, +.im_message_focus .im_message_outer_wrap { + background: #f2f6fa; +} +.im_history_selectable .im_message_outer_wrap { + cursor: pointer; +} +.im_history_selectable .im_message_outer_wrap:hover { + background: #f2f6fa; +} + +.im_message_wrap { + max-width: 526px; + padding: 0 15px; + margin: 0 auto; +} + +.im_message_wrap { + position: static; +} +@media (min-width: 901px) { + .im_message_wrap { + position: relative; + } +} + +.tooltip-inner { + background: rgba(0,0,0, 0.8); +} +.tooltip-arrow { + opacity: 0.8; +} + +.im_dialogs_panel_dropdown { + margin-left: 8px; +} + +.im_dialogs_panel_dropdown .dropdown-toggle { + background: #F2F2F2; + display: block; + border-radius: 2px; + overflow: hidden; + padding: 11px 12px; + width: 38px; + height: 34px; +} +.im_dialogs_panel_dropdown .dropdown-toggle .icon-bar { + background: #b3b3b3; + display: block; + height: 2px; + margin-bottom: 3px; +} +.im_dialogs_panel_dropdown .dropdown-toggle .icon-bar:last-child { + margin-bottom: 0; +} + + + +.im_dialogs_panel_dropdown.open .dropdown-toggle { + background: #6690b0; +} +.im_dialogs_panel_dropdown.open .dropdown-toggle .icon-bar { + background: #fff; +} + +/* Import contact modal */ +.import_contact_modal_window .modal-dialog { + max-width: 480px; +} + +.modal-content-animated { + -webkit-transition: margin-top linear 0.2s; + transition: margin-top linear 0.2s; +} + +.countries_modal_col { + max-height: 350px; +} + +.changelog_modal_window .modal-dialog { + max-width: 506px; } \ No newline at end of file diff --git a/app/css/mobile.css b/app/css/mobile.css index 7b74b037..40be67e9 100644 --- a/app/css/mobile.css +++ b/app/css/mobile.css @@ -232,7 +232,6 @@ html { margin-right: 0; } .navbar_offline .navbar-quick-nav li > a > .navbar-quick-back-title, -.navbar_offline .im_head_attach, .navbar_offline .navbar-search-wrap, .navbar_offline .navbar-history-edit { display: none; @@ -326,15 +325,6 @@ html { border: 0; overflow: hidden; } - -.im_page_footer { - display: none; -} - -.im_panel_own_photo, -.im_panel_peer_photo { - display: none; -} .im_history_selectable .im_message_outer_wrap:hover, .im_message_selected { background: #e1e9f0; @@ -453,10 +443,6 @@ html { width: auto; float: none; } -.im_message_audio_actions, -.im_message_document_actions { - display: none; -} .im_message_audio_player_wrap { height: 38px; line-height: 38px; @@ -514,9 +500,6 @@ img.im_message_video_thumb, -ms-filter: none; filter: none; } -.im_message_video .im_message_document_info { - display: none; -} .im_message_document_thumb_wrap { position: absolute; @@ -612,6 +595,7 @@ img.im_message_video_thumb, } .im_message_date { font-size: 12px; + padding-left: 4px; } .im_message_out .im_message_meta { right: auto; @@ -735,20 +719,10 @@ a.im_message_from_photo { } -.form-control { +.im_dialogs_search_field, +.contacts_modal_search_field { font-size: 1.2em; } -.im_history_typing_wrap { - display: none; -} -.im_history_panel_info_link { - display: none; -} - -.im_edit_flush_link, -.im_edit_cancel_link { - display: none; -} .im_edit_delete_btn, .im_edit_forward_btn { background: none !important; @@ -768,10 +742,6 @@ a.im_message_from_photo { .im_edit_forward_btn strong { font-weight: normal; } - -.im_edit_panel_border { - display: none; -} .im_edit_panel_wrap { padding: 5px 0; margin: 0; @@ -797,10 +767,6 @@ a.im_message_from_photo { .im_page_peer_not_selected .im_dialogs_col_wrap { display: block; } -.im_dialogs_col { -} -.im_dialogs_scrollable_wrap { -} .im_dialogs_panel { display: none; @@ -810,9 +776,6 @@ a.im_message_from_photo { .im_dialogs_panel_search.im_dialogs_panel { display: block; } -.im_dialogs_panel_dropdown { - display: none; -} .im_page_split .im_dialogs_search { margin-right: 0; } @@ -872,7 +835,9 @@ a.im_dialog:hover .im_dialog_message_text, a.im_dialog_selected .im_dialog_message_text { color: #8f8f8f; } - +.im_message_fwd_title { + display: none; +} .im_grouped_fwd_start .im_message_fwd_title { display: block; color: #8a8a8a; @@ -911,12 +876,6 @@ a.im_message_fwd_author { margin-left: 50px; } -.im_grouped_fwd_short .im_message_fwd.im_message_out .im_message_fwd_author_wrap, -.im_grouped_fwd_short .im_message_fwd.im_message_out .im_message_text, -.im_grouped_fwd_short .im_message_fwd.im_message_out .im_message_media { - /*margin-left: 0;*/ -} - .im_dialogs_scrollable_wrap a.im_dialog:hover, @@ -928,29 +887,29 @@ a.im_message_fwd_author { background-color: #f4f4f4; } - -.modal.page_modal { +.modal.mobile_modal { background: #FFF; + padding: 0; } -.page_modal .modal-content { +.mobile_modal .modal-content { border-radius: 0; box-shadow: none; } -.page_modal .modal-dialog { +.mobile_modal .modal-dialog { margin: 0; } -.page_modal .modal-content .modal-body { +.mobile_modal .modal-content .modal-body { padding-left: 0; padding-right: 0; } -.page_modal .modal-footer { +.mobile_modal .modal-footer { padding-left: 0; padding-right: 0; padding-bottom: 9px; } .mobile_modal_body, -.page_modal .modal-content .mobile_modal_body { +.mobile_modal .modal-content .mobile_modal_body { padding: 9px; } @@ -1101,9 +1060,6 @@ a.mobile_modal_action .tg_checkbox_label { .is_1x .im_submit { background-image: url(../img/icons/IconsetW_1x.png); } -.im_submit_text { - display: none; -} .im_attach { position: absolute; @@ -1133,7 +1089,6 @@ a.mobile_modal_action .tg_checkbox_label { opacity: 1; } -.im_media_attach, .im_attach, .im_send_form_empty .im_submit { display: none; @@ -1250,7 +1205,6 @@ a.mobile_modal_action .tg_checkbox_label { } .countries_modal_col { margin: 0 -9px; - max-height: none; } .countries_modal_members_list { padding: 0 12px 0 12px; diff --git a/app/js/controllers.js b/app/js/controllers.js index 22939611..8f2e5045 100644 --- a/app/js/controllers.js +++ b/app/js/controllers.js @@ -43,15 +43,10 @@ angular.module('myApp.controllers', []) $scope.callPending = {}; $scope.chooseCountry = function () { - var className = 'countries_modal_window page_modal'; - if (Config.Mobile) { - className += ' mobile_modal'; - } - var modal = $modal.open({ templateUrl: templateUrl('country_select_modal'), controller: 'CountrySelectModalController', - windowClass: className + windowClass: 'countries_modal_window mobile_modal' }); modal.result.then(selectCountry); @@ -332,15 +327,10 @@ angular.module('myApp.controllers', []) $scope.historyState = {selectActions: false, typing: []}; $scope.openSettings = function () { - var className = 'settings_modal_window page_modal'; - if (Config.Mobile) { - className += ' mobile_modal'; - } - $modal.open({ templateUrl: templateUrl('settings_modal'), controller: 'SettingsModalController', - windowClass: className + windowClass: 'settings_modal_window mobile_modal' }); } @@ -363,7 +353,7 @@ angular.module('myApp.controllers', []) templateUrl: templateUrl('chat_create_modal'), controller: 'ChatCreateModalController', scope: scope, - windowClass: 'group_edit_modal_window' + windowClass: 'group_edit_modal_window mobile_modal' }); } @@ -1821,7 +1811,7 @@ angular.module('myApp.controllers', []) $modal.open({ templateUrl: templateUrl(edit ? 'edit_contact_modal' : 'import_contact_modal'), controller: 'ImportContactModalController', - windowClass: 'import_contact_modal_window page_modal', + windowClass: 'import_contact_modal_window mobile_modal', scope: scope }).result.then(function (foundUserID) { if ($scope.userID == foundUserID) { @@ -2015,7 +2005,7 @@ angular.module('myApp.controllers', []) templateUrl: templateUrl('chat_edit_modal'), controller: 'ChatEditModalController', scope: scope, - windowClass: 'group_edit_modal_window' + windowClass: 'group_edit_modal_window mobile_modal' }); } @@ -2107,7 +2097,7 @@ angular.module('myApp.controllers', []) $modal.open({ templateUrl: templateUrl('profile_edit_modal'), controller: 'ProfileEditModalController', - windowClass: 'profile_edit_modal_window page_modal' + windowClass: 'profile_edit_modal_window mobile_modal' }); }; diff --git a/app/js/directives.js b/app/js/directives.js index 8fcfe73c..3d207db6 100644 --- a/app/js/directives.js +++ b/app/js/directives.js @@ -1650,7 +1650,7 @@ angular.module('myApp.directives', ['myApp.filters']) var updateMargin = function () { if (Config.Mobile && - $(element[0].parentNode.parentNode.parentNode).hasClass('page_modal')) { + $(element[0].parentNode.parentNode.parentNode).hasClass('mobile_modal')) { return; } var height = element[0].parentNode.offsetHeight, diff --git a/app/js/services.js b/app/js/services.js index 356e2d2d..e8f7deec 100644 --- a/app/js/services.js +++ b/app/js/services.js @@ -188,16 +188,11 @@ angular.module('myApp.services', []) var scope = $rootScope.$new(); scope.userID = userID; - var className = 'user_modal_window page_modal'; - if (Config.Mobile) { - className += ' mobile_modal'; - } - var modalInstance = $modal.open({ templateUrl: templateUrl('user_modal'), controller: 'UserModalController', scope: scope, - windowClass: className + windowClass: 'user_modal_window mobile_modal' }); }; $rootScope.openUser = openUser; @@ -291,7 +286,7 @@ angular.module('myApp.services', []) return $modal.open({ templateUrl: templateUrl('import_contact_modal'), controller: 'ImportContactModalController', - windowClass: 'import_contact_modal_window' + windowClass: 'import_contact_modal_window mobile_modal' }).result.then(function (foundUserID) { if (!foundUserID) { return $q.reject(); @@ -381,7 +376,7 @@ angular.module('myApp.services', []) return $modal.open({ templateUrl: templateUrl('phonebook_modal'), controller: 'PhonebookModalController', - windowClass: 'phonebook_modal_window page_modal mobile_modal' + windowClass: 'phonebook_modal_window mobile_modal' }); } @@ -524,16 +519,11 @@ angular.module('myApp.services', []) var scope = $rootScope.$new(); scope.chatID = chatID; - var className = 'chat_modal_window page_modal'; - if (Config.Mobile) { - className += ' mobile_modal'; - } - var modalInstance = $modal.open({ templateUrl: templateUrl('chat_modal'), controller: 'ChatModalController', scope: scope, - windowClass: className + windowClass: 'chat_modal_window mobile_modal' }); } @@ -3846,17 +3836,11 @@ angular.module('myApp.services', []) angular.extend(scope, options); } - var className = 'peer_select_window page_modal'; - - if (Config.Mobile) { - className += ' mobile_modal'; - } - return $modal.open({ templateUrl: templateUrl('peer_select'), controller: 'PeerSelectController', scope: scope, - windowClass: className + windowClass: 'peer_select_window mobile_modal' }).result; } @@ -3879,16 +3863,11 @@ angular.module('myApp.services', []) scope.action = 'select'; } - var className = 'contacts_modal_window page_modal'; - if (Config.Mobile) { - className += ' mobile_modal'; - } - return $modal.open({ templateUrl: templateUrl('contacts_modal'), controller: 'ContactsModalController', scope: scope, - windowClass: className + windowClass: 'contacts_modal_window mobile_modal' }).result; } @@ -3958,7 +3937,7 @@ angular.module('myApp.services', []) $modal.open({ templateUrl: templateUrl('changelog_modal'), scope: $scope, - windowClass: 'changelog_modal_window page_modal' + windowClass: 'changelog_modal_window mobile_modal' }); } diff --git a/app/partials/desktop/im.html b/app/partials/desktop/im.html index afc6f297..0641967e 100644 --- a/app/partials/desktop/im.html +++ b/app/partials/desktop/im.html @@ -83,16 +83,6 @@
-
-
-

Get started

-

Welcome to Telegram Web. You can always set your profile photo and change your name in Settings.

- -
-
- Please select a chat to start messaging -
-
Loading history
diff --git a/app/partials/desktop/message.html b/app/partials/desktop/message.html index 1f5d3714..b1fbb717 100644 --- a/app/partials/desktop/message.html +++ b/app/partials/desktop/message.html @@ -42,7 +42,6 @@
-
Forwarded message
diff --git a/app/partials/mobile/changelog_modal.html b/app/partials/mobile/changelog_modal.html index bc41f668..fc6ca0ce 100644 --- a/app/partials/mobile/changelog_modal.html +++ b/app/partials/mobile/changelog_modal.html @@ -1,4 +1,4 @@ -
+
diff --git a/app/partials/mobile/chat_create_modal.html b/app/partials/mobile/chat_create_modal.html index 28cb5493..46cd4367 100644 --- a/app/partials/mobile/chat_create_modal.html +++ b/app/partials/mobile/chat_create_modal.html @@ -1,24 +1,43 @@ -
+
+ +
+
+
+ +
+ + + +
- +
+
+
- - -

Create Group

+
- +
-
- Cancel - -
-
\ No newline at end of file diff --git a/app/partials/mobile/chat_edit_modal.html b/app/partials/mobile/chat_edit_modal.html index a73bb27c..00a46cfa 100644 --- a/app/partials/mobile/chat_edit_modal.html +++ b/app/partials/mobile/chat_edit_modal.html @@ -1,24 +1,43 @@ -
+
+ +
+
+
+ +
+ + + +
- +
+
+
-
- -

Edit Group

+
- +
-
- Cancel - -
-
\ No newline at end of file diff --git a/app/partials/mobile/contacts_modal.html b/app/partials/mobile/contacts_modal.html index 59353867..1c09a186 100644 --- a/app/partials/mobile/contacts_modal.html +++ b/app/partials/mobile/contacts_modal.html @@ -36,6 +36,11 @@
@@ -115,12 +100,6 @@
-
- - Delete Chat - Clear History - - Cancel
Forward @@ -135,23 +114,6 @@
-
- - -
-
- -
@@ -159,11 +121,6 @@
-
- - -
-
@@ -173,9 +130,7 @@
- +
diff --git a/app/partials/mobile/import_contact_modal.html b/app/partials/mobile/import_contact_modal.html index 9cd14722..226f1616 100644 --- a/app/partials/mobile/import_contact_modal.html +++ b/app/partials/mobile/import_contact_modal.html @@ -1,31 +1,53 @@ -
+
+ +
+
+
+ +
+ + + +
- +
+
+
-
- -

Add new contact

+
- +
- +
- +
-
- Phonebook - Cancel - +
+ Phonebook
\ No newline at end of file diff --git a/app/partials/mobile/message.html b/app/partials/mobile/message.html index 1f5d3714..cb64bc86 100644 --- a/app/partials/mobile/message.html +++ b/app/partials/mobile/message.html @@ -20,14 +20,6 @@
-
- -
- - - - - diff --git a/app/partials/mobile/message_attach_audio.html b/app/partials/mobile/message_attach_audio.html index d964bd3e..680beb0c 100644 --- a/app/partials/mobile/message_attach_audio.html +++ b/app/partials/mobile/message_attach_audio.html @@ -12,9 +12,6 @@
-
- Play -
Cancel
diff --git a/app/partials/mobile/message_attach_document.html b/app/partials/mobile/message_attach_document.html index 91c58065..dca019ae 100644 --- a/app/partials/mobile/message_attach_document.html +++ b/app/partials/mobile/message_attach_document.html @@ -21,10 +21,6 @@
-
- Download - Open -
Cancel
diff --git a/app/partials/mobile/message_attach_video.html b/app/partials/mobile/message_attach_video.html index f463cd15..7fe315a5 100644 --- a/app/partials/mobile/message_attach_video.html +++ b/app/partials/mobile/message_attach_video.html @@ -8,24 +8,4 @@ thumb="historyMessage.media.video.thumb" /> - -
-
- Video - - -
-
- Download - Play video -
-
- Cancel -
-
-
-
-
-
-
\ No newline at end of file diff --git a/app/partials/mobile/profile_edit_modal.html b/app/partials/mobile/profile_edit_modal.html index dd0e0e40..2f402e97 100644 --- a/app/partials/mobile/profile_edit_modal.html +++ b/app/partials/mobile/profile_edit_modal.html @@ -1,27 +1,46 @@ -
+
+ +
+
+
+ +
+ + + +
- +
+
+
-
- -

Edit Profile

+ -
- +
+
-
- +
+
-
- Cancel - -
-
\ No newline at end of file diff --git a/app/vendor/jquery.emojiarea/jquery.emojiarea.js b/app/vendor/jquery.emojiarea/jquery.emojiarea.js index 0eb0a93e..e14c90df 100644 --- a/app/vendor/jquery.emojiarea/jquery.emojiarea.js +++ b/app/vendor/jquery.emojiarea/jquery.emojiarea.js @@ -486,7 +486,6 @@ '').appendTo(this.$itemsTailWrap); this.$itemsWrap = $('
').appendTo(this.$itemsTailWrap); this.$items = $('
').appendTo(this.$itemsWrap); - $('
').appendTo(this.$menu); /*! MODIFICATION END */ $body.append(this.$menu);