Alguma vez se questionou se seria capaz de criar um widget para o Twitter de acordo com as suas preferências? Para si que pretende fazê-lo, apresentamos-lhe hoje um guia bastante simples e intuitivo para criar o seu próprio widget para o Twitter, à sua medida! Um widget deste género terá de interagir com a API (Application Programming Interface – Interface de Programação da Aplicação) do Twitter. Para isso teremos de fazer um género de query à API, para recebermos os tweets de um dado utilizador; Introduzir os dados obtidos em um template HTML e converter os links, referências e hashtags; Aplicar formatação da data e hora; Introduzir o HTML em cache, para evitar carregar conteúdo em todas as aberturas de página e Trabalhar a compatibilidade entre aplicação e browser. Tudo junto parece muito trabalhoso, mas passo a passo, qualquer pessoa conseguirá  concluir este widget para Twitter. Os colegas do SitePoint.com fizeram um fantástico tutorial e é apartir dele que iremos fazer a nossa abordagem.

Este tutorial é a primeira parte de uma série de artigos, pelo que se tiver ideias ou sugestões, participe e deixe o seu comentário! Se desejar, poderá subscrever a nossa newsletter gratuita e receber os próximos conteúdos diretamente na sua caixa de email:

Endereço de Email:

1. API DO TWITTER

O Twitter fornece uma API. Podemos utilizar um link deste género para obter o número de tweets (N) de um dado utilizador, e em que formato.

http://www.twitter.com/user_timeline/user_id.format?count=N

user_id será o nome de utilizador.

format será o formato em que queremos a informação (JSON, XML, RSS ou ATOM).

N será o número de tweets que queremos receber.

Se por exemplo, pretendermos os últimos 5 tweets da Escola Criatividade no formato JSON teremos o seguinte link:

http://www.twitter.com/user_timeline/escolacriativ.json?count=5

2. XML, JSON, RSS OU ATOM?

O formato mais utilizado era XML, mas recentemente o Twitter decidiu abandonar este formato e abraçar JSON. Se pretendesse continuar a utilizar XML teria imenso trabalho, ao passo que com JSON poderá utilizar a função PHP json_decode() para descodificar o formato.

3. A CLASSE TWITTERSTATUS

A funcionalidade do nosso widget está envolta dentro de uma classe chamada Twitter Status. Nesta temos 7 propriedades públicas e uma privada:

