javascript day/week view calendar ver2

Closed

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.

Skills: Javascript

See more: javascript week, calendar javascript day week, javascript calendar display day view, javascript html table view week calendar, javascript week view calendar, calendar javascript, work view, week end update, view work, view more, view html source code, use graph, structure graph, sample graph data, programming javascript, programming in javascript, max graph, javascript edit code, integer programming examples, html programming notes, html 5 javascript, graph structure, graph sample data, graph render, graph in data structure

Project ID: #837667

Awarded to:

pradeepn080

Hi i can do it with very clean code!! Plz see PM::: Thanks

$160 NZD in 7 days
(4 Reviews)
3.1

2 freelancers are bidding on average $160 for this job

pmk08042228112ma

4+ years of exp on web development. We are ready to do this project.

$160 NZD in 7 days
(0 Reviews)
0.0