Php - Widget Twitter (Rss -SimpleXml) avec prototype

La librairie prototype est une alternative à jquery. Elle permet de nombreuses choses, et nous allons voir comment l'utiliser, couplé avec php et simplexml (le php parsera le flux, et prototype nous affichera le résultat)

Tout d'abord, insérons la librairie prototype et scriptaculous.
A mettre entre les balises <head> et </head> :
<script type='text/javascript' src='http://ajax.googleapis.com/ajax/libs/prototype/1/prototype.js'></script>

<script type='text/javascript' src='http://ajax.googleapis.com/ajax/libs/scriptaculous/1/scriptaculous.js'></script>

Cela permet de charger les libraires prototype et scriptaculous : nous nous en servirons pour le préchargement ajax.

Partons du fait que notre widget, lorsqu'il recevra un argument "refresh" dans l'url ($_GET), chargera la timeline.

Voici le script javascript permettant de "précharger" la timeline : la fonction "jget" , qui prend, en argument, l'url à charger.
<script type="text/javascript">
function jget(monurl){

$('content').innerHTML='<center><div style="margin-top:100px;min-height:400px;width:100%"><img src="images/preload.gif" alt="Chargement en cours" border="0" /><br /><br />Chargement en cours</div></center>';
new Ajax.Request(monurl,
{
method:'get',
evalScripts: true,

onSuccess: function(transport){
var response = transport.responseText || "no response text";
var position = response.search('<a name="begin"></a>');
var position_end = response.search('<a name="end"></a>');
newhtml=response.substring(position, position_end);
document.getElementById('content').innerHTML = newhtml;

},
onFailure: function(){alert('Something went wrong...') ;        }
});

}

</script>

Dans ce script, le préchargement affiche une image "images/preload.gif" durant le chargement. Il vous appartient donc de trouver une belle image de chargement ^

A noter également ce passage dans la fonction :
var position = response.search('<a name="begin"></a>');

var position_end =response.search('<a name="end"></a>');

newhtml=response.substring(position, position_end);

document.getElementById('content').innerHTML = newhtml;

 

En fait, la fonction va chercher le contenu se situant entre <a name="begin"></a> et <a name="end"></a> . Ensuite, il va l'afficher dans la div "content" ( <div id="content"> )

 

Une pointe de css histoire de rendre tout cela un peu plus joli :
<title>Twitter - Ma TimeLine</title>
<style type="text/css">
a{
color:#3b5998;
text-decoration:none;
}
a:hover{
text-decoration:underline;
}
</style>
</head>
<body style="font-size:8pt;color:#707172;font-family:arial;">
<div style="border:solid 1px #CCCCCC; font-size:10pt;padding:5px;width:230px;background:#edeff4;">
<strong><a href="http://twitter.com/gpenverne" target="_blank">@Gpenverne sur Twitter</a></strong>
</div>
<div style="border:solid 1px #CCCCCC; padding:5px;width:230px;font-family:arial;font-size:8pt;">

 

Voici le code php qui chargera votre timeline :
<?php
$url='adresse de votre flux twitter';

if($_GET['refresh']){
echo '<a name="begin"></a>';
$ch = curl_init();
$timeout = 3;
curl_setopt($ch, CURLOPT_URL, $url);
curl_setopt($ch, CURLOPT_RETURNTRANSFER, 1);
curl_setopt($ch, CURLOPT_CONNECTTIMEOUT, $timeout);
$result = curl_exec($ch);
curl_close($ch);
$rss = simplexml_load_string($result);

foreach($rss->channel->item as $item){
$nb++;

$titre = utf8_decode($item->title);
$date = $item->pubDate;

if($nb<=10)echo '@'.show_post($titre).'<br /><br />';
}
echo '<a name="end"></a>';
}
else{
?>

Au cas où^la timeline n'a pas encore été chargée (absence de $_GET['refresh']), on lance la fonction jget qui va récupérer notre timeline.
<div id="content"></div>
<script type="text/javascript">
jget('adresse_du_script.php?refresh=1');
</script>

<?php
}
die('</div>
</body>
</html>
');
?>

 

Il est  à souligner l'utilisation de la fonction show_post. Elle permet de créer des liens cliquables sur chaque url  présente dans le tweet :
function show_post($content){

$array=explode(' ', $content);
foreach($array as $key=>$element){
if(eregi('http://', $element))
$post.=' <a href="'.$element.'" target="_blank">'.$element.'</a>';
else $post.=' '.$element;
}
return stripslashes(rtrim(ltrim(trim($post))));
}

L'idéal est de le tester, en l'adptant à vos besoins !
Gpenverne

Gpenverne

Développeur backend symfonien, qui trouve toujours moyen de faire des machins avec des bidules même si ce n'est pas utile.

Read More