r4sas/webogram-i2p
1
0
Fork 0
Code Issues Releases Wiki Activity

Added new mobile layout modal windows

Browse Source
This commit is contained in:
Igor Zhukov 2014-07-31 19:09:55 +01:00
parent 0a0a6177d8
commit 7671210513
11 changed files with 706 additions and 41 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

17
app/css/app.css
View File

@ -313,6 +313,13 @@ input[type="number"] {
.modal {
overflow-y: auto;
padding: 10px;
}
.mobile_modal {
padding: 0;
}
.modal-dialog {
margin: 0 auto;
}
.modal-content {
border: 0;
@ -380,13 +387,6 @@ input[type="number"] {
background-image: url(../img/icons/PhotoControls_1x.png);
}
.modal {
padding: 10px;
}
.modal-dialog {
margin: 0 auto;
}
.text-invisible {
visibility: hidden;
}
@ -2620,7 +2620,7 @@ img.chat_modal_participant_photo {
}
.settings_modal_wrap .im_attach_input {
z-index: 1200;
z-index: 999;
}
.settings_modal_settings {
padding: 4px 0;
@ -2932,6 +2932,7 @@ a:hover .icon-twitter {
height: 40px;
margin-right: 10px;
overflow: hidden;
border-radius: 2px;
}
.contacts_modal_contact_status {

141
app/css/app_mobile.css
View File

@ -81,7 +81,8 @@ html {
left: auto;
width: 195px;
}
.navbar_peer_not_selected .navbar-toggle-wrap .dropdown-menu {
.navbar_peer_not_selected .navbar-toggle-wrap .dropdown-menu,
.tg_modal_head .navbar-toggle-wrap .dropdown-menu {
right: 6px;
}
@ -109,7 +110,8 @@ html {
.is_1x .icon-search {
background-image: url(../img/icons/MobileIcons_1x.png);
}
.tg_page_head .navbar_peer_not_selected .navbar-search-wrap {
.tg_page_head .navbar_peer_not_selected .navbar-search-wrap,
.tg_modal_head .navbar-search-wrap {
display: block;
}
@ -854,9 +856,6 @@ a.im_dialog_selected .im_dialog_message_text {
color: #8f8f8f;
}
.im_message_fwd_from {
margin-top: 0;
}
.im_grouped_fwd_start .im_message_fwd_title {
display: block;
color: #8a8a8a;
@ -913,13 +912,6 @@ a.im_message_fwd_author {
}
.peer_select_modal_wrap .modal-body {
padding-left: 0;
padding-right: 0;
}
.modal.page_modal {
background: #FFF;
}
@ -937,10 +929,98 @@ a.im_message_fwd_author {
.page_modal .modal-footer {
padding-left: 0;
padding-right: 0;
padding-bottom: 0;
padding-bottom: 9px;
}
.mobile_modal_body,
.page_modal .modal-content .mobile_modal_body {
padding: 9px;
}
.mobile_user_modal_photo_profile_wrap {
padding: 3px;
margin-bottom: 15px;
}
.mobile_user_modal_image_wrap {
display: block;
width: 64px;
height: 64px;
margin-right: 14px;
}
.mobile_chat_modal_image {
margin-right: 14px;
float: left;
}
.mobile_user_modal_image {
width: 64px;
height: 64px;
overflow: hidden;
border-radius: 32px;
}
.mobile_user_modal_info_wrap {
padding-top: 2px;
}
.mobile_user_modal_header {
font-size: 16px;
font-weight: bold;
margin-bottom: 7px;
margin-top: 11px
}
.mobile_user_modal_status {
font-size: 14px;
color: #999;
}
.mobile_modal_action_wrap {
border-bottom: 1px solid #e0e0e0;
}
a.mobile_modal_action,
span.mobile_modal_action {
color: #000;
display: block;
line-height: 47px;
font-size: 15px;
padding: 0 12px;
margin: 0;
}
span.mobile_modal_upload_action {
position: relative;
}
a.mobile_modal_action:hover,
a.mobile_modal_action:active {
text-decoration: none;
}
a.mobile_modal_action .icon-checkbox-outer {
float: right;
margin-top: 16px;
margin-right: 1px;
}
a.mobile_modal_action .tg_checkbox_label {
vertical-align: baseline;
line-height: inherit;
}
.mobile_modal_section {
border-bottom: 1px solid #e0e0e0;
padding: 15px 0;
}
.mobile_modal_section:last-child {
border-bottom: 0;
}
.mobile_modal_section_header {
font-size: 12px;
margin-bottom: 3px;
margin-top: 0;
color: #999;
padding: 0 12px;
}
.mobile_modal_section_value {
font-size: 15px;
padding: 0 12px;
}
.mobile_modal_section_body {
padding: 0 12px;
}
.user_modal_other_btn button {
padding-right: 0;
@ -1147,5 +1227,40 @@ a.im_message_fwd_author {
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;
}
.contacts_modal_members_list a.contacts_modal_contact {
padding: 8px 0;
border-radius: 0;
border-bottom: 1px solid #e0e0e0;
}
.contacts_modal_members_list li.contacts_modal_contact_wrap {
margin: 0;
}
.contacts_modal_members_list li:last-child a {
border-bottom: 0;
}
.contacts_modal_members_list a.contacts_modal_contact:hover {
background: inherit;
}
.mobile_modal .peer_select_modal_wrap .modal-body {
padding: 0;
}
.settings_about_section_body {
padding-right: 0;
}
}

16
app/js/controllers.js
View File

@ -236,10 +236,18 @@ angular.module('myApp.controllers', [])
$scope.historyState = {selectActions: false, typing: []};
$scope.openSettings = function () {
var tUrl = 'partials/settings_modal.html',
className = 'settings_modal_window page_modal';
if (Config.Navigator.mobile) {
tUrl = 'partials/mobile/settings_modal.html';
className += ' mobile_modal';
}
$modal.open({
templateUrl: 'partials/settings_modal.html',
templateUrl: tUrl,
controller: 'SettingsModalController',
windowClass: 'settings_modal_window page_modal'
windowClass: className
});
}
@ -2119,6 +2127,10 @@ angular.module('myApp.controllers', [])
$modalInstance.close(peerString);
});
};
$scope.toggleSearch = function () {
$scope.$broadcast('dialogs_search_toggle');
};
})
.controller('ChatCreateModalController', function ($scope, $modalInstance, $rootScope, MtpApiManager, AppUsersManager, AppChatsManager, ApiUpdatesManager) {

19
app/js/directives.js
View File

@ -241,7 +241,10 @@ angular.module('myApp.directives', ['myApp.filters'])
dialogsColWrap = $('.im_dialogs_col_wrap')[0],
scrollableWrap = $('.im_dialogs_scrollable_wrap', element)[0],
headWrap = $('.tg_page_head')[0],
panelWrap = $('.im_dialogs_panel')[0],
panelWrapSelector = Config.Navigator.mobile && attrs.modal
? '.mobile_modal_body .im_dialogs_panel'
: '.im_dialogs_panel',
panelWrap = $(panelWrapSelector)[0],
footer = $('.im_page_footer')[0],
hasTabs = false,
moreNotified = false;
@ -300,10 +303,15 @@ angular.module('myApp.directives', ['myApp.filters'])
function updateSizes () {
if (!panelWrap || !panelWrap.offsetHeight) {
panelWrap = $(panelWrapSelector)[0];
}
if (attrs.modal) {
$(element).css({
height: $($window).height() -
(Config.Navigator.mobile ? 100 : 200)
(panelWrap ? panelWrap.offsetHeight : 58) -
(Config.Navigator.mobile ? 46 : 200)
});
updateScroller();
return;
@ -315,9 +323,7 @@ angular.module('myApp.directives', ['myApp.filters'])
if (!footer || !footer.offsetHeight) {
footer = $('.im_page_footer')[0];
}
if (!panelWrap || !panelWrap.offsetHeight) {
panelWrap = $('.im_dialogs_panel')[0];
}
if (!dialogsColWrap || !dialogsColWrap.offsetHeight) {
dialogsColWrap = $('.im_dialogs_col_wrap')[0];
}
@ -361,7 +367,7 @@ angular.module('myApp.directives', ['myApp.filters'])
height: $($window).height() -
(panelWrap && panelWrap.offsetHeight || 0) -
(searchWrap && searchWrap.offsetHeight || 0) -
(Config.Navigator.mobile ? 100 : 200)
(Config.Navigator.mobile ? 64 : 200)
});
$(contactsWrap).nanoScroller();
}
@ -1606,7 +1612,6 @@ angular.module('myApp.directives', ['myApp.filters'])
};
$scope.$watch(attrs.myUserStatus, function (newUserID) {
console.log(attrs.myUserStatus, newUserID);
userID = newUserID;
update();
});

50
app/js/services.js
View File

@ -161,11 +161,19 @@ angular.module('myApp.services', [])
var scope = $rootScope.$new();
scope.userID = userID;
var tUrl = 'partials/user_modal.html',
className = 'user_modal_window page_modal';
if (Config.Navigator.mobile) {
tUrl = 'partials/mobile/user_modal.html';
className += ' mobile_modal';
}
var modalInstance = $modal.open({
templateUrl: 'partials/user_modal.html',
templateUrl: tUrl,
controller: 'UserModalController',
scope: scope,
windowClass: 'user_modal_window page_modal'
windowClass: className
});
};
$rootScope.openUser = openUser;
@ -493,11 +501,19 @@ angular.module('myApp.services', [])
var scope = $rootScope.$new();
scope.chatID = chatID;
var tUrl = 'partials/chat_modal.html',
className = 'chat_modal_window page_modal';
if (Config.Navigator.mobile) {
tUrl = 'partials/mobile/chat_modal.html';
className += ' mobile_modal';
}
var modalInstance = $modal.open({
templateUrl: 'partials/chat_modal.html',
templateUrl: tUrl,
controller: 'ChatModalController',
windowClass: 'chat_modal_window page_modal',
scope: scope
scope: scope,
windowClass: className
});
}
@ -3632,11 +3648,19 @@ angular.module('myApp.services', [])
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: 'partials/peer_select.html',
templateUrl: tUrl,
controller: 'PeerSelectController',
scope: scope,
windowClass: 'peer_select_window'
windowClass: className
}).result;
}
@ -3659,11 +3683,19 @@ angular.module('myApp.services', [])
scope.action = 'select';
}
var tUrl = 'partials/contacts_modal.html',
className = 'contacts_modal_window page_modal';
if (Config.Navigator.mobile) {
tUrl = 'partials/mobile/contacts_modal.html';
className += ' mobile_modal';
}
return $modal.open({
templateUrl: 'partials/contacts_modal.html',
templateUrl: tUrl,
controller: 'ContactsModalController',
scope: scope,
windowClass: 'contacts_modal_window page_modal'
windowClass: className
}).result;
}

