jQueryUI Developer

Closed - This job posting has been filled and work has been completed.

Job Description

My site uses PHP (CodeIgniter), Bootstrap Twitter, jQuery, jQueryUI. It includes Google Maps.

I need a page built.

It will need to look like the images in the attachment

The tabs will be using jQueryUI tabs
Clicking anywhere on the map will switch to the Locations tab
The plus sign next to the input box on the Name tab will switch to the Location tab

On the location tab the locations will be like locations in Google Maps Directions functionality
So you can click and drag them around to change the ordering
The map will update to reflect the changes
Each location text input will trigger AJAX requests to search for the geographic location
The locations can be removed by clicking on the little grey x
This will alos update the map
Clicking the Add a location link will add a new text input box to the end of the list

On the date tab there will be jQueryUI datepicker widget with the ability to select a daterange

On the Companions tab the user can add a companion (name and email address) and have it appear in the list below with the checkbox beside it checked
It will do this by sending the details (name/email) to an ajax call and return the ID of the companion
The new checkbox will have the ID returned as the value and will share the same name as the other checkboxes

Clicking on the save trip button will send all the information on each of the tabs to an ajax call

It is vitally important that no alterations occur in any of the core javascript libraries (jquery, jqueryui etc)
A dummy variable can be used to simulate the return from the AJAX call to load a new companion
The Google Maps AJAX calls from the location tab must all work

My PHP code follows the coding style guide for CodeIgniter. I would like the javascript code to also follow this coding style as much as possible.

The exact representation of the final product need not match the images in the attachment perfectly, however the result has to have css from Twitter-Bootstrap in it so that the Twitter-Bootstrap styles can be used

Please contact me with any comments or questions

---
Skills: google-maps

Open Attachment