Team:Brown-Stanford/Templates/Main

From 2011.igem.org

(Difference between revisions)
Line 4: Line 4:
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script type="text/javascript">
<script type="text/javascript">
-
$(document).ready(function()
+
$(document).ready(function() {
-
{
+
$("#twitter").getTwitter({
-
/**
+
userName: "jquery",
-
* Set the size for each page to load
+
numTweets: 5,
 +
loaderText: "Loading tweets...",
 +
slideIn: true,
 +
slideDuration: 750,
 +
showHeading: true,
 +
headingText: "Latest Tweets",
 +
showProfileLink: true,
 +
showTimestamp: true
 +
});
 +
});
 +
</script>
 +
<script type="text/javascript">
 +
(function($) {
 +
/*
 +
jquery.twitter.js v1.5
 +
Last updated: 08 July 2009
 +
 
 +
Created by Damien du Toit
 +
http://coda.co.za/blog/2008/10/26/jquery-plugin-for-twitter
 +
 
 +
Licensed under a Creative Commons Attribution-Non-Commercial 3.0 Unported License
 +
http://creativecommons.org/licenses/by-nc/3.0/
*/
*/
-
var pageSize = 15;
+
 
-
+
$.fn.getTwitter = function(options) {
-
/**
+
 
-
* Username to load the timeline from
+
$.fn.getTwitter.defaults = {
-
*/
+
userName: null,
-
var username = 'Brown_iGEM';
+
numTweets: 5,
-
+
loaderText: "Loading tweets...",
-
/**
+
slideIn: true,
-
* Variable for the current page
+
slideDuration: 750,
-
*/
+
showHeading: true,
-
var currentPage = 1;
+
headingText: "Latest Tweets",
-
+
showProfileLink: true,
-
// Appends the new tweet to the UI
+
showTimestamp: true
-
var appendTweet = function(tweet, id) {
+
};
-
$("<p />")
+
 
-
.html(tweet)
+
var o = $.extend({}, $.fn.getTwitter.defaults, options);
-
.append($("<a />")
+
 
-
.attr("href", "http://twitter.com/" + username)
+
return this.each(function() {
-
.attr("title", "Go to Twitter status")
+
var c = $(this);
-
.append($("<img />")
+
 
-
.attr("src", "https://static.igem.org/mediawiki/2011/b/bc/Brown-Stanford_twitterLink.png")
+
// hide container element, remove alternative content, and add class
-
)
+
c.hide().empty().addClass("twitted");
-
)
+
 
-
.appendTo($("#tweets"));
+
// add heading to container element
-
};
+
if (o.showHeading) {
-
+
c.append("<h2>"+o.headingText+"</h2>");
-
// Loads the next tweets
+
}
-
var loadTweets = function() {
+
 
-
var url = "http://twitter.com/status/user_timeline/"
+
// add twitter list to container element
-
+ username + ".json?count="+pageSize+"&page="+currentPage+"&callback=?";
+
var twitterListHTML = "<ul id=\"twitter_update_list\"><li></li></ul>";
-
+
c.append(twitterListHTML);
-
$.getJSON(url,function(data) {
+
 
-
$.each(data, function(i, post) {
+
var tl = $("#twitter_update_list");
-
appendTweet(post.text, post.id);
+
 
 +
// hide twitter list
 +
tl.hide();
 +
 
 +
// add preLoader to container element
 +
var preLoaderHTML = $("<p class=\"preLoader\">"+o.loaderText+"</p>");
 +
c.append(preLoaderHTML);
 +
 
 +
// add Twitter profile link to container element
 +
if (o.showProfileLink) {
 +
var profileLinkHTML = "<p class=\"profileLink\"><a href=\"http://twitter.com/"+o.userName+"\">http://twitter.com/"+o.userName+"</a></p>";
 +
c.append(profileLinkHTML);
 +
}
 +
 
 +
// show container element
 +
c.show();
 +
 
 +
$.getScript("http://twitter.com/javascripts/blogger.js");
 +
$.getScript("http://twitter.com/statuses/user_timeline/"+o.userName+".json?callback=twitterCallback2&count="+o.numTweets, function() {
 +
// remove preLoader from container element
 +
$(preLoaderHTML).remove();
 +
 
 +
// remove timestamp and move to title of list item
 +
if (!o.showTimestamp) {
 +
tl.find("li").each(function() {
 +
var timestampHTML = $(this).children("a");
 +
var timestamp = timestampHTML.html();
 +
timestampHTML.remove();
 +
$(this).attr("title", timestamp);
 +
});
 +
}
 +
 
 +
// show twitter list
 +
if (o.slideIn) {
 +
// a fix for the jQuery slide effect
 +
// Hat-tip: http://blog.pengoworks.com/index.cfm/2009/4/21/Fixing-jQuerys-slideDown-effect-ie-Jumpy-Animation
 +
var tlHeight = tl.data("originalHeight");
 +
 
 +
// get the original height
 +
if (!tlHeight) {
 +
tlHeight = tl.show().height();
 +
tl.data("originalHeight", tlHeight);
 +
tl.hide().css({height: 0});
 +
}
 +
 
 +
tl.show().animate({height: tlHeight}, o.slideDuration);
 +
}
 +
else {
 +
tl.show();
 +
}
 +
 
 +
// add unique class to first list item
 +
tl.find("li:first").addClass("firstTweet");
 +
 
 +
// add unique class to last list item
 +
tl.find("li:last").addClass("lastTweet");
});
});
-
 
-
// We're done loading the tweets, so hide the overlay and update the UI
 
-
$("#overlay").fadeOut();
 
-
$("#pageCount").html(currentPage);
 
-
$("#tweetCount").html(currentPage * pageSize);
 
});
});
-
 
};
};
-
+
})(jQuery);
-
// First time, directly load the tweets
+
-
loadTweets();
+
-
+
-
// Append a scroll event handler to the container
+
-
$("#tweets").scroll(function() {
+
-
// We check if we're at the bottom of the scrollcontainer
+
-
if ($(this)[0].scrollHeight - $(this).scrollTop() == $(this).outerHeight()) {
+
-
// If we're at the bottom, show the overlay and retrieve the next page
+
-
currentPage++;
+
-
+
-
if(currentPage > 10) {
+
-
return false;
+
-
}
+
-
+
-
$("#overlay").fadeIn();
+
-
loadTweets();
+
-
}
+
-
});
+
-
+
-
});
+
</script>
</script>
-
<script type='text/javascript'>
+
<script type="text/javascript">
/*
/*
  * jQuery Easing v1.3 - http://gsgd.co.uk/sandbox/jquery/easing/
  * jQuery Easing v1.3 - http://gsgd.co.uk/sandbox/jquery/easing/

Revision as of 01:21, 8 June 2011