4
app/partials/head.html
View File

@ -47,9 +47,9 @@
<div ng-show="curDialog.peer" ng-switch="curDialog.peer &amp;&amp; historyFilter.mediaType.length > 0">
<ul ng-switch-when="true" class="nav navbar-nav navbar-quick-nav">
<li>
<a ng-click="toggleMedia()" class="navbar-quick-media-back" ng-switch="historyFilter.mediaType">
<a ng-click="toggleMedia()" class="navbar-quick-media-back">
<i class="icon icon-back"></i>
<div class="navbar-quick-back-title">
<div class="navbar-quick-back-title" ng-switch="historyFilter.mediaType">
<h4 ng-switch-when="photos">Photos</h4>
<h4 ng-switch-when="video">Videos</h4>
<h4 ng-switch-when="documents">Documents</h4>

126
app/partials/mobile/chat_modal.html Normal file
View File

@ -0,0 +1,126 @@
<div class="chat_modal_wrap">
<div class="tg_page_head tg_modal_head">
<div class="navbar navbar-static-top navbar-inverse">
<div class="container">
<div class="navbar-toggle-wrap dropdown" ng-if="chatFull.chat._ != 'chatForbidden' &amp;&amp; !chatFull.chat.left">
<a class="dropdown-toggle navbar-toggle">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</a>
<ul class="dropdown-menu">
<li ng-if="chatFull.thumb.location">
<a ng-click="deletePhoto()">Delete photo</a>
</li>
<li>
<a ng-click="editTitle()">Edit group</a>
</li>
<li>
<a ng-click="leaveGroup()">Leave group</a>
</li>
<li>
<a ng-click="flushHistory()">Delete chat</a>
</li>
</ul>
</div>
<div class="navbar-header">
<ul class="nav navbar-nav navbar-quick-nav">
<li>
<a ng-click="$close()" class="navbar-quick-media-back">
<i class="icon icon-back"></i>
<div class="navbar-quick-back-title">
<h4>Group info</h4>
</div>
</a>
</li>
</ul>
</div>
</div>
</div>
</div>
<div class="modal-body mobile_modal_body">
<div class="mobile_user_modal_photo_profile_wrap">
<img
class="mobile_user_modal_image mobile_chat_modal_image"
my-load-thumb
watch="true"
thumb="chatFull.thumb"
/>
<div class="mobile_user_modal_info_wrap clearfix">
<h4 class="mobile_user_modal_header" ng-bind-html="chatFull.chat.rTitle"></h4>
<p class="mobile_user_modal_status" ng-if="chatFull.chat.participants_count > 0">
<ng-pluralize count="chatFull.chat.participants_count"
when="{'0': 'No members', 'one': '1 member', 'other': '{} members'}">
</ng-pluralize>
</p>
</div>
</div>
<div class="mobile_modal_action_wrap" ng-if="!chatFull.chat.left &amp;&amp; chatFull.participants.participants.length">
<a class="mobile_modal_action" ng-click="inviteToGroup()">Add member</a>
</div>
<div class="mobile_modal_action_wrap" ng-if="chatFull.chat._ != 'chatForbidden' &amp;&amp; chatFull.chat.left">
<a class="mobile_modal_action" ng-click="returnToGroup()">Return to group</a>
</div>
<div class="mobile_modal_action_wrap" ng-if="chatFull.chat._ == 'chatForbidden'">
<a class="mobile_modal_action" ng-click="flushHistory()">Return to group</a>
</div>
<div class="mobile_modal_action_wrap" ng-if="chatFull.chat._ != 'chatForbidden' &amp;&amp; !chatFull.chat.left &amp;&amp; !photo.updating">
<span class="mobile_modal_action mobile_modal_upload_action">
<input my-file-upload type="file" multiple="false" class="im_attach_input" size="120" multiple="false" accept="image/x-png, image/png, image/gif, image/jpeg" />
Update photo
</span>
</div>
<div class="mobile_modal_action_wrap" ng-if="photo.updating">
<span class="mobile_modal_action">
Updating<span my-loading-dots></span>
</span>
</div>
<div class="mobile_modal_action_wrap">
<a class="mobile_modal_action tg_checkbox clearfix" ng-click="settings.notifications = !settings.notifications" ng-class="settings.notifications ? 'tg_checkbox_on' : ''">
<span class="icon icon-checkbox-outer"><i class="icon-checkbox-inner"></i></span>
<span class="tg_checkbox_label">Notifications</span>
</a>
</div>
<div class="mobile_modal_section">
<h4 class="mobile_modal_section_header">Members</h4>
<div class="mobile_modal_section_body">
<div class="chat_modal_members_list">
<div class="chat_modal_participant_wrap clearfix" ng-repeat="participant in chatFull.participants.participants | orderBy:'-user.sortStatus'">
<a ng-if="participant.canKick" ng-click="kickFromGroup(participant.user_id)" class="chat_modal_participant_kick pull-right">Kick</a>
<a class="chat_modal_participant_photo pull-left" my-user-photolink="participant.user_id" img-class="chat_modal_participant_photo" status="true"></a>
<div class="chat_modal_participant_name">
<a my-user-link="participant.user_id"></a>
</div>
<div class="chat_modal_participant_status" my-user-status="::participant.user_id"></div>
</div>
</div>
<div class="chat_modal_members_forbidden" ng-if="chatFull.chat._ == 'chatForbidden' || chatFull.chat.left">
Group members list is unavailable.
</div>
</div>
</div>
</div>
</div>

