Looking for Ideas on Scheduling + Day by Day View of Week

Hi All,

Fishing for ideas here and would love to hear what you have to say.

I have a Course model that, as you may have guessed, manages my Courses.
A course has:

  • A start time (with minutes in 15 minute intervals aka 8:15am, 8:30am,
    etc)
  • An ending time (with minutes in 15 minute intervals aka 1:45pm,
    2:00pm, etc)
  • Days in the week on which the course meets (i.e. Monday, Tuesday and
    Friday)

My end goal is to show the user a “calendar”, or grid, with
Monday-Friday on the X axis and 8am-8pm on the Y axis. I would like to
show the classes as colored blocks on the calender so the user could
visually see a class’ duration. Something like this:
http://tinyurl.com/lj84u4

Any thoughts/suggestions on how i can do this?

Here are 2 ideas that i have had:

  1. Create a table with every 4 vertical cells representing 1 hour. Some
    how build some logic that as the table’s rows are being printed out
    figure out if a box needs to be colored or not?

  2. Possibly use CSS, a fixed height div, and other inner divs that might
    be positioned absolute or use a %… not sure if that would work though.

  3. Say screw it! jk :slight_smile:

Thank you for taking time to read this.

Looks like this question is more of an html/presentation question, you
may get more help on a different forum. If you’re looking for an
application like google calender, I would recommend javascript, its a
hair difficult to debug, but it will render the same in every browser,
be quick, and very flexible. (google’s calender app is written in
Javascript). Here is one existing scheduler application written in
javascript:

http://www.scriptcalendar.com/javascript-appointment/javascript-appointment.aspx

do some more searching, this seems like a relatively common item, don’t
re-invent the wheel. If you’re not familiar with javascript building
this functionality up from the ground won’t be easy. If the schedule
won’t change much you could certainly do this in CSS. Or you could make
your calender in a calender application and take a screenshot of it,
then just post a picture. It all really depends on why you want a
calender like this. Is it for others to tell your schedule? Is it for
others to schedule some sort of appointment with you, etc…

If anyone else has an opinion feel free to chime in…

Richard S. wrote:

Looks like this question is more of an html/presentation question, you
may get more help on a different forum.

Yup.

If you’re looking for an
application like google calender, I would recommend javascript, its a
hair difficult to debug, but it will render the same in every browser,

JavaScript render the same in every browser? Ha! :slight_smile:

(Yes, it’s possible, but it takes some understanding of the differences
in browsers.)

be quick, and very flexible. (google’s calender app is written in
Javascript).

There’s no reason to use JavaScript for this unless, like Google
Calendar, you want sophisticated client-side behavior. Using JS will
certainly not address the basic issue of how to build up the schedule
grid in the first place.

[…]

If the schedule
won’t change much you could certainly do this in CSS.
[…]

You will have to use HTML and CSS to create the layout, whether or not
JS is involved. (Unless you do the whole thing through DOM manipulation
from scratch…but that’s such a terrible idea that it’s not worth
serious consideration.)

I’ve heard that calendar_helper might be worth looking at.

Best,

Marnen Laibow-Koser
http://www.marnen.org
[email protected]