nextcloud
/
contacts
mirror of https://github.com/nextcloud/contacts
0
0
Fork 0
Code Issues Releases Wiki Activity

Merge pull request #349 from nextcloud/loading-on-contact-switch 

Add loading in details view on contact switch and initialisation
This commit is contained in:
John Molakvoæ 2017-09-21 15:00:24 +02:00 committed by GitHub
parent f34895414a 8f7e303372
commit f271d147d0
3 changed files with 19 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
css/_details.scss
View File

@ -1,6 +1,7 @@
.contact-details-wrapper {
position: relative;
background: $color-main-background;
min-height: 100%;
}
.wrapper-show {

12
js/components/contactDetails/contactDetails_controller.js
View File

@ -3,7 +3,8 @@ angular.module('contactsApp')
var ctrl = this;
ctrl.loading = true;
ctrl.init = true;
ctrl.loading = false;
ctrl.show = false;
ctrl.clearContact = function() {
@ -21,11 +22,12 @@ angular.module('contactsApp')
placeholderName : t('contacts', 'Name'),
placeholderOrg : t('contacts', 'Organization'),
placeholderTitle : t('contacts', 'Title'),
selectField : t('contacts', 'Add field ...'),
selectField : t('contacts', 'Add field …'),
download : t('contacts', 'Download'),
delete : t('contacts', 'Delete'),
save : t('contacts', 'Save changes'),
addressBook : t('contacts', 'Address book')
addressBook : t('contacts', 'Address book'),
loading : t('contacts', 'Loading contacts …')
};
ctrl.fieldDefinitions = vCardPropertiesService.fieldDefinitions;
@ -41,7 +43,7 @@ angular.module('contactsApp')
return book.displayName === ctrl.contact.addressBookId;
});
}
ctrl.loading = false;
ctrl.init = false;
// Start watching for ctrl.uid when we have addressBooks, as they are needed for fetching
// full details.
$scope.$watch('ctrl.uid', function(newValue) {
@ -56,6 +58,7 @@ angular.module('contactsApp')
$('#app-navigation-toggle').removeClass('showdetails');
return;
}
ctrl.loading = true;
ContactService.getById(ctrl.addressBooks, uid).then(function(contact) {
if (angular.isUndefined(contact)) {
ctrl.clearContact();
@ -63,6 +66,7 @@ angular.module('contactsApp')
}
ctrl.contact = contact;
ctrl.show = true;
ctrl.loading = false;
$('#app-navigation-toggle').addClass('showdetails');
ctrl.addressBook = _.find(ctrl.addressBooks, function(book) {

13
templates/contactDetails.html
View File

@ -1,11 +1,18 @@
<div class="contact-details-wrapper wrapper-show" ng-class="{'mobile-show':ctrl.show}">
<div class="contact-details-wrapper wrapper-show"
ng-class="{'mobile-show': ctrl.show, 'icon-loading': ctrl.loading}">
<div id="app-navigation-toggle-back" class="details-back icon-download" ng-click="ctrl.clearContact()"></div>
<div ng-if="ctrl.contact===undefined && !ctrl.loading">
<div id="emptycontent" class="">
<div ng-if="ctrl.contact===undefined && !ctrl.loading && !ctrl.init">
<div id="emptycontent">
<div class="icon-contacts-dark"></div>
<h2>{{ctrl.t.noContacts}}</h2>
</div>
</div>
<div ng-if="ctrl.init">
<div id="emptycontent">
<div class="icon-contacts-dark"></div>
<h2>{{ctrl.t.loading}}</h2>
</div>
</div>
<div ng-if="ctrl.contact!==undefined">
<header class="contactdetails__header" ng-style="{'background-color': (ctrl.contact.uid() | contactColor)}">
<avatar data="ctrl.contact" ng-class="{'avatar--missing': ctrl.contact.photo()===undefined}"></avatar>