class TwitterStatus
{
	public $ID;				// Nome de Utilizador
	public $Count;			// Número de Tweets
	public $WidgetTemplate;	// Template do Widget
	public $TweetTemplate;	// Template para cada Tweet
	public $ParseLinks;		// Analisar links no status do Twitter
	public $DateFormat;		// Datas PHP ou Amigáveis
	public $CacheFor;		// Número de segundos a manter o conteúdo em cache
	private $cache;			// Localização dos ficheiros de cache

É necessário uma função que corre quando um novo objecto TwitterStatus é criado. Esta função apenas irá atribuir um valor standard a cada propriedade:

// Função constructor
public function __construct($id = null, $count = 0) {
	// constantes
	$this->cache = __DIR__ . '/cache/';	// Localização da cache
	$this->CacheFor = 900;				// Mantém o conteúdo em cache durante 15 minutos
	$this->ID = $id;
	$this->Count = $count;
	$this->ParseLinks = true;
	$this->DateFormat = 'friendly';
	// Template Standard do Widget
	$this->WidgetTemplate =
		'<div class="twitterstatus">' .
		'<h2><a href="http://twitter.com/{screen_name}"><img src="{profile_image_url}" width="24" height="24" alt="{name}" />{name}</a></h2>' .
		'<ul>{TWEETS}</ul>' .
		'</div>';
	// Template Standard do Tweet
	$this->TweetTemplate =
		'<li>{text} <em>{created_at}</em></li>';
}

Como poderá verificar, a única propriedade privada é a cache. Não fazia nexo ter esta propriedade tornada pública. O conteúdo da cache é guardado numa pasta “cache” no directório onde o ficheiro twitterstatus.php estiver. naturalmente necessitará das devidas permissões de leitura e escrita.

4. PÚBLICO OU PRIVADO, QUAL A DIFERENÇA?

Uma propriedade ou método pública pode ser acedida por fora da classe. Quer isto dizer que os valores dessas propriedades poder ser alteradas e acedidas por qualquer código, não interessando onde ele está. Uma propriedade ou método privado tem uma limitação local e só poderá ser utilizada pela própria classe. A propriedade $cache poderá ser definida e alterada dentro da classe TwitterStatus mas não é visível fora dela.

5. ALTERNATIVAS

Como alternativa, poderá definir as propriedades $ID e $Count quando um objecto TwitterStatus for iniciado:

$t = new TwitterStatus('sitepointdotcom', 10);

Ou ainda, definir as propriedades separadamente:

$t = new TwitterStatus();

$t->ID = 'escolacriativ';

$t->Count = 5;

6. CLASSE TWITTERSTATUS  – TEMPLATES E FORMATOS

Se $ParseLinks estiver definido para verdadeiro, o código irá descodificar os links do tweet em código HTML (Texto Âncora).

Finalmente, o formato da data pode ser utilizado usando a função date():

$t->DateFormat = 'g:ia j F Y'; // 18:21 22 Fevereiro 2011

Adicionalmente poderemos definir o $DateFormat para “friendly” e dessa forma a data irá ser apresentada de forma chamada amigável, 10 minutos atrás, 1 hora atrás, ontem, há 2 semanas, etc.

São utilizados 2 templates, um para o widget, e outro para o tweet. O $WidgetTemplate é o HTML do widget, onde o {Tweets} indica quantos blocos $TweetTemplate aparecerão. O $TweetTemplate é o HTML para cada tweet, individualmente.

É possível utilizar alguns termos chave no nosso HTML para fazer a chamada de conteúdo no nosso template HTML. Temos como exemplo o {text}, {source}, {name}, {location}, {profile_image_url} e {statuses_count}. Para conhecer todos eles, a maneira mais fácil é procurar no feed XML.

Como exemplo temos o seguinte:

$t->WidgetTemplate =
	'<div>' .
	'<img src="{profile_image_url}" />' .
	'<strong>{name}</strong>'
	'<ul>{TWEETS}</ul>' .
	'</div>';
$t->TweetTemplate =
	'<li>Tweet {statuses_count}: {text} {created_at}</li>';

No template do widget chamamos  a imagem do perfil, o nome e os tweets. No template do tweet chamamos o texto e a data/hora.

7. COMO PUXAR O CONTEÚDO?

É possível implementar um método privado para buscar o conteúdo do feed do Twitter usando a livraria PHP (cURL):

private function FetchFeed() {
	$r = '';
	if ($this->ID != '' && $this->Count > 0) {
		// fetch feed
		$c = curl_init();
		curl_setopt_array($c, array(
			CURLOPT_URL => 'http://twitter.com/statuses/user_timeline/' . $this->ID . '.json?count=' . $this->Count,
			CURLOPT_HEADER => false,
			CURLOPT_TIMEOUT => 10,
			CURLOPT_RETURNTRANSFER => true
		));
		$r = curl_exec($c);
		curl_close($c);
	}
	// Aqui devolve JSON como array, usando a função json_decode()
	return (!!$r ? json_decode($r, true) : false);
}

Pode encontrar algumas opções relativas ao (cURL), sendo que a mais importante é o timeout. Se o Twitter não der uma resposta em 10 segundos, a função irá devolver falso.

Este tutorial é a primeira parte de uma série de artigos, pelo que se tiver ideias ou sugestões, participe e deixe o seu comentário! Se desejar, poderá subscrever a nossa newsletter gratuita e receber os próximos conteúdos diretamente na sua caixa de email:

Endereço de Email:

Abraço e até já!

 

Autor: Diogo Espinha

Blog do Autor | Artigos do Autor:

Workaholic e totalmente viciado em computadores, Internet e desporto motorizado. Adora praticar desporto, é um curioso da programação em PHP, CSS e HTML5 e não dispensa a companhia do seu Mac OSX 86 Snow Leopard!

  • Explorer - Factory Construction & Ship Building Joomla Theme
  • Justice - Attorney and Law Firm Joomla Template
  • OwnFolio - One Page Personal Portfolio / vCard / Resume / Showcase Joomla Template
  • Big Business - Responsive Template
  • Merab - Creative Multipurpose Drupal 8 Theme
  • Fitness Academy Joomla Template
  • Fruition - Business Joomla Template
  • Educate | Education & Courses, Kindergartens Joomla Template
  • Constructive - Contractors Multipurpose Joomla Landing Page Theme
  • Vina Bubox - VirtueMart Joomla Template for Online Stores
  • BizOne - One Page Parallax Drupal Theme
  • LawHouse - Responsive Lawyers Attorneys Joomla Template

Gostou deste artigo? Então torne-se fã do Blog no Facebook!



Comentários dos Alunos


  1. João
    23 de fevereiro de 2011

    Isto promete!!!



  2. Lucas
    6 de março de 2011

    Este tutorial realmente é muito bom. Com imaginação dá pra ir bem longe mesmo.



  3. Lucas
    6 de abril de 2011

    A url deve ser corrigida para:
    $url = ‘http://api.twitter.com/1/statuses/user_timeline.json?screen_name=’ . $this->ID . ‘&count=’ .$this->Count;


RSS
Twitter
Facebook
Comentários
ASSINANTES
SEGUIDORES
FÃS
COMENTÁRIOS
7794

Subscrever Newsletter
Subscreva a Newsletter:



Aplicativos Android, iPhone e Muito Mais!




Assine a Escola Criatividade Assine a Newsletter da Escola Criatividade Escola Criatividade no Twitter Escola Criatividade no Facebook Escola Criatividade no Youtube Escola Criatividade no Google Buzz