4

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:

  1. 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.

  2. 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.

  3. 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)?

  4. 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!");
                }
              }
            },
          ]
        ]
      }
    });
    
  5. 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();
      }
    });
    
  6. 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 and eventRecorder.getUpdatedSchedulerEvent()._state.data, respectively. But using these smells funny.

  7. 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,

Kaarel Nummert
  • 989
  • 8
  • 20
  • 1
    I have the same questions too, do you know how to solve this? Thank you! – Giovani Feb 26 '14 at 16:18
  • 1
    No, that part of development has been descoped, but I too am still interested in the solutions. – Kaarel Nummert Feb 26 '14 at 17:26
  • You should split this into multiple questions. – stiemannkj1 Aug 04 '14 at 15:17
  • I have answered a question related to #4 [here](http://stackoverflow.com/questions/25280868/how-can-i-add-a-customized-buttons-to-the-alloyui-schedulers-event-popup/26089048#26089048). – stiemannkj1 Oct 27 '14 at 20:30
  • I have explained how to completely internationalize the `Scheduler` (answering #3) [here](https://stackoverflow.com/questions/45781072/how-to-localize-the-alloyui-scheduler-component/46439216#46439216). – stiemannkj1 Sep 27 '17 at 03:58
  • For #5, you could check whether a time is allowed and cancel the [`ScheduleEventRecorder` `save` event](https://stackoverflow.com/questions/39053982/save-edit-delete-and-cancel-events-in-alloyui-scheduler) with [`Event.halt()`](https://alloyui.com/api/classes/EventFacade.html#method_halt) to ensure events cannot be saved at certain times. Something like this should work: `eventRecorder: new Y.SchedulerEventRecorder({ on: { save: function(event) { if (!isEventAllowed()) { this.hidePopover(); alert('An event cannot be scheduled at that time.'); event.halt(); } } }` – stiemannkj1 Sep 27 '17 at 04:21
  • I have answered a question related to #6 [here](https://stackoverflow.com/questions/39053982/save-edit-delete-and-cancel-events-in-alloyui-scheduler). – stiemannkj1 Sep 27 '17 at 04:22

0 Answers0