Trip Planner in HTML5

Simple trip planner HTML5 web application.

Features

• 'native' look and feel using jQueryMobile.
• Use of Phonegap for native wrappers.
• Use of localStorage API to preserve changes between invocations
• Use of PhoneGap Connection API to check for network access before attempting Dropbox sync
• Use of responsive design: 3 destinct layouts for different screen sizes
• Syncing with a Dropbox account.

Demo on YouTube

To watch a video demo click this link

Demo in browser

For a demo in the browser goto link

3 Layouts for multiple screen widths

These three screen dumps shows the 3 different UIs. The UI will automatically adapt to the available screen size

Installing as a Chrome hosted app

1. Open up the setting tab
2. Choose the 'Extensions' panel
3. Make sure 'Developer mode' is selected
4. Click 'Load unpacked extension'
5. Point to the travel-planner-js directory you downloaded from github
6. Try the hosted app, by opening up a new tab and pick the Trip Planner app

Third-party dependencies

• Dropbox access: An amazing utility providing a JS API for accessing a DropBox
• jQuery Mobile: Convenient UI elements for native look and feel
• jQuery