To understand the goal of this app, please see the project description.
The suggested server side infrastructure is PHP and a MySQL DB, but you could implement your own web service on any infrastructure. The client app runs on all newer mobile platforms. If the client browser supports HTML5 Web Storage, you're usually good to go.
The project consists of two key files: index.htm, which contains the client-side code, and kioskservicejquery.php, which contains the server-side PHP script.
As a bonus I've included kioskservicejquerystub_en.php - a server-side stub file that may come in handy for testing the client code without having to worry about server-side database issues.
Every other file in the repository serves to support index.htm in one way or another.
Bold columns are required.
Example of the kiosk_products table:
The last row has its active flag set to 0, so it won't show up in the menu. It is only kept for data integrity reasons.
Example of the data that the app will produce in kiosk_purchases:
The first two rows are purchases from the menu (kiosk_products). The last row represents a purchase of a custom product. I've renamed the "number_of" column to "quantity" in the provided code.
Getting this up and running basically comes down to:
Copy the contents of the repository to a PHP/MySQL environment.
Create the required DB tables and specify your database credentials in kioskservicejquery.php - or start off by using the stub back-end (kioskservicejquerystub_en.php).
In index.htm, edit the serverUrl variable to point to the server-side script (line 24).
Consider compressing the client-side code in order to save bandwidth. I've had success using http://htmlcompressor.com/compressor.html:
Choose x/html in the list.
Check "Never strip quotes" under "HTML Tags ..."
Click Compress. This will produce a lean file with code comments stripped out.
Finally, don't forget to increment the revision number (line 2) in kiosk.manifest so that browsers will refresh their cache.