README.md

@@ -26,28 +26,6 @@ $('.my-datepicker').datepicker([options])
 
 ## Change log
 
-### v2.2.3
-* fixed min,max dates in decade mode
-
-### v2.2.2
-* fixed min,max dates handling
-
-### v2.2.1
-* changed RegExp for recognizing date parts
-* changed jquery version dependency
-
-### v2.2.0
-* added `onlyTimepicker` option
-* added `onShow` and `onHide` callbacks
-* added `VERSION` field to plugin's prototype
-* now for selecting same date in `range` mode, you should set `{toggleSelected: false}`
-* fixed `dateFormat` method (fixed wrong month name in Hungarian language)
-* fixed second call of `onRenderCallback`
-* fixed `_getCell()` throwing exception
-* new language:
-    - `sk` thanks to [RobiNN1](https://github.com/RobiNN1)
-
-
 ### v2.1.0
 * added possibility to select single date when `{range: true}`
 * added support of 12 hours mode in `altFieldDateFormat`

bower.json

@@ -1,6 +1,6 @@
 {
   "name": "air-datepicker",
-  "version": "2.2.3",
+  "version": "2.1.0",
   "authors": [
     "t1m0n <t1m0n.tr@gmail.com>"
   ],
@@ -30,6 +30,6 @@
     "tests"
   ],
   "dependencies": {
-    "jquery": ">=2.0.0 <4.0.0"
+    "jquery": "^3.0.0"
   }
 }

dist/css/datepicker.css

@@ -18,46 +18,31 @@
     background: none;
     border: none; }
 
-.datepicker--cell-day.-other-month-, .datepicker--cell-year.-other-decade- {
-  color: #dedede; }
-  .datepicker--cell-day.-other-month-:hover, .datepicker--cell-year.-other-decade-:hover {
-    color: #c5c5c5; }
-  .-disabled-.-focus-.datepicker--cell-day.-other-month-, .-disabled-.-focus-.datepicker--cell-year.-other-decade- {
-    color: #dedede; }
-  .-selected-.datepicker--cell-day.-other-month-, .-selected-.datepicker--cell-year.-other-decade- {
-    color: #fff;
-    background: #a2ddf6; }
-    .-selected-.-focus-.datepicker--cell-day.-other-month-, .-selected-.-focus-.datepicker--cell-year.-other-decade- {
-      background: #8ad5f4; }
-  .-in-range-.datepicker--cell-day.-other-month-, .-in-range-.datepicker--cell-year.-other-decade- {
-    background-color: rgba(92, 196, 239, 0.1);
-    color: #cccccc; }
-    .-in-range-.-focus-.datepicker--cell-day.-other-month-, .-in-range-.-focus-.datepicker--cell-year.-other-decade- {
-      background-color: rgba(92, 196, 239, 0.2); }
-  .datepicker--cell-day.-other-month-:empty, .datepicker--cell-year.-other-decade-:empty {
-    background: none;
-    border: none; }
-
 /* -------------------------------------------------
     Datepicker cells
    ------------------------------------------------- */
 .datepicker--cells {
+  display: -webkit-flex;
   display: -ms-flexbox;
   display: flex;
-  -ms-flex-wrap: wrap;
-      flex-wrap: wrap; }
+  -webkit-flex-wrap: wrap;
+      -ms-flex-wrap: wrap;
+          flex-wrap: wrap; }
 
 .datepicker--cell {
   border-radius: 4px;
   box-sizing: border-box;
   cursor: pointer;
+  display: -webkit-flex;
   display: -ms-flexbox;
   display: flex;
   position: relative;
-  -ms-flex-align: center;
-      align-items: center;
-  -ms-flex-pack: center;
-      justify-content: center;
+  -webkit-align-items: center;
+      -ms-flex-align: center;
+          align-items: center;
+  -webkit-justify-content: center;
+      -ms-flex-pack: center;
+          justify-content: center;
   height: 32px;
   z-index: 1; }
   .datepicker--cell.-focus- {
@@ -106,22 +91,28 @@
     cursor: default; }
 
 .datepicker--days-names {
+  display: -webkit-flex;
   display: -ms-flexbox;
   display: flex;
-  -ms-flex-wrap: wrap;
-      flex-wrap: wrap;
+  -webkit-flex-wrap: wrap;
+      -ms-flex-wrap: wrap;
+          flex-wrap: wrap;
   margin: 8px 0 3px; }
 
 .datepicker--day-name {
   color: #FF9A19;
+  display: -webkit-flex;
   display: -ms-flexbox;
   display: flex;
-  -ms-flex-align: center;
-      align-items: center;
-  -ms-flex-pack: center;
-      justify-content: center;
-  -ms-flex: 1;
-      flex: 1;
+  -webkit-align-items: center;
+      -ms-flex-align: center;
+          align-items: center;
+  -webkit-justify-content: center;
+      -ms-flex-pack: center;
+          justify-content: center;
+  -webkit-flex: 1;
+      -ms-flex: 1;
+          flex: 1;
   text-align: center;
   text-transform: uppercase;
   font-size: .8em; }
@@ -190,20 +181,29 @@
   position: absolute;
   left: -100000px;
   opacity: 0;
+  transition: opacity 0.3s ease, left 0s 0.3s, -webkit-transform 0.3s ease;
   transition: opacity 0.3s ease, transform 0.3s ease, left 0s 0.3s;
+  transition: opacity 0.3s ease, transform 0.3s ease, left 0s 0.3s, -webkit-transform 0.3s ease;
   z-index: 100; }
   .datepicker.-from-top- {
-    transform: translateY(-8px); }
+    -webkit-transform: translateY(-8px);
+            transform: translateY(-8px); }
   .datepicker.-from-right- {
-    transform: translateX(8px); }
+    -webkit-transform: translateX(8px);
+            transform: translateX(8px); }
   .datepicker.-from-bottom- {
-    transform: translateY(8px); }
+    -webkit-transform: translateY(8px);
+            transform: translateY(8px); }
   .datepicker.-from-left- {
-    transform: translateX(-8px); }
+    -webkit-transform: translateX(-8px);
+            transform: translateX(-8px); }
   .datepicker.active {
     opacity: 1;
-    transform: translate(0);
-    transition: opacity 0.3s ease, transform 0.3s ease, left 0s 0s; }
+    -webkit-transform: translate(0);
+            transform: translate(0);
+    transition: opacity 0.3s ease, left 0s 0s, -webkit-transform 0.3s ease;
+    transition: opacity 0.3s ease, transform 0.3s ease, left 0s 0s;
+    transition: opacity 0.3s ease, transform 0.3s ease, left 0s 0s, -webkit-transform 0.3s ease; }
 
 .datepicker-inline .datepicker {
   border-color: #d7d7d7;
@@ -212,7 +212,8 @@
   left: auto;
   right: auto;
   opacity: 1;
-  transform: none; }
+  -webkit-transform: none;
+          transform: none; }
 
 .datepicker-inline .datepicker--pointer {
   display: none; }
@@ -220,8 +221,6 @@
 .datepicker--content {
   box-sizing: content-box;
   padding: 4px; }
