GNUsocial/gnu-social
4
0
Fork 1
Code Issues Releases Wiki Activity

JS optimization: move creation of inline reply placeholders to server-side so we don't have to create them client-side (which causes reflows and takes about 25-30ms on my test system)

Browse Source 
Using live instead of bind for the event handling, we don't have to play any games on the ones that we do add at runtime. Yay!
This commit is contained in:
Brion Vibber 2011-03-11 15:20:20 -08:00
parent 10e5cb482e
commit 2bccd18d9a
2 changed files with 56 additions and 30 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

17
js/util.js
View File

@ -627,25 +627,22 @@ var SN = { // StatusNet
'<input class="placeholder">' + '<input class="placeholder">' +
'</li>'); '</li>');
placeholder.find('input') placeholder.find('input')
.val(SN.msg('reply_placeholder')) .val(SN.msg('reply_placeholder'));
.focus(function() {
SN.U.NoticeInlineReplyTrigger(notice);
return false;
});
list.append(placeholder); list.append(placeholder);
}, },
/** /**
* Setup function -- DOES NOT apply immediately. * Setup function -- DOES NOT apply immediately.
* *
* Sets up event handlers for favor/disfavor forms to submit via XHR. * Sets up event handlers for inline reply mini-form placeholders.
* Uses 'live' rather than 'bind', so applies to future as well as present items. * Uses 'live' rather than 'bind', so applies to future as well as present items.
*/ */
NoticeInlineReplySetup: function() { NoticeInlineReplySetup: function() {
$('.threaded-replies').each(function() { $('li.notice-reply-placeholder input')
var list = $(this); .live('focus', function() {
var notice = list.closest('.notice'); var notice = $(this).closest('li.notice');
SN.U.NoticeInlineReplyPlaceholder(notice); SN.U.NoticeInlineReplyTrigger(notice);
return false;
}); });
}, },

67
lib/threadednoticelist.php
View File

@ -191,6 +191,12 @@ class ThreadedNoticeListItem extends NoticeListItem
$item = new ThreadedNoticeListSubItem($notice, $this->out); $item = new ThreadedNoticeListSubItem($notice, $this->out);
$item->show(); $item->show();
} }
// @fixme do a proper can-post check that's consistent
// with the JS side
if (common_current_user()) {
$item = new ThreadedNoticeListReplyItem($notice, $this->out);
$item->show();
}
$this->out->elementEnd('ul'); $this->out->elementEnd('ul');
} }
} }
@ -253,11 +259,8 @@ class ThreadedNoticeListMoreItem extends NoticeListItem
function showStart() function showStart()
{ {
if (Event::handle('StartOpenNoticeListItemElement', array($this))) {
$id = (empty($this->repeat)) ? $this->notice->id : $this->repeat->id;
$this->out->elementStart('li', array('class' => 'notice-reply-comments')); $this->out->elementStart('li', array('class' => 'notice-reply-comments'));
} }
}
function showMiniForm() function showMiniForm()
{ {
@ -270,21 +273,47 @@ class ThreadedNoticeListMoreItem extends NoticeListItem
$msg = sprintf(_m('Show %d reply', 'Show all %d replies', $n), $n); $msg = sprintf(_m('Show %d reply', 'Show all %d replies', $n), $n);
$this->out->element('a', array('href' => $url), $msg); $this->out->element('a', array('href' => $url), $msg);
}
// @fixme replace this with an ajax-friendly form pair? }
/*
$this->out->elementStart('form',
array('id' => $id, /**
'class' => 'replyform', * Placeholder for reply form...
'method' => 'post', * Same as get added at runtime via SN.U.NoticeInlineReplyPlaceholder
'action' => $url)); */
$this->out->hidden('token', common_session_token()); class ThreadedNoticeListReplyItem extends NoticeListItem
$this->out->hidden("$id-inreplyto", $replyToId, "inreplyto"); {
$this->out->element('textarea', array('name' => 'status_textarea'));
$this->out->elementStart('div', array('class' => 'controls')); /**
$this->out->submit("$id-submit", _m('Send reply')); * recipe function for displaying a single notice.
$this->out->elementEnd('div'); *
$this->out->elementEnd('form'); * This uses all the other methods to correctly display a notice. Override
*/ * it or one of the others to fine-tune the output.
*
* @return void
*/
function show()
{
$this->showStart();
$this->showMiniForm();
$this->showEnd();
}
/**
* start a single notice.
*
* @return void
*/
function showStart()
{
$this->out->elementStart('li', array('class' => 'notice-reply-placeholder'));
}
function showMiniForm()
{
$this->out->element('input', array('class' => 'placeholder',
'value' => _('Write a reply...')));
} }
} }