Skip to content

Instantly share code, notes, and snippets.

@austegard
Created July 6, 2009 14:58
Show Gist options
  • Save austegard/141470 to your computer and use it in GitHub Desktop.
Save austegard/141470 to your computer and use it in GitHub Desktop.
Twitter Conversations
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Twitter Conversations</title>
<!-- Include jQuery -->
<script type="text/javascript">
document.write(unescape("%3Cscript src='" + document.location.protocol + "//ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js' type='text/javascript'%3E%3C/script%3E"));
document.write(unescape("%3Cscript src='" + document.location.protocol + "//ajax.googleapis.com/ajax/libs/jqueryui/1/jquery-ui.min.js' type='text/javascript'%3E%3C/script%3E"));
</script>
<!--Get the base theme firectly from the SVN trunk (cheating, I know)-->
<link type="text/css" href="http://jquery-ui.googlecode.com/svn/trunk/themes/base/ui.all.css" rel="Stylesheet" />
<style type="text/css">
img
{
border: 0px;
}
input
{
width: 75px;
}
.ui-datepicker
{
font-size: 62.5%;
}
#searchFrame
{
width: 840px;
height: 600px;
display: none;
}
</style>
</head>
<body>
<script type="text/javascript">
String.prototype.format = function(tokens) {
///<summary>
///This is an extension method for strings, using string or numeric tokens (e.g. {foo} or {0}) to format the string.
///<summary>
///<param name="tokens">One or more replacement values
///if a single object is passed, expects to match tokens with object property names,
///if a single string, number or boolean, replaces any and all tokens with the string
///if multiple arguments are passed, replaces numeric tokens with the arguments, in the order passed
///</param>
///<returns>the string with matched tokens replaced</returns>
var text = this;
try {
if (!tokens) {
retun this;
}
switch (arguments.length) {
case 0: {
return this;
};
case 1:
{
switch (typeof tokens) {
case "object":
{
//loop through all the properties in the object and replace tokens matching the names
var token;
for (token in tokens) {
if (!tokens.hasOwnProperty(token) || typeof tokens[token] === 'function') {
break;
}
//else
text = text.replace(new RegExp("\\{" + token + "\\}", "gi"), tokens[token])
}
return text;
};
case "string":
case "number":
case "boolean":
{
return text.replace(/{[a-z0-9]*}/gi, tokens.toString());
};
default:
return text;
};
};
default:
{
//if multiple parameters, assume numeric tokens, where each number matches the argument position
for (var i = 0; i < arguments.length; i++) {
text = text.replace(new RegExp("\\{" + i + "\\}", "gi"), arguments[i].toString());
}
return text;
};
};
} catch (e) {
return text;
}
};
//jQuery manipulations
$(function() {
//default values
$("#p1").attr("value", "jaketapper");
$("#p2").attr("value", "senjohnmccain");
//add datepickers
$("#d1").datepicker({altField: '#d1alt', altFormat: 'yy-mm-dd'}).change(function(){
if ($.trim($(this).val()) == "") $("#d1alt").val("");
});
$("#d2").datepicker({altField: '#d2alt', altFormat: 'yy-mm-dd'}).change(function(){
if ($.trim($(this).val()) == "") $("#d2alt").val("");
});
//Get the conversation
$("#showConversation").click(function() {
$("#results").empty();
var url = "http://search.twitter.com/search.json?q=from:{p1}+to:{p2}+OR+from:{p2}+to:{p1}&since={d1}&until={d2}&rpp=50".format({
p1: $("#p1").val(),
p2: $("#p2").val(),
d1: $("#d1alt").val(),
d2: $("#d2alt").val()
});
$("#results").html("Loading data from " + url + "...");
$.getJSON(url + "&callback=?", function(data) {
$.each(data.results, function(i, result) {
content = ' \
<p> \
<a href="http://twitter.com/{from_user}"><img src="{profile_image_url}" />{from_user}</a> \
(<a href="http://twitter.com/{from_user}/statuses/{id}">{created_at}</a>): \
{text} \
</p>'.format(result);
$(content).appendTo("#results");
}); //each
}); //callback
}); //click
}); //jQuery onReady
</script>
<p>Show conversation between <input id="p1" type="text" /> and <input id="p2" type="text" /></p>
<p>(Optional, and slow...) Restrict to dates between <input id="d1" type="text" class="dates" /> and <input id="d2" type="text" class="dates" />
<input type="hidden" id="d1alt" /><input type="hidden" id="d2alt" />
</p>
<p><button id="showConversation">Show Conversation</button></p>
<div id="results"></div>
Example query: http://search.twitter.com/search?q=from:jaketapper+to:senjohnmccain+OR+from:senjohnmccain+to:jaketapper&since=2009-06-16&until=2009-06-16&rpp=50
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment