Sunday, June 24, 2012

Twitter Oauth Home Timeline Display with Jquery and PHP.

Twitter Oauth Home Timeline Display with Jquery and PHP.
facebook tag friends with jquery


Twitter Home Timeline JSON File
Take a look at blue color bold words. 
{ "posts":[
{        
"favorited": false,
"contributors": null,
"truncated": false,         
"text": "9lessons blog http://9lessons.info",
"created_at": "Tue Sep 14 06:48:09 +0000 2010",         
"retweeted": false,         
"coordinates": null,         
"source": "<a href="http://labs.9lessons.info">labs</a>",         
"in_reply_to_status_id": null,         
"in_reply_to_screen_name": null,         
"in_reply_to_user_id": null,         
"place": null,         
"retweet_count": null,         
"geo": null,         
"id": 24454801041, // Tweet Id        
"user": 
{           
   "follow_request_sent": false,            
   "profile_use_background_image": true,            
   "id": 15761916, //User Id
   "verified": false,            
   "profile_sidebar_fill_color": "FFFFFF",            
   "profile_text_color": "000000",            
   "followers_count": 2242,            
   "protected": false,            
   "location": "Chennai, INDIA",            
   "profile_background_color": "dedede", 
   "listed_count": 170,            
   "utc_offset": 19800,
   "statuses_count": 1097,  
   "description": "Engineer, Blogger, I love skyblue web",            
   "friends_count": 80, 
   "profile_link_color": "ad0000",
   "profile_image_url": "http://url/srinivas_normal.jpg", 
   "notifications": false,            
   "show_all_inline_media": false,            
   "geo_enabled": false,            
   "profile_background_image_url": "http://url/newbgx.png",            
   "name": "Srinivas Tamada ",            
   "lang": "en",            
   "profile_background_tile": false,            
   "favourites_count": 9,            
   "screen_name": "9lessons",            
   "url": "http://9lessons.info",            
   "created_at": "Thu Aug 07 10:47:26 +0000 2008",            
   "contributors_enabled": false,            
   "time_zone": "Chennai",            
   "profile_sidebar_border_color": "333333",            
   "following": true        
}     
}, 

{
// Second Tweet...
},
{
// Third Tweet...
}

]}

home.php
Contains javascript and PHP code. $(".mytweets").click(function(){}) - mytweets is the class name of anchor tag using $.getJSON() functions calling tweets.json file with passing $user_session.
<script type="text/javascript" src="http://ajax.googleapis.com/
ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script type="text/javascript" src="jquery.timeago.js"></script>
<script type="text/javascript">
$(document).ready(function()
{
$(".mytweets").click(function()
{
$.getJSON("tweets.json?user=<?php echo $user_session;?>",
function(data)
{
$.each(data.posts, function(i,data)
{
// Reading JSON file take a look at above code bold blue color words.
var id=data.id;
var text=data.text;
var created_time=data.created_at;
var screen_name=data.user.screen_name;
var image=data.user.profile_image_url;
var source=data.source;

var div_data ="<div class='twitter_status' id='"+id+"'><img src="+image+" class='twitter_image'/><a href='http://twitter.com/"+screen_name+"'>"+screen_name+"</a> "+text+"<br/><div class='twitter_posted_at'><span class='timeago' title='"+created_time+"'></span><i>via "+source+" </i></div></div>";
$(div_data).appendTo(".tweets");
$(".timeago").timeago(); // jquery timeago plugin converting into timestamp
});
});
return false;
});
});
</script>
<a href='#' class='mytweets'>My Tweets </a> 
<div class='tweets'></div>

.htaccess file code
$.getJSON function much flexible .json So that using .htacces file rewriting tweets.php to tweets.json.
RewriteEngine on

RewriteRule tweets.jsontweets.php

Library http://github.com/jmathai/twitter-async

tweets.php (About JSON code is the output)
Contains PHP code you can download the library files from my previous post. Using method get_statusesHome_timeline() getting twitter home timeline json file. More information about methods click here
<?php
include("db.php");
include 'EpiCurl.php';
include 'EpiOAuth.php';
include 'EpiTwitter.php';
$consumerKey='xxxxxxxxxxxxxxxxxxxx';
$consumerSecret='xxxxxxxxxxxxxxxxxxxx';

if($_GET['user'])
{
$user=$_GET['user']; // user session
// Getting stored oauth_token and oauth_token_secret values form users table
$sql=mysql_query("select oauth_token,oauth_token_secret from users where user='$user'");
$row=mysql_fetch_array($sql);
$oauthToken=$row['oauth_token'];
$oauthSecret=$row['oauth_token_secret'];
if(strlen($oauthToken)&gt;5 && strlen($oauthSecret)>5 )
{
$Twitter = new EpiTwitter($consumerKey, $consumerSecret);
$Twitter->setToken($oauthToken,$oauthSecret);
$hometimeline = $Twitter->get_statusesHome_timeline(); 
$tweets=json_encode($hometimeline-&gt;response);
$final = '{"posts":'.$tweets.'}';
echo $final;
}
}
?>

CSS
.twitter_status
{
min-height:60px;
padding:6px;
border-bottom:solid 1px #DEDEDE
}
.twitterr_status a
{
color:#3cf;
text-decoration:none
}
.twitterr_status a:hover{
color:#3cf;
text-decoration:underline
}
.twitter_image{
float:left;
margin-right:14px;
width:50px;
height:50px;
padding:3px;
}
.twitter_posted_at{
font-size:11px;
padding-top:4px;
color:#999
}

No comments:

Post a Comment