Contacts: Fix layout in contacts list that I had broken in an earlier fix :-P

diff --git a/apps/contacts/css/contacts.css b/apps/contacts/css/contacts.css
index 2553b43a8734de6f441b0d487dd70c62285a432a..79274c2dd95c27ed1d6ce34b5d7fc0615ddc35d3 100644 (file)
--- a/apps/contacts/css/contacts.css
+++ b/apps/contacts/css/contacts.css
@@ -4,8 +4,7 @@
 #leftcontent { top: 3.5em !important; padding: 0; margin: 0; }
 #rightcontent { top: 3.5em !important; padding-top: 5px; }
 #contacts { background: #fff; width: 20em; left: 12.5em; top: 3.7em; bottom:3em; position: fixed; overflow: auto; padding: 0; margin: 0; }
-#contacts li { height: 28px; display: block; margin: 0 0 0 5px; padding: 0 0 0 25px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; -webkit-transition:background-color 200ms; -moz-transition:background-color 200ms; -o-transition:background-color 200ms; transition:background-color 200ms; }
-#contacts li:hover { background-color: #eee }
+#contacts a { height: 23px; display: block; margin: 0 0 0 0; padding: 0 0 0 25px; }
 #bottomcontrols { padding: 0; bottom:0px; height:2.8em; width: 20em; margin:0; background:#eee; border-top:1px solid #ccc; position:fixed; -moz-box-shadow: 0 -3px 3px -3px #000; -webkit-box-shadow: 0 -3px 3px -3px #000; box-shadow: 0 -3px 3px -3px #000;}
 #contacts_newcontact { float: left; margin: 0.2em 0 0 1em; }
 #chooseaddressbook { float: right; margin: 0.2em 1em 0 0; }

