Twitter via JSONP using jQuery and jQuery templates

Trying to replicate the problem in the SO question at http://stackoverflow.com/questions/7681373/why-does-jquery-templates-add-double-quotes-to-some-strings

by Hari Menon

HTML

<script src="http://ajax.aspnetcdn.com/ajax/jquery.templates/beta1/jquery.tmpl.js"></script>
<label for="screenName">Screen Name</label>
<input type="text" id="screenName" />

<input type="submit" value="Get Tweets" id="getTweets" />

<div id="twitterFeeds"></div>

<script id="twitterResultsTemplate" type="text/x-jquery-tmpl">
    <div class="tweetItem">
        <div class="userAvatar"><img src="${user.profile_image_url}" alt="${from_user} Image"/></div>
        <div class="tweetSummary">
            <div class="bd">before ${text} after</div>
            <div>${created_at}</div>
            <div class="ft">${prettyDate($data.created_at)}</div>
        </div>
    </div>
    <br style="clear: both;"/>
</script>

CSS

body{
    font-family: "tahoma"
}
.tweetSummary{
    border:0.1em #999 solid;
    background-color:#ccc;
}

JavaScript

$(document).ready(function() {
    $('#getTweets').click(function() {
        var twitterResultsTemplate = $.template("twitterResultsTemplate", $('#twitterResultsTemplate'));
        $.ajax({
            url: "http://api.twitter.com/1/statuses/user_timeline.json",
            data: {
                screen_name: $('#screenName').val(),
                include_entities: true,
                count: 50
            },
            dataType: "jsonp",
            success: function(tweets, textStatus, jqXHR) {
                $.tmpl("twitterResultsTemplate", tweets).appendTo($('#twitterFeeds').empty())
            },
            error: function(jqXHR, textStatus, errorThrown) {
                alert('ERROR:' + textStatus)
                $.tmpl("twitterResultsTemplate", tweets).appendTo($('#twitterFeeds'))
            }
        });
    });

});


/*
 * JavaScript Pretty Date
 * Copyright (c) 2008 John Resig (jquery.com)
 * Licensed under the MIT license.
 */

// Takes an ISO time and returns a string representing how
// long ago the date represents.
function prettyDate(time){
    var date = new Date((time || "").replace(/-/g,"/").replace(/[TZ]/g," ")),
        diff = (((new Date()).getTime() - date.getTime()) / 1000),
        day_diff = Math.floor(diff / 86400);
            
    if ( isNaN(day_diff) || day_diff < 0 || day_diff >= 31 )
        return;
            
    return day_diff == 0 && (
            diff < 60 && "just now" ||
            diff < 120 && "1 minute ago" ||
            diff < 3600 && Math.floor( diff / 60 ) + " minutes ago" ||
            diff < 7200 && "1 hour ago" ||
            diff < 86400 && Math.floor( diff / 3600 ) + " hours ago") ||
        day_diff == 1 && "Yesterday" ||
        day_diff < 7 && day_diff + " days ago" ||
        day_diff < 31 && Math.ceil( day_diff / 7 ) + " weeks ago";
}

// If jQuery is included in the page, adds a jQuery plugin to handle it as well
if ( typeof jQuery != "undefined" )
    jQuery.fn.prettyDate = function(){
   ...