Permalink
Browse files

single tweet page: fix dynamic "in reply to" and inline reply form

Also dynamically load the whole conversation on single tweet page
  • Loading branch information...
1 parent ee54ffd commit ef99572ea6e14f1d058c48d398799aa8daf4bb66 @mislav committed Oct 31, 2009
View
@@ -104,6 +104,9 @@ class Gm < Thor
target ||= StringIO.new
render_js_with_partials(file, target)
target.string if StringIO === target
+ when 'gif', 'png', 'jpg'
+ encoded = [file.read].pack('m').gsub(/\s+/, '')
+ javascript_string('data:image/%s;base64,%s' % [file.extension, encoded])
else
raise "don't know how to handle .#{file.extension}"
end
@@ -18,6 +18,8 @@ function livequeryRun() {
jQuery.livequery && jQuery.livequery.run()
}
+var spinnerData = //= load_indicator.gif
+
var $et = {
getTimeline: function() { return(this.timeline = $('timeline')) },
getPage: function() { return(this.page = document.body.id) },
@@ -35,6 +37,11 @@ var $et = {
getSessionCookie: function() {
return (document.cookie.toString().match(/_twitter_sess=[^\s;]+/) || [])[0]
+ },
+ createLoadIndicator: function(element) {
+ var img = $E('img', {src: spinnerData, 'class': 'load-indicator'})
+ if (element) insertAfter(img, $(element))
+ return img
}
}
@@ -175,35 +182,49 @@ if (content) {
// catch click to "in reply to ..." links
content.addEventListener('click', function(e) {
var link = up(e.target, 'a', this)
- if (link && /^\s*in reply to /.test(link.textContent)) {
- var statusID = link.href.match(/(\d+)$/)[1],
- statusUrl = '/statuses/show/' + statusID + '.json',
- fallback = function(xhr) { window.location = link.href }
-
- twttr.loading()
- loadJSON(statusUrl, function(response, xhr) {
- if (xhr.status >= 400) { fallback(xhr); return }
- onAvatarLoad(response, function() {
- var update = buildUpdateFromJSON(response),
- currentStatus = up(link, '.status', content)
-
- if (currentStatus) {
- // we're in a list of statuses
- insertAfter(update, currentStatus)
- } else {
- // we're on a fresh single tweet page
- insertAfter(update.parentNode, $('permalink'))
- }
- reveal(update)
- twttr.loaded()
- livequeryRun()
- $et.trackEvent('timeline', 'in_reply_to', 'loaded status ' + statusID)
- })
- }, { onerror: fallback })
+ if (link && /^\s*in reply to\b/.test(link.textContent)) {
+ loadInReplyTo(link, 'show' == $et.page)
e.preventDefault()
}
}, false)
+ function loadInReplyTo(link, recursive) {
+ var statusID = link.href.match(/(\d+)$/)[1],
+ statusUrl = '/statuses/show/' + statusID + '.json',
+ fallback = function(xhr) { window.location = link.href }
+
+ if ($('status_' + statusID)) return false
+
+ var indicator = $et.createLoadIndicator(link)
+
+ loadJSON(statusUrl, function(response, xhr) {
+ if (xhr.status >= 400) { fallback(xhr); return }
+ onAvatarLoad(response, function() {
+ var update = buildUpdateFromJSON(response)
+
+ if (up(link, '.statuses', content)) {
+ // we're in a list of statuses
+ insertAfter(update, up(link, '.status', content))
+ } else {
+ // we're on a single tweet page, so create a timeline list
+ insertAfter(update.parentNode, $('permalink'))
+ }
+ reveal(update)
+ $et.trackEvent('timeline', 'in_reply_to', 'loaded status ' + statusID)
+
+ var nextInReplyLink = find(update, './/a[@href][starts-with(text(), "in reply to ")]')
+ if (recursive && nextInReplyLink) {
+ loadInReplyTo(nextInReplyLink, recursive)
+ } else {
+ livequeryRun()
+ }
+ removeChild(indicator)
+ })
+ }, { onerror: fallback })
+
+ return true
+ }
+
// catch TAB keypresses in the update form
content.addEventListener('keydown', function(e) {
var textarea = null
@@ -38,6 +38,11 @@ a.googlemap
input[type=checkbox]
:vertical-align top
+img.load-indicator
+ :display inline-block
+ :margin -3px 0 -3px 5px
+ :vertical-align middle
+
body#show
.user-info
:border-top-color white
@@ -48,8 +53,6 @@ body#show
:padding-bottom 0
.screen-name
:font-size inherit
- .actions a
- :padding 3px 8px
#content ol.statuses
.entry-content
@@ -1,4 +1,4 @@
-var replyLink = find('content', '.actions .reply')
+var replyLink = find('content', '.status .reply a')
if (replyLink) {
var actions = replyLink.parentNode
actions.style.top = actions.offsetTop + 'px'
@@ -8,7 +8,7 @@ if (replyLink) {
container.innerHTML = //= update_form.haml
var username = selectString('meta[@name="page-user-screen_name"]/@content'),
- replyForm = $('permalink').parentNode.appendChild(container.firstChild),
+ replyForm = insertAfter(container.firstChild, $('permalink')),
label = find(replyForm, 'label.doing'),
textInput = $('status'),
counter = $('status-field-char-counter'),
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.

0 comments on commit ef99572

Please sign in to comment.