BackboneJS and Netflix ODATA

BackboneJS version

by djohnsonm

HTML

<script src="http://documentcloud.github.com/underscore/underscore-min.js"></script>
<script src="http://documentcloud.github.com/backbone/backbone-min.js"></script>
<head>
     <script type="text/template" id="tweetTemp">
     <tr>
                <th> <%= created_at %></th>
                <th><%= from_user%></th>
                <th><%= text%></th>
                <th><%= profile_image_url %></th>
            </tr>                                        
</script>
    
</head>

<body> 
    <h2>Search for Tweets</h2> 
    
    <button id="searchClick">Search</button>
    <br/><br/>
    <textarea id="queryString" cols="75" rows="6"></textarea>
    <br/><br/>
    <b>Tweets found <label id="tweetCount"/></b>
    <br/><br/>
    
   
    
    <table>
        <thead>
            <tr>
                <th>Created At</th>
                <th>From User</th>
                <th>Text</th>
                <th>Image</th>
            </tr>
        </thead>
        <tbody id="tweets" />
    </table>
</body>

CSS

table th { text-align:left; padding-right: 3em; font-style:italic }body { font-family: Helvetica, Arial }
input:not([type]), input[type=text], input[type=password], select { background-color: #FFFFCC; border: 1px solid gray; padding: 2px; }

JavaScript

//debugger;

var PageData = Backbone.Model.extend({
    defaults: {
        searchString: "",
        queryString: "",
        movieCount: 0
    }
});

var Item = Backbone.Model.extend({
    defaults: {
        created_at : "",
        from_user: "",
        text : "",
        profile_image_url : ""
    }
});

var List = Backbone.Collection.extend({
    model: Item
});

var ItemView = Backbone.View.extend({
    tagName: 'tr',
    initialize: function() {
        _.bindAll(this, 'render');
    },
    render: function() {
        
   //     $(this.el).html('<td>'+this.model.get('created_at')+'</td><td>'+this.model.get('from_user')+'</td><td>'+this.model.get('text')+'</td>' + '<td>' + '<img src="' + this.model.get('profile_image_url') + '" />' + "</td>");
        var created = this.model.get('created_at');
        var fromUser = this.model.get('from_user');
        var text = this.model.get('text');
        var profImg = this.model.get('profile_image_url');
       
var tweetHtml = _.template($('#tweetTemp').html());
          $(tweetHtml ({title: title, description: description})).appendTo($(el))


        return this;
    }
});

var ListView = Backbone.View.extend({
    el: $('body'),
    events: {
        'click button#searchClick': 'searchData'
    },
    initialize: function() {
        _.bindAll(this, 'render', 'searchData', 'callback', 'appendItem');
        
        this.collection = new List();
        this.collection.bind('add', this.appendItem);
        
        this.data = new PageData();
        
        this.render();
    },
    render: function() {
        var self = this;
        
        _(this.collection.models).each(function(item) {
           self.appendItem(item);
        }, this);
    },
    searchData: function() {
        this.data.set({
            searchString: $("#searchString").val()
        });
        
        this.data.set({
            queryString :...