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.