Affiche sobrement les tweet (selon recherche)

Télécharger le projet
Commenter

Description

Organisant une soirée entre geek il m'est venu l'idée de projeter en grand sur un mur les tweet concernant la soirée (et ainsi avoir une conversation parallèle online/IRL).

Se script JavaScript fait tous les x secondes (ici 5sec) une recherche sur search.twitter.com (uniquement les profils twitter publique) selon une requête souhaitée (ici 'AndroidParty+OR+from:AndroidPartyBe&rpp=4' signifie les 4 derniers tweet contant 'androidparty'; ou ayant été envoyés depuis le compte '@AndroidPartyBe')

2 petites subtilités :
- Nous avions des sponsors et affichions environs une fois sur dix un printscreen de leur site
- Si le tweet contient une photo hébergée sur twitpic, celle-ci est affichée en grand.

Source / Exemple : 


<!DOCTYPE html>
<html>
 <head>
   <title>On Air!</title>
 </head>
 <body bgcolor='black'>

	<center>
		<DIV id='tweet' style='color:white;font-family: arial, helvetica, sans-serif ; font-size: 34pt ;'></DIV>
	</center>

	<script>
			function twitterSearch(obj) {
				var tDiv = document.getElementById("tweet"); //quel Div est le conteneur
				var pub=false; //affiche aussi des images de 'pub' a l'occasion
				var frequencePub=0.9; //0.9 signifie qu'un fois sur 10 cela affichera une pub
				var nbrImg=27; //le nombre d'images dans le répertoire 'img/' (affiche de 0.jpg à 9999.jpg si nbrImg=9999)
				
				var x = Math.random(); 
				if (pub && x>frequencePub) {
					tDiv.innerHTML="<center><font size=15>They help us</font><br><img src='img/"+Math.floor(Math.random()*nbrImg)+".jpg' /></center>";
				} else {
					var varstr= "";
					var user, tweet, postedAt, icon, userURL;
					for (i=0;i<obj.results.length;i++) {	
						icon = obj.results[i].profile_image_url;
						user = obj.results[i].from_user;
						userURL = "http://twitter.com/"+user;
						tweet = obj.results[i].text;
						postedAt = obj.results[i].created_at;
						varstr +="<tr><td><img height='144px' width='144px' src="+icon+" /></td>";
						varstr +="<td><b>@"+user+"</b>: "+tweet+"</td></tr>";
						
						//Si on detecte un twitpic, on l'affiche
						var lemot = "http://twitpic.com/[a-zA-Z0-9]+";
						var exp=new RegExp(lemot,"g");
						if ( ar = exp.exec(tweet) ) {
							var reg=new RegExp("http://twitpic.com/", "g");
							var chaine = ar[0].replace(reg,"http://twitpic.com/show/full/")
							varstr +="<tr><td colspan=2><center><img src="+chaine+" /></center></td></tr>";
						}
					}	
					tDiv.innerHTML="<center><table>"+varstr+"</table></center>";
				}
			}
			function twitter() { 
				var request='AndroidParty+OR+from:AndroidPartyBe&rpp=4'; //faire sa requete sur http://search.twitter.com/advanced et copier l'URL
				//Pour un affichage en 1024x768 (plein écran), mettre '&rpp=4' ce qui affiche 4 tweet à la fois
				var twitterJSON = document.createElement("script");
				twitterJSON.type="text/javascript" 
				twitterJSON.src="http://search.twitter.com/search.json?callback=twitterSearch&q="+request;
				document.getElementsByTagName("head")[0].appendChild(twitterJSON);
				return false;
			}
			
			var interval=5000; //5000 = update tt les 6sec
			//Lance le script tt les 'interval',
			setInterval('twitter()',interval);
			//et le lance une 1er fois pour ne pas devoir attendre 'interval' une première fois
			twitter();
	</script>

 </body>
</html>

Conclusion :


Ce n'est pas très fancy et c'est codé en 10minutes, mais cela pourrait être une base pour vos développements futurs.
Télécharger le projet

Codes Sources

A voir également

S'inscrire maintenant

Vous n'êtes pas encore membre ?

inscrivez-vous, c'est gratuit et ça prend moins d'une minute !

Les membres obtiennent plus de réponses que les utilisateurs anonymes.

Le fait d'être membre vous permet d'avoir un suivi détaillé de vos demandes et codes sources.

Le fait d'être membre vous permet d'avoir des options supplémentaires.