--- 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">