IPhone Cafe

CBS bought CNet Networks for $1.8B in cash.

 ***

With your iPhone, take a look at CBS’s iPhone interface.

CBS iPhone

and compare with the CiUI iPhone interface developed at CNet before the purchase.

CiUI Interface 

Do they look the same? Makes me wonder if the CBS tech team got hold of CiUI’s framework and used it to deploy an iPhone interface for CBS news?  Or, did CBS use iUI?

***

The CBS version seems a bit smoother than CiUI.  Horizontal scrolling is smoother.  Clicking an option highlights the entire row not just a portion of the row.  Of the frameworks that imitate iPhone’s horizontal scrolling menu’s in a Safari application, the CBS site seems to be the best.

CiUI is an iPhone code library which helps developers create web applications with the look and feel of Apple’s iPhone. It was modeled after iUI and is used by CNET.  CiUI supports horizontal scrolling menu’s which are the trademark of the iPhone’s user interface. With CiUI, a web developer can build Safari web browser applications that look like a built in iPhone application.

***

The CiUI Safari page has another option which is labeled “Popular Posts”.  Here’s a link to the page (use an iPhone or Firefox):

http://www.core3.com/icore/i/ 

Clicking “Popular Posts” uses CiUI’s Javascript and CSS framework to display a list of titles ranked by the number of times the post has been downloaded.

*** 

In the example below, “Turn off autocorrect” is the number one downloaded post.  Click a title to see post content.

*** 

Data to drive the top ten list doesn’t come from the WordPress MySQL database.  Instead, it comes from the web server access log.

*** 

In an earlier post, a Perl script to parse the web server log file was presented.   The lines below add to that earlier Perl script by incrementing a hash named %count_Popular.

*** 

 After the hash is populated, the following lines sort the hash and write the first 40 lines into a file named popular.txt.

*** 

The file, popular.txt is then FTP’d up to the ISP server and used as input to drive the “Popular Posts” menu page. Here’s the file:

http://www.core3.com//icore/access/popular.txt

Each line of popular.txt is converted into a menu option.

Earlier posts on iPhone Cafe described CSS styles to create Rounded Corners on Form Input Fields and iPhone Drop Down Menus with Apple’s iPhone Safari look and feel.  Another post described using window.scrollTo(0, 1) to hide the Safari toolbar. These one-off tips come from Apple’s Safari Web Content Guide for iPhone; a good resource for programmers.

***

Here’s another good programmer resource. To see a complete framework for building Applie iPhone web applications, check out the post by Vladimir Olexa which presents client-side Javascript and CSS that simplies many of the tasks related to iPhone web application development.

About CiUI (CNET iPhone User Interface)

The link below is an example of CiUI’s framework supporting an iPhone interface for iPhone Cafe’s weblog. Use Safari or Firefox.  The example application needs work. The first option, “iPhone Cafe Home” displays a welcome message.  The second option “Recent Posts” displays a list of recent posts.  Titles are queried from the Wordpress database. Clicking a title displays the content of the post.

Sample Application (Iphone Cafe)