www/plugins/auto/fullcalendar/js/jquery.ui.timepicker.js

   1 /*
   2  * jQuery UI Timepicker 0.0.7
   3  *
   4  * Copyright 2010-2011, Francois Gelinas
   5  * Dual licensed under the MIT or GPL Version 2 licenses.
   6  * http://jquery.org/license
   7  *
   8  * http://fgelinas.com
   9  *
  10  * Depends:
  11  *      jquery.ui.core.js
  12  */
  13
  14  /*
  15   * As it is a timepicker, I inspired most of the code from the datepicker
  16   * Francois Gelinas - Nov 2010
  17   *
  18   * Release 0.0.2 - Jan 6, 2011
  19   * Updated to include common display options for USA users
  20   * Stephen Commisso - Jan 2011
  21   *
  22   * release 0.0.3 - Jan 8, 2011
  23   * Re-added a display:none on the main div (fix a small empty div visible at the bottom of the page before timepicker is called) (Thanks Gertjan van Roekel)
  24   * Fixed a problem where the timepicker was never displayed with jquery ui 1.8.7 css,
  25   *     the problem was the class ui-helper-hidden-accessible, witch I removed.
  26   *     Thanks Alexander Fietz and StackOverflow : http://stackoverflow.com/questions/4522274/jquery-timepicker-and-jqueryui-1-8-7-conflict
  27   *
  28   * Release 0.0.4 - jan 10, 2011
  29   * changed showLeadingZero to affect only hours, added showMinutesLeadingZero for minutes display
  30   * Removed width:100% for tables in css
  31   *
  32   * Release 0.0.5 - Jan 18, 2011
  33   * Now updating time picker selected value when manually typing in the text field (thanks Rasmus Schultz)
  34   * Fixed : with showPeriod: true and showLeadingZero: true, PM hours did not show leading zeros (thanks Chandler May)
  35   * Fixed : with showPeriod: true and showLeadingZero: true, Selecting 12 AM shows as 00 AM in the input field, also parsing 12AM did not work correctly (thanks Rasmus Schultz)
  36   *
  37   * Release 0.0.6 - Jan 19, 2011
  38   * Added standard "change" event being triggered on the input when the content changes. (Thanks Rasmus Schultz)
  39   * Added support for inline timePicker, attached to div or span
  40   * Added altField that receive the parsed time value when selected time changes
  41   * Added defaultTime value to use when input field is missing (inline) or input value is empty
  42   *       if defaultTime is missing, current time is used
  43   *
  44   * Release 0.0.7 - Fev 10, 2011
  45   * Added function to set time after initialisation :$('#timepicker').timepicker('setTime',newTime);
  46   * Added support for disabled period of time : onHourShow and onMinuteShow (thanks Rene Felgenträger)
  47   */
  48
  49 (function ($, undefined) {
  50
  51     $.extend($.ui, { timepicker: { version: "0.0.7"} });
  52
  53     var PROP_NAME = 'timepicker';
  54     var tpuuid = new Date().getTime();
  55
  56     /* Time picker manager.
  57     Use the singleton instance of this class, $.timepicker, to interact with the time picker.
  58     Settings for (groups of) time pickers are maintained in an instance object,
  59     allowing multiple different settings on the same page. */
  60
  61     function Timepicker() {
  62         this.debug = true; // Change this to true to start debugging
  63         this._curInst = null; // The current instance in use
  64         this._isInline = false; // true if the instance is displayed inline
  65         this._disabledInputs = []; // List of time picker inputs that have been disabled
  66         this._timepickerShowing = false; // True if the popup picker is showing , false if not
  67         this._inDialog = false; // True if showing within a "dialog", false if not
  68         this._dialogClass = 'ui-timepicker-dialog'; // The name of the dialog marker class
  69         this._mainDivId = 'ui-timepicker-div'; // The ID of the main timepicker division
  70         this._inlineClass = 'ui-timepicker-inline'; // The name of the inline marker class
  71         this._currentClass = 'ui-timepicker-current'; // The name of the current hour / minutes marker class
  72         this._dayOverClass = 'ui-timepicker-days-cell-over'; // The name of the day hover marker class
  73
  74         this.regional = []; // Available regional settings, indexed by language code
  75         this.regional[''] = { // Default regional settings
  76             hourText: 'Heure', // Display text for hours section
  77             minuteText: 'Minute', // Display text for minutes link
  78             amPmText: ['AM', 'PM'] // Display text for AM PM
  79         };
  80         this._defaults = { // Global defaults for all the time picker instances
  81             showOn: 'focus',    // 'focus' for popup on focus,
  82                                 // 'button' for trigger button, or 'both' for either (not yet implemented)
  83             showAnim: 'fadeIn',             // Name of jQuery animation for popup
  84             showOptions: {},                // Options for enhanced animations
  85             appendText: '',                 // Display text following the input box, e.g. showing the format
  86             onSelect: null,                 // Define a callback function when a hour / minutes is selected
  87             onClose: null,                  // Define a callback function when the timepicker is closed
  88             timeSeparator: ':',             // The caracter to use to separate hours and minutes.
  89             showPeriod: false,              // Define whether or not to show AM/PM with selected time
  90             showLeadingZero: true,          // Define whether or not to show a leading zero for hours < 10. [true/false]
  91             showMinutesLeadingZero: true,   // Define whether or not to show a leading zero for minutes < 10.
  92             altField: '',                   // Selector for an alternate field to store selected time into
  93             defaultTime: '',                // Used as default time when input field is empty or for inline timePicker
  94
  95             //NEW: 2011-02-03
  96             onHourShow: null,                       // callback for enabling / disabling on selectable hours  ex : function(hour) { return true; }
  97             onMinuteShow: null              // callback for enabling / disabling on time selection  ex : function(hour,minute) { return true; }
  98         };
  99         $.extend(this._defaults, this.regional['']);
 100
 101         this.tpDiv = $('<div id="' + this._mainDivId + '" class="ui-timepicker ui-widget ui-helper-clearfix ui-corner-all " style="display: none"></div>');
 102     }
 103
 104     $.extend(Timepicker.prototype, {
 105         /* Class name added to elements to indicate already configured with a time picker. */
 106         markerClassName: 'hasTimepicker',
 107
 108         /* Debug logging (if enabled). */
 109         log: function () {
 110             if (this.debug)
 111                 console.log.apply('', arguments);
 112         },
 113
 114         // TODO rename to "widget" when switching to widget factory
 115         _widgetTimepicker: function () {
 116             return this.tpDiv;
 117         },
 118
 119         /* Override the default settings for all instances of the time picker.
 120         @param  settings  object - the new settings to use as defaults (anonymous object)
 121         @return the manager object */
 122         setDefaults: function (settings) {
 123             extendRemove(this._defaults, settings || {});
 124             return this;
 125         },
 126
 127         /* Attach the time picker to a jQuery selection.
 128         @param  target    element - the target input field or division or span
 129         @param  settings  object - the new settings to use for this time picker instance (anonymous) */
 130         _attachTimepicker: function (target, settings) {
 131             // check for settings on the control itself - in namespace 'time:'
 132             var inlineSettings = null;
 133             for (var attrName in this._defaults) {
 134                 var attrValue = target.getAttribute('time:' + attrName);
 135                 if (attrValue) {
 136                     inlineSettings = inlineSettings || {};
 137                     try {
 138                         inlineSettings[attrName] = eval(attrValue);
 139                     } catch (err) {
 140                         inlineSettings[attrName] = attrValue;
 141                     }
 142                 }
 143             }
 144             var nodeName = target.nodeName.toLowerCase();
 145             var inline = (nodeName == 'div' || nodeName == 'span');
 146
 147             if (!target.id) {
 148                 this.uuid += 1;
 149                 target.id = 'tp' + this.uuid;
 150             }
 151             var inst = this._newInst($(target), inline);
 152             inst.settings = $.extend({}, settings || {}, inlineSettings || {});
 153             if (nodeName == 'input') {
 154                 this._connectTimepicker(target, inst);
 155             } else if (inline) {
 156                 this._inlineTimepicker(target, inst);
 157             }
 158         },
 159
 160         /* Create a new instance object. */
 161         _newInst: function (target, inline) {
 162             var id = target[0].id.replace(/([^A-Za-z0-9_-])/g, '\\\\$1'); // escape jQuery meta chars
 163             return { id: id, input: target, // associated target
 164                 selectedDay: 0, selectedMonth: 0, selectedYear: 0, // current selection
 165                 drawMonth: 0, drawYear: 0, // month being drawn
 166                 inline: inline, // is timepicker inline or not :
 167                 tpDiv: (!inline ? this.tpDiv : // presentation div
 168                     $('<div class="' + this._inlineClass + ' ui-timepicker ui-widget  ui-helper-clearfix"></div>'))
 169             };
 170         },
 171
 172         /* Attach the time picker to an input field. */
 173         _connectTimepicker: function (target, inst) {
 174             var input = $(target);
 175             inst.append = $([]);
 176             inst.trigger = $([]);
 177             if (input.hasClass(this.markerClassName)) { return; }
 178             this._attachments(input, inst);
 179             input.addClass(this.markerClassName).
 180                 keydown(this._doKeyDown).
 181                 keyup(this._doKeyUp).
 182                 bind("setData.timepicker", function (event, key, value) {
 183                     inst.settings[key] = value;
 184                 }).
 185                 bind("getData.timepicker", function (event, key) {
 186                     return this._get(inst, key);
 187                 });
 188             //this._autoSize(inst);
 189             $.data(target, PROP_NAME, inst);
 190         },
 191
 192         /* Handle keystrokes. */
 193         _doKeyDown: function (event) {
 194             var inst = $.timepicker._getInst(event.target);
 195             var handled = true;
 196             inst._keyEvent = true;
 197             if ($.timepicker._timepickerShowing) {
 198                 switch (event.keyCode) {
 199                     case 9: $.timepicker._hideTimepicker();
 200                         handled = false;
 201                         break; // hide on tab out
 202                     case 27: $.timepicker._hideTimepicker();
 203                         break; // hide on escape
 204                     default: handled = false;
 205                 }
 206             }
 207             else if (event.keyCode == 36 && event.ctrlKey) { // display the time picker on ctrl+home
 208                 $.timepicker._showTimepicker(this);
 209             }
 210             else {
 211                 handled = false;
 212             }
 213             if (handled) {
 214                 event.preventDefault();
 215                 event.stopPropagation();
 216             }
 217         },
 218
 219         /* Update selected time on keyUp */
 220         /* Added verion 0.0.5 */
 221         _doKeyUp: function (event) {
 222             var inst = $.timepicker._getInst(event.target);
 223             $.timepicker._setTimeFromField(inst);
 224             $.timepicker._updateTimepicker(inst);
 225         },
 226
 227         /* Make attachments based on settings. */
 228         _attachments: function (input, inst) {
 229             var appendText = this._get(inst, 'appendText');
 230             var isRTL = this._get(inst, 'isRTL');
 231             if (inst.append) { inst.append.remove(); }
 232             if (appendText) {
 233                 inst.append = $('<span class="' + this._appendClass + '">' + appendText + '</span>');
 234                 input[isRTL ? 'before' : 'after'](inst.append);
 235             }
 236             input.unbind('focus', this._showTimepicker);
 237             if (inst.trigger) { inst.trigger.remove(); }
 238             var showOn = this._get(inst, 'showOn');
 239             if (showOn == 'focus' || showOn == 'both') { // pop-up time picker when in the marked field
 240                 input.focus(this._showTimepicker);
 241             }
 242             if (showOn == 'button' || showOn == 'both') { // pop-up time picker when button clicked
 243                 var buttonText = this._get(inst, 'buttonText');
 244                 var buttonImage = this._get(inst, 'buttonImage');
 245                 inst.trigger = $(this._get(inst, 'buttonImageOnly') ?
 246                                 $('<img/>').addClass(this._triggerClass).
 247                                         attr({ src: buttonImage, alt: buttonText, title: buttonText }) :
 248                                 $('<button type="button"></button>').addClass(this._triggerClass).
 249                                         html(buttonImage == '' ? buttonText : $('<img/>').attr(
 250                                         { src: buttonImage, alt: buttonText, title: buttonText })));
 251                 input[isRTL ? 'before' : 'after'](inst.trigger);
 252                 inst.trigger.click(function () {
 253                     if ($.timepicker._timepickerShowing && $.timepicker._lastInput == input[0]) { $.timepicker._hideTimepicker(); }
 254                     else { $.timepicker._showTimepicker(input[0]); }
 255                     return false;
 256                 });
 257             }
 258         },
 259
 260
 261         /* Attach an inline time picker to a div. */
 262         _inlineTimepicker: function(target, inst) {
 263             var divSpan = $(target);
 264             if (divSpan.hasClass(this.markerClassName))
 265                 return;
 266             divSpan.addClass(this.markerClassName).append(inst.tpDiv).
 267                 bind("setData.timepicker", function(event, key, value){
 268                     inst.settings[key] = value;
 269                 }).bind("getData.timepicker", function(event, key){
 270                     return this._get(inst, key);
 271                 });
 272             $.data(target, PROP_NAME, inst);
 273
 274             this._setTimeFromField(inst);
 275             this._updateTimepicker(inst);
 276             inst.tpDiv.show();
 277         },
 278
 279         /* Pop-up the time picker for a given input field.
 280         @param  input  element - the input field attached to the time picker or
 281         event - if triggered by focus */
 282         _showTimepicker: function (input) {
 283             input = input.target || input;
 284             if (input.nodeName.toLowerCase() != 'input') { input = $('input', input.parentNode)[0]; } // find from button/image trigger
 285             if ($.timepicker._isDisabledTimepicker(input) || $.timepicker._lastInput == input) { return; } // already here
 286
 287             var inst = $.timepicker._getInst(input);
 288             if ($.timepicker._curInst && $.timepicker._curInst != inst) {
 289                 $.timepicker._curInst.tpDiv.stop(true, true);
 290             }
 291             var beforeShow = $.timepicker._get(inst, 'beforeShow');
 292             extendRemove(inst.settings, (beforeShow ? beforeShow.apply(input, [input, inst]) : {}));
 293             inst.lastVal = null;
 294             $.timepicker._lastInput = input;
 295
 296             $.timepicker._setTimeFromField(inst);
 297             if ($.timepicker._inDialog) { input.value = ''; } // hide cursor
 298             if (!$.timepicker._pos) { // position below input
 299                 $.timepicker._pos = $.timepicker._findPos(input);
 300                 $.timepicker._pos[1] += input.offsetHeight; // add the height
 301             }
 302             var isFixed = false;
 303             $(input).parents().each(function () {
 304                 isFixed |= $(this).css('position') == 'fixed';
 305                 return !isFixed;
 306             });
 307             if (isFixed && $.browser.opera) { // correction for Opera when fixed and scrolled
 308                 $.timepicker._pos[0] -= document.documentElement.scrollLeft;
 309                 $.timepicker._pos[1] -= document.documentElement.scrollTop;
 310             }
 311             var offset = { left: $.timepicker._pos[0], top: $.timepicker._pos[1] };
 312             $.timepicker._pos = null;
 313             // determine sizing offscreen
 314             inst.tpDiv.css({ position: 'absolute', display: 'block', top: '-1000px' });
 315             $.timepicker._updateTimepicker(inst);
 316
 317             // reset clicked state
 318             inst._hoursClicked = false;
 319             inst._minutesClicked = false;
 320
 321             // fix width for dynamic number of time pickers
 322             // and adjust position before showing
 323             offset = $.timepicker._checkOffset(inst, offset, isFixed);
 324             inst.tpDiv.css({ position: ($.timepicker._inDialog && $.blockUI ?
 325                         'static' : (isFixed ? 'fixed' : 'absolute')), display: 'none',
 326                 left: offset.left + 'px', top: offset.top + 'px'
 327             });
 328             if (!inst.inline) {
 329                 var showAnim = $.timepicker._get(inst, 'showAnim');
 330                 var duration = $.timepicker._get(inst, 'duration');
 331                 var postProcess = function () {
 332                     $.timepicker._timepickerShowing = true;
 333                     var borders = $.timepicker._getBorders(inst.tpDiv);
 334                     inst.tpDiv.find('iframe.ui-timepicker-cover'). // IE6- only
 335                                         css({ left: -borders[0], top: -borders[1],
 336                                             width: inst.tpDiv.outerWidth(), height: inst.tpDiv.outerHeight()
 337                                         });
 338                 };
 339                 inst.tpDiv.zIndex($(input).zIndex() + 1);
 340                 if ($.effects && $.effects[showAnim]) {
 341                     inst.tpDiv.show(showAnim, $.timepicker._get(inst, 'showOptions'), duration, postProcess);
 342                 }
 343                 else {
 344                     inst.tpDiv[showAnim || 'show']((showAnim ? duration : null), postProcess);
 345                 }
 346                 if (!showAnim || !duration) { postProcess(); }
 347                 if (inst.input.is(':visible') && !inst.input.is(':disabled')) { inst.input.focus(); }
 348                 $.timepicker._curInst = inst;
 349             }
 350         },
 351
 352         /* Generate the time picker content. */
 353         _updateTimepicker: function (inst) {
 354             var self = this;
 355             var borders = $.timepicker._getBorders(inst.tpDiv);
 356             inst.tpDiv.empty().append(this._generateHTML(inst))
 357                         .find('iframe.ui-timepicker-cover') // IE6- only
 358                                 .css({ left: -borders[0], top: -borders[1],
 359                                     width: inst.tpDiv.outerWidth(), height: inst.tpDiv.outerHeight()
 360                                 })
 361                         .end()
 362                         .find('.ui-timepicker td a')
 363                                 .bind('mouseout', function () {
 364                                     $(this).removeClass('ui-state-hover');
 365                                     if (this.className.indexOf('ui-timepicker-prev') != -1) $(this).removeClass('ui-timepicker-prev-hover');
 366                                     if (this.className.indexOf('ui-timepicker-next') != -1) $(this).removeClass('ui-timepicker-next-hover');
 367                                 })
 368                                 .bind('mouseover', function () {
 369                                     if (!self._isDisabledTimepicker(inst.inline ? inst.tpDiv.parent()[0] : inst.input[0])) {
 370                                         $(this).parents('.ui-timepicker-calendar').find('a').removeClass('ui-state-hover');
 371                                         $(this).addClass('ui-state-hover');
 372                                         if (this.className.indexOf('ui-timepicker-prev') != -1) $(this).addClass('ui-timepicker-prev-hover');
 373                                         if (this.className.indexOf('ui-timepicker-next') != -1) $(this).addClass('ui-timepicker-next-hover');
 374                                     }
 375                                 })
 376                         .end()
 377                         .find('.' + this._dayOverClass + ' a')
 378                                 .trigger('mouseover')
 379                         .end();
 380         },
 381
 382         /* Generate the HTML for the current state of the date picker. */
 383         _generateHTML: function (inst) {
 384             var h, m, html = '';
 385             var showPeriod = (this._get(inst, 'showPeriod') == true);
 386             var showLeadingZero = (this._get(inst, 'showLeadingZero') == true);
 387
 388             var amPmText = this._get(inst, 'amPmText');
 389
 390
 391             html = '<table class="ui-timepicker-table ui-widget-content ui-corner-all"><tr>' +
 392                    '<td class="ui-timepicker-hours">' +
 393                    '<div class="ui-timepicker-title ui-widget-header ui-helper-clearfix ui-corner-all">' +
 394                    this._get(inst, 'hourText') +
 395                    '</div>' +
 396                    '<table class="ui-timepicker">';
 397
 398             // AM
 399             html += '<tr><th rowspan="2" class="periods">' + amPmText[0] + '</th>';
 400             for (h = 0; h <= 5; h++) {
 401                 html += this._generateHTMLHourCell(inst, h, showPeriod, showLeadingZero);
 402             }
 403
 404             html += '</tr><tr>';
 405             for (h = 6; h <= 11; h++) {
 406                 html += this._generateHTMLHourCell(inst, h, showPeriod, showLeadingZero);
 407             }
 408
 409             // PM
 410             html += '</tr><tr><th rowspan="2" class="periods">' + amPmText[1] + '</th>';
 411             for (h = 12; h <= 17; h++) {
 412                 html += this._generateHTMLHourCell(inst, h, showPeriod, showLeadingZero);
 413             }
 414
 415             html += '</tr><tr>';
 416             for (h = 18; h <= 23; h++) {
 417                 html += this._generateHTMLHourCell(inst, h, showPeriod, showLeadingZero);
 418             }
 419             html += '</tr></table>' + // Close the hours cells table
 420                     '</td>' +         // Close the Hour td
 421                     '<td class="ui-timepicker-minutes">';
 422
 423             html += this._generateHTMLMinutes(inst);
 424
 425             html += '</td></tr></table>';
 426
 427             return html;
 428         },
 429
 430         /* Special function that update the minutes selection in currently visible timepicker
 431          * called on hour selection when onMinuteShow is defined  */
 432         _updateMinuteDisplay: function (inst) {
 433             var newHtml = this._generateHTMLMinutes(inst);
 434             inst.tpDiv.find('td.ui-timepicker-minutes').html(newHtml);
 435         },
 436
 437         /* Generate the minutes table */
 438         _generateHTMLMinutes: function (inst) {
 439
 440             var m;
 441             var showMinutesLeadingZero = (this._get(inst, 'showMinutesLeadingZero') == true);
 442             var onMinuteShow = this._get(inst, 'onMinuteShow');
 443             // if currently selected minute is not enabled, we have a problem and need to select a new minute.
 444             if ( (onMinuteShow) ) {
 445
 446                 if (onMinuteShow.apply((inst.input ? inst.input[0] : null), [inst.hours , inst.minutes]) == false) {
 447                     // loop minutes and select first available
 448                     for (m = 0; m < 60; m += 5) {
 449                         if (onMinuteShow.apply((inst.input ? inst.input[0] : null), [inst.hours, m])) {
 450                             inst.minutes = m;
 451                             break;
 452                         }
 453                     }
 454                 }
 455             }
 456
 457             var html = '' + // open minutes td
 458                        /* Add the minutes */
 459                        '<div class="ui-timepicker-title ui-widget-header ui-helper-clearfix ui-corner-all">' +
 460                        this._get(inst, 'minuteText') +
 461                        '</div>' +
 462                        '<table class="ui-timepicker">' +
 463                        '<tr>';
 464 ;
 465
 466             for (m = 0; m < 15; m += 5) {
 467                 html += this._generateHTMLMinuteCell(inst, m, (m < 10) && showMinutesLeadingZero ? "0" + m.toString() : m.toString());
 468             }
 469             html += '</tr><tr>';
 470             for (m = 15; m < 30; m += 5) {
 471                 html += this._generateHTMLMinuteCell(inst, m, m.toString());
 472             }
 473             html += '</tr><tr>';
 474             for (m = 30; m < 45; m += 5) {
 475                 html += this._generateHTMLMinuteCell(inst, m, m.toString());
 476             }
 477             html += '</tr><tr>';
 478             for (m = 45; m < 60; m += 5) {
 479                 html += this._generateHTMLMinuteCell(inst, m, m.toString());
 480             }
 481
 482             html += '</tr></table>';
 483
 484             return html;
 485         },
 486
 487         /* Generate the content of a "Hour" cell */
 488         _generateHTMLHourCell: function (inst, hour, showPeriod, showLeadingZero) {
 489
 490             var displayHour = hour;
 491             if ((hour > 12) && showPeriod) {
 492                 displayHour = hour - 12;
 493             }
 494             if ((displayHour == 0) && showPeriod) {
 495                 displayHour = 12;
 496             }
 497             if ((displayHour < 10) && showLeadingZero) {
 498                 displayHour = '0' + displayHour;
 499             }
 500
 501             var html = "";
 502             var enabled = true;
 503             var onHourShow = this._get(inst, 'onHourShow');             //custom callback
 504             if (onHourShow) {
 505                 enabled = onHourShow.apply((inst.input ? inst.input[0] : null), [hour]);
 506             }
 507
 508             if (enabled) {
 509                 html = '<td ' +
 510                    'onclick="TP_jQuery_' + tpuuid + '.timepicker.selectHours(\'#' + inst.id + '\', ' + hour.toString() + ', this ); return false;" ' +
 511                    'ondblclick="TP_jQuery_' + tpuuid + '.timepicker.selectHours(\'#' + inst.id + '\', ' + hour.toString() + ', this, true ); return false;" ' +
 512                    '>' +
 513                    '<a href="#" class="ui-state-default ' +
 514                    (hour == inst.hours ? 'ui-state-active' : '') +
 515                    '">' +
 516                    displayHour.toString() +
 517                    '</a></td>';
 518             }
 519             else {
 520                 html =
 521                         '<td>' +
 522                                 '<span class="ui-state-default ui-state-disabled' +
 523                                 (hour == inst.hours ? 'ui-state-active' : '') +
 524                                 '">' +
 525                                 displayHour.toString() +
 526                                 '</span>' +
 527                             '</td>';
 528             }
 529             return html;
 530         },
 531
 532         /* Generate the content of a "Hour" cell */
 533         _generateHTMLMinuteCell: function (inst, minute, displayText) {
 534                  var html = "";
 535              var enabled = true;
 536              var onMinuteShow = this._get(inst, 'onMinuteShow');                //custom callback
 537              if (onMinuteShow) {
 538                  //NEW: 2011-02-03  we should give the hour as a parameter as well!
 539                 enabled = onMinuteShow.apply((inst.input ? inst.input[0] : null), [inst.hours,minute]);         //trigger callback
 540              }
 541
 542              if (enabled) {
 543                     html = '<td ' +
 544                            'onclick="TP_jQuery_' + tpuuid + '.timepicker.selectMinutes(\'#' + inst.id + '\', ' + minute.toString() + ', this ); return false;" ' +
 545                            'ondblclick="TP_jQuery_' + tpuuid + '.timepicker.selectMinutes(\'#' + inst.id + '\', ' + minute.toString() + ', this, true ); return false;" ' +
 546                            '>' +
 547                            '<a href="#" class="ui-state-default ' +
 548                            (minute == inst.minutes ? 'ui-state-active' : '') +
 549                            '" >' +
 550                            displayText +
 551                            '</a></td>';
 552              }
 553              else {
 554
 555                 html = '<td>' +
 556                          '<span class="ui-state-default ui-state-disabled" >' +
 557                                 displayText +
 558                          '</span>' +
 559                  '</td>';
 560              }
 561              return html;
 562         },
 563
 564         /* Is the first field in a jQuery collection disabled as a timepicker?
 565         @param  target    element - the target input field or division or span
 566         @return boolean - true if disabled, false if enabled */
 567         _isDisabledTimepicker: function (target) {
 568             if (!target) { return false; }
 569             for (var i = 0; i < this._disabledInputs.length; i++) {
 570                 if (this._disabledInputs[i] == target) { return true; }
 571             }
 572             return false;
 573         },
 574
 575         /* Check positioning to remain on screen. */
 576         _checkOffset: function (inst, offset, isFixed) {
 577             var tpWidth = inst.tpDiv.outerWidth();
 578             var tpHeight = inst.tpDiv.outerHeight();
 579             var inputWidth = inst.input ? inst.input.outerWidth() : 0;
 580             var inputHeight = inst.input ? inst.input.outerHeight() : 0;
 581             var viewWidth = document.documentElement.clientWidth + $(document).scrollLeft();
 582             var viewHeight = document.documentElement.clientHeight + $(document).scrollTop();
 583
 584             offset.left -= (this._get(inst, 'isRTL') ? (tpWidth - inputWidth) : 0);
 585             offset.left -= (isFixed && offset.left == inst.input.offset().left) ? $(document).scrollLeft() : 0;
 586             offset.top -= (isFixed && offset.top == (inst.input.offset().top + inputHeight)) ? $(document).scrollTop() : 0;
 587
 588             // now check if datepicker is showing outside window viewport - move to a better place if so.
 589             offset.left -= Math.min(offset.left, (offset.left + tpWidth > viewWidth && viewWidth > tpWidth) ?
 590                         Math.abs(offset.left + tpWidth - viewWidth) : 0);
 591             offset.top -= Math.min(offset.top, (offset.top + tpHeight > viewHeight && viewHeight > tpHeight) ?
 592                         Math.abs(tpHeight + inputHeight) : 0);
 593
 594             return offset;
 595         },
 596
 597         /* Find an object's position on the screen. */
 598         _findPos: function (obj) {
 599             var inst = this._getInst(obj);
 600             var isRTL = this._get(inst, 'isRTL');
 601             while (obj && (obj.type == 'hidden' || obj.nodeType != 1)) {
 602                 obj = obj[isRTL ? 'previousSibling' : 'nextSibling'];
 603             }
 604             var position = $(obj).offset();
 605             return [position.left, position.top];
 606         },
 607
 608         /* Retrieve the size of left and top borders for an element.
 609         @param  elem  (jQuery object) the element of interest
 610         @return  (number[2]) the left and top borders */
 611         _getBorders: function (elem) {
 612             var convert = function (value) {
 613                 return { thin: 1, medium: 2, thick: 3}[value] || value;
 614             };
 615             return [parseFloat(convert(elem.css('border-left-width'))),
 616                         parseFloat(convert(elem.css('border-top-width')))];
 617         },
 618
 619
 620         /* Close time picker if clicked elsewhere. */
 621         _checkExternalClick: function (event) {
 622             if (!$.timepicker._curInst) { return; }
 623             var $target = $(event.target);
 624             if ($target[0].id != $.timepicker._mainDivId &&
 625                                 $target.parents('#' + $.timepicker._mainDivId).length == 0 &&
 626                                 !$target.hasClass($.timepicker.markerClassName) &&
 627                                 !$target.hasClass($.timepicker._triggerClass) &&
 628                                 $.timepicker._timepickerShowing && !($.timepicker._inDialog && $.blockUI))
 629                 $.timepicker._hideTimepicker();
 630         },
 631
 632         /* Hide the time picker from view.
 633         @param  input  element - the input field attached to the time picker */
 634         _hideTimepicker: function (input) {
 635             var inst = this._curInst;
 636             if (!inst || (input && inst != $.data(input, PROP_NAME))) { return; }
 637             if (this._timepickerShowing) {
 638                 var showAnim = this._get(inst, 'showAnim');
 639                 var duration = this._get(inst, 'duration');
 640                 var postProcess = function () {
 641                     $.timepicker._tidyDialog(inst);
 642                     this._curInst = null;
 643                 };
 644                 if ($.effects && $.effects[showAnim]) {
 645                     inst.tpDiv.hide(showAnim, $.timepicker._get(inst, 'showOptions'), duration, postProcess);
 646                 }
 647                 else {
 648                     inst.tpDiv[(showAnim == 'slideDown' ? 'slideUp' :
 649                                             (showAnim == 'fadeIn' ? 'fadeOut' : 'hide'))]((showAnim ? duration : null), postProcess);
 650                 }
 651                 if (!showAnim) { postProcess(); }
 652                 var onClose = this._get(inst, 'onClose');
 653                 if (onClose) {
 654                     onClose.apply(
 655                         (inst.input ? inst.input[0] : null),
 656                                             [(inst.input ? inst.input.val() : ''), inst]);  // trigger custom callback
 657                 }
 658                 this._timepickerShowing = false;
 659                 this._lastInput = null;
 660                 if (this._inDialog) {
 661                     this._dialogInput.css({ position: 'absolute', left: '0', top: '-100px' });
 662                     if ($.blockUI) {
 663                         $.unblockUI();
 664                         $('body').append(this.tpDiv);
 665                     }
 666                 }
 667                 this._inDialog = false;
 668             }
 669         },
 670
 671         /* Tidy up after a dialog display. */
 672         _tidyDialog: function (inst) {
 673             inst.tpDiv.removeClass(this._dialogClass).unbind('.ui-timepicker');
 674         },
 675
 676         /* Retrieve the instance data for the target control.
 677         @param  target  element - the target input field or division or span
 678         @return  object - the associated instance data
 679         @throws  error if a jQuery problem getting data */
 680         _getInst: function (target) {
 681             try {
 682                 return $.data(target, PROP_NAME);
 683             }
 684             catch (err) {
 685                 throw 'Missing instance data for this timepicker';
 686             }
 687         },
 688
 689         /* Get a setting value, defaulting if necessary. */
 690         _get: function (inst, name) {
 691             return inst.settings[name] !== undefined ?
 692                         inst.settings[name] : this._defaults[name];
 693         },
 694
 695         /* Parse existing time and initialise time picker. */
 696         _setTimeFromField: function (inst) {
 697             if (inst.input.val() == inst.lastVal) { return; }
 698             var defaultTime = this._get(inst, 'defaultTime');
 699
 700
 701             var timeToParse = this._getCurrentTimeRounded(inst);
 702             if (defaultTime != '') { timeToParse = defaultTime }
 703             if ((inst.inline == false) && (inst.input.val() != '')) { timeToParse = inst.input.val() }
 704
 705             var timeVal = inst.lastVal = timeToParse;
 706
 707             var time = this.parseTime(inst, timeVal);
 708             inst.hours = time.hours;
 709             inst.minutes = time.minutes;
 710
 711             $.timepicker._updateTimepicker(inst);
 712         },
 713         /* Set the dates for a jQuery selection.
 714             @param  target   element - the target input field or division or span
 715             @param  date     Date - the new date */
 716             _setTimeTimepicker: function(target, time) {
 717                     var inst = this._getInst(target);
 718                     if (inst) {
 719                             this._setTime(inst, time);
 720                         this._updateTimepicker(inst);
 721                         this._updateAlternate(inst);
 722                     }
 723             },
 724
 725         /* Set the tm directly. */
 726         _setTime: function(inst, time, noChange) {
 727             var clear = !time;
 728             var origHours = inst.hours;
 729             var origMinutes = inst.minutes;
 730             var time = this.parseTime(inst, time);
 731             inst.hours = time.hours;
 732             inst.minutes = time.minutes;
 733
 734             if ((origHours != inst.hours || origMinutes != inst.minuts) && !noChange) {
 735                 inst.input.trigger('change');
 736             }
 737             this._updateTimepicker(inst);
 738             this._updateSelectedValue(inst);
 739         },
 740
 741         /* Return the current time, ready to be parsed, rounded to the closest 5 minute */
 742         _getCurrentTimeRounded: function (inst) {
 743             var currentTime = new Date();
 744             var timeSeparator = this._get(inst, 'timeSeparator');
 745             // setting selected time , least priority first
 746             var currentMinutes = currentTime.getMinutes()
 747             // round to closest 5
 748             currentMinutes = Math.round( currentMinutes / 5 ) * 5;
 749
 750             return currentTime.getHours().toString() + timeSeparator + currentMinutes.toString();
 751         },
 752
 753         /*
 754         * Pase a time string into hours and minutes
 755         */
 756         parseTime: function (inst, timeVal) {
 757             var retVal = new Object();
 758             retVal.hours = -1;
 759             retVal.minutes = -1;
 760
 761             var timeSeparator = this._get(inst, 'timeSeparator');
 762             var amPmText = this._get(inst, 'amPmText');
 763             var p = timeVal.indexOf(timeSeparator);
 764             if (p == -1) { return retVal; }
 765
 766             retVal.hours = parseInt(timeVal.substr(0, p), 10);
 767             retVal.minutes = parseInt(timeVal.substr(p + 1), 10);
 768
 769             var showPeriod = (this._get(inst, 'showPeriod') == true);
 770             var timeValUpper = timeVal.toUpperCase();
 771             if ((retVal.hours < 12) && (showPeriod) && (timeValUpper.indexOf(amPmText[1].toUpperCase()) != -1)) {
 772                 retVal.hours += 12;
 773             }
 774             // fix for 12 AM
 775             if ((retVal.hours == 12) && (showPeriod) && (timeValUpper.indexOf(amPmText[0].toUpperCase()) != -1)) {
 776                 retVal.hours = 0;
 777             }
 778
 779             return retVal;
 780         },
 781
 782
 783
 784         selectHours: function (id, newHours, td, fromDoubleClick) {
 785             var target = $(id);
 786             var inst = this._getInst(target[0]);
 787             $(td).parents('.ui-timepicker-hours:first').find('a').removeClass('ui-state-active');
 788             //inst.tpDiv.children('.ui-timepicker-hours a').removeClass('ui-state-active');
 789             $(td).children('a').addClass('ui-state-active');
 790
 791             inst.hours = newHours;
 792             this._updateSelectedValue(inst);
 793
 794             inst._hoursClicked = true;
 795             if ((inst._minutesClicked) || (fromDoubleClick)) {
 796                 $.timepicker._hideTimepicker();
 797                 return;
 798             }
 799             // added for onMinuteShow callback
 800             var onMinuteShow = this._get(inst, 'onMinuteShow');
 801             if (onMinuteShow) { this._updateMinuteDisplay(inst); }
 802         },
 803
 804         selectMinutes: function (id, newMinutes, td, fromDoubleClick) {
 805             var target = $(id);
 806             var inst = this._getInst(target[0]);
 807             $(td).parents('.ui-timepicker-minutes:first').find('a').removeClass('ui-state-active');
 808             $(td).children('a').addClass('ui-state-active');
 809
 810             inst.minutes = newMinutes;
 811             this._updateSelectedValue(inst);
 812
 813             inst._minutesClicked = true;
 814             if ((inst._hoursClicked) || (fromDoubleClick)) { $.timepicker._hideTimepicker(); }
 815         },
 816
 817         _updateSelectedValue: function (inst) {
 818             if ((inst.hours < 0) || (inst.hours > 23)) { inst.hours = 12; }
 819             if ((inst.minutes < 0) || (inst.minutes > 59)) { inst.minutes = 0; }
 820
 821             var period = "";
 822             var showPeriod = (this._get(inst, 'showPeriod') == true);
 823             var showLeadingZero = (this._get(inst, 'showLeadingZero') == true);
 824             var amPmText = this._get(inst, 'amPmText');
 825             var selectedHours = inst.hours ? inst.hours : 0;
 826             var selectedMinutes = inst.minutes ? inst.minutes : 0;
 827
 828             var displayHours = selectedHours;
 829             if ( ! displayHours) {
 830                 displayHoyrs = 0;
 831             }
 832
 833
 834             if (showPeriod) {
 835                 if (inst.hours == 0) {
 836                     displayHours = 12;
 837                 }
 838                 if (inst.hours < 12) {
 839                     period = amPmText[0];
 840                 }
 841                 else {
 842                     period = amPmText[1];
 843                     if (displayHours > 12) {
 844                         displayHours -= 12;
 845                     }
 846                 }
 847             }
 848
 849             var h = displayHours.toString();
 850             if (showLeadingZero && (displayHours < 10)) { h = '0' + h; }
 851
 852
 853             var m = selectedMinutes.toString();
 854             if (selectedMinutes < 10) { m = '0' + m; }
 855
 856             var newTime = h + this._get(inst, 'timeSeparator') + m;
 857             if (period.length > 0) { newTime += " " + period; }
 858
 859             if (inst.input) {
 860                 inst.input.val(newTime);
 861                 inst.input.trigger('change');
 862             }
 863
 864             var onSelect = this._get(inst, 'onSelect');
 865             if (onSelect) { onSelect.apply((inst.input ? inst.input[0] : null), [newTime, inst]); } // trigger custom callback
 866
 867             this._updateAlternate(inst, newTime);
 868
 869             return newTime;
 870         },
 871
 872         /* Update any alternate field to synchronise with the main field. */
 873         _updateAlternate: function(inst, newTime) {
 874             var altField = this._get(inst, 'altField');
 875             if (altField) { // update alternate field too
 876                 $(altField).each(function() { $(this).val(newTime); });
 877             }
 878         }
 879     });
 880
 881
 882
 883     /* Invoke the timepicker functionality.
 884     @param  options  string - a command, optionally followed by additional parameters or
 885     Object - settings for attaching new datepicker functionality
 886     @return  jQuery object */
 887     $.fn.timepicker = function (options) {
 888
 889         /* Initialise the date picker. */
 890         if (!$.timepicker.initialized) {
 891             $(document).mousedown($.timepicker._checkExternalClick).
 892                         find('body').append($.timepicker.tpDiv);
 893             $.timepicker.initialized = true;
 894         }
 895
 896         var otherArgs = Array.prototype.slice.call(arguments, 1);
 897         if (typeof options == 'string' && (options == 'isDisabled' || options == 'getTime' || options == 'widget'))
 898             return $.timepicker['_' + options + 'Datepicker'].
 899                         apply($.timepicker, [this[0]].concat(otherArgs));
 900         if (options == 'option' && arguments.length == 2 && typeof arguments[1] == 'string')
 901             return $.timepicker['_' + options + 'Datepicker'].
 902                         apply($.timepicker, [this[0]].concat(otherArgs));
 903         return this.each(function () {
 904             typeof options == 'string' ?
 905                         $.timepicker['_' + options + 'Timepicker'].
 906                                 apply($.timepicker, [this].concat(otherArgs)) :
 907                         $.timepicker._attachTimepicker(this, options);
 908         });
 909     };
 910
 911     /* jQuery extend now ignores nulls! */
 912     function extendRemove(target, props) {
 913         $.extend(target, props);
 914         for (var name in props)
 915             if (props[name] == null || props[name] == undefined)
 916                 target[name] = props[name];
 917         return target;
 918     };
 919
 920     $.timepicker = new Timepicker(); // singleton instance
 921     $.timepicker.initialized = false;
 922     $.timepicker.uuid = new Date().getTime();
 923     $.timepicker.version = "1.8.6";
 924
 925     // Workaround for #4055
 926     // Add another global to avoid noConflict issues with inline event handlers
 927     window['TP_jQuery_' + tpuuid] = $;
 928
 929 })(jQuery);