Twitter API Directly via Ajax
Thanks to basic realm authentication support, it is extremely simple to create your own twitter app in your home page. Here the example:
<style type="text/css">
div.twit {
font-family: "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Verdana, Tahoma, sans-serif;
width: 320px;
}
div.twit h3,
div.twit h4 {
margin: 0;
padding: 0;
}
div.twit h3 {
font-size: 10pt;
color: blue;
}
div.twit h4 {
font-size: 7pt;
font-weight: normal;
text-align: right;
color: #999;
}
div.twit span {
font-size: 8pt;
}
</style>
<script type="text/javascript" src="http://vice-versa.googlecode.com/svn/trunk/build/vice-versa.min.js"></script>
<script type="text/javascript">
function addIntoList(info, container){
var div = document.createElement('<div class="twit"></div>'),
h3 = div.appendChild(document.createElement("h3")),
span= div.appendChild(document.createElement("span")),
h4 = div.appendChild(document.createElement("h4"))
;
h3.innerText = info.user.screen_name;
h4.innerText = info.created_at.substring(0, 19);
span.innerHTML = info.text.replace(/([a-zA-Z]+:\/\/[^\s]+)/g, '<a href="$1">$1</a>');
container.insertBefore(div, container.firstChild);
};
onload = function(){
var xhr = new XMLHttpRequest;
xhr.open(
"GET", "proxy.php?url=" +
"http://twitter.com/statuses/friends_timeline.json" + "?_=" + Math.random(),
false,
"YOURNAME",
"YOURPASS"
);
xhr.send(null);
if(199 < xhr.status && xhr.status < 400){
document.body.innerHTML = "";
for(var
list = Function("return " + xhr.responseText)().reverse(),
length = list.length,
i = 0;
i < length; ++i
)
addIntoList(list[i], document.body);
};
setTimeout(onload, 10000); // again after 10 seconds
};
</script>
Be Careful!!!
First of all it is not a good idea to put user and password directly in your page source code, so try locally but do not put online. Secondly, I did not say anything yet about side effects and security problems related to this PHP proxy I am working on ....so, as I wrote in the other post source, "do not try at home"
No comments:
Post a Comment