Build HTML for a tweet on Twitter.com from JSON payload

snippet.js

// *** JSON to HTML markup for a single update *** //

var buildUpdateFromJSON = (function() {
  var updateContainer = $E('ol', { 'class': 'statuses' })
  
  return function(data) {
    var isReply = data.in_reply_to_screen_name,
      date = new Date(data.created_at),
      preparedData = {
        id: data.id, reply_class: isReply ? 'reply' : '',
        username: data.user.screen_name, avatar: data.user.profile_image_url, real_name: data.user.name,
        created_at: date.toString(), created_ago: relativeTime(date) + ' ago',
        text: twitterLinkify(data.text), source: data.source,
        in_reply_to: data.in_reply_to_screen_name, in_reply_to_status: data.in_reply_to_status_id,
        fav_action: data.favorited ? 'un-favorite' : 'favorite',
        fav_class: data.favorited ? 'fav' : 'non-fav',
      }

    var updateHTML = ["<li id='status_#{id}' class='hentry status #{reply_class} u-#{username}'>\
      <span class='thumb vcard author'><a class='url' href='/#{username}'>\
        <img width='48' height='48' src='#{avatar}' class='photo fn' alt='#{real_name}'/>\
      </a></span>\
      <span class='status-body'>"]
    if (data.user.protected) updateHTML.push("<img title='#{real_name}’s updates are protected— please don’t share!'\
      src='http://assets2.twitter.com/images/icon_lock.gif' class='lock' alt='Icon_lock'/> ")
    updateHTML.push("<strong><a title='#{real_name}' href='/#{username}'>#{username}</a></strong>\
      <span class='entry-content'>#{text}</span>\
      <span class='meta entry-meta'>\
        <a rel='bookmark' class='entry-date' href='/#{username}/status/#{id}'>\
          <span title='#{created_at}' class='published'>#{created_ago}</span>\
        </a>\
        <span>from #{source}</span>")
    if (data.in_reply_to_status_id) updateHTML.push(
      " <a href='/#{in_reply_to}/status/#{in_reply_to_status}'>in reply to #{in_reply_to}</a>")
    updateHTML.push("</span>\
      </span>\
      <span class='actions'><div>\
        <a title='#{fav_action} this update' id='status_star_#{id}' class='fav-action #{fav_class}'>&nbsp;&nbsp;</a>")
    if (preparedData.username == currentUser) updateHTML.push("<a title='delete this update' class='del'>&nbsp;&nbsp;</a>")
    else updateHTML.push("<a title='reply to #{username}' class='repl'\
      href='/home?status=@#{username}%20&amp;in_reply_to_status_id=#{id}&amp;in_reply_to=#{username}'>&nbsp;&nbsp;</a>")
    updateHTML.push("</div></span></li>")

    updateContainer.innerHTML = updateHTML.join('').replace(/#\{(\w+)\}/g, function(_, key) {
      return preparedData[key]
    })
    return updateContainer.firstChild
  }
})()