teaching machines

Web API – Sinfestivus – Jake Berner

November 24, 2012 by . Filed under cs491 mobile, fall 2012, postmortems.

My roommate keeps track of his web comics via mobile apps that are written and provided by the web comic sites they serve. One of our favorite web comics, however, did not have an app available, so I thought it would be a good project for this assignment. I call the app “Sinfestivus”, the web comic app for the rest-of-us.

After a bit of searching, I could find nowhere on the sinfest.net website that linked to an rss feed or web api. Expanding the search to google revealed that there actually was an undocumented rss feed url which was provided by the web app software that handles the site comic administration. The format of the content was not quite how I’d have liked it though. In the process of searching, I had found where someone had set up a “Yahoo! pipe” for this rss feed (though the pipe was long gone) so I decided to check out these so-called pipes. They are extremely cool!

Given a feed, they offer all sorts of options to re-format or filter the data, and exposes a new feed url. It also lets you decide what sort of output you wanted to deal with, so it’s quite handy if for nothing else than translating xml to json (which I did as well).

Yahoo Pipes screen shot

Yahoo! Pipes let you manipulate web api feeds in a comprehensive way!

Armed with this, I was able to extract the comic title, date (in a friendly format), link to the comic page, and link to the comic image. My main activity extended ListActivity and used a SimpleAdapter, which was very handy! I can organize the data in a Map, and I used the a modified version of the simple_list_item_2 layout. Because this layout needs two values, you cannot simply use an ArrayAdapter. Instead, I give the SimpleAdapter two arrays, one containing keys into the map, and one containing resource identifiers into which to put the values from the map. This allowed me to have the comic title in large text, and the date in smaller text beneath it.

Main list activity

Main list activity showing a two-part list item.

Upon a simple click, it would call the default Action.VIEW intent, which in this case was the browser, to display the comic image alone.

Comic image

Web comic image loaded in the browser

You have the option to perform a long-click on the item, and doing so will instead load up the web comic within the website.

Comic in page

Web comic in the web page.

Per the instructions, I added an item to the menu to call up the ListActivity showing the links from the twodee.org site.

Menu item

Menu item to call up example of links from twodee.org

This list was very similar, though it just used the ArrayAdapter and simple_list_item_1 layout. Clicking a list item merely starts up the browser to display the linked page.

Links example

Links example from twodee.org json data

I don’t know how reliable it is, but I discovered that I could call getContent() from the HttpUrlConnection to get an InputStream (or GZIPInputStream if the data was zipped) so I wouldn’t have to worry about whether this was the case. I also used a CharBuffer to read the data at once rather than re-write a loop. Not perfect, but seemed cleaner for this job.



  1. Mike Laurent says:

    Hey there :)

    Good article!

    We have developped a technology which allows to do similar things but with the output on a dashboard similar to pinterest.

    We have recreated your RSS feed in a few seconds on tadaweb.com. Would love to have your feedback on it :)


Leave a Reply

Your email address will not be published. Required fields are marked *