From 2c6740b0c72a4e3c66dd63e2c687d90c547b226e Mon Sep 17 00:00:00 2001 From: Thomas Tanghus Date: Thu, 10 May 2012 16:53:25 +0200 Subject: [PATCH] Some UI and code restructering according to usability tests: https://mail.kde.org/pipermail/owncloud/2012-May/003194.html --- apps/contacts/ajax/addcontact.php | 3 +- apps/contacts/css/contacts.css | 3 +- apps/contacts/js/contacts.js | 83 ++++++++++++++++--------------- apps/contacts/lib/vcard.php | 11 ++-- 4 files changed, 53 insertions(+), 47 deletions(-) diff --git a/apps/contacts/ajax/addcontact.php b/apps/contacts/ajax/addcontact.php index dc083df1fa5..ee451098f1d 100755 --- a/apps/contacts/ajax/addcontact.php +++ b/apps/contacts/ajax/addcontact.php @@ -45,6 +45,7 @@ if(!$aid) { } OC_Contacts_App::getAddressbook( $aid ); // is owner access check +$isnew = isset($_POST['isnew'])?$_POST['isnew']:false; $fn = trim($_POST['fn']); $n = trim($_POST['n']); @@ -53,7 +54,7 @@ $vcard->setUID(); $vcard->setString('FN',$fn); $vcard->setString('N',$n); -$id = OC_Contacts_VCard::add($aid,$vcard); +$id = OC_Contacts_VCard::add($aid,$vcard, null, $isnew); if(!$id) { OCP\JSON::error(array('data' => array('message' => OC_Contacts_App::$l10n->t('There was an error adding the contact.')))); OCP\Util::writeLog('contacts','ajax/addcontact.php: Recieved non-positive ID on adding card: '.$id, OCP\Util::ERROR); diff --git a/apps/contacts/css/contacts.css b/apps/contacts/css/contacts.css index 71137e79ec8..1dd6648c477 100644 --- a/apps/contacts/css/contacts.css +++ b/apps/contacts/css/contacts.css @@ -102,5 +102,6 @@ input[type="checkbox"] { width: 20px; height: 20px; vertical-align: bottom; } .propertycontainer[data-element="TEL"] > input[type="text"] { width: 10em !important; float: left; } .propertylist li > input[type="checkbox"],input[type="radio"] { float: left; clear: left; width: 20px; height: 20px; vertical-align: middle; } .propertylist li > select { float: left; max-width: 8em; } -.typelist { float: left; max-width: 10em; border: 0; background-color: #fff; } /* for multiselect */ +.typelist[type="button"] { float: left; max-width: 10em; border: 0; background-color: #fff; color: #bbb} /* for multiselect */ +.typelist[type="button"]:hover { color: #777; } /* for multiselect */ .addresslist { clear: both; font-weight: bold; } diff --git a/apps/contacts/js/contacts.js b/apps/contacts/js/contacts.js index 44b29792206..ee9fadfffb5 100644 --- a/apps/contacts/js/contacts.js +++ b/apps/contacts/js/contacts.js @@ -149,7 +149,34 @@ Contacts={ click: function() { $(this).dialog('close'); } } ] ); + + $('#fn').blur(function(){ + if($('#fn').val() == '') { + OC.dialogs.alert(t('contacts','The name field cannot be empty. Please enter a name for this contact.'), t('contacts','Name is empty'), function() { $('#fn').focus(); }); + $('#fn').focus(); + return false; + } + }); + // Name has changed. Update it and reorder. + $('#fn').change(function(){ + var name = $('#fn').val(); + var item = $('#contacts [data-id="'+Contacts.UI.Card.id+'"]').clone(); + $('#contacts [data-id="'+Contacts.UI.Card.id+'"]').remove(); + $(item).find('a').html(name); + var added = false; + $('#contacts li').each(function(){ + if ($(this).text().toLowerCase() > name.toLowerCase()) { + $(this).before(item).fadeIn('fast'); + added = true; + return false; + } + }); + if(!added) { + $('#leftcontent ul').append(item); + } + }); + $('#categories').multiple_autocomplete({source: categories}); $('#contacts_deletecard').tipsy({gravity: 'ne'}); $('#contacts_downloadcard').tipsy({gravity: 'ne'}); @@ -212,6 +239,12 @@ Contacts={ doImport:function(){ Contacts.UI.notImplemented(); }, + editNew:function(){ // add a new contact + this.id = ''; this.fn = ''; this.fullname = ''; this.givname = ''; this.famname = ''; this.addname = ''; this.honpre = ''; this.honsuf = ''; + //Contacts.UI.Card.add(t('contacts', 'Contact')+';'+t('contacts', 'New')+';;;', t('contacts', 'New Contact'), '', true); + Contacts.UI.Card.add(';;;;;', '', '', true); + return false; + }, add:function(n, fn, aid, isnew){ // add a new contact var card = $('#card')[0]; if(!card) { @@ -224,7 +257,7 @@ Contacts={ } }); } - $.post(OC.filePath('contacts', 'ajax', 'addcontact.php'), { n: n, fn: fn, aid: aid }, + $.post(OC.filePath('contacts', 'ajax', 'addcontact.php'), { n: n, fn: fn, aid: aid, isnew: isnew }, function(jsondata) { if (jsondata.status == 'success'){ $('#rightcontent').data('id',jsondata.data.id); @@ -248,11 +281,11 @@ Contacts={ if(isnew) { // add some default properties Contacts.UI.Card.addProperty('EMAIL'); Contacts.UI.Card.addProperty('TEL'); - Contacts.UI.Card.addProperty('NICKNAME'); - Contacts.UI.Card.addProperty('ORG'); - Contacts.UI.Card.addProperty('CATEGORIES'); + //Contacts.UI.Card.addProperty('NICKNAME'); + //Contacts.UI.Card.addProperty('ORG'); + //Contacts.UI.Card.addProperty('CATEGORIES'); $('#fn').focus(); - $('#fn').select(); + //$('#fn').val(''); } } else{ @@ -463,11 +496,6 @@ Contacts={ } }); }, - editNew:function(){ // add a new contact - this.id = ''; this.fn = ''; this.fullname = ''; this.givname = ''; this.famname = ''; this.addname = ''; this.honpre = ''; this.honsuf = ''; - Contacts.UI.Card.add(t('contacts', 'Contact')+';'+t('contacts', 'New')+';;;', t('contacts', 'New Contact'), '', true); - return false; - }, savePropertyInternal:function(name, fields, oldchecksum, checksum){ // TODO: Add functionality for new fields. //console.log('savePropertyInternal: ' + name + ', fields: ' + fields + 'checksum: ' + checksum); @@ -521,7 +549,7 @@ Contacts={ q = q + '&id=' + this.id + '&name=' + name; if(checksum != undefined && checksum != '') { // save q = q + '&checksum=' + checksum; - console.log('Saving: ' + q); + //console.log('Saving: ' + q); $(obj).attr('disabled', 'disabled'); $.post(OC.filePath('contacts', 'ajax', 'saveproperty.php'),q,function(jsondata){ if(jsondata.status == 'success'){ @@ -539,7 +567,7 @@ Contacts={ } },'json'); } else { // add - console.log('Adding: ' + q); + //console.log('Adding: ' + q); $(obj).attr('disabled', 'disabled'); $.post(OC.filePath('contacts', 'ajax', 'addproperty.php'),q,function(jsondata){ if(jsondata.status == 'success'){ @@ -1404,7 +1432,9 @@ Contacts={ }); }, refreshThumbnail:function(id){ - $('#contacts [data-id="'+id+'"]').find('a').css('background','url('+OC.filePath('contacts', '', 'thumbnail.php')+'?id='+id+'&refresh=1'+Math.random()+') no-repeat'); + var item = $('#contacts [data-id="'+id+'"]').find('a'); + item.html(Contacts.UI.Card.fn); + item.css('background','url('+OC.filePath('contacts', '', 'thumbnail.php')+'?id='+id+'&refresh=1'+Math.random()+') no-repeat'); } } } @@ -1484,33 +1514,6 @@ $(document).ready(function(){ Contacts.UI.Card.saveProperty(this); }); - $('#fn').blur(function(){ - if($('#fn').val() == '') { - OC.dialogs.alert(t('contacts','The name field cannot be empty. Please enter a name for this contact.'), t('contacts','Name is empty'), function() { $('#fn').focus(); }); - $('#fn').focus(); - return false; - } - }); - - // Name has changed. Update it and reorder. - $('#fn').change(function(){ - var name = $('#fn').val(); - var item = $('#contacts [data-id="'+Contacts.UI.Card.id+'"]').clone(); - $('#contacts [data-id="'+Contacts.UI.Card.id+'"]').remove(); - $(item).find('a').html(name); - var added = false; - $('#contacts li').each(function(){ - if ($(this).text().toLowerCase() > name.toLowerCase()) { - $(this).before(item).fadeIn('fast'); - added = true; - return false; - } - }); - if(!added) { - $('#leftcontent ul').append(item); - } - }); - // Profile picture upload handling // New profile picture selected $('#file_upload_start').change(function(){ diff --git a/apps/contacts/lib/vcard.php b/apps/contacts/lib/vcard.php index eb33d223071..c2ab0e07e91 100755 --- a/apps/contacts/lib/vcard.php +++ b/apps/contacts/lib/vcard.php @@ -261,19 +261,20 @@ class OC_Contacts_VCard{ * @param string $uri the uri of the card, default based on the UID * @return insertid on success or null if no card. */ - public static function add($aid, OC_VObject $card, $uri=null){ + public static function add($aid, OC_VObject $card, $uri=null, $isnew=false){ if(is_null($card)){ OCP\Util::writeLog('contacts','OC_Contacts_VCard::add. No vCard supplied', OCP\Util::ERROR); return null; }; - OC_Contacts_App::loadCategoriesFromVCard($card); - - self::updateValuesFromAdd($aid, $card); + if(!$isnew) { + OC_Contacts_App::loadCategoriesFromVCard($card); + self::updateValuesFromAdd($aid, $card); + } $fn = $card->getAsString('FN'); if (empty($fn)) { - $fn = null; + $fn = ''; } if (!$uri) { -- 2.39.5