some groundwork for showing conversations, but no actual data yet.
authorJames Burke <jrburke@mozillamessaging.com>
Thu, 10 Jun 2010 22:10:56 -0700
changeset 1775 19641d6b8ff454124e6865613f25414ef8150f86
parent 1774 e3f8049f4fc9d6078d89ae6157adb92d745d6785
child 1776 4dcc6e9a78f5645a6f43b7ab4d645de36ba3050b
push id978
push userjrburke@gmail.com
push dateFri, 11 Jun 2010 05:10:59 +0000
some groundwork for showing conversations, but no actual data yet.
client/api/contacts.html
--- a/client/api/contacts.html
+++ b/client/api/contacts.html
@@ -71,30 +71,35 @@
 
                 adjustCardSizes();
 
                 //Set the title based on the first card.
                 var title = $('.card')[0].getAttribute('title');
                 $('#headerText').html(title);
 
                 back.click(function (evt) {
+                    var left = parseInt(cards.css('left'), 10) + display.outerWidth();
+
                     cards.css({
-                        left: '0px'
+                        left: left + 'px'
                     });
-                    back.css('display', 'none');
+                    if (!left) {
+                        back.css('display', 'none');
+                    }
                 });
             });
 
             //Detect orientation changes and size the card container size accordingly.
             if ('onorientationchange' in window) {
                 window.addEventListener('orientationchange', adjustCardSizes, false);
             }
             window.addEventListener('resize', adjustCardSizes, false);
 
-            $('body').delegate('a.person', 'click', function (evt) {
+            $('body')
+            .delegate('a.person', 'click', function (evt) {
                 evt.preventDefault();
                 var contact = rdapi.data(evt.target.parentNode.getAttribute('data-blade-jig'));
                 rdapi('_design/raindrop!content!all/_view/identities_by_contact', {
                     data: {
                         startkey: JSON.stringify([contact.id[1]]),
                         endkey: JSON.stringify([contact.id[1], {}])
                     },
                     success: function (json) {
@@ -133,16 +138,22 @@
                                 cards.css({
                                     left: '-' + display.outerWidth() + 'px'
                                 });
                                 back.css('display', 'block');
                             }
                         });
                     }
                 });
+            })
+            .delegate('.contactDetail .identity', 'click', function (evt) {
+
+                cards.css({
+                    left: '-' + (2 * display.outerWidth()) + 'px'
+                });
             });
         });
     </script>
 </head>
 <body>
     <div id="header">
         <div id="back">
             <div class="mblArrowButtonHead"></div>
@@ -154,30 +165,33 @@
 
     <div id="display">
         <div id="cards">
             <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="">
+            <div id="identityDisplay" class="card card2" title="Info">
+            </div>
+            <div id="conversations" class="card card3" title="Conversations">
+                CONVERSATIONS HERE
             </div>
         </div>
     </div>
 
     <div class="template contactDetail" data-id="contactDetail">
         <img class="contactPhoto" src="{getPhotoUrl(_)}"> <span class="name">{displayName}</span>
         <ul>
             {identities [}
                 <li>
                     <ul class="mblRoundRectList">
                         {. type rd_key[1][0]}
                         {. value rd_key[1][1]}
-                        <li class="mblListItem hbox"><span class="idType boxFlex">{type}</span><span class="idValue boxFlex">{value}</span></li>
+                        <li class="mblListItem identity hbox"><span class="idType boxFlex">{type}</span><span class="idValue boxFlex">{value}</span></li>
                     </ul>
                 </li>
             {]}
         </ul>
     </div>
 
 </body>
 </html>