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

New contacts modal 

Allow to delete multiple contacts
Closes #360
Handle Notification onclick
master
Igor Zhukov 10 years ago
parent
6792bf7eea
commit
b4acbc0082
7 changed files with 134 additions and 55 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 84
      app/css/app.css
  2. 6
      app/css/app_mobile.css
  3. 36
      app/js/controllers.js
  4. 18
      app/js/services.js
  5. 33
      app/partials/contacts_modal.html
  6. 4
      app/partials/im.html
  7. 8
      app/partials/phonebook_modal.html

84
app/css/app.css
Unescape View File

@ -50,6 +50,11 @@ a.disabled { @@ -50,6 +50,11 @@ a.disabled {
-webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(102, 175, 233, 0.6);
box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(102, 175, 233, 0.6);
}
.form-control.no_outline:focus {
border: 1px solid #d9dbde;
box-shadow: none;
outline: none;
}
input[type="number"]::-webkit-outer-spin-button,
input[type="number"]::-webkit-inner-spin-button {
@ -145,6 +150,7 @@ input[type="number"] { @@ -145,6 +150,7 @@ input[type="number"] {
.btn-link:hover {
background: #f2f6fa;
}
.btn-link.btn-link-noarea:hover,
.btn-link.dropdown-toggle:hover {
background: none;
}
@ -433,8 +439,8 @@ input[type="number"] { @@ -433,8 +439,8 @@ input[type="number"] {
z-index: 1051;
top: 0;
right: 0;
width: 47px;
height: 47px;
width: 54px;
height: 54px;
}
.modal-close-button i {
display: inline-block;
@ -442,7 +448,7 @@ input[type="number"] { @@ -442,7 +448,7 @@ input[type="number"] {
background-size: 42px 710px;
width: 12px;
height: 12px;
margin: 17px;
margin: 21px;
opacity: 0.8;
}
.is_1x .modal-close-button i {
@ -2823,7 +2829,24 @@ a:hover .icon-twitter { @@ -2823,7 +2829,24 @@ a:hover .icon-twitter {
/* Contacts modal */
.contacts_modal_window .modal-dialog {
max-width: 506px;
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 {
@ -2837,7 +2860,7 @@ a:hover .icon-twitter { @@ -2837,7 +2860,7 @@ a:hover .icon-twitter {
background-size: 42px 710px;
border: 1px solid #F2F2F2;
border-radius: 3px;
padding: 6px 20px 6px 30px;
padding: 6px 15px 6px 30px;
margin: 0;
}
.is_1x .contacts_modal_search_field {
@ -2851,7 +2874,7 @@ a:hover .icon-twitter { @@ -2851,7 +2874,7 @@ a:hover .icon-twitter {
.contacts_modal_search_clear {
position: absolute;
right: 9px;
margin-top: -23px;
margin-top: -24px;
color: #999;
width: 13px;
height: 13px;
@ -2886,17 +2909,12 @@ a:hover .icon-twitter { @@ -2886,17 +2909,12 @@ a:hover .icon-twitter {
padding: 8px 9px;
border-radius: 0;
}
.contacts_modal_members_list a.contacts_modal_contact:hover {
.contacts_modal_members_list a.contacts_modal_contact:hover,
.contacts_modal_members_list .active a.contacts_modal_contact,
.contacts_modal_members_list .active a.contacts_modal_contact:hover {
border-radius: 2px;
background: #f2f6fa;
}
.contacts_modal_members_list .active a.contacts_modal_contact {
border-radius: 2px;
background-color: #6490b1;
}
.contacts_modal_members_list .active a.contacts_modal_contact:hover {
background-color: #6490b1;
}
.contacts_modal_contact_name {
@ -2918,34 +2936,34 @@ a:hover .icon-twitter { @@ -2918,34 +2936,34 @@ a:hover .icon-twitter {
.contacts_modal_contact_status {
color: #999;
}
a.contacts_modal_contact:hover .contacts_modal_contact_status {
color: #91a6ba;
}
.contacts_modal_members_list .active .contacts_modal_contact_name,
a.contacts_modal_contact:hover .contacts_modal_contact_status,
.contacts_modal_members_list .active a.contacts_modal_contact .contacts_modal_contact_status {
color: #FFF;
color: #91a6ba;
}
.icon-contact-tick {
position: absolute;
right: 10px;
top: 22px;
width: 17px;
height: 15px;
background: url(../img/icons/IconsetW.png) -13px -366px no-repeat;
top: 17px;
display: inline-block;
width: 25px;
height: 25px;
background: url(../img/icons/IconsetW.png) -9px -516px no-repeat;
background-size: 42px 710px;
opacity: 0.5;
}
.is_1x .icon-contact-tick {
background-image: url(../img/icons/IconsetW_1x.png);
}
.contacts_modal_members_list a.contacts_modal_contact:hover .icon-contact-tick {
background-position: -13px -366px;
opacity: 1;
.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 .active .icon-contact-tick {
background-position: -13px -458px !important;
.contacts_modal_members_list .contacts_modal_contact_wrap.active .icon-contact-tick {
background-position: -9px -481px;
opacity: 1;
}
.contacts_modal_members_list .disabled {
@ -2955,6 +2973,14 @@ a.contacts_modal_contact:hover .contacts_modal_contact_status { @@ -2955,6 +2973,14 @@ a.contacts_modal_contact:hover .contacts_modal_contact_status {
display: none;
}
.contacts_modal_panel {
text-align: center;
}
.group_edit_modal_window .modal-dialog {
max-width: 506px;
}
/* Messages edit panel */

6
app/css/app_mobile.css
Unescape View File

@ -387,6 +387,12 @@ html { @@ -387,6 +387,12 @@ html {
padding-left: 0;
padding-right: 0;
}
.page_modal .modal-footer {
padding-left: 0;
padding-right: 0;
padding-bottom: 0;
}
.user_modal_other_btn button {

36
app/js/controllers.js
Unescape View File

@ -261,7 +261,7 @@ angular.module('myApp.controllers', []) @@ -261,7 +261,7 @@ angular.module('myApp.controllers', [])
templateUrl: 'partials/chat_create_modal.html',
controller: 'ChatCreateModalController',
scope: scope,
windowClass: 'contacts_modal_window'
windowClass: 'group_edit_modal_window'
});
}
@ -1803,7 +1803,7 @@ angular.module('myApp.controllers', []) @@ -1803,7 +1803,7 @@ angular.module('myApp.controllers', [])
templateUrl: 'partials/chat_edit_modal.html',
controller: 'ChatEditModalController',
scope: scope,
windowClass: 'contacts_modal_window'
windowClass: 'group_edit_modal_window'
});
}
@ -2019,12 +2019,10 @@ angular.module('myApp.controllers', []) @@ -2019,12 +2019,10 @@ angular.module('myApp.controllers', [])
$scope.contacts = [];
$scope.search = {};
$scope.slice = {limit: 20, limitDelta: 20}
$scope.slice = {limit: 20, limitDelta: 20};
$scope.selectedContacts = {};
resetSelected();
$scope.disabledContacts = {};
$scope.selectedCount = 0;
if ($scope.disabled) {
for (var i = 0; i < $scope.disabled.length; i++) {
@ -2041,6 +2039,11 @@ angular.module('myApp.controllers', []) @@ -2041,6 +2039,11 @@ angular.module('myApp.controllers', [])
}
}
function resetSelected () {
$scope.selectedContacts = {};
$scope.selectedCount = 0;
};
function updateContacts (query) {
AppUsersManager.getContacts(query).then(function (contactsList) {
$scope.contacts = [];
@ -2060,6 +2063,12 @@ angular.module('myApp.controllers', []) @@ -2060,6 +2063,12 @@ angular.module('myApp.controllers', [])
$scope.$watch('search.query', updateContacts);
$scope.toggleEdit = function (enabled) {
$scope.action = enabled ? 'edit' : '';
$scope.multiSelect = enabled;
resetSelected();
};
$scope.contactSelect = function (userID) {
if ($scope.disabledContacts[userID]) {
return false;
@ -2084,7 +2093,20 @@ angular.module('myApp.controllers', []) @@ -2084,7 +2093,20 @@ angular.module('myApp.controllers', [])
});
return $modalInstance.close(selectedUserIDs);
}
}
};
$scope.deleteSelected = function () {
if ($scope.selectedCount > 0) {
var selectedUserIDs = [];
angular.forEach($scope.selectedContacts, function (t, userID) {
selectedUserIDs.push(userID);
});
AppUsersManager.deleteContacts(selectedUserIDs).then(function () {
resetSelected();
updateContacts($scope.search.query);
});
}
};
$scope.importContact = function () {
AppUsersManager.openImportContact().then(function () {

18
app/js/services.js
Unescape View File

@ -3332,10 +3332,17 @@ angular.module('myApp.services', []) @@ -3332,10 +3332,17 @@ angular.module('myApp.services', [])
notification.onclick = function () {
notification.close();
if (window.chrome && chrome.app && chrome.app.window) {
chrome.app.window.current().focus();
if (window.mozApps && document.hidden) {
// Get app instance and launch it to bring app to foreground
window.mozApps.getSelf().onsuccess = function() {
this.result.launch();
};
} else {
if (window.chrome && chrome.app && chrome.app.window) {
chrome.app.window.current().focus();
}
window.focus();
}
window.focus();
notificationsClear();
if (data.onclick) {
data.onclick();
@ -3484,13 +3491,16 @@ angular.module('myApp.services', []) @@ -3484,13 +3491,16 @@ angular.module('myApp.services', [])
var scope = $rootScope.$new();
scope.multiSelect = multiSelect;
if (multiSelect) {
scope.action = 'select';
}
angular.extend(scope, options);
return $modal.open({
templateUrl: 'partials/contacts_modal.html',
controller: 'ContactsModalController',
scope: scope,
windowClass: 'contacts_modal_window'
windowClass: 'contacts_modal_window page_modal'
}).result;
}

33
app/partials/contacts_modal.html
Unescape View File

@ -1,13 +1,24 @@ @@ -1,13 +1,24 @@
<div class="contacts_modal_wrap" my-modal-position>
<a class="modal-close-button visible-xs" ng-click="$dismiss()"><i></i></a>
<a class="modal-close-button" ng-click="$dismiss()"><i></i></a>
<div class="modal-body">
<h4 class="modal_simple_header visible-xs">Contacts</h4>
<div class="contacts_modal_header">
<div class="contacts_modal_edit_wrap" ng-if="action != 'select'" ng-switch="action">
<a ng-switch-when="edit" class="contacts_modal_edit_link" ng-click="toggleEdit(false)">
Cancel
</a>
<a ng-switch-default class="contacts_modal_edit_link" ng-click="toggleEdit(true)">
Edit
</a>
</div>
<h4 class="contacts_modal_title">Contacts</h4>
</div>
<div class="contacts_modal_search">
<input class="form-control contacts_modal_search_field" my-focused type="search" placeholder="Search" ng-model="search.query"/>
<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>
@ -34,7 +45,7 @@ @@ -34,7 +45,7 @@
</div>
<div class="contacts_modal_contact_name" ng-bind-html="contact.user.rFullName"></div>
<div class="contacts_modal_contact_status">{{contact.user | userStatus}}</div>
<div class="contacts_modal_contact_status" ng-bind="contact.user | userStatus"></div>
</a>
</li>
@ -48,14 +59,16 @@ @@ -48,14 +59,16 @@
</div>
<div class="modal-footer contacts_modal_panel" ng-switch="multiSelect">
<button ng-switch-when="true" class="btn btn-success btn-block" ng-class="{disabled: !selectedCount}" ng-disabled="!selectedCount" ng-click="submitSelected()" type="submit">
<div class="modal-footer contacts_modal_panel" ng-switch="action">
<button ng-switch-when="select" class="btn btn-primary" ng-class="{disabled: !selectedCount}" ng-disabled="!selectedCount" ng-click="submitSelected()" type="submit">
Next »
</button>
<div ng-switch-default>
<a class="btn btn-link pull-left" ng-click="importContact()">Add contact</a>
<button type="button" class="btn btn-primary" ng-click="$dismiss()">Done</button>
</div>
<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>

4
app/partials/im.html
Unescape View File

@ -20,7 +20,7 @@ @@ -20,7 +20,7 @@
</ul>
</div>
<div class="im_dialogs_search">
<input class="form-control im_dialogs_search_field" type="search" placeholder="Search" ng-model="search.query"/>
<input class="form-control im_dialogs_search_field no_outline" type="search" placeholder="Search" ng-model="search.query"/>
<a class="im_dialogs_search_clear" ng-click="searchClear()" ng-show="search.query.length"></a>
</div>
@ -221,7 +221,7 @@ @@ -221,7 +221,7 @@
<div class="im_send_field_wrap">
<div class="im_send_dropbox_wrap"> Drop photos here to send </div>
<textarea ng-model="draftMessage.text" placeholder="Write a message..." class="form-control im_message_field"></textarea>
<textarea ng-model="draftMessage.text" placeholder="Write a message..." class="form-control im_message_field no_outline"></textarea>
</div>
<div class="im_media_attach pull-right">

8
app/partials/phonebook_modal.html
Unescape View File

@ -1,13 +1,15 @@ @@ -1,13 +1,15 @@
<div class="contacts_modal_wrap" my-modal-position>
<a class="modal-close-button visible-xs" ng-click="$dismiss()"><i></i></a>
<a class="modal-close-button" ng-click="$dismiss()"><i></i></a>
<div class="modal-body">
<h4 class="modal_simple_header visible-xs">Phonebook</h4>
<div class="contacts_modal_header">
<h4 class="contacts_modal_title">Phonebook</h4>
</div>
<div class="contacts_modal_search">
<input class="form-control contacts_modal_search_field" my-focused type="search" placeholder="Search" ng-model="search.query"/>
<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>

Write Preview
Loading…
Cancel
Save