94
app/partials/mobile/contacts_modal.html Normal file
View File

@ -0,0 +1,94 @@
<div class="contacts_modal_wrap">
<div class="tg_page_head tg_modal_head">
<div class="navbar navbar-static-top navbar-inverse">
<div class="container">
<div class="navbar-header">
<ul class="nav navbar-nav navbar-quick-nav">
<li class="navbar-quick-right" ng-if="!action || action == 'edit'" ng-switch="action">
<a ng-switch-when="edit" ng-click="toggleEdit(false)">
Cancel
</a>
<a ng-switch-default ng-click="toggleEdit(true)">
Edit
</a>
</li>
<li>
<a ng-click="$dismiss()" class="navbar-quick-media-back">
<i class="icon icon-back"></i>
<div class="navbar-quick-back-title">
<h4 ng-switch="action">
<div ng-switch-when="new_group" ng-switch="selectedCount > 0">
<span ng-switch-when="true">
<ng-pluralize count="selectedCount" when="{'one': '1 participant', 'other': '{} participants'}">
</ng-pluralize>
</span>
<span ng-switch-default>New Group</span>
</div>
<span ng-switch-default>Contacts</span>
</h4>
</div>
</a>
</li>
</ul>
</div>
</div>
</div>
</div>
<div class="modal-body mobile_modal_body">
<div class="contacts_modal_search">
<input class="form-control contacts_modal_search_field no_outline" my-focused type="search" placeholder="Search" ng-model="search.query"/>
<a class="contacts_modal_search_clear" ng-click="search.query = ''" ng-show="search.query.length"></a>
</div>
<div my-contacts-list class="contacts_modal_col">
<div class="contacts_wrap nano" my-infinite-scroller>
<div class="contacts_scrollable_wrap nano-content">
<ul class="contacts_modal_members_list nav nav-pills nav-stacked">
<li class="contacts_modal_contact_wrap clearfix" ng-repeat="contact in contacts | orderBy:'user.sortName' | limitTo: slice.limit track by contact.userID" ng-class="{active: selectedContacts[contact.userID], disabled: disabledContacts[contact.userID]}">
<a class="contacts_modal_contact" ng-click="contactSelect(contact.userID)">
<i ng-if="multiSelect" class="icon icon-contact-tick"></i>
<div class="contacts_modal_contact_photo pull-left" my-user-photolink="contact.userID" status="true" img-class="contacts_modal_contact_photo"></div>
<div class="contacts_modal_contact_name" ng-bind-html="contact.user.rFullName"></div>
<div class="contacts_modal_contact_status" my-user-status="::contact.userID"></div>
</a>
</li>
</ul>
</div>
</div>
</div>
</div>
<div class="modal-footer contacts_modal_panel" ng-switch="action">
<button ng-switch-when="new_group" class="btn btn-primary" ng-class="{disabled: !selectedCount}" ng-disabled="!selectedCount" ng-click="submitSelected()" type="submit">
Next
</button>
<button ng-switch-when="select" class="btn btn-primary" ng-class="{disabled: !selectedCount}" ng-disabled="!selectedCount" ng-click="submitSelected()" type="submit">
Next
</button>
<button ng-switch-when="edit" class="btn btn-danger" ng-class="{disabled: !selectedCount}" ng-disabled="!selectedCount" ng-click="deleteSelected()">
Delete <strong ng-bind="selectedCount"></strong>
</button>
<button ng-switch-default class="btn btn-link" ng-click="importContact()">
New contact
</button>
</div>
</div>

