Building a lightweight bulletinboard for iPhone/iPod Touch + setting up an RSS feed

In: apple|iPhone OS|php

9 Jun 2009

Currently I’m developing a manager for bands in AIR. It syncs al band info, gigs, rehearsals, contact, finances etc with your other band members. One of the things I’m integrating is a basic bulletinboard for band members to communicate.

As most of the members in my band have iPods/iPhones I thought “Wouldn’t it be great to release that AIR app for the iPhone OS?” . As it turned out, that’s not the best solution. (As I’m trying to make this public, for every band to use)

Reasons:

  1. You have to distribute things through the app store
  2. My objective-C isn’t all that great (it sucks :p)
  3. It would require like a huge database with a dedicated server, logins, etc…
  4. time

So I started to work on a webApp. Wich didn’t require any new skills for me. I used Dashcode to do all of this, because it provides you alot of cool nifty starting templates and the basic features you’d want an iPhone webapp to have (+look and feel).

1. Getting your database data in a readable format

By far the most easy choice was creating an RSS feed of my database. Allowing to show what and what not to give away from my central database which manages my air app.

I found this great PHP tutorial on making an RSS feed from a MySQL database.

A short summary:

header("Content-type: text/xml");
echo "";
echo "";
echo " We seem to have prikbord Notifications on rehearsals etc…

http://www.yoursite.com/ ";
require("db_connection.php");

// Query database and select the last 10 entries.
$data = mysql_query("SELECT * FROM news ORDER BY id");
while($row = mysql_fetch_array($data))
{
// Convert database images data into actual image link.
$row[Intro] = str_replace("images/", "http://www.yoursite.com.au/images/", $row[Intro]);

// Continue with the 10 items to be included in the  section of the XML.
//
http://www.yoursite.com/article.php?id=".$row[id]." //        http://www.yoursite.com/article.php?id=".$row[id]."

echo "

".$row[title]."

http://www.weseemtohave.net

<![CDATA[".$row[date]."]]></pubDate>
          <description><![CDATA[".$row[message]."]]></description>

<managingEditor><![CDATA[".$row[user]."]]>
";
}
// substr can limit the number of characters. First number is starting point while the second number is number of
//characters.
// otherwise just use $row[Intro].
//  is an optional sub-element of  but recommended if you don’t want to receive a warning when
//validating your RSS.

echo "

";
?>

The db_connection file looks something like this:

@mysql_connect(‘databaselocation’, ‘username’, ‘password’) or die(‘ERROR–CAN’T CONNECT TO
SERVER’);
@mysql_select_db(‘databasename’) or die(‘ERROR–CAN’T CONNECT TO DB’);
?>
 

I modified the webWicked file, according to the RSS 2.0 specification, so I could add the author.

My CMS in AIR allows you to add stuff to the DB, this RSS feed displays everything in my DB I wanna give public.

So for the iPhone/iPod app , all that was left for me to do was make a simple RSS reader. At first glance you wouldn’t say it’s an RSS reader, it looks like the webapp goes right into my database and picks out the data. But by creating a webapp on top of an RSS feed ontop of my database, I unintentionally just made things even a little more secure.

2. Why?

Q: Why would you create just an iPhone app, instead of a normal readable webpage?
A: iPhone OS web apps have their own ways of using javascript + you get the tools for immediatly applying an iPhone OS look and feel to your web app (like Panel/Views animations). Also, the templates for an rss reader that were provided made it sooo much easier for me to develop this kind of app. Almost no javascript/html/css was required to make this. Even Pascal Vyncke could have made this.

Since I wanted to add the author to the RSSitem (like a blogpost actually), i had to alter some code.
In the app’s main.js file i added the user.

setRepresentedObject: function(representedObject) {
// To start, the represented object of our detail controller is simply a string, the title of the list row that the user chose.  You may want to make the represented object any kind of object when you customize the template.
this._representedObject = representedObject;

// When the represented object is set, this controller also updates the DOM for the detail page appropriately.  As you customize the design for the detail page, you will want to extend this code to make sure that the correct information is populated into the detail UI.
var title = document.getElementById(‘articleTitle’);
title.innerText = extractText( feedResults[this._representedObject].title );
var user = document.getElementById(‘articleUser’);
user.innerText ="posted by: " + extractHTML( feedResults[this._representedObject].user );
var article = document.getElementById(‘articleDescription’);
article.innerHTML = extractHTML( feedResults[this._representedObject].description );
var date = document.getElementById(‘articleDate’);
date.innerText = "Published on " + createDateStr(feedResults[this._representedObject].date);

var self = this;
var backLink = document.getElementById(‘backToHeadlines’);
backLink.object.onclick = function() {
document.getElementById("StackLayout").object.setCurrentView("frontPage", true);
};
}
};

In the RSSSupport.js I added the fact that it has to read the managingEditor tag.

//parseAtomFeed(){
.
.
.
var user = findChild(item, "managingEditor");
.
.
.
results[results.length] = {
title: title,
link: link,
user: user,
date: new Date(itemDate),
description: description
}
}
 

And voila, in a total of 10 minutes I created a lightweight (currently) read-only bulletinboard for the iPhone OS.
photo

2photo

Comment Form

Advertisement

Last.fm

Spectrious's Profile Page

Social Networking

Categories

Archives

  • Francis: Nice one, pal! :D Btw I think you're great writer, especially considering that English is only yo [...]
  • Melanie Long: I always use Adobe illustrator at work because i work in an animation studio. this is really a serio [...]

Categories

Copyright © 2007 - kill-the-dinosaur - is proudly powered by WordPress | Log in

Compositio Theme is created by: Design Disease brought to you by PremiumThemes.com