Free Source Code – Twitter Display: Code Architecture
Twitter Database Server
Twitter Display
Download
Install
Code Architecture
default.css
get_new_tweet_count.php
get_tweet_list.php
index.html
twitter_display.php
display_lib.php
site.js
tweet_list_template.txt
tweet_template.txt
twitter_display_config.php
streaming_framework
The code architecture is based on the SEO principle of making aggregated tweets visible to Google. When a page is first loaded, the aggregated tweets are embedded in the page as HTML. This gives your site the SEO benefit of keyword rich tweets that are new every time Google loads the page. After the page displays, Javascript is used to load additional tweets using Ajax. Ajax is also used to continually refresh the new tweet count. This reproduces the UI used on Twitter.com. The combination of an initial set of tweets when the page loads and more tweets from Ajax gives you great performance, great SEO, and a sexy interface.
Let’s follow the flow of tweet data from web server to browser using the sample Web page included with this code, index.html:
- When index.html is opened by a web browser, it uses
require_once()to call twitter_display.php in the plugin directory. - Twitter_display.php loads tweet_list_template.txt, which defines the HTML structure of the list of tweets. This template has macros that show where to include all the tweet data.
- When the macro for the list of recent tweets is reached, get_tweet_list.php is called with
require_once(). - Get_tweet_list.php extracts the most recent tweets from the
tweetstable in the MySQL database, and loops through them. For each set of tweet data it uses tweet_template.txt to assemble an HTML version of the tweet. - The text of each tweet is passed to the linkify() function. The linkify() function in display_lib.php converts each entity (@mentions, tags, and URLs) into formatted hyperlinks.
- When get_tweet_list.php has a complete set of tweets in HTML format, it returns it to twitter_display.php, and the list appears in the Web page. This makes the tweets available to Google for SEO purposes.
- After the page loads, site.js starts and sets up parts of the interface, including a More Tweets button at the bottom of the tweet list and a count of new tweets link at the top of the list. It also establishes a refresh interval for calling the Web server with Ajax to get the count of new tweets.
- Every time the refresh interval is reached, site.js calls get_new_tweet_count.php with Ajax, gets the count of new tweets, and displays them in the new tweets count.
- If the user clicks the More Tweets button, site.js requests a set of older tweets from get_tweet_list.php. These are returned as HTML, and appended to the end of the tweet list.
- All of the interactions with the Twitter database server are done through the db_lib.php script in the db directory.
The result of this architecture is that tweets flow in real-time from the Twitter API to the Twitter database server, and then on to your Web page.