-  .-only-timepicker- .datepicker--content {
-    display: none; }
 
 .datepicker--pointer {
   position: absolute;
@@ -233,16 +232,20 @@
   z-index: -1; }
   .-top-left- .datepicker--pointer, .-top-center- .datepicker--pointer, .-top-right- .datepicker--pointer {
     top: calc(100% - 4px);
-    transform: rotate(135deg); }
+    -webkit-transform: rotate(135deg);
+            transform: rotate(135deg); }
   .-right-top- .datepicker--pointer, .-right-center- .datepicker--pointer, .-right-bottom- .datepicker--pointer {
     right: calc(100% - 4px);
-    transform: rotate(225deg); }
+    -webkit-transform: rotate(225deg);
+            transform: rotate(225deg); }
   .-bottom-left- .datepicker--pointer, .-bottom-center- .datepicker--pointer, .-bottom-right- .datepicker--pointer {
     bottom: calc(100% - 4px);
-    transform: rotate(315deg); }
+    -webkit-transform: rotate(315deg);
+            transform: rotate(315deg); }
   .-left-top- .datepicker--pointer, .-left-center- .datepicker--pointer, .-left-bottom- .datepicker--pointer {
     left: calc(100% - 4px);
-    transform: rotate(45deg); }
+    -webkit-transform: rotate(45deg);
+            transform: rotate(45deg); }
   .-top-left- .datepicker--pointer, .-bottom-left- .datepicker--pointer {
     left: 10px; }
   .-top-right- .datepicker--pointer, .-bottom-right- .datepicker--pointer {
@@ -285,25 +288,28 @@
     Navigation
    ------------------------------------------------- */
 .datepicker--nav {
+  display: -webkit-flex;
   display: -ms-flexbox;
   display: flex;
-  -ms-flex-pack: justify;
-      justify-content: space-between;
+  -webkit-justify-content: space-between;
+      -ms-flex-pack: justify;
+          justify-content: space-between;
   border-bottom: 1px solid #efefef;
   min-height: 32px;
   padding: 4px; }
-  .-only-timepicker- .datepicker--nav {
-    display: none; }
 
 .datepicker--nav-title,
 .datepicker--nav-action {
+  display: -webkit-flex;
   display: -ms-flexbox;
   display: flex;
   cursor: pointer;
-  -ms-flex-align: center;
-      align-items: center;
-  -ms-flex-pack: center;
-      justify-content: center; }
+  -webkit-align-items: center;
+      -ms-flex-align: center;
+          align-items: center;
+  -webkit-justify-content: center;
+      -ms-flex-pack: center;
+          justify-content: center; }
 
 .datepicker--nav-action {
   width: 32px;
@@ -338,6 +344,7 @@
     background: none; }
 
 .datepicker--buttons {
+  display: -webkit-flex;
   display: -ms-flexbox;
   display: flex;
   padding: 4px;
@@ -347,14 +354,18 @@
   color: #4EB5E6;
   cursor: pointer;
   border-radius: 4px;
-  -ms-flex: 1;
-      flex: 1;
+  -webkit-flex: 1;
+      -ms-flex: 1;
+          flex: 1;
+  display: -webkit-inline-flex;
   display: -ms-inline-flexbox;
   display: inline-flex;
-  -ms-flex-pack: center;
-      justify-content: center;
-  -ms-flex-align: center;
-      align-items: center;
+  -webkit-justify-content: center;
+      -ms-flex-pack: center;
+          justify-content: center;
+  -webkit-align-items: center;
+      -ms-flex-align: center;
+          align-items: center;
   height: 32px; }
   .datepicker--button:hover {
     color: #4a4a4a;
@@ -385,22 +396,24 @@
    ------------------------------------------------- */
 .datepicker--time {
   border-top: 1px solid #efefef;
+  display: -webkit-flex;
   display: -ms-flexbox;
   display: flex;
-  -ms-flex-align: center;
-      align-items: center;
+  -webkit-align-items: center;
+      -ms-flex-align: center;
+          align-items: center;
   padding: 4px;
   position: relative; }
   .datepicker--time.-am-pm- .datepicker--time-sliders {
-    -ms-flex: 0 1 138px;
-        flex: 0 1 138px;
+    -webkit-flex: 0 1 138px;
+        -ms-flex: 0 1 138px;
+            flex: 0 1 138px;
     max-width: 138px; }
-  .-only-timepicker- .datepicker--time {
-    border-top: none; }
 
 .datepicker--time-sliders {
-  -ms-flex: 0 1 153px;
-      flex: 0 1 153px;
+  -webkit-flex: 0 1 153px;
+      -ms-flex: 0 1 153px;
+          flex: 0 1 153px;
   margin-right: 10px;
   max-width: 153px; }
 
@@ -409,31 +422,32 @@
   font-size: 12px; }
 
 .datepicker--time-current {
+  display: -webkit-flex;
   display: -ms-flexbox;
   display: flex;
-  -ms-flex-align: center;
-      align-items: center;
-  -ms-flex: 1;
-      flex: 1;
+  -webkit-align-items: center;
+      -ms-flex-align: center;
+          align-items: center;
+  -webkit-flex: 1;
+      -ms-flex: 1;
+          flex: 1;
   font-size: 14px;
   text-align: center;
-  margin: 0 10px; }
+  margin: 0 0 0 10px; }
 
 .datepicker--time-current-colon {
   margin: 0 2px 3px;
   line-height: 1; }
 
 .datepicker--time-current-hours,
