showcal.setPlannerValue(2008,02,11,"Test",'rank_1');
showcal.setPlannerValue(2008,02,11,"Test 2",'rank_2');

With the code above, when changing a month and going back, it will apply both rank_1 and rank_2 classes to each event messing up the coloring scheme you may have applied on the classes.

Any idea about this?

hi there!
my problem: i have more events at one day, that they shold be in different classes. example:

2008-02-04 : "my event"
2008-02-01 > 2008-02-14 : "conference"

will output only "conference" from 1st to 14th. i think this is problem with this one:

scalplanner.js : line 9 :

splanner[planDate] = { cls: planclass, val: plan.label };

this sets only one event at day, only thing that i could separate it, is via "multi-labels", but then all events at that day have same class.

you know what i mean? splanner array shold be multidimensional?

greetings, m.

In order to get this calendar working inside of the iUI platform for the iPhone I had to slightly modify prototype.js. On what is line 23 in my version where it sets the BrowserFeatures I had to set SpecificElementExtensions to false because the boolean statement where it checks the several document.createElement statements was throwing errors in MobileSafari. So now that section for me looks like this:

BrowserFeatures: {
XPath: !!document.evaluate,
ElementExtensions: !!window.HTMLElement,
SpecificElementExtensions: false
// document.createElement('div').__proto__ &&
// document.createElement('div').__proto__ !==
// document.createElement('form').__proto__
},


You can see in prototype that it already sets SpecificElementExtensions to false for MobileSafari several lines later so a better change might have been to code logic to not be specific to MobileSafari but for my app that's all I need.

Hope that helps anyone else trying this.

-David Ethell

Hey is it possible to make two scal calendars on the same page interact? Lets say you would use it to make bookings. Then you would not want it to be possible to select and earlier date on the second calendar then whats selected on the first calendar.

Hi and thanks for an excellent calendar!
When selecting a date that does not exist in next month, for example 31 mars and then going forward to april it jumps to may. Since 31 april does not exist (only 30 days in april).

Is this simple to fix?

oncalchange is only firing when I change months, not when I click on a date, like you said below.

What's up?

I'm interested in using this control. I'd love to see a prototype/open source calendar control like this become the most used.

One thing is holding me back, though - when comparing this control to something like Yahoo's YUI Calendar Control (http://developer.yahoo.com/yui/calendar/), pressing the button that loads the next month is quite a lot quicker in Yahoo's calendar control.

I'd hate to support yahoo's control - are you guys planning on spending any time on efficiency/speed? Am I the only one who thinks the month transitions are slow?

Great job though, looking forward to implementing scal on my site soon!

is there an option to handle the selection of a date. to be more precise: i want to close the calendar if the user has selected a date.

lg
michal
webdevbros.net

I've extended the scal.prototype to add a wrapper functionality so I can easily build floating calendars.

Object.extend(scal.prototype,
{
toggleCalendar: function()
{
var element = $(this.options.wrapper) || this.element;
this.options[element.visible() ? 'closeeffect' : 'openeffect'](element);
},

isOpen: function()
{
return ( $(this.options.wrapper) || this.element).visible();
}
});

The HTML will look like this:

<input type="text" id="mydate"/>
<img src="calendar.jpg" onclick="showCalendar(this, 'mydate');"/>
<br/>
<div id="calendar-container" style="width:221px; position:absolute; display:none;">
<b class="rtop">
<b class="r1"></b> <b class="r2"></b> <b class="r3"></b> <b class="r4"></b>
</b>
<div class="googleblue" id="calendar"></div>
</div>


This way I can have a floating calendar using script.aculo.us:

new Draggable("calendar-container", {handle: "rtop"});

var calendar = null;
function showCalendar(element, input)
{

if (!calendar)
{
calendar = new scal('calendar', $(input), {updateformat: 'mm/dd/yyyy', closebutton: ' ', wrapper: 'calendar-container'});
}
else
{
calendar.updateelement = $(input);
}

var date = new Date($F(input));
calendar.setCurrentDate(isNaN(date) ? new Date() : date);

if (element = $(element))
{
var container = $("calendar-container");
Position.clone($(element), container, {setWidth: false, setHeight: false, offsetLeft: element.getWidth() + 2});
}

calendar.openCalendar();
}

I hope this help somebody who is using this great Calendar.
Thanks to SCAL team =)

(sorry for my english, I'm spanish speaker)
Regards from Mexico,

DMenT.

Firstly, awesome script.

On to my problem: I'm building an app that is going to be used on oil rigs in the Middle East. Their weekend is on either Thursday/Friday or Friday/Saturday so I wanted the week to start from Friday. Setting weekdaystart to 5 take a look at January 2008. The month starts from the 4th!

Cheers,
Vishal Parpia.

I'm italian, so i need weekdays starting from monday, but if i use weekdaystart=1, the names come out scrambled - i have to use weekdaystart=6, that has no accord with the original ordering.
With this change in _buildHead method:
Date.prototype.daynames.sortBy(function(s,i){
i-=this.options.weekdaystart;
if(i<0){i+=7;}
return i;
}.bind(this))......
everithing works as expected (in the end, we need to work with a change of sign).

bye !

Ubik