Booking appointments - Web calendar integrated with SugarCRM

The scope of this project is to prepare a website with built in calendar that is integrated with SugarCRM. The site should allow to book appointments. The workflow is as follows: 1. A user arrives at a site, clicks on a link - the page centres on calendar. 2. The calendar shows a number of open time slots for a particular day ([login to view URL]). The number of slots is calculated on-line from SugarCRM. The timeslot itself is an activity from SugarCRM calendar. The activity in SugarCRM should have 2 extra custom fields: on-line booking status (values: open, booked) and a checked custom field "online bookable" (See "Time slots" below for more details). 3. User clicks on a particular day - the calendar changes to Day View ([login to view URL]) 4. The Day View shows time slots (open and booked). Please style time slots so they fit into the overall theme, look good and readable. 5. User can click an open time slot to make an appointment -> after clicking, a modal window is shown (jQuery) 6. The modal window shows detailed information about the date and time frame (Example: 3 January 2013, Thursday, Duration: 11:00 - 13:00) !!! Mark the 24-hour time setting!!!. The window contains fields: First Name, Last Name, E-Mail address, telephone, that must be filled by the user + a button: [book an appointment]. The form must be secured by capcha. Please mind the site is "responsive", so should be the modal window too. 7. After booking, a confirmation message is shown (the fields disappear and a message is shown) - "An e-mail has been sent. Please click on a link in the e-mail to confirm the appointment. Please do that in the next five minutes"). 8. The system sends a confirmation e-mail. The time slot status in SugarCRM is changed from "open" to "booked". When the link is clicked - the time slot status stays booked, but if no confirmation is clicked within 5 minutes, the status changes back to open. 9. If a conflict occurs and two people click a time slot at once, please show a message: "We are sorry, but the time slot was already booked. Please choose another one." Time slots: they are the activities from SugarCRM calendar. They must be prepared by hand by an operator (no mass generation of time slots needed at this time). The time slot should have a mark (checkbox) - "online bookable". This will distinguish the activity from others non time slots. Layouts: The project contains screenshots attached + two .zip archives. The archive: [login to view URL] contains a html website template with a built in calendar on the index page. This is the base for the project. The html calendar itself comes from another theme: 20130103_Admin_theme_with_calendar.zip. The styling was already synchronized to some extent. IMPORTANT!!! - The site visuals need to be based on [login to view URL] theme! Use [login to view URL] only for source code as needed. Responsive: The html template is responsive, so the time slots on the calendar and the modal window should be too. Technology: Please use HTML + CSS + JavaScript (jQuery) for site logic, PHP for backend logic. The web server + a SugarCRM installation will be delivered from us for development / testing purposes. The code, configuration of custom fields and tweaking of SugarCRM as needed needs to be well documented. We would like to have our SVN repository updated in the course of the project.