teaching machines

CS 491 Lecture 17 – jQuery Mobile

November 13, 2012 by Chris Johnson. Filed under cs491 mobile, fall 2012, lectures.

Before class

A

Before next class:

• Watch http://youtu.be/pzbrixFXqzQ.
• Read http://jquerymobile.com/test/docs/pages/index.html.

B

Before next class:

• Watch http://youtu.be/RtbDC3i_iVc.
• Read http://jquerymobile.com/test/docs/buttons/index.html.
• Read http://jquerymobile.com/test/docs/forms/index.html.
• Read http://jquerymobile.com/test/docs/lists/index.html.

In class

Our task this week is to write a web app ringtone melody generator. Today we will focus on the interface. Thursday we will look into playing back the ringtones.

1. Read the RTTTL specification.
2. Write a jQuery Mobile-styled page that has two pages showing in a navbar.
3. The first page shows a listview of all the songs that have been uploaded to a server. Use the JSON results from http://www.twodee.org/tests/rtttl/get.php to get the list.
4. The second page allows users to upload new songs. It has a few widgets: a textarea to show the RTTTL being composed, a radio button for note duration, a radio button for accidentals (sharps, flats, naturals), a checkbox for dottedness, a slider for the octave, seven buttons for each of the seven notes, and an upload button. When a button is clicked on, append to the textarea a new note of the form described in the RTTTL specification. Upload to http://www.twodee.org/tests/rtttl/add.php by sending the well-formed RTTTL string as a request variable named rtttl.