Download week planner

Download script

You can download the entire script from this zip file.

Configuration

Files in package

dhtmlgoodies-week-planner.html = Main HTML file
js/dhtmlgoodies-week-planner.js = Main JS file for the script
js/ajax.js = Ajax (Library from http://twilightuniverse.com/projects/sack)
week_schedule_getItems.php = File called by ajax. This file outputs events in XML format. These events will be shown automatically on your page.
week_schedule_save.php = File called by ajax when changes have been made to an event. This file will be called when an element is created(after description has been added), moved or resized.

XML format

The file week_schedule_getItems.php produces a list of events in the following XML format:

<?xml version="1.0" ?>
<item>
  <id>1</id>
  <description>Lunch</description>
  <eventStartDate>Mon, 13 Feb 2006 11:30 GMT</eventStartDate>
  <eventEndDate>Mon, 13 Feb 2006 12:00 GMT</eventEndDate>
  <bgColorCode>#FFFFFF</bgColorCode>
</item>
<item>
  <id>2</id>
  <description>Working with my project which is quite exciting.</description>
  <eventStartDate>Mon, 13 Feb 2006 12:00 GMT</eventStartDate>
  <eventEndDate>Mon, 13 Feb 2006 14:30 GMT</eventEndDate>
  <bgColorCode>#FFFF00</bgColorCode>
</item>

Tags:

item = parent element for each item
id = Unique id for each event
description = Textual description of the event
eventStartDate = Start of event
eventEndDate = End of event

Javascript variables

You have the following variables available:

var headerDateFormat = 'd.m'; var instantSave = true; var externalSourceFile_items = 'week_schedule_getItems.php'; var externalSourceFile_save = 'week_schedule_save.php'; var appointmentMarginSize = 5; var initTopHour = 8; var initMinutes = 15; var snapToMinutes = 5;

You will find these variables at the top of the dhtmlgoodies-week-planner.js file. There, you will also find a description of what these variables does.

PHP variable

At the top of the dhtmlgoodies-week-planner.html file you will see a PHP variable:

<? $rowHeight = 59; ?>

This $rowHeight variable is used to set the height of each hour in the script. The actual height is 1 pixel more than this value since a 1 pixel border is added to it.