Creating A Javascript Calendar (Full, not pop up)

Question

I'm having some difficulties creating a javascript appointment style calendar. While it does render, I know there's go to be a much more efficient way of doing it. Does anyone have a pattern they use for creating calendars? I will be using jQuery, but I don't want to use someone's calendar plugin as a) I haven't found one that works for what I need and b) I'm never going to get any better by using someone elses work.

Now, keep in mind my question is not about loading data in or getting repeat occurances or anything like that. I'm basically needing to know a good pattern on actually rendering the calendar markup.

Answer 1

Start with the date.js library, why reinvent things like figuring out the name of the day of the week, leap years and things like that. Build your own visualization on top of it.

Answer 2

There are a lot of gotchas associated with developing a calendar control from scratch. Since you're already using jQuery, I would recommend customizing a solution such as jCalendar and create your own wrapper such as the one described here

Answer 3

I think that taking someone elses work is your best bet. why reinvent the wheel? You can atleast take the part that figures out what are the days of that month in that year, and which of those days are weekends. I dont think you should waste your time trying to figure out that.

i had to do this once, albeit, it was just a mockup implementation, and i used someones work see: http://kpmm.doesthatevencompile.com/calendar.htm?p=5.1.2.1 i added some stuff but not much. i think that calendar renders cleanly and nicely.

good luck

Answer 4

Ive just published a new OS project called FullCalendar (http://arshaw.com/fullcalendar/)

Sounds like what you might want. Pass it an array of events/appointments and it will render. The plugin only provides the essentials, but you can use event hooks to extend it.

Answer 5

Calendars are very tricky beasts and Javascript's Date() object leaves a lot to be desired and I wouldn't even want to attempt it without date.js.

You have to be aware of JS Date() (being the user's current Timezone) vs Server Date/Time and JS's epoch and all kinds of silly stuff.

I've written calendars in the past and won't do it these days because of the effort involved, but it is a good learning experience.

If you have to fall back to someone else's calendar, I would suggest jQuery UI's http://jqueryui.com/demos/datepicker/