gistfile1.txt

var TRACKER;
        $(function() {

            Eddy.UI.Vote = function() {
                Eddy.UI.View.apply(this, arguments);
            };
            _.extend(Eddy.UI.Vote.prototype, Eddy.UI.View.prototype, {
                mode: "recent",
                updated: false,

                attach: function(selector) {
                    Eddy.UI.View.prototype.attach.call(this, selector);
                    this.tracker.filters.bind("update", this.update, this);
                    this.d3 = d3.select(selector);
                    this.list = this.d3.append("ul");
                },
                detach: function() {
                    this.list.remove();
                    this.list = null;
                    this.d3 = null;
                    this.tracker.filters.unbind("update", this.update);
                    Eddy.UI.View.prototype.detach.call(this);
                },
                update: function(updates) {
                    var filters = this.tracker.filters.models.map(function(filter) {
                        var filter = filter.toJSON();
                        console.log("filter:", filter);
                        filter.votes_last_minute = filter.history[filter.history.length - 1];
                        filter.votes_previous_minute = filter.votes - filter.votes_last_minute;
                        return filter;
                    }).sort(function(a,b){
                        var diff = b.votes - a.votes;
                        return (diff == 0) ? d3.ascending(a.meta.character, b.meta.character) : diff;
                    });

                    var items = this.list.selectAll(".vote")
                        .data(filters, function(f) { return f.id; });

                    var width = $("#view ul").width()/5,
                        body = $("body"),
                        mobile = body.hasClass("iphone"),
                        ie = body.hasClass("ie"),
                        ie8 = body.hasClass("ie8") || body.hasClass("ie7");


                    var vote = items.enter()
                        .append("li").attr("class","vote")
                        .style("width",(mobile) ? "100%" : width-10 + "px")
                        .style("left",function(d,i){ return (mobile) ? "auto" : i*width + "px"; })
                        .style("top",function(d,i){ return (mobile) ? 160*i + "px" : "auto"; });
                    var enter = vote.append("a").attr("target","_blank");
                    enter.append("div").attr("class","img").each(function(d){
                        $(this).css("background-image", (mobile) ? "url(images/" + d.id + "_mobile.jpg)" : "url(images/" + d.id + ".jpg)")
                    });
                        // .style("background-image",function(d){ 
                        //     return (mobile) ? "url(images/" + d.id + "_mobile.jpg)" : "url(images/" + d.id + ".jpg)";
                        // });
                    var box = enter.append("div").attr("class","text-box");

                    var tweet = box.append("span").attr("class","hashtag");
                    tweet.append("i");
                    tweet.append("span").text(function(d){ return "Tweet " + d.meta.hashtag; });

                    var title = box.append("div").attr("class","title");
                    title.append("h2").attr("class","character").text(function(d){ return d.meta.character; });
                    title.append("h2").attr("class","movie").text(function(d){ return d.meta.movie; });
                    box.append("span").attr("class","rank").text(function(d,i){ return (mobile) ? "#" + (i+1) : i+1; });

                    var total = box.append("div").attr("class","total");
                    // start at zero
                    total.append("p").attr("class","total-num").text(0);
                    total.append("p").attr("class","total-text").text("total tweets");


                    if (ie8) {
                        $(".img").slideDown();
                    } else {
                        enter.select(".img")
                            .transition().duration(1000).delay(function(d,i){ return 1200 - i*300; }).ease("elastic")
                            .style("top","0%");
                    }

                    var href = "http://twitter.com/intent/tweet";
                    enter.each(function(d){
                        this.href = $.param.querystring(href, {
                            text: "I " + d.meta.hashtag + " for the 2012 MTV #MovieAwards Best Hero! See who's in the lead and tweet your vote:",
                            url: "http://at.mtv.com/dBe"
                            // via: "MTV_MovieAwards"
                        });
                    });

                    if (ie) {
                        setTimeout(function(){
                            $(".text-box").fadeIn();
                        },1650);
                    } else {
                        enter.select(".text-box")
                            .transition().duration(250).delay(1650)
                            .style("opacity","1");
                    }

                    items.transition().duration(500)
                        .style("left",function(d,i){ return (mobile) ? "auto" : i*width + "px"; })
                        .style("top",function(d,i){ return (mobile) ? 160*i + "px" : "auto"; });

                    items.select(".rank").text(function(d,i){ return (mobile) ? "#" + (i+1) : i+1; });

                    var updated = this.updated;

                    // the first time, transition numbers from zero to the
                    // previous minute's count
                    if (!updated) {
                        items.select(".total-num")
                            // .text(function(d){ return commify(d.votes); })
                            .transition()
                            .duration(5000)
                            .ease("poly-in-out", 5)
                            .tween("text", function(d) {
                                return interpolateNumber(0, d.votes_previous_minute);
                            });
                    }

                    // then, always transition the counts from the previous
                    // minute to the total
                    items.select(".total-num")
                        // .text(function(d){ return commify(d.votes); })
                        .transition()
                        // delay based on whether we've updated,
                        // and sprinkle some randomness in there
                        .delay(function(d, i) {
                            return (updated ? 0 : 5001) + (250 * Math.random());
                        })
                        // space this out over the update period (60 seconds)
                        .duration(60000)
                        .ease("linear")
                        .tween("text", function(d) {
                            var start = d.votes_previous_minute;
                            return interpolateNumber(start, d.votes);
                        });

                    items.exit().remove();

                    this.updated = true;
                }
            });

            var commify = d3.format(",0");

            function interpolateNumber(start, end) {
                var i = d3.interpolate(start, end);
                return function(t) {
                    var n = ~~i(t);
                    this.textContent = commify(n);
                };
            }

            // try {
            var params = $.deparam.querystring(location.search),
                baseURL = params.base || "http://ma-twittertracker.mtv.com/",
                lastURI = "vote-bestHero-final.jsonp";

            TRACKER = new Eddy.Tracker({
                baseURL: baseURL,
                lastURI: lastURI,
                container: "#view",
                //timeline: "#timeline",
                views: {
                   "vote": Eddy.UI.Vote
                },
                timeline: false,
                hash: true
            });

            // XXX hack the data:
            /**
             * Look for the "voting" bit in data["filter usage"], and assign
             * a "vote_count" property to each filter by looking it up in the
             * dictionary.
             */
            TRACKER.bind("prepare-data", function(data) {
                if (data["filter usage"]) {
                    var usages = data["filter usage"],
                        votes = _.filter(usages, function(usage) {
                            return usage.label === "voting";
                        });
                    var period = votes[0] || usages[0];
                    if (period && period.counts) {
                        var counts = period.counts;
                        _.forEach(data.filters, function(filter) {
                            filter.vote_count = counts[filter.name];
                        });
                    } else {
                        _.forEach(data.filters, function(filter) {
                            filter.vote_count = 0;
                        });
                    }

                    console.log("prepared:", data.filters);
                }
            });

            TRACKER.start();

            location.hash = "#vote";

            // } catch (e) {
            //     location.href = "sorry.html?error=" + escape(e);
            // }
        });