calendar.js

   1 YUI().use('yui2-container', 'yui2-calendar', function(Y) {
   2     var YAHOO = Y.YUI2;
   3
   4     document.body.className += ' yui-skin-sam';
   5
   6     YAHOO.util.Event.onDOMReady(function(){
   7
   8         var Event = YAHOO.util.Event,
   9             Dom = YAHOO.util.Dom,
  10             dialog, calendar;
  11
  12         var showBtn = Dom.get("show");
  13
  14         Event.on(showBtn, "click", function() {
  15
  16             // Lazy Dialog Creation - Wait to create the Dialog, and setup document click listeners, until the first time the button is clicked.
  17             if (!dialog) {
  18
  19                 // Hide Calendar if we click anywhere in the document other than the calendar
  20                 Event.on(document, "click", function(e) {
  21                     var el = Event.getTarget(e);
  22                     var dialogEl = dialog.element;
  23                     if (el != dialogEl && !Dom.isAncestor(dialogEl, el) && el != showBtn && !Dom.isAncestor(showBtn, el)) {
  24                         dialog.hide();
  25                     }
  26                 });
  27
  28                 function resetHandler() {
  29                     calendar.cfg.setProperty("pagedate", calendar.today);
  30                     calendar.render();
  31                 }
  32
  33                 function closeHandler() {
  34                     dialog.hide();
  35                 }
  36
  37                 dialog = new YAHOO.widget.Dialog("attcalendarcontainer", {
  38                     visible:false,
  39                     context:["show", "tl", "bl"],
  40                     buttons:[{text: M.str.attendance.caltoday, handler: resetHandler, isDefault:true}, {text: M.str.attendance.calclose, handler: closeHandler}],
  41                     draggable:false,
  42                     close:false
  43                 });
  44                 dialog.setHeader('');
  45                 dialog.setBody('<div id="cal"></div>');
  46                 dialog.render(document.body);
  47
  48                 dialog.showEvent.subscribe(function() {
  49                     if (YAHOO.env.ua.ie) {
  50                         // Since we're hiding the table using yui-overlay-hidden, we
  51                         // want to let the dialog know that the content size has changed, when
  52                         // shown
  53                         dialog.fireEvent("changeContent");
  54                     }
  55                 });
  56             }
  57
  58             // Lazy Calendar Creation - Wait to create the Calendar until the first time the button is clicked.
  59             if (!calendar) {
  60
  61                 calendar = new YAHOO.widget.Calendar("cal", {
  62                     iframe:false,          // Turn iframe off, since container has iframe support.
  63                     hide_blank_weeks:true  // Enable, to demonstrate how we handle changing height, using changeContent
  64                 });
  65
  66                 calendar.cfg.setProperty("start_weekday", M.attendance.cal_start_weekday);
  67                 calendar.cfg.setProperty("MONTHS_LONG", M.attendance.cal_months);
  68                 calendar.cfg.setProperty("WEEKDAYS_SHORT", M.attendance.cal_week_days);
  69                 calendar.select(new Date(M.attendance.cal_cur_date*1000));
  70                 calendar.render();
  71
  72                 calendar.selectEvent.subscribe(function() {
  73                     if (calendar.getSelectedDates().length > 0) {
  74
  75                         Dom.get("curdate").value = calendar.getSelectedDates()[0] / 1000;
  76
  77                         Dom.get("currentdate").submit();
  78                     }
  79                     dialog.hide();
  80                 });
  81
  82                 calendar.renderEvent.subscribe(function() {
  83                     // Tell Dialog it's contents have changed, which allows
  84                     // container to redraw the underlay (for IE6/Safari2)
  85                     dialog.fireEvent("changeContent");
  86                 });
  87             }
  88
  89             var seldate = calendar.getSelectedDates();
  90
  91             if (seldate.length > 0) {
  92                 // Set the pagedate to show the selected date if it exists
  93                 calendar.cfg.setProperty("pagedate", seldate[0]);
  94                 calendar.render();
  95             }
  96
  97             dialog.show();
  98         });
  99     });
 100 });