76
app/partials/mobile/peer_select.html Normal file
View File

@ -0,0 +1,76 @@
<div class="peer_select_modal_wrap">
<div class="tg_page_head tg_modal_head">
<div class="navbar navbar-static-top navbar-inverse">
<div class="container">
<a class="navbar-search-wrap" ng-click="toggleSearch()">
<i class="icon-search"></i>
</a>
<div class="navbar-header">
<ul class="nav navbar-nav navbar-quick-nav">
<li>
<a ng-click="$dismiss()" class="navbar-quick-media-back">
<i class="icon icon-back"></i>
<div class="navbar-quick-back-title">
<h4>Select conversation</h4>
</div>
</a>
</li>
</ul>
</div>
</div>
</div>
</div>
<div class="modal-body mobile_modal_body">
<div class="im_dialogs_modal_col_wrap" ng-controller="AppImDialogsController" my-dialogs>
<div class="im_dialogs_panel">
<div class="im_dialogs_search">
<input my-focused class="form-control im_dialogs_search_field" type="search" placeholder="Search" ng-model="search.query"/>
<a class="im_dialogs_search_clear" ng-click="search.query = ''" ng-show="search.query.length"></a>
</div>
</div>
<div my-dialogs-list modal="true" class="im_dialogs_modal_col">
<div class="im_dialogs_wrap nano">
<div class="im_dialogs_scrollable_wrap nano-content">
<ul class="nav nav-pills nav-stacked">
<li class="im_dialog_wrap" my-dialog dialog-message="dialogMessage" ng-repeat="dialogMessage in dialogs track by dialogMessage.peerID"></li>
</ul>
<div class="im_dialogs_contacts_wrap" ng-show="contacts.length > 0">
<h5>Contacts</h5>
<ul class="nav nav-pills nav-stacked">
<li class="im_dialog_wrap" ng-repeat="contact in contacts | orderBy:'user.sortName' track by contact.userID" ng-class="{active: curDialog.peerID == contact.userID}">
<a class="im_dialog" ng-click="dialogSelect(contact.peerString)">
<div class="im_dialog_photo pull-left">
<img
class="im_dialog_photo"
my-load-thumb
thumb="contact.userPhoto"
/>
</div>
<div class="im_dialog_message_wrap">
<div class="im_dialog_peer">
<span class="im_dialog_user" ng-bind-html="contact.user.rFullName"></span>
</div>
<div class="im_dialog_message">
<span class="im_dialog_message_text" my-user-status="::contact.userID"></span>
</div>
</div>
</a>
</li>
</ul>
</div>
</div>
</div>
</div>
</div>
</div>
</div>

