vuejs-countdown-timer
Advanced tools
Comparing version 2.1.2 to 2.1.3
# Changelog | ||
## 2.1.3 (Oct 012, 2020) | ||
### Bug fixes 🐛 | ||
- Fixed the time convert browser compatibility issue [#12](https://github.com/TriDiamond/vuejs-countdown-timer/issues/12) | ||
## 2.1.2 (Oct 07, 2019) | ||
### Bug fixes 🐛 | ||
- Fixed reenter the active window current time is not recalculated. | ||
@@ -9,3 +17,5 @@ - Fixed event ended-callback triggered on vue mounted. | ||
## 2.1.1 (Feb 22, 2019) | ||
### Changes 🙌 | ||
- Changed the hiding logic of 00s, only hide if all previous units are hidden. | ||
@@ -15,3 +25,5 @@ - Changed the modification of the prop value, to avoid props changes in methods. | ||
## 2.1.0 (Feb 22, 2019) | ||
#### Features ✨ | ||
- Added the ability to auto hide when each unit's time reaches zero | ||
@@ -21,6 +33,7 @@ - Added the ability to complete hide certain units | ||
#### Bug fixes 🐛 | ||
- Fixed timestamp input for start time and end time not working | ||
## 2.0.3 (Sep 30, 2018) | ||
## 2.0.3 (Sep 30, 2018) | ||
- Day won't be hidden even day is 00 | ||
@@ -31,5 +44,7 @@ - Changed the props value injected for slot `countdown` | ||
## 2.0.2 (Sep 10, 2018) | ||
- Added timestamp conversion, if timestamp is less than 14digits, will automatically add 000 to the end. | ||
## 2.0.1 (Sep 4, 2018) | ||
- Removed console.logs | ||
@@ -62,3 +77,3 @@ - Added demo link to documents | ||
- Fixed props failed to receive | ||
- Fixed template missing text | ||
- Fixed template missing text | ||
- Add custom template feature |
@@ -1,1 +0,1 @@ | ||
!function(t,e){"object"==typeof exports&&"object"==typeof module?module.exports=e():"function"==typeof define&&define.amd?define("VueCountdownTimer",[],e):"object"==typeof exports?exports.VueCountdownTimer=e():t.VueCountdownTimer=e()}(window,function(){return function(t){var e={};function n(i){if(e[i])return e[i].exports;var s=e[i]={i:i,l:!1,exports:{}};return t[i].call(s.exports,s,s.exports,n),s.l=!0,s.exports}return n.m=t,n.c=e,n.d=function(t,e,i){n.o(t,e)||Object.defineProperty(t,e,{enumerable:!0,get:i})},n.r=function(t){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(t,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(t,"__esModule",{value:!0})},n.t=function(t,e){if(1&e&&(t=n(t)),8&e)return t;if(4&e&&"object"==typeof t&&t&&t.__esModule)return t;var i=Object.create(null);if(n.r(i),Object.defineProperty(i,"default",{enumerable:!0,value:t}),2&e&&"string"!=typeof t)for(var s in t)n.d(i,s,function(e){return t[e]}.bind(null,s));return i},n.n=function(t){var e=t&&t.__esModule?function(){return t.default}:function(){return t};return n.d(e,"a",e),e},n.o=function(t,e){return Object.prototype.hasOwnProperty.call(t,e)},n.p="",n(n.s=1)}([function(t,e,n){"use strict";Object.defineProperty(e,"__esModule",{value:!0}),e.default=function(t,e){for(var n=[],i={},s=0;s<e.length;s++){var r=e[s],o=r[0],u=r[1],a=r[2],c=r[3],h={id:t+":"+s,css:u,media:a,sourceMap:c};i[o]?i[o].parts.push(h):n.push(i[o]={id:o,parts:[h]})}return n}},function(t,e,n){"use strict";Object.defineProperty(e,"__esModule",{value:!0});var i=function(t){return t&&t.__esModule?t:{default:t}}(n(6));var s={install:function(t,e){t.component("VueCountdownTimer",{mixins:[i.default],props:{startLabel:{type:String,default:""},endLabel:{type:String,default:""},labelPosition:{type:String,default:"begin"},interval:{type:Number,default:function(){return 1e3}},leadingZero:{type:Boolean,default:function(){return!0}},showZero:{type:Boolean,default:function(){return!0}},startTime:{type:Number|String},endTime:{type:Number|String},endText:{type:String,default:function(){return"Event ended!"}},dayTxt:{type:null|String,default:function(){return":"}},hourTxt:{type:null|String,default:function(){return":"}},minutesTxt:{type:null|String,default:function(){return":"}},secondsTxt:{type:String,default:function(){return":"}},secondsFixed:{type:Boolean,default:function(){return!1}}},data:function(){return{tips:!0,current:"",count:0,counting:!1,showDay:!0,showHour:!0,showMinute:!0}},computed:{days:function(){return this.preprocess(Math.floor(this.count/864e5))},hours:function(){var t=Math.floor(this.count%864e5/36e5);return this.dayTxt||(t+=24*Math.floor(this.count/864e5)),this.preprocess(t)},minutes:function(){var t=Math.floor(this.count%36e5/6e4);if(!this.hourTxt){var e=Math.floor(this.count/864e5);t+=60*Math.floor(this.count%864e5/36e5),this.dayTxt||(t+=24*e*60)}return this.preprocess(t)},seconds:function(){var t=this.interval,e=this.count%6e4/1e3;this.minutesTxt||(e+=60*Math.floor(this.count%36e5/6e4),this.hourTxt||(e+=60*Math.floor(this.count%864e5/36e5)*60,this.dayTxt||(e+=24*Math.floor(this.count/864e5)*60*60)));return t<10?this.preprocess(parseFloat(e.toFixed(3))):t>=10&&t<100?this.preprocess(parseFloat(e.toFixed(2))):t>=100&&t<1e3?this.preprocess(parseFloat(e.toFixed(1))):this.preprocess(Math.floor(e))},status:function(){return this.current>new Date(this.formatTime(this.endTime)).getTime()?0:this.current<new Date(this.formatTime(this.startTime)).getTime()?1:this.current>=new Date(this.formatTime(this.startTime)).getTime()&&this.current<new Date(this.formatTime(this.endTime)).getTime()?2:void 0}},methods:{init:function(){var t=this;this.dayTxt||(this.showDay=!1),this.hourTxt||(this.showHour=!1),this.minutesTxt||(this.showMinute=!1),this.stop(),this.$set(this,"current",(new Date).getTime());var e=new Date(this.formatTime(this.startTime)).getTime()-this.current,n=new Date(this.formatTime(this.endTime)).getTime()-this.current,i=this.status;if(0===i)return this.count=0,void this.end_message();1===i&&(this.$set(this,"tips",!0),this.count=Math.max(0,e)),2===i&&(this.$set(this,"tips",!1),this.$emit("start_callback",i),this.count=Math.max(0,n)),0!==this.count?this.$nextTick(function(){t.start()}):this.end_message()},start:function(){this.counting||(this.counting=!0,this.next())},next:function(){this.timeout=setTimeout(this.step.bind(this),this.interval)},step:function(){this.counting&&(this.count>this.interval?(this.showZero||(0===Number(this.days)&&(this.showDay=!1),this.showDay||0!==Number(this.hours)||(this.showHour=!1),this.showHour||0!==Number(this.minutes)||(this.showMinute=!1)),this.count-=this.interval,this.next()):(this.count=0,this.init()))},stop:function(){this.counting=!1,clearTimeout(this.timeout),this.timeout=void 0},start_message:function(){this.$set(this,"tips",!1),this.$emit("start_callback",this.status)},end_message:function(){this.currentTime<=0||this.currentTime<new Date(this.formatTime(this.endTime)).getTime()||this.$emit("end_callback",this.status)},formatTime:function(t){return"number"==typeof t&&10===t.toString().length?1e3*t:t},preprocess:function(t){return this.leadingZero&&t<10?"0"+t:t},update:function(){if(this.counting){this.$set(this,"current",(new Date).getTime());var t=new Date(this.formatTime(this.startTime)).getTime()-this.current,e=new Date(this.formatTime(this.endTime)).getTime()-this.current,n=this.status;if(0===n)return this.count=0,this.stop(),void this.end_message();1===n&&(this.$set(this,"tips",!0),this.count=Math.max(0,t)),2===n&&(this.$set(this,"tips",!1),this.$emit("start_callback",this.status),this.count=Math.max(0,e))}}},watch:{startTime:function(){this.init()},endTime:function(){this.init()}},created:function(){this.init()},mounted:function(){window.addEventListener("focus",this.onFocus=this.update.bind(this))},beforeDestroy:function(){window.removeEventListener("focus",this.onFocus),clearTimeout(this.timeout)}})}};"undefined"!=typeof window&&window.Vue&&window.Vue.use(s),e.default=s},function(t,e,n){var i=n(3);"string"==typeof i&&(i=[[t.i,i,""]]),i.locals&&(t.exports=i.locals);(0,n(5).default)("3f71a86a",i,!0,{})},function(t,e,n){(t.exports=n(4)(!1)).push([t.i,"",""])},function(t,e,n){"use strict";t.exports=function(t){var e=[];return e.toString=function(){return this.map(function(e){var n=function(t,e){var n=t[1]||"",i=t[3];if(!i)return n;if(e&&"function"==typeof btoa){var s=function(t){return"/*# sourceMappingURL=data:application/json;charset=utf-8;base64,"+btoa(unescape(encodeURIComponent(JSON.stringify(t))))+" */"}(i),r=i.sources.map(function(t){return"/*# sourceURL="+i.sourceRoot+t+" */"});return[n].concat(r).concat([s]).join("\n")}return[n].join("\n")}(e,t);return e[2]?"@media "+e[2]+"{"+n+"}":n}).join("")},e.i=function(t,n){"string"==typeof t&&(t=[[null,t,""]]);for(var i={},s=0;s<this.length;s++){var r=this[s][0];"number"==typeof r&&(i[r]=!0)}for(s=0;s<t.length;s++){var o=t[s];"number"==typeof o[0]&&i[o[0]]||(n&&!o[2]?o[2]=n:n&&(o[2]="("+o[2]+") and ("+n+")"),e.push(o))}},e}},function(t,e,n){"use strict";n.r(e),n.d(e,"default",function(){return m});var i=n(0),s=n.n(i),r="undefined"!=typeof document;if("undefined"!=typeof DEBUG&&DEBUG&&!r)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 o={},u=r&&(document.head||document.getElementsByTagName("head")[0]),a=null,c=0,h=!1,d=function(){},f=null,l="data-vue-ssr-id",p="undefined"!=typeof navigator&&/msie [6-9]\b/.test(navigator.userAgent.toLowerCase());function m(t,e,n,i){h=n,f=i||{};var r=s()(t,e);return v(r),function(e){for(var n=[],i=0;i<r.length;i++){var u=r[i];(a=o[u.id]).refs--,n.push(a)}e?v(r=s()(t,e)):r=[];for(i=0;i<n.length;i++){var a;if(0===(a=n[i]).refs){for(var c=0;c<a.parts.length;c++)a.parts[c]();delete o[a.id]}}}}function v(t){for(var e=0;e<t.length;e++){var n=t[e],i=o[n.id];if(i){i.refs++;for(var s=0;s<i.parts.length;s++)i.parts[s](n.parts[s]);for(;s<n.parts.length;s++)i.parts.push(T(n.parts[s]));i.parts.length>n.parts.length&&(i.parts.length=n.parts.length)}else{var r=[];for(s=0;s<n.parts.length;s++)r.push(T(n.parts[s]));o[n.id]={id:n.id,refs:1,parts:r}}}}function _(){var t=document.createElement("style");return t.type="text/css",u.appendChild(t),t}function T(t){var e,n,i=document.querySelector("style["+l+'~="'+t.id+'"]');if(i){if(h)return d;i.parentNode.removeChild(i)}if(p){var s=c++;i=a||(a=_()),e=y.bind(null,i,s,!1),n=y.bind(null,i,s,!0)}else i=_(),e=function(t,e){var n=e.css,i=e.media,s=e.sourceMap;i&&t.setAttribute("media",i);f.ssrId&&t.setAttribute(l,e.id);s&&(n+="\n/*# sourceURL="+s.sources[0]+" */",n+="\n/*# sourceMappingURL=data:application/json;base64,"+btoa(unescape(encodeURIComponent(JSON.stringify(s))))+" */");if(t.styleSheet)t.styleSheet.cssText=n;else{for(;t.firstChild;)t.removeChild(t.firstChild);t.appendChild(document.createTextNode(n))}}.bind(null,i),n=function(){i.parentNode.removeChild(i)};return e(t),function(i){if(i){if(i.css===t.css&&i.media===t.media&&i.sourceMap===t.sourceMap)return;e(t=i)}else n()}}var b=function(){var t=[];return function(e,n){return t[e]=n,t.filter(Boolean).join("\n")}}();function y(t,e,n,i){var s=n?"":i.css;if(t.styleSheet)t.styleSheet.cssText=b(e,s);else{var r=document.createTextNode(s),o=t.childNodes;o[e]&&t.removeChild(o[e]),o.length?t.insertBefore(r,o[e]):t.appendChild(r)}}},function(t,e,n){"use strict";n.r(e);var i=function(t,e,n,i,s,r,o,u){var a=typeof(t=t||{}).default;"object"!==a&&"function"!==a||(t=t.default);var c,h="function"==typeof t?t.options:t;if(e&&(h.render=e,h.staticRenderFns=n,h._compiled=!0),i&&(h.functional=!0),r&&(h._scopeId=r),o?(c=function(t){(t=t||this.$vnode&&this.$vnode.ssrContext||this.parent&&this.parent.$vnode&&this.parent.$vnode.ssrContext)||"undefined"==typeof __VUE_SSR_CONTEXT__||(t=__VUE_SSR_CONTEXT__),s&&s.call(this,t),t&&t._registeredComponents&&t._registeredComponents.add(o)},h._ssrRegister=c):s&&(c=u?function(){s.call(this,this.$root.$options.shadowRoot)}:s),c)if(h.functional){h._injectStyles=c;var d=h.render;h.render=function(t,e){return c.call(e),d(t,e)}}else{var f=h.beforeCreate;h.beforeCreate=f?[].concat(f,c):[c]}return{exports:t,options:h}}(null,function(){var t=this,e=t.$createElement,n=t._self._c||e;return n("div",[t.status>0?t._t("start-label",[""!==t.startLabel&&t.tips&&"begin"===t.labelPosition?n("span",[t._v(t._s(t.startLabel)+":")]):t._e(),t._v(" "),""===t.endLabel||t.tips||"begin"!==t.labelPosition?t._e():n("span",[t._v(t._s(t.endLabel)+":")])],{props:{tips:t.tips,startLabel:t.startLabel,endLabel:t.endLabel,labelPosition:t.labelPosition}}):t._e(),t._v(" "),t.status>0?t._t("countdown",[t.showDay?n("span",[t._v(t._s(t.days))]):t._e(),t._v(" "),t.showDay?n("i",[t._v(t._s(t.dayTxt))]):t._e(),t._v(" "),t.showHour?n("span",[t._v(t._s(t.hours))]):t._e(),t._v(" "),t.showHour?n("i",[t._v(t._s(t.hourTxt))]):t._e(),t._v(" "),t.showMinute?n("span",[t._v(t._s(t.minutes))]):t._e(),t._v(" "),t.showMinute?n("i",[t._v(t._s(t.minutesTxt))]):t._e(),t._v(" "),n("span",[t._v(t._s(t.seconds))]),t._v(" "),t.secondsTxt?n("i",[t._v(t._s(t.secondsTxt))]):t._e()],{props:{status:t.status,days:t.days,hours:t.hours,minutes:t.minutes,seconds:t.seconds,dayTxt:t.dayTxt,hourTxt:t.hourTxt,minutesTxt:t.minutesTxt,secondsTxt:t.secondsTxt,showDay:t.showDay,showHour:t.showHour,showMinute:t.showMinute}}):t._e(),t._v(" "),t.status>0?t._t("end-label",[""!==t.startLabel&&t.tips&&"end"===t.labelPosition?n("span",[t._v(t._s(t.startLabel)+":")]):t._e(),t._v(" "),""===t.endLabel||t.tips||"end"!==t.labelPosition?t._e():n("span",[t._v(t._s(t.endLabel)+":")])],{props:{tips:t.tips,startLabel:t.startLabel,endLabel:t.endLabel,labelPosition:t.labelPosition}}):t._e(),t._v(" "),t.status<=0?t._t("end-text",[t._v("\n "+t._s(t.endText)+"\n ")],{props:{endText:t.endText}}):t._e()],2)},[],!1,function(t){n(2)},"data-v-7c035809",null);e.default=i.exports}])}); | ||
!function(t,e){"object"==typeof exports&&"object"==typeof module?module.exports=e():"function"==typeof define&&define.amd?define("VueCountdownTimer",[],e):"object"==typeof exports?exports.VueCountdownTimer=e():t.VueCountdownTimer=e()}(window,function(){return function(t){var e={};function n(s){if(e[s])return e[s].exports;var i=e[s]={i:s,l:!1,exports:{}};return t[s].call(i.exports,i,i.exports,n),i.l=!0,i.exports}return n.m=t,n.c=e,n.d=function(t,e,s){n.o(t,e)||Object.defineProperty(t,e,{enumerable:!0,get:s})},n.r=function(t){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(t,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(t,"__esModule",{value:!0})},n.t=function(t,e){if(1&e&&(t=n(t)),8&e)return t;if(4&e&&"object"==typeof t&&t&&t.__esModule)return t;var s=Object.create(null);if(n.r(s),Object.defineProperty(s,"default",{enumerable:!0,value:t}),2&e&&"string"!=typeof t)for(var i in t)n.d(s,i,function(e){return t[e]}.bind(null,i));return s},n.n=function(t){var e=t&&t.__esModule?function(){return t.default}:function(){return t};return n.d(e,"a",e),e},n.o=function(t,e){return Object.prototype.hasOwnProperty.call(t,e)},n.p="",n(n.s=1)}([function(t,e,n){"use strict";Object.defineProperty(e,"__esModule",{value:!0}),e.default=function(t,e){for(var n=[],s={},i=0;i<e.length;i++){var r=e[i],o=r[0],u=r[1],a=r[2],c=r[3],h={id:t+":"+i,css:u,media:a,sourceMap:c};s[o]?s[o].parts.push(h):n.push(s[o]={id:o,parts:[h]})}return n}},function(t,e,n){"use strict";Object.defineProperty(e,"__esModule",{value:!0});var s=function(t){return t&&t.__esModule?t:{default:t}}(n(6));var i={install:function(t,e){t.component("VueCountdownTimer",{mixins:[s.default],props:{startLabel:{type:String,default:""},endLabel:{type:String,default:""},labelPosition:{type:String,default:"begin"},interval:{type:Number,default:function(){return 1e3}},leadingZero:{type:Boolean,default:function(){return!0}},showZero:{type:Boolean,default:function(){return!0}},startTime:{type:Number|String},endTime:{type:Number|String},endText:{type:String,default:function(){return"Event ended!"}},dayTxt:{type:null|String,default:function(){return":"}},hourTxt:{type:null|String,default:function(){return":"}},minutesTxt:{type:null|String,default:function(){return":"}},secondsTxt:{type:String,default:function(){return":"}},secondsFixed:{type:Boolean,default:function(){return!1}}},data:function(){return{tips:!0,current:"",count:0,counting:!1,showDay:!0,showHour:!0,showMinute:!0}},computed:{days:function(){return this.preprocess(Math.floor(this.count/864e5))},hours:function(){var t=Math.floor(this.count%864e5/36e5);return this.dayTxt||(t+=24*Math.floor(this.count/864e5)),this.preprocess(t)},minutes:function(){var t=Math.floor(this.count%36e5/6e4);if(!this.hourTxt){var e=Math.floor(this.count/864e5);t+=60*Math.floor(this.count%864e5/36e5),this.dayTxt||(t+=24*e*60)}return this.preprocess(t)},seconds:function(){var t=this.interval,e=this.count%6e4/1e3;this.minutesTxt||(e+=60*Math.floor(this.count%36e5/6e4),this.hourTxt||(e+=60*Math.floor(this.count%864e5/36e5)*60,this.dayTxt||(e+=24*Math.floor(this.count/864e5)*60*60)));return t<10?this.preprocess(parseFloat(e.toFixed(3))):t>=10&&t<100?this.preprocess(parseFloat(e.toFixed(2))):t>=100&&t<1e3?this.preprocess(parseFloat(e.toFixed(1))):this.preprocess(Math.floor(e))},status:function(){return this.current>this.getTime(this.endTime)?0:this.current<this.getTime(this.startTime)?1:this.current>=this.getTime(this.startTime)&&this.current<this.getTime(this.endTime)?2:void 0}},methods:{init:function(){var t=this;this.dayTxt||(this.showDay=!1),this.hourTxt||(this.showHour=!1),this.minutesTxt||(this.showMinute=!1),this.stop(),this.$set(this,"current",(new Date).getTime());var e=this.getTime(this.startTime)-this.current,n=this.getTime(this.endTime)-this.current,s=this.status;if(0===s)return this.count=0,void this.end_message();1===s&&(this.$set(this,"tips",!0),this.count=Math.max(0,e)),2===s&&(this.$set(this,"tips",!1),this.$emit("start_callback",s),this.count=Math.max(0,n)),0!==this.count?this.$nextTick(function(){t.start()}):this.end_message()},start:function(){this.counting||(this.counting=!0,this.next())},next:function(){this.timeout=setTimeout(this.step.bind(this),this.interval)},step:function(){this.counting&&(this.count>this.interval?(this.showZero||(0===Number(this.days)&&(this.showDay=!1),this.showDay||0!==Number(this.hours)||(this.showHour=!1),this.showHour||0!==Number(this.minutes)||(this.showMinute=!1)),this.count-=this.interval,this.next()):(this.count=0,this.init()))},stop:function(){this.counting=!1,clearTimeout(this.timeout),this.timeout=void 0},start_message:function(){this.$set(this,"tips",!1),this.$emit("start_callback",this.status)},end_message:function(){this.currentTime<=0||this.currentTime<this.getTime(this.endTime)||this.$emit("end_callback",this.status)},getTime:function(t){return"number"==typeof t&&10===t.toString().length&&(t*=1e3),String(t).match(/[\d]+-[\d]+-[\d]+/g)&&(t=t.replace(/-/g,"/")),new Date(t).getTime()},preprocess:function(t){return this.leadingZero&&t<10?"0"+t:t},update:function(){if(this.counting){this.$set(this,"current",(new Date).getTime());var t=this.getTime(this.startTime)-this.current,e=this.getTime(this.endTime)-this.current,n=this.status;if(0===n)return this.count=0,this.stop(),void this.end_message();1===n&&(this.$set(this,"tips",!0),this.count=Math.max(0,t)),2===n&&(this.$set(this,"tips",!1),this.$emit("start_callback",this.status),this.count=Math.max(0,e))}}},watch:{startTime:function(){this.init()},endTime:function(){this.init()}},created:function(){this.init()},mounted:function(){window.addEventListener("focus",this.onFocus=this.update.bind(this))},beforeDestroy:function(){window.removeEventListener("focus",this.onFocus),clearTimeout(this.timeout)}})}};"undefined"!=typeof window&&window.Vue&&window.Vue.use(i),e.default=i},function(t,e,n){var s=n(3);"string"==typeof s&&(s=[[t.i,s,""]]),s.locals&&(t.exports=s.locals);(0,n(5).default)("3f71a86a",s,!0,{})},function(t,e,n){(t.exports=n(4)(!1)).push([t.i,"",""])},function(t,e,n){"use strict";t.exports=function(t){var e=[];return e.toString=function(){return this.map(function(e){var n=function(t,e){var n=t[1]||"",s=t[3];if(!s)return n;if(e&&"function"==typeof btoa){var i=function(t){return"/*# sourceMappingURL=data:application/json;charset=utf-8;base64,"+btoa(unescape(encodeURIComponent(JSON.stringify(t))))+" */"}(s),r=s.sources.map(function(t){return"/*# sourceURL="+s.sourceRoot+t+" */"});return[n].concat(r).concat([i]).join("\n")}return[n].join("\n")}(e,t);return e[2]?"@media "+e[2]+"{"+n+"}":n}).join("")},e.i=function(t,n){"string"==typeof t&&(t=[[null,t,""]]);for(var s={},i=0;i<this.length;i++){var r=this[i][0];"number"==typeof r&&(s[r]=!0)}for(i=0;i<t.length;i++){var o=t[i];"number"==typeof o[0]&&s[o[0]]||(n&&!o[2]?o[2]=n:n&&(o[2]="("+o[2]+") and ("+n+")"),e.push(o))}},e}},function(t,e,n){"use strict";n.r(e),n.d(e,"default",function(){return m});var s=n(0),i=n.n(s),r="undefined"!=typeof document;if("undefined"!=typeof DEBUG&&DEBUG&&!r)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 o={},u=r&&(document.head||document.getElementsByTagName("head")[0]),a=null,c=0,h=!1,d=function(){},l=null,f="data-vue-ssr-id",p="undefined"!=typeof navigator&&/msie [6-9]\b/.test(navigator.userAgent.toLowerCase());function m(t,e,n,s){h=n,l=s||{};var r=i()(t,e);return v(r),function(e){for(var n=[],s=0;s<r.length;s++){var u=r[s];(a=o[u.id]).refs--,n.push(a)}e?v(r=i()(t,e)):r=[];for(s=0;s<n.length;s++){var a;if(0===(a=n[s]).refs){for(var c=0;c<a.parts.length;c++)a.parts[c]();delete o[a.id]}}}}function v(t){for(var e=0;e<t.length;e++){var n=t[e],s=o[n.id];if(s){s.refs++;for(var i=0;i<s.parts.length;i++)s.parts[i](n.parts[i]);for(;i<n.parts.length;i++)s.parts.push(b(n.parts[i]));s.parts.length>n.parts.length&&(s.parts.length=n.parts.length)}else{var r=[];for(i=0;i<n.parts.length;i++)r.push(b(n.parts[i]));o[n.id]={id:n.id,refs:1,parts:r}}}}function _(){var t=document.createElement("style");return t.type="text/css",u.appendChild(t),t}function b(t){var e,n,s=document.querySelector("style["+f+'~="'+t.id+'"]');if(s){if(h)return d;s.parentNode.removeChild(s)}if(p){var i=c++;s=a||(a=_()),e=y.bind(null,s,i,!1),n=y.bind(null,s,i,!0)}else s=_(),e=function(t,e){var n=e.css,s=e.media,i=e.sourceMap;s&&t.setAttribute("media",s);l.ssrId&&t.setAttribute(f,e.id);i&&(n+="\n/*# sourceURL="+i.sources[0]+" */",n+="\n/*# sourceMappingURL=data:application/json;base64,"+btoa(unescape(encodeURIComponent(JSON.stringify(i))))+" */");if(t.styleSheet)t.styleSheet.cssText=n;else{for(;t.firstChild;)t.removeChild(t.firstChild);t.appendChild(document.createTextNode(n))}}.bind(null,s),n=function(){s.parentNode.removeChild(s)};return e(t),function(s){if(s){if(s.css===t.css&&s.media===t.media&&s.sourceMap===t.sourceMap)return;e(t=s)}else n()}}var g=function(){var t=[];return function(e,n){return t[e]=n,t.filter(Boolean).join("\n")}}();function y(t,e,n,s){var i=n?"":s.css;if(t.styleSheet)t.styleSheet.cssText=g(e,i);else{var r=document.createTextNode(i),o=t.childNodes;o[e]&&t.removeChild(o[e]),o.length?t.insertBefore(r,o[e]):t.appendChild(r)}}},function(t,e,n){"use strict";n.r(e);var s=function(t,e,n,s,i,r,o,u){var a=typeof(t=t||{}).default;"object"!==a&&"function"!==a||(t=t.default);var c,h="function"==typeof t?t.options:t;if(e&&(h.render=e,h.staticRenderFns=n,h._compiled=!0),s&&(h.functional=!0),r&&(h._scopeId=r),o?(c=function(t){(t=t||this.$vnode&&this.$vnode.ssrContext||this.parent&&this.parent.$vnode&&this.parent.$vnode.ssrContext)||"undefined"==typeof __VUE_SSR_CONTEXT__||(t=__VUE_SSR_CONTEXT__),i&&i.call(this,t),t&&t._registeredComponents&&t._registeredComponents.add(o)},h._ssrRegister=c):i&&(c=u?function(){i.call(this,this.$root.$options.shadowRoot)}:i),c)if(h.functional){h._injectStyles=c;var d=h.render;h.render=function(t,e){return c.call(e),d(t,e)}}else{var l=h.beforeCreate;h.beforeCreate=l?[].concat(l,c):[c]}return{exports:t,options:h}}(null,function(){var t=this,e=t.$createElement,n=t._self._c||e;return n("div",[t.status>0?t._t("start-label",[""!==t.startLabel&&t.tips&&"begin"===t.labelPosition?n("span",[t._v(t._s(t.startLabel)+":")]):t._e(),t._v(" "),""===t.endLabel||t.tips||"begin"!==t.labelPosition?t._e():n("span",[t._v(t._s(t.endLabel)+":")])],{props:{tips:t.tips,startLabel:t.startLabel,endLabel:t.endLabel,labelPosition:t.labelPosition}}):t._e(),t._v(" "),t.status>0?t._t("countdown",[t.showDay?n("span",[t._v(t._s(t.days))]):t._e(),t._v(" "),t.showDay?n("i",[t._v(t._s(t.dayTxt))]):t._e(),t._v(" "),t.showHour?n("span",[t._v(t._s(t.hours))]):t._e(),t._v(" "),t.showHour?n("i",[t._v(t._s(t.hourTxt))]):t._e(),t._v(" "),t.showMinute?n("span",[t._v(t._s(t.minutes))]):t._e(),t._v(" "),t.showMinute?n("i",[t._v(t._s(t.minutesTxt))]):t._e(),t._v(" "),n("span",[t._v(t._s(t.seconds))]),t._v(" "),t.secondsTxt?n("i",[t._v(t._s(t.secondsTxt))]):t._e()],{props:{status:t.status,days:t.days,hours:t.hours,minutes:t.minutes,seconds:t.seconds,dayTxt:t.dayTxt,hourTxt:t.hourTxt,minutesTxt:t.minutesTxt,secondsTxt:t.secondsTxt,showDay:t.showDay,showHour:t.showHour,showMinute:t.showMinute}}):t._e(),t._v(" "),t.status>0?t._t("end-label",[""!==t.startLabel&&t.tips&&"end"===t.labelPosition?n("span",[t._v(t._s(t.startLabel)+":")]):t._e(),t._v(" "),""===t.endLabel||t.tips||"end"!==t.labelPosition?t._e():n("span",[t._v(t._s(t.endLabel)+":")])],{props:{tips:t.tips,startLabel:t.startLabel,endLabel:t.endLabel,labelPosition:t.labelPosition}}):t._e(),t._v(" "),t.status<=0?t._t("end-text",[t._v("\n "+t._s(t.endText)+"\n ")],{props:{endText:t.endText}}):t._e()],2)},[],!1,function(t){n(2)},"data-v-7c035809",null);e.default=s.exports}])}); |
{ | ||
"name": "vuejs-countdown-timer", | ||
"version": "2.1.2", | ||
"version": "2.1.3", | ||
"description": "Vue 2 countdown and timer component", | ||
@@ -5,0 +5,0 @@ "main": "/dist/vuejs-countdown-timer.min.js", |
206
README.md
@@ -1,30 +0,36 @@ | ||
# Vue-countdown-timer Component | ||
<p align="center"><a href="https://tridiamond.tech" target="_blank" rel="noopener noreferrer"><img width="100" src="https://img-blog.csdnimg.cn/20200930013332450.png" alt="TriDiamond logo"></a></p> | ||
<p> | ||
<a href="https://circleci.com/gh/TriDiamond/vuejs-countdown-timer/tree/master"> | ||
<img src="https://img.shields.io/circleci/project/github/TriDiamond/vuejs-countdown-timer.svg" alt="Build Status"> | ||
</a> | ||
<a href="https://github.com/TriDiamond/vuejs-countdown-timer/stargazers"> | ||
<img src="https://img.shields.io/github/stars/TriDiamond/vuejs-countdown-timer.svg" alt="Github starts"> | ||
</a> | ||
<a> | ||
<img src="https://img.shields.io/github/license/TriDiamond/vuejs-countdown-timer.svg" alt="License"> | ||
</a> | ||
<a href="https://www.npmjs.com/package/vuejs-countdown-timer"> | ||
<img src="https://img.shields.io/npm/dt/vuejs-countdown-timer.svg" alt="Npm downloads"> | ||
</a> | ||
<a> | ||
<img src="https://img.shields.io/npm/v/vuejs-countdown-timer.svg" alt="Npm version"> | ||
</a> | ||
</p> | ||
<h1 align="center">Vue-countdown-timer Component</h1> | ||
> 一 Vue 2 countdown and timer component | ||
<div align="center"> | ||
<p>Vue 2 countdown and timer component <br> | ||
—— Made with ❤️ by <a href="https://github.com/TriDiamond">TriDiamond</a></p> | ||
<p align="center"> | ||
<a href="https://circleci.com/gh/TriDiamond/vuejs-countdown-timer/tree/master"> | ||
<img src="https://img.shields.io/circleci/project/github/TriDiamond/vuejs-countdown-timer.svg" alt="Build Status"> | ||
</a> | ||
<a href="https://github.com/TriDiamond/vuejs-countdown-timer/stargazers"> | ||
<img src="https://img.shields.io/github/stars/TriDiamond/vuejs-countdown-timer.svg" alt="Github starts"> | ||
</a> | ||
<a> | ||
<img src="https://img.shields.io/github/license/TriDiamond/vuejs-countdown-timer.svg" alt="License"> | ||
</a> | ||
<a href="https://www.npmjs.com/package/vuejs-countdown-timer"> | ||
<img src="https://img.shields.io/npm/dt/vuejs-countdown-timer.svg" alt="Npm downloads"> | ||
</a> | ||
<a> | ||
<img src="https://img.shields.io/npm/v/vuejs-countdown-timer.svg" alt="Npm version"> | ||
</a> | ||
</p> | ||
[Demo](https://tridiamond.github.io/vuejs-countdown-timer/) | ||
[📙中文文档](https://github.com/TriDiamond/vuejs-countdown-timer/blob/master/README_CN.md) | ||
[📙 中文文档](https://github.com/TriDiamond/vuejs-countdown-timer/blob/master/README_CN.md) | ||
[📙Changelog](https://github.com/TriDiamond/vuejs-countdown-timer/blob/master/CHANGELOG.md) | ||
</div> | ||
## Installation | ||
``` bash | ||
```bash | ||
npm i vuejs-countdown-timer -S | ||
@@ -38,6 +44,5 @@ ``` | ||
| Supported Package | Version | | ||
|-------------------|---------| | ||
| ----------------- | ------- | | ||
| Vue | 2.5+ | | ||
### Install component and Usage | ||
@@ -49,4 +54,4 @@ | ||
// global register at main.js | ||
import VueCountdownTimer from 'vuejs-countdown-timer' | ||
Vue.use(VueCountdownTimer) | ||
import VueCountdownTimer from 'vuejs-countdown-timer'; | ||
Vue.use(VueCountdownTimer); | ||
``` | ||
@@ -76,13 +81,13 @@ | ||
<script > | ||
export default { | ||
name: 'Timer', | ||
methods: { | ||
startCallBack: function (x) { | ||
console.log(x) | ||
}, | ||
endCallBack: function (x) { | ||
console.log(x) | ||
} | ||
} | ||
} | ||
export default { | ||
name: 'Timer', | ||
methods: { | ||
startCallBack: function(x) { | ||
console.log(x); | ||
}, | ||
endCallBack: function(x) { | ||
console.log(x); | ||
}, | ||
}, | ||
}; | ||
</script> | ||
@@ -92,2 +97,3 @@ ``` | ||
Vue Customized template | ||
```vue | ||
@@ -113,3 +119,3 @@ <template> | ||
</template> | ||
<template slot="countdown" slot-scope="scope"> | ||
@@ -121,3 +127,3 @@ <span>{{scope.props.days}}</span><i>{{scope.props.dayTxt}}</i> | ||
</template> | ||
<template slot="end-label" slot-scope="scope"> | ||
@@ -127,3 +133,3 @@ <span style="color: red" v-if="scope.props.startLabel !== '' && scope.props.tips && scope.props.labelPosition === 'end'">{{scope.props.startLabel}}:</span> | ||
</template> | ||
<template slot="end-text" slot-scope="scope"> | ||
@@ -136,13 +142,13 @@ <span style="color: green">{{ scope.props.endText}}</span> | ||
<script > | ||
export default { | ||
name: 'Timer', | ||
methods: { | ||
startCallBack: function (x) { | ||
console.log(x) | ||
}, | ||
endCallBack: function (x) { | ||
console.log(x) | ||
} | ||
} | ||
} | ||
export default { | ||
name: 'Timer', | ||
methods: { | ||
startCallBack: function(x) { | ||
console.log(x); | ||
}, | ||
endCallBack: function(x) { | ||
console.log(x); | ||
}, | ||
}, | ||
}; | ||
</script> | ||
@@ -152,48 +158,54 @@ ``` | ||
### Slots | ||
| Slot name | Description | | ||
|-------------------|-----------------------| | ||
| start-label | Timer start label | | ||
| countdown | Timer countdown label | | ||
| end-label | Timer end label | | ||
| end-text | Timer ended text | | ||
| Slot name | Description | | ||
| ----------- | --------------------- | | ||
| start-label | Timer start label | | ||
| countdown | Timer countdown label | | ||
| end-label | Timer end label | | ||
| end-text | Timer ended text | | ||
### `start-label` Scoped Slot | ||
| Slot scope name | Description | | ||
|-------------------|----------------------------------------------------------------------------| | ||
| startLabel | Event begin label text | | ||
| endLabel | Event end label text | | ||
| tips | Tips `true` means countdown till start, `false` means countdown till end | | ||
| labelPosition | event label position, `'begin'` or `'end'` | | ||
| Slot scope name | Description | | ||
| --------------- | ------------------------------------------------------------------------ | | ||
| startLabel | Event begin label text | | ||
| endLabel | Event end label text | | ||
| tips | Tips `true` means countdown till start, `false` means countdown till end | | ||
| labelPosition | event label position, `'begin'` or `'end'` | | ||
### `countdown` Scoped Slot | ||
| Slot scope name | Description | | ||
|-------------------|----------------------------------------------------------------------------| | ||
| days | Number of days till event | | ||
| dayTxt | Day label | | ||
| hours | Number of hours till event | | ||
| hourTxt | Hours label | | ||
| minutes | Number of minutes till event | | ||
| minuteTxt | Minutes label | | ||
| seconds | Number of seconds till event | | ||
| secondTxt | Seconds label | | ||
| showDay | display status of day countdown number and text | | ||
| showHour | display status of hour countdown number and text | | ||
| showMinute | display status of minute countdown number and text | | ||
| Slot scope name | Description | | ||
| --------------- | -------------------------------------------------- | | ||
| days | Number of days till event | | ||
| dayTxt | Day label | | ||
| hours | Number of hours till event | | ||
| hourTxt | Hours label | | ||
| minutes | Number of minutes till event | | ||
| minuteTxt | Minutes label | | ||
| seconds | Number of seconds till event | | ||
| secondTxt | Seconds label | | ||
| showDay | display status of day countdown number and text | | ||
| showHour | display status of hour countdown number and text | | ||
| showMinute | display status of minute countdown number and text | | ||
### `end-label` Scoped Slot | ||
| Slot scope name | Description | | ||
|-------------------|----------------------------------------------------------------------------| | ||
| startLabel | Event begin label text | | ||
| endLabel | Event end label text | | ||
| tips | Tips `true` means countdown till start, `false` means countdown till end | | ||
| labelPosition | event label position, `'begin'` or `'end'` | | ||
| Slot scope name | Description | | ||
| --------------- | ------------------------------------------------------------------------ | | ||
| startLabel | Event begin label text | | ||
| endLabel | Event end label text | | ||
| tips | Tips `true` means countdown till start, `false` means countdown till end | | ||
| labelPosition | event label position, `'begin'` or `'end'` | | ||
### `end-text` Scoped Slot | ||
| Slot scope name | Description | | ||
|-------------------|----------------------------------------------------------------------------| | ||
| endText | Timer ended text | | ||
| Slot scope name | Description | | ||
| --------------- | ---------------- | | ||
| endText | Timer ended text | | ||
### Props | ||
**start-time** | ||
- `type`: Number|String | ||
@@ -203,2 +215,3 @@ - `required` : true | ||
**end-time** | ||
- `type`: Number|String | ||
@@ -208,2 +221,3 @@ - `required` : true | ||
**interval** | ||
- `type`: Number | ||
@@ -214,2 +228,3 @@ - `required` : false | ||
**start-label** | ||
- `type`: String | ||
@@ -220,2 +235,3 @@ - `required` : false | ||
**end-label** | ||
- `type`: String | ||
@@ -226,7 +242,9 @@ - `required` : false | ||
**label-position** - begin (before countdown) / end (after countdown) | ||
- `type`: String | ||
- `required` : false | ||
- `default` : 'begin' | ||
**end-text** | ||
- `type`: String | ||
@@ -237,7 +255,9 @@ - `required` : false | ||
**day-txt** - if pass `null`, this unit will be hidden | ||
- `type`: String | ||
- `required` : false | ||
- `default` : ':' | ||
**hour-txt** - if pass `null`, this unit will be hidden | ||
- `type`: String | ||
@@ -248,2 +268,3 @@ - `required` : false | ||
**seconds-txt** - if pass `null`, this unit will be hidden | ||
- `type`: String | ||
@@ -254,2 +275,3 @@ - `required` : false | ||
**seconds-fixed** | ||
- `type`: String | ||
@@ -260,8 +282,11 @@ - `required` : false | ||
**show-zero** - display status of 00 | ||
- `type`: Boolean | ||
- `required` : false | ||
- `default` : true | ||
### Events | ||
**start_callback** - Event started callback | ||
- `type`: Function | ||
@@ -271,2 +296,3 @@ - `required` : false | ||
**end_callback** - Event ended callback | ||
- `type`: Function | ||
@@ -292,10 +318,8 @@ - `required` : false | ||
</script> | ||
``` | ||
Where `end_at` is the computed value, and `endAt` is a default value. | ||
# Liscense | ||
MIT License | ||
Copyright (c) 2018 TriDiamond |
306
25226