diff --git a/README.md b/README.md
index 1effbab..7d7b189 100644
--- a/README.md
+++ b/README.md
@@ -94,7 +94,7 @@ countdownBarInstance.pause()
### reset
-Reset count down.
+Reset count down. Accept a new time, defaults is `options.time`.
```ts
countdownBarInstance.reset()
diff --git a/lib/countdownbar.cjs b/lib/countdownbar.cjs
index d287509..0837e5b 100644
--- a/lib/countdownbar.cjs
+++ b/lib/countdownbar.cjs
@@ -1 +1 @@
-"use strict";var d=Object.defineProperty;var p=(i,t,n)=>t in i?d(i,t,{enumerable:!0,configurable:!0,writable:!0,value:n}):i[t]=n;var e=(i,t,n)=>(p(i,typeof t!="symbol"?t+"":t,n),n);Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const u=typeof window!="undefined";function m(i){return u?requestAnimationFrame(i):-1}function g(i){u&&cancelAnimationFrame(i)}const a=1e3,c=60*a,h=60*c,f=24*h;function T(i){const t=Math.floor(i/f),n=Math.floor(i%f/h),s=Math.floor(i%h/c),o=Math.floor(i%c/a),r=Math.floor(i%a);return{total:i,days:t,hours:n,minutes:s,seconds:o,milliseconds:r}}function M(i,t){return Math.floor(i/1e3)===Math.floor(t/1e3)}class l{constructor(t){e(this,"rafId",0);e(this,"endTime",0);e(this,"counting",!1);e(this,"remain",0);e(this,"options",{time:0,autoStart:!0});this.options=Object.assign(this.options,t),this.remain=this.options.time,this.options.autoStart&&this.start()}get current(){return T(this.remain)}getCurrentRemain(){return Math.max(this.endTime-Date.now(),0)}setRemain(t){var n,s,o,r;this.remain=t,(s=(n=this.options).onChange)==null||s.call(n,this.current),t===0&&(this.pause(),(r=(o=this.options).onFinish)==null||r.call(o)),this.render()}microTick(){this.rafId=m(()=>{this.counting&&(this.setRemain(this.getCurrentRemain()),this.remain>0&&this.microTick())})}macroTick(){this.rafId=m(()=>{if(this.counting){const t=this.getCurrentRemain();(!M(t,this.remain)||t===0)&&this.setRemain(t),this.remain>0&&this.macroTick()}})}tick(){u&&(this.options.millisecond?this.microTick():this.macroTick())}start(){this.counting||(this.endTime=Date.now()+this.remain,this.counting=!0,this.tick())}reset(t=this.options.time){this.pause(),this.remain=t}pause(){this.counting=!1,g(this.rafId)}generateHTML(){if(this.options.template)return this.options.template(this.current);let t=`${this.current.days}:${this.current.hours}:${this.current.minutes}:${this.current.seconds}`;return this.options.millisecond&&(t+=`:${this.current.milliseconds}`),`${t}`}getContainer(){return typeof this.options.container=="string"?document.querySelector(this.options.container):this.options.container}render(){const t=this.getContainer();t&&(t.innerHTML=`${this.generateHTML()}`)}}const C=i=>new l(i);exports.CountdownBar=l;exports.createCountdownBar=C;
+"use strict";var d=Object.defineProperty;var p=(i,t,n)=>t in i?d(i,t,{enumerable:!0,configurable:!0,writable:!0,value:n}):i[t]=n;var e=(i,t,n)=>(p(i,typeof t!="symbol"?t+"":t,n),n);Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const g=require("fourdom"),u=typeof window!="undefined";function m(i){return u?requestAnimationFrame(i):-1}function T(i){u&&cancelAnimationFrame(i)}const a=1e3,c=60*a,h=60*c,f=24*h;function M(i){const t=Math.floor(i/f),n=Math.floor(i%f/h),o=Math.floor(i%h/c),s=Math.floor(i%c/a),r=Math.floor(i%a);return{total:i,days:t,hours:n,minutes:o,seconds:s,milliseconds:r}}function C(i,t){return Math.floor(i/1e3)===Math.floor(t/1e3)}class l{constructor(t){e(this,"rafId",0);e(this,"endTime",0);e(this,"counting",!1);e(this,"remain",0);e(this,"options",{time:0,autoStart:!0,color:"#323233",fontSize:"14px"});this.options=Object.assign(this.options,t),this.remain=this.options.time,this.options.autoStart&&this.start()}get current(){return M(this.remain)}getCurrentRemain(){return Math.max(this.endTime-Date.now(),0)}setRemain(t){var n,o,s,r;this.remain=t,(o=(n=this.options).onChange)==null||o.call(n,this.current),t===0&&(this.pause(),(r=(s=this.options).onFinish)==null||r.call(s)),this.render()}microTick(){this.rafId=m(()=>{this.counting&&(this.setRemain(this.getCurrentRemain()),this.remain>0&&this.microTick())})}macroTick(){this.rafId=m(()=>{if(this.counting){const t=this.getCurrentRemain();(!C(t,this.remain)||t===0)&&this.setRemain(t),this.remain>0&&this.macroTick()}})}tick(){u&&(this.options.millisecond?this.microTick():this.macroTick())}start(){this.counting||(this.endTime=Date.now()+this.remain,this.counting=!0,this.tick())}reset(t=this.options.time){this.pause(),this.remain=t}pause(){this.counting=!1,T(this.rafId)}generateHTML(){if(this.options.template)return this.options.template(this.current);let t=`${this.current.days}:${this.current.hours}:${this.current.minutes}:${this.current.seconds}`;return this.options.millisecond&&(t+=`:${this.current.milliseconds}`),`${t}`}getContainer(){return typeof this.options.container=="string"?document.querySelector(this.options.container):this.options.container}render(){const t=this.getContainer();t&&(g.css(t,{"font-size":this.options.fontSize,color:this.options.color}),t.innerHTML=`${this.generateHTML()}`)}}const w=i=>new l(i);exports.CountdownBar=l;exports.createCountdownBar=w;
diff --git a/lib/countdownbar.js b/lib/countdownbar.js
index 60f7317..54e8681 100644
--- a/lib/countdownbar.js
+++ b/lib/countdownbar.js
@@ -1,49 +1,52 @@
-var l = Object.defineProperty;
-var p = (i, t, n) => t in i ? l(i, t, { enumerable: !0, configurable: !0, writable: !0, value: n }) : i[t] = n;
-var e = (i, t, n) => (p(i, typeof t != "symbol" ? t + "" : t, n), n);
+var p = Object.defineProperty;
+var l = (i, t, n) => t in i ? p(i, t, { enumerable: !0, configurable: !0, writable: !0, value: n }) : i[t] = n;
+var s = (i, t, n) => (l(i, typeof t != "symbol" ? t + "" : t, n), n);
+import { css as d } from "fourdom";
const u = typeof window != "undefined";
function m(i) {
return u ? requestAnimationFrame(i) : -1;
}
-function d(i) {
+function g(i) {
u && cancelAnimationFrame(i);
}
const a = 1e3, c = 60 * a, h = 60 * c, f = 24 * h;
-function g(i) {
- const t = Math.floor(i / f), n = Math.floor(i % f / h), s = Math.floor(i % h / c), o = Math.floor(i % c / a), r = Math.floor(i % a);
+function T(i) {
+ const t = Math.floor(i / f), n = Math.floor(i % f / h), e = Math.floor(i % h / c), o = Math.floor(i % c / a), r = Math.floor(i % a);
return {
total: i,
days: t,
hours: n,
- minutes: s,
+ minutes: e,
seconds: o,
milliseconds: r
};
}
-function T(i, t) {
+function M(i, t) {
return Math.floor(i / 1e3) === Math.floor(t / 1e3);
}
-class M {
+class C {
constructor(t) {
- e(this, "rafId", 0);
- e(this, "endTime", 0);
- e(this, "counting", !1);
- e(this, "remain", 0);
- e(this, "options", {
+ s(this, "rafId", 0);
+ s(this, "endTime", 0);
+ s(this, "counting", !1);
+ s(this, "remain", 0);
+ s(this, "options", {
time: 0,
- autoStart: !0
+ autoStart: !0,
+ color: "#323233",
+ fontSize: "14px"
});
this.options = Object.assign(this.options, t), this.remain = this.options.time, this.options.autoStart && this.start();
}
get current() {
- return g(this.remain);
+ return T(this.remain);
}
getCurrentRemain() {
return Math.max(this.endTime - Date.now(), 0);
}
setRemain(t) {
- var n, s, o, r;
- this.remain = t, (s = (n = this.options).onChange) == null || s.call(n, this.current), t === 0 && (this.pause(), (r = (o = this.options).onFinish) == null || r.call(o)), this.render();
+ var n, e, o, r;
+ this.remain = t, (e = (n = this.options).onChange) == null || e.call(n, this.current), t === 0 && (this.pause(), (r = (o = this.options).onFinish) == null || r.call(o)), this.render();
}
microTick() {
this.rafId = m(() => {
@@ -54,7 +57,7 @@ class M {
this.rafId = m(() => {
if (this.counting) {
const t = this.getCurrentRemain();
- (!T(t, this.remain) || t === 0) && this.setRemain(t), this.remain > 0 && this.macroTick();
+ (!M(t, this.remain) || t === 0) && this.setRemain(t), this.remain > 0 && this.macroTick();
}
});
}
@@ -68,24 +71,27 @@ class M {
this.pause(), this.remain = t;
}
pause() {
- this.counting = !1, d(this.rafId);
+ this.counting = !1, g(this.rafId);
}
generateHTML() {
if (this.options.template)
return this.options.template(this.current);
let t = `${this.current.days}:${this.current.hours}:${this.current.minutes}:${this.current.seconds}`;
- return this.options.millisecond && (t += `:${this.current.milliseconds}`), `${t}`;
+ return this.options.millisecond && (t += `:${this.current.milliseconds}`), `${t}`;
}
getContainer() {
return typeof this.options.container == "string" ? document.querySelector(this.options.container) : this.options.container;
}
render() {
const t = this.getContainer();
- t && (t.innerHTML = `${this.generateHTML()}`);
+ t && (d(t, {
+ "font-size": this.options.fontSize,
+ color: this.options.color
+ }), t.innerHTML = `${this.generateHTML()}`);
}
}
-const R = (i) => new M(i);
+const w = (i) => new C(i);
export {
- M as CountdownBar,
- R as createCountdownBar
+ C as CountdownBar,
+ w as createCountdownBar
};
diff --git a/lib/countdownbar.umd.cjs b/lib/countdownbar.umd.cjs
index f28e1c0..fdacd99 100644
--- a/lib/countdownbar.umd.cjs
+++ b/lib/countdownbar.umd.cjs
@@ -1 +1 @@
-(function(e,n){typeof exports=="object"&&typeof module!="undefined"?n(exports):typeof define=="function"&&define.amd?define(["exports"],n):(e=typeof globalThis!="undefined"?globalThis:e||self,n(e.Countdownbar={}))})(this,function(e){"use strict";var C=Object.defineProperty;var w=(e,n,s)=>n in e?C(e,n,{enumerable:!0,configurable:!0,writable:!0,value:s}):e[n]=s;var o=(e,n,s)=>(w(e,typeof n!="symbol"?n+"":n,s),s);const n=typeof window!="undefined";function s(i){return n?requestAnimationFrame(i):-1}function p(i){n&&cancelAnimationFrame(i)}const u=1e3,f=60*u,m=60*f,d=24*m;function g(i){const t=Math.floor(i/d),r=Math.floor(i%d/m),a=Math.floor(i%m/f),c=Math.floor(i%f/u),h=Math.floor(i%u);return{total:i,days:t,hours:r,minutes:a,seconds:c,milliseconds:h}}function T(i,t){return Math.floor(i/1e3)===Math.floor(t/1e3)}class l{constructor(t){o(this,"rafId",0);o(this,"endTime",0);o(this,"counting",!1);o(this,"remain",0);o(this,"options",{time:0,autoStart:!0});this.options=Object.assign(this.options,t),this.remain=this.options.time,this.options.autoStart&&this.start()}get current(){return g(this.remain)}getCurrentRemain(){return Math.max(this.endTime-Date.now(),0)}setRemain(t){var r,a,c,h;this.remain=t,(a=(r=this.options).onChange)==null||a.call(r,this.current),t===0&&(this.pause(),(h=(c=this.options).onFinish)==null||h.call(c)),this.render()}microTick(){this.rafId=s(()=>{this.counting&&(this.setRemain(this.getCurrentRemain()),this.remain>0&&this.microTick())})}macroTick(){this.rafId=s(()=>{if(this.counting){const t=this.getCurrentRemain();(!T(t,this.remain)||t===0)&&this.setRemain(t),this.remain>0&&this.macroTick()}})}tick(){n&&(this.options.millisecond?this.microTick():this.macroTick())}start(){this.counting||(this.endTime=Date.now()+this.remain,this.counting=!0,this.tick())}reset(t=this.options.time){this.pause(),this.remain=t}pause(){this.counting=!1,p(this.rafId)}generateHTML(){if(this.options.template)return this.options.template(this.current);let t=`${this.current.days}:${this.current.hours}:${this.current.minutes}:${this.current.seconds}`;return this.options.millisecond&&(t+=`:${this.current.milliseconds}`),`${t}`}getContainer(){return typeof this.options.container=="string"?document.querySelector(this.options.container):this.options.container}render(){const t=this.getContainer();t&&(t.innerHTML=`${this.generateHTML()}`)}}const M=i=>new l(i);e.CountdownBar=l,e.createCountdownBar=M,Object.defineProperty(e,Symbol.toStringTag,{value:"Module"})});
+(function(n,e){typeof exports=="object"&&typeof module!="undefined"?e(exports,require("fourdom")):typeof define=="function"&&define.amd?define(["exports","fourdom"],e):(n=typeof globalThis!="undefined"?globalThis:n||self,e(n.Countdownbar={},n.fourdom))})(this,function(n,e){"use strict";var w=Object.defineProperty;var S=(n,e,o)=>e in n?w(n,e,{enumerable:!0,configurable:!0,writable:!0,value:o}):n[e]=o;var s=(n,e,o)=>(S(n,typeof e!="symbol"?e+"":e,o),o);const o=typeof window!="undefined";function d(i){return o?requestAnimationFrame(i):-1}function g(i){o&&cancelAnimationFrame(i)}const u=1e3,f=60*u,m=60*f,p=24*m;function T(i){const t=Math.floor(i/p),r=Math.floor(i%p/m),a=Math.floor(i%m/f),c=Math.floor(i%f/u),h=Math.floor(i%u);return{total:i,days:t,hours:r,minutes:a,seconds:c,milliseconds:h}}function M(i,t){return Math.floor(i/1e3)===Math.floor(t/1e3)}class l{constructor(t){s(this,"rafId",0);s(this,"endTime",0);s(this,"counting",!1);s(this,"remain",0);s(this,"options",{time:0,autoStart:!0,color:"#323233",fontSize:"14px"});this.options=Object.assign(this.options,t),this.remain=this.options.time,this.options.autoStart&&this.start()}get current(){return T(this.remain)}getCurrentRemain(){return Math.max(this.endTime-Date.now(),0)}setRemain(t){var r,a,c,h;this.remain=t,(a=(r=this.options).onChange)==null||a.call(r,this.current),t===0&&(this.pause(),(h=(c=this.options).onFinish)==null||h.call(c)),this.render()}microTick(){this.rafId=d(()=>{this.counting&&(this.setRemain(this.getCurrentRemain()),this.remain>0&&this.microTick())})}macroTick(){this.rafId=d(()=>{if(this.counting){const t=this.getCurrentRemain();(!M(t,this.remain)||t===0)&&this.setRemain(t),this.remain>0&&this.macroTick()}})}tick(){o&&(this.options.millisecond?this.microTick():this.macroTick())}start(){this.counting||(this.endTime=Date.now()+this.remain,this.counting=!0,this.tick())}reset(t=this.options.time){this.pause(),this.remain=t}pause(){this.counting=!1,g(this.rafId)}generateHTML(){if(this.options.template)return this.options.template(this.current);let t=`${this.current.days}:${this.current.hours}:${this.current.minutes}:${this.current.seconds}`;return this.options.millisecond&&(t+=`:${this.current.milliseconds}`),`${t}`}getContainer(){return typeof this.options.container=="string"?document.querySelector(this.options.container):this.options.container}render(){const t=this.getContainer();t&&(e.css(t,{"font-size":this.options.fontSize,color:this.options.color}),t.innerHTML=`${this.generateHTML()}`)}}const C=i=>new l(i);n.CountdownBar=l,n.createCountdownBar=C,Object.defineProperty(n,Symbol.toStringTag,{value:"Module"})});
diff --git a/lib/index.d.ts b/lib/index.d.ts
index fc08395..b1032d9 100644
--- a/lib/index.d.ts
+++ b/lib/index.d.ts
@@ -12,6 +12,8 @@ type CountdownBarOptions = {
autoStart?: boolean
time: number
millisecond?: boolean
+ color?: string
+ fontSize?: string
template?: (current: CurrentTime) => string
onChange?: (current: CurrentTime) => void
onFinish?: () => void