update the sidebar by long polling

Needs to use a different NotificationBroadcaster, and not replace the
whole sidebar div, but instead add in new content. However, it's 3:30 am.
This commit is contained in:
Joey Hess 2012-07-29 03:23:17 -04:00
parent e96107caf3
commit 62dac85880
5 changed files with 120 additions and 90 deletions

View file

@ -9,7 +9,7 @@
numerrs=0;
$.LongPoll = (function() {
$.LongPoll#{ident} = (function() {
return {
send : function() {
$.ajax({
@ -17,7 +17,7 @@ $.LongPoll = (function() {
'dataType': 'html',
'success': function(data, status, jqxhr) {
$('##{ident}').replaceWith(data);
setTimeout($.LongPoll.send, #{show delay});
setTimeout($.LongPoll#{ident}.send, #{show delay});
numerrs=0;
},
'error': function(jqxhr, msg, e) {
@ -26,7 +26,7 @@ $.LongPoll = (function() {
window.close();
}
else {
setTimeout($.LongPoll.send, #{show delay});
setTimeout($.LongPoll#{ident}.send, #{show delay});
}
},
});
@ -35,7 +35,7 @@ $.LongPoll = (function() {
}());
$(document).bind('ready.app', function() {
setTimeout($.LongPoll.send, #{show startdelay});
setTimeout($.LongPoll#{ident}.send, #{show startdelay});
});
})( jQuery );

View file

@ -20,23 +20,4 @@
<div .container-fluid>
<div .row-fluid>
<div .span3>
<div .sidebar-nav>
<div .alert .alert-info>
<a .close data-dismiss="alert" href="#">&times;</a>
<b>This is just a demo.</b> If this were not just a demo,
I'd not be filling this sidebar with silly alerts.
<div .alert .alert-success>
<a .close data-dismiss="alert" href="#">&times;</a>
<b>Well done!</b>
You successfully read this important alert message.
<div .alert .alert-error>
<a .close data-dismiss="alert" href="#">&times;</a>
<b>Whoops!</b>
Unable to connect to blah blah..
<div .span9>
$maybe msg <- mmsg
<div .alert .alert-info>
<a .close data-dismiss="alert" href="#">&times;</a>
#{msg}
^{widget}
^{content}

18
templates/sidebar.hamlet Normal file
View file

@ -0,0 +1,18 @@
<div .span3 ##{ident}>
<div .sidebar-nav>
$maybe msg <- mmsg
<div .alert .alert-info>
<a .close data-dismiss="alert" href="#">&times;</a>
#{msg}
<div .alert .alert-info>
<a .close data-dismiss="alert" href="#">&times;</a>
<b>This is just a demo.</b> If this were not just a demo,
I'd not be filling this sidebar with silly alerts.
<div .alert .alert-success>
<a .close data-dismiss="alert" href="#">&times;</a>
<b>Well done!</b>
You successfully read this important alert message.
<div .alert .alert-error>
<a .close data-dismiss="alert" href="#">&times;</a>
<b>Whoops!</b>
Unable to connect to blah blah.. #{date}

View file

@ -1,30 +1,29 @@
<span ##{ident}>
<div .span9>
$if null transfers
<h2>No current transfers
$else
<h2>Transfers
$forall (transfer, info) <- transfers
$with percent <- maybe "unknown" (showPercentage 0) $ percentComplete transfer info
<div .row-fluid>
<h3>
$maybe file <- associatedFile info
#{file}
$nothing
#{show $ transferKey transfer}
$case transferDirection transfer
$of Upload
&rarr;
$of Download
&larr;
<small>#{maybe "unknown" Remote.name $ transferRemote info}</small>
$with size <- maybe "unknown" (roughSize dataUnits True) $ keySize $ transferKey transfer
$if isJust $ startedTime info
<small .pull-right><b>#{percent} of #{size}</b></small>
$else
<small .pull-right>queued (#{size})</small>
<div .progress .progress-striped>
<div .bar style="width: #{percent};">
<div .span9 ##{ident}>
$if null transfers
<h2>No current transfers
$else
<h2>Transfers
$forall (transfer, info) <- transfers
$with percent <- maybe "unknown" (showPercentage 0) $ percentComplete transfer info
<div .row-fluid>
<h3>
$maybe file <- associatedFile info
#{file}
$nothing
#{show $ transferKey transfer}
$case transferDirection transfer
$of Upload
&rarr;
$of Download
&larr;
<small>#{maybe "unknown" Remote.name $ transferRemote info}</small>
$with size <- maybe "unknown" (roughSize dataUnits True) $ keySize $ transferKey transfer
$if isJust $ startedTime info
<small .pull-right><b>#{percent} of #{size}</b></small>
$else
<small .pull-right>queued (#{size})</small>
<div .progress .progress-striped>
<div .bar style="width: #{percent};">
$if warnNoScript
<noscript>
<div .navbar .navbar-fixed-bottom>