115
app/partials/mobile/settings_modal.html Normal file
View File

@ -0,0 +1,115 @@
<div class="settings_modal_wrap modal_content_wrap">
<div class="tg_page_head tg_modal_head">
<div class="navbar navbar-static-top navbar-inverse">
<div class="container">
<div class="navbar-toggle-wrap dropdown">
<a class="dropdown-toggle navbar-toggle">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</a>
<ul class="dropdown-menu">
<li ng-if="photo.location">
<a ng-click="deletePhoto()">Delete profile photo</a>
</li>
<li>
<a ng-click="editProfile()">Edit profile</a>
</li>
<li>
<a ng-click="terminateSessions()">Terminate all sessions</a>
</li>
</ul>
</div>
<div class="navbar-header">
<ul class="nav navbar-nav navbar-quick-nav">
<li>
<a ng-click="$close()" class="navbar-quick-media-back">
<i class="icon icon-back"></i>
<div class="navbar-quick-back-title">
<h4>Settings</h4>
</div>
</a>
</li>
</ul>
</div>
</div>
</div>
</div>
<div class="modal-body mobile_modal_body">
<div class="mobile_user_modal_photo_profile_wrap">
<a href="" ng-click="openPhoto(photo.id, -profile.id)" class="mobile_user_modal_image_wrap pull-left" ng-class="{disabled: !photo.id}">
<img
class="mobile_user_modal_image"
my-load-thumb
watch="true"
thumb="photo"
/>
</a>
<div class="mobile_user_modal_info_wrap clearfix">
<h4 class="mobile_user_modal_header" ng-bind-html="profile.rFullName"></h4>
<p class="mobile_user_modal_status" my-user-status="::profile.id"></p>
</div>
</div>
<div class="mobile_modal_action_wrap" ng-switch="photo.updating">
<span ng-switch-when="true" class="mobile_modal_action">
Updating<span my-loading-dots></span>
</span>
<span ng-switch-default class="mobile_modal_action mobile_modal_upload_action">
<input my-file-upload type="file" multiple="false" class="im_attach_input" size="120" multiple="false" accept="image/x-png, image/png, image/gif, image/jpeg" />
Set profile photo
</span>
</div>
<div class="mobile_modal_action_wrap">
<a class="mobile_modal_action tg_checkbox clearfix" ng-click="toggleDesktop()" ng-class="notify.desktop ? 'tg_checkbox_on' : ''">
<span class="icon icon-checkbox-outer"><i class="icon-checkbox-inner"></i></span>
<span class="tg_checkbox_label">Notification alerts</span>
</a>
</div>
<div class="mobile_modal_action_wrap">
<a class="mobile_modal_action tg_checkbox clearfix" ng-click="toggleSound()" ng-class="notify.volume ? 'tg_checkbox_on' : ''">
<span class="icon icon-checkbox-outer"><i class="icon-checkbox-inner"></i></span>
<span class="tg_checkbox_label">Sounds</span>
</a>
</div>
<div class="mobile_modal_action_wrap">
<a class="mobile_modal_action tg_checkbox clearfix" ng-click="toggleCtrlEnter(send.enter == 1 ? 0 : 1)" ng-class="send.enter == 1 ? 'tg_checkbox_on' : ''">
<span class="icon icon-checkbox-outer"><i class="icon-checkbox-inner"></i></span>
<span class="tg_checkbox_label">Send on Enter</span>
</a>
</div>
<div class="mobile_modal_section" ng-if="profile.phone">
<h4 class="mobile_modal_section_header">Phone</h4>
<div class="mobile_modal_section_value" ng-bind="profile.phone | phoneNumber"></div>
</div>
<div class="mobile_modal_section">
<h4 class="mobile_modal_section_header">About</h4>
<div class="mobile_modal_section_body settings_about_section_body clearfix">
<div class="settings_external_services pull-right">
<a href="https://github.com/zhukov/webogram" target="_blank" title="Source code on GitHub" class="settings_external_service"><i class="icon icon-github"></i></a>
<a href="https://twitter.com/telegram_web" target="_blank" title="Follow us on Twitter!" class="settings_external_service"><i class="icon icon-twitter"></i></a>
</div>
<p>
<a ng-click="openChangelog()">Recent updates (ver. <span ng-bind="version"></span>)</a>
</p>
</div>
</div>
</div>
</div>