diff --git a/apps/contacts/js/contacts.js b/apps/contacts/js/contacts.js
index 44f1c220f9105cee09457799bdd1f0982c1f1cd3..a74258199c5c9e8ea2152072379b18f9ff2ddb9b 100644 (file)
--- a/apps/contacts/js/contacts.js
+++ b/apps/contacts/js/contacts.js
@@ -160,9 +160,8 @@ Contacts={
                        // 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).html(name);
+                               var item = $('#contacts [data-id="'+Contacts.UI.Card.id+'"]');
+                               $(item).find('a').html(name);
                                var added = false;
                                $('#contacts li').each(function(){
                                        if ($(this).text().toLowerCase() > name.toLowerCase()) {
@@ -302,7 +301,7 @@ Contacts={
                                                                if(jsondata.status == 'success'){
                                                                        Contacts.UI.Card.loadContact(jsondata.data);
                                                                        $('#leftcontent .active').removeClass('active');
-                                                                       var item = $('<li role="botton" data-id="'+jsondata.data.id+'" class="active" style="background: url('+OC.filePath('contacts', '', 'thumbnail.php')+'?id='+jsondata.data.id+') no-repeat scroll 0% 0% transparent;">'+Contacts.UI.Card.fn+'</li>');
+                                                                       var item = $('<li data-id="'+jsondata.data.id+'" class="active"><a href="index.php?id='+jsondata.data.id+'" style="background: url('+OC.filePath('contacts', '', 'thumbnail.php')+'?id='+jsondata.data.id+') no-repeat scroll 0% 0% transparent;">'+Contacts.UI.Card.fn+'</a></li>');
                                                                        var added = false;
                                                                        $('#leftcontent ul li').each(function(){
                                                                                if ($(this).text().toLowerCase() > Contacts.UI.Card.fn.toLowerCase()) {
@@ -625,7 +624,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'){
@@ -643,7 +642,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'){
@@ -1498,8 +1497,8 @@ Contacts={
                                        $('#contacts li').unbind('inview');
                                        $('#contacts li').bind('inview', function(event, isInView, visiblePartX, visiblePartY) {
                                                if (isInView) {
-                                                       if (!$(this).attr('style')) {
-                                                               $(this).css('background','url('+OC.filePath('contacts', '', 'thumbnail.php')+'?id='+$(this).data('id')+') no-repeat');
+                                                       if (!$(this).find('a').attr('style')) {
+                                                               $(this).find('a').css('background','url('+OC.filePath('contacts', '', 'thumbnail.php')+'?id='+$(this).data('id')+') no-repeat');
                                                        }
                                                }
                                        })}, 500);
@@ -1508,19 +1507,19 @@ Contacts={
                        // Add thumbnails to the contact list as they become visible in the viewport.
                        lazyupdate:function(){
                                $('#contacts li').live('inview', function(){
-                                       if (!$(this).attr('style')) {
-                                               $(this).css('background','url('+OC.filePath('contacts', '', 'thumbnail.php')+'?id='+$(this).data('id')+') no-repeat');
+                                       if (!$(this).find('a').attr('style')) {
+                                               $(this).find('a').css('background','url('+OC.filePath('contacts', '', 'thumbnail.php')+'?id='+$(this).data('id')+') no-repeat');
                                        }
                                });
                        },
                        refreshThumbnail:function(id){
-                               var item = $('#contacts [data-id="'+id+'"]');
+                               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');
                        },
                        scrollTo:function(id){
                                $('#contacts').animate({
-                                       scrollTop: $('#leftcontent li[data-id="'+id+'"]').offset().top}, 'slow','swing');
+                                       scrollTop: $('#leftcontent li[data-id="'+id+'"]').offset().top-20}, 'slow','swing');
                        }
                }
        }
@@ -1548,9 +1547,10 @@ $(document).ready(function(){
        });
        $('#contacts').click(function(event){
                var $tgt = $(event.target);
-               if ($tgt.is('li')) {
-                       var id = $($tgt).data('id');
-                       $($tgt).addClass('active');
+               if ($tgt.is('li') || $tgt.is('a')) {
+                       var item = $tgt.is('li')?$($tgt):($tgt).parent();
+                       var id = item.data('id');
+                       item.addClass('active');
                        var oldid = $('#rightcontent').data('id');
                        if(oldid != 0){
                                $('#contacts li[data-id="'+oldid+'"]').removeClass('active');
@@ -1576,9 +1576,9 @@ $(document).ready(function(){
                                // bottom part of element is visible
                        } else {
                                // whole part of element is visible
-                               if (!$(this).attr('style')) {
+                               if (!$(this).find('a').attr('style')) {
                                        //alert($(this).data('id') + ' has background: ' + $(this).attr('style'));
-                                       $(this).css('background','url('+OC.filePath('contacts', '', 'thumbnail.php')+'?id='+$(this).data('id')+') no-repeat');
+                                       $(this).find('a').css('background','url('+OC.filePath('contacts', '', 'thumbnail.php')+'?id='+$(this).data('id')+') no-repeat');
                                }/* else {
                                        alert($(this).data('id') + ' has style ' + $(this).attr('style').match('url'));
                                }*/

diff --git a/apps/contacts/templates/part.contacts.php b/apps/contacts/templates/part.contacts.php
index 225a1ef0cf35f86a375b032d6ec5d61041d14fc0..00a61f72fdd9ce578db6146e9db3e8d58cc4b794 100644 (file)
--- a/apps/contacts/templates/part.contacts.php
+++ b/apps/contacts/templates/part.contacts.php
@@ -8,5 +8,5 @@
                }
        }
 ?>
-       <li role="button" book-id="<?php echo $contact['addressbookid']; ?>" data-id="<?php echo $contact['id']; ?>"><?php echo $display; ?></li>
+       <li role="button" book-id="<?php echo $contact['addressbookid']; ?>" data-id="<?php echo $contact['id']; ?>"><a href="index.php?id=<?php echo $contact['id']; ?>"><?php echo $display; ?></a></li>
 <?php endforeach; ?>