I have played around with the AlloyUI Scheduler, and it seems to be the by far best calendar out there. While poking it, a few questions have risen. I am not particularly experienced with YUI, so my questions might be caused by lack of experience with the kind of thinking that goes with YUI. Nevertheless, here are the problems I haven't managed to overcome:
First, I tried loading 500+ events into it, and the result is that every action (adding events, deleting events, switching between views, switching between weeks/months) happens with a delay. Is this expected? 500 events doesn't sound like much, even for a relatively short period.
Can I limit the hours displayed in Day or Month view? I.e., instead of 00:00 - 23:59 I'd prefer to only display 08:00 - 17:59.
I've managed to translate bits of the UI, such as "Today", "Day", "Week", "Month", "Agenda", "Delete", "Save", "Cancel", "e.g., Dinner at Brian's". But how can I translate the days (e.g., "Monday", "Tuesday" etc)?
I've found a way to replace the default buttons of the EventRecorder's toolbar. But is there a way to keep the originals ("Save", "Cancel", "Delete") and add a few custom ones?
var eventRecorder = new Y.SchedulerEventRecorder({ toolbar: { children: [ [ { label: 'Details', on: { click: function () { alert("Yeah!"); } } }, ] ] } });
Is there a way to disable some periods of time for event creation? I'd imagine this could be achieved by interrupting the event creation by some way. Something in the lines of
scheduler.on({ 'scheduler-events:add': function (event) { return isEventAllowed(); } });
What is the correct way for accessing the calendar event data in the case of events such as "scheduler-event:change", "scheduler-event-recorder:edit" or similar? I currently use
scheduler.getEvents()[event.index]._state.data
andeventRecorder.getUpdatedSchedulerEvent()._state.data
, respectively. But using these smells funny.What would be a recommended way for adding a detailed editing view for events? I currently hacked it with something in the lines of
scheduler.on({ 'scheduler-base:click': function(event) { var toolbar = $(".aui-scheduler-event-recorder-overlay .yui3-widget-ft .aui-toolbar-content .aui-btn-group"); if (!toolbar.data("custom-processed")) { var button = $('<button class="aui-btn">Details</button>'); toolbar.append(button); button.click(function (event) { event.preventDefault(); var eventData = (eventRecorder.get("event") || eventRecorder.clone())._state.data; // Creating my detailed editing window here $(".aui-scheduler-event-recorder-overlay").addClass("yui3-overlay-hidden"); }); toolbar.data("custom-processed", true); } } });
Thanks,