89
app/partials/mobile/user_modal.html Normal file
View File

@ -0,0 +1,89 @@
<div class="mobile_user_modal_wrap">
<div class="tg_page_head tg_modal_head">
<div class="navbar navbar-static-top navbar-inverse">
<div class="container">
<div class="navbar-toggle-wrap dropdown">
<a class="dropdown-toggle navbar-toggle">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</a>
<ul class="dropdown-menu">
<li ng-if="user._ == 'userContact'">
<a ng-click="importContact(true)">Edit contact</a>
</li>
<li ng-if="user._ == 'userContact'">
<a ng-click="deleteContact()">Delete contact</a>
</li>
<li ng-if="user.phone.length > 0 &amp;&amp; user._ != 'userContact'">
<a ng-click="importContact()">Add to contacts</a>
</li>
<li>
<a ng-click="flushHistory()">Delete chat</a>
</li>
</ul>
</div>
<div class="navbar-header">
<ul class="nav navbar-nav navbar-quick-nav">
<li>
<a ng-click="$close()" class="navbar-quick-media-back">
<i class="icon icon-back"></i>
<div class="navbar-quick-back-title">
<h4>Contact info</h4>
</div>
</a>
</li>
</ul>
</div>
</div>
</div>
</div>
<div class="modal-body mobile_modal_body">
<div class="mobile_user_modal_photo_profile_wrap">
<a href="" ng-click="openPhoto(userPhoto.id, -user.id)" class="mobile_user_modal_image_wrap pull-left" ng-class="{disabled: !userPhoto.id}">
<img
class="mobile_user_modal_image"
my-load-thumb
thumb="userPhoto"
/>
</a>
<div class="mobile_user_modal_info_wrap clearfix">
<h4 class="mobile_user_modal_header" ng-bind="user | userName"></h4>
<p class="mobile_user_modal_status" ng-if="user.status" my-user-status="::user.id"></p>
</div>
</div>
<div class="mobile_modal_action_wrap">
<a class="mobile_modal_action" ng-click="goToHistory()">Send message</a>
</div>
<div ng-if="user.phone.length > 0" class="mobile_modal_action_wrap">
<a class="mobile_modal_action" ng-click="shareContact()">Share contact</a>
</div>
<div class="mobile_modal_action_wrap">
<a class="mobile_modal_action tg_checkbox clearfix" ng-click="settings.notifications = !settings.notifications" ng-class="settings.notifications ? 'tg_checkbox_on' : ''">
<span class="icon icon-checkbox-outer"><i class="icon-checkbox-inner"></i></span>
<span class="tg_checkbox_label">Notifications</span>
</a>
</div>
<div class="mobile_modal_section">
<h4 class="mobile_modal_section_header">Phone</h4>
<div class="mobile_modal_section_value" ng-bind="user.phone | phoneNumber"></div>
</div>
</div>
</div>