Closed

javascript day/week view calendar ver2

This project was awarded to pradeepn080 for $160 NZD.

Get free quotes for a project like this
Employer working
Awarded to:
Skills Required
Project Budget
N/A
Total Bids
2
Project Description

require javascript calendar for managing bookings
only require javascript UI component,
we do not require any database work

refer static examples, and sample xml/javascript data in view source

Requirement Calendar 1
1 - read XML data of single calendar resource, and bookings
2 - generate HTML via javascript function
3 - show booked blocks (and notes), spanning rows if required, if clicked called placeholder javascript edit function
4 - on hover of clear blocks, change style class of min booking size (possibly more than 1 block), only if minimum booking can fit
5 - on click of a clear block, call placeholder javascript function with date/time

Requirement Calendar 2
1 - read XML data of _multiple_ calendar resource, and bookings
2 - determine min/max start times based on multiple calendars
3 - generate HTML via javascript function
4 - show unavailable blocks with a -
5 - show available blocks with time, and if clicked, call placeholder javascript function with date/time
6 - show partially available blocks with a different style class
7 - on hover of available blocks, change style class of minimum booking size (typically more than 1 block), only if minimum booking can fit prior to days end or before a unavailable block

RULES
html render time must be less than 1 second,

Programming Approach
- your programming approach must be to generate all HTML then update the UI only once!
- suggest you create a 2 dimensional array of all the time slots,
- then update a structure with bookings/availability
- then generate graph


refer example html, days broken into blocks (time units), eg 30 min, but minimum booking might be 1 hour
existing long bookings will span rows

if minimum booking > blocksize, don't allow any overlaps of next booking or days end

require hover detection, eg highlight minimum booking size if the minimum booking can fit in the current location.
display time on any empty table cell
display message on any booked table cell
if a booking spans multiple cells, use rowspan to merge cells (refer example)
if empty block clicked, and minimum booking can fit, then call a dummy functions, and alert the parameters (date,time)
if booked block clicked, call dummy edit function and alert parameters(ID)

Modifications permitted.
- if you want me to provide any additional data, i might be able to do it, e.g. convert times to some kind of integer
- if you want me to provide the data as an xml file, i can do that

Most importantly, i want code that I can easily modify.

Looking to make some money?

  • Set your budget and the timeframe
  • Outline your proposal
  • Get paid for your work

Hire Freelancers who also bid on this project

    • Forbes
    • The New York Times
    • Time
    • Wall Street Journal
    • Times Online