diff --git a/app/css/app.css b/app/css/app.css index 4ea8e00b..e32f5e72 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; @@ -65,14 +63,23 @@ input[type="number"]::-webkit-inner-spin-button { input[type="number"] { -moz-appearance:textfield; } - -.btn-primary:focus { +.btn { + border: 0; + padding: 7px 13px; +} +.btn:hover, +.btn:active, +.btn.active, +.btn:focus, +.btn:active:focus, +.btn.active:focus, +.open .dropdown-toggle.btn { + box-shadow: none; outline: none; } .btn-success { color: #ffffff; background-color: #6AC065; - border-color: #6AC065; } .btn-success:hover, @@ -82,7 +89,6 @@ input[type="number"] { .open .dropdown-toggle.btn-success { color: #ffffff; background-color: #61b75b; - border-color: #61b75b; } .btn-success:active, @@ -96,7 +102,6 @@ input[type="number"] { .btn-danger { color: #ffffff; background-color: #c05f5a; - border-color: #c05f5a; } .btn-danger:hover, .btn-danger:focus, @@ -105,7 +110,6 @@ input[type="number"] { .open .dropdown-toggle.btn-danger { color: #ffffff; background-color: #ab5450; - border-color: #ab5450; } .btn-danger:active, .btn-danger.active, @@ -118,7 +122,6 @@ input[type="number"] { .btn-primary { color: #ffffff; background-color: #5d8db3; - border-color: #5d8db3; border-radius: 3px; } .btn-primary:hover, @@ -128,7 +131,6 @@ input[type="number"] { .open .dropdown-toggle.btn-primary { color: #ffffff; background-color: #4a80a9; - border-color: #4a80a9; } .btn-primary:active, .btn-primary.active, @@ -139,7 +141,6 @@ input[type="number"] { .btn-primary[disabled], .btn-primary.disabled { background: #7999b3; - border-color: #7999b3; } .btn-link { color: #3a6d99; @@ -156,7 +157,6 @@ input[type="number"] { } .btn-link.dropdown-toggle:active { outline: none; - box-shadow: none; } .tg_page_head .navbar-quick-nav, @@ -184,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 { @@ -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; } @@ -319,9 +313,6 @@ input[type="number"] { overflow-y: auto; padding: 10px; } -.mobile_modal { - padding: 0; -} .modal-dialog { margin: 0 auto; } @@ -543,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; } @@ -588,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; @@ -599,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; @@ -614,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 { @@ -623,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 { @@ -794,6 +827,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; } @@ -803,48 +839,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 */ @@ -865,34 +860,8 @@ 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); - 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; @@ -993,11 +962,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 { @@ -1136,108 +1101,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; - 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; @@ -1254,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; @@ -1282,10 +1130,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; @@ -1293,38 +1137,27 @@ 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; } - .im_history_to_bottom .im_history_scrollable { position: absolute; bottom: 0; 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; @@ -1431,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 { @@ -1565,8 +1397,6 @@ div.im_message_video_thumb { margin-top: 3px; border-radius: 3px; display: inline-block; - /*line-height: 0;*/ - width: 340px; } .icon-document, @@ -1624,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; @@ -1789,39 +1613,6 @@ 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; @@ -1830,50 +1621,11 @@ 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; overflow: hidden; } -.im_message_fwd_title { - display: none; -} .im_message_fwd_from { margin-top: 5px; } @@ -1884,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; @@ -1960,7 +1708,6 @@ span.emoji { } .im_send_panel_wrap { - max-width: 526px; margin: 0 auto; padding: 10px 15px 22px 15px; } @@ -1968,18 +1715,9 @@ span.emoji { position: relative; } .im_send_form { - max-width: 389px; margin: 0 auto; position: absolute; bottom: 0; - left: 62px; - right: 62px; -} -.im_submit { - padding: 5px 12px; - font-size: 13px; - line-height: 17px; - min-width: 60px; } .im_send_dropbox_wrap { @@ -2062,15 +1800,10 @@ textarea.im_message_field { background-position: -10px -36px; opacity: 1; } - -.im_head_attach { - display: none; -} .im_attach_input, .im_media_attach_input { cursor: pointer; font-size: 72px !important; - /*visibility: hidden;*/ opacity: 0.01; position: absolute; z-index: 100; @@ -2116,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; @@ -2185,209 +1891,27 @@ 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; +/* Emoji area */ +.emoji-wysiwyg-editor:empty:before { + content: attr(placeholder); + color: #9aa2ab; } -.user_modal_status { - color: #999; - margin-bottom: 16px; +.emoji-wysiwyg-editor:active:before, +.emoji-wysiwyg-editor:focus:before { + content: none; } -.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; +.emoji-wysiwyg-editor { 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 */ -.emoji-wysiwyg-editor:empty:before { - content: attr(placeholder); - color: #9aa2ab; -} -.emoji-wysiwyg-editor:active:before, -.emoji-wysiwyg-editor:focus:before { - content: none; -} - -.emoji-wysiwyg-editor { - font-size: 12px; - margin-bottom: 10px; - padding: 6px; - min-height: 50px; - height: auto; - max-height: 300px; - overflow: auto; - line-height: 17px; + margin-bottom: 10px; + padding: 6px; + min-height: 50px; + height: auto; + max-height: 300px; + overflow: auto; + line-height: 17px; border: 1px solid #d9dbde; border-radius: 2px; @@ -2503,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 { @@ -2515,28 +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); -} - - -.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; @@ -2621,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; } @@ -2805,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; @@ -2839,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; @@ -2897,11 +2203,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 { @@ -2961,6 +2263,44 @@ a.contacts_modal_contact:hover .contacts_modal_contact_status, color: #91a6ba; } +.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; +} + .icon-contact-tick { position: absolute; right: 10px; @@ -2978,9 +2318,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; @@ -3016,28 +2353,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; @@ -3059,76 +2376,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; @@ -3140,28 +2395,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 @@ -3199,58 +2432,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; @@ -3271,15 +2452,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; @@ -3325,16 +2500,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; @@ -3371,33 +2541,9 @@ ce671b orange .countries_modal_search_clear:hover { opacity: 1; } - .countries_modal_wrap .modal-body { 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; overflow: hidden; @@ -3507,10 +2653,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 new file mode 100644 index 00000000..434a5f5d --- /dev/null +++ b/app/css/desktop.css @@ -0,0 +1,834 @@ +/** 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; +} + +.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 { + 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_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 : 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; + 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; + -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; +} +.contacts_modal_col { + margin-right: -17px; +} +.contacts_scrollable_wrap { + padding: 0 17px 0 0; +} + +.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; + 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; + 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_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; + line-height: 17px; + 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) { + + /* 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; + } +} + + +.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; +} + +.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/app_mobile.css b/app/css/mobile.css similarity index 89% rename from app/css/app_mobile.css rename to app/css/mobile.css index 855f6739..40be67e9 100644 --- a/app/css/app_mobile.css +++ b/app/css/mobile.css @@ -1,5 +1,3 @@ -@media (max-width: 479px) { - html { background: #FFF; } @@ -19,6 +17,7 @@ html { .tg_page_head .navbar > .container .navbar-brand { padding-left: 9px; + outline: none; } .im_history_panel_edit_link { margin-right: 0; @@ -40,7 +39,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); @@ -160,8 +159,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 { @@ -233,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; @@ -283,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; @@ -291,6 +295,29 @@ html { -webkit-box-shadow: none; margin: 30px auto 20px; } +.login_form_wrap .btn-primary { + padding: 12px 13px; +} +.login_phone_country, +.login_phone_number { + height: 42px; +} + +.im_dialogs_empty_header { + font-size: 19px; + margin-bottom: 10px; +} +.im_dialogs_empty_lead { + font-size: 14px; + line-height: 160%; +} +.im_dialogs_add_contact, +.im_dialogs_import_phonebook { + padding: 12px 13px; +} +.im_dialogs_add_contact + .im_dialogs_import_phonebook { + margin-top: 10px; +} .im_page_wrap { background: none; @@ -298,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; @@ -425,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; @@ -486,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; @@ -508,12 +519,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.im_history_to_bottom { + overflow: hidden; + position: relative; } .im_history { position: static; } + +.icon-select-tick { + margin: 10px 0 0 -24px +} .im_message_wrap { padding: 0 8px; } @@ -578,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; @@ -701,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; @@ -734,27 +742,10 @@ 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; } -.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 { @@ -776,18 +767,6 @@ a.im_message_from_photo { .im_page_peer_not_selected .im_dialogs_col_wrap { 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_panel { display: none; @@ -797,20 +776,13 @@ 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; } -.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; @@ -863,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; @@ -902,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, @@ -916,32 +884,32 @@ 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; } - -.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; } @@ -1092,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; @@ -1124,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; @@ -1194,65 +1158,27 @@ a.mobile_modal_action .tg_checkbox_label { .emoji-menu { margin-left: -20px; - margin-top: -267px; + margin-top: -202px; width: 262px; } +.emoji-menu .emoji-items-wrap { + height: 106px; +} .emoji-menu .emoji-items a { 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; @@ -1279,14 +1205,10 @@ 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; } .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 c87e26af..391f44f3 100644 --- a/app/index.html +++ b/app/index.html @@ -1,5 +1,5 @@ - + @@ -8,9 +8,7 @@ - - @@ -77,6 +75,7 @@ PRODUCTION_ONLY_END--> + 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 40a0a527..70d40b66 100644 --- a/app/js/controllers.js +++ b/app/js/controllers.js @@ -43,18 +43,10 @@ angular.module('myApp.controllers', ['myApp.i18n']) $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'; - className += ' mobile_modal'; - } - var modal = $modal.open({ - templateUrl: tUrl, + templateUrl: templateUrl('country_select_modal'), controller: 'CountrySelectModalController', - windowClass: className + windowClass: 'countries_modal_window mobile_modal' }); modal.result.then(selectCountry); @@ -335,18 +327,10 @@ angular.module('myApp.controllers', ['myApp.i18n']) $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'; - className += ' mobile_modal'; - } - $modal.open({ - templateUrl: tUrl, + templateUrl: templateUrl('settings_modal'), controller: 'SettingsModalController', - windowClass: className + windowClass: 'settings_modal_window mobile_modal' }); } @@ -366,10 +350,10 @@ angular.module('myApp.controllers', ['myApp.i18n']) 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' + windowClass: 'group_edit_modal_window mobile_modal' }); } @@ -379,7 +363,9 @@ angular.module('myApp.controllers', ['myApp.i18n']) $scope.importContact = function () { AppUsersManager.openImportContact().then(function (foundContact) { if (foundContact) { - $scope.$broadcast('contact_imported'); + $rootScope.$broadcast('history_focus', { + peerString: AppUsersManager.getUserString(foundContact) + }); } }); }; @@ -502,6 +488,14 @@ angular.module('myApp.controllers', ['myApp.i18n']) offset++; } $scope.dialogs.unshift(wrappedDialog); + + if (!peersInDialogs[dialog.peerID]) { + peersInDialogs[dialog.peerID] = true; + if (contactsShown) { + showMoreContacts(); + } + } + }); $scope.$on('dialog_flush', function (e, dialog) { @@ -524,12 +518,6 @@ angular.module('myApp.controllers', ['myApp.i18n']) } }); - $scope.$on('contact_imported', function () { - if (contactsShown) { - loadDialogs(); - } - }) - var prevMessages = false; $scope.$watchCollection('search', function () { if ($scope.search.messages != prevMessages) { @@ -554,20 +542,22 @@ angular.module('myApp.controllers', ['myApp.i18n']) } }); - if (Config.Navigator.mobile) { + if (Config.Mobile) { $scope.$watch('curDialog.peer', function () { $scope.$broadcast('ui_dialogs_update') }); } $scope.importPhonebook = function () { - PhonebookContactsService.openPhonebookImport().result.then(function (foundContacts) { - if (contactsShown && foundContacts.length) { - loadDialogs(); - } - }) + PhonebookContactsService.openPhonebookImport(); }; + $scope.$on('contacts_update', function () { + if (contactsShown) { + showMoreContacts(); + } + }); + $scope.searchClear = function () { $scope.search.query = ''; $scope.search.messages = false; @@ -636,14 +626,6 @@ angular.module('myApp.controllers', ['myApp.i18n']) }); }; - $scope.importPhonebook = function () { - PhonebookContactsService.openPhonebookImport().result.then(function (foundContacts) { - if (contactsShown && foundContacts.length) { - loadDialogs(); - } - }) - }; - function loadDialogs (force) { offset = 0; maxID = 0; @@ -675,6 +657,7 @@ angular.module('myApp.controllers', ['myApp.i18n']) AppMessagesManager.getDialogs('', maxID, 100); if (!dialogsResult.dialogs.length) { $scope.isEmpty.dialogs = true; + showMoreDialogs(); } } else { showMoreDialogs(); @@ -683,36 +666,40 @@ angular.module('myApp.controllers', ['myApp.i18n']) }); } + function showMoreContacts () { + contactsShown = true; + + var curJump = ++jump; + AppUsersManager.getContacts($scope.search.query).then(function (contactsList) { + if (curJump != jump) return; + $scope.contacts = []; + angular.forEach(contactsList, function(userID) { + if (peersInDialogs[userID] === undefined) { + $scope.contacts.push({ + userID: userID, + user: AppUsersManager.getUser(userID), + userPhoto: AppUsersManager.getUserPhoto(userID, 'User'), + peerString: AppUsersManager.getUserString(userID) + }); + } + }); + + if (contactsList.length) { + delete $scope.isEmpty.contacts; + } else if (!$scope.search.query) { + $scope.isEmpty.contacts = true; + } + }); + $scope.$broadcast('ui_dialogs_append'); + } + function showMoreDialogs () { if (contactsShown && (!hasMore || !offset)) { return; } if (!hasMore && !$scope.search.messages && ($scope.search.query || !$scope.dialogs.length)) { - contactsShown = true; - - var curJump = ++jump; - AppUsersManager.getContacts($scope.search.query).then(function (contactsList) { - if (curJump != jump) return; - $scope.contacts = []; - angular.forEach(contactsList, function(userID) { - if (peersInDialogs[userID] === undefined) { - $scope.contacts.push({ - userID: userID, - user: AppUsersManager.getUser(userID), - userPhoto: AppUsersManager.getUserPhoto(userID, 'User'), - peerString: AppUsersManager.getUserString(userID) - }); - } - }); - - if (contactsList.length) { - delete $scope.isEmpty.contacts; - } else if (!$scope.search.query) { - $scope.isEmpty.contacts = true; - } - }); - $scope.$broadcast('ui_dialogs_append'); + showMoreContacts(); return; } @@ -970,7 +957,7 @@ angular.module('myApp.controllers', ['myApp.i18n']) 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); @@ -1021,9 +1008,6 @@ angular.module('myApp.controllers', ['myApp.i18n']) else if (forceRecent) { limit = 10; } - else if (Config.Navigator.mobile) { - limit = 20; - } moreActive = false; morePending = false; @@ -1067,6 +1051,9 @@ angular.module('myApp.controllers', ['myApp.i18n']) if ($scope.skippedHistory) { delete message.unread; } + if (historyResult.unreadOffset) { + message.unreadAfter = true; + } peerHistory.messages.push(message); }); peerHistory.messages.reverse(); @@ -1477,7 +1464,7 @@ angular.module('myApp.controllers', ['myApp.i18n']) AppPhotosManager.downloadPhoto($scope.photoID); }; - if (!$scope.messageID || Config.Navigator.mobile) { + if (!$scope.messageID || Config.Mobile) { $scope.nav.next = function () { $modalInstance.close(); } @@ -1499,7 +1486,7 @@ angular.module('myApp.controllers', ['myApp.i18n']) }; - if (Config.Navigator.mobile) { + if (Config.Mobile) { $scope.canForward = true; $scope.canDelete = true; return; @@ -1822,9 +1809,9 @@ angular.module('myApp.controllers', ['myApp.i18n']) }; $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', + windowClass: 'import_contact_modal_window mobile_modal', scope: scope }).result.then(function (foundUserID) { if ($scope.userID == foundUserID) { @@ -2015,10 +2002,10 @@ angular.module('myApp.controllers', ['myApp.i18n']) 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' + windowClass: 'group_edit_modal_window mobile_modal' }); } @@ -2109,9 +2096,9 @@ angular.module('myApp.controllers', ['myApp.i18n']) $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' + windowClass: 'profile_edit_modal_window mobile_modal' }); }; @@ -2298,6 +2285,9 @@ angular.module('myApp.controllers', ['myApp.i18n']) }; $scope.$watch('search.query', updateContacts); + $scope.$on('contacts_update', function () { + updateContacts($scope.search && $scope.search.query || ''); + }); $scope.toggleEdit = function (enabled) { $scope.action = enabled ? 'edit' : ''; @@ -2338,16 +2328,13 @@ angular.module('myApp.controllers', ['myApp.i18n']) selectedUserIDs.push(userID); }); AppUsersManager.deleteContacts(selectedUserIDs).then(function () { - resetSelected(); - updateContacts($scope.search.query); + $scope.toggleEdit(false); }); } }; $scope.importContact = function () { - AppUsersManager.openImportContact().then(function () { - updateContacts($scope.search && $scope.search.query || ''); - }); + AppUsersManager.openImportContact(); }; }) diff --git a/app/js/directives.js b/app/js/directives.js index d3b6967e..7fb4ef06 100644 --- a/app/js/directives.js +++ b/app/js/directives.js @@ -15,14 +15,14 @@ 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') }; }) @@ -38,8 +38,8 @@ angular.module('myApp.directives', ['myApp.filters']) pendingClass = 'im_message_pending'; return { - link: link, - templateUrl: 'partials/message.html' + templateUrl: templateUrl('message'), + link: link }; function link($scope, element, attrs) { @@ -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) { @@ -158,42 +162,42 @@ angular.module('myApp.directives', ['myApp.filters']) .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') }; }) @@ -365,7 +369,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], @@ -435,7 +439,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; @@ -491,7 +495,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(); } @@ -525,7 +529,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(); } @@ -828,7 +832,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}); @@ -892,7 +896,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 = ''; @@ -1203,7 +1207,7 @@ angular.module('myApp.directives', ['myApp.filters']) return { link: link, transclude: true, - templateUrl: 'partials/full_photo.html', + templateUrl: templateUrl('full_photo'), scope: { fullPhoto: '=', thumbLocation: '=' @@ -1286,7 +1290,7 @@ angular.module('myApp.directives', ['myApp.filters']) return { link: link, transclude: true, - templateUrl: 'partials/full_video.html', + templateUrl: templateUrl('full_video'), scope: { video: '=' } @@ -1353,7 +1357,7 @@ angular.module('myApp.directives', ['myApp.filters']) return { link: link, - templateUrl: 'partials/full_gif.html', + templateUrl: templateUrl('full_gif'), scope: { document: '=' } @@ -1550,7 +1554,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)}); }); }; @@ -1653,8 +1657,8 @@ angular.module('myApp.directives', ['myApp.filters']) function link($scope, element, attrs) { var updateMargin = function () { - if (Config.Navigator.mobile && - $(element[0].parentNode.parentNode.parentNode).hasClass('page_modal')) { + if (Config.Mobile && + $(element[0].parentNode.parentNode.parentNode).hasClass('mobile_modal')) { return; } var height = element[0].parentNode.offsetHeight, diff --git a/app/js/directives_mobile.js b/app/js/directives_mobile.js new file mode 100644 index 00000000..5e3374a7 --- /dev/null +++ b/app/js/directives_mobile.js @@ -0,0 +1,433 @@ +/*! + * 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 : 46) - + (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], + scrollableWrap = $('.im_history_scrollable_wrap', element)[0], + scrollable = $('.im_history_scrollable', 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; + }); + + $scope.$on('ui_history_append_new', function (e, options) { + if (!atBottom && !options.my) { + return; + } + + var pr = parseInt($(scrollableWrap).css('paddingRight')) + $(scrollableWrap).addClass('im_history_to_bottom'); + $(scrollable).css({bottom: 0, marginLeft: -Math.ceil(pr / 2)}); + + onContentLoaded(function () { + $(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]) { + 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, marginLeft: -Math.ceil(pr / 2)}); + onContentLoaded(function () { + $(scrollableWrap).removeClass('im_history_to_bottom'); + $(scrollable).css({bottom: '', marginLeft: ''}); + 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; + atBottom = true; + } + }); + + $scope.$on('ui_history_prepend', function () { + var sh = scrollableWrap.scrollHeight, + st = scrollableWrap.scrollTop, + 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'); + + + var upd = function () { + $(scrollableWrap).removeClass('im_history_to_bottom'); + $(scrollable).css({marginBottom: '', marginLeft: ''}); + if (scrollTopInitial >= 0) { + changeScroll(); + } else { + 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; + + if (scrollTopInitial >= 0) { + changeScroll(); + } + + $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); + }); + + var atBottom = true, + scrollTopInitial = -1; + $(scrollableWrap).on('scroll', function (e) { + if (!element.is(':visible') || + $(scrollableWrap).hasClass('im_history_to_bottom')) { + return; + } + var st = scrollableWrap.scrollTop; + atBottom = st >= scrollableWrap.scrollHeight - scrollableWrap.clientHeight; + if (scrollTopInitial >= 0 && scrollTopInitial != st) { + scrollTopInitial = -1; + } + + if (!moreNotified && st <= 300) { + moreNotified = true; + $scope.$emit('history_need_more'); + } + else if (!lessNotified && st >= 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() - bottomPanelWrap.offsetHeight - (headWrap ? headWrap.offsetHeight : 46); + $(historyWrap).css({ + height: historyH + }); + + updateBottomizer(); + + + if (heightOnly === true) return; + if (atBottom) { + onContentLoaded(function () { + scrollableWrap.scrollTop = scrollableWrap.scrollHeight; + }); + } + } + + function updateBottomizer () { + return; + $(historyMessagesEl).css({marginTop: 0}); + var marginTop = scrollableWrap.offsetHeight + - historyMessagesEl.offsetHeight + - 20; + + if (historyMessagesEl.offsetHeight > 0 && marginTop > 0) { + $(historyMessagesEl).css({marginTop: marginTop}); + } + } + + $($window).on('resize', updateSizes); + + updateSizes(); + 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/js/filters.js b/app/js/filters.js index 0f49559e..deb26185 100644 --- a/app/js/filters.js +++ b/app/js/filters.js @@ -81,7 +81,7 @@ angular.module('myApp.filters', ['myApp.i18n']) .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.hasOwnProperty(_.locale())) { diff --git a/app/js/init.js b/app/js/init.js index 0aea81b7..c179712f 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.Navigator.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 a912b887..5c05289b 100644 --- a/app/js/lib/config.js +++ b/app/js/lib/config.js @@ -62,3 +62,136 @@ Config.EmojiCategorySpritesheetDimens = [[7, 27], [4, 29], [7, 33], [3, 34], [6, Config.CountryCodes = [["AB","country_select_modal_country_ab","+7 840","+7 940","+995 44"],["AF","country_select_modal_country_af","+93"],["AX","country_select_modal_country_ax","+358 18"],["AL","country_select_modal_country_al","+355"],["DZ","country_select_modal_country_dz","+213"],["AS","country_select_modal_country_as","+1 684"],["AD","country_select_modal_country_ad","+376"],["AO","country_select_modal_country_ao","+244"],["AI","country_select_modal_country_ai","+1 264"],["AG","country_select_modal_country_ag","+1 268"],["AR","country_select_modal_country_ar","+54"],["AM","country_select_modal_country_am","+374"],["AW","country_select_modal_country_aw","+297"],["SH","country_select_modal_country_sh_ac","+247"],["AU","country_select_modal_country_au","+61"],["AU","country_select_modal_country_au_et","+672"],["AT","country_select_modal_country_at","+43"],["AZ","country_select_modal_country_az","+994"],["BS","country_select_modal_country_bs","+1 242"],["BH","country_select_modal_country_bh","+973"],["BD","country_select_modal_country_bd","+880"],["BB","country_select_modal_country_bb","+1 246"],["AG","country_select_modal_country_ag_bar","+1 268"],["BY","country_select_modal_country_by","+375"],["BE","country_select_modal_country_be","+32"],["BZ","country_select_modal_country_bz","+501"],["BJ","country_select_modal_country_bj","+229"],["BM","country_select_modal_country_bm","+1 441"],["BT","country_select_modal_country_bt","+975"],["BO","country_select_modal_country_bo","+591"],["BQ","country_select_modal_country_bq","+599 7"],["BA","country_select_modal_country_ba","+387"],["BW","country_select_modal_country_bw","+267"],["BR","country_select_modal_country_br","+55"],["IO","country_select_modal_country_io","+246"],["VG","country_select_modal_country_vg","+1 284"],["BN","country_select_modal_country_bn","+673"],["BG","country_select_modal_country_bg","+359"],["BF","country_select_modal_country_bf","+226"],["MY","country_select_modal_country_mm","+95"],["BI","country_select_modal_country_bi","+257"],["KH","country_select_modal_country_kh","+855"],["CM","country_select_modal_country_cm","+237"],["CA","country_select_modal_country_ca","+1"],["CV","country_select_modal_country_cv","+238"],["KY","country_select_modal_country_ky","+1 345"],["CF","country_select_modal_country_cf","+236"],["TD","country_select_modal_country_td","+235"],["CL","country_select_modal_country_cl","+56"],["CN","country_select_modal_country_cn","+86"],["CX","country_select_modal_country_cx","+61"],["CC","country_select_modal_country_cc","+61"],["CO","country_select_modal_country_co","+57"],["KM","country_select_modal_country_km","+269"],["CG","country_select_modal_country_cg","+242"],["CD","country_select_modal_country_cd","+243"],["CK","country_select_modal_country_ck","+682"],["CR","country_select_modal_country_cr","+506"],["CI","country_select_modal_country_ci","+225"],["HR","country_select_modal_country_hr","+385"],["CU","country_select_modal_country_cu","+53"],["CW","country_select_modal_country_cw","+599 9"],["CY","country_select_modal_country_cy","+357"],["CZ","country_select_modal_country_cz","+420"],["DK","country_select_modal_country_dk","+45"],["DG","country_select_modal_country_dg","+246"],["DJ","country_select_modal_country_dj","+253"],["DM","country_select_modal_country_dm","+1 767"],["DO","country_select_modal_country_do","+1 809","+1 829","+1 849"],["TL","country_select_modal_country_tl","+670"],["EC","country_select_modal_country_ec","+593"],["EG","country_select_modal_country_eg","+20"],["SV","country_select_modal_country_sv","+503"],["GQ","country_select_modal_country_gq","+240"],["ER","country_select_modal_country_er","+291"],["EE","country_select_modal_country_ee","+372"],["ET","country_select_modal_country_et","+251"],["FK","country_select_modal_country_fk","+500"],["FO","country_select_modal_country_fo","+298"],["FJ","country_select_modal_country_fj","+679"],["FI","country_select_modal_country_fi","+358"],["FR","country_select_modal_country_fr","+33"],["GF","country_select_modal_country_gf","+594"],["PF","country_select_modal_country_pf","+689"],["GA","country_select_modal_country_ga","+241"],["GM","country_select_modal_country_gm","+220"],["GE","country_select_modal_country_ge","+995"],["DE","country_select_modal_country_de","+49"],["GH","country_select_modal_country_gh","+233"],["GI","country_select_modal_country_gi","+350"],["GR","country_select_modal_country_gr","+30"],["GL","country_select_modal_country_gl","+299"],["GD","country_select_modal_country_gd","+1 473"],["GP","country_select_modal_country_gp","+590"],["GU","country_select_modal_country_gu","+1 671"],["GT","country_select_modal_country_gt","+502"],["GG","country_select_modal_country_gg","+44"],["GN","country_select_modal_country_gn","+224"],["GW","country_select_modal_country_gw","+245"],["GY","country_select_modal_country_gy","+592"],["HT","country_select_modal_country_ht","+509"],["HN","country_select_modal_country_hn","+504"],["HK","country_select_modal_country_hk","+852"],["HU","country_select_modal_country_hu","+36"],["IS","country_select_modal_country_is","+354"],["IN","country_select_modal_country_in","+91"],["ID","country_select_modal_country_id","+62"],["IR","country_select_modal_country_ir","+98"],["IQ","country_select_modal_country_iq","+964"],["IE","country_select_modal_country_ie","+353"],["IL","country_select_modal_country_il","+972"],["IT","country_select_modal_country_it","+39"],["JM","country_select_modal_country_jm","+1 876"],["SJ","country_select_modal_country_sj","+47 79"],["JP","country_select_modal_country_jp","+81"],["JE","country_select_modal_country_je","+44"],["JO","country_select_modal_country_jo","+962"],["KZ","country_select_modal_country_kz","+7 6","+7 7"],["KE","country_select_modal_country_ke","+254"],["KI","country_select_modal_country_ki","+686"],["KP","country_select_modal_country_kp","+850"],["KR","country_select_modal_country_kr","+82"],["KW","country_select_modal_country_kw","+965"],["KG","country_select_modal_country_kg","+996"],["LA","country_select_modal_country_la","+856"],["LV","country_select_modal_country_lv","+371"],["LB","country_select_modal_country_lb","+961"],["LS","country_select_modal_country_ls","+266"],["LR","country_select_modal_country_lr","+231"],["LY","country_select_modal_country_ly","+218"],["LI","country_select_modal_country_li","+423"],["LT","country_select_modal_country_lt","+370"],["LU","country_select_modal_country_lu","+352"],["MO","country_select_modal_country_mo","+853"],["MK","country_select_modal_country_mk","+389"],["MG","country_select_modal_country_mg","+261"],["MW","country_select_modal_country_mw","+265"],["MY","country_select_modal_country_my","+60"],["MV","country_select_modal_country_mv","+960"],["ML","country_select_modal_country_ml","+223"],["MT","country_select_modal_country_mt","+356"],["MH","country_select_modal_country_mh","+692"],["MQ","country_select_modal_country_mq","+596"],["MR","country_select_modal_country_mr","+222"],["MU","country_select_modal_country_mu","+230"],["YT","country_select_modal_country_yt","+262"],["MX","country_select_modal_country_mx","+52"],["FM","country_select_modal_country_fm","+691"],["MD","country_select_modal_country_md","+373"],["MC","country_select_modal_country_mc","+377"],["MN","country_select_modal_country_mn","+976"],["ME","country_select_modal_country_me","+382"],["MS","country_select_modal_country_ms","+1 664"],["MA","country_select_modal_country_ma","+212"],["MZ","country_select_modal_country_mz","+258"],["NA","country_select_modal_country_na","+264"],["NR","country_select_modal_country_nr","+674"],["NP","country_select_modal_country_np","+977"],["NL","country_select_modal_country_nl","+31"],["NC","country_select_modal_country_nc","+687"],["NZ","country_select_modal_country_nz","+64"],["NI","country_select_modal_country_ni","+505"],["NE","country_select_modal_country_ne","+227"],["NG","country_select_modal_country_ng","+234"],["NU","country_select_modal_country_nu","+683"],["NF","country_select_modal_country_nf","+672"],["MP","country_select_modal_country_mp","+1 670"],["NO","country_select_modal_country_no","+47"],["OM","country_select_modal_country_om","+968"],["PK","country_select_modal_country_pk","+92"],["PW","country_select_modal_country_pw","+680"],["PS","country_select_modal_country_ps","+970"],["PA","country_select_modal_country_pa","+507"],["PG","country_select_modal_country_pg","+675"],["PY","country_select_modal_country_py","+595"],["PE","country_select_modal_country_pe","+51"],["PH","country_select_modal_country_ph","+63"],["PN","country_select_modal_country_pn","+64"],["PL","country_select_modal_country_pl","+48"],["PT","country_select_modal_country_pt","+351"],["PR","country_select_modal_country_pr","+1 787","+1 939"],["QA","country_select_modal_country_qa","+974"],["RE","country_select_modal_country_re","+262"],["RO","country_select_modal_country_ro","+40"],["RU","country_select_modal_country_ru","+7"],["RW","country_select_modal_country_rw","+250"],["BL","country_select_modal_country_bl","+590"],["SH","country_select_modal_country_sh","+290"],["KN","country_select_modal_country_kn","+1 869"],["LC","country_select_modal_country_lc","+1 758"],["MF","country_select_modal_country_mf","+590"],["PM","country_select_modal_country_pm","+508"],["VC","country_select_modal_country_vc","+1 784"],["WS","country_select_modal_country_ws","+685"],["SM","country_select_modal_country_sm","+378"],["ST","country_select_modal_country_st","+239"],["SA","country_select_modal_country_sa","+966"],["SN","country_select_modal_country_sn","+221"],["RS","country_select_modal_country_rs","+381"],["SC","country_select_modal_country_sc","+248"],["SL","country_select_modal_country_sl","+232"],["SG","country_select_modal_country_sg","+65"],["BQ","country_select_modal_country_nl_bq3","+599 3"],["SX","country_select_modal_country_sx","+1 721"],["SK","country_select_modal_country_sk","+421"],["SI","country_select_modal_country_si","+386"],["SB","country_select_modal_country_sb","+677"],["SO","country_select_modal_country_so","+252"],["ZA","country_select_modal_country_za","+27"],["GS","country_select_modal_country_gs","+500"],[false,"country_select_modal_country_ge_so","+995 34"],["SS","country_select_modal_country_ss","+211"],["ES","country_select_modal_country_es","+34"],["LK","country_select_modal_country_lk","+94"],["SD","country_select_modal_country_sd","+249"],["SR","country_select_modal_country_sr","+597"],["SJ","country_select_modal_country_sj_no","+47 79"],["SZ","country_select_modal_country_sz","+268"],["SE","country_select_modal_country_se","+46"],["CH","country_select_modal_country_ch","+41"],["SY","country_select_modal_country_sy","+963"],["TW","country_select_modal_country_tw","+886"],["TJ","country_select_modal_country_tj","+992"],["TZ","country_select_modal_country_tz","+255"],["TH","country_select_modal_country_th","+66"],["TG","country_select_modal_country_tg","+228"],["TK","country_select_modal_country_tk","+690"],["TO","country_select_modal_country_to","+676"],["TT","country_select_modal_country_tt","+1 868"],["TN","country_select_modal_country_tn","+216"],["TR","country_select_modal_country_tr","+90"],["TM","country_select_modal_country_tm","+993"],["TC","country_select_modal_country_tc","+1 649"],["TV","country_select_modal_country_tv","+688"],["UG","country_select_modal_country_ug","+256"],["UA","country_select_modal_country_ua","+380"],["AE","country_select_modal_country_ae","+971"],["UK","country_select_modal_country_uk","+44"],["US","country_select_modal_country_us","+1"],["UY","country_select_modal_country_uy","+598"],["VI","country_select_modal_country_vi","+1 340"],["UZ","country_select_modal_country_uz","+998"],["VU","country_select_modal_country_vu","+678"],["VE","country_select_modal_country_ve","+58"],["VA","country_select_modal_country_va","+39 06 698","+379"],["VN","country_select_modal_country_vn","+84"],["WF","country_select_modal_country_wf","+681"],["YE","country_select_modal_country_ye","+967"],["ZM","country_select_modal_country_zm","+260"],[false,"country_select_modal_country_tz_uk","+255"],["ZW","country_select_modal_country_zw","+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); + try { + value = (value === undefined || value === null) ? false : JSON.parse(value); + } catch (e) { + value = false; + } + 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..837593b0 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.Mobile ? 'mobile' : 'desktop') + '/' + tplName + '.html'; +} + diff --git a/app/js/services.js b/app/js/services.js index beaa2e77..62e253bb 100644 --- a/app/js/services.js +++ b/app/js/services.js @@ -188,19 +188,11 @@ angular.module('myApp.services', ['myApp.i18n']) 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'; - className += ' mobile_modal'; - } - var modalInstance = $modal.open({ - templateUrl: tUrl, + templateUrl: templateUrl('user_modal'), controller: 'UserModalController', scope: scope, - windowClass: className + windowClass: 'user_modal_window mobile_modal' }); }; $rootScope.openUser = openUser; @@ -223,7 +215,7 @@ angular.module('myApp.services', ['myApp.i18n']) onContactUpdated(foundUserID = importedContact.user_id, true); }); - return foundUserID ? 1 : 0; + return foundUserID || false; }); }; @@ -275,7 +267,7 @@ angular.module('myApp.services', ['myApp.i18n']) function onContactUpdated (userID, isContact) { if (angular.isArray(contactsList)) { - var curPos = curIsContact = contactsList.indexOf(userID), + var curPos = curIsContact = contactsList.indexOf(parseInt(userID)), curIsContact = curPos != -1; if (isContact != curIsContact) { @@ -285,15 +277,16 @@ angular.module('myApp.services', ['myApp.i18n']) } else { contactsList.splice(curPos, 1); } + $rootScope.$broadcast('contacts_update', userID); } } } function openImportContact () { return $modal.open({ - templateUrl: 'partials/import_contact_modal.html', + 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(); @@ -368,7 +361,7 @@ angular.module('myApp.services', ['myApp.i18n']) }; 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) { @@ -381,9 +374,9 @@ angular.module('myApp.services', ['myApp.i18n']) 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' + windowClass: 'phonebook_modal_window mobile_modal' }); } @@ -526,19 +519,11 @@ angular.module('myApp.services', ['myApp.i18n']) 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'; - className += ' mobile_modal'; - } - var modalInstance = $modal.open({ - templateUrl: tUrl, + templateUrl: templateUrl('chat_modal'), controller: 'ChatModalController', scope: scope, - windowClass: className + windowClass: 'chat_modal_window mobile_modal' }); } @@ -934,6 +919,9 @@ angular.module('myApp.services', ['myApp.i18n']) unreadOffset = unreadCount; } } + else if (Config.Mobile) { + limit = 20; + } } else if (maxID > 0) { offsetNotFound = true; @@ -2107,8 +2095,9 @@ angular.module('myApp.services', ['myApp.i18n']) $rootScope.$broadcast('dialogs_update', dialog); - if (($rootScope.idle.isIDLE || Config.Mobile && $rootScope.selectedPeerID != peerID) && - !message.out && message.unread) { + if ((Config.Mobile && $rootScope.selectedPeerID != peerID || $rootScope.idle.isIDLE) && + !message.out && + message.unread) { NotificationsManager.getPeerMuted(peerID).then(function (muted) { if (!message.unread || muted) { return; @@ -2379,7 +2368,7 @@ angular.module('myApp.services', ['myApp.i18n']) 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 = { @@ -2405,7 +2394,7 @@ angular.module('myApp.services', ['myApp.i18n']) } } - 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; } @@ -2437,7 +2426,7 @@ angular.module('myApp.services', ['myApp.i18n']) } var modalInstance = $modal.open({ - templateUrl: 'partials/photo_modal.html', + templateUrl: templateUrl('photo_modal'), controller: scope.userID ? 'UserpicModalController' : 'PhotoModalController', scope: scope, windowClass: 'photo_modal_window' @@ -2591,7 +2580,7 @@ angular.module('myApp.services', ['myApp.i18n']) scope.messageID = messageID; var modalInstance = $modal.open({ - templateUrl: 'partials/video_modal.html', + templateUrl: templateUrl('video_modal'), controller: 'VideoModalController', scope: scope, windowClass: 'video_modal_window' @@ -3790,7 +3779,7 @@ angular.module('myApp.services', ['myApp.i18n']) shownBoxes++; var modal = $modal.open({ - templateUrl: 'partials/error_modal.html', + templateUrl: templateUrl('error_modal'), scope: scope, windowClass: options.windowClass || 'error_modal_window' }); @@ -3815,7 +3804,7 @@ angular.module('myApp.services', ['myApp.i18n']) 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' }); @@ -3851,19 +3840,11 @@ angular.module('myApp.services', ['myApp.i18n']) angular.extend(scope, options); } - var tUrl = 'partials/peer_select.html', - className = 'peer_select_window page_modal'; - - if (Config.Navigator.mobile) { - tUrl = 'partials/mobile/peer_select.html'; - className += ' mobile_modal'; - } - return $modal.open({ - templateUrl: tUrl, + templateUrl: templateUrl('peer_select'), controller: 'PeerSelectController', scope: scope, - windowClass: className + windowClass: 'peer_select_window mobile_modal' }).result; } @@ -3886,19 +3867,11 @@ angular.module('myApp.services', ['myApp.i18n']) 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'; - className += ' mobile_modal'; - } - return $modal.open({ - templateUrl: tUrl, + templateUrl: templateUrl('contacts_modal'), controller: 'ContactsModalController', scope: scope, - windowClass: className + windowClass: 'contacts_modal_window mobile_modal' }).result; } @@ -3966,9 +3939,9 @@ angular.module('myApp.services', ['myApp.i18n']) }; $modal.open({ - templateUrl: 'partials/changelog_modal.html', + templateUrl: templateUrl('changelog_modal'), scope: $scope, - windowClass: 'changelog_modal_window page_modal' + windowClass: 'changelog_modal_window mobile_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/desktop/head.html b/app/partials/desktop/head.html new file mode 100644 index 00000000..510ec950 --- /dev/null +++ b/app/partials/desktop/head.html @@ -0,0 +1,28 @@ +
+ +
diff --git a/app/partials/im.html b/app/partials/desktop/im.html similarity index 95% rename from app/partials/im.html rename to app/partials/desktop/im.html index b72aba11..ba69c02c 100644 --- a/app/partials/im.html +++ b/app/partials/desktop/im.html @@ -15,7 +15,7 @@ @@ -83,14 +83,6 @@
-
-
-

-

- -
-
-
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 95% rename from app/partials/login.html rename to app/partials/desktop/login.html index 36b573ae..252397ab 100644 --- a/app/partials/login.html +++ b/app/partials/desktop/login.html @@ -52,7 +52,7 @@
- +
+
+ + \ No newline at end of file diff --git a/app/partials/mobile/contacts_modal.html b/app/partials/mobile/contacts_modal.html index dd3e10be..f9240b5a 100644 --- a/app/partials/mobile/contacts_modal.html +++ b/app/partials/mobile/contacts_modal.html @@ -4,12 +4,39 @@ - diff --git a/app/partials/mobile/im.html b/app/partials/mobile/im.html new file mode 100644 index 00000000..cf022471 --- /dev/null +++ b/app/partials/mobile/im.html @@ -0,0 +1,153 @@ +
+ +
+ +
+ +
+
+ + + +
+ +
+ +
+

No contacts yet

+

Get started by adding a contact to chat with

+ + +
+ +
+ + +
+ +
+
Contacts
+ +
+
+
+ +
+
+ Loading history +
+ +
+
+ +
+ +
+
+
+ Loading history + No messages here yet... +
+ +
+
+
+
+
+ +
+ +
+ +
+ +
+ + + +
+ +
+ +
+
+ +
+
Drop photos here to send
+ +
+ +
+ + +
+ +
+ +
+ + +
+
+ +
+ +
+ +
+ +
+
+ +
+ +
+ + +
+ +
diff --git a/app/partials/mobile/import_contact_modal.html b/app/partials/mobile/import_contact_modal.html new file mode 100644 index 00000000..226f1616 --- /dev/null +++ b/app/partials/mobile/import_contact_modal.html @@ -0,0 +1,53 @@ +
+ +
+ +
+ + + + + +
\ 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..4a83c9b7 --- /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..cb64bc86 --- /dev/null +++ b/app/partials/mobile/message.html @@ -0,0 +1,63 @@ +
+ + +
+ +
+
+ + +
+ + + + + +
+ +
+ + + + +
+ + +
+ +
+ + + +
+
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..680beb0c --- /dev/null +++ b/app/partials/mobile/message_attach_audio.html @@ -0,0 +1,30 @@ +
+ + + + + +
+
+ + Voice message + + + +
+
+ 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..dca019ae --- /dev/null +++ b/app/partials/mobile/message_attach_document.html @@ -0,0 +1,35 @@ +
+ +
+ +
+ + + +
+ +
+
+ +
+
+ + + +
+
+ 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..7fe315a5 --- /dev/null +++ b/app/partials/mobile/message_attach_video.html @@ -0,0 +1,11 @@ +
+ + + + + +
\ 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/peer_select.html b/app/partials/mobile/peer_select.html index f8f6cdb5..88aa7996 100644 --- a/app/partials/mobile/peer_select.html +++ b/app/partials/mobile/peer_select.html @@ -36,37 +36,33 @@ -
-
-
- - -
+
+ +
diff --git a/app/partials/mobile/phonebook_modal.html b/app/partials/mobile/phonebook_modal.html index 5899b1eb..e7277cd3 100644 --- a/app/partials/mobile/phonebook_modal.html +++ b/app/partials/mobile/phonebook_modal.html @@ -8,9 +8,12 @@
-
+ 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 @@ +
+ + + +
\ 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..2f402e97 --- /dev/null +++ b/app/partials/mobile/profile_edit_modal.html @@ -0,0 +1,46 @@ +
+ +
+ +
+ + + +
\ 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 @@ +
+ + + +
\ 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

+
+ +
+ + + + + +
diff --git a/app/vendor/jquery.emojiarea/jquery.emojiarea.js b/app/vendor/jquery.emojiarea/jquery.emojiarea.js index df7b370e..e14c90df 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); @@ -488,15 +484,16 @@ '' + '' + '').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) { @@ -562,8 +559,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 @@ -585,7 +584,9 @@ }); this.currentCategory = category; this.load(category); - this.$itemsWrap.nanoScroller({ scroll: 'top' }); + if (!Config.Mobile) { + this.$itemsWrap.nanoScroller({ scroll: 'top' }); + } }; /*! MODIFICATION END */ @@ -601,10 +602,21 @@ 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('')); + + if (!Config.Mobile) { + setTimeout(function () { + self.$itemsWrap.nanoScroller(); + }, 100); + } + } if (category > 0) { for (var key in options) { @@ -613,41 +625,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) { diff --git a/app/webogram.appcache b/app/webogram.appcache index 7ff0f8c9..879964f7 100644 --- a/app/webogram.appcache +++ b/app/webogram.appcache @@ -1,6 +1,6 @@ CACHE MANIFEST -# 30 +# 33 NETWORK: *