Changes wanted by Andy to make full summary clickable and to also toggle the full conversation display
authorJames Burke <jrburke@mozillamessaging.com>
Wed, 09 Jun 2010 12:58:59 -0700
changeset 1772 b4e9653b132c15aa0ccd3d1e01ba867ae623b888
parent 1771 71d667333774e6a08558eff9e5615df9721210cb
child 1773 8514627ef0f2391560fb09081eb460b51109f638
push id975
push userjrburke@gmail.com
push dateWed, 09 Jun 2010 19:59:04 +0000
Changes wanted by Andy to make full summary clickable and to also toggle the full conversation display
client/api/rdapi.html
--- a/client/api/rdapi.html
+++ b/client/api/rdapi.html
@@ -27,17 +27,17 @@
     <title>Raindrop API jQuery Plugin Test Page</title>
     <meta http-equiv="Content-Type" content="text/html;charset=utf-8">
     <link type="text/css" rel="stylesheet" href="rdapi.css">
 
     <script src="scripts/requireplugins-jquery-1.4.2.js" charset="utf-8"></script>
     <script>
         require(["jquery", "rdapi", "json2"], function ($, rdapi) {
             $(function () {
-                var parent, scrollY, targetTop,
+                var highlighted, scrollY, targetTop,
                     inflow = $('.inflow'),
                     widgets = $('.widgets'),
                     convDisplay = $('#convDisplay'),
                     top = inflow[0].getBoundingClientRect().top,
                     inflowPaddingTop = parseInt(window.getComputedStyle(inflow[0], null).paddingTop, 10),
                     showingConversation = false;
 
                 $('html').live('keyup', function (evt) {
@@ -96,76 +96,87 @@
                             }
                         } else {
                             newHighlight.find('.subject').click();
                         }
                     }
                 })
 
                 $('body')
-                .delegate('.list.subject', 'click', function (evt) {
+                .delegate('.convSummary', 'click', function (evt) {
+                    var target = $(evt.target),
+                    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')) {
+                        $('.fullConvClose').click();
+                        return;
+                    }
+
                     //Clean up old selection
-                    if (parent) {
-                        parent.removeClass('highlight');
-                        parent.addClass('read');
+                    if (highlighted) {
+                        highlighted.removeClass('highlight');
+                        highlighted.addClass('read');
                     }
 
                     //Get data for current selected conversation, highlight it.
-                    parent = $(evt.target).parents('[data-blade-jig]').first();
-                    parent.addClass('highlight');
+                    highlighted = current;
+                    highlighted.addClass('highlight');
+
+                    //Hide widgets area and fix the conversations.
+                    widgets.addClass('hidden');
+                    convDisplay.addClass('visible');
+                    convDisplay.html('');
 
                     //Load the conversation data
-                    var data = rdapi.data(parent.attr('data-blade-jig'));
+                    data = rdapi.data(highlighted.attr('data-blade-jig'));
                     rdapi('inflow/conversations/by_id?key=' + encodeURIComponent(JSON.stringify(data.id)) + '&schemas=%5B%22*%22%5D', {
                         templateId: 'fullConversation',
                         containerNode: document.getElementById('convDisplay'),
                         onTemplateDone: function () {
                             showingConversation = true;
                         }
                     });
 
-                    //Hide widgets area and fix the conversations.
-                    widgets.addClass('hidden');
-                    convDisplay.html('');
-
                     //Remove the fixed stuff so we can get an accurate position.
                     inflow.removeClass('fixed').css({
                         top: '0px'
                     });
                     window.scrollTo(0, 0);
 
                     //Find the top of the conversation box
-                    targetTop = parent[0].getBoundingClientRect().top;
+                    targetTop = highlighted[0].getBoundingClientRect().top;
 
                     inflow.addClass('fixed').css({
                         top: ((2*top) + inflowPaddingTop - targetTop) + 'px'
                     })
                     evt.preventDefault();
                 })
                 .delegate('.fullConvClose', 'click', function (evt) {
                     convDisplay.html('');
                     showingConversation = false;
                     widgets.removeClass('hidden');
                     inflow.removeClass('fixed');
                     window.scrollTo(window.scrollX, targetTop - inflowPaddingTop - top);
-                    parent.removeClass('highlight');
-                    parent.addClass('read');
-                    parent = null;
+                    highlighted.removeClass('highlight');
+                    highlighted.addClass('read');
+                    highlighted = null;
                     evt.preventDefault();
                     //Andys clueless js
                     convDisplay.removeClass('visible');
                 })
                 .delegate('#convDisplay .row', 'click', function (evt) {
                     convDisplay.find('.highlight').removeClass('highlight');
                     $(evt.target).addClass('highlight');
-                })
-                //Andys clueless js
-                .delegate('.list.subject', 'click', function (evt) {
-                    convDisplay.addClass('visible');            
-                })      
+                });
 
                 $('#convDisplay').delegate('.quoteToggle', 'click', function (evt) {
                     var target = $(evt.target),
                         content = target.next('.quote');
 
                     if (content.hasClass('expanded')) {
                         content.removeClass('expanded');
                         target.html('Show Quote');
@@ -195,17 +206,17 @@
       </div>
       <div class="c3 logo">
 
       </div>
     </div>
   </div>
 
   <div class="inflow templateContainer">
-    <div class="row template" data-api="inflow/conversations/personal">
+    <div class="row template convSummary" data-api="inflow/conversations/personal">
       {. first messages[0].schemas['rd.msg.body']}
       {. from rdapi.identity(first.from)}
       <div class="c3">
         <span class="date">{first.timestamp} - via email</span>
 
         <span class="actions">hide delete</span>
       </div>
       <div class="c1">