My second Titanium app: a movie soundboard app

My goal with this next app is to build something that I would actually use, a soundboard app with a few of my favorite movie quotes. I wanted to learn how to play media and also to start getting HTML 5 in the phone working as well so I used a tab grouping with two tabs.

Ti.UI.setBackgroundColor('#000');

// Windows
var win1 = Ti.UI.createWindow({ 
    title:'Anchorman',
    backgroundColor:'#fff',
    url: "/windows/anchorman.js"
});
var win2 = Ti.UI.createWindow({ 
    title:'Other',
    backgroundColor:'#fff'
});

var webview = Titanium.UI.createWebView({url:'/web/other.htm'});
win2.add(webview);

// Tabs
var tabAnchorman = Titanium.UI.createTab({
 id:'tabAnchorman',
 icon: 'KS_nav_ui.png',
 window:win1,
 title: 'Anchorman Quotes'
});
var tabOther = Titanium.UI.createTab({
 id:'tabOther',
 icon: 'KS_nav_views.png',
 window:win2,
 title: 'Other Quotes'
});
var tabGroup = Titanium.UI.createTabGroup({id:'tabGroup1'});
tabGroup.addTab(tabAnchorman);
tabGroup.addTab(tabOther);

tabGroup.open();

The first tab is a normal tableview with entries for Anchorman quotes.

Here is the anchorman list page:

var win = Ti.UI.currentWindow;

// Table view for showing the list of data
var tableview = Ti.UI.createTableView({ top: 0, backgroundColor: 'white' });
tableview.addEventListener('click', function(e)
{
    var sound = Ti.Media.createSound();
 sound.url = '../mp3/' + e.rowData.className + '.mp3';
 sound.play();
});

win.add(tableview);
refreshData();

function refreshData() {
 var data = [];
 data[data.length] = Ti.UI.createTableViewRow({title:'Cannonball',className:'a_cannonball'});
 data[data.length] = Ti.UI.createTableViewRow({title:'Having Fun',className:'a_havingfun'});
 data[data.length] = Ti.UI.createTableViewRow({title:'Real Panther',className:'a_realpanther'});
 data[data.length] = Ti.UI.createTableViewRow({title:'Stings Nostrils',className:'a_stingsnostrils'});
 data[data.length] = Ti.UI.createTableViewRow({title:'Very Important',className:'a_veryimportant'});
 data[data.length] = Ti.UI.createTableViewRow({title:'Every Time',className:'a_everytime'});
 data[data.length] = Ti.UI.createTableViewRow({title:'I Wanna Be On You',className:'a_iwannabeonyou'});
 data[data.length] = Ti.UI.createTableViewRow({title:'No Pants Dance',className:'a_nopantsdance'});
 data[data.length] = Ti.UI.createTableViewRow({title:'Pirate Hooker',className:'a_piratehooker'});
 data[data.length] = Ti.UI.createTableViewRow({title:'Storming Your Castle',className:'a_stormingyour'});
 data[data.length] = Ti.UI.createTableViewRow({title:'Whammy',className:'a_whammy'});
 data[data.length] = Ti.UI.createTableViewRow({title:'Yelling About',className:'a_yellingabout'});
 
 tableview.data = data;
}

Clicking an entry will create a sound object which takes a url and plays the sound.

Here is the html page for the second tab which has links for other movie quotes: I don't consider this app finished by any stretch but it addresses the two goals I had set out with playing media and incorporating an HTML 5 page in the app. And this app was completed in a half hour after work meetup.