Contacts: Improve loading and cleanup of dialogs.

diff --git a/apps/contacts/ajax/chooseaddressbook.php b/apps/contacts/ajax/chooseaddressbook.php
index 9088a4e9d7d72a115d85fa28854d9e397f418384..1ce8dd46eefbc99cd23c65c7ec5a70fb0f228d59 100644 (file)
--- a/apps/contacts/ajax/chooseaddressbook.php
+++ b/apps/contacts/ajax/chooseaddressbook.php
@@ -10,5 +10,6 @@
 OCP\JSON::checkLoggedIn();
 OCP\JSON::checkAppEnabled('contacts');
 
-$output = new OCP\Template("contacts", "part.chooseaddressbook");
-$output -> printpage();
+$tmpl = new OCP\Template("contacts", "part.chooseaddressbook");
+$page = $tmpl->fetchPage();
+OCP\JSON::success(array('data' => array('page'=>$page)));

diff --git a/apps/contacts/ajax/editaddress.php b/apps/contacts/ajax/editaddress.php
index 9fb35a0b5f7127744473ecc8910431a098bf2aed..969aeeba8f440b70c0842abad981acd18ff69104 100644 (file)
--- a/apps/contacts/ajax/editaddress.php
+++ b/apps/contacts/ajax/editaddress.php
@@ -26,6 +26,7 @@ if($checksum) {
 $tmpl->assign('id',$id);
 $tmpl->assign('adr_types',$adr_types);
 
-$tmpl->printpage();
+$page = $tmpl->fetchPage();
+OCP\JSON::success(array('data' => array('page'=>$page, 'checksum'=>$checksum)));
 
 ?>

diff --git a/apps/contacts/ajax/editname.php b/apps/contacts/ajax/editname.php
index dc64eeb5101d39a1fcf19fee3fdb2d769a7336ab..9ba280ae54278b0140fef8d7b2fd4c549b39d9fc 100644 (file)
--- a/apps/contacts/ajax/editname.php
+++ b/apps/contacts/ajax/editname.php
@@ -35,9 +35,8 @@ if($id) {
        $tmpl->assign('id',$id);
 } else {
        bailOut(OC_Contacts_App::$l10n->t('Contact ID is missing.'));
-       //$addressbooks = OC_Contacts_Addressbook::active(OCP\USER::getUser());
-       //$tmpl->assign('addressbooks', $addressbooks);
 }
-$tmpl->printpage();
+$page = $tmpl->fetchPage();
+OCP\JSON::success(array('data' => array('page'=>$page)));
 
 ?>

diff --git a/apps/contacts/css/contacts.css b/apps/contacts/css/contacts.css
index 9aa63f016c1b7caea92721f02aa09657c3a826c4..1d02b3722ddc37990cb102ac611789ee0fa9ba97 100644 (file)
--- a/apps/contacts/css/contacts.css
+++ b/apps/contacts/css/contacts.css
@@ -30,6 +30,7 @@ textarea { width: 80%; min-height: 5em; min-width: 30em; margin: 0 !important; p
 dl.form { width: 100%; float: left; clear: right; margin: 0; padding: 0; }
 .form dt { display: table-cell; clear: left; float: left; width: 7em; margin: 0; padding: 0.8em 0.5em 0 0; text-align:right; text-overflow:ellipsis; o-text-overflow: ellipsis; vertical-align: text-bottom; color: #bbb;/* white-space: pre-wrap; white-space: -moz-pre-wrap !important; white-space: -pre-wrap; white-space: -o-pre-wrap;*/ }
 .form dd { display: table-cell; clear: right; float: left; margin: 0; padding: 0px; white-space: nowrap; vertical-align: text-bottom; }
+label:hover, dt:hover { color: #333; }
 #address.form dt { min-width: 5em; }
 #address.form dl { min-width: 10em; }
 .droptarget { margin: 0.5em; padding: 0.5em; border: thin solid #ccc; -moz-border-radius:.3em; -webkit-border-radius:.3em; border-radius:.3em; }
@@ -65,6 +66,8 @@ dl.form { width: 100%; float: left; clear: right; margin: 0; padding: 0; }
 .contactsection { position: relative; float: left; /*max-width: 40em;*/ padding: 0.5em; height: auto: border: thin solid lightgray;/* -webkit-border-radius: 0.5em; -moz-border-radius: 0.5em; border-radius: 0.5em; background-color: #f8f8f8;*/ }
 
 #cropbox { margin: auto; }
+#contacts_details_photo_wrapper { min-width: 80px; }
+#contacts_details_photo_wrapper.wait { opacity: 0.6; filter:alpha(opacity=0.6); z-index:1000; background: url('%webroot%/core/img/loading.gif') no-repeat center center; cursor: wait; }
 #contacts_details_photo { border-radius: 0.5em; border: thin solid #bbb; margin: 0.3em; background: url('%webroot%/core/img/loading.gif') no-repeat center center; -moz-box-shadow: 0 1px 3px #777; -webkit-box-shadow: 0 1px 3px #777; box-shadow: 0 1px 3px #777; }
 #contacts_details_photo:hover { background: #fff; cursor: default; }
 #phototools { position:absolute; margin: 5px 0 0 10px; width:auto; height:22px; padding:0px; background-color:#fff; list-style-type:none; border-radius: 0.5em; -moz-box-shadow: 0 1px 3px #777; -webkit-box-shadow: 0 1px 3px #777; box-shadow: 0 1px 3px #777; }
@@ -76,7 +79,7 @@ dl.form { width: 100%; float: left; clear: right; margin: 0; padding: 0; }
 #addressdisplay { padding: 0.5em; }
 dl.addresscard { background-color: #fff; float: left; width: auto; margin: 0 0.3em 0.3em 0.3em; padding: 0; border: 0; }
 dl.addresscard dd {}
-dl.addresscard dt { padding: 0.3em; /*border-bottom: thin solid lightgray;*/ font-weight: bold; clear: both; color: #bbb;}
+dl.addresscard dt { padding: 0.3em; font-weight: bold; clear: both; color: #bbb;}
 dl.addresscard dt:hover { color:#777; }
 dl.addresscard dd > ul { margin: 0.3em; padding: 0.3em; }
 dl.addresscard .action { float: right; }

diff --git a/apps/contacts/js/contacts.js b/apps/contacts/js/contacts.js
index 34afdcc4e41fbf80b2b2482a322a2d797b65de62..d8aa724a22185237d06909785040b7a0100115e5 100644 (file)
--- a/apps/contacts/js/contacts.js
+++ b/apps/contacts/js/contacts.js
@@ -758,28 +758,29 @@ Contacts={
                                }
                        },
                        editName:function(){
-                               var isnew = (this.id == '');
+                               var params = {id: this.id};
                                /* Initialize the name edit dialog */
                                if($('#edit_name_dialog').dialog('isOpen') == true){
                                        $('#edit_name_dialog').dialog('moveToTop');
                                }else{
-                                       $('#dialog_holder').load(OC.filePath('contacts', 'ajax', 'editname.php')+'?id='+this.id, function(jsondata){
-                                               if(jsondata.status != 'error'){
-                                                       $('#edit_name_dialog' ).dialog({
+                                       $.getJSON(OC.filePath('contacts', 'ajax', 'editname.php'),{id: this.id},function(jsondata){
+                                               if(jsondata.status == 'success'){
+                                                       $('body').append('<div id="name_dialog"></div>');
+                                                       $('#name_dialog').html(jsondata.data.page).find('#edit_name_dialog' ).dialog({
                                                                modal: true,
-                                                               closeOnEscape: (isnew == '' && false || true),
-                                                               title:  (isnew && t('contacts', 'Add contact') || t('contacts', 'Edit name')),
+                                                               closeOnEscape: true,
+                                                               title:  t('contacts', 'Edit name'),
                                                                height: 'auto', width: 'auto',
                                                                buttons: {
                                                                        'Ok':function() { 
                                                                                Contacts.UI.Card.saveName(this);
-                                                                               $(this).dialog('destroy').remove();
+                                                                               $(this).dialog('close');
                                                                        },
-                                                                       'Cancel':function() { $(this).dialog('destroy').remove(); }
+                                                                       'Cancel':function() { $(this).dialog('close'); }
                                                                },
                                                                close: function(event, ui) {
                                                                        $(this).dialog('destroy').remove();
-                                                                       //return event;
+                                                                       $('#name_dialog').remove();
                                                                },
                                                                open: function(event, ui) {
                                                                        // load 'N' property - maybe :-P
@@ -881,23 +882,23 @@ Contacts={
                        },
                        editAddress:function(obj, isnew){
                                var container = undefined;
-                               var q = q = '?id=' + this.id;
+                               var params = {id: this.id};
                                if(obj === 'new') {
                                        isnew = true;
                                        $('#addressdisplay dl').first().clone(true).insertAfter($('#addressdisplay dl').last()).show();
                                        container = $('#addressdisplay dl').last();
                                        container.removeClass('template').addClass('propertycontainer');
                                } else {
-                                       q = q + '&checksum='+Contacts.UI.checksumFor(obj);
+                                       params['checksum'] = Contacts.UI.checksumFor(obj); 
                                }
                                /* Initialize the address edit dialog */
                                if($('#edit_address_dialog').dialog('isOpen') == true){
                                        $('#edit_address_dialog').dialog('moveToTop');
                                }else{
-                                       $('#dialog_holder').load(OC.filePath('contacts', 'ajax', 'editaddress.php')+q, function(jsondata){
-                                               if(jsondata.status != 'error'){
-                                                       $('#edit_address_dialog' ).dialog({
-                                                               /*modal: true,*/
+                                       $.getJSON(OC.filePath('contacts', 'ajax', 'editaddress.php'),params,function(jsondata){
+                                               if(jsondata.status == 'success'){
+                                                       $('body').append('<div id="address_dialog"></div>');
+                                                       $('#address_dialog').html(jsondata.data.page).find('#edit_address_dialog' ).dialog({
                                                                height: 'auto', width: 'auto',
                                                                buttons: {
                                                                        'Ok':function() {
@@ -906,10 +907,10 @@ Contacts={
                                                                                } else {
                                                                                        Contacts.UI.Card.saveAddress(this, obj, isnew);
                                                                                }
-                                                                               $(this).dialog('destroy').remove();
+                                                                               $(this).dialog('close');
                                                                        },
                                                                        'Cancel':function() {
-                                                                               $(this).dialog('destroy').remove();
+                                                                               $(this).dialog('close');
                                                                                if(isnew) {
                                                                                        container.remove();
                                                                                }
@@ -917,6 +918,7 @@ Contacts={
                                                                },
                                                                close : function(event, ui) {
                                                                        $(this).dialog('destroy').remove();
+                                                                       $('#address_dialog').remove();
                                                                        if(isnew) {
                                                                                container.remove();
                                                                        }
@@ -1122,13 +1124,16 @@ Contacts={
                        },
                        loadPhoto:function(refresh){
                                $('#phototools li a').tipsy('hide');
+                               var wrapper = $('#contacts_details_photo_wrapper');
+                               wrapper.addClass('wait');
                                $.getJSON(OC.filePath('contacts', 'ajax', 'loadphoto.php'),{'id':this.id, 'refresh': refresh},function(jsondata){
                                        if(jsondata.status == 'success'){
                                                $('#contacts_details_photo_wrapper').data('checksum', jsondata.data.checksum);
-                                               $('#contacts_details_photo_wrapper').html(jsondata.data.page);
+                                               wrapper.html(jsondata.data.page).ready(function(){ wrapper.removeClass('wait').tipsy() });
                                                Contacts.UI.Card.loadPhotoHandlers();
                                        }
                                        else{
+                                               wrapper.removeClass('wait');
                                                OC.dialogs.alert(jsondata.data.message, t('contacts', 'Error'));
                                        }
                                });
@@ -1143,6 +1148,7 @@ Contacts={
                                                $('#edit_photo_dialog_img').html(jsondata.data.page);
                                        }
                                        else{
+                                               wrapper.removeClass('wait');
                                                OC.dialogs.alert(jsondata.data.message, t('contacts', 'Error'));
                                        }
                                });
@@ -1167,12 +1173,14 @@ Contacts={
                        savePhoto:function(){
                                var target = $('#crop_target');
                                var form = $('#cropform');
+                               var wrapper = $('#contacts_details_photo_wrapper');
+                               wrapper.addClass('wait');
                                form.submit();
                                target.load(function(){
                                        var response=jQuery.parseJSON(target.contents().text());
                                        if(response != undefined && response.status == 'success'){
                                                // load cropped photo.
-                                               $('#contacts_details_photo_wrapper').html(response.data.page);
+                                               wrapper.html(response.data.page).ready(function(){ wrapper.removeClass('wait') });
                                                Contacts.UI.Card.data.PHOTO = true;
                                                Contacts.UI.Card.loadPhotoHandlers();
                                        }else{
@@ -1280,16 +1288,19 @@ Contacts={
                                if($('#chooseaddressbook_dialog').dialog('isOpen') == true){
                                        $('#chooseaddressbook_dialog').dialog('moveToTop');
                                }else{
-                                       $('#dialog_holder').load(OC.filePath('contacts', 'ajax', 'chooseaddressbook.php'), function(jsondata){
-                                               if(jsondata.status != 'error'){
-                                                       $('#chooseaddressbook_dialog').dialog({
+                                       $('body').append('<div id="addressbook_dialog"></div>');
+                                       $.getJSON(OC.filePath('contacts', 'ajax', 'chooseaddressbook.php'), function(jsondata){
+                                               if(jsondata.status == 'success'){
+                                                       $('#addressbook_dialog').html(jsondata.data.page).find('#chooseaddressbook_dialog').dialog({
                                                                width : 600,
                                                                close : function(event, ui) {
                                                                        $(this).dialog('destroy').remove();
+                                                                       $('#addressbook_dialog').remove();
                                                                }
                                                        }).css('overflow','visible');
                                                } else {
                                                        alert(jsondata.data.message);
+                                                       $('#addressbook_dialog').remove();
                                                }
                                        });
                                }