-.datepicker--time-current-minutes,
-.datepicker--time-current-seconds {
+.datepicker--time-current-minutes {
   line-height: 1;
-  font-size: 14px;
+  font-size: 19px;
   font-family: "Century Gothic", CenturyGothic, AppleGothic, sans-serif;
   position: relative;
   z-index: 1; }
   .datepicker--time-current-hours:after,
-  .datepicker--time-current-minutes:after,
-  .datepicker--time-current-seconds:after {
+  .datepicker--time-current-minutes:after {
     content: '';
     background: #f0f0f0;
     border-radius: 4px;
@@ -445,24 +459,26 @@
     z-index: -1;
     opacity: 0; }
   .datepicker--time-current-hours.-focus-:after,
-  .datepicker--time-current-minutes.-focus-:after,
-  .datepicker--time-current-seconds.-focus-:after {
+  .datepicker--time-current-minutes.-focus-:after {
     opacity: 1; }
 
 .datepicker--time-current-ampm {
   text-transform: uppercase;
-  -ms-flex-item-align: start;
-      align-self: flex-start;
+  -webkit-align-self: flex-end;
+      -ms-flex-item-align: end;
+          align-self: flex-end;
   color: #9c9c9c;
   margin-left: 6px;
   font-size: 11px;
   margin-bottom: 1px; }
 
 .datepicker--time-row {
+  display: -webkit-flex;
   display: -ms-flexbox;
   display: flex;
-  -ms-flex-align: center;
-      align-items: center;
+  -webkit-align-items: center;
+      -ms-flex-align: center;
+          align-items: center;
   font-size: 11px;
   height: 17px;
   background: linear-gradient(to right, #dedede, #dedede) left 50%/100% 1px no-repeat; }
@@ -471,8 +487,9 @@
   .datepicker--time-row input[type='range'] {
     background: none;
     cursor: pointer;
-    -ms-flex: 1;
-        flex: 1;
+    -webkit-flex: 1;
+        -ms-flex: 1;
+            flex: 1;
     height: 100%;
     padding: 0;
     margin: 0;
@@ -570,9 +587,30 @@
     width: 1px;
     left: calc(50% - 1px);
     top: calc(50% + 1px);
-    transform: translateY(-100%); }
+    -webkit-transform: translateY(-100%);
+            transform: translateY(-100%); }
   .datepicker--time-icon:before {
     width: .4em;
     height: 1px;
     top: calc(50% + 1px);
     left: calc(50% - 1px); }
+
+.datepicker--cell-day.-other-month-, .datepicker--cell-year.-other-decade- {
+  color: #dedede; }
+  .datepicker--cell-day.-other-month-:hover, .datepicker--cell-year.-other-decade-:hover {
+    color: #c5c5c5; }
+  .-disabled-.-focus-.datepicker--cell-day.-other-month-, .-disabled-.-focus-.datepicker--cell-year.-other-decade- {
+    color: #dedede; }
+  .-selected-.datepicker--cell-day.-other-month-, .-selected-.datepicker--cell-year.-other-decade- {
+    color: #fff;
+    background: #a2ddf6; }
+    .-selected-.-focus-.datepicker--cell-day.-other-month-, .-selected-.-focus-.datepicker--cell-year.-other-decade- {
+      background: #8ad5f4; }
+  .-in-range-.datepicker--cell-day.-other-month-, .-in-range-.datepicker--cell-year.-other-decade- {
+    background-color: rgba(92, 196, 239, 0.1);
+    color: #cccccc; }
+    .-in-range-.-focus-.datepicker--cell-day.-other-month-, .-in-range-.-focus-.datepicker--cell-year.-other-decade- {
+      background-color: rgba(92, 196, 239, 0.2); }
+  .datepicker--cell-day.-other-month-:empty, .datepicker--cell-year.-other-decade-:empty {
+    background: none;
+    border: none; }

dist/js/datepicker.js

@@ -1,6 +1,5 @@
 ;(function (window, $, undefined) { ;(function () {
-    var VERSION = '2.2.3',
-        pluginName = 'datepicker',
+    var pluginName = 'datepicker',
         autoInitSelector = '.datepicker-here',
         $body, $datepickersContainer,
         containerBuilt = false,
@@ -63,23 +62,17 @@
 
             // timepicker
             timepicker: false,
-            onlyTimepicker: false,
             dateTimeSeparator: ' ',
             timeFormat: '',
             minHours: 0,
             maxHours: 24,
             minMinutes: 0,
             maxMinutes: 59,
-            minSeconds: 0,
-            maxSeconds: 59,
             hoursStep: 1,
             minutesStep: 1,
-            secondsStep: 1,
 
             // events
             onSelect: '',
-            onShow: '',
-            onHide: '',
             onChangeMonth: '',
             onChangeYear: '',
             onChangeDecade: '',
@@ -145,7 +138,6 @@
     datepicker = Datepicker;
 
     datepicker.prototype = {
-        VERSION: VERSION,
         viewIndexes: ['days', 'months', 'years'],
 
         init: function () {
@@ -162,7 +154,7 @@
                     this._setPositionClasses(this.opts.position);
                     this._bindEvents()
                 }
-                if (this.opts.keyboardNav && !this.opts.onlyTimepicker) {
+                if (this.opts.keyboardNav) {
                     this._bindKeyboardEvents();
                 }
                 this.$datepicker.on('mousedown', this._onMouseDownDatepicker.bind(this));
@@ -178,10 +170,6 @@
                 this._bindTimepickerEvents();
             }
 
-            if (this.opts.onlyTimepicker) {
-                this.$datepicker.addClass('-only-timepicker-');
-            }
-
             this.views[this.currentView] = new $.fn.datepicker.Body(this, this.currentView, this.opts);
             this.views[this.currentView].show();
             this.nav = new $.fn.datepicker.Navigation(this, this.opts);
@@ -251,10 +239,6 @@
                 this.loc.dateFormat = [this.loc.dateFormat, this.loc.timeFormat].join(this.opts.dateTimeSeparator);
             }
 
-            if (this.opts.onlyTimepicker) {
-                this.loc.dateFormat = this.loc.timeFormat;
-            }
-
             var boundary = this._getWordBoundaryRegExp;
             if (this.loc.timeFormat.match(boundary('aa')) ||
                 this.loc.timeFormat.match(boundary('AA'))
@@ -305,8 +289,7 @@
                     parsedSelected.month,
                     parsedSelected.date,
                     parsedSelected.hours,
-                    parsedSelected.minutes,
-                    parsedSelected.seconds
+                    parsedSelected.minutes
                 );
 
                 formattedDates = selectedDates.map(function (date) {
@@ -322,11 +305,11 @@
                         parsedDate.month,
                         parsedDate.date,
                         parsedDate.hours,
-                        parsedDate.minutes,
-                        parsedDate.seconds
+                        parsedDate.minutes
                     );
                 })
             }
+
             this._prevOnSelectValue = formattedDates;
             this.opts.onSelect(formattedDates, dates, this);
         },
@@ -381,7 +364,6 @@
                 hours = d.hours,
                 ampm = string.match(boundary('aa')) || string.match(boundary('AA')),
                 dayPeriod = 'am',
-                replacer = this._replacer,
                 validHours;
 
             if (this.opts.timepicker && this.timepicker && ampm) {
@@ -395,63 +377,50 @@
                 case /@/.test(result):
                     result = result.replace(/@/, date.getTime());
                 case /aa/.test(result):
-                    result = replacer(result, boundary('aa'), dayPeriod);
+                    result = result.replace(boundary('aa'), dayPeriod);
                 case /AA/.test(result):
-                    result = replacer(result, boundary('AA'), dayPeriod.toUpperCase());
+                    result = result.replace(boundary('AA'), dayPeriod.toUpperCase());
                 case /dd/.test(result):
-                    result = replacer(result, boundary('dd'), d.fullDate);
+                    result = result.replace(boundary('dd'), d.fullDate);
                 case /d/.test(result):
-                    result = replacer(result, boundary('d'), d.date);
+                    result = result.replace(boundary('d'), d.date);
                 case /DD/.test(result):
-                    result = replacer(result, boundary('DD'), locale.days[d.day]);
+                    result = result.replace(boundary('DD'), locale.days[d.day]);
                 case /D/.test(result):
-                    result = replacer(result, boundary('D'), locale.daysShort[d.day]);
+                    result = result.replace(boundary('D'), locale.daysShort[d.day]);
                 case /mm/.test(result):
-                    result = replacer(result, boundary('mm'), d.fullMonth);
+                    result = result.replace(boundary('mm'), d.fullMonth);
                 case /m/.test(result):
-                    result = replacer(result, boundary('m'), d.month + 1);
+                    result = result.replace(boundary('m'), d.month + 1);
                 case /MM/.test(result):
-                    result = replacer(result, boundary('MM'), this.loc.months[d.month]);
+                    result = result.replace(boundary('MM'), this.loc.months[d.month]);
                 case /M/.test(result):
-                    result = replacer(result, boundary('M'), locale.monthsShort[d.month]);
-                case /ss/.test(result):
-                    result = replacer(result, boundary('ss'), d.fullSeconds);
-                case /s/.test(result):
-                    result = replacer(result, boundary('s'), d.seconds);
+                    result = result.replace(boundary('M'), locale.monthsShort[d.month]);
                 case /ii/.test(result):
-                    result = replacer(result, boundary('ii'), d.fullMinutes);
+                    result = result.replace(boundary('ii'), d.fullMinutes);
                 case /i/.test(result):
-                    result = replacer(result, boundary('i'), d.minutes);
+                    result = result.replace(boundary('i'), d.minutes);
                 case /hh/.test(result):
-                    result = replacer(result, boundary('hh'), fullHours);
+                    result = result.replace(boundary('hh'), fullHours);
                 case /h/.test(result):
-                    result = replacer(result, boundary('h'), hours);
+                    result = result.replace(boundary('h'), hours);
                 case /yyyy/.test(result):
-                    result = replacer(result, boundary('yyyy'), d.year);
+                    result = result.replace(boundary('yyyy'), d.year);
                 case /yyyy1/.test(result):
-                    result = replacer(result, boundary('yyyy1'), decade[0]);
+                    result = result.replace(boundary('yyyy1'), decade[0]);
                 case /yyyy2/.test(result):
-                    result = replacer(result, boundary('yyyy2'), decade[1]);
+                    result = result.replace(boundary('yyyy2'), decade[1]);
                 case /yy/.test(result):
-                    result = replacer(result, boundary('yy'), d.year.toString().slice(-2));
+                    result = result.replace(boundary('yy'), d.year.toString().slice(-2));
             }
 
             return result;
         },
 
-        _replacer: function (str, reg, data) {
-            return str.replace(reg, function (match, p1,p2,p3) {
-                return p1 + data + p3;
-            })
-        },
-
         _getWordBoundaryRegExp: function (sign) {
-            var symbols = '\\s|\\.|-|/|\\\\|,|\\$|\\!|\\?|:|;';
-
-            return new RegExp('(^|>|' + symbols + ')(' + sign + ')($|<|' + symbols + ')', 'g');
+            return new RegExp('\\b(?=[a-zA-Z0-9äöüßÄÖÜ<])' + sign + '(?![>a-zA-Z0-9äöüßÄÖÜ])');
         },
 
-
         selectDate: function (date) {
             var _this = this,
                 opts = _this.opts,
@@ -485,7 +454,6 @@
             if (this.timepicker) {
                 date.setHours(this.timepicker.hours);
                 date.setMinutes(this.timepicker.minutes)
-                date.setSeconds(this.timepicker.seconds)
             }
 
             if (_this.view == 'days') {
@@ -627,7 +595,7 @@
             this._syncWithMinMaxDates();
             this._defineLocale(this.opts.language);
             this.nav._addButtonsIfNeed();
-            if (!this.opts.onlyTimepicker) this.nav._render();
+            this.nav._render();
             this.views[this.currentView]._render();
 
             if (this.elIsInput && !this.opts.inline) {
@@ -641,10 +609,6 @@
                 this.$datepicker.addClass(this.opts.classes)
             }
 
-            if (this.opts.onlyTimepicker) {
-                this.$datepicker.addClass('-only-timepicker-');
-            }
-
             if (this.opts.timepicker) {
                 if (lastSelectedDate) this.timepicker._handleDate(lastSelectedDate);
                 this.timepicker._updateRanges();
@@ -653,7 +617,6 @@
                 if (lastSelectedDate) {
                     lastSelectedDate.setHours(this.timepicker.hours);
                     lastSelectedDate.setMinutes(this.timepicker.minutes);
-                    lastSelectedDate.setSeconds(this.timepicker.seconds);
                 }
             }
 
@@ -819,20 +782,12 @@
         },
 
         show: function () {
-            var onShow = this.opts.onShow;
-
             this.setPosition(this.opts.position);
             this.$datepicker.addClass('active');
             this.visible = true;
-
-            if (onShow) {
-                this._bindVisionEvents(onShow)
-            }
         },
 
         hide: function () {
-            var onHide = this.opts.onHide;
-
             this.$datepicker
                 .removeClass('active')
                 .css({
@@ -845,10 +800,6 @@
             this.inFocus = false;
             this.visible = false;
             this.$el.blur();
-
-            if (onHide) {
-                this._bindVisionEvents(onHide)
-            }
         },
 
         down: function (date) {
@@ -859,12 +810,6 @@
             this._changeView(date, 'up');
         },
 
-        _bindVisionEvents: function (event) {
-            this.$datepicker.off('transitionend.dp');
-            event(this, false);
-            this.$datepicker.one('transitionend.dp', event.bind(this, this, true))
-        },
-
         _changeView: function (date, dir) {
             date = date || this.focused || this.date;
 
@@ -1078,7 +1023,7 @@
             }
             $cell = this.views[this.currentView].$el.find(selector);
 
-            return $cell.length ? $cell : $('');
+            return $cell.length ? $cell : '';
         },
 
         destroy: function () {
@@ -1101,30 +1046,6 @@
             }
         },
 
-        _handleAlreadySelectedDates: function (alreadySelected, selectedDate) {
-            if (this.opts.range) {
-                if (!this.opts.toggleSelected) {
-                    // Add possibility to select same date when range is true
-                    if (this.selectedDates.length != 2) {
-                        this._trigger('clickCell', selectedDate);
-                    }
-                } else {
-                    this.removeDate(selectedDate);
-                }
-            } else if (this.opts.toggleSelected){
-                this.removeDate(selectedDate);
-            }
-
-            // Change last selected date to be able to change time when clicking on this cell
-            if (!this.opts.toggleSelected) {
-                this.lastSelectedDate = alreadySelected;
-                if (this.opts.timepicker) {
-                    this.timepicker._setTime(alreadySelected);
-                    this.timepicker.update();
-                }
-            }
-        },
-
         _onShowEvent: function (e) {
             if (!this.visible) {
                 this.show();
@@ -1197,12 +1118,11 @@
                             if (this.timepicker) {
                                 this.focused.setHours(this.timepicker.hours);
                                 this.focused.setMinutes(this.timepicker.minutes);
-                                this.focused.setSeconds(this.timepicker.seconds);
                             }
                             this.selectDate(this.focused);
-                            return;
+                        } else if (alreadySelected && this.opts.toggleSelected){
+                            this.removeDate(this.focused);
                         }
-                        this._handleAlreadySelectedDates(alreadySelected, this.focused)
                     }
                 }
             }
@@ -1259,7 +1179,7 @@
             this.silent = false;
         },
 
-        _onTimeChange: function (e, h, m, s) {
+        _onTimeChange: function (e, h, m) {
             var date = new Date(),
                 selectedDates = this.selectedDates,
                 selected = false;
@@ -1271,7 +1191,6 @@
 
             date.setHours(h);
             date.setMinutes(m);
-            date.setSeconds(s);
 
             if (!selected && !this._getCell(date).hasClass('-disabled-')) {
                 this.selectDate(date);
@@ -1287,7 +1206,6 @@
             if (this.timepicker) {
                 date.setHours(this.timepicker.hours);
                 date.setMinutes(this.timepicker.minutes);
-                date.setSeconds(this.timepicker.seconds)
             }
             this.selectDate(date);
         },
@@ -1411,9 +1329,7 @@
             hours: date.getHours(),
             fullHours:  date.getHours() < 10 ? '0' + date.getHours() :  date.getHours() ,
             minutes: date.getMinutes(),
-            fullMinutes:  date.getMinutes() < 10 ? '0' + date.getMinutes() :  date.getMinutes(),
-            seconds: date.getSeconds(),
-            fullSeconds:  date.getSeconds() < 10 ? '0' + date.getSeconds() :  date.getSeconds()
+            fullMinutes:  date.getMinutes() < 10 ? '0' + date.getMinutes() :  date.getMinutes()
         }
     };
 
@@ -1530,9 +1446,7 @@
         this.d = d;
         this.type = type;
         this.opts = opts;
-        this.$el = $('');
 
-        if (this.opts.onlyTimepicker) return;
         this.init();
     };
 
@@ -1578,6 +1492,12 @@
                 render = {},
                 html = d.date;
 
+            if (opts.onRenderCell) {
+                render = opts.onRenderCell(date, type) || {};
+                html = render.html ? render.html : html;
+                classes += render.classes ? ' ' + render.classes : '';
+            }
+
             switch (type) {
                 case 'day':
                     if (parent.isWeekend(d.day)) classes += " -weekend-";
@@ -1610,7 +1530,6 @@
                 html = render.html ? render.html : html;
                 classes += render.classes ? ' ' + render.classes : '';
             }
-
             if (opts.range) {
                 if (dp.isSame(minRange, date, type)) classes += ' -range-from-';
                 if (dp.isSame(maxRange, date, type)) classes += ' -range-to-';
@@ -1754,7 +1673,6 @@
         },
 
         _render: function () {
-            if (this.opts.onlyTimepicker) return;
             this._renderTypes[this.type].bind(this)();
         },
 
@@ -1773,7 +1691,6 @@
         },
 
         show: function () {
-            if (this.opts.onlyTimepicker) return;
             this.$el.addClass('active');
             this.acitve = true;
         },
@@ -1802,11 +1719,27 @@
 
             if (!alreadySelected) {
                 dp._trigger('clickCell', selectedDate);
-                return;
             }
 
-            dp._handleAlreadySelectedDates.bind(dp, alreadySelected, selectedDate)();
+            if (alreadySelected && this.opts.range) {
+                // Add possibility to select same date when range is true
+                if (dp.selectedDates.length != 2 && !this.opts.toggleSelected || this.opts.toggleSelected) {
+                    dp._trigger('clickCell', selectedDate);
+                    // Change last selected date to be able to change time on last date
+                    dp.lastSelectedDate = alreadySelected;
+                }
+            } else if (alreadySelected && this.opts.toggleSelected){
+                dp.removeDate(selectedDate);
+            }
 
+            // Change last selected date to be able to change time when clicking on this cell
+            if (alreadySelected && !this.opts.toggleSelected) {
+                dp.lastSelectedDate = alreadySelected;
+                if (dp.opts.timepicker) {
+                    dp.timepicker._setTime(alreadySelected);
+                    dp.timepicker.update();
+                }
+            }
         },
 
         _onClickCell: function (e) {
@@ -1851,9 +1784,7 @@
         },
 
         _buildBaseHtml: function () {
-            if (!this.opts.onlyTimepicker) {
-                this._render();
-            }
+            this._render();
             this._addButtonsIfNeed();
         },
 
@@ -1910,10 +1841,10 @@
 
             switch (this.d.view) {
                 case 'days':
-                    if (!this.d._isInRange(new Date(y, m-1, 1), 'month')) {
+                    if (!this.d._isInRange(new Date(y, m-1, d), 'month')) {
                         this._disableNav('prev')
                     }
-                    if (!this.d._isInRange(new Date(y, m+1, 1), 'month')) {
+                    if (!this.d._isInRange(new Date(y, m+1, d), 'month')) {
                         this._disableNav('next')
                     }
                     break;
@@ -1926,11 +1857,10 @@
                     }
                     break;
                 case 'years':
-                    var decade = dp.getDecade(this.d.date);
-                    if (!this.d._isInRange(new Date(decade[0] - 1, 0, 1), 'year')) {
+                    if (!this.d._isInRange(new Date(y-10, m, d), 'year')) {
                         this._disableNav('prev')
                     }
-                    if (!this.d._isInRange(new Date(decade[1] + 1, 0, 1), 'year')) {
+                    if (!this.d._isInRange(new Date(y+10, m, d), 'year')) {
                         this._disableNav('next')
                     }
                     break;
@@ -1968,11 +1898,9 @@
 ;(function () {
     var template = '<div class="datepicker--time">' +
         '<div class="datepicker--time-current">' +
-        '   <span class="datepicker--time-current-hours">#{hourVisible}</span>' +
+        '   <span class="datepicker--time-current-hours">#{hourValue}</span>' +
         '   <span class="datepicker--time-current-colon">:</span>' +
         '   <span class="datepicker--time-current-minutes">#{minValue}</span>' +
-        '   <span class="datepicker--time-current-colon">:</span>' +
-        '   <span class="datepicker--time-current-seconds">#{secValue}</span>' +
         '</div>' +
         '<div class="datepicker--time-sliders">' +
         '   <div class="datepicker--time-row">' +
@@ -1981,9 +1909,6 @@
         '   <div class="datepicker--time-row">' +
         '      <input type="range" name="minutes" value="#{minValue}" min="#{minMin}" max="#{minMax}" step="#{minStep}"/>' +
         '   </div>' +
-        '   <div class="datepicker--time-row">' +
-        '      <input type="range" name="seconds" value="#{secValue}" min="#{secMin}" max="#{secMax}" step="#{secStep}"/>' +
-        '   </div>' +
         '</div>' +
         '</div>',
         datepicker = $.fn.datepicker,
@@ -2019,7 +1944,6 @@
             this._handleDate(date);
             this.hours = _date.hours < this.minHours ? this.minHours : _date.hours;
             this.minutes = _date.minutes < this.minMinutes ? this.minMinutes : _date.minutes;
-            this.seconds = _date.seconds < this.minSeconds ? this.minSeconds : _date.seconds;
         },
 
         /**
@@ -2031,7 +1955,6 @@
         _setMinTimeFromDate: function (date) {
             this.minHours = date.getHours();
             this.minMinutes = date.getMinutes();
-            this.minSeconds = date.getSeconds();
 
             // If, for example, min hours are 10, and current hours are 12,
             // update minMinutes to default value, to be able to choose whole range of values
@@ -2045,7 +1968,6 @@
         _setMaxTimeFromDate: function (date) {
             this.maxHours = date.getHours();
             this.maxMinutes = date.getMinutes();
-            this.maxSeconds = date.getSeconds();
 
             if (this.d.lastSelectedDate) {
                 if (this.d.lastSelectedDate.getHours() < date.getHours()) {
@@ -2057,15 +1979,12 @@
         _setDefaultMinMaxTime: function () {
             var maxHours = 23,
                 maxMinutes = 59,
-                maxSeconds = 59,
                 opts = this.opts;
 
             this.minHours = opts.minHours < 0 || opts.minHours > maxHours ? 0 : opts.minHours;
             this.minMinutes = opts.minMinutes < 0 || opts.minMinutes > maxMinutes ? 0 : opts.minMinutes;
             this.maxHours = opts.maxHours < 0 || opts.maxHours > maxHours ? maxHours : opts.maxHours;
             this.maxMinutes = opts.maxMinutes < 0 || opts.maxMinutes > maxMinutes ? maxMinutes : opts.maxMinutes;
-            this.minSeconds = opts.minSeconds < 0 || opts.minSeconds > maxSeconds ? 0 : opts.minSeconds;
-            this.maxSeconds = opts.maxSeconds < 0 || opts.maxSeconds > maxSeconds ? maxSeconds : opts.maxSeconds;
         },
 
         /**
@@ -2085,12 +2004,6 @@
             } else if (this.minutes > this.maxMinutes) {
                 this.minutes = this.maxMinutes;
             }
-
-            if (this.seconds < this.minSeconds) {
-                this.seconds = this.minSeconds;
-            } else if (this.seconds > this.maxSeconds) {
-                this.seconds = this.maxSeconds;
-            }
         },
 
         _buildHTML: function () {
@@ -2099,16 +2012,11 @@
                     hourMin: this.minHours,
                     hourMax: lz(this.maxHours),
                     hourStep: this.opts.hoursStep,
-                    hourValue: this.hours,
-                    hourVisible: lz(this.displayHours),
+                    hourValue: lz(this.displayHours),
                     minMin: this.minMinutes,
                     minMax: lz(this.maxMinutes),
                     minStep: this.opts.minutesStep,
-                    minValue: lz(this.minutes),
-                    secMin: this.minSeconds,
-                    secMax: lz(this.maxSeconds),
-                    secStep: this.opts.secondsStep,
-                    secValue: lz(this.seconds)
+                    minValue: lz(this.minutes)
                 },
                 _template = dp.template(template, data);
 
@@ -2116,10 +2024,8 @@
             this.$ranges = $('[type="range"]', this.$timepicker);
             this.$hours = $('[name="hours"]', this.$timepicker);
             this.$minutes = $('[name="minutes"]', this.$timepicker);
-            this.$seconds = $('[name="seconds"]', this.$timepicker);
             this.$hoursText = $('.datepicker--time-current-hours', this.$timepicker);
             this.$minutesText = $('.datepicker--time-current-minutes', this.$timepicker);
-            this.$secondsText = $('.datepicker--time-current-seconds', this.$timepicker);
 
             if (this.d.ampm) {
                 this.$ampm = $('<span class="datepicker--time-current-ampm">')
@@ -2132,12 +2038,10 @@
 
         _updateCurrentTime: function () {
             var h =  dp.getLeadingZeroNum(this.displayHours),
-                m = dp.getLeadingZeroNum(this.minutes),
-                s = dp.getLeadingZeroNum(this.seconds);
+                m = dp.getLeadingZeroNum(this.minutes);
 
             this.$hoursText.html(h);
             this.$minutesText.html(m);
-            this.$secondsText.html(s);
 
             if (this.d.ampm) {
                 this.$ampm.html(this.dayPeriod);
@@ -2153,12 +2057,7 @@
             this.$minutes.attr({
                 min: this.minMinutes,
                 max: this.maxMinutes
-            }).val(this.minutes);
-            
-            this.$seconds.attr({
-                min: this.minSeconds,
-                max: this.maxSeconds
-            }).val(this.seconds);
+            }).val(this.minutes)
         },
 
         /**
@@ -2251,7 +2150,7 @@
 
             this[name] = $target.val();
             this._updateCurrentTime();
-            this.d._trigger('timeChange', [this.hours, this.minutes, this.seconds]);
+            this.d._trigger('timeChange', [this.hours, this.minutes]);
 
             this._handleDate(this.d.lastSelectedDate);
             this.update()

dist/js/i18n/datepicker.sk.js

@@ -1,12 +0,0 @@
-;(function ($) { $.fn.datepicker.language['sk'] = {
-    days: ['Nedeľa', 'Pondelok', 'Utorok', 'Streda', 'Štvrtok', 'Piatok', 'Sobota'],
-    daysShort: ['Ned', 'Pon', 'Uto', 'Str', 'Štv', 'Pia', 'Sob'],
-    daysMin: ['Ne', 'Po', 'Ut', 'St', 'Št', 'Pi', 'So'],
-    months: ['Január','Február','Marec','Apríl','Máj','Jún', 'Júl','August','September','Október','November','December'],
-    monthsShort: ['Jan', 'Feb', 'Mar', 'Apr', 'Máj', 'Jún', 'Jul', 'Aug', 'Sep', 'Okt', 'Nov', 'Dec'],
-    today: 'Dnes',
-    clear: 'Vymazať',
-    dateFormat: 'dd.mm.yyyy',
-    timeFormat: 'hh:ii',
-    firstDay: 1
-}; })(jQuery);

docs/jade/layout.jade

@@ -20,7 +20,6 @@ html
 		script(src='http://cdnjs.cloudflare.com/ajax/libs/jquery-easing/1.3/jquery.easing.min.js')
 		script(src='../dist/js/datepicker.js')
 		script(src='../dist/js/i18n/datepicker.en.js')
-		script(src='js/logger.js')
 	body
 		div.wrapper
 			main.main(role='main')

docs/js/logger.js

@@ -1,29 +0,0 @@
-var logger;
-(function (window) {
-    logger = function (el, clearText) {
-        var $el = $(el);
-
-        addContent($el);
-        addClearButton(clearText, $el);
-
-        $('.logger--clear', $el).on('click', clear.bind('', $el));
-
-        return function(text) {
-            var count = $('p', $el).length,
-                $content = $('.logger--content', $el);
-            $content.append('<p><span>' + ++count + '.</span> ' + text + '</p>').scrollTop(100000)
-        }
-    };
-
-    function addClearButton (text, el) {
-        el.append('<span class="logger--clear">' + text + '</span>')
-    }
-
-    function addContent (el) {
-        el.html('<div class="logger--content"></div>')
-    }
-
-    function clear (el) {
-        $('.logger--content', el).html('');
-    }
-})(window);

docs/sass/_docs.scss

@@ -42,13 +42,6 @@ h4 {
   margin: 24px 0 0;
 }
 
-.row {
-  display: flex;
-  > * {
-    flex: 1;
-  }
-}
-
 article {
   h2, h3 {
     position: relative;
@@ -513,57 +506,4 @@ a {
   span {
     color: #ddd;
   }
-}
-
-//  Logger
-// -------------------------------------------------
-
-.logger {
-  background: rgba(0, 0, 0, .7);
-  border-radius: 4px;
-  font-size: 12px;
-  font-family: Monospace, monospace;
-  height: 150px;
-  overflow: auto;
-  position: relative;
-}
-
-.logger--content {
-  padding: 4px 8px;
-  height: 100%;
-  overflow: auto;
-
-  p {
-    margin: 0;
-    color: greenyellow;
-  }
-
-  span {
-    color: #ddd;
-  }
-}
-
-.logger--clear {
-  color: #333;
-  border-radius: 4px 4px 0 0;
-  cursor: pointer;
-  position: absolute;
-  height: 32px;
-  padding: 0 8px;
-  font-family: 'Tahoma', sans-serif;
-  font-size: 13px;
-  display: inline-flex;
-  justify-content: center;
-  align-items: center;
-  background: rgba(255, 255, 255, .5);
-  right: 24px;
-  bottom: 0;
-
-  &:hover {
-    background: rgba(255, 255, 255, .8);
-  }
-
-  &:active {
-    background: rgba(255, 255, 255, .3);
-  }
 }

package.json

@@ -1,6 +1,6 @@
 {
   "name": "air-datepicker",
-  "version": "2.2.3",
+  "version": "2.1.0",
   "devDependencies": {
     "autoprefixer": "^6.1.0",
     "browserify": "^13.0.0",
@@ -25,7 +25,7 @@
     "vinyl-source-stream": "^1.1.0"
   },
   "dependencies": {
-    "jquery": ">=2.0.0 <4.0.0"
+    "jquery": "^3.0.0"
   },
   "description": "Lightweight customizable cross-browser jQuery datepicker, built with es5 and css-flexbox. Works in all modern desktop and mobile browsers (tested no Android 4.4+ and iOS8+)\r ![air datepicker image](https://github.com/t1m0n/air-datepicker/raw/master/docs/img/promo-img.png)",
   "main": "src/js/air-datepicker.js",

src/js/body.js

@@ -21,9 +21,7 @@
         this.d = d;
         this.type = type;
         this.opts = opts;
-        this.$el = $('');
 
-        if (this.opts.onlyTimepicker) return;
         this.init();
     };
 
@@ -69,6 +67,12 @@
                 render = {},
                 html = d.date;
 
+            if (opts.onRenderCell) {
+                render = opts.onRenderCell(date, type) || {};
+                html = render.html ? render.html : html;
+                classes += render.classes ? ' ' + render.classes : '';
+            }
+
             switch (type) {
                 case 'day':
                     if (parent.isWeekend(d.day)) classes += " -weekend-";
@@ -101,7 +105,6 @@
                 html = render.html ? render.html : html;
                 classes += render.classes ? ' ' + render.classes : '';
             }
-
             if (opts.range) {
                 if (dp.isSame(minRange, date, type)) classes += ' -range-from-';
                 if (dp.isSame(maxRange, date, type)) classes += ' -range-to-';
@@ -245,7 +248,6 @@
         },
 
         _render: function () {
-            if (this.opts.onlyTimepicker) return;
             this._renderTypes[this.type].bind(this)();
         },
 
@@ -264,7 +266,6 @@
         },
 
         show: function () {
-            if (this.opts.onlyTimepicker) return;
             this.$el.addClass('active');
             this.acitve = true;
         },
@@ -293,11 +294,27 @@
 
             if (!alreadySelected) {
                 dp._trigger('clickCell', selectedDate);
-                return;
             }
 
-            dp._handleAlreadySelectedDates.bind(dp, alreadySelected, selectedDate)();
+            if (alreadySelected && this.opts.range) {
+                // Add possibility to select same date when range is true
+                if (dp.selectedDates.length != 2 && !this.opts.toggleSelected || this.opts.toggleSelected) {
+                    dp._trigger('clickCell', selectedDate);
+                    // Change last selected date to be able to change time on last date
+                    dp.lastSelectedDate = alreadySelected;
+                }
+            } else if (alreadySelected && this.opts.toggleSelected){
+                dp.removeDate(selectedDate);
+            }
 
+            // Change last selected date to be able to change time when clicking on this cell
+            if (alreadySelected && !this.opts.toggleSelected) {
+                dp.lastSelectedDate = alreadySelected;
+                if (dp.opts.timepicker) {
+                    dp.timepicker._setTime(alreadySelected);
+                    dp.timepicker.update();
+                }
+            }
         },
 
         _onClickCell: function (e) {

src/js/datepicker.js

@@ -1,6 +1,5 @@
 ;(function () {
-    var VERSION = '2.2.3',
-        pluginName = 'datepicker',
+    var pluginName = 'datepicker',
         autoInitSelector = '.datepicker-here',
         $body, $datepickersContainer,
         containerBuilt = false,
@@ -63,23 +62,17 @@
 
             // timepicker
             timepicker: false,
-            onlyTimepicker: false,
             dateTimeSeparator: ' ',
             timeFormat: '',
             minHours: 0,
             maxHours: 24,
             minMinutes: 0,
             maxMinutes: 59,
-            minSeconds: 0,
-            maxSeconds: 59,
             hoursStep: 1,
             minutesStep: 1,
-            secondsStep: 1,
 
             // events
             onSelect: '',
-            onShow: '',
-            onHide: '',
             onChangeMonth: '',
             onChangeYear: '',
             onChangeDecade: '',
@@ -145,7 +138,6 @@
     datepicker = Datepicker;
 
     datepicker.prototype = {
-        VERSION: VERSION,
         viewIndexes: ['days', 'months', 'years'],
 
         init: function () {
@@ -162,7 +154,7 @@
                     this._setPositionClasses(this.opts.position);
                     this._bindEvents()
                 }
-                if (this.opts.keyboardNav && !this.opts.onlyTimepicker) {
+                if (this.opts.keyboardNav) {
                     this._bindKeyboardEvents();
                 }
                 this.$datepicker.on('mousedown', this._onMouseDownDatepicker.bind(this));
@@ -178,10 +170,6 @@
                 this._bindTimepickerEvents();
             }
 
-            if (this.opts.onlyTimepicker) {
-                this.$datepicker.addClass('-only-timepicker-');
-            }
-
             this.views[this.currentView] = new $.fn.datepicker.Body(this, this.currentView, this.opts);
             this.views[this.currentView].show();
             this.nav = new $.fn.datepicker.Navigation(this, this.opts);
@@ -251,10 +239,6 @@
                 this.loc.dateFormat = [this.loc.dateFormat, this.loc.timeFormat].join(this.opts.dateTimeSeparator);
             }
 
-            if (this.opts.onlyTimepicker) {
-                this.loc.dateFormat = this.loc.timeFormat;
-            }
-
             var boundary = this._getWordBoundaryRegExp;
             if (this.loc.timeFormat.match(boundary('aa')) ||
                 this.loc.timeFormat.match(boundary('AA'))
@@ -305,8 +289,7 @@
                     parsedSelected.month,
                     parsedSelected.date,
                     parsedSelected.hours,
-                    parsedSelected.minutes,
-                    parsedSelected.seconds
+                    parsedSelected.minutes
                 );
 
                 formattedDates = selectedDates.map(function (date) {
@@ -322,11 +305,11 @@
                         parsedDate.month,
                         parsedDate.date,
                         parsedDate.hours,
-                        parsedDate.minutes,
-                        parsedDate.seconds
+                        parsedDate.minutes
                     );
                 })
             }
+
             this._prevOnSelectValue = formattedDates;
             this.opts.onSelect(formattedDates, dates, this);
         },
@@ -381,7 +364,6 @@
                 hours = d.hours,
                 ampm = string.match(boundary('aa')) || string.match(boundary('AA')),
                 dayPeriod = 'am',
-                replacer = this._replacer,
                 validHours;
 
             if (this.opts.timepicker && this.timepicker && ampm) {
@@ -395,63 +377,50 @@
                 case /@/.test(result):
                     result = result.replace(/@/, date.getTime());
                 case /aa/.test(result):
-                    result = replacer(result, boundary('aa'), dayPeriod);
+                    result = result.replace(boundary('aa'), dayPeriod);
                 case /AA/.test(result):
-                    result = replacer(result, boundary('AA'), dayPeriod.toUpperCase());
+                    result = result.replace(boundary('AA'), dayPeriod.toUpperCase());
                 case /dd/.test(result):
-                    result = replacer(result, boundary('dd'), d.fullDate);
+                    result = result.replace(boundary('dd'), d.fullDate);
                 case /d/.test(result):
-                    result = replacer(result, boundary('d'), d.date);
+                    result = result.replace(boundary('d'), d.date);
                 case /DD/.test(result):
-                    result = replacer(result, boundary('DD'), locale.days[d.day]);
+                    result = result.replace(boundary('DD'), locale.days[d.day]);
                 case /D/.test(result):
-                    result = replacer(result, boundary('D'), locale.daysShort[d.day]);
+                    result = result.replace(boundary('D'), locale.daysShort[d.day]);
                 case /mm/.test(result):
-                    result = replacer(result, boundary('mm'), d.fullMonth);
+                    result = result.replace(boundary('mm'), d.fullMonth);
                 case /m/.test(result):
-                    result = replacer(result, boundary('m'), d.month + 1);
+                    result = result.replace(boundary('m'), d.month + 1);
                 case /MM/.test(result):
-                    result = replacer(result, boundary('MM'), this.loc.months[d.month]);
+                    result = result.replace(boundary('MM'), this.loc.months[d.month]);
                 case /M/.test(result):
-                    result = replacer(result, boundary('M'), locale.monthsShort[d.month]);
-                case /ss/.test(result):
-                    result = replacer(result, boundary('ss'), d.fullSeconds);
-                case /s/.test(result):
-                    result = replacer(result, boundary('s'), d.seconds);
+                    result = result.replace(boundary('M'), locale.monthsShort[d.month]);
                 case /ii/.test(result):
-                    result = replacer(result, boundary('ii'), d.fullMinutes);
+                    result = result.replace(boundary('ii'), d.fullMinutes);
                 case /i/.test(result):
-                    result = replacer(result, boundary('i'), d.minutes);
+                    result = result.replace(boundary('i'), d.minutes);
                 case /hh/.test(result):
-                    result = replacer(result, boundary('hh'), fullHours);
+                    result = result.replace(boundary('hh'), fullHours);
                 case /h/.test(result):
-                    result = replacer(result, boundary('h'), hours);
+                    result = result.replace(boundary('h'), hours);
                 case /yyyy/.test(result):
-                    result = replacer(result, boundary('yyyy'), d.year);
+                    result = result.replace(boundary('yyyy'), d.year);
                 case /yyyy1/.test(result):
-                    result = replacer(result, boundary('yyyy1'), decade[0]);
+                    result = result.replace(boundary('yyyy1'), decade[0]);
                 case /yyyy2/.test(result):
-                    result = replacer(result, boundary('yyyy2'), decade[1]);
+                    result = result.replace(boundary('yyyy2'), decade[1]);
                 case /yy/.test(result):
-                    result = replacer(result, boundary('yy'), d.year.toString().slice(-2));
+                    result = result.replace(boundary('yy'), d.year.toString().slice(-2));
             }
 
             return result;
         },
 
-        _replacer: function (str, reg, data) {
-            return str.replace(reg, function (match, p1,p2,p3) {
-                return p1 + data + p3;
-            })
-        },
-
         _getWordBoundaryRegExp: function (sign) {
-            var symbols = '\\s|\\.|-|/|\\\\|,|\\$|\\!|\\?|:|;';
-
-            return new RegExp('(^|>|' + symbols + ')(' + sign + ')($|<|' + symbols + ')', 'g');
+            return new RegExp('\\b(?=[a-zA-Z0-9äöüßÄÖÜ<])' + sign + '(?![>a-zA-Z0-9äöüßÄÖÜ])');
         },
 
-
         selectDate: function (date) {
             var _this = this,
                 opts = _this.opts,
@@ -485,7 +454,6 @@
             if (this.timepicker) {
                 date.setHours(this.timepicker.hours);
                 date.setMinutes(this.timepicker.minutes)
-                date.setSeconds(this.timepicker.seconds)
             }
 
             if (_this.view == 'days') {
@@ -627,7 +595,7 @@
             this._syncWithMinMaxDates();
             this._defineLocale(this.opts.language);
             this.nav._addButtonsIfNeed();
-            if (!this.opts.onlyTimepicker) this.nav._render();
+            this.nav._render();
             this.views[this.currentView]._render();
 
             if (this.elIsInput && !this.opts.inline) {
@@ -641,10 +609,6 @@
                 this.$datepicker.addClass(this.opts.classes)
             }
 
-            if (this.opts.onlyTimepicker) {
-                this.$datepicker.addClass('-only-timepicker-');
-            }
-
             if (this.opts.timepicker) {
                 if (lastSelectedDate) this.timepicker._handleDate(lastSelectedDate);
                 this.timepicker._updateRanges();
@@ -653,7 +617,6 @@
                 if (lastSelectedDate) {
                     lastSelectedDate.setHours(this.timepicker.hours);
                     lastSelectedDate.setMinutes(this.timepicker.minutes);
-                    lastSelectedDate.setSeconds(this.timepicker.seconds);
                 }
             }
 
@@ -819,20 +782,12 @@
         },
 
         show: function () {
-            var onShow = this.opts.onShow;
-
             this.setPosition(this.opts.position);
             this.$datepicker.addClass('active');
             this.visible = true;
-
-            if (onShow) {
-                this._bindVisionEvents(onShow)
-            }
         },
 
         hide: function () {
-            var onHide = this.opts.onHide;
-
             this.$datepicker
                 .removeClass('active')
                 .css({
@@ -845,10 +800,6 @@
             this.inFocus = false;
             this.visible = false;
             this.$el.blur();
-
-            if (onHide) {
-                this._bindVisionEvents(onHide)
-            }
         },
 
         down: function (date) {
@@ -859,12 +810,6 @@
             this._changeView(date, 'up');
         },
 
-        _bindVisionEvents: function (event) {
-            this.$datepicker.off('transitionend.dp');
-            event(this, false);
-            this.$datepicker.one('transitionend.dp', event.bind(this, this, true))
-        },
-
         _changeView: function (date, dir) {
             date = date || this.focused || this.date;
 
@@ -1078,7 +1023,7 @@
             }
             $cell = this.views[this.currentView].$el.find(selector);
 
-            return $cell.length ? $cell : $('');
+            return $cell.length ? $cell : '';
         },
 
         destroy: function () {
@@ -1101,30 +1046,6 @@
             }
         },
 
-        _handleAlreadySelectedDates: function (alreadySelected, selectedDate) {
-            if (this.opts.range) {
-                if (!this.opts.toggleSelected) {
-                    // Add possibility to select same date when range is true
-                    if (this.selectedDates.length != 2) {
-                        this._trigger('clickCell', selectedDate);
-                    }
-                } else {
-                    this.removeDate(selectedDate);
-                }
-            } else if (this.opts.toggleSelected){
-                this.removeDate(selectedDate);
-            }
-
-            // Change last selected date to be able to change time when clicking on this cell
-            if (!this.opts.toggleSelected) {
-                this.lastSelectedDate = alreadySelected;
-                if (this.opts.timepicker) {
-                    this.timepicker._setTime(alreadySelected);
-                    this.timepicker.update();
-                }
-            }
-        },
-
         _onShowEvent: function (e) {
             if (!this.visible) {
                 this.show();
@@ -1197,12 +1118,11 @@
                             if (this.timepicker) {
                                 this.focused.setHours(this.timepicker.hours);
                                 this.focused.setMinutes(this.timepicker.minutes);
-                                this.focused.setSeconds(this.timepicker.seconds);
                             }
                             this.selectDate(this.focused);
-                            return;
+                        } else if (alreadySelected && this.opts.toggleSelected){
+                            this.removeDate(this.focused);
                         }
-                        this._handleAlreadySelectedDates(alreadySelected, this.focused)
                     }
                 }
             }
@@ -1259,7 +1179,7 @@
             this.silent = false;
         },
 
-        _onTimeChange: function (e, h, m, s) {
+        _onTimeChange: function (e, h, m) {
             var date = new Date(),
                 selectedDates = this.selectedDates,
                 selected = false;
@@ -1271,7 +1191,6 @@
 
             date.setHours(h);
             date.setMinutes(m);
-            date.setSeconds(s);
 
             if (!selected && !this._getCell(date).hasClass('-disabled-')) {
                 this.selectDate(date);
@@ -1287,7 +1206,6 @@
             if (this.timepicker) {
                 date.setHours(this.timepicker.hours);
                 date.setMinutes(this.timepicker.minutes);
-                date.setSeconds(this.timepicker.seconds)
             }
             this.selectDate(date);
         },
@@ -1411,9 +1329,7 @@
             hours: date.getHours(),
             fullHours:  date.getHours() < 10 ? '0' + date.getHours() :  date.getHours() ,
             minutes: date.getMinutes(),
-            fullMinutes:  date.getMinutes() < 10 ? '0' + date.getMinutes() :  date.getMinutes(),
-            seconds: date.getSeconds(),
-            fullSeconds:  date.getSeconds() < 10 ? '0' + date.getSeconds() :  date.getSeconds()
+            fullMinutes:  date.getMinutes() < 10 ? '0' + date.getMinutes() :  date.getMinutes()
         }
     };
 

src/js/i18n/datepicker.sk.js

@@ -1,12 +0,0 @@
-$.fn.datepicker.language['sk'] = {
-    days: ['Nedeľa', 'Pondelok', 'Utorok', 'Streda', 'Štvrtok', 'Piatok', 'Sobota'],
-    daysShort: ['Ned', 'Pon', 'Uto', 'Str', 'Štv', 'Pia', 'Sob'],
-    daysMin: ['Ne', 'Po', 'Ut', 'St', 'Št', 'Pi', 'So'],
-    months: ['Január','Február','Marec','Apríl','Máj','Jún', 'Júl','August','September','Október','November','December'],
-    monthsShort: ['Jan', 'Feb', 'Mar', 'Apr', 'Máj', 'Jún', 'Jul', 'Aug', 'Sep', 'Okt', 'Nov', 'Dec'],
-    today: 'Dnes',
-    clear: 'Vymazať',
-    dateFormat: 'dd.mm.yyyy',
-    timeFormat: 'hh:ii',
-    firstDay: 1
-};

src/js/navigation.js

@@ -30,9 +30,7 @@
         },
 
         _buildBaseHtml: function () {
-            if (!this.opts.onlyTimepicker) {
-                this._render();
-            }
+            this._render();
             this._addButtonsIfNeed();
         },
 
@@ -89,10 +87,10 @@
 
             switch (this.d.view) {
                 case 'days':
-                    if (!this.d._isInRange(new Date(y, m-1, 1), 'month')) {
+                    if (!this.d._isInRange(new Date(y, m-1, d), 'month')) {
                         this._disableNav('prev')
                     }
-                    if (!this.d._isInRange(new Date(y, m+1, 1), 'month')) {
+                    if (!this.d._isInRange(new Date(y, m+1, d), 'month')) {
                         this._disableNav('next')
                     }
                     break;
@@ -105,11 +103,10 @@
                     }
                     break;
                 case 'years':
-                    var decade = dp.getDecade(this.d.date);
-                    if (!this.d._isInRange(new Date(decade[0] - 1, 0, 1), 'year')) {
+                    if (!this.d._isInRange(new Date(y-10, m, d), 'year')) {
                         this._disableNav('prev')
                     }
-                    if (!this.d._isInRange(new Date(decade[1] + 1, 0, 1), 'year')) {
+                    if (!this.d._isInRange(new Date(y+10, m, d), 'year')) {
                         this._disableNav('next')
                     }
                     break;

src/js/timepicker.js

@@ -1,11 +1,9 @@
 ;(function () {
     var template = '<div class="datepicker--time">' +
         '<div class="datepicker--time-current">' +
-        '   <span class="datepicker--time-current-hours">#{hourVisible}</span>' +
+        '   <span class="datepicker--time-current-hours">#{hourValue}</span>' +
         '   <span class="datepicker--time-current-colon">:</span>' +
         '   <span class="datepicker--time-current-minutes">#{minValue}</span>' +
-        '   <span class="datepicker--time-current-colon">:</span>' +
-        '   <span class="datepicker--time-current-seconds">#{secValue}</span>' +
         '</div>' +
         '<div class="datepicker--time-sliders">' +
         '   <div class="datepicker--time-row">' +
@@ -14,9 +12,6 @@
         '   <div class="datepicker--time-row">' +
         '      <input type="range" name="minutes" value="#{minValue}" min="#{minMin}" max="#{minMax}" step="#{minStep}"/>' +
         '   </div>' +
-        '   <div class="datepicker--time-row">' +
-        '      <input type="range" name="seconds" value="#{secValue}" min="#{secMin}" max="#{secMax}" step="#{secStep}"/>' +
-        '   </div>' +
         '</div>' +
         '</div>',
         datepicker = $.fn.datepicker,
@@ -52,7 +47,6 @@
             this._handleDate(date);
             this.hours = _date.hours < this.minHours ? this.minHours : _date.hours;
             this.minutes = _date.minutes < this.minMinutes ? this.minMinutes : _date.minutes;
-            this.seconds = _date.seconds < this.minSeconds ? this.minSeconds : _date.seconds;
         },
 
         /**
@@ -64,7 +58,6 @@
         _setMinTimeFromDate: function (date) {
             this.minHours = date.getHours();
             this.minMinutes = date.getMinutes();
-            this.minSeconds = date.getSeconds();
 
             // If, for example, min hours are 10, and current hours are 12,
             // update minMinutes to default value, to be able to choose whole range of values
@@ -78,7 +71,6 @@
         _setMaxTimeFromDate: function (date) {
             this.maxHours = date.getHours();
             this.maxMinutes = date.getMinutes();
-            this.maxSeconds = date.getSeconds();
 
             if (this.d.lastSelectedDate) {
                 if (this.d.lastSelectedDate.getHours() < date.getHours()) {
@@ -90,15 +82,12 @@
         _setDefaultMinMaxTime: function () {
             var maxHours = 23,
                 maxMinutes = 59,
-                maxSeconds = 59,
                 opts = this.opts;
 
             this.minHours = opts.minHours < 0 || opts.minHours > maxHours ? 0 : opts.minHours;
             this.minMinutes = opts.minMinutes < 0 || opts.minMinutes > maxMinutes ? 0 : opts.minMinutes;
             this.maxHours = opts.maxHours < 0 || opts.maxHours > maxHours ? maxHours : opts.maxHours;
             this.maxMinutes = opts.maxMinutes < 0 || opts.maxMinutes > maxMinutes ? maxMinutes : opts.maxMinutes;
-            this.minSeconds = opts.minSeconds < 0 || opts.minSeconds > maxSeconds ? 0 : opts.minSeconds;
-            this.maxSeconds = opts.maxSeconds < 0 || opts.maxSeconds > maxSeconds ? maxSeconds : opts.maxSeconds;
         },
 
         /**
@@ -118,12 +107,6 @@
             } else if (this.minutes > this.maxMinutes) {
                 this.minutes = this.maxMinutes;
             }
-
-            if (this.seconds < this.minSeconds) {
-                this.seconds = this.minSeconds;
-            } else if (this.seconds > this.maxSeconds) {
-                this.seconds = this.maxSeconds;
-            }
         },
 
         _buildHTML: function () {
@@ -132,16 +115,11 @@
                     hourMin: this.minHours,
                     hourMax: lz(this.maxHours),
                     hourStep: this.opts.hoursStep,
-                    hourValue: this.hours,
-                    hourVisible: lz(this.displayHours),
+                    hourValue: lz(this.displayHours),
                     minMin: this.minMinutes,
                     minMax: lz(this.maxMinutes),
                     minStep: this.opts.minutesStep,
-                    minValue: lz(this.minutes),
-                    secMin: this.minSeconds,
-                    secMax: lz(this.maxSeconds),
-                    secStep: this.opts.secondsStep,
-                    secValue: lz(this.seconds)
+                    minValue: lz(this.minutes)
                 },
                 _template = dp.template(template, data);
 
@@ -149,10 +127,8 @@
             this.$ranges = $('[type="range"]', this.$timepicker);
             this.$hours = $('[name="hours"]', this.$timepicker);
             this.$minutes = $('[name="minutes"]', this.$timepicker);
-            this.$seconds = $('[name="seconds"]', this.$timepicker);
             this.$hoursText = $('.datepicker--time-current-hours', this.$timepicker);
             this.$minutesText = $('.datepicker--time-current-minutes', this.$timepicker);
-            this.$secondsText = $('.datepicker--time-current-seconds', this.$timepicker);
 
             if (this.d.ampm) {
                 this.$ampm = $('<span class="datepicker--time-current-ampm">')
@@ -165,12 +141,10 @@
 
         _updateCurrentTime: function () {
             var h =  dp.getLeadingZeroNum(this.displayHours),
-                m = dp.getLeadingZeroNum(this.minutes),
-                s = dp.getLeadingZeroNum(this.seconds);
+                m = dp.getLeadingZeroNum(this.minutes);
 
             this.$hoursText.html(h);
             this.$minutesText.html(m);
-            this.$secondsText.html(s);
 
             if (this.d.ampm) {
                 this.$ampm.html(this.dayPeriod);
@@ -186,12 +160,7 @@
             this.$minutes.attr({
                 min: this.minMinutes,
                 max: this.maxMinutes
-            }).val(this.minutes);
-            
-            this.$seconds.attr({
-                min: this.minSeconds,
-                max: this.maxSeconds
-            }).val(this.seconds);
+            }).val(this.minutes)
         },
 
         /**
@@ -284,7 +253,7 @@
 
             this[name] = $target.val();
             this._updateCurrentTime();
-            this.d._trigger('timeChange', [this.hours, this.minutes, this.seconds]);
+            this.d._trigger('timeChange', [this.hours, this.minutes]);
 
             this._handleDate(this.d.lastSelectedDate);
             this.update()

src/sass/datepicker.scss

@@ -70,10 +70,6 @@
 .datepicker--content {
   box-sizing: content-box;
   padding: $datepickerPadding;
-
-  .-only-timepicker- & {
-    display: none;
-  }
 }
 
 //  Pointer

src/sass/navigation.scss

@@ -10,10 +10,6 @@
   border-bottom: 1px solid map_get($datepickerBorderColor, nav);
   min-height: $datepickerNavigationHeight;
   padding: $datepickerPadding;
-
-  .-only-timepicker- & {
-    display: none;
-  }
 }
 
 .datepicker--nav-title,

src/sass/timepicker.scss

@@ -71,10 +71,6 @@ $rangeThumbBg: #dedede;
       max-width: 138px;
     }
   }
-
-  .-only-timepicker- & {
-    border-top: none;
-  }
 }
 
 .datepicker--time-sliders {
@@ -94,7 +90,7 @@ $rangeThumbBg: #dedede;
   flex: 1;
   font-size: 14px;
   text-align: center;
-  margin: 0 10px;
+  margin: 0 0 0 10px;
 }
 
 .datepicker--time-current-colon {
@@ -103,10 +99,9 @@ $rangeThumbBg: #dedede;
 }
 
 .datepicker--time-current-hours,
-.datepicker--time-current-minutes,
-.datepicker--time-current-seconds {
+.datepicker--time-current-minutes {
   line-height: 1;
-  font-size: 14px;
+  font-size: 19px;
   font-family: "Century Gothic", CenturyGothic, AppleGothic, sans-serif;
   position: relative;
   z-index: 1;
@@ -133,7 +128,7 @@ $rangeThumbBg: #dedede;
 
 .datepicker--time-current-ampm {
   text-transform: uppercase;
-  align-self: flex-start;
+  align-self: flex-end;
   color: map_get($datepickerTextColor, navArrows);
   margin-left: 6px;
   font-size: 11px;

tests/index.html

@@ -23,7 +23,7 @@
         <style type="text/css">
             /* Remove transitions to test position options*/
             .datepicker {
-                transition-duration: 0s !important;
+                transition: none !important;
             }
         </style>
     </head>

tests/specs/events.js

@@ -15,7 +15,6 @@ var assert = chai.assert,
     afterEach(function () {
         if (dp && destroy) {
             dp.destroy();
-            dp = '';
         }
 
         destroy = true;
@@ -79,39 +78,6 @@ var assert = chai.assert,
             expect(dates).to.have.length(2)
         })
     });
-    
-    describe('onShow', function () {
-        it('should add callback when datepicker is showing', function () {
-            var test = '';
-            dp = $input.datepicker({
-                onShow: function (dp, completed) {
-                    if (!completed) {
-                        test = dp;
-                    }
-                }
-            }).data('datepicker');
-
-            dp.show();
-            expect(test).to.be.equal(dp);
-        })
-    });
-
-    describe('onHide', function () {
-        it('should add callback when datepicker is hiding (after transition completed)', function () {
-            var test = '';
-            dp = $input.datepicker({
-                onHide: function (dp, completed) {
-                    if (!completed) {
-                        test = dp;
-                    }
-                }
-            }).data('datepicker');
-
-            dp.show();
-            dp.hide();
-            expect(test).to.be.equal(dp);
-        });
-    });
 
     describe('onRenderCell', function () {
         it('should add callback when cell is rendered', function () {

tests/specs/options.js

@@ -856,26 +856,6 @@ describe('Options', function () {
         })
     });
 
-    describe('onlyTimepicker', function () {
-        it('only timepicker should be visible', function () {
-            dp = $input.datepicker({
-                timepicker: true,
-                onlyTimepicker: true
-            }).data('datepicker');
-
-            var $time = $('.datepicker--time', dp.$datepicker),
-                $cells = $('.datepicker--cells', dp.$datepicker),
-                $nav = $('.datepicker--nav-title', dp.$datepicker),
-                _class = dp.$datepicker.hasClass('-only-timepicker-');
-
-            expect($time).to.have.length(1);
-            expect($cells).to.have.length(0);
-            expect($nav).to.have.length(0);
-            expect(_class).to.be.equal(true);
-
-        })
-    });
-
     describe('dateTimeSeparator', function () {
         it('should define separator between date string and time', function () {
             var date = new Date(2016,2,9,11,24);

tests/specs/static-methods.js

@@ -5,6 +5,7 @@ var assert = chai.assert,
 describe('Datepicker', function () {
     describe('getDaysCount', function () {
         it('should return 31 days in December', function () {
+            console.log(plugin.getDaysCount);
             assert.equal(plugin.getDaysCount(new Date(2015, 11)), 31)
         });
         it('should return 30 days in September', function () {

visual-tests.html

@@ -3,9 +3,8 @@
     <head>
         <meta charset="UTF-8">
         <title>Air datepicker visual tests</title>
-        <script type="text/javascript" src="node_modules/jquery/dist/jquery.min.js"></script>
+        <script type="text/javascript" src="bower_components/jquery/dist/jquery.min.js"></script>
         <script type="text/javascript" src="dist/js/datepicker.js"></script>
-        <script type="text/javascript" src="dist/js/i18n/datepicker.en.js"></script>
         <link rel="stylesheet" href="dist/css/datepicker.css"/>
         <link rel="stylesheet" href="docs/css/style.css"/>
         <script type="text/javascript">
@@ -32,7 +31,7 @@
                 <div class="row">
                     <div class="vt-tile">
                         <h2>Default</h2>
-                        <div class="datepicker-here" data-language="en"></div>
+                        <div class="datepicker-here"></div>
                     </div>
                 </div>
             </article>
@@ -42,11 +41,11 @@
                 <div class="row">
                     <div class="vt-tile">
                         <h2>{range: true}</h2>
-                        <div class="datepicker-here" data-language="en" data-range="true"></div>
+                        <div class="datepicker-here" data-range="true"></div>
                     </div>
                     <div class="vt-tile">
                         <h2>{range: true, onSelect: ...}</h2>
-                        <div class="datepicker-here" data-language="en" id="dp-3" data-range="true"></div>
+                        <div class="datepicker-here" id="dp-3" data-range="true"></div>
                         <script type="text/javascript">
                             $('#dp-3').datepicker({
                                 onSelect: function (fd) {
@@ -57,7 +56,7 @@
                     </div>
                     <div class="vt-tile">
                         <h2>{range: true, onSelect: ...}</h2>
-                        <input class="datepicker-here" data-language="en" id="dp-4" data-range="true"/>
+                        <input class="datepicker-here" id="dp-4" data-range="true"/>
                         <script type="text/javascript">
                             $('#dp-4').datepicker({
                                 onSelect: function (fd) {
@@ -74,29 +73,17 @@
                 <div class="row">
                     <div class="vt-tile">
                         <h2>{timepicker: true}</h2>
-                        <div id="test" class="datepicker-here" data-language="en" data-timepicker="true"></div>
-                        <script type="text/javascript">
-                            $('#test').datepicker({
-                                toggleSelected: false,
-                                inline: true,
-                                timeFormat: 'hh:ii:ss',
-                                onSelect: function (fd) {
-                                    console.log(arguments)
-                                    log(fd)
-                                }
-                            })
-                        </script>
+                        <div class="datepicker-here" data-timepicker="true"></div>
                     </div>
                     <div class="vt-tile">
                         <h2>{onChange: ..., toggleSelected: false, range: true}</h2>
-                        <input id="dp-5" class="datepicker-here" data-language="en" data-timepicker="true" />
+                        <input id="dp-5" class="datepicker-here" data-timepicker="true" />
                         <script type="text/javascript">
                             $('#dp-5').datepicker({
                                 toggleSelected: false,
                                 inline: true,
                                 range: true,
                                 onSelect: function (fd) {
-                                    console.log(arguments)
                                     log(fd)
                                 }
                             })
@@ -104,11 +91,11 @@
                     </div>
                     <div class="vt-tile">
                         <h2>{timepicker: true}</h2>
-                        <input class="datepicker-here" data-language="en" data-timepicker="true" />
+                        <input class="datepicker-here" data-timepicker="true" />
                     </div>
                     <div class="vt-tile">
                         <h2>{timepicker: true, minDate: new Date()}</h2>
-                        <input class="datepicker-here" data-language="en" id="dp-6"/>
+                        <input class="datepicker-here" id="dp-6"/>
                         <script type="text/javascript">
                             $('#dp-6').datepicker({
                                 minDate: new Date(),