~koehr/vuedt

e005da2000749e660776607971ff6e8891c0c567 — koehr 4 years ago 87bce8b
working am/pm support
4 files changed, 16 insertions(+), 16 deletions(-)

M dist/index.js
M index.html
M package.json
M src/VuedtClock.vue
M dist/index.js => dist/index.js +1 -1
@@ 1,1 1,1 @@
!function(t,e){"object"==typeof exports&&"object"==typeof module?module.exports=e():"function"==typeof define&&define.amd?define("vuedt",[],e):"object"==typeof exports?exports.vuedt=e():t.vuedt=e()}(this,function(){return function(t){function e(n){if(a[n])return a[n].exports;var o=a[n]={i:n,l:!1,exports:{}};return t[n].call(o.exports,o,o.exports,e),o.l=!0,o.exports}var a={};return e.m=t,e.c=a,e.i=function(t){return t},e.d=function(t,a,n){e.o(t,a)||Object.defineProperty(t,a,{configurable:!1,enumerable:!0,get:n})},e.n=function(t){var a=t&&t.__esModule?function(){return t.default}:function(){return t};return e.d(a,"a",a),a},e.o=function(t,e){return Object.prototype.hasOwnProperty.call(t,e)},e.p="",e(e.s=7)}([function(t,e){function a(t,e){var a=t[1]||"",o=t[3];if(!o)return a;if(e&&"function"==typeof btoa){var r=n(o);return[a].concat(o.sources.map(function(t){return"/*# sourceURL="+o.sourceRoot+t+" */"})).concat([r]).join("\n")}return[a].join("\n")}function n(t){return"/*# sourceMappingURL=data:application/json;charset=utf-8;base64,"+btoa(unescape(encodeURIComponent(JSON.stringify(t))))+" */"}t.exports=function(t){var e=[];return e.toString=function(){return this.map(function(e){var n=a(e,t);return e[2]?"@media "+e[2]+"{"+n+"}":n}).join("")},e.i=function(t,a){"string"==typeof t&&(t=[[null,t,""]]);for(var n={},o=0;o<this.length;o++){var r=this[o][0];"number"==typeof r&&(n[r]=!0)}for(o=0;o<t.length;o++){var s=t[o];"number"==typeof s[0]&&n[s[0]]||(a&&!s[2]?s[2]=a:a&&(s[2]="("+s[2]+") and ("+a+")"),e.push(s))}},e}},function(t,e){t.exports=function(t,e,a,n,o){var r,s=t=t||{},i=typeof t.default;"object"!==i&&"function"!==i||(r=t,s=t.default);var c="function"==typeof s?s.options:s;e&&(c.render=e.render,c.staticRenderFns=e.staticRenderFns),n&&(c._scopeId=n);var d;if(o?(d=function(t){t=t||this.$vnode&&this.$vnode.ssrContext||this.parent&&this.parent.$vnode&&this.parent.$vnode.ssrContext,t||"undefined"==typeof __VUE_SSR_CONTEXT__||(t=__VUE_SSR_CONTEXT__),a&&a.call(this,t),t&&t._registeredComponents&&t._registeredComponents.add(o)},c._ssrRegister=d):a&&(d=a),d){var u=c.functional,l=u?c.render:c.beforeCreate;u?c.render=function(t,e){return d.call(e),l(t,e)}:c.beforeCreate=l?[].concat(l,d):[d]}return{esModule:r,exports:s,options:c}}},function(t,e,a){function n(t){for(var e=0;e<t.length;e++){var a=t[e],n=u[a.id];if(n){n.refs++;for(var o=0;o<n.parts.length;o++)n.parts[o](a.parts[o]);for(;o<a.parts.length;o++)n.parts.push(r(a.parts[o]));n.parts.length>a.parts.length&&(n.parts.length=a.parts.length)}else{for(var s=[],o=0;o<a.parts.length;o++)s.push(r(a.parts[o]));u[a.id]={id:a.id,refs:1,parts:s}}}}function o(){var t=document.createElement("style");return t.type="text/css",l.appendChild(t),t}function r(t){var e,a,n=document.querySelector('style[data-vue-ssr-id~="'+t.id+'"]');if(n){if(p)return v;n.parentNode.removeChild(n)}if(g){var r=h++;n=f||(f=o()),e=s.bind(null,n,r,!1),a=s.bind(null,n,r,!0)}else n=o(),e=i.bind(null,n),a=function(){n.parentNode.removeChild(n)};return e(t),function(n){if(n){if(n.css===t.css&&n.media===t.media&&n.sourceMap===t.sourceMap)return;e(t=n)}else a()}}function s(t,e,a,n){var o=a?"":n.css;if(t.styleSheet)t.styleSheet.cssText=m(e,o);else{var r=document.createTextNode(o),s=t.childNodes;s[e]&&t.removeChild(s[e]),s.length?t.insertBefore(r,s[e]):t.appendChild(r)}}function i(t,e){var a=e.css,n=e.media,o=e.sourceMap;if(n&&t.setAttribute("media",n),o&&(a+="\n/*# sourceURL="+o.sources[0]+" */",a+="\n/*# sourceMappingURL=data:application/json;base64,"+btoa(unescape(encodeURIComponent(JSON.stringify(o))))+" */"),t.styleSheet)t.styleSheet.cssText=a;else{for(;t.firstChild;)t.removeChild(t.firstChild);t.appendChild(document.createTextNode(a))}}var c="undefined"!=typeof document;if("undefined"!=typeof DEBUG&&DEBUG&&!c)throw new Error("vue-style-loader cannot be used in a non-browser environment. Use { target: 'node' } in your Webpack config to indicate a server-rendering environment.");var d=a(19),u={},l=c&&(document.head||document.getElementsByTagName("head")[0]),f=null,h=0,p=!1,v=function(){},g="undefined"!=typeof navigator&&/msie [6-9]\b/.test(navigator.userAgent.toLowerCase());t.exports=function(t,e,a){p=a;var o=d(t,e);return n(o),function(e){for(var a=[],r=0;r<o.length;r++){var s=o[r],i=u[s.id];i.refs--,a.push(i)}e?(o=d(t,e),n(o)):o=[];for(var r=0;r<a.length;r++){var i=a[r];if(0===i.refs){for(var c=0;c<i.parts.length;c++)i.parts[c]();delete u[i.id]}}}};var m=function(){var t=[];return function(e,a){return t[e]=a,t.filter(Boolean).join("\n")}}()},function(t,e,a){function n(t){a(16)}var o=a(1)(a(4),a(13),n,"data-v-3e3cfc34",null);t.exports=o.exports},function(t,e,a){"use strict";Object.defineProperty(e,"__esModule",{value:!0});var n=a(11),o=a.n(n),r=a(12),s=a.n(r);e.default={name:"vuedt",components:{DatePicker:o.a,TimePicker:s.a},props:{lang:{type:String,default:"en"},value:{type:Date,required:!0}},data:function(){return{active:!1,clock:!1}},methods:{showClock:function(){this.clock=!0,this.$refs.clockEl.setHandles()},hideClock:function(){this.clock=!1}}}},function(t,e,a){"use strict";Object.defineProperty(e,"__esModule",{value:!0});var n={en:{day:["Su","Mo","Tu","We","Th","Fr","Sa"],month:["Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec"]},de:{day:["So","Mo","Di","Mi","Do","Fr","Sa"],month:["Jan","Feb","Mär","Apr","Mai","Jun","Jul","Aug","Sep","Okt","Nov","Dez"]}};e.default={name:"vuedt-calendar",props:{lang:{type:String,default:"en"},value:{type:Date,default:function(){return new Date}}},data:function(){return{baseYear:0,baseMonth:0,year:0,month:0,day:0}},computed:{msg:function(){return n[this.lang]||n.en}},methods:{calendarDay:function(t,e){this.monthOffset();return 7*(e-1)+t-this.monthOffset()},isLastMonth:function(t,e){return this.calendarDay(t,e)<=0},isNextMonth:function(t,e){return this.calendarDay(t,e)>this.lastDay()},isToday:function(t,e){var a=this.calendarDay(t,e),n=new Date,o=this.year===n.getFullYear(),r=this.month===n.getMonth();return o&&r&&a===n.getDate()},prettyDay:function(t,e){var a=this.calendarDay(t,e);return this.isLastMonth(t,e)?this.lastDayBefore()+a:this.isNextMonth(t,e)?a-this.lastDay():a},cssClasses:function(t,e){var a=this.calendarDay(t,e),n=this.year===this.value.getFullYear(),o=this.month===this.value.getMonth(),r=a===this.value.getDate();return{"out-of-month":this.isLastMonth(t,e)||this.isNextMonth(t,e),today:this.isToday(t,e),selected:n&&o&&r}},monthOffset:function(){return new Date(this.year,this.month,1).getDay()},lastDayBefore:function(){return new Date(this.year,this.month,0).getDate()},lastDay:function(){return new Date(this.year,this.month+1,0).getDate()},selectDay:function(t,e){var a=this.calendarDay(t,e),n=new Date(this.value);n.setFullYear(this.year),n.setMonth(this.month),n.setDate(a),this.$emit("input",n)}},beforeMount:function(){var t=this.value||new Date;this.year=this.baseYear=t.getFullYear(),this.month=this.baseMonth=t.getMonth(),this.day=t.getDate()},watch:{value:function(t,e){var a=t||new Date;this.year=this.baseYear=a.getFullYear(),this.month=this.baseMonth=a.getMonth(),this.day=a.getDate()}}}},function(t,e,a){"use strict";Object.defineProperty(e,"__esModule",{value:!0});var n=["zerosix","oneseven","twoeight","threenine","fourten","fiveeleven"],o=["hour","minute","second"];e.default={name:"vuedt-clock",props:{lang:{type:String,default:"en"},value:{type:Date,default:function(){return new Date}}},data:function(){return{markers:n,mode:0,baseYear:0,baseMonth:0,hour:0,minute:0,second:0}},methods:{pad:function(t){return("0"+t).slice(-2)},handleValue:function(t){var e=arguments.length>1&&void 0!==arguments[1]&&arguments[1];return 0===this.mode?e?t+6:t:e?5*(t+6):5*t},setValue:function(t){this[o[this.mode]]=t,this.mode=(this.mode+1)%o.length,this.setHandles(this.hour,this.minute,this.second);var e=new Date(this.value);e.setHours(this.hour,this.minute,this.second,0),this.$emit("input",e)},setHandles:function(t,e,a){t=void 0!==t?t:this.value.getHours(),e=void 0!==e?e:this.value.getMinutes(),a=void 0!==a?a:this.value.getSeconds();var n=t/12*360,o=e/60*360,r=a/60*360;this.$refs.hour.style.transform="rotate("+n+"deg)",this.$refs.minute.style.transform="rotate("+o+"deg)",this.$refs.second.style.transform="rotate("+r+"deg)"}},computed:{formattedTime:function(){return this.pad(this.hour)+":"+this.pad(this.minute)+":"+this.pad(this.second)}},beforeMount:function(){this.hour=this.value.getHours(),this.minute=this.value.getMinutes(),this.second=this.value.getSeconds()}}},function(t,e,a){"use strict";Object.defineProperty(e,"__esModule",{value:!0});var n=a(3),o=a.n(n);e.default=o.a},function(t,e,a){e=t.exports=a(0)(void 0),e.push([t.i,'.vuedt[data-v-3e3cfc34]{position:relative}.vuedt>.input-wrap[data-v-3e3cfc34]{width:200px}.vuedt>.input-wrap>input[data-v-3e3cfc34]{width:200px;text-align:center;pointer-events:none}.vuedt>.input-wrap>input[data-v-3e3cfc34]:after{content:"\\1F4C5"}.fullscreen[data-v-3e3cfc34]{position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(0,0,0,.2);z-index:99998}.pickers[data-v-3e3cfc34]{display:inline-block;position:absolute;top:24px;z-index:99999;height:290px;overflow:hidden}.pickers>.calendar-wrap[data-v-3e3cfc34],.pickers>.clock-wrap[data-v-3e3cfc34]{display:block;height:290px;background:#fff;transition:transform .2s ease-out}.pickers.clock>.calendar-wrap[data-v-3e3cfc34],.pickers.clock>.clock-wrap[data-v-3e3cfc34]{transform:translateY(-100%)}button.next[data-v-3e3cfc34],button.prev[data-v-3e3cfc34]{display:block;width:100%;height:20px;font-size:10px;letter-spacing:1px}button.next[data-v-3e3cfc34]{margin-top:2px}.fade-enter-active[data-v-3e3cfc34],.fade-leave-active[data-v-3e3cfc34]{transition:opacity .5s}.fade-enter[data-v-3e3cfc34],.fade-leave-to .fade-leave-active[data-v-3e3cfc34]{opacity:0}',""])},function(t,e,a){e=t.exports=a(0)(void 0),e.push([t.i,'.clock[data-v-aa04692c]{background:#fff}.clock>header[data-v-aa04692c]{margin:0;padding:0}.clock>header>h1[data-v-aa04692c]{font-size:30px;margin:.2em;text-align:center;color:#333}.clock>header>h1>span[data-v-aa04692c]{cursor:pointer;border-bottom:2px solid transparent}.clock>header>h1>span[data-v-aa04692c]:hover{border-bottom:2px solid #333}.clock>header>h1>span.highlight[data-v-aa04692c]{color:#06b;border-bottom:2px solid #333}.outer_face[data-v-aa04692c]{position:relative;width:186px;height:186px;margin:auto;border-radius:50%;background:#fff;box-shadow:inset 0 0 10px gray;border:10px solid #000}.outer_face>.marker[data-v-aa04692c]{content:"";position:absolute;top:0;left:50%;width:3px;height:100%;margin-left:-2px;z-index:0;background:grey}.outer_face>.marker.threenine[data-v-aa04692c],.outer_face>.marker.zerosix[data-v-aa04692c]{background:#000;width:5px;margin-left:-3px}.outer_face>.marker.oneseven[data-v-aa04692c]{transform:rotate(30deg)}.outer_face>.marker.twoeight[data-v-aa04692c]{transform:rotate(60deg)}.outer_face>.marker.threenine[data-v-aa04692c]{transform:rotate(90deg)}.outer_face>.marker.fourten[data-v-aa04692c]{transform:rotate(120deg)}.outer_face>.marker.fiveeleven[data-v-aa04692c]{transform:rotate(150deg)}.marker>.handle0[data-v-aa04692c],.marker>.handle1[data-v-aa04692c]{opacity:0;position:absolute;left:-250%;width:600%;height:15%;z-index:3;color:#fff;line-height:1em;text-shadow:0 0 2px #000;text-align:center;cursor:pointer}.marker>.handle0[data-v-aa04692c]:hover,.marker>.handle1[data-v-aa04692c]:hover{opacity:1}.marker>.handle0[data-v-aa04692c]{top:-10%;transform:scale(1.5)}.marker>.handle1[data-v-aa04692c]{top:95%;transform:rotate(180deg) scale(1.5)}.inner_face[data-v-aa04692c]{position:relative;top:5%;left:5%;width:90%;height:90%;background:#fff;border-radius:50%;z-index:2}.inner_face[data-v-aa04692c]:before{content:"";position:absolute;top:47%;left:47%;width:6%;height:6%;background:#000;border-radius:50%;box-shadow:0 0 15px gray}.inner_face[data-v-aa04692c]:after{content:"vuedt";position:absolute;top:83%;left:0;width:100%;font:normal .8em sans-serif;color:gray;text-align:center;text-transform:uppercase}.hand[data-v-aa04692c]{position:absolute;background:#000;left:50%;transform:rotate(0deg);transform-origin:bottom;z-index:-1;box-shadow:0 0 4px gray;transition:transform .5s linear}.hand.hour[data-v-aa04692c]{top:15%;width:4%;height:35%;margin-left:-2%;transform:rotate(15deg)}.hand.minute[data-v-aa04692c]{top:5%;width:3%;height:45%;margin-left:-2%;transform:rotate(45deg)}.hand.second[data-v-aa04692c]{width:1%;height:50%;margin-left:-1%;background:red;transform:rotate(0deg)}',""])},function(t,e,a){e=t.exports=a(0)(void 0),e.push([t.i,".day-selector>.row,.month-selector,.year-selector{display:flex;justify-content:center}.day-selector>.row>button,.month-selector>button,.year-selector>button{flex:1 1;border:1px solid #aaa;background:#eee;background:linear-gradient(#fff,#f9f9f9)}.day-selector>.row>button.selected,.month-selector>button.selected,.year-selector>button.selected{background:#ddf;background:linear-gradient(#efefff,#e0e0f0);font-weight:700}.month-selector>button:hover,.year-selector>button:hover{background:#ddf;cursor:pointer}.month-selector>button:first-of-type,.month-selector>button:last-of-type,.year-selector>button:first-of-type,.year-selector>button:last-of-type{flex:0 0}.day-selector>header{display:flex;justify-content:space-around;margin:0;padding:0;background:#f5f5f5}.day-selector>header>.day{flex:0 0 36px;color:#000;text-align:center}.day-selector>.row>button{width:36px;height:34px;box-sizing:border-box;border:3px solid transparent}.day-selector>.row>button:hover{border-bottom:3px solid #333}.day-selector>.row>button.out-of-month{color:#888}.day-selector>.row>button.out-of-month:hover{border-bottom:3px solid #999}.day-selector>.row>button.today{color:#06b;font-weight:700;border-bottom:3px solid #06b}",""])},function(t,e,a){function n(t){a(18)}var o=a(1)(a(5),a(15),n,null,null);t.exports=o.exports},function(t,e,a){function n(t){a(17)}var o=a(1)(a(6),a(14),n,"data-v-aa04692c",null);t.exports=o.exports},function(t,e){t.exports={render:function(){var t=this,e=t.$createElement,a=t._self._c||e;return a("div",{staticClass:"vuedt"},[a("div",{staticClass:"input-wrap",on:{click:function(e){t.active=!0}}},[a("input",{attrs:{type:"datetime",disabled:"true"},domProps:{value:t.value.toLocaleString()}})]),t._v(" "),a("transition",{attrs:{name:"fade"}},[t.active?a("div",{staticClass:"fullscreen",on:{click:function(e){t.active=!1}}}):t._e()]),t._v(" "),a("div",{directives:[{name:"show",rawName:"v-show",value:t.active,expression:"active"}],staticClass:"pickers",class:{clock:t.clock}},[a("div",{staticClass:"calendar-wrap"},[a("date-picker",{attrs:{value:t.value,lang:t.lang},on:{input:function(e){t.showClock(),t.$emit("input",e)}}}),t._v(" "),a("button",{staticClass:"next",on:{click:function(e){e.stopPropagation(),t.showClock()}}},[t._v("switch to clock")])],1),t._v(" "),a("div",{staticClass:"clock-wrap"},[a("button",{staticClass:"prev",on:{click:function(e){e.stopPropagation(),t.hideClock()}}},[t._v("back to calendar")]),t._v(" "),a("time-picker",{ref:"clockEl",attrs:{value:t.value,lang:t.lang},on:{input:function(e){t.$emit("input",e)}}})],1)])],1)},staticRenderFns:[]}},function(t,e){t.exports={render:function(){var t=this,e=t.$createElement,a=t._self._c||e;return a("div",{staticClass:"clock"},[a("header",[a("h1",[a("span",{class:{highlight:0===t.mode},on:{click:function(e){e.stopPropagation(),t.mode=0}}},[t._v(t._s(t.pad(t.hour)))]),t._v(" :\n      "),a("span",{class:{highlight:1===t.mode},on:{click:function(e){e.stopPropagation(),t.mode=1}}},[t._v(t._s(t.pad(t.minute)))]),t._v(" :\n      "),a("span",{class:{highlight:2===t.mode},on:{click:function(e){e.stopPropagation(),t.mode=2}}},[t._v(t._s(t.pad(t.second)))])])]),t._v(" "),a("div",{staticClass:"outer_face"},[t._l(t.markers,function(e,n){return a("div",{class:"marker "+e},[a("span",{staticClass:"handle0",on:{click:function(e){e.stopPropagation(),t.setValue(t.handleValue(n))}}},[t._v(t._s(t.handleValue(n)))]),t._v(" "),a("span",{staticClass:"handle1",on:{click:function(e){e.stopPropagation(),t.setValue(t.handleValue(n,!0))}}},[t._v(t._s(t.handleValue(n,!0)))])])}),t._v(" "),a("div",{staticClass:"inner_face"},[a("div",{ref:"hour",staticClass:"hand hour"}),t._v(" "),a("div",{ref:"minute",staticClass:"hand minute"}),t._v(" "),a("div",{ref:"second",staticClass:"hand second"})])],2)])},staticRenderFns:[]}},function(t,e){t.exports={render:function(){var t=this,e=t.$createElement,a=t._self._c||e;return a("div",{staticClass:"calendar"},[a("div",{staticClass:"year-selector"},[a("button",{on:{click:function(e){e.stopPropagation(),t.baseYear=t.baseYear-1}}},[t._v("‹")]),t._v(" "),t._l([t.baseYear-1,t.baseYear,t.baseYear+1],function(e){return a("button",{class:{selected:t.year===e},on:{click:function(a){a.stopPropagation(),t.year=e}}},[t._v("\n      "+t._s(e)+"\n    ")])}),t._v(" "),a("button",{on:{click:function(e){e.stopPropagation(),t.baseYear=t.baseYear+1}}},[t._v("›")])],2),t._v(" "),a("div",{staticClass:"month-selector"},[a("button",{attrs:{disabled:t.baseMonth<3},on:{click:function(e){e.stopPropagation(),t.baseMonth=t.baseMonth-1}}},[t._v("‹")]),t._v(" "),t._l([t.baseMonth-2,t.baseMonth-1,t.baseMonth,t.baseMonth+1,t.baseMonth+2],function(e){return a("button",{class:{selected:t.month===e},on:{click:function(a){a.stopPropagation(),t.month=e}}},[t._v("\n      "+t._s(t.msg.month[e])+"\n    ")])}),t._v(" "),a("button",{attrs:{disabled:t.baseMonth>8},on:{click:function(e){e.stopPropagation(),t.baseMonth=t.baseMonth+1}}},[t._v("›")])],2),t._v(" "),a("div",{staticClass:"day-selector"},[a("header",t._l(t.msg.day,function(e){return a("div",{staticClass:"day"},[t._v(t._s(e))])})),t._v(" "),t._l(6,function(e){return a("div",{staticClass:"row"},t._l(7,function(n){return a("button",{class:t.cssClasses(n,e),on:{click:function(a){a.stopPropagation(),t.selectDay(n,e)}}},[t._v("\n        "+t._s(t.prettyDay(n,e))+"\n      ")])}))})],2)])},staticRenderFns:[]}},function(t,e,a){var n=a(8);"string"==typeof n&&(n=[[t.i,n,""]]),n.locals&&(t.exports=n.locals);a(2)("855ff380",n,!0)},function(t,e,a){var n=a(9);"string"==typeof n&&(n=[[t.i,n,""]]),n.locals&&(t.exports=n.locals);a(2)("51b8787e",n,!0)},function(t,e,a){var n=a(10);"string"==typeof n&&(n=[[t.i,n,""]]),n.locals&&(t.exports=n.locals);a(2)("f297a148",n,!0)},function(t,e){t.exports=function(t,e){for(var a=[],n={},o=0;o<e.length;o++){var r=e[o],s=r[0],i=r[1],c=r[2],d=r[3],u={id:t+":"+o,css:i,media:c,sourceMap:d};n[s]?n[s].parts.push(u):a.push(n[s]={id:s,parts:[u]})}return a}}])});
\ No newline at end of file
!function(t,e){"object"==typeof exports&&"object"==typeof module?module.exports=e():"function"==typeof define&&define.amd?define("vuedt",[],e):"object"==typeof exports?exports.vuedt=e():t.vuedt=e()}(this,function(){return function(t){function e(n){if(a[n])return a[n].exports;var o=a[n]={i:n,l:!1,exports:{}};return t[n].call(o.exports,o,o.exports,e),o.l=!0,o.exports}var a={};return e.m=t,e.c=a,e.i=function(t){return t},e.d=function(t,a,n){e.o(t,a)||Object.defineProperty(t,a,{configurable:!1,enumerable:!0,get:n})},e.n=function(t){var a=t&&t.__esModule?function(){return t.default}:function(){return t};return e.d(a,"a",a),a},e.o=function(t,e){return Object.prototype.hasOwnProperty.call(t,e)},e.p="",e(e.s=7)}([function(t,e){function a(t,e){var a=t[1]||"",o=t[3];if(!o)return a;if(e&&"function"==typeof btoa){var r=n(o);return[a].concat(o.sources.map(function(t){return"/*# sourceURL="+o.sourceRoot+t+" */"})).concat([r]).join("\n")}return[a].join("\n")}function n(t){return"/*# sourceMappingURL=data:application/json;charset=utf-8;base64,"+btoa(unescape(encodeURIComponent(JSON.stringify(t))))+" */"}t.exports=function(t){var e=[];return e.toString=function(){return this.map(function(e){var n=a(e,t);return e[2]?"@media "+e[2]+"{"+n+"}":n}).join("")},e.i=function(t,a){"string"==typeof t&&(t=[[null,t,""]]);for(var n={},o=0;o<this.length;o++){var r=this[o][0];"number"==typeof r&&(n[r]=!0)}for(o=0;o<t.length;o++){var s=t[o];"number"==typeof s[0]&&n[s[0]]||(a&&!s[2]?s[2]=a:a&&(s[2]="("+s[2]+") and ("+a+")"),e.push(s))}},e}},function(t,e){t.exports=function(t,e,a,n,o){var r,s=t=t||{},i=typeof t.default;"object"!==i&&"function"!==i||(r=t,s=t.default);var c="function"==typeof s?s.options:s;e&&(c.render=e.render,c.staticRenderFns=e.staticRenderFns),n&&(c._scopeId=n);var d;if(o?(d=function(t){t=t||this.$vnode&&this.$vnode.ssrContext||this.parent&&this.parent.$vnode&&this.parent.$vnode.ssrContext,t||"undefined"==typeof __VUE_SSR_CONTEXT__||(t=__VUE_SSR_CONTEXT__),a&&a.call(this,t),t&&t._registeredComponents&&t._registeredComponents.add(o)},c._ssrRegister=d):a&&(d=a),d){var u=c.functional,l=u?c.render:c.beforeCreate;u?c.render=function(t,e){return d.call(e),l(t,e)}:c.beforeCreate=l?[].concat(l,d):[d]}return{esModule:r,exports:s,options:c}}},function(t,e,a){function n(t){for(var e=0;e<t.length;e++){var a=t[e],n=u[a.id];if(n){n.refs++;for(var o=0;o<n.parts.length;o++)n.parts[o](a.parts[o]);for(;o<a.parts.length;o++)n.parts.push(r(a.parts[o]));n.parts.length>a.parts.length&&(n.parts.length=a.parts.length)}else{for(var s=[],o=0;o<a.parts.length;o++)s.push(r(a.parts[o]));u[a.id]={id:a.id,refs:1,parts:s}}}}function o(){var t=document.createElement("style");return t.type="text/css",l.appendChild(t),t}function r(t){var e,a,n=document.querySelector('style[data-vue-ssr-id~="'+t.id+'"]');if(n){if(p)return v;n.parentNode.removeChild(n)}if(m){var r=h++;n=f||(f=o()),e=s.bind(null,n,r,!1),a=s.bind(null,n,r,!0)}else n=o(),e=i.bind(null,n),a=function(){n.parentNode.removeChild(n)};return e(t),function(n){if(n){if(n.css===t.css&&n.media===t.media&&n.sourceMap===t.sourceMap)return;e(t=n)}else a()}}function s(t,e,a,n){var o=a?"":n.css;if(t.styleSheet)t.styleSheet.cssText=g(e,o);else{var r=document.createTextNode(o),s=t.childNodes;s[e]&&t.removeChild(s[e]),s.length?t.insertBefore(r,s[e]):t.appendChild(r)}}function i(t,e){var a=e.css,n=e.media,o=e.sourceMap;if(n&&t.setAttribute("media",n),o&&(a+="\n/*# sourceURL="+o.sources[0]+" */",a+="\n/*# sourceMappingURL=data:application/json;base64,"+btoa(unescape(encodeURIComponent(JSON.stringify(o))))+" */"),t.styleSheet)t.styleSheet.cssText=a;else{for(;t.firstChild;)t.removeChild(t.firstChild);t.appendChild(document.createTextNode(a))}}var c="undefined"!=typeof document;if("undefined"!=typeof DEBUG&&DEBUG&&!c)throw new Error("vue-style-loader cannot be used in a non-browser environment. Use { target: 'node' } in your Webpack config to indicate a server-rendering environment.");var d=a(19),u={},l=c&&(document.head||document.getElementsByTagName("head")[0]),f=null,h=0,p=!1,v=function(){},m="undefined"!=typeof navigator&&/msie [6-9]\b/.test(navigator.userAgent.toLowerCase());t.exports=function(t,e,a){p=a;var o=d(t,e);return n(o),function(e){for(var a=[],r=0;r<o.length;r++){var s=o[r],i=u[s.id];i.refs--,a.push(i)}e?(o=d(t,e),n(o)):o=[];for(var r=0;r<a.length;r++){var i=a[r];if(0===i.refs){for(var c=0;c<i.parts.length;c++)i.parts[c]();delete u[i.id]}}}};var g=function(){var t=[];return function(e,a){return t[e]=a,t.filter(Boolean).join("\n")}}()},function(t,e,a){function n(t){a(16)}var o=a(1)(a(4),a(13),n,"data-v-3e3cfc34",null);t.exports=o.exports},function(t,e,a){"use strict";Object.defineProperty(e,"__esModule",{value:!0});var n=a(11),o=a.n(n),r=a(12),s=a.n(r);e.default={name:"vuedt",components:{DatePicker:o.a,TimePicker:s.a},props:{lang:{type:String,default:"en"},value:{type:Date,required:!0}},data:function(){return{active:!1,clock:!1}},methods:{showClock:function(){this.clock=!0,this.$refs.clockEl.setHandles()},hideClock:function(){this.clock=!1}}}},function(t,e,a){"use strict";Object.defineProperty(e,"__esModule",{value:!0});var n={en:{day:["Su","Mo","Tu","We","Th","Fr","Sa"],month:["Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec"]},de:{day:["So","Mo","Di","Mi","Do","Fr","Sa"],month:["Jan","Feb","Mär","Apr","Mai","Jun","Jul","Aug","Sep","Okt","Nov","Dez"]}};e.default={name:"vuedt-calendar",props:{lang:{type:String,default:"en"},value:{type:Date,default:function(){return new Date}}},data:function(){return{baseYear:0,baseMonth:0,year:0,month:0,day:0}},computed:{msg:function(){return n[this.lang]||n.en}},methods:{calendarDay:function(t,e){this.monthOffset();return 7*(e-1)+t-this.monthOffset()},isLastMonth:function(t,e){return this.calendarDay(t,e)<=0},isNextMonth:function(t,e){return this.calendarDay(t,e)>this.lastDay()},isToday:function(t,e){var a=this.calendarDay(t,e),n=new Date,o=this.year===n.getFullYear(),r=this.month===n.getMonth();return o&&r&&a===n.getDate()},prettyDay:function(t,e){var a=this.calendarDay(t,e);return this.isLastMonth(t,e)?this.lastDayBefore()+a:this.isNextMonth(t,e)?a-this.lastDay():a},cssClasses:function(t,e){var a=this.calendarDay(t,e),n=this.year===this.value.getFullYear(),o=this.month===this.value.getMonth(),r=a===this.value.getDate();return{"out-of-month":this.isLastMonth(t,e)||this.isNextMonth(t,e),today:this.isToday(t,e),selected:n&&o&&r}},monthOffset:function(){return new Date(this.year,this.month,1).getDay()},lastDayBefore:function(){return new Date(this.year,this.month,0).getDate()},lastDay:function(){return new Date(this.year,this.month+1,0).getDate()},selectDay:function(t,e){var a=this.calendarDay(t,e),n=new Date(this.value);n.setFullYear(this.year),n.setMonth(this.month),n.setDate(a),this.$emit("input",n)}},beforeMount:function(){var t=this.value||new Date;this.year=this.baseYear=t.getFullYear(),this.month=this.baseMonth=t.getMonth(),this.day=t.getDate()},watch:{value:function(t,e){var a=t||new Date;this.year=this.baseYear=a.getFullYear(),this.month=this.baseMonth=a.getMonth(),this.day=a.getDate()}}}},function(t,e,a){"use strict";Object.defineProperty(e,"__esModule",{value:!0});var n=["zerosix","oneseven","twoeight","threenine","fourten","fiveeleven"],o=["hour","minute","second"];e.default={name:"vuedt-clock",props:{lang:{type:String,default:"en"},value:{type:Date,default:function(){return new Date}}},data:function(){return{markers:n,mode:0,baseYear:0,baseMonth:0,hour:0,minute:0,second:0,pm:!1}},methods:{ampm:function(){this.pm=!this.pm,this.pm?this.hour+=12:this.hour-=12,this.emitValue()},pad:function(t){return("0"+t).slice(-2)},handleValue:function(t){var e=arguments.length>1&&void 0!==arguments[1]&&arguments[1];return 0===this.mode?e?t+6:t:e?5*(t+6):5*t},emitValue:function(){var t=new Date(this.value);t.setHours(this.hour,this.minute,this.second,0),this.$emit("input",t)},setValue:function(t){this.pm&&0===this.mode&&(t+=12),this[o[this.mode]]=t,this.mode=(this.mode+1)%o.length,this.setHandles(this.hour,this.minute,this.second),this.emitValue()},setHandles:function(t,e,a){t=void 0!==t?t:this.value.getHours(),e=void 0!==e?e:this.value.getMinutes(),a=void 0!==a?a:this.value.getSeconds();var n=t%12/12*360,o=e/60*360,r=a/60*360;this.$refs.hour.style.transform="rotate("+n+"deg)",this.$refs.minute.style.transform="rotate("+o+"deg)",this.$refs.second.style.transform="rotate("+r+"deg)"}},computed:{formattedTime:function(){return this.pad(this.hour)+":"+this.pad(this.minute)+":"+this.pad(this.second)}},beforeMount:function(){this.hour=this.value.getHours(),this.minute=this.value.getMinutes(),this.second=this.value.getSeconds(),this.pm=this.hour>11}}},function(t,e,a){"use strict";Object.defineProperty(e,"__esModule",{value:!0});var n=a(3),o=a.n(n);e.default=o.a},function(t,e,a){e=t.exports=a(0)(void 0),e.push([t.i,'.vuedt[data-v-3e3cfc34]{position:relative}.vuedt>.input-wrap[data-v-3e3cfc34]{width:200px}.vuedt>.input-wrap>input[data-v-3e3cfc34]{width:200px;text-align:center;pointer-events:none}.vuedt>.input-wrap>input[data-v-3e3cfc34]:after{content:"\\1F4C5"}.fullscreen[data-v-3e3cfc34]{position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(0,0,0,.2);z-index:99998}.pickers[data-v-3e3cfc34]{display:inline-block;position:absolute;top:24px;z-index:99999;height:290px;overflow:hidden}.pickers>.calendar-wrap[data-v-3e3cfc34],.pickers>.clock-wrap[data-v-3e3cfc34]{display:block;height:290px;background:#fff;transition:transform .2s ease-out}.pickers.clock>.calendar-wrap[data-v-3e3cfc34],.pickers.clock>.clock-wrap[data-v-3e3cfc34]{transform:translateY(-100%)}button.next[data-v-3e3cfc34],button.prev[data-v-3e3cfc34]{display:block;width:100%;height:20px;font-size:10px;letter-spacing:1px}button.next[data-v-3e3cfc34]{margin-top:2px}.fade-enter-active[data-v-3e3cfc34],.fade-leave-active[data-v-3e3cfc34]{transition:opacity .5s}.fade-enter[data-v-3e3cfc34],.fade-leave-to .fade-leave-active[data-v-3e3cfc34]{opacity:0}',""])},function(t,e,a){e=t.exports=a(0)(void 0),e.push([t.i,'.clock[data-v-aa04692c]{background:#fff}.clock>header[data-v-aa04692c]{margin:0;padding:0}.clock>header>h1[data-v-aa04692c]{font-size:30px;margin:.2em;text-align:center;color:#333}.clock>header>h1>span[data-v-aa04692c]{cursor:pointer;border-bottom:2px solid transparent}.clock>header>h1>span[data-v-aa04692c]:hover{border-bottom:2px solid #333}.clock>header>h1>span.highlight[data-v-aa04692c]{color:#06b;border-bottom:2px solid #333}.outer_face[data-v-aa04692c]{position:relative;width:186px;height:186px;margin:auto;border-radius:50%;background:#fff;box-shadow:inset 0 0 10px gray;border:10px solid #000}.outer_face>.marker[data-v-aa04692c]{content:"";position:absolute;top:0;left:50%;width:3px;height:100%;margin-left:-2px;z-index:0;background:grey}.outer_face>.marker.threenine[data-v-aa04692c],.outer_face>.marker.zerosix[data-v-aa04692c]{background:#000;width:5px;margin-left:-3px}.outer_face>.marker.oneseven[data-v-aa04692c]{transform:rotate(30deg)}.outer_face>.marker.twoeight[data-v-aa04692c]{transform:rotate(60deg)}.outer_face>.marker.threenine[data-v-aa04692c]{transform:rotate(90deg)}.outer_face>.marker.fourten[data-v-aa04692c]{transform:rotate(120deg)}.outer_face>.marker.fiveeleven[data-v-aa04692c]{transform:rotate(150deg)}.marker>.handle0[data-v-aa04692c],.marker>.handle1[data-v-aa04692c]{opacity:0;position:absolute;left:-250%;width:600%;height:15%;z-index:3;color:#fff;line-height:1em;text-shadow:0 0 2px #000;text-align:center;cursor:pointer}.marker>.handle0[data-v-aa04692c]:hover,.marker>.handle1[data-v-aa04692c]:hover{opacity:1}.marker>.handle0[data-v-aa04692c]{top:-10%;transform:scale(1.5)}.marker>.handle1[data-v-aa04692c]{top:95%;transform:rotate(180deg) scale(1.5)}.inner_face[data-v-aa04692c]{position:relative;top:5%;left:5%;width:90%;height:90%;background:#fff;border-radius:50%;z-index:2}.inner_face[data-v-aa04692c]:before{content:"";position:absolute;top:47%;left:47%;width:6%;height:6%;background:#000;border-radius:50%;box-shadow:0 0 15px gray}.hand[data-v-aa04692c]{position:absolute;background:#000;left:50%;transform:rotate(0deg);transform-origin:bottom;z-index:-1;box-shadow:0 0 4px gray;transition:transform .5s linear}.hand.hour[data-v-aa04692c]{top:15%;width:4%;height:35%;margin-left:-2%;transform:rotate(15deg);z-index:2}.hand.minute[data-v-aa04692c]{top:5%;width:3%;height:45%;margin-left:-2%;transform:rotate(45deg);z-index:3}.hand.second[data-v-aa04692c]{width:1%;height:50%;margin-left:-1%;background:red;transform:rotate(0deg);z-index:4}.am-pm[data-v-aa04692c]{position:absolute;top:76%;left:30%;width:40%;height:1.2em;font:normal .8em sans-serif;color:gray;background-color:#f5f5f5;border:1px inset #ccc;text-align:center;text-transform:uppercase;z-index:1;white-space:nowrap;overflow:hidden}.am-pm>.wrap[data-v-aa04692c]{display:flex;justify-content:left;align-items:stretch;transition:transform .2s ease}.am-pm>.wrap.pm[data-v-aa04692c]{transform:translateX(-50%)}.am-pm .label[data-v-aa04692c]{flex:0 0 45%;line-height:1.4em}.am-pm .slider[data-v-aa04692c]{flex:0 0 55%;background:#fff;border:1px solid #eee}',""])},function(t,e,a){e=t.exports=a(0)(void 0),e.push([t.i,".day-selector>.row,.month-selector,.year-selector{display:flex;justify-content:center}.day-selector>.row>button,.month-selector>button,.year-selector>button{flex:1 1;border:1px solid #aaa;background:#eee;background:linear-gradient(#fff,#f9f9f9)}.day-selector>.row>button.selected,.month-selector>button.selected,.year-selector>button.selected{background:#ddf;background:linear-gradient(#efefff,#e0e0f0);font-weight:700}.month-selector>button:hover,.year-selector>button:hover{background:#ddf;cursor:pointer}.month-selector>button:first-of-type,.month-selector>button:last-of-type,.year-selector>button:first-of-type,.year-selector>button:last-of-type{flex:0 0}.day-selector>header{display:flex;justify-content:space-around;margin:0;padding:0;background:#f5f5f5}.day-selector>header>.day{flex:0 0 36px;color:#000;text-align:center}.day-selector>.row>button{width:36px;height:34px;box-sizing:border-box;border:3px solid transparent}.day-selector>.row>button:hover{border-bottom:3px solid #333}.day-selector>.row>button.out-of-month{color:#888}.day-selector>.row>button.out-of-month:hover{border-bottom:3px solid #999}.day-selector>.row>button.today{color:#06b;font-weight:700;border-bottom:3px solid #06b}",""])},function(t,e,a){function n(t){a(18)}var o=a(1)(a(5),a(15),n,null,null);t.exports=o.exports},function(t,e,a){function n(t){a(17)}var o=a(1)(a(6),a(14),n,"data-v-aa04692c",null);t.exports=o.exports},function(t,e){t.exports={render:function(){var t=this,e=t.$createElement,a=t._self._c||e;return a("div",{staticClass:"vuedt"},[a("div",{staticClass:"input-wrap",on:{click:function(e){t.active=!0}}},[a("input",{attrs:{type:"datetime",disabled:"true"},domProps:{value:t.value.toLocaleString()}})]),t._v(" "),a("transition",{attrs:{name:"fade"}},[t.active?a("div",{staticClass:"fullscreen",on:{click:function(e){t.active=!1}}}):t._e()]),t._v(" "),a("div",{directives:[{name:"show",rawName:"v-show",value:t.active,expression:"active"}],staticClass:"pickers",class:{clock:t.clock}},[a("div",{staticClass:"calendar-wrap"},[a("date-picker",{attrs:{value:t.value,lang:t.lang},on:{input:function(e){t.showClock(),t.$emit("input",e)}}}),t._v(" "),a("button",{staticClass:"next",on:{click:function(e){e.stopPropagation(),t.showClock()}}},[t._v("switch to clock")])],1),t._v(" "),a("div",{staticClass:"clock-wrap"},[a("button",{staticClass:"prev",on:{click:function(e){e.stopPropagation(),t.hideClock()}}},[t._v("back to calendar")]),t._v(" "),a("time-picker",{ref:"clockEl",attrs:{value:t.value,lang:t.lang},on:{input:function(e){t.$emit("input",e)}}})],1)])],1)},staticRenderFns:[]}},function(t,e){t.exports={render:function(){var t=this,e=t.$createElement,a=t._self._c||e;return a("div",{staticClass:"clock"},[a("header",[a("h1",[a("span",{class:{highlight:0===t.mode},on:{click:function(e){e.stopPropagation(),t.mode=0}}},[t._v(t._s(t.pad(t.hour)))]),t._v(" :\n      "),a("span",{class:{highlight:1===t.mode},on:{click:function(e){e.stopPropagation(),t.mode=1}}},[t._v(t._s(t.pad(t.minute)))]),t._v(" :\n      "),a("span",{class:{highlight:2===t.mode},on:{click:function(e){e.stopPropagation(),t.mode=2}}},[t._v(t._s(t.pad(t.second)))])])]),t._v(" "),a("div",{staticClass:"outer_face"},[t._l(t.markers,function(e,n){return a("div",{class:"marker "+e},[a("span",{staticClass:"handle0",on:{click:function(e){e.stopPropagation(),t.setValue(t.handleValue(n))}}},[t._v(t._s(t.handleValue(n)))]),t._v(" "),a("span",{staticClass:"handle1",on:{click:function(e){e.stopPropagation(),t.setValue(t.handleValue(n,!0))}}},[t._v(t._s(t.handleValue(n,!0)))])])}),t._v(" "),a("div",{staticClass:"inner_face"},[a("div",{staticClass:"am-pm",on:{click:function(e){e.stopPropagation(),t.ampm()}}},[a("div",{staticClass:"wrap",class:{pm:t.pm}},[a("div",{staticClass:"label"},[t._v("AM")]),t._v(" "),a("div",{staticClass:"slider"}),t._v(" "),a("div",{staticClass:"label"},[t._v("PM")])])]),t._v(" "),a("div",{ref:"hour",staticClass:"hand hour"}),t._v(" "),a("div",{ref:"minute",staticClass:"hand minute"}),t._v(" "),a("div",{ref:"second",staticClass:"hand second"})])],2)])},staticRenderFns:[]}},function(t,e){t.exports={render:function(){var t=this,e=t.$createElement,a=t._self._c||e;return a("div",{staticClass:"calendar"},[a("div",{staticClass:"year-selector"},[a("button",{on:{click:function(e){e.stopPropagation(),t.baseYear=t.baseYear-1}}},[t._v("‹")]),t._v(" "),t._l([t.baseYear-1,t.baseYear,t.baseYear+1],function(e){return a("button",{class:{selected:t.year===e},on:{click:function(a){a.stopPropagation(),t.year=e}}},[t._v("\n      "+t._s(e)+"\n    ")])}),t._v(" "),a("button",{on:{click:function(e){e.stopPropagation(),t.baseYear=t.baseYear+1}}},[t._v("›")])],2),t._v(" "),a("div",{staticClass:"month-selector"},[a("button",{attrs:{disabled:t.baseMonth<3},on:{click:function(e){e.stopPropagation(),t.baseMonth=t.baseMonth-1}}},[t._v("‹")]),t._v(" "),t._l([t.baseMonth-2,t.baseMonth-1,t.baseMonth,t.baseMonth+1,t.baseMonth+2],function(e){return a("button",{class:{selected:t.month===e},on:{click:function(a){a.stopPropagation(),t.month=e}}},[t._v("\n      "+t._s(t.msg.month[e])+"\n    ")])}),t._v(" "),a("button",{attrs:{disabled:t.baseMonth>8},on:{click:function(e){e.stopPropagation(),t.baseMonth=t.baseMonth+1}}},[t._v("›")])],2),t._v(" "),a("div",{staticClass:"day-selector"},[a("header",t._l(t.msg.day,function(e){return a("div",{staticClass:"day"},[t._v(t._s(e))])})),t._v(" "),t._l(6,function(e){return a("div",{staticClass:"row"},t._l(7,function(n){return a("button",{class:t.cssClasses(n,e),on:{click:function(a){a.stopPropagation(),t.selectDay(n,e)}}},[t._v("\n        "+t._s(t.prettyDay(n,e))+"\n      ")])}))})],2)])},staticRenderFns:[]}},function(t,e,a){var n=a(8);"string"==typeof n&&(n=[[t.i,n,""]]),n.locals&&(t.exports=n.locals);a(2)("855ff380",n,!0)},function(t,e,a){var n=a(9);"string"==typeof n&&(n=[[t.i,n,""]]),n.locals&&(t.exports=n.locals);a(2)("51b8787e",n,!0)},function(t,e,a){var n=a(10);"string"==typeof n&&(n=[[t.i,n,""]]),n.locals&&(t.exports=n.locals);a(2)("f297a148",n,!0)},function(t,e){t.exports=function(t,e){for(var a=[],n={},o=0;o<e.length;o++){var r=e[o],s=r[0],i=r[1],c=r[2],d=r[3],u={id:t+":"+o,css:i,media:c,sourceMap:d};n[s]?n[s].parts.push(u):a.push(n[s]={id:s,parts:[u]})}return a}}])});
\ No newline at end of file

