Some work on the conversation title, but not resetting it correctly.
authorJames Burke <jrburke@mozillamessaging.com>
Fri, 11 Jun 2010 22:30:58 -0700
changeset 1777 f021ce6347b633773fb31d320c66197a6d3efaac
parent 1776 4dcc6e9a78f5645a6f43b7ab4d645de36ba3050b
child 1778 f759fb23d8abf31dedec8984894618ae0c8b2c3e
push id980
push userjrburke@gmail.com
push dateSat, 12 Jun 2010 05:31:01 +0000
Some work on the conversation title, but not resetting it correctly.
client/api/contacts.css
client/api/contacts.html
client/api/rdapi.html
--- a/client/api/contacts.css
+++ b/client/api/contacts.css
@@ -174,17 +174,22 @@ ul {
 .contactPhoto {
     width: 60px;
     height: 60px;
     vertical-align: middle;
     margin-right: 10px;
     border: 1px solid #ADAAAD;
 }
 
-.contactDetail .name {
+#header .contactPhoto {
+    width: 30px;
+    height: 30px;
+}
+
+.contactDisplayName {
     font-weight: bold;
 }
 
 .contactDetail .mblListItem {
     width: 100%;
 }
 
 .contactDetail .idType {
@@ -193,16 +198,20 @@ ul {
     color: #0B5199;
     font-size: smaller;
 }
 
 .contactDetail .idValue {
     padding: 0 5px;
 }
 
+#contactConversations {
+    margin: 10px;
+}
+
 .scrollbar {
     position: absolute;
     z-index: 10;
     width: 1px;
     height: 1px;
     border-width: 3px;
     -webkit-border-image: url(i/scrollbar.png) 3;
 }
@@ -225,16 +234,17 @@ ul {
     -webkit-border-radius: 8px;
     -moz-border-radius: 8px;
     background-color: white;
 }
 
 .mblListItem {
     list-style-type: none;
     height: 43px;
+    padding: 0 10px;
     border-bottom: 1px solid #ADAAAD;
     line-height: 43px;
     font-weight: bold;
     position: relative;
     color: black;
 }
 
 .mblListItem.mblVariableHeight {
--- a/client/api/contacts.html
+++ b/client/api/contacts.html
@@ -105,17 +105,16 @@
                     success: function (json) {
                         var idKeys = [];
                         if (json.rows) {
                             json.rows.forEach(function (row) {
                                 idKeys.push(['key-schema_id', [row.value.rd_key, 'rd.identity']]);
                             });
                         }
 
-                        console.log(json);
                         rdapi('_design/raindrop!content!all/_view/megaview?reduce=false&include_docs=true', {
                             data: JSON.stringify({
                                 keys: idKeys
                             }),
                             processData: false,
                             contentTypeString: 'application/json',
                             type: 'POST',
                             success: function (json) {
@@ -139,32 +138,37 @@
                                     left: '-' + display.outerWidth() + 'px'
                                 });
                                 back.css('display', 'block');
                             }
                         });
                     }
                 });
             })
-            .delegate('.contactDetail .conversationButton', 'click', function (evt) {
+            .delegate('.conversationButton', 'click', function (evt) {
                 var contact = rdapi.data($(evt.target).parents('.contactDetail')[0].getAttribute('data-blade-jig'));
                 rdapi('inflow/conversations/contact', {
                     data: {
                         id: JSON.stringify(contact.id),
                         limit: 10,
                         message_limit: 3
                     },
                     contentType: '',
                     templateId: 'conversations',
                     emptyTemplateId: 'conversationsEmpty',
                     containerNode: document.getElementById('contactConversations'),
                     onTemplateDone: function () {
+                        //Move the conversation card into view.
                         cards.css({
                             left: '-' + (2 * display.outerWidth()) + 'px'
                         });
+
+                        setTimeout(function () {
+                            $('#headerText').html(document.getElementById('contactInfo').innerHTML);
+                        }, 300);
                     }
                 });
             });
         });
     </script>
 </head>
 <body>
     <div id="header">
@@ -181,43 +185,47 @@
             <div id="contactsCard" class="card" title="Contacts">
                 <ul id="contactList" class="contacts templateContainer">
                     <li class="template" data-api="inflow/contacts/by_name"><a class="person" href="#{id[1]}">{displayName}</a></li>
                 </ul>
             </div>
             <div id="identityDisplay" class="card card2" title="Info">
             </div>
             <div id="conversations" class="card card3" title="Conversations">
-                <ul id="contactConversations"></ul>
+                <ul id="contactConversations" class="mblRoundRectList"></ul>
             </div>
         </div>
     </div>
 
     <div class="template contactDetail" data-id="contactDetail">
-        <img class="contactPhoto" src="{getPhotoUrl(_)}"> <span class="name">{displayName}</span>
+        <div id="contactInfo">
+            <img class="contactPhoto" src="{getPhotoUrl(_)}"> <span class="contactDisplayName">{displayName}</span>
+        </div>
         <ul>
             {identities [}
                 <li>
                     <ul class="mblRoundRectList">
                         {. type rd_key[1][0]}
                         {. value rd_key[1][1]}
                         <li class="mblListItem identity hbox"><span class="idType boxFlex">{type}</span><span class="idValue boxFlex">{value}</span></li>
                     </ul>
                 </li>
             {]}
         </ul>
         <ul class="mblRoundRectList">
-            <li class="mblListItem conversationButton">Show Recent Conversations</li>
+            <!-- Interesting, for the delegate on this li to work in Mobile Safari,
+                 need to put an onclick on here. -->
+            <li class="mblListItem conversationButton" onclick="return;">Show Recent Conversations</li>
         </ul>
     </div>
 
-    <li class="template conversation" data-id="conversations">
-        {subject}<br>
-        {messages [}
-            {schemas['rd.msg.body'].body_preview}
+    <li class="template conversation mblListItem" data-id="conversations">
+        {subject [} {} {]}
+        {!subject [}
+            {messages[0].schemas['rd.msg.body'].body_preview}
         {]}
     </li>
 
     <li class="template conversation" data-id="conversationsEmpty">
         No conversations for this contact.
     </li>
 </body>
 </html>
--- a/client/api/rdapi.html
+++ b/client/api/rdapi.html
@@ -98,17 +98,17 @@
                             newHighlight.find('.subject').click();
                         }
                     }
                 })
 
                 $('body')
                 .delegate('.convSummary', 'click', function (evt) {
                     var target = $(evt.target),
-                    current = target.parents('[data-blade-jig]').first(),
+                        current = target.parents('[data-blade-jig]').first(),
                         data;
 
                     if (!current.length) {
                         current = target;
                     }
 
                     //If current node is selected then close the conversation
                     if (current.hasClass('highlight')) {