ryanmcgrath/xvd_twitter.html

## xvd_twitter.html
<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <title>The history of David Johnson | He's awesome, in summary</title>
	<style type="text/css">
		/* 	The following CSS isn't optimized for anything but standards compliant browsers.
			Don't copy and paste with any expectations, this is just a demo.
		*/
		html {
			background-color: #2e2e2e;
			font: normal 12px/14px helvetica, sans-serif;
			padding: 0px;
		}

		body {
			background-color: #f8f8f8;
			-moz-border-radius: 4px;
			margin: 10px auto;
			padding: 10px;
			width: 800px;
			color: #444;
		}

		a, a:visited {
			color: #a9486b;
			text-decoration: none;
		}

		a:hover { text-decoration: underline; }

		#tweets_holder { display: none; }

		p {
			margin: 0 0 15px 0;
		}
	</style>
	<script type="text/javascript" src="http://jqueryjs.googlecode.com/files/jquery-1.3.2.min.js"></script>
	<script type="text/javascript">
		var linkCatch = /((((ht|f){1}(tp:[/][/]){1})|((www.){1}))[-a-zA-Z0-9@:%_\+.~#?&//=]+)/gm,
			usernameCatch = /@(\w+)/gm;


        function convertUrls(text) {
          text = text.replace(linkCatch, function(t) { return replaceUrl(t); });
          return text.replace(usernameCatch, '<a href="http://twitter.com/$1" title="External Link">@$1</a>');
        }

        function replaceUrl(t) { return '<a href="'+t+'" title="'+t+'">' + t + '</a>'; }

		function pullTwitterData(count, page) {
			$.ajax({
				type: "GET",
				dataType: "jsonp",
				url: "http://twitter.com/statuses/user_timeline/xvd.json",
				data: "count=" + count + "&page=" + page,
				success: function(tweets) {
					var tweetsFull = "";
					for(tweet in tweets) tweetsFull += "<p>" + convertUrls(tweets[tweet].text) + "</p>";
					$("#tweets_holder").append(tweetsFull).slideDown("slow");
					if(tweets[1].user.statuses_count > (count * page)) pullTwitterData(count, page + 1);
				}
			});
		}

		$(document).ready(function() {
			pullTwitterData(200, 1);
		});
	</script>
</head>
<body>
	<div id="tweets_holder">
	</div>
</body>
</html>
	<!DOCTYPE html>
	<html>
	<head>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
	<title>The history of David Johnson \| He's awesome, in summary</title>
	<style type="text/css">
	/* The following CSS isn't optimized for anything but standards compliant browsers.
	Don't copy and paste with any expectations, this is just a demo.
	*/
	html {
	background-color: #2e2e2e;
	font: normal 12px/14px helvetica, sans-serif;
	padding: 0px;
	}

	body {
	background-color: #f8f8f8;
	-moz-border-radius: 4px;
	margin: 10px auto;
	padding: 10px;
	width: 800px;
	color: #444;
	}

	a, a:visited {
	color: #a9486b;
	text-decoration: none;
	}

	a:hover { text-decoration: underline; }

	#tweets_holder { display: none; }

	p {
	margin: 0 0 15px 0;
	}
	</style>
	<script type="text/javascript" src="http://jqueryjs.googlecode.com/files/jquery-1.3.2.min.js"></script>
	<script type="text/javascript">
	var linkCatch = /((((ht\|f){1}(tp:[/][/]){1})\|((www.){1}))[-a-zA-Z0-9@:%_\+.~#?&//=]+)/gm,
	usernameCatch = /@(\w+)/gm;


	function convertUrls(text) {
	text = text.replace(linkCatch, function(t) { return replaceUrl(t); });
	return text.replace(usernameCatch, '<a href="http://twitter.com/$1" title="External Link">@$1</a>');
	}

	function replaceUrl(t) { return '<a href="'+t+'" title="'+t+'">' + t + '</a>'; }

	function pullTwitterData(count, page) {
	$.ajax({
	type: "GET",
	dataType: "jsonp",
	url: "http://twitter.com/statuses/user_timeline/xvd.json",
	data: "count=" + count + "&page=" + page,
	success: function(tweets) {
	var tweetsFull = "";
	for(tweet in tweets) tweetsFull += "<p>" + convertUrls(tweets[tweet].text) + "</p>";
	$("#tweets_holder").append(tweetsFull).slideDown("slow");
	if(tweets[1].user.statuses_count > (count * page)) pullTwitterData(count, page + 1);
	}
	});
	}

	$(document).ready(function() {
	pullTwitterData(200, 1);
	});
	</script>
	</head>
	<body>
	<div id="tweets_holder">
	</div>
	</body>
	</html>