M index.html => index.html +2 -3
@@ 141,15 141,14 @@
          <h2 id="demo">Demo!</h2>

          <div id="demo-app">
            Pick a date: <date-time-picker />
            Pick a date: <date-time-picker v-model='date'></date-time-picker>
          </div>

          <script>
          var app = new Vue({
            el: '#demo-app',
            components: { dateTimePicker: vuedt.default },
            data: {
            }
            data: { date: new Date() }
          })
          </script>


M package.json => package.json +1 -1
@@ 1,7 1,7 @@
{
  "name": "vuedt",
  "description": "crazy lightweight Vuejs Date and Time picker component",
  "version": "0.1.4",
  "version": "0.2.0",
  "author": "koehr <n@koehr.in>",
  "main": "./dist/index.js",
  "scripts": {

M src/VuedtClock.vue => src/VuedtClock.vue +12 -11
@@ 14,10 14,10 @@
      </div>

      <div class="inner_face">
        <div class="am-pm">
        <div class="am-pm" @click.stop="ampm()">
          <div class="wrap" :class="{ pm }">
            <div class="label">AM</div>
            <div class="slider" @click.stop="ampm()"></div>
            <div class="slider"></div>
            <div class="label">PM</div>
          </div>
        </div>


@@ 60,6 60,7 @@ export default {
      this.pm = !this.pm
      if (this.pm) this.hour += 12
      else this.hour -= 12
      this.emitValue()
    },
    pad (n) {
      return `0${n}`.slice(-2)


@@ 73,24 74,24 @@ export default {
        return second ? (i+6) * 5 : i * 5
      }
    },
    setValue (n) {
      // sets this.(hour|minute|second) to value
      this[modes[this.mode]] = n
      this.mode = (this.mode + 1) % modes.length

      this.setHandles(this.hour, this.minute, this.second)

    emitValue () {
      // save the date
      const d = new Date(this.value)
      d.setHours(this.hour, this.minute, this.second, 0)

      this.$emit('input', d)
    },
    setValue (n) {
      if (this.pm && this.mode === 0) n += 12  // handle PM
      this[modes[this.mode]] = n     // sets this.(hour|minute|second) to value
      this.mode = (this.mode + 1) % modes.length
      this.setHandles(this.hour, this.minute, this.second)
      this.emitValue()
    },
    setHandles (h, m, s) {
      h = h !== undefined ? h : this.value.getHours()
      m = m !== undefined ? m : this.value.getMinutes()
      s = s !== undefined ? s : this.value.getSeconds()
      const hourInDeg =   h / 12 * 360
      const hourInDeg = (h % 12) / 12 * 360
      const minuteInDeg = m / 60 * 360
      const secondInDeg = s / 60 * 360