diff --git a/.gitignore b/.gitignore index f8813b3c..27af7609 100644 --- a/.gitignore +++ b/.gitignore @@ -7,3 +7,4 @@ dist package_dist webogram*.zip +*.sublime-workspace \ No newline at end of file diff --git a/app/css/app.css b/app/css/app.css index ffcafca7..8f72eae4 100644 --- a/app/css/app.css +++ b/app/css/app.css @@ -71,47 +71,71 @@ input[type="number"]::-webkit-inner-spin-button { } -.btn-tg { +.btn-success { color: #ffffff; background-color: #6AC065; border-color: #6AC065; } -.btn-tg:hover, -.btn-tg:focus, -.btn-tg:active, -.btn-tg.active, -.open .dropdown-toggle.btn-tg { +.btn-success:hover, +.btn-success:focus, +.btn-success:active, +.btn-success.active, +.open .dropdown-toggle.btn-success { color: #ffffff; background-color: #61b75b; border-color: #61b75b; } -.btn-tg:active, -.btn-tg.active, -.open .dropdown-toggle.btn-tg { +.btn-success:active, +.btn-success.active, +.open .dropdown-toggle.btn-success { background: #5aaf54; background-image: none; } -.btn-tg.disabled, -.btn-tg[disabled], -fieldset[disabled] .btn-tg, -.btn-tg.disabled:hover, -.btn-tg[disabled]:hover, -fieldset[disabled] .btn-tg:hover, -.btn-tg.disabled:focus, -.btn-tg[disabled]:focus, -fieldset[disabled] .btn-tg:focus, -.btn-tg.disabled:active, -.btn-tg[disabled]:active, -fieldset[disabled] .btn-tg:active, -.btn-tg.disabled.active, -.btn-tg[disabled].active, -fieldset[disabled] .btn-tg.active { - color: #DDD; - background-color: #999; - border-color: #999; + +.btn-danger { + color: #ffffff; + background-color: #c05f5a; + border-color: #c05f5a; +} +.btn-danger:hover, +.btn-danger:focus, +.btn-danger:active, +.btn-danger.active, +.open .dropdown-toggle.btn-danger { + color: #ffffff; + background-color: #ab5450; + border-color: #ab5450; +} +.btn-danger:active, +.btn-danger.active, +.open .dropdown-toggle.btn-danger { + background: #a24f4b; + background-image: none; +} + + +.btn-primary { + color: #ffffff; + background-color: #598db5; + border-color: #598db5; +} +.btn-primary:hover, +.btn-primary:focus, +.btn-primary:active, +.btn-primary.active, +.open .dropdown-toggle.btn-primary { + color: #ffffff; + background-color: #4f84ac; + border-color: #4f84ac; +} +.btn-primary:active, +.btn-primary.active, +.open .dropdown-toggle.btn-primary { + background: #4c799c; + background-image: none; } .tg_page_head .navbar { @@ -1139,15 +1163,15 @@ div.im_message_video_thumb { } .icon-message-status { background: #43A4DB; - border: 1px solid #FFF; + border: 0; display: block; - width: 11px; - height: 11px; + width: 10px; + height: 10px; border-radius: 7px; overflow: hidden; position: absolute; - margin-left: -27px; - margin-top: 14px; + margin-left: -26px; + margin-top: 13px; opacity: 0; } .icon-message-status-unread { @@ -2087,8 +2111,13 @@ a.contacts_modal_contact:hover .contacts_modal_contact_status { /* Messages edit panel */ .im_edit_panel_wrap { display: none; - border-top: 1px solid #EEE; - padding: 5px 5px; + padding: 10px 0 34px; + margin: 0 24px 0 12px; +} +.im_edit_panel_border { + display: block; + margin: 0 0 34px 3px; + border-bottom: 1px solid #EEE; } .im_edit_panel_wrap_loaded { display: block; @@ -2099,28 +2128,37 @@ a.contacts_modal_contact:hover .contacts_modal_contact_status { /*width: 652px;*/ width: 100%; } -.im_edit_delete_link, -.im_edit_forward_link, +.im_edit_flush_link, .im_edit_cancel_link { display: block; - padding: 8px 17px; + padding: 6px 17px; + border-radius: 2px; + overflow: hidden; + margin: 6px 6px; } .im_edit_cancel_link { float: left; } -.im_edit_delete_link, -.im_edit_forward_link { +.im_edit_flush_link { float: right; } - -.im_edit_delete_link:hover, -.im_edit_forward_link:hover, +.im_edit_flush_link:hover, .im_edit_cancel_link:hover { background: #f2f6fa; text-decoration: none; } -.im_edit_delete_link { - line-height: 0; + +.im_edit_selected_actions { + text-align: center; +} +.im_edit_delete_btn, +.im_edit_forward_btn { + border-radius: 2px; + padding: 5px 17px; + font-weight: normal; + font-size: 12px; + line-height: 18px; + margin: 6px 6px; } .im_edit_panel_title { @@ -2141,11 +2179,6 @@ a.contacts_modal_contact:hover .contacts_modal_contact_status { .is_1x .icon-delete { background-image: url(../img/icons/IconsetW_1x.png?2); } - -.im_message_date:hover { - cursor: pointer; - text-decoration: underline; -} .im_message_selected { background: #f2f6fa; } @@ -2162,39 +2195,44 @@ a.contacts_modal_contact:hover .contacts_modal_contact_status { color: #91a6ba; } -.im_history_selectable .im_message_date:hover { - text-decoration: none; -} - .im_message_wrap { max-width: 526px; padding: 0 15px; margin: 0 auto; position: relative; } +.im_content_message_select_area { + display: none; + cursor: pointer; + position: absolute; + width: 112px; + height: 50px; + margin: -8px 0 0 -112px; +} +@media (min-width: 1024px) { + .im_content_message_select_area { + display: block; + } +} .icon-select-tick { display: none; - position: absolute; - width: 17px; - height: 15px; - margin: 10px 0 0 -75px; - background: url(../img/icons/IconsetW.png?1) -13px -343px no-repeat; + width: 25px; + height: 25px; + margin: 14px 0 0 40px; + background: url(../img/icons/IconsetW.png?1) -9px -516px no-repeat; background-size: 42px 560px; } .is_1x .icon-select-tick { background-image: url(../img/icons/IconsetW_1x.png?2); } - -@media (min-width: 1024px) { - .im_history_selectable .icon-select-tick { - display: inline-block; - } +.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 { - background-position: -13px -367px; + background-position: -9px -481px; opacity: 0.5; } .im_message_selected .icon-select-tick { @@ -2262,6 +2300,21 @@ a.contacts_modal_contact:hover .contacts_modal_contact_status { right: 0; max-width: none; } + + .im_edit_panel_wrap { + margin: 0 5px; + } + .im_edit_flush_link, + .im_edit_cancel_link, + .im_edit_delete_btn, + .im_edit_forward_btn { + padding-left: 5px; + padding-right: 5px; + margin: 6px 4px; + } + .im_edit_panel_wrap { + padding-bottom: 22px; + } } @media (max-height: 480px) { diff --git a/app/js/controllers.js b/app/js/controllers.js index 0943a1bf..e1f43350 100644 --- a/app/js/controllers.js +++ b/app/js/controllers.js @@ -347,6 +347,7 @@ angular.module('myApp.controllers', []) $scope.selectedDelete = selectedDelete; $scope.selectedForward = selectedForward; $scope.selectedCancel = selectedCancel; + $scope.selectedFlush = selectedFlush; $scope.toggleEdit = toggleEdit; $scope.toggleMedia = toggleMedia; $scope.showPeerInfo = showPeerInfo; @@ -478,7 +479,7 @@ angular.module('myApp.controllers', []) } function toggleMessage (messageID, target) { - if (!$scope.selectActions && !$(target).hasClass('im_message_date') && !$(target).hasClass('im_message_meta')) { + if (!$scope.selectActions && !$(target).hasClass('icon-select-tick') && !$(target).hasClass('im_content_message_select_area')) { return false; } if ($scope.selectedMsgs[messageID]) { @@ -505,6 +506,15 @@ angular.module('myApp.controllers', []) $scope.$broadcast('ui_panel_update'); } + function selectedFlush () { + if (confirm('Are you sure? This can not be undone!') !== true) { + return false; + } + AppMessagesManager.flushHistory($scope.curDialog.inputPeer).then(function () { + selectedCancel(); + }); + }; + function selectedDelete () { if ($scope.selectedCount > 0) { var selectedMessageIDs = []; diff --git a/app/js/directives.js b/app/js/directives.js index 80e62f56..b3df94ef 100644 --- a/app/js/directives.js +++ b/app/js/directives.js @@ -112,7 +112,6 @@ angular.module('myApp.directives', ['myApp.filters']) link: link }; - function link (scope, element, attrs) { var searchWrap = $('.contacts_modal_search')[0], panelWrap = $('.contacts_modal_panel')[0], @@ -150,7 +149,7 @@ angular.module('myApp.directives', ['myApp.filters']) scrollableWrap = $('.im_history_scrollable_wrap', element)[0], scrollable = $('.im_history_scrollable', element)[0], panelWrap = $('.im_history_panel_wrap', element)[0], - sendPanelWrap = $('.im_send_panel_wrap', element)[0], + bottomPanelWrap = $('.im_bottom_panel_wrap', element)[0], sendFormWrap = $('.im_send_form_wrap', element)[0], headWrap = $('.tg_page_head')[0], footer = $('.im_page_footer')[0], @@ -246,21 +245,9 @@ angular.module('myApp.directives', ['myApp.filters']) }); scope.$on('ui_panel_update', function () { - var h = $(historyWrap).height(); - $(panelWrap).addClass('im_panel_to_top'); onContentLoaded(function () { - $(panelWrap).removeClass('im_panel_to_top'); - updateSizes(true); - - var newH = $(historyWrap).height(); - - if (atBottom) { - scrollableWrap.scrollTop = scrollableWrap.scrollHeight; - updateScroller(); - } else { - scrollableWrap.scrollTop -= newH - h; - updateScroller(); - } + updateSizes(); + scope.$broadcast('ui_message_send'); }); }); @@ -283,11 +270,13 @@ angular.module('myApp.directives', ['myApp.filters']) }); function updateSizes (heightOnly) { - $(sendFormWrap).css({ - height: $(sendForm).height() - }); + if ($(sendFormWrap).is(':visible')) { + $(sendFormWrap).css({ + height: $(sendForm).height() + }); + } - var historyH = $($window).height() - panelWrap.offsetHeight - sendPanelWrap.offsetHeight - (headWrap ? headWrap.offsetHeight : 44) - footer.offsetHeight; + var historyH = $($window).height() - panelWrap.offsetHeight - bottomPanelWrap.offsetHeight - (headWrap ? headWrap.offsetHeight : 44) - footer.offsetHeight; $(historyWrap).css({ height: historyH }); diff --git a/app/js/services.js b/app/js/services.js index db5a396f..779ddee1 100644 --- a/app/js/services.js +++ b/app/js/services.js @@ -14,7 +14,8 @@ angular.module('myApp.services', []) .service('AppConfigManager', function ($q) { var testPrefix = window._testMode ? 't_' : ''; var cache = {}; - var useLs = !window.chrome || !chrome.storage || !chrome.storage.local; + var useCs = !!(window.chrome && chrome.storage && chrome.storage.local); + var useLs = !useCs && !!window.localStorage; function getValue() { var keys = Array.prototype.slice.call(arguments), @@ -35,6 +36,9 @@ angular.module('myApp.services', []) 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; } @@ -74,6 +78,10 @@ angular.module('myApp.services', []) return $q.when(); } + if (!useCs) { + return $q.when(); + } + var deferred = $q.defer(); chrome.storage.local.set(keyValues, function () { @@ -102,6 +110,10 @@ angular.module('myApp.services', []) return $q.when(); } + if (!useCs) { + return $q.when(); + } + var deferred = $q.defer(); chrome.storage.local.remove(keys, function () { diff --git a/app/js/util.js b/app/js/util.js index 630ad941..a96a3496 100644 --- a/app/js/util.js +++ b/app/js/util.js @@ -5,6 +5,11 @@ * https://github.com/zhukov/webogram/blob/master/LICENSE */ +var _logTimer = (new Date()).getTime(); +function dT () { + return '[' + (((new Date()).getTime() - _logTimer) / 1000).toFixed(3) + ']'; +} + function checkClick (e, noprevent) { if (e.which == 1 && (e.ctrlKey || e.metaKey) || e.which == 2) { return true; diff --git a/app/partials/chat_create_modal.html b/app/partials/chat_create_modal.html index 4dca976b..ffe1fc3c 100644 --- a/app/partials/chat_create_modal.html +++ b/app/partials/chat_create_modal.html @@ -18,7 +18,7 @@
- +
diff --git a/app/partials/chat_edit_modal.html b/app/partials/chat_edit_modal.html index 6a654d52..a664cfb7 100644 --- a/app/partials/chat_edit_modal.html +++ b/app/partials/chat_edit_modal.html @@ -18,7 +18,7 @@
- +
diff --git a/app/partials/chat_modal.html b/app/partials/chat_modal.html index cbba7a6f..564eccd5 100644 --- a/app/partials/chat_modal.html +++ b/app/partials/chat_modal.html @@ -49,10 +49,6 @@ -
- Clear History -
-
Leave group diff --git a/app/partials/contacts_modal.html b/app/partials/contacts_modal.html index 9496dec8..ea11d1fc 100644 --- a/app/partials/contacts_modal.html +++ b/app/partials/contacts_modal.html @@ -50,7 +50,7 @@
- diff --git a/app/partials/im.html b/app/partials/im.html index a8d0ee39..5baa45b5 100644 --- a/app/partials/im.html +++ b/app/partials/im.html @@ -78,18 +78,6 @@
-
- - Forward - Cancel -

- - -

-
- -
@@ -114,52 +102,72 @@
-
+
-
+
+
+ + Clear History + + + Cancel + +
+ + Delete + + Forward + +
+
-
-
- - -
-
- -
-
-
Drop photos here to send
- +
-
- - -
+
-
- - +
+
+ +
+
+ +
+ +
Drop photos here to send
+ +
+ + +
+ +
+ + +
-
- -
- - +
+ +
+ + + +
+
-
diff --git a/app/partials/login.html b/app/partials/login.html index ff067dc3..5cd289d5 100644 --- a/app/partials/login.html +++ b/app/partials/login.html @@ -11,7 +11,7 @@
- @@ -31,7 +31,7 @@
- diff --git a/app/partials/message.html b/app/partials/message.html index b53a1ec1..e043d2a1 100644 --- a/app/partials/message.html +++ b/app/partials/message.html @@ -58,7 +58,9 @@
- +
+ +
diff --git a/app/partials/user_modal.html b/app/partials/user_modal.html index 18691f61..ca2bac87 100644 --- a/app/partials/user_modal.html +++ b/app/partials/user_modal.html @@ -31,10 +31,6 @@ {{settings.notifications ? 'ON' : 'OFF'}}
- -
- Clear Chat History -
diff --git a/app/partials/welcome.html b/app/partials/welcome.html index d021677c..c4c721ba 100644 --- a/app/partials/welcome.html +++ b/app/partials/welcome.html @@ -11,7 +11,7 @@

It is an alpha, which means it is still not 200% secure and functional.

Visit telegram.org to learn more.

- Start Messaging + Start Messaging \ No newline at end of file diff --git a/webogram.sublime-project b/webogram.sublime-project new file mode 100644 index 00000000..70348574 --- /dev/null +++ b/webogram.sublime-project @@ -0,0 +1,11 @@ +{ + "folders": + [ + { + "follow_symlinks": true, + "path": ".", + "folder_exclude_patterns": ["*dist"], + "file_exclude_patterns": ["*.zip"] + } + ] +}