md-date-time-picker-rails 2.0.1 → 2.0.2
Sign up to get free protection for your applications and to get access to all the features.
- checksums.yaml +4 -4
- data/lib/md-date-time-picker-rails/version.rb +1 -1
- data/vendor/assets/fonts/RobotoTTF/Roboto-Black.ttf +0 -0
- data/vendor/assets/fonts/RobotoTTF/Roboto-BlackItalic.ttf +0 -0
- data/vendor/assets/fonts/RobotoTTF/Roboto-Bold.ttf +0 -0
- data/vendor/assets/fonts/RobotoTTF/Roboto-BoldItalic.ttf +0 -0
- data/vendor/assets/fonts/RobotoTTF/Roboto-Italic.ttf +0 -0
- data/vendor/assets/fonts/RobotoTTF/Roboto-Light.ttf +0 -0
- data/vendor/assets/fonts/RobotoTTF/Roboto-LightItalic.ttf +0 -0
- data/vendor/assets/fonts/RobotoTTF/Roboto-Medium.ttf +0 -0
- data/vendor/assets/fonts/RobotoTTF/Roboto-MediumItalic.ttf +0 -0
- data/vendor/assets/fonts/RobotoTTF/Roboto-Regular.ttf +0 -0
- data/vendor/assets/fonts/RobotoTTF/Roboto-Thin.ttf +0 -0
- data/vendor/assets/fonts/RobotoTTF/Roboto-ThinItalic.ttf +0 -0
- data/vendor/assets/fonts/RobotoTTF/RobotoCondensed-Bold.ttf +0 -0
- data/vendor/assets/fonts/RobotoTTF/RobotoCondensed-BoldItalic.ttf +0 -0
- data/vendor/assets/fonts/RobotoTTF/RobotoCondensed-Italic.ttf +0 -0
- data/vendor/assets/fonts/RobotoTTF/RobotoCondensed-Light.ttf +0 -0
- data/vendor/assets/fonts/RobotoTTF/RobotoCondensed-LightItalic.ttf +0 -0
- data/vendor/assets/fonts/RobotoTTF/RobotoCondensed-Regular.ttf +0 -0
- data/vendor/assets/images/ic_keyboard_arrow_left_black_24px.svg +1 -0
- data/vendor/assets/images/ic_keyboard_arrow_left_black_disabled_24px.svg +1 -0
- data/vendor/assets/images/ic_keyboard_arrow_left_white_24px.svg +1 -0
- data/vendor/assets/images/ic_keyboard_arrow_left_white_disabled_24px.svg +1 -0
- data/vendor/assets/images/ic_keyboard_arrow_right_black_24px.svg +1 -0
- data/vendor/assets/images/ic_keyboard_arrow_right_black_disabled_24px.svg +1 -0
- data/vendor/assets/images/ic_keyboard_arrow_right_white_24px.svg +1 -0
- data/vendor/assets/images/ic_keyboard_arrow_right_white_disabled_24px.svg +1 -0
- data/vendor/assets/javascripts/draggabilly.pkgd.min.js +8 -0
- data/vendor/assets/javascripts/mdDateTimePicker.js +1250 -0
- data/vendor/assets/javascripts/mdDateTimePicker.min.js +1 -0
- data/vendor/assets/javascripts/moment.min.js +7 -0
- data/vendor/assets/stylesheets/md-date-time-picker.css.erb +1538 -0
- data/vendor/assets/stylesheets/mdDateTimePicker.css +1533 -0
- data/vendor/assets/stylesheets/mdDateTimePicker.min.css +1 -0
- data/vendor/assets/stylesheets/themes/dark/amber/mdDateTimePicker.css +1533 -0
- data/vendor/assets/stylesheets/themes/dark/amber/mdDateTimePicker.min.css +1 -0
- data/vendor/assets/stylesheets/themes/dark/blue-grey/mdDateTimePicker.css +1533 -0
- data/vendor/assets/stylesheets/themes/dark/blue-grey/mdDateTimePicker.min.css +1 -0
- data/vendor/assets/stylesheets/themes/dark/blue/mdDateTimePicker.css +1533 -0
- data/vendor/assets/stylesheets/themes/dark/blue/mdDateTimePicker.min.css +1 -0
- data/vendor/assets/stylesheets/themes/dark/brown/mdDateTimePicker.css +1533 -0
- data/vendor/assets/stylesheets/themes/dark/brown/mdDateTimePicker.min.css +1 -0
- data/vendor/assets/stylesheets/themes/dark/cyan/mdDateTimePicker.css +1533 -0
- data/vendor/assets/stylesheets/themes/dark/cyan/mdDateTimePicker.min.css +1 -0
- data/vendor/assets/stylesheets/themes/dark/deep-orange/mdDateTimePicker.css +1533 -0
- data/vendor/assets/stylesheets/themes/dark/deep-orange/mdDateTimePicker.min.css +1 -0
- data/vendor/assets/stylesheets/themes/dark/deep-purple/mdDateTimePicker.css +1533 -0
- data/vendor/assets/stylesheets/themes/dark/deep-purple/mdDateTimePicker.min.css +1 -0
- data/vendor/assets/stylesheets/themes/dark/green/mdDateTimePicker.css +1533 -0
- data/vendor/assets/stylesheets/themes/dark/green/mdDateTimePicker.min.css +1 -0
- data/vendor/assets/stylesheets/themes/dark/grey/mdDateTimePicker.css +1533 -0
- data/vendor/assets/stylesheets/themes/dark/grey/mdDateTimePicker.min.css +1 -0
- data/vendor/assets/stylesheets/themes/dark/indigo/mdDateTimePicker.css +1533 -0
- data/vendor/assets/stylesheets/themes/dark/indigo/mdDateTimePicker.min.css +1 -0
- data/vendor/assets/stylesheets/themes/dark/light-blue/mdDateTimePicker.css +1533 -0
- data/vendor/assets/stylesheets/themes/dark/light-blue/mdDateTimePicker.min.css +1 -0
- data/vendor/assets/stylesheets/themes/dark/light-green/mdDateTimePicker.css +1533 -0
- data/vendor/assets/stylesheets/themes/dark/light-green/mdDateTimePicker.min.css +1 -0
- data/vendor/assets/stylesheets/themes/dark/lime/mdDateTimePicker.css +1533 -0
- data/vendor/assets/stylesheets/themes/dark/lime/mdDateTimePicker.min.css +1 -0
- data/vendor/assets/stylesheets/themes/dark/orange/mdDateTimePicker.css +1533 -0
- data/vendor/assets/stylesheets/themes/dark/orange/mdDateTimePicker.min.css +1 -0
- data/vendor/assets/stylesheets/themes/dark/pink/mdDateTimePicker.css +1533 -0
- data/vendor/assets/stylesheets/themes/dark/pink/mdDateTimePicker.min.css +1 -0
- data/vendor/assets/stylesheets/themes/dark/purple/mdDateTimePicker.css +1533 -0
- data/vendor/assets/stylesheets/themes/dark/purple/mdDateTimePicker.min.css +1 -0
- data/vendor/assets/stylesheets/themes/dark/red/mdDateTimePicker.css +1533 -0
- data/vendor/assets/stylesheets/themes/dark/red/mdDateTimePicker.min.css +1 -0
- data/vendor/assets/stylesheets/themes/dark/teal/mdDateTimePicker.css +1533 -0
- data/vendor/assets/stylesheets/themes/dark/teal/mdDateTimePicker.min.css +1 -0
- data/vendor/assets/stylesheets/themes/dark/yellow/mdDateTimePicker.css +1533 -0
- data/vendor/assets/stylesheets/themes/dark/yellow/mdDateTimePicker.min.css +1 -0
- data/vendor/assets/stylesheets/themes/light/amber/mdDateTimePicker.css +1533 -0
- data/vendor/assets/stylesheets/themes/light/amber/mdDateTimePicker.min.css +1 -0
- data/vendor/assets/stylesheets/themes/light/blue-grey/mdDateTimePicker.css +1533 -0
- data/vendor/assets/stylesheets/themes/light/blue-grey/mdDateTimePicker.min.css +1 -0
- data/vendor/assets/stylesheets/themes/light/blue/mdDateTimePicker.css +1533 -0
- data/vendor/assets/stylesheets/themes/light/blue/mdDateTimePicker.min.css +1 -0
- data/vendor/assets/stylesheets/themes/light/brown/mdDateTimePicker.css +1533 -0
- data/vendor/assets/stylesheets/themes/light/brown/mdDateTimePicker.min.css +1 -0
- data/vendor/assets/stylesheets/themes/light/cyan/mdDateTimePicker.css +1533 -0
- data/vendor/assets/stylesheets/themes/light/cyan/mdDateTimePicker.min.css +1 -0
- data/vendor/assets/stylesheets/themes/light/deep-orange/mdDateTimePicker.css +1533 -0
- data/vendor/assets/stylesheets/themes/light/deep-orange/mdDateTimePicker.min.css +1 -0
- data/vendor/assets/stylesheets/themes/light/deep-purple/mdDateTimePicker.css +1533 -0
- data/vendor/assets/stylesheets/themes/light/deep-purple/mdDateTimePicker.min.css +1 -0
- data/vendor/assets/stylesheets/themes/light/green/mdDateTimePicker.css +1533 -0
- data/vendor/assets/stylesheets/themes/light/green/mdDateTimePicker.min.css +1 -0
- data/vendor/assets/stylesheets/themes/light/grey/mdDateTimePicker.css +1533 -0
- data/vendor/assets/stylesheets/themes/light/grey/mdDateTimePicker.min.css +1 -0
- data/vendor/assets/stylesheets/themes/light/indigo/mdDateTimePicker.css +1533 -0
- data/vendor/assets/stylesheets/themes/light/indigo/mdDateTimePicker.min.css +1 -0
- data/vendor/assets/stylesheets/themes/light/light-blue/mdDateTimePicker.css +1533 -0
- data/vendor/assets/stylesheets/themes/light/light-blue/mdDateTimePicker.min.css +1 -0
- data/vendor/assets/stylesheets/themes/light/light-green/mdDateTimePicker.css +1533 -0
- data/vendor/assets/stylesheets/themes/light/light-green/mdDateTimePicker.min.css +1 -0
- data/vendor/assets/stylesheets/themes/light/lime/mdDateTimePicker.css +1533 -0
- data/vendor/assets/stylesheets/themes/light/lime/mdDateTimePicker.min.css +1 -0
- data/vendor/assets/stylesheets/themes/light/orange/mdDateTimePicker.css +1533 -0
- data/vendor/assets/stylesheets/themes/light/orange/mdDateTimePicker.min.css +1 -0
- data/vendor/assets/stylesheets/themes/light/pink/mdDateTimePicker.css +1533 -0
- data/vendor/assets/stylesheets/themes/light/pink/mdDateTimePicker.min.css +1 -0
- data/vendor/assets/stylesheets/themes/light/purple/mdDateTimePicker.css +1533 -0
- data/vendor/assets/stylesheets/themes/light/purple/mdDateTimePicker.min.css +1 -0
- data/vendor/assets/stylesheets/themes/light/red/mdDateTimePicker.css +1533 -0
- data/vendor/assets/stylesheets/themes/light/red/mdDateTimePicker.min.css +1 -0
- data/vendor/assets/stylesheets/themes/light/teal/mdDateTimePicker.css +1533 -0
- data/vendor/assets/stylesheets/themes/light/teal/mdDateTimePicker.min.css +1 -0
- data/vendor/assets/stylesheets/themes/light/yellow/mdDateTimePicker.css +1533 -0
- data/vendor/assets/stylesheets/themes/light/yellow/mdDateTimePicker.min.css +1 -0
- metadata +110 -1
checksums.yaml
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
---
|
2
2
|
SHA1:
|
3
|
-
metadata.gz:
|
4
|
-
data.tar.gz:
|
3
|
+
metadata.gz: aba4d28c8f11e2435d30493018627351c506ef5b
|
4
|
+
data.tar.gz: 70c6ceb06b0dc57c2a735a548c66fbeb4a52c938
|
5
5
|
SHA512:
|
6
|
-
metadata.gz:
|
7
|
-
data.tar.gz:
|
6
|
+
metadata.gz: 4154c3ba49a51fa62b52989fcd1c429df2e139fe5f010005e49333a3b78a735e984872f5bac54fa2f1ce5ef27ca78a7631b945a74b0a6055337924cee3376d47
|
7
|
+
data.tar.gz: 21f0dbcf6654c9fac242d3f949d2661785a199e7ed10e132b1e1f185c13dd8c4d4a1ee2a563fbd8279f60a50ddcffa8e4e6fd08c1108c68d708de01cf919d5ef
|
Binary file
|
Binary file
|
Binary file
|
Binary file
|
Binary file
|
Binary file
|
Binary file
|
Binary file
|
Binary file
|
Binary file
|
Binary file
|
Binary file
|
Binary file
|
Binary file
|
Binary file
|
Binary file
|
Binary file
|
Binary file
|
@@ -0,0 +1 @@
|
|
1
|
+
<svg fill="rgba(0,0,0,0.7)" height="24" viewBox="0 0 24 24" width="24" xmlns="http://www.w3.org/2000/svg"><path d="M15.41 16.09l-4.58-4.59 4.58-4.59L14 5.5l-6 6 6 6z"/><path d="M0-.5h24v24H0z" fill="none"/></svg>
|
@@ -0,0 +1 @@
|
|
1
|
+
<svg fill="rgba(0,0,0,0.26)" height="24" viewBox="0 0 24 24" width="24" xmlns="http://www.w3.org/2000/svg"><path d="M15.41 16.09l-4.58-4.59 4.58-4.59L14 5.5l-6 6 6 6z"/><path d="M0-.5h24v24H0z" fill="none"/></svg>
|
@@ -0,0 +1 @@
|
|
1
|
+
<svg fill="rgba(255,255,255,0.7)" height="24" viewBox="0 0 24 24" width="24" xmlns="http://www.w3.org/2000/svg"><path d="M15.41 16.09l-4.58-4.59 4.58-4.59L14 5.5l-6 6 6 6z"/><path d="M0-.5h24v24H0z" fill="none"/></svg>
|
@@ -0,0 +1 @@
|
|
1
|
+
<svg fill="rgba(255,255,255,0.3)" height="24" viewBox="0 0 24 24" width="24" xmlns="http://www.w3.org/2000/svg"><path d="M15.41 16.09l-4.58-4.59 4.58-4.59L14 5.5l-6 6 6 6z"/><path d="M0-.5h24v24H0z" fill="none"/></svg>
|
@@ -0,0 +1 @@
|
|
1
|
+
<svg fill="rgba(0,0,0,0.7)" height="24" viewBox="0 0 24 24" width="24" xmlns="http://www.w3.org/2000/svg"><path d="M8.59 16.34l4.58-4.59-4.58-4.59L10 5.75l6 6-6 6z"/><path d="M0-.25h24v24H0z" fill="none"/></svg>
|
@@ -0,0 +1 @@
|
|
1
|
+
<svg fill="rgba(0,0,0,0.26)" height="24" viewBox="0 0 24 24" width="24" xmlns="http://www.w3.org/2000/svg"><path d="M8.59 16.34l4.58-4.59-4.58-4.59L10 5.75l6 6-6 6z"/><path d="M0-.25h24v24H0z" fill="none"/></svg>
|
@@ -0,0 +1 @@
|
|
1
|
+
<svg fill="rgba(255,255,255,0.7)" height="24" viewBox="0 0 24 24" width="24" xmlns="http://www.w3.org/2000/svg"><path d="M8.59 16.34l4.58-4.59-4.58-4.59L10 5.75l6 6-6 6z"/><path d="M0-.25h24v24H0z" fill="none"/></svg>
|
@@ -0,0 +1 @@
|
|
1
|
+
<svg fill="rgba(255,255,255,0.3)" height="24" viewBox="0 0 24 24" width="24" xmlns="http://www.w3.org/2000/svg"><path d="M8.59 16.34l4.58-4.59-4.58-4.59L10 5.75l6 6-6 6z"/><path d="M0-.25h24v24H0z" fill="none"/></svg>
|
@@ -0,0 +1,8 @@
|
|
1
|
+
/*!
|
2
|
+
* Draggabilly PACKAGED v2.1.0
|
3
|
+
* Make that shiz draggable
|
4
|
+
* http://draggabilly.desandro.com
|
5
|
+
* MIT license
|
6
|
+
*/
|
7
|
+
|
8
|
+
!function(t,i){"function"==typeof define&&define.amd?define("jquery-bridget/jquery-bridget",["jquery"],function(e){i(t,e)}):"object"==typeof module&&module.exports?module.exports=i(t,require("jquery")):t.jQueryBridget=i(t,t.jQuery)}(window,function(t,i){function e(e,r,a){function h(t,i,n){var o,r="$()."+e+'("'+i+'")';return t.each(function(t,h){var d=a.data(h,e);if(!d)return void s(e+" not initialized. Cannot call methods, i.e. "+r);var u=d[i];if(!u||"_"==i.charAt(0))return void s(r+" is not a valid method");var p=u.apply(d,n);o=void 0===o?p:o}),void 0!==o?o:t}function d(t,i){t.each(function(t,n){var o=a.data(n,e);o?(o.option(i),o._init()):(o=new r(n,i),a.data(n,e,o))})}a=a||i||t.jQuery,a&&(r.prototype.option||(r.prototype.option=function(t){a.isPlainObject(t)&&(this.options=a.extend(!0,this.options,t))}),a.fn[e]=function(t){if("string"==typeof t){var i=o.call(arguments,1);return h(this,t,i)}return d(this,t),this},n(a))}function n(t){!t||t&&t.bridget||(t.bridget=e)}var o=Array.prototype.slice,r=t.console,s="undefined"==typeof r?function(){}:function(t){r.error(t)};return n(i||t.jQuery),e}),function(t,i){"function"==typeof define&&define.amd?define("get-size/get-size",[],function(){return i()}):"object"==typeof module&&module.exports?module.exports=i():t.getSize=i()}(window,function(){function t(t){var i=parseFloat(t),e=-1==t.indexOf("%")&&!isNaN(i);return e&&i}function i(){}function e(){for(var t={width:0,height:0,innerWidth:0,innerHeight:0,outerWidth:0,outerHeight:0},i=0;d>i;i++){var e=h[i];t[e]=0}return t}function n(t){var i=getComputedStyle(t);return i||a("Style returned "+i+". Are you running this code in a hidden iframe on Firefox? See http://bit.ly/getsizebug1"),i}function o(){if(!u){u=!0;var i=document.createElement("div");i.style.width="200px",i.style.padding="1px 2px 3px 4px",i.style.borderStyle="solid",i.style.borderWidth="1px 2px 3px 4px",i.style.boxSizing="border-box";var e=document.body||document.documentElement;e.appendChild(i);var o=n(i);r.isBoxSizeOuter=s=200==t(o.width),e.removeChild(i)}}function r(i){if(o(),"string"==typeof i&&(i=document.querySelector(i)),i&&"object"==typeof i&&i.nodeType){var r=n(i);if("none"==r.display)return e();var a={};a.width=i.offsetWidth,a.height=i.offsetHeight;for(var u=a.isBorderBox="border-box"==r.boxSizing,p=0;d>p;p++){var c=h[p],f=r[c],g=parseFloat(f);a[c]=isNaN(g)?0:g}var l=a.paddingLeft+a.paddingRight,v=a.paddingTop+a.paddingBottom,m=a.marginLeft+a.marginRight,y=a.marginTop+a.marginBottom,b=a.borderLeftWidth+a.borderRightWidth,P=a.borderTopWidth+a.borderBottomWidth,E=u&&s,_=t(r.width);_!==!1&&(a.width=_+(E?0:l+b));var x=t(r.height);return x!==!1&&(a.height=x+(E?0:v+P)),a.innerWidth=a.width-(l+b),a.innerHeight=a.height-(v+P),a.outerWidth=a.width+m,a.outerHeight=a.height+y,a}}var s,a="undefined"==typeof console?i:function(t){console.error(t)},h=["paddingLeft","paddingRight","paddingTop","paddingBottom","marginLeft","marginRight","marginTop","marginBottom","borderLeftWidth","borderRightWidth","borderTopWidth","borderBottomWidth"],d=h.length,u=!1;return r}),function(t,i){"function"==typeof define&&define.amd?define("ev-emitter/ev-emitter",i):"object"==typeof module&&module.exports?module.exports=i():t.EvEmitter=i()}(this,function(){function t(){}var i=t.prototype;return i.on=function(t,i){if(t&&i){var e=this._events=this._events||{},n=e[t]=e[t]||[];return-1==n.indexOf(i)&&n.push(i),this}},i.once=function(t,i){if(t&&i){this.on(t,i);var e=this._onceEvents=this._onceEvents||{},n=e[t]=e[t]||[];return n[i]=!0,this}},i.off=function(t,i){var e=this._events&&this._events[t];if(e&&e.length){var n=e.indexOf(i);return-1!=n&&e.splice(n,1),this}},i.emitEvent=function(t,i){var e=this._events&&this._events[t];if(e&&e.length){var n=0,o=e[n];i=i||[];for(var r=this._onceEvents&&this._onceEvents[t];o;){var s=r&&r[o];s&&(this.off(t,o),delete r[o]),o.apply(this,i),n+=s?0:1,o=e[n]}return this}},t}),function(t,i){"function"==typeof define&&define.amd?define("unipointer/unipointer",["ev-emitter/ev-emitter"],function(e){return i(t,e)}):"object"==typeof module&&module.exports?module.exports=i(t,require("ev-emitter")):t.Unipointer=i(t,t.EvEmitter)}(window,function(t,i){function e(){}function n(){}var o=n.prototype=Object.create(i.prototype);o.bindStartEvent=function(t){this._bindStartEvent(t,!0)},o.unbindStartEvent=function(t){this._bindStartEvent(t,!1)},o._bindStartEvent=function(i,e){e=void 0===e?!0:!!e;var n=e?"addEventListener":"removeEventListener";t.navigator.pointerEnabled?i[n]("pointerdown",this):t.navigator.msPointerEnabled?i[n]("MSPointerDown",this):(i[n]("mousedown",this),i[n]("touchstart",this))},o.handleEvent=function(t){var i="on"+t.type;this[i]&&this[i](t)},o.getTouch=function(t){for(var i=0;i<t.length;i++){var e=t[i];if(e.identifier==this.pointerIdentifier)return e}},o.onmousedown=function(t){var i=t.button;i&&0!==i&&1!==i||this._pointerDown(t,t)},o.ontouchstart=function(t){this._pointerDown(t,t.changedTouches[0])},o.onMSPointerDown=o.onpointerdown=function(t){this._pointerDown(t,t)},o._pointerDown=function(t,i){this.isPointerDown||(this.isPointerDown=!0,this.pointerIdentifier=void 0!==i.pointerId?i.pointerId:i.identifier,this.pointerDown(t,i))},o.pointerDown=function(t,i){this._bindPostStartEvents(t),this.emitEvent("pointerDown",[t,i])};var r={mousedown:["mousemove","mouseup"],touchstart:["touchmove","touchend","touchcancel"],pointerdown:["pointermove","pointerup","pointercancel"],MSPointerDown:["MSPointerMove","MSPointerUp","MSPointerCancel"]};return o._bindPostStartEvents=function(i){if(i){var e=r[i.type];e.forEach(function(i){t.addEventListener(i,this)},this),this._boundPointerEvents=e}},o._unbindPostStartEvents=function(){this._boundPointerEvents&&(this._boundPointerEvents.forEach(function(i){t.removeEventListener(i,this)},this),delete this._boundPointerEvents)},o.onmousemove=function(t){this._pointerMove(t,t)},o.onMSPointerMove=o.onpointermove=function(t){t.pointerId==this.pointerIdentifier&&this._pointerMove(t,t)},o.ontouchmove=function(t){var i=this.getTouch(t.changedTouches);i&&this._pointerMove(t,i)},o._pointerMove=function(t,i){this.pointerMove(t,i)},o.pointerMove=function(t,i){this.emitEvent("pointerMove",[t,i])},o.onmouseup=function(t){this._pointerUp(t,t)},o.onMSPointerUp=o.onpointerup=function(t){t.pointerId==this.pointerIdentifier&&this._pointerUp(t,t)},o.ontouchend=function(t){var i=this.getTouch(t.changedTouches);i&&this._pointerUp(t,i)},o._pointerUp=function(t,i){this._pointerDone(),this.pointerUp(t,i)},o.pointerUp=function(t,i){this.emitEvent("pointerUp",[t,i])},o._pointerDone=function(){this.isPointerDown=!1,delete this.pointerIdentifier,this._unbindPostStartEvents(),this.pointerDone()},o.pointerDone=e,o.onMSPointerCancel=o.onpointercancel=function(t){t.pointerId==this.pointerIdentifier&&this._pointerCancel(t,t)},o.ontouchcancel=function(t){var i=this.getTouch(t.changedTouches);i&&this._pointerCancel(t,i)},o._pointerCancel=function(t,i){this._pointerDone(),this.pointerCancel(t,i)},o.pointerCancel=function(t,i){this.emitEvent("pointerCancel",[t,i])},n.getPointerPoint=function(t){return{x:t.pageX,y:t.pageY}},n}),function(t,i){"function"==typeof define&&define.amd?define("unidragger/unidragger",["unipointer/unipointer"],function(e){return i(t,e)}):"object"==typeof module&&module.exports?module.exports=i(t,require("unipointer")):t.Unidragger=i(t,t.Unipointer)}(window,function(t,i){function e(){}function n(){}var o=n.prototype=Object.create(i.prototype);o.bindHandles=function(){this._bindHandles(!0)},o.unbindHandles=function(){this._bindHandles(!1)};var r=t.navigator;return o._bindHandles=function(t){t=void 0===t?!0:!!t;var i;i=r.pointerEnabled?function(i){i.style.touchAction=t?"none":""}:r.msPointerEnabled?function(i){i.style.msTouchAction=t?"none":""}:e;for(var n=t?"addEventListener":"removeEventListener",o=0;o<this.handles.length;o++){var s=this.handles[o];this._bindStartEvent(s,t),i(s),s[n]("click",this)}},o.pointerDown=function(t,i){if("INPUT"==t.target.nodeName&&"range"==t.target.type)return this.isPointerDown=!1,void delete this.pointerIdentifier;this._dragPointerDown(t,i);var e=document.activeElement;e&&e.blur&&e.blur(),this._bindPostStartEvents(t),this.emitEvent("pointerDown",[t,i])},o._dragPointerDown=function(t,e){this.pointerDownPoint=i.getPointerPoint(e);var n=this.canPreventDefaultOnPointerDown(t,e);n&&t.preventDefault()},o.canPreventDefaultOnPointerDown=function(t){return"SELECT"!=t.target.nodeName},o.pointerMove=function(t,i){var e=this._dragPointerMove(t,i);this.emitEvent("pointerMove",[t,i,e]),this._dragMove(t,i,e)},o._dragPointerMove=function(t,e){var n=i.getPointerPoint(e),o={x:n.x-this.pointerDownPoint.x,y:n.y-this.pointerDownPoint.y};return!this.isDragging&&this.hasDragStarted(o)&&this._dragStart(t,e),o},o.hasDragStarted=function(t){return Math.abs(t.x)>3||Math.abs(t.y)>3},o.pointerUp=function(t,i){this.emitEvent("pointerUp",[t,i]),this._dragPointerUp(t,i)},o._dragPointerUp=function(t,i){this.isDragging?this._dragEnd(t,i):this._staticClick(t,i)},o._dragStart=function(t,e){this.isDragging=!0,this.dragStartPoint=i.getPointerPoint(e),this.isPreventingClicks=!0,this.dragStart(t,e)},o.dragStart=function(t,i){this.emitEvent("dragStart",[t,i])},o._dragMove=function(t,i,e){this.isDragging&&this.dragMove(t,i,e)},o.dragMove=function(t,i,e){t.preventDefault(),this.emitEvent("dragMove",[t,i,e])},o._dragEnd=function(t,i){this.isDragging=!1,setTimeout(function(){delete this.isPreventingClicks}.bind(this)),this.dragEnd(t,i)},o.dragEnd=function(t,i){this.emitEvent("dragEnd",[t,i])},o.onclick=function(t){this.isPreventingClicks&&t.preventDefault()},o._staticClick=function(t,i){if(!this.isIgnoringMouseUp||"mouseup"!=t.type){var e=t.target.nodeName;("INPUT"==e||"TEXTAREA"==e)&&t.target.focus(),this.staticClick(t,i),"mouseup"!=t.type&&(this.isIgnoringMouseUp=!0,setTimeout(function(){delete this.isIgnoringMouseUp}.bind(this),400))}},o.staticClick=function(t,i){this.emitEvent("staticClick",[t,i])},n.getPointerPoint=i.getPointerPoint,n}),function(t,i){"function"==typeof define&&define.amd?define(["get-size/get-size","unidragger/unidragger"],function(e,n){return i(t,e,n)}):"object"==typeof module&&module.exports?module.exports=i(t,require("get-size"),require("unidragger")):t.Draggabilly=i(t,t.getSize,t.Unidragger)}(window,function(t,i,e){function n(){}function o(t,i){for(var e in i)t[e]=i[e];return t}function r(t){return t instanceof HTMLElement}function s(t,i){this.element="string"==typeof t?h.querySelector(t):t,f&&(this.$element=f(this.element)),this.options=o({},this.constructor.defaults),this.option(i),this._create()}function a(t,i,e){return e=e||"round",i?Math[e](t/i)*i:t}var h=t.document,d=t.requestAnimationFrame||t.webkitRequestAnimationFrame||t.mozRequestAnimationFrame,u=0;d||(d=function(t){var i=(new Date).getTime(),e=Math.max(0,16-(i-u)),n=setTimeout(t,e);return u=i+e,n});var p=h.documentElement,c="string"==typeof p.style.transform?"transform":"WebkitTransform",f=t.jQuery,g=s.prototype=Object.create(e.prototype);return s.defaults={},g.option=function(t){o(this.options,t)},g._create=function(){this.position={},this._getPosition(),this.startPoint={x:0,y:0},this.dragPoint={x:0,y:0},this.startPosition=o({},this.position);var t=getComputedStyle(this.element);"relative"!=t.position&&"absolute"!=t.position&&(this.element.style.position="relative"),this.enable(),this.setHandles()},g.setHandles=function(){this.handles=this.options.handle?this.element.querySelectorAll(this.options.handle):[this.element],this.bindHandles()},g.dispatchEvent=function(i,e,n){var o=[e].concat(n);this.emitEvent(i,o);var r=t.jQuery;if(r&&this.$element)if(e){var s=r.Event(e);s.type=i,this.$element.trigger(s,n)}else this.$element.trigger(i,n)},s.prototype._getPosition=function(){var t=getComputedStyle(this.element),i=this._getPositionCoord(t.left,"width"),e=this._getPositionCoord(t.top,"height");this.position.x=isNaN(i)?0:i,this.position.y=isNaN(e)?0:e,this._addTransformPosition(t)},s.prototype._getPositionCoord=function(t,e){if(-1!=t.indexOf("%")){var n=i(this.element.parentNode);return parseFloat(t)/100*n[e]}return parseInt(t,10)},g._addTransformPosition=function(t){var i=t[c];if(0===i.indexOf("matrix")){var e=i.split(","),n=0===i.indexOf("matrix3d")?12:4,o=parseInt(e[n],10),r=parseInt(e[n+1],10);this.position.x+=o,this.position.y+=r}},g.pointerDown=function(t,i){this._dragPointerDown(t,i);var e=h.activeElement;e&&e.blur&&e!=h.body&&e.blur(),this._bindPostStartEvents(t),this.element.classList.add("is-pointer-down"),this.dispatchEvent("pointerDown",t,[i])},g.pointerMove=function(t,i){var e=this._dragPointerMove(t,i);this.dispatchEvent("pointerMove",t,[i,e]),this._dragMove(t,i,e)},g.dragStart=function(t,i){this.isEnabled&&(this._getPosition(),this.measureContainment(),this.startPosition.x=this.position.x,this.startPosition.y=this.position.y,this.setLeftTop(),this.dragPoint.x=0,this.dragPoint.y=0,this.element.classList.add("is-dragging"),this.dispatchEvent("dragStart",t,[i]),this.animate())},g.measureContainment=function(){var t=this.options.containment;if(t){var e=r(t)?t:"string"==typeof t?h.querySelector(t):this.element.parentNode,n=i(this.element),o=i(e),s=this.element.getBoundingClientRect(),a=e.getBoundingClientRect(),d=o.borderLeftWidth+o.borderRightWidth,u=o.borderTopWidth+o.borderBottomWidth,p=this.relativeStartPosition={x:s.left-(a.left+o.borderLeftWidth),y:s.top-(a.top+o.borderTopWidth)};this.containSize={width:o.width-d-p.x-n.width,height:o.height-u-p.y-n.height}}},g.dragMove=function(t,i,e){if(this.isEnabled){var n=e.x,o=e.y,r=this.options.grid,s=r&&r[0],h=r&&r[1];n=a(n,s),o=a(o,h),n=this.containDrag("x",n,s),o=this.containDrag("y",o,h),n="y"==this.options.axis?0:n,o="x"==this.options.axis?0:o,this.position.x=this.startPosition.x+n,this.position.y=this.startPosition.y+o,this.dragPoint.x=n,this.dragPoint.y=o,this.dispatchEvent("dragMove",t,[i,e])}},g.containDrag=function(t,i,e){if(!this.options.containment)return i;var n="x"==t?"width":"height",o=this.relativeStartPosition[t],r=a(-o,e,"ceil"),s=this.containSize[n];return s=a(s,e,"floor"),Math.min(s,Math.max(r,i))},g.pointerUp=function(t,i){this.element.classList.remove("is-pointer-down"),this.dispatchEvent("pointerUp",t,[i]),this._dragPointerUp(t,i)},g.dragEnd=function(t,i){this.isEnabled&&(c&&(this.element.style[c]="",this.setLeftTop()),this.element.classList.remove("is-dragging"),this.dispatchEvent("dragEnd",t,[i]))},g.animate=function(){if(this.isDragging){this.positionDrag();var t=this;d(function(){t.animate()})}},g.setLeftTop=function(){this.element.style.left=this.position.x+"px",this.element.style.top=this.position.y+"px"},g.positionDrag=function(){this.element.style[c]="translate3d( "+this.dragPoint.x+"px, "+this.dragPoint.y+"px, 0)"},g.staticClick=function(t,i){this.dispatchEvent("staticClick",t,[i])},g.enable=function(){this.isEnabled=!0},g.disable=function(){this.isEnabled=!1,this.isDragging&&this.dragEnd()},g.destroy=function(){this.disable(),this.element.style[c]="",this.element.style.left="",this.element.style.top="",this.element.style.position="",this.unbindHandles(),this.$element&&this.$element.removeData("draggabilly")},g._init=n,f&&f.bridget&&f.bridget("draggabilly",s),s});
|
@@ -0,0 +1,1250 @@
|
|
1
|
+
(function (global, factory) {
|
2
|
+
if (typeof define === "function" && define.amd) {
|
3
|
+
define(['exports'], factory);
|
4
|
+
} else if (typeof exports !== "undefined") {
|
5
|
+
factory(exports);
|
6
|
+
} else {
|
7
|
+
var mod = {
|
8
|
+
exports: {}
|
9
|
+
};
|
10
|
+
factory(mod.exports);
|
11
|
+
global.mdDateTimePicker = mod.exports;
|
12
|
+
}
|
13
|
+
})(this, function (exports) {
|
14
|
+
'use strict';
|
15
|
+
|
16
|
+
Object.defineProperty(exports, "__esModule", {
|
17
|
+
value: true
|
18
|
+
});
|
19
|
+
|
20
|
+
function _classCallCheck(instance, Constructor) {
|
21
|
+
if (!(instance instanceof Constructor)) {
|
22
|
+
throw new TypeError("Cannot call a class as a function");
|
23
|
+
}
|
24
|
+
}
|
25
|
+
|
26
|
+
var _createClass = function () {
|
27
|
+
function defineProperties(target, props) {
|
28
|
+
for (var i = 0; i < props.length; i++) {
|
29
|
+
var descriptor = props[i];
|
30
|
+
descriptor.enumerable = descriptor.enumerable || !1;
|
31
|
+
descriptor.configurable = !0;
|
32
|
+
if ("value" in descriptor) descriptor.writable = !0;
|
33
|
+
Object.defineProperty(target, descriptor.key, descriptor);
|
34
|
+
}
|
35
|
+
}
|
36
|
+
|
37
|
+
return function (Constructor, protoProps, staticProps) {
|
38
|
+
if (protoProps) defineProperties(Constructor.prototype, protoProps);
|
39
|
+
if (staticProps) defineProperties(Constructor, staticProps);
|
40
|
+
return Constructor;
|
41
|
+
};
|
42
|
+
}(),
|
43
|
+
_dialog = {
|
44
|
+
view: !0,
|
45
|
+
state: !1
|
46
|
+
},
|
47
|
+
mdDateTimePicker = function () {
|
48
|
+
/**
|
49
|
+
* [constructor of the mdDateTimePicker]
|
50
|
+
*
|
51
|
+
* @method constructor
|
52
|
+
*
|
53
|
+
* @param {[string]} type = 'date' or 'time [type of dialog]
|
54
|
+
* @param {[moment]} init [initial value for the dialog date or time, defaults to today] [@default = today]
|
55
|
+
* @param {[moment]} past [the past moment till which the calendar shall render] [@default = exactly 21 Years ago from init]
|
56
|
+
* @param {[moment]} future [the future moment till which the calendar shall render] [@default = init]
|
57
|
+
* @param {[Boolean]} mode [this value tells whether the time dialog will have the 24 hour mode (true) or 12 hour mode (false)] [@default = false]
|
58
|
+
* @param {[string]} orientation = 'LANDSCAPE' or 'PORTRAIT' [force the orientation of the picker @default = 'LANDSCAPE']
|
59
|
+
* @param {[element]} trigger [element on which all the events will be dispatched e.g var foo = document.getElementById('bar'), here element = foo]
|
60
|
+
*
|
61
|
+
* @return {[Object]} [mdDateTimePicker]
|
62
|
+
*/
|
63
|
+
|
64
|
+
function mdDateTimePicker(_ref) {
|
65
|
+
var type = _ref.type,
|
66
|
+
_ref$init = _ref.init,
|
67
|
+
init = _ref$init === undefined ? moment() : _ref$init,
|
68
|
+
_ref$past = _ref.past,
|
69
|
+
past = _ref$past === undefined ? moment().subtract(21, 'years') : _ref$past,
|
70
|
+
_ref$future = _ref.future,
|
71
|
+
future = _ref$future === undefined ? init : _ref$future,
|
72
|
+
_ref$mode = _ref.mode,
|
73
|
+
mode = _ref$mode === undefined ? !1 : _ref$mode,
|
74
|
+
_ref$orientation = _ref.orientation,
|
75
|
+
orientation = _ref$orientation === undefined ? 'LANDSCAPE' : _ref$orientation,
|
76
|
+
_ref$trigger = _ref.trigger,
|
77
|
+
trigger = _ref$trigger === undefined ? '' : _ref$trigger;
|
78
|
+
|
79
|
+
_classCallCheck(this, mdDateTimePicker);
|
80
|
+
|
81
|
+
this._type = type;
|
82
|
+
this._init = init;
|
83
|
+
this._past = past;
|
84
|
+
this._future = future;
|
85
|
+
this._mode = mode;
|
86
|
+
this._orientation = orientation;
|
87
|
+
this._trigger = trigger;
|
88
|
+
|
89
|
+
/**
|
90
|
+
* [dialog selected classes have the same structure as dialog but one level down]
|
91
|
+
* @type {Object}
|
92
|
+
* e.g
|
93
|
+
* sDialog = {
|
94
|
+
* picker: 'some-picker-selected'
|
95
|
+
* }
|
96
|
+
*/
|
97
|
+
this._sDialog = {};
|
98
|
+
// attach the dialog if not present
|
99
|
+
if (!document.getElementById('mddtp-picker__' + this._type)) {
|
100
|
+
this._buildDialog();
|
101
|
+
}
|
102
|
+
}
|
103
|
+
|
104
|
+
/**
|
105
|
+
* [time to get or set the current picker's moment]
|
106
|
+
*
|
107
|
+
* @method time
|
108
|
+
*
|
109
|
+
* @param {[moment]} m
|
110
|
+
*
|
111
|
+
*/
|
112
|
+
|
113
|
+
|
114
|
+
_createClass(mdDateTimePicker, [{
|
115
|
+
key: 'toggle',
|
116
|
+
value: function toggle() {
|
117
|
+
this._selectDialog();
|
118
|
+
// work according to the current state of the dialog
|
119
|
+
if (mdDateTimePicker.dialog.state) {
|
120
|
+
this._hideDialog();
|
121
|
+
} else {
|
122
|
+
if (this._type === 'date') {
|
123
|
+
this._initDateDialog(this._init);
|
124
|
+
} else if (this._type === 'time') {
|
125
|
+
this._initTimeDialog(this._init);
|
126
|
+
}
|
127
|
+
this._showDialog();
|
128
|
+
}
|
129
|
+
}
|
130
|
+
}, {
|
131
|
+
key: '_selectDialog',
|
132
|
+
value: function _selectDialog() {
|
133
|
+
// now do what you normally would do
|
134
|
+
this._sDialog.picker = document.getElementById('mddtp-picker__' + [this._type]);
|
135
|
+
/**
|
136
|
+
* [sDialogEls stores all inner components of the selected dialog or sDialog to be later getElementById]
|
137
|
+
*
|
138
|
+
* @type {Array}
|
139
|
+
*/
|
140
|
+
var sDialogEls = ['viewHolder', 'years', 'header', 'cancel', 'ok', 'left', 'right', 'previous', 'current', 'next', 'subtitle', 'title', 'titleDay', 'titleMonth', 'AM', 'PM', 'needle', 'hourView', 'minuteView', 'hour', 'minute', 'fakeNeedle', 'circularHolder', 'circle', 'dotSpan'],
|
141
|
+
i = sDialogEls.length;
|
142
|
+
|
143
|
+
while (i--) {
|
144
|
+
this._sDialog[sDialogEls[i]] = document.getElementById('mddtp-' + this._type + '__' + sDialogEls[i]);
|
145
|
+
}
|
146
|
+
|
147
|
+
this._sDialog.tDate = this._init.clone();
|
148
|
+
this._sDialog.sDate = this._init.clone();
|
149
|
+
}
|
150
|
+
}, {
|
151
|
+
key: '_showDialog',
|
152
|
+
value: function _showDialog() {
|
153
|
+
var me = this,
|
154
|
+
zoomIn = 'zoomIn';
|
155
|
+
|
156
|
+
mdDateTimePicker.dialog.state = !0;
|
157
|
+
this._sDialog.picker.classList.remove('mddtp-picker--inactive');
|
158
|
+
this._sDialog.picker.classList.add(zoomIn);
|
159
|
+
// if the dialog is forced into portrait mode
|
160
|
+
if (this._orientation === 'PORTRAIT') {
|
161
|
+
this._sDialog.picker.classList.add('mddtp-picker--portrait');
|
162
|
+
}
|
163
|
+
setTimeout(function () {
|
164
|
+
me._sDialog.picker.classList.remove(zoomIn);
|
165
|
+
}, 300);
|
166
|
+
}
|
167
|
+
}, {
|
168
|
+
key: '_hideDialog',
|
169
|
+
value: function _hideDialog() {
|
170
|
+
var me = this,
|
171
|
+
years = this._sDialog.years,
|
172
|
+
title = me._sDialog.title,
|
173
|
+
subtitle = me._sDialog.subtitle,
|
174
|
+
viewHolder = this._sDialog.viewHolder,
|
175
|
+
AM = this._sDialog.AM,
|
176
|
+
PM = this._sDialog.PM,
|
177
|
+
minute = this._sDialog.minute,
|
178
|
+
hour = this._sDialog.hour,
|
179
|
+
minuteView = this._sDialog.minuteView,
|
180
|
+
hourView = this._sDialog.hourView,
|
181
|
+
picker = this._sDialog.picker,
|
182
|
+
needle = this._sDialog.needle,
|
183
|
+
dotSpan = this._sDialog.dotSpan,
|
184
|
+
active = 'mddtp-picker__color--active',
|
185
|
+
inactive = 'mddtp-picker--inactive',
|
186
|
+
invisible = 'mddtp-picker__years--invisible',
|
187
|
+
zoomIn = 'zoomIn',
|
188
|
+
zoomOut = 'zoomOut',
|
189
|
+
hidden = 'mddtp-picker__circularView--hidden',
|
190
|
+
selection = 'mddtp-picker__selection';
|
191
|
+
|
192
|
+
mdDateTimePicker.dialog.state = !1;
|
193
|
+
mdDateTimePicker.dialog.view = !0;
|
194
|
+
this._sDialog.picker.classList.add(zoomOut);
|
195
|
+
// reset classes
|
196
|
+
if (this._type === 'date') {
|
197
|
+
years.classList.remove(zoomIn, zoomOut);
|
198
|
+
years.classList.add(invisible);
|
199
|
+
title.classList.remove(active);
|
200
|
+
subtitle.classList.add(active);
|
201
|
+
viewHolder.classList.remove(zoomOut);
|
202
|
+
} else {
|
203
|
+
AM.classList.remove(active);
|
204
|
+
PM.classList.remove(active);
|
205
|
+
minute.classList.remove(active);
|
206
|
+
hour.classList.add(active);
|
207
|
+
minuteView.classList.add(hidden);
|
208
|
+
hourView.classList.remove(hidden);
|
209
|
+
subtitle.setAttribute('style', 'display: none');
|
210
|
+
dotSpan.setAttribute('style', 'display: none');
|
211
|
+
needle.className = selection;
|
212
|
+
}
|
213
|
+
setTimeout(function () {
|
214
|
+
// remove portrait mode
|
215
|
+
me._sDialog.picker.classList.remove('mddtp-picker--portrait');
|
216
|
+
me._sDialog.picker.classList.remove(zoomOut);
|
217
|
+
me._sDialog.picker.classList.add(inactive);
|
218
|
+
// clone elements and add them again to clear events attached to them
|
219
|
+
var pickerClone = picker.cloneNode(!0);
|
220
|
+
picker.parentNode.replaceChild(pickerClone, picker);
|
221
|
+
}, 300);
|
222
|
+
}
|
223
|
+
}, {
|
224
|
+
key: '_buildDialog',
|
225
|
+
value: function _buildDialog() {
|
226
|
+
var type = this._type,
|
227
|
+
docfrag = document.createDocumentFragment(),
|
228
|
+
container = document.createElement('div'),
|
229
|
+
header = document.createElement('div'),
|
230
|
+
body = document.createElement('div'),
|
231
|
+
action = document.createElement('div'),
|
232
|
+
cancel = document.createElement('button'),
|
233
|
+
ok = document.createElement('button');
|
234
|
+
// outer most container of the picker
|
235
|
+
|
236
|
+
// header container of the picker
|
237
|
+
|
238
|
+
// body container of the picker
|
239
|
+
|
240
|
+
// action elements container
|
241
|
+
|
242
|
+
// ... add properties to them
|
243
|
+
container.id = 'mddtp-picker__' + type;
|
244
|
+
container.classList.add('mddtp-picker');
|
245
|
+
container.classList.add('mddtp-picker-' + type);
|
246
|
+
container.classList.add('mddtp-picker--inactive');
|
247
|
+
container.classList.add('animated');
|
248
|
+
this._addId(header, 'header');
|
249
|
+
this._addClass(header, 'header');
|
250
|
+
// add header to container
|
251
|
+
container.appendChild(header);
|
252
|
+
this._addClass(body, 'body');
|
253
|
+
body.appendChild(action);
|
254
|
+
// add body to container
|
255
|
+
container.appendChild(body);
|
256
|
+
// add stuff to header and body according to dialog type
|
257
|
+
if (this._type === 'date') {
|
258
|
+
var subtitle = document.createElement('div'),
|
259
|
+
title = document.createElement('div'),
|
260
|
+
titleDay = document.createElement('div'),
|
261
|
+
titleMonth = document.createElement('div'),
|
262
|
+
viewHolder = document.createElement('div'),
|
263
|
+
views = document.createElement('ul'),
|
264
|
+
previous = document.createElement('li'),
|
265
|
+
current = document.createElement('li'),
|
266
|
+
next = document.createElement('li'),
|
267
|
+
left = document.createElement('button'),
|
268
|
+
right = document.createElement('button'),
|
269
|
+
years = document.createElement('ul');
|
270
|
+
|
271
|
+
// inside header
|
272
|
+
// adding properties to them
|
273
|
+
this._addId(subtitle, 'subtitle');
|
274
|
+
this._addClass(subtitle, 'subtitle');
|
275
|
+
this._addId(title, 'title');
|
276
|
+
this._addClass(title, 'title', ['mddtp-picker__color--active']);
|
277
|
+
this._addId(titleDay, 'titleDay');
|
278
|
+
this._addId(titleMonth, 'titleMonth');
|
279
|
+
// add title stuff to it
|
280
|
+
title.appendChild(titleDay);
|
281
|
+
title.appendChild(titleMonth);
|
282
|
+
// add them to header
|
283
|
+
header.appendChild(subtitle);
|
284
|
+
header.appendChild(title);
|
285
|
+
// inside body
|
286
|
+
// inside viewHolder
|
287
|
+
this._addId(viewHolder, 'viewHolder');
|
288
|
+
this._addClass(viewHolder, 'viewHolder', ['animated']);
|
289
|
+
this._addClass(views, 'views');
|
290
|
+
this._addId(previous, 'previous');
|
291
|
+
previous.classList.add('mddtp-picker__view');
|
292
|
+
this._addId(current, 'current');
|
293
|
+
current.classList.add('mddtp-picker__view');
|
294
|
+
this._addId(next, 'next');
|
295
|
+
next.classList.add('mddtp-picker__view');
|
296
|
+
// fill the views
|
297
|
+
this._addView(previous);
|
298
|
+
this._addView(current);
|
299
|
+
this._addView(next);
|
300
|
+
// add them
|
301
|
+
viewHolder.appendChild(views);
|
302
|
+
views.appendChild(previous);
|
303
|
+
views.appendChild(current);
|
304
|
+
views.appendChild(next);
|
305
|
+
// inside body again
|
306
|
+
this._addId(left, 'left');
|
307
|
+
left.classList.add('mddtp-button');
|
308
|
+
this._addClass(left, 'left');
|
309
|
+
left.setAttribute('type', 'button');
|
310
|
+
this._addId(right, 'right');
|
311
|
+
right.classList.add('mddtp-button');
|
312
|
+
this._addClass(right, 'right');
|
313
|
+
right.setAttribute('type', 'button');
|
314
|
+
this._addId(years, 'years');
|
315
|
+
this._addClass(years, 'years', ['mddtp-picker__years--invisible', 'animated']);
|
316
|
+
// add them to body
|
317
|
+
body.appendChild(viewHolder);
|
318
|
+
body.appendChild(left);
|
319
|
+
body.appendChild(right);
|
320
|
+
body.appendChild(years);
|
321
|
+
} else {
|
322
|
+
var _title = document.createElement('div'),
|
323
|
+
hour = document.createElement('span'),
|
324
|
+
span = document.createElement('span'),
|
325
|
+
minute = document.createElement('span'),
|
326
|
+
_subtitle = document.createElement('div'),
|
327
|
+
AM = document.createElement('div'),
|
328
|
+
PM = document.createElement('div'),
|
329
|
+
circularHolder = document.createElement('div'),
|
330
|
+
needle = document.createElement('div'),
|
331
|
+
dot = document.createElement('span'),
|
332
|
+
line = document.createElement('span'),
|
333
|
+
circle = document.createElement('span'),
|
334
|
+
minuteView = document.createElement('div'),
|
335
|
+
fakeNeedle = document.createElement('div'),
|
336
|
+
hourView = document.createElement('div');
|
337
|
+
|
338
|
+
// add properties to them
|
339
|
+
// inside header
|
340
|
+
this._addId(_title, 'title');
|
341
|
+
this._addClass(_title, 'title');
|
342
|
+
this._addId(hour, 'hour');
|
343
|
+
hour.classList.add('mddtp-picker__color--active');
|
344
|
+
span.textContent = ':';
|
345
|
+
this._addId(span, 'dotSpan');
|
346
|
+
span.setAttribute('style', 'display: none');
|
347
|
+
this._addId(minute, 'minute');
|
348
|
+
this._addId(_subtitle, 'subtitle');
|
349
|
+
this._addClass(_subtitle, 'subtitle');
|
350
|
+
_subtitle.setAttribute('style', 'display: none');
|
351
|
+
this._addId(AM, 'AM');
|
352
|
+
AM.textContent = 'AM';
|
353
|
+
this._addId(PM, 'PM');
|
354
|
+
PM.textContent = 'PM';
|
355
|
+
// add them to title and subtitle
|
356
|
+
_title.appendChild(hour);
|
357
|
+
_title.appendChild(span);
|
358
|
+
_title.appendChild(minute);
|
359
|
+
_subtitle.appendChild(AM);
|
360
|
+
_subtitle.appendChild(PM);
|
361
|
+
// add them to header
|
362
|
+
header.appendChild(_title);
|
363
|
+
header.appendChild(_subtitle);
|
364
|
+
// inside body
|
365
|
+
this._addId(circularHolder, 'circularHolder');
|
366
|
+
this._addClass(circularHolder, 'circularHolder');
|
367
|
+
this._addId(needle, 'needle');
|
368
|
+
needle.classList.add('mddtp-picker__selection');
|
369
|
+
this._addClass(dot, 'dot');
|
370
|
+
this._addClass(line, 'line');
|
371
|
+
this._addId(circle, 'circle');
|
372
|
+
this._addClass(circle, 'circle');
|
373
|
+
this._addId(minuteView, 'minuteView');
|
374
|
+
minuteView.classList.add('mddtp-picker__circularView');
|
375
|
+
minuteView.classList.add('mddtp-picker__circularView--hidden');
|
376
|
+
this._addId(fakeNeedle, 'fakeNeedle');
|
377
|
+
fakeNeedle.classList.add('mddtp-picker__circle--fake');
|
378
|
+
this._addId(hourView, 'hourView');
|
379
|
+
hourView.classList.add('mddtp-picker__circularView');
|
380
|
+
// add them to needle
|
381
|
+
needle.appendChild(dot);
|
382
|
+
needle.appendChild(line);
|
383
|
+
needle.appendChild(circle);
|
384
|
+
// add them to circularHolder
|
385
|
+
circularHolder.appendChild(needle);
|
386
|
+
circularHolder.appendChild(minuteView);
|
387
|
+
circularHolder.appendChild(fakeNeedle);
|
388
|
+
circularHolder.appendChild(hourView);
|
389
|
+
// add them to body
|
390
|
+
body.appendChild(circularHolder);
|
391
|
+
}
|
392
|
+
action.classList.add('mddtp-picker__action');
|
393
|
+
this._addId(cancel, 'cancel');
|
394
|
+
cancel.classList.add('mddtp-button');
|
395
|
+
cancel.setAttribute('type', 'button');
|
396
|
+
cancel.textContent = 'cancel';
|
397
|
+
this._addId(ok, 'ok');
|
398
|
+
ok.classList.add('mddtp-button');
|
399
|
+
ok.setAttribute('type', 'button');
|
400
|
+
ok.textContent = 'ok';
|
401
|
+
// add actions
|
402
|
+
action.appendChild(cancel);
|
403
|
+
action.appendChild(ok);
|
404
|
+
// add actions to body
|
405
|
+
body.appendChild(action);
|
406
|
+
docfrag.appendChild(container);
|
407
|
+
// add the container to the end of body
|
408
|
+
document.getElementsByTagName('body').item(0).appendChild(docfrag);
|
409
|
+
}
|
410
|
+
}, {
|
411
|
+
key: '_initTimeDialog',
|
412
|
+
value: function _initTimeDialog(m) {
|
413
|
+
var hour = this._sDialog.hour,
|
414
|
+
minute = this._sDialog.minute,
|
415
|
+
subtitle = this._sDialog.subtitle,
|
416
|
+
dotSpan = this._sDialog.dotSpan;
|
417
|
+
|
418
|
+
// switch according to 12 hour or 24 hour mode
|
419
|
+
if (this._mode) {
|
420
|
+
this._fillText(hour, m.format('H'));
|
421
|
+
} else {
|
422
|
+
this._fillText(hour, m.format('h'));
|
423
|
+
this._sDialog[m.format('A')].classList.add('mddtp-picker__color--active');
|
424
|
+
subtitle.removeAttribute('style');
|
425
|
+
dotSpan.removeAttribute('style');
|
426
|
+
}
|
427
|
+
this._fillText(minute, m.format('mm'));
|
428
|
+
this._initHour();
|
429
|
+
this._initMinute();
|
430
|
+
this._attachEventHandlers();
|
431
|
+
this._changeM();
|
432
|
+
this._dragDial();
|
433
|
+
this._switchToView(hour);
|
434
|
+
this._switchToView(minute);
|
435
|
+
this._addClockEvent();
|
436
|
+
}
|
437
|
+
}, {
|
438
|
+
key: '_initHour',
|
439
|
+
value: function _initHour() {
|
440
|
+
var hourView = this._sDialog.hourView,
|
441
|
+
needle = this._sDialog.needle,
|
442
|
+
hour = 'mddtp-hour__selected',
|
443
|
+
selected = 'mddtp-picker__cell--selected',
|
444
|
+
rotate = 'mddtp-picker__cell--rotate-',
|
445
|
+
cell = 'mddtp-picker__cell',
|
446
|
+
docfrag = document.createDocumentFragment(),
|
447
|
+
hourNow = void 0;
|
448
|
+
|
449
|
+
if (this._mode) {
|
450
|
+
hourNow = parseInt(this._sDialog.tDate.format('H'), 10);
|
451
|
+
for (var i = 1, j = 5; i <= 24; i++, j += 5) {
|
452
|
+
var div = document.createElement('div'),
|
453
|
+
span = document.createElement('span');
|
454
|
+
|
455
|
+
div.classList.add(cell);
|
456
|
+
span.textContent = i;
|
457
|
+
div.classList.add(rotate + j);
|
458
|
+
if (hourNow === i) {
|
459
|
+
div.id = hour;
|
460
|
+
div.classList.add(selected);
|
461
|
+
needle.classList.add(rotate + j);
|
462
|
+
}
|
463
|
+
div.appendChild(span);
|
464
|
+
docfrag.appendChild(div);
|
465
|
+
}
|
466
|
+
} else {
|
467
|
+
hourNow = parseInt(this._sDialog.tDate.format('h'), 10);
|
468
|
+
for (var _i = 1, _j = 10; _i <= 12; _i++, _j += 10) {
|
469
|
+
var _div = document.createElement('div'),
|
470
|
+
_span = document.createElement('span');
|
471
|
+
|
472
|
+
_div.classList.add(cell);
|
473
|
+
_span.textContent = _i;
|
474
|
+
_div.classList.add(rotate + _j);
|
475
|
+
if (hourNow === _i) {
|
476
|
+
_div.id = hour;
|
477
|
+
_div.classList.add(selected);
|
478
|
+
needle.classList.add(rotate + _j);
|
479
|
+
}
|
480
|
+
_div.appendChild(_span);
|
481
|
+
docfrag.appendChild(_div);
|
482
|
+
}
|
483
|
+
}
|
484
|
+
//empty the hours
|
485
|
+
while (hourView.lastChild) {
|
486
|
+
hourView.removeChild(hourView.lastChild);
|
487
|
+
}
|
488
|
+
// set inner html accordingly
|
489
|
+
hourView.appendChild(docfrag);
|
490
|
+
}
|
491
|
+
}, {
|
492
|
+
key: '_initMinute',
|
493
|
+
value: function _initMinute() {
|
494
|
+
var minuteView = this._sDialog.minuteView,
|
495
|
+
minuteNow = parseInt(this._sDialog.tDate.format('m'), 10),
|
496
|
+
sMinute = 'mddtp-minute__selected',
|
497
|
+
selected = 'mddtp-picker__cell--selected',
|
498
|
+
rotate = 'mddtp-picker__cell--rotate-',
|
499
|
+
cell = 'mddtp-picker__cell',
|
500
|
+
docfrag = document.createDocumentFragment();
|
501
|
+
|
502
|
+
for (var i = 5, j = 10; i <= 60; i += 5, j += 10) {
|
503
|
+
var div = document.createElement('div'),
|
504
|
+
span = document.createElement('span');
|
505
|
+
|
506
|
+
div.classList.add(cell);
|
507
|
+
if (i === 60) {
|
508
|
+
span.textContent = this._numWithZero(0);
|
509
|
+
} else {
|
510
|
+
span.textContent = this._numWithZero(i);
|
511
|
+
}
|
512
|
+
if (minuteNow === 0) {
|
513
|
+
minuteNow = 60;
|
514
|
+
}
|
515
|
+
div.classList.add(rotate + j);
|
516
|
+
// (minuteNow === 1 && i === 60) for corner case highlight 00 at 01
|
517
|
+
if (minuteNow === i || minuteNow - 1 === i || minuteNow + 1 === i || minuteNow === 1 && i === 60) {
|
518
|
+
div.id = sMinute;
|
519
|
+
div.classList.add(selected);
|
520
|
+
}
|
521
|
+
div.appendChild(span);
|
522
|
+
docfrag.appendChild(div);
|
523
|
+
}
|
524
|
+
//empty the hours
|
525
|
+
while (minuteView.lastChild) {
|
526
|
+
minuteView.removeChild(minuteView.lastChild);
|
527
|
+
}
|
528
|
+
// set inner html accordingly
|
529
|
+
minuteView.appendChild(docfrag);
|
530
|
+
}
|
531
|
+
}, {
|
532
|
+
key: '_initDateDialog',
|
533
|
+
value: function _initDateDialog(m) {
|
534
|
+
var subtitle = this._sDialog.subtitle,
|
535
|
+
title = this._sDialog.title,
|
536
|
+
titleDay = this._sDialog.titleDay,
|
537
|
+
titleMonth = this._sDialog.titleMonth;
|
538
|
+
|
539
|
+
this._fillText(subtitle, m.format('YYYY'));
|
540
|
+
this._fillText(titleDay, m.format('ddd, '));
|
541
|
+
this._fillText(titleMonth, m.format('MMM D'));
|
542
|
+
this._initYear();
|
543
|
+
this._initViewHolder();
|
544
|
+
this._attachEventHandlers();
|
545
|
+
this._changeMonth();
|
546
|
+
this._switchToView(subtitle);
|
547
|
+
this._switchToView(title);
|
548
|
+
}
|
549
|
+
}, {
|
550
|
+
key: '_initViewHolder',
|
551
|
+
value: function _initViewHolder() {
|
552
|
+
var m = this._sDialog.tDate,
|
553
|
+
picker = this._sDialog.picker,
|
554
|
+
current = this._sDialog.current,
|
555
|
+
previous = this._sDialog.previous,
|
556
|
+
next = this._sDialog.next,
|
557
|
+
past = this._past,
|
558
|
+
future = this._future;
|
559
|
+
|
560
|
+
if (m.isBefore(past, 'month')) {
|
561
|
+
m = past.clone();
|
562
|
+
}
|
563
|
+
if (m.isAfter(future, 'month')) {
|
564
|
+
m = future.clone();
|
565
|
+
}
|
566
|
+
this._sDialog.tDate = m;
|
567
|
+
this._initMonth(current, m);
|
568
|
+
this._initMonth(next, moment(this._getMonth(m, 1)));
|
569
|
+
this._initMonth(previous, moment(this._getMonth(m, -1)));
|
570
|
+
this._toMoveMonth();
|
571
|
+
}
|
572
|
+
}, {
|
573
|
+
key: '_initMonth',
|
574
|
+
value: function _initMonth(view, m) {
|
575
|
+
var displayMonth = m.format('MMMM YYYY'),
|
576
|
+
innerDivs = view.getElementsByTagName('div');
|
577
|
+
// get the .mddtp-picker__month element using innerDivs[0]
|
578
|
+
|
579
|
+
this._fillText(innerDivs[0], displayMonth);
|
580
|
+
var docfrag = document.createDocumentFragment(),
|
581
|
+
tr = innerDivs[3],
|
582
|
+
firstDayOfMonth = parseInt(moment(m).date(1).day(), 10),
|
583
|
+
today = -1,
|
584
|
+
selected = -1,
|
585
|
+
lastDayOfMonth = parseInt(moment(m).endOf('month').format('D'), 10) + firstDayOfMonth - 1,
|
586
|
+
past = firstDayOfMonth,
|
587
|
+
cellClass = 'mddtp-picker__cell',
|
588
|
+
future = lastDayOfMonth;
|
589
|
+
// get the .mddtp-picker__tr element using innerDivs[3]
|
590
|
+
|
591
|
+
if (moment().isSame(m, 'month')) {
|
592
|
+
today = parseInt(moment().format('D'), 10);
|
593
|
+
today += firstDayOfMonth - 1;
|
594
|
+
}
|
595
|
+
if (this._past.isSame(m, 'month')) {
|
596
|
+
past = parseInt(this._past.format('D'), 10);
|
597
|
+
past += firstDayOfMonth - 1;
|
598
|
+
}
|
599
|
+
if (this._future.isSame(m, 'month')) {
|
600
|
+
future = parseInt(this._future.format('D'), 10);
|
601
|
+
future += firstDayOfMonth - 1;
|
602
|
+
}
|
603
|
+
if (this._sDialog.sDate.isSame(m, 'month')) {
|
604
|
+
selected = parseInt(moment(m).format('D'), 10);
|
605
|
+
selected += firstDayOfMonth - 1;
|
606
|
+
}
|
607
|
+
for (var i = 0; i < 42; i++) {
|
608
|
+
// create cell
|
609
|
+
var cell = document.createElement('span'),
|
610
|
+
currentDay = i - firstDayOfMonth + 1;
|
611
|
+
|
612
|
+
if (i >= firstDayOfMonth && i <= lastDayOfMonth) {
|
613
|
+
if (i > future || i < past) {
|
614
|
+
cell.classList.add(cellClass + '--disabled');
|
615
|
+
} else {
|
616
|
+
cell.classList.add(cellClass);
|
617
|
+
}
|
618
|
+
this._fillText(cell, currentDay);
|
619
|
+
}
|
620
|
+
if (today === i) {
|
621
|
+
cell.classList.add(cellClass + '--today');
|
622
|
+
}
|
623
|
+
if (selected === i) {
|
624
|
+
cell.classList.add(cellClass + '--selected');
|
625
|
+
cell.id = 'mddtp-date__selected';
|
626
|
+
}
|
627
|
+
docfrag.appendChild(cell);
|
628
|
+
}
|
629
|
+
//empty the tr
|
630
|
+
while (tr.lastChild) {
|
631
|
+
tr.removeChild(tr.lastChild);
|
632
|
+
}
|
633
|
+
// set inner html accordingly
|
634
|
+
tr.appendChild(docfrag);
|
635
|
+
this._addCellClickEvent(tr);
|
636
|
+
}
|
637
|
+
}, {
|
638
|
+
key: '_initYear',
|
639
|
+
value: function _initYear() {
|
640
|
+
var years = this._sDialog.years,
|
641
|
+
currentYear = this._sDialog.tDate.year(),
|
642
|
+
docfrag = document.createDocumentFragment(),
|
643
|
+
past = this._past.year(),
|
644
|
+
future = this._future.year();
|
645
|
+
|
646
|
+
for (var year = past; year <= future; year++) {
|
647
|
+
var li = document.createElement('li');
|
648
|
+
li.textContent = year;
|
649
|
+
if (year === currentYear) {
|
650
|
+
li.id = 'mddtp-date__currentYear';
|
651
|
+
li.classList.add('mddtp-picker__li--current');
|
652
|
+
}
|
653
|
+
docfrag.appendChild(li);
|
654
|
+
}
|
655
|
+
//empty the years ul
|
656
|
+
while (years.lastChild) {
|
657
|
+
years.removeChild(years.lastChild);
|
658
|
+
}
|
659
|
+
// set inner html accordingly
|
660
|
+
years.appendChild(docfrag);
|
661
|
+
// attach event handler to the ul to get the benefit of event delegation
|
662
|
+
this._changeYear(years);
|
663
|
+
}
|
664
|
+
}, {
|
665
|
+
key: '_switchToView',
|
666
|
+
value: function _switchToView(el) {
|
667
|
+
var me = this;
|
668
|
+
// attach the view change button
|
669
|
+
if (this._type == 'date') {
|
670
|
+
el.onclick = function () {
|
671
|
+
me._switchToDateView(el, me);
|
672
|
+
};
|
673
|
+
} else {
|
674
|
+
el.onclick = function () {
|
675
|
+
me._switchToTimeView(me);
|
676
|
+
};
|
677
|
+
}
|
678
|
+
}
|
679
|
+
}, {
|
680
|
+
key: '_switchToTimeView',
|
681
|
+
value: function _switchToTimeView(me) {
|
682
|
+
var hourView = me._sDialog.hourView,
|
683
|
+
minuteView = me._sDialog.minuteView,
|
684
|
+
hour = me._sDialog.hour,
|
685
|
+
minute = me._sDialog.minute,
|
686
|
+
activeClass = 'mddtp-picker__color--active',
|
687
|
+
hidden = 'mddtp-picker__circularView--hidden',
|
688
|
+
selection = 'mddtp-picker__selection',
|
689
|
+
needle = me._sDialog.needle,
|
690
|
+
circularHolder = me._sDialog.circularHolder,
|
691
|
+
circle = me._sDialog.circle,
|
692
|
+
fakeNeedle = me._sDialog.fakeNeedle,
|
693
|
+
spoke = 60,
|
694
|
+
value = void 0;
|
695
|
+
|
696
|
+
// toggle view classes
|
697
|
+
hourView.classList.toggle(hidden);
|
698
|
+
minuteView.classList.toggle(hidden);
|
699
|
+
hour.classList.toggle(activeClass);
|
700
|
+
minute.classList.toggle(activeClass);
|
701
|
+
// move the needle to correct position
|
702
|
+
needle.className = '';
|
703
|
+
needle.classList.add(selection);
|
704
|
+
if (mdDateTimePicker.dialog.view) {
|
705
|
+
value = me._sDialog.sDate.format('m');
|
706
|
+
// move the fakeNeedle to correct position
|
707
|
+
setTimeout(function () {
|
708
|
+
var hOffset = circularHolder.getBoundingClientRect(),
|
709
|
+
cOffset = circle.getBoundingClientRect();
|
710
|
+
|
711
|
+
fakeNeedle.setAttribute('style', 'left:' + (cOffset.left - hOffset.left) + 'px;top:' + (cOffset.top - hOffset.top) + 'px');
|
712
|
+
}, 300);
|
713
|
+
} else {
|
714
|
+
if (me._mode) {
|
715
|
+
spoke = 24;
|
716
|
+
value = me._sDialog.sDate.format('H');
|
717
|
+
} else {
|
718
|
+
spoke = 12;
|
719
|
+
value = me._sDialog.sDate.format('h');
|
720
|
+
}
|
721
|
+
}
|
722
|
+
var rotationClass = me._calcRotation(spoke, parseInt(value, 10));
|
723
|
+
if (rotationClass) {
|
724
|
+
needle.classList.add(rotationClass);
|
725
|
+
}
|
726
|
+
// toggle the view type
|
727
|
+
mdDateTimePicker.dialog.view = !mdDateTimePicker.dialog.view;
|
728
|
+
}
|
729
|
+
}, {
|
730
|
+
key: '_switchToDateView',
|
731
|
+
value: function _switchToDateView(el, me) {
|
732
|
+
el.setAttribute('disabled', '');
|
733
|
+
var viewHolder = me._sDialog.viewHolder,
|
734
|
+
years = me._sDialog.years,
|
735
|
+
title = me._sDialog.title,
|
736
|
+
subtitle = me._sDialog.subtitle,
|
737
|
+
currentYear = document.getElementById('mddtp-date__currentYear');
|
738
|
+
|
739
|
+
if (mdDateTimePicker.dialog.view) {
|
740
|
+
viewHolder.classList.add('zoomOut');
|
741
|
+
years.classList.remove('mddtp-picker__years--invisible');
|
742
|
+
years.classList.add('zoomIn');
|
743
|
+
// scroll into the view
|
744
|
+
currentYear.scrollIntoViewIfNeeded();
|
745
|
+
} else {
|
746
|
+
years.classList.add('zoomOut');
|
747
|
+
viewHolder.classList.remove('zoomOut');
|
748
|
+
viewHolder.classList.add('zoomIn');
|
749
|
+
setTimeout(function () {
|
750
|
+
years.classList.remove('zoomIn', 'zoomOut');
|
751
|
+
years.classList.add('mddtp-picker__years--invisible');
|
752
|
+
viewHolder.classList.remove('zoomIn');
|
753
|
+
}, 300);
|
754
|
+
}
|
755
|
+
title.classList.toggle('mddtp-picker__color--active');
|
756
|
+
subtitle.classList.toggle('mddtp-picker__color--active');
|
757
|
+
mdDateTimePicker.dialog.view = !mdDateTimePicker.dialog.view;
|
758
|
+
setTimeout(function () {
|
759
|
+
el.removeAttribute('disabled');
|
760
|
+
}, 300);
|
761
|
+
}
|
762
|
+
}, {
|
763
|
+
key: '_addClockEvent',
|
764
|
+
value: function _addClockEvent() {
|
765
|
+
var me = this,
|
766
|
+
hourView = this._sDialog.hourView,
|
767
|
+
minuteView = this._sDialog.minuteView,
|
768
|
+
sClass = 'mddtp-picker__cell--selected';
|
769
|
+
|
770
|
+
hourView.onclick = function (e) {
|
771
|
+
var sHour = 'mddtp-hour__selected',
|
772
|
+
selectedHour = document.getElementById(sHour),
|
773
|
+
setHour = 0;
|
774
|
+
|
775
|
+
if (e.target && e.target.nodeName == 'SPAN') {
|
776
|
+
// clear the previously selected hour
|
777
|
+
selectedHour.id = '';
|
778
|
+
selectedHour.classList.remove(sClass);
|
779
|
+
// select the new hour
|
780
|
+
e.target.parentNode.classList.add(sClass);
|
781
|
+
e.target.parentNode.id = sHour;
|
782
|
+
// set the sDate according to 24 or 12 hour mode
|
783
|
+
if (me._mode) {
|
784
|
+
setHour = e.target.textContent;
|
785
|
+
} else {
|
786
|
+
if (me._sDialog.sDate.format('A') === 'AM') {
|
787
|
+
setHour = e.target.textContent;
|
788
|
+
} else {
|
789
|
+
setHour = parseInt(e.target.textContent, 10) + 12;
|
790
|
+
}
|
791
|
+
}
|
792
|
+
me._sDialog.sDate.hour(setHour);
|
793
|
+
// set the display hour
|
794
|
+
me._sDialog.hour.textContent = e.target.textContent;
|
795
|
+
// switch the view
|
796
|
+
me._switchToTimeView(me);
|
797
|
+
}
|
798
|
+
};
|
799
|
+
minuteView.onclick = function (e) {
|
800
|
+
var sMinute = 'mddtp-minute__selected',
|
801
|
+
selectedMinute = document.getElementById(sMinute),
|
802
|
+
setMinute = 0;
|
803
|
+
|
804
|
+
if (e.target && e.target.nodeName == 'SPAN') {
|
805
|
+
// clear the previously selected hour
|
806
|
+
if (selectedMinute) {
|
807
|
+
selectedMinute.id = '';
|
808
|
+
selectedMinute.classList.remove(sClass);
|
809
|
+
}
|
810
|
+
// select the new hour
|
811
|
+
e.target.parentNode.classList.add(sClass);
|
812
|
+
e.target.parentNode.id = sMinute;
|
813
|
+
// set the sDate minute
|
814
|
+
setMinute = e.target.textContent;
|
815
|
+
me._sDialog.sDate.minute(setMinute);
|
816
|
+
// set the display minute
|
817
|
+
me._sDialog.minute.textContent = setMinute;
|
818
|
+
// switch the view
|
819
|
+
me._switchToTimeView(me);
|
820
|
+
}
|
821
|
+
};
|
822
|
+
}
|
823
|
+
}, {
|
824
|
+
key: '_addCellClickEvent',
|
825
|
+
value: function _addCellClickEvent(el) {
|
826
|
+
var me = this;
|
827
|
+
el.onclick = function (e) {
|
828
|
+
if (e.target && e.target.nodeName == 'SPAN' && e.target.classList.contains('mddtp-picker__cell')) {
|
829
|
+
var picker = me._sDialog.picker,
|
830
|
+
day = e.target.textContent,
|
831
|
+
currentDate = me._sDialog.tDate.date(day),
|
832
|
+
sId = 'mddtp-date__selected',
|
833
|
+
sClass = 'mddtp-picker__cell--selected',
|
834
|
+
selected = document.getElementById(sId),
|
835
|
+
subtitle = me._sDialog.subtitle,
|
836
|
+
titleDay = me._sDialog.titleDay,
|
837
|
+
titleMonth = me._sDialog.titleMonth;
|
838
|
+
|
839
|
+
if (selected) {
|
840
|
+
selected.classList.remove(sClass);
|
841
|
+
selected.id = '';
|
842
|
+
}
|
843
|
+
e.target.classList.add(sClass);
|
844
|
+
e.target.id = sId;
|
845
|
+
|
846
|
+
// update temp date object with the date selected
|
847
|
+
me._sDialog.sDate = currentDate.clone();
|
848
|
+
|
849
|
+
me._fillText(subtitle, currentDate.year());
|
850
|
+
me._fillText(titleDay, currentDate.format('ddd, '));
|
851
|
+
me._fillText(titleMonth, currentDate.format('MMM D'));
|
852
|
+
}
|
853
|
+
};
|
854
|
+
}
|
855
|
+
}, {
|
856
|
+
key: '_toMoveMonth',
|
857
|
+
value: function _toMoveMonth() {
|
858
|
+
var m = this._sDialog.tDate,
|
859
|
+
left = this._sDialog.left,
|
860
|
+
right = this._sDialog.right,
|
861
|
+
past = this._past,
|
862
|
+
future = this._future;
|
863
|
+
|
864
|
+
left.removeAttribute('disabled');
|
865
|
+
right.removeAttribute('disabled');
|
866
|
+
left.classList.remove('mddtp-button--disabled');
|
867
|
+
right.classList.remove('mddtp-button--disabled');
|
868
|
+
if (m.isSame(past, 'month')) {
|
869
|
+
left.setAttribute('disabled', '');
|
870
|
+
left.classList.add('mddtp-button--disabled');
|
871
|
+
}
|
872
|
+
if (m.isSame(future, 'month')) {
|
873
|
+
right.setAttribute('disabled', '');
|
874
|
+
right.classList.add('mddtp-button--disabled');
|
875
|
+
}
|
876
|
+
}
|
877
|
+
}, {
|
878
|
+
key: '_changeMonth',
|
879
|
+
value: function _changeMonth() {
|
880
|
+
var me = this,
|
881
|
+
left = this._sDialog.left,
|
882
|
+
right = this._sDialog.right,
|
883
|
+
mLeftClass = 'mddtp-picker__view--left',
|
884
|
+
mRightClass = 'mddtp-picker__view--right',
|
885
|
+
pause = 'mddtp-picker__view--pause';
|
886
|
+
|
887
|
+
left.onclick = function () {
|
888
|
+
moveStep(mRightClass, me._sDialog.previous);
|
889
|
+
};
|
890
|
+
|
891
|
+
right.onclick = function () {
|
892
|
+
moveStep(mLeftClass, me._sDialog.next);
|
893
|
+
};
|
894
|
+
|
895
|
+
function moveStep(aClass, to) {
|
896
|
+
/**
|
897
|
+
* [stepBack to know if the to step is going back or not]
|
898
|
+
*
|
899
|
+
* @type {Boolean}
|
900
|
+
*/
|
901
|
+
var stepBack = !1,
|
902
|
+
next = me._sDialog.next,
|
903
|
+
current = me._sDialog.current,
|
904
|
+
previous = me._sDialog.previous;
|
905
|
+
|
906
|
+
left.setAttribute('disabled', '');
|
907
|
+
right.setAttribute('disabled', '');
|
908
|
+
current.classList.add(aClass);
|
909
|
+
previous.classList.add(aClass);
|
910
|
+
next.classList.add(aClass);
|
911
|
+
var clone = to.cloneNode(!0),
|
912
|
+
del = void 0;
|
913
|
+
|
914
|
+
if (to === next) {
|
915
|
+
del = previous;
|
916
|
+
current.parentNode.appendChild(clone);
|
917
|
+
next.id = current.id;
|
918
|
+
current.id = previous.id;
|
919
|
+
previous = current;
|
920
|
+
current = next;
|
921
|
+
next = clone;
|
922
|
+
} else {
|
923
|
+
stepBack = !0;
|
924
|
+
del = next;
|
925
|
+
previous.id = current.id;
|
926
|
+
current.id = next.id;
|
927
|
+
next = current;
|
928
|
+
current = previous;
|
929
|
+
}
|
930
|
+
setTimeout(function () {
|
931
|
+
if (to === previous) {
|
932
|
+
current.parentNode.insertBefore(clone, current);
|
933
|
+
previous = clone;
|
934
|
+
}
|
935
|
+
// update real values to match these values
|
936
|
+
me._sDialog.next = next;
|
937
|
+
me._sDialog.current = current;
|
938
|
+
me._sDialog.previous = previous;
|
939
|
+
current.classList.add(pause);
|
940
|
+
next.classList.add(pause);
|
941
|
+
previous.classList.add(pause);
|
942
|
+
current.classList.remove(aClass);
|
943
|
+
next.classList.remove(aClass);
|
944
|
+
previous.classList.remove(aClass);
|
945
|
+
del.parentNode.removeChild(del);
|
946
|
+
}, 300);
|
947
|
+
// REVIEW replace below code with requestAnimationFrame
|
948
|
+
setTimeout(function () {
|
949
|
+
current.classList.remove(pause);
|
950
|
+
next.classList.remove(pause);
|
951
|
+
previous.classList.remove(pause);
|
952
|
+
if (stepBack) {
|
953
|
+
me._sDialog.tDate = me._getMonth(me._sDialog.tDate, -1);
|
954
|
+
} else {
|
955
|
+
me._sDialog.tDate = me._getMonth(me._sDialog.tDate, 1);
|
956
|
+
}
|
957
|
+
me._initViewHolder();
|
958
|
+
}, 350);
|
959
|
+
setTimeout(function () {
|
960
|
+
if (!left.classList.contains('mddtp-button--disabled')) {
|
961
|
+
left.removeAttribute('disabled');
|
962
|
+
}
|
963
|
+
if (!right.classList.contains('mddtp-button--disabled')) {
|
964
|
+
right.removeAttribute('disabled');
|
965
|
+
}
|
966
|
+
}, 400);
|
967
|
+
}
|
968
|
+
}
|
969
|
+
}, {
|
970
|
+
key: '_changeYear',
|
971
|
+
value: function _changeYear(el) {
|
972
|
+
var me = this;
|
973
|
+
el.onclick = function (e) {
|
974
|
+
if (e.target && e.target.nodeName == 'LI') {
|
975
|
+
var selected = document.getElementById('mddtp-date__currentYear');
|
976
|
+
// clear previous selected
|
977
|
+
selected.id = '';
|
978
|
+
selected.classList.remove('mddtp-picker__li--current');
|
979
|
+
// add the properties to the newer one
|
980
|
+
e.target.id = 'mddtp-date__currentYear';
|
981
|
+
e.target.classList.add('mddtp-picker__li--current');
|
982
|
+
// switch view
|
983
|
+
me._switchToDateView(el, me);
|
984
|
+
// set the tdate to it
|
985
|
+
me._sDialog.tDate.year(parseInt(e.target.textContent, 10));
|
986
|
+
// update the dialog
|
987
|
+
me._initViewHolder();
|
988
|
+
}
|
989
|
+
};
|
990
|
+
}
|
991
|
+
}, {
|
992
|
+
key: '_changeM',
|
993
|
+
value: function _changeM() {
|
994
|
+
var me = this,
|
995
|
+
AM = this._sDialog.AM,
|
996
|
+
PM = this._sDialog.PM;
|
997
|
+
|
998
|
+
AM.onclick = function (e) {
|
999
|
+
var m = me._sDialog.sDate.format('A');
|
1000
|
+
if (m === 'PM') {
|
1001
|
+
me._sDialog.sDate.subtract(12, 'h');
|
1002
|
+
AM.classList.toggle('mddtp-picker__color--active');
|
1003
|
+
PM.classList.toggle('mddtp-picker__color--active');
|
1004
|
+
}
|
1005
|
+
};
|
1006
|
+
PM.onclick = function (e) {
|
1007
|
+
var m = me._sDialog.sDate.format('A');
|
1008
|
+
if (m === 'AM') {
|
1009
|
+
me._sDialog.sDate.add(12, 'h');
|
1010
|
+
AM.classList.toggle('mddtp-picker__color--active');
|
1011
|
+
PM.classList.toggle('mddtp-picker__color--active');
|
1012
|
+
}
|
1013
|
+
};
|
1014
|
+
}
|
1015
|
+
}, {
|
1016
|
+
key: '_dragDial',
|
1017
|
+
value: function _dragDial() {
|
1018
|
+
var me = this,
|
1019
|
+
needle = this._sDialog.needle,
|
1020
|
+
circle = this._sDialog.circle,
|
1021
|
+
fakeNeedle = this._sDialog.fakeNeedle,
|
1022
|
+
circularHolder = this._sDialog.circularHolder,
|
1023
|
+
minute = this._sDialog.minute,
|
1024
|
+
quick = 'mddtp-picker__selection--quick',
|
1025
|
+
selection = 'mddtp-picker__selection',
|
1026
|
+
selected = 'mddtp-picker__cell--selected',
|
1027
|
+
rotate = 'mddtp-picker__cell--rotate-',
|
1028
|
+
hOffset = circularHolder.getBoundingClientRect(),
|
1029
|
+
divides = void 0,
|
1030
|
+
fakeNeedleDraggabilly = new Draggabilly(fakeNeedle, {
|
1031
|
+
containment: !0
|
1032
|
+
});
|
1033
|
+
|
1034
|
+
fakeNeedleDraggabilly.on('pointerDown', function () {
|
1035
|
+
hOffset = circularHolder.getBoundingClientRect();
|
1036
|
+
});
|
1037
|
+
fakeNeedleDraggabilly.on('dragMove', function (e) {
|
1038
|
+
var xPos = e.clientX - hOffset.left - hOffset.width / 2,
|
1039
|
+
yPos = e.clientY - hOffset.top - hOffset.height / 2,
|
1040
|
+
slope = Math.atan2(-yPos, xPos);
|
1041
|
+
|
1042
|
+
needle.className = '';
|
1043
|
+
if (slope < 0) {
|
1044
|
+
slope += 2 * Math.PI;
|
1045
|
+
}
|
1046
|
+
slope *= 180 / Math.PI;
|
1047
|
+
slope = 360 - slope;
|
1048
|
+
if (slope > 270) {
|
1049
|
+
slope -= 360;
|
1050
|
+
}
|
1051
|
+
divides = parseInt(slope / 6);
|
1052
|
+
var same = Math.abs(6 * divides - slope),
|
1053
|
+
upper = Math.abs(6 * (divides + 1) - slope);
|
1054
|
+
|
1055
|
+
if (upper < same) {
|
1056
|
+
divides++;
|
1057
|
+
}
|
1058
|
+
divides += 15;
|
1059
|
+
needle.classList.add(selection);
|
1060
|
+
needle.classList.add(quick);
|
1061
|
+
needle.classList.add(rotate + divides * 2);
|
1062
|
+
});
|
1063
|
+
fakeNeedleDraggabilly.on('dragEnd', function () {
|
1064
|
+
var minuteViewChildren = me._sDialog.minuteView.getElementsByTagName('div'),
|
1065
|
+
sMinute = 'mddtp-minute__selected',
|
1066
|
+
selectedMinute = document.getElementById(sMinute),
|
1067
|
+
cOffset = circle.getBoundingClientRect();
|
1068
|
+
|
1069
|
+
fakeNeedle.setAttribute('style', 'left:' + (cOffset.left - hOffset.left) + 'px;top:' + (cOffset.top - hOffset.top) + 'px');
|
1070
|
+
needle.classList.remove(quick);
|
1071
|
+
var select = divides;
|
1072
|
+
if (select === 1) {
|
1073
|
+
select = 60;
|
1074
|
+
}
|
1075
|
+
select = me._nearestDivisor(select, 5);
|
1076
|
+
// normalize 60 => 0
|
1077
|
+
if (divides === 60) {
|
1078
|
+
divides = 0;
|
1079
|
+
}
|
1080
|
+
// remove previously selected value
|
1081
|
+
if (selectedMinute) {
|
1082
|
+
selectedMinute.id = '';
|
1083
|
+
selectedMinute.classList.remove(selected);
|
1084
|
+
}
|
1085
|
+
// add the new selected
|
1086
|
+
if (select > 0) {
|
1087
|
+
select /= 5;
|
1088
|
+
select--;
|
1089
|
+
minuteViewChildren[select].id = sMinute;
|
1090
|
+
minuteViewChildren[select].classList.add(selected);
|
1091
|
+
}
|
1092
|
+
minute.textContent = me._numWithZero(divides);
|
1093
|
+
me._sDialog.sDate.minutes(divides);
|
1094
|
+
});
|
1095
|
+
}
|
1096
|
+
}, {
|
1097
|
+
key: '_attachEventHandlers',
|
1098
|
+
value: function _attachEventHandlers() {
|
1099
|
+
var me = this,
|
1100
|
+
ok = this._sDialog.ok,
|
1101
|
+
cancel = this._sDialog.cancel,
|
1102
|
+
onCancel = new CustomEvent('onCancel'),
|
1103
|
+
onOk = new CustomEvent('onOk');
|
1104
|
+
// create cutom events to dispatch
|
1105
|
+
|
1106
|
+
cancel.onclick = function () {
|
1107
|
+
me.toggle();
|
1108
|
+
if (me._trigger) {
|
1109
|
+
me._trigger.dispatchEvent(onCancel);
|
1110
|
+
}
|
1111
|
+
};
|
1112
|
+
ok.onclick = function () {
|
1113
|
+
me._init = me._sDialog.sDate;
|
1114
|
+
me.toggle();
|
1115
|
+
if (me._trigger) {
|
1116
|
+
me._trigger.dispatchEvent(onOk);
|
1117
|
+
}
|
1118
|
+
};
|
1119
|
+
}
|
1120
|
+
}, {
|
1121
|
+
key: '_getMonth',
|
1122
|
+
value: function _getMonth(moment, count) {
|
1123
|
+
var m = void 0;
|
1124
|
+
m = moment.clone();
|
1125
|
+
if (count > 0) {
|
1126
|
+
return m.add(Math.abs(count), 'M');
|
1127
|
+
} else {
|
1128
|
+
return m.subtract(Math.abs(count), 'M');
|
1129
|
+
}
|
1130
|
+
}
|
1131
|
+
}, {
|
1132
|
+
key: '_nearestDivisor',
|
1133
|
+
value: function _nearestDivisor(number, divided) {
|
1134
|
+
if (number % divided === 0) {
|
1135
|
+
return number;
|
1136
|
+
} else if ((number - 1) % divided === 0) {
|
1137
|
+
return number - 1;
|
1138
|
+
} else if ((number + 1) % divided === 0) {
|
1139
|
+
return number + 1;
|
1140
|
+
}
|
1141
|
+
return -1;
|
1142
|
+
}
|
1143
|
+
}, {
|
1144
|
+
key: '_numWithZero',
|
1145
|
+
value: function _numWithZero(n) {
|
1146
|
+
return n > 9 ? '' + n : '0' + n;
|
1147
|
+
}
|
1148
|
+
}, {
|
1149
|
+
key: '_fillText',
|
1150
|
+
value: function _fillText(el, text) {
|
1151
|
+
if (el.firstChild) {
|
1152
|
+
el.firstChild.nodeValue = text;
|
1153
|
+
} else {
|
1154
|
+
el.appendChild(document.createTextNode(text));
|
1155
|
+
}
|
1156
|
+
}
|
1157
|
+
}, {
|
1158
|
+
key: '_addId',
|
1159
|
+
value: function _addId(el, id) {
|
1160
|
+
el.id = 'mddtp-' + this._type + '__' + id;
|
1161
|
+
}
|
1162
|
+
}, {
|
1163
|
+
key: '_addClass',
|
1164
|
+
value: function _addClass(el, aClass, more) {
|
1165
|
+
el.classList.add('mddtp-picker__' + aClass);
|
1166
|
+
var i = 0;
|
1167
|
+
if (more) {
|
1168
|
+
i = more.length;
|
1169
|
+
more.reverse();
|
1170
|
+
}
|
1171
|
+
while (i--) {
|
1172
|
+
el.classList.add(more[i]);
|
1173
|
+
}
|
1174
|
+
}
|
1175
|
+
}, {
|
1176
|
+
key: '_addView',
|
1177
|
+
value: function _addView(view) {
|
1178
|
+
var month = document.createElement('div'),
|
1179
|
+
grid = document.createElement('div'),
|
1180
|
+
th = document.createElement('div'),
|
1181
|
+
tr = document.createElement('div'),
|
1182
|
+
weekDays = ['S', 'F', 'T', 'W', 'T', 'M', 'S'],
|
1183
|
+
week = 7;
|
1184
|
+
|
1185
|
+
while (week--) {
|
1186
|
+
var span = document.createElement('span');
|
1187
|
+
span.textContent = weekDays[week];
|
1188
|
+
th.appendChild(span);
|
1189
|
+
}
|
1190
|
+
// add properties to them
|
1191
|
+
this._addClass(month, 'month');
|
1192
|
+
this._addClass(grid, 'grid');
|
1193
|
+
this._addClass(th, 'th');
|
1194
|
+
this._addClass(tr, 'tr');
|
1195
|
+
// add them to the view
|
1196
|
+
view.appendChild(month);
|
1197
|
+
view.appendChild(grid);
|
1198
|
+
grid.appendChild(th);
|
1199
|
+
grid.appendChild(tr);
|
1200
|
+
}
|
1201
|
+
}, {
|
1202
|
+
key: '_calcRotation',
|
1203
|
+
value: function _calcRotation(spoke, value) {
|
1204
|
+
var start = spoke / 12 * 3;
|
1205
|
+
// set clocks top and right side value
|
1206
|
+
if (spoke === 12) {
|
1207
|
+
value *= 10;
|
1208
|
+
} else if (spoke === 24) {
|
1209
|
+
value *= 5;
|
1210
|
+
} else {
|
1211
|
+
value *= 2;
|
1212
|
+
}
|
1213
|
+
// special case for 00 => 60
|
1214
|
+
if (spoke === 60 && value === 0) {
|
1215
|
+
value = 120;
|
1216
|
+
}
|
1217
|
+
return 'mddtp-picker__cell--rotate-' + value;
|
1218
|
+
}
|
1219
|
+
}, {
|
1220
|
+
key: 'time',
|
1221
|
+
get: function get() {
|
1222
|
+
return this._init;
|
1223
|
+
},
|
1224
|
+
set: function set(m) {
|
1225
|
+
if (m) {
|
1226
|
+
this._init = m;
|
1227
|
+
}
|
1228
|
+
}
|
1229
|
+
}, {
|
1230
|
+
key: 'trigger',
|
1231
|
+
get: function get() {
|
1232
|
+
return this._trigger;
|
1233
|
+
},
|
1234
|
+
set: function set(el) {
|
1235
|
+
if (el) {
|
1236
|
+
this._trigger = el;
|
1237
|
+
}
|
1238
|
+
}
|
1239
|
+
}], [{
|
1240
|
+
key: 'dialog',
|
1241
|
+
get: function get() {
|
1242
|
+
return _dialog;
|
1243
|
+
}
|
1244
|
+
}]);
|
1245
|
+
|
1246
|
+
return mdDateTimePicker;
|
1247
|
+
}();
|
1248
|
+
|
1249
|
+
exports.default = mdDateTimePicker;
|
1250
|
+
});
|