lib/yuilib/3.13.0/calendarnavigator/calendarnavigator-debug.js

   1 /*
   2 YUI 3.13.0 (build 508226d)
   3 Copyright 2013 Yahoo! Inc. All rights reserved.
   4 Licensed under the BSD License.
   5 http://yuilibrary.com/license/
   6 */
   7
   8 YUI.add('calendarnavigator', function (Y, NAME) {
   9
  10 /**
  11  * Provides a plugin which adds navigation controls to Calendar.
  12  *
  13  * @module calendarnavigator
  14  */
  15 var CONTENT_BOX = "contentBox",
  16     HOST        = "host",
  17     getCN       = Y.ClassNameManager.getClassName,
  18     substitute  = Y.Lang.sub,
  19     node        = Y.Node,
  20     create      = node.create,
  21     CALENDAR    = 'calendar',
  22     CALENDARNAV = 'calendarnav',
  23     CAL_HD      = getCN(CALENDAR, 'header'),
  24     CAL_PREV_M  = getCN(CALENDARNAV, 'prevmonth'),
  25     CAL_NEXT_M  = getCN(CALENDARNAV, 'nextmonth'),
  26     CAL_DIS_M   = getCN(CALENDARNAV, 'month-disabled'),
  27     ydate       = Y.DataType.Date;
  28 /**
  29  * A plugin class which adds navigation controls to Calendar.
  30  *
  31  * @class CalendarNavigator
  32  * @extends Plugin.Base
  33  * @namespace Plugin
  34  */
  35 function CalendarNavigator() {
  36     CalendarNavigator.superclass.constructor.apply(this, arguments);
  37 }
  38
  39 /**
  40  * The namespace for the plugin. This will be the property on the widget, which will
  41  * reference the plugin instance, when it's plugged in.
  42  *
  43  * @property NS
  44  * @static
  45  * @type String
  46  * @default "navigator"
  47  */
  48 CalendarNavigator.NS = "navigator";
  49
  50 /**
  51  * The NAME of the CalendarNavigator class. Used to prefix events generated
  52  * by the plugin class.
  53  *
  54  * @property NAME
  55  * @static
  56  * @type String
  57  * @default "pluginCalendarNavigator"
  58  */
  59 CalendarNavigator.NAME = "pluginCalendarNavigator";
  60
  61
  62 /**
  63  * Static property used to define the default attribute
  64  * configuration for the plugin.
  65  *
  66  * @property ATTRS
  67  * @type Object
  68  * @static
  69  */
  70 CalendarNavigator.ATTRS = {
  71
  72     /**
  73      * The number of months to shift by when the control arrows are clicked.
  74      *
  75      * @attribute shiftByMonths
  76      * @type Number
  77      * @default 1 (months)
  78      */
  79     shiftByMonths : {
  80         value: 1
  81     }
  82 };
  83
  84    /**
  85     * The CSS classnames for the calendar navigator controls.
  86     * @property CALENDARNAV_STRINGS
  87     * @type Object
  88     * @readOnly
  89     * @protected
  90     * @static
  91     */
  92 CalendarNavigator.CALENDARNAV_STRINGS = {
  93    prev_month_class: CAL_PREV_M,
  94    next_month_class: CAL_NEXT_M
  95 };
  96
  97    /**
  98     * The template for the calendar navigator previous month control.
  99     * @property PREV_MONTH_CONTROL_TEMPLATE
 100     * @type String
 101     * @protected
 102     * @static
 103     */
 104 CalendarNavigator.PREV_MONTH_CONTROL_TEMPLATE = '<a class="yui3-u {prev_month_class}" role="button" aria-label="{prev_month_arialabel}" ' +
 105                                                     'tabindex="{control_tabindex}">' +
 106                                                     "<span>&lt;</span>" +
 107                                                 '</a>';
 108    /**
 109     * The template for the calendar navigator next month control.
 110     * @property NEXT_MONTH_CONTROL_TEMPLATE
 111     * @type String
 112     * @readOnly
 113     * @protected
 114     * @static
 115     */
 116 CalendarNavigator.NEXT_MONTH_CONTROL_TEMPLATE = '<a class="yui3-u {next_month_class}" role="button" aria-label="{next_month_arialabel}" ' +
 117                                                     'tabindex="{control_tabindex}">' +
 118                                                     "<span>&gt;</span>" +
 119                                                 '</a>';
 120
 121
 122 Y.extend(CalendarNavigator, Y.Plugin.Base, {
 123
 124     _eventAttachments : {},
 125     _controls: {},
 126
 127     /**
 128      * The initializer lifecycle implementation. Modifies the host widget's
 129      * render to add navigation controls.
 130      *
 131      * @method initializer
 132      */
 133     initializer : function() {
 134
 135         // After the host has rendered its UI, place the navigation cotnrols
 136         this._controls = {};
 137         this._eventAttachments = {};
 138
 139         this.afterHostMethod("renderUI", this._initNavigationControls);
 140     },
 141
 142     /**
 143      * The initializer destructor implementation. Responsible for destroying the initialized
 144      * control mechanisms.
 145      *
 146      * @method destructor
 147      */
 148     destructor : function() {
 149
 150     },
 151
 152     /**
 153      * Private utility method that focuses on a navigation button when it is clicked
 154      * or pressed with a keyboard.
 155      *
 156      * @method _focusNavigation
 157      * @param {Event} ev Click or keydown event from the controls
 158      * @protected
 159      */
 160     _focusNavigation : function (ev) {
 161         ev.currentTarget.focus();
 162     },
 163
 164     /**
 165      * Private utility method that subtracts months from the host calendar date
 166      * based on the control click and the shiftByMonths property.
 167      *
 168      * @method _subtractMonths
 169      * @param {Event} ev Click event from the controls
 170      * @protected
 171      */
 172     _subtractMonths : function (ev) {
 173         if ( (ev.type === "click") || (ev.type === "keydown" && (ev.keyCode === 13 || ev.keyCode === 32)) ) {
 174             var host = this.get(HOST),
 175                 oldDate = host.get("date");
 176             host.set("date", ydate.addMonths(oldDate, -1*this.get("shiftByMonths")));
 177             ev.preventDefault();
 178         }
 179     },
 180
 181     /**
 182      * Private utility method that adds months to the host calendar date
 183      * based on the control click and the shiftByMonths property.
 184      *
 185      * @method _addMonths
 186      * @param {Event} ev Click event from the controls
 187      * @protected
 188      */
 189     _addMonths : function (ev) {
 190         if ( (ev.type === "click") || (ev.type === "keydown" && (ev.keyCode === 13 || ev.keyCode === 32)) ) {
 191             var host = this.get(HOST),
 192                 oldDate = host.get("date");
 193             host.set("date", ydate.addMonths(oldDate, this.get("shiftByMonths")));
 194             ev.preventDefault();
 195         }
 196     },
 197
 198
 199     _updateControlState : function () {
 200
 201         var host      = this.get(HOST),
 202             startDate = host.get('date'),
 203             endDate   = ydate.addMonths(startDate, host._paneNumber - 1),
 204             minDate   = host._normalizeDate(host.get("minimumDate")),
 205             maxDate   = host._normalizeDate(host.get("maximumDate"));
 206
 207         if (ydate.areEqual(minDate, startDate)) {
 208             if (this._eventAttachments.prevMonth) {
 209                 this._eventAttachments.prevMonth.detach();
 210                 this._eventAttachments.prevMonth = false;
 211             }
 212
 213             if (!this._controls.prevMonth.hasClass(CAL_DIS_M)) {
 214                 this._controls.prevMonth.addClass(CAL_DIS_M).setAttribute("aria-disabled", "true");
 215             }
 216         }
 217         else {
 218             if (!this._eventAttachments.prevMonth) {
 219             this._eventAttachments.prevMonth = this._controls.prevMonth.on(["click", "keydown"], this._subtractMonths, this);
 220             }
 221             if (this._controls.prevMonth.hasClass(CAL_DIS_M)) {
 222               this._controls.prevMonth.removeClass(CAL_DIS_M).setAttribute("aria-disabled", "false");
 223             }
 224         }
 225
 226         if (ydate.areEqual(maxDate, endDate)) {
 227             if (this._eventAttachments.nextMonth) {
 228                 this._eventAttachments.nextMonth.detach();
 229                 this._eventAttachments.nextMonth = false;
 230             }
 231
 232             if (!this._controls.nextMonth.hasClass(CAL_DIS_M)) {
 233                 this._controls.nextMonth.addClass(CAL_DIS_M).setAttribute("aria-disabled", "true");
 234             }
 235         }
 236         else {
 237             if (!this._eventAttachments.nextMonth) {
 238             this._eventAttachments.nextMonth = this._controls.nextMonth.on(["click", "keydown"], this._addMonths, this);
 239             }
 240             if (this._controls.nextMonth.hasClass(CAL_DIS_M)) {
 241               this._controls.nextMonth.removeClass(CAL_DIS_M).setAttribute("aria-disabled", "false");
 242             }
 243         }
 244
 245         this._controls.prevMonth.on(["click", "keydown"], this._focusNavigation, this);
 246         this._controls.nextMonth.on(["click", "keydown"], this._focusNavigation, this);
 247     },
 248
 249
 250
 251
 252     /**
 253      * Private render assist method that renders the previous month control
 254      *
 255      * @method _renderPrevControls
 256      * @private
 257      */
 258     _renderPrevControls : function () {
 259       var prevControlNode = create(substitute (CalendarNavigator.PREV_MONTH_CONTROL_TEMPLATE,
 260                                CalendarNavigator.CALENDARNAV_STRINGS));
 261       prevControlNode.on("selectstart", this.get(HOST)._preventSelectionStart);
 262
 263       return prevControlNode;
 264     },
 265
 266     /**
 267      * Private render assist method that renders the next month control
 268      *
 269      * @method _renderNextControls
 270      * @private
 271      */
 272     _renderNextControls : function () {
 273       var nextControlNode = create(substitute (CalendarNavigator.NEXT_MONTH_CONTROL_TEMPLATE,
 274                                CalendarNavigator.CALENDARNAV_STRINGS));
 275       nextControlNode.on("selectstart", this.get(HOST)._preventSelectionStart);
 276
 277       return nextControlNode;
 278     },
 279
 280     /**
 281      * Protected render assist method that initialized and renders the navigation controls.
 282      * @method _initNavigationControls
 283      * @protected
 284      */
 285     _initNavigationControls : function() {
 286         var host = this.get(HOST),
 287             headerCell = host.get(CONTENT_BOX).one("." + CAL_HD);
 288
 289         CalendarNavigator.CALENDARNAV_STRINGS.control_tabindex = host.get("tabIndex");
 290         CalendarNavigator.CALENDARNAV_STRINGS.prev_month_arialabel = "Go to previous month";
 291         CalendarNavigator.CALENDARNAV_STRINGS.next_month_arialabel = "Go to next month";
 292
 293         this._controls.prevMonth = this._renderPrevControls();
 294         this._controls.nextMonth = this._renderNextControls();
 295
 296         this._updateControlState();
 297
 298         host.after(["dateChange", "minimumDateChange", "maximumDateChange"], this._updateControlState, this);
 299
 300         headerCell.prepend(this._controls.prevMonth);
 301         headerCell.append(this._controls.nextMonth);
 302     }
 303 });
 304
 305 Y.namespace("Plugin").CalendarNavigator = CalendarNavigator;
 306
 307
 308 }, '3.13.0', {"requires": ["plugin", "classnamemanager", "datatype-date", "node"], "skinnable": true});