Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More →
Socket
Sign inDemoInstall
Socket
Sign inDemoInstall

@losting/timeline

Package Overview
Dependencies
Maintainers
1
Versions
22
Alerts
File Explorer

Advanced tools

License
Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

@losting/timeline - npm Package Compare versions

Comparing version 3.0.0 to 3.0.1

types/index.d.ts

318

dist/timeline.es.js
var Ft = Object.defineProperty;
var Ct = (a, t, i) => t in a ? Ft(a, t, { enumerable: !0, configurable: !0, writable: !0, value: i }) : a[t] = i;
var V = (a, t, i) => (Ct(a, typeof t != "symbol" ? t + "" : t, i), i), gt = (a, t, i) => {
var Ct = (a, t, s) => t in a ? Ft(a, t, { enumerable: !0, configurable: !0, writable: !0, value: s }) : a[t] = s;
var V = (a, t, s) => (Ct(a, typeof t != "symbol" ? t + "" : t, s), s), gt = (a, t, s) => {
if (!t.has(a))
throw TypeError("Cannot " + i);
throw TypeError("Cannot " + s);
};
var f = (a, t, i) => (gt(a, t, "read from private field"), i ? i.call(a) : t.get(a)), T = (a, t, i) => {
var f = (a, t, s) => (gt(a, t, "read from private field"), s ? s.call(a) : t.get(a)), T = (a, t, s) => {
if (t.has(a))
throw TypeError("Cannot add the same private member more than once");
t instanceof WeakSet ? t.add(a) : t.set(a, i);
}, O = (a, t, i, r) => (gt(a, t, "write to private field"), r ? r.call(a, i) : t.set(a, i), i);
var H = (a, t, i) => (gt(a, t, "access private method"), i);
t instanceof WeakSet ? t.add(a) : t.set(a, s);
}, L = (a, t, s, r) => (gt(a, t, "write to private field"), r ? r.call(a, s) : t.set(a, s), s);
var H = (a, t, s) => (gt(a, t, "access private method"), s);
function Ht(a) {
return { all: a = a || /* @__PURE__ */ new Map(), on: function(t, i) {
return { all: a = a || /* @__PURE__ */ new Map(), on: function(t, s) {
var r = a.get(t);
r ? r.push(i) : a.set(t, [i]);
}, off: function(t, i) {
r ? r.push(s) : a.set(t, [s]);
}, off: function(t, s) {
var r = a.get(t);
r && (i ? r.splice(r.indexOf(i) >>> 0, 1) : a.set(t, []));
}, emit: function(t, i) {
r && (s ? r.splice(r.indexOf(s) >>> 0, 1) : a.set(t, []));
}, emit: function(t, s) {
var r = a.get(t);
r && r.slice().map(function(l) {
l(i);
l(s);
}), (r = a.get("*")) && r.slice().map(function(l) {
l(t, i);
l(t, s);
});
} };
}
var Lt = typeof globalThis < "u" ? globalThis : typeof window < "u" ? window : typeof global < "u" ? global : typeof self < "u" ? self : {};
function Ot(a) {
var Ot = typeof globalThis < "u" ? globalThis : typeof window < "u" ? window : typeof global < "u" ? global : typeof self < "u" ? self : {};
function Lt(a) {
return a && a.__esModule && Object.prototype.hasOwnProperty.call(a, "default") ? a.default : a;

@@ -35,6 +35,6 @@ }

(function(a, t) {
(function(i, r) {
(function(s, r) {
a.exports = r();
})(Lt, function() {
var i = 1e3, r = 6e4, l = 36e5, g = "millisecond", $ = "second", p = "minute", v = "hour", w = "day", y = "week", b = "month", F = "quarter", E = "year", W = "date", Q = "Invalid Date", ft = /^(\d{4})[-/]?(\d{1,2})?[-/]?(\d{0,2})[Tt\s]*(\d{1,2})?:?(\d{1,2})?:?(\d{1,2})?[.:]?(\d+)?$/, K = /\[([^\]]+)]|Y{1,4}|M{1,4}|D{1,2}|d{1,4}|H{1,2}|h{1,2}|a|A|m{1,2}|s{1,2}|Z{1,2}|SSS/g, lt = { name: "en", weekdays: "Sunday_Monday_Tuesday_Wednesday_Thursday_Friday_Saturday".split("_"), months: "January_February_March_April_May_June_July_August_September_October_November_December".split("_"), ordinal: function(o) {
})(Ot, function() {
var s = 1e3, r = 6e4, l = 36e5, g = "millisecond", $ = "second", p = "minute", v = "hour", x = "day", b = "week", D = "month", F = "quarter", _ = "year", W = "date", Q = "Invalid Date", ft = /^(\d{4})[-/]?(\d{1,2})?[-/]?(\d{0,2})[Tt\s]*(\d{1,2})?:?(\d{1,2})?:?(\d{1,2})?[.:]?(\d+)?$/, K = /\[([^\]]+)]|Y{1,4}|M{1,4}|D{1,2}|d{1,4}|H{1,2}|h{1,2}|a|A|m{1,2}|s{1,2}|Z{1,2}|SSS/g, lt = { name: "en", weekdays: "Sunday_Monday_Tuesday_Wednesday_Thursday_Friday_Saturday".split("_"), months: "January_February_March_April_May_June_July_August_September_October_November_December".split("_"), ordinal: function(o) {
var n = ["th", "st", "nd", "rd"], e = o % 100;

@@ -46,13 +46,13 @@ return "[" + o + (n[(e - 20) % 10] || n[e] || n[0]) + "]";

}, J = { s: P, z: function(o) {
var n = -o.utcOffset(), e = Math.abs(n), h = Math.floor(e / 60), s = e % 60;
return (n <= 0 ? "+" : "-") + P(h, 2, "0") + ":" + P(s, 2, "0");
var n = -o.utcOffset(), e = Math.abs(n), h = Math.floor(e / 60), i = e % 60;
return (n <= 0 ? "+" : "-") + P(h, 2, "0") + ":" + P(i, 2, "0");
}, m: function o(n, e) {
if (n.date() < e.date())
return -o(e, n);
var h = 12 * (e.year() - n.year()) + (e.month() - n.month()), s = n.clone().add(h, b), u = e - s < 0, c = n.clone().add(h + (u ? -1 : 1), b);
return +(-(h + (e - s) / (u ? s - c : c - s)) || 0);
var h = 12 * (e.year() - n.year()) + (e.month() - n.month()), i = n.clone().add(h, D), u = e - i < 0, c = n.clone().add(h + (u ? -1 : 1), D);
return +(-(h + (e - i) / (u ? i - c : c - i)) || 0);
}, a: function(o) {
return o < 0 ? Math.ceil(o) || 0 : Math.floor(o);
}, p: function(o) {
return { M: b, y: E, w: y, d: w, D: W, h: v, m: p, s: $, ms: g, Q: F }[o] || String(o || "").toLowerCase().replace(/s$/, "");
return { M: D, y: _, w: b, d: x, D: W, h: v, m: p, s: $, ms: g, Q: F }[o] || String(o || "").toLowerCase().replace(/s$/, "");
}, u: function(o) {

@@ -65,3 +65,3 @@ return o === void 0;

}, tt = function o(n, e, h) {
var s;
var i;
if (!n)

@@ -71,12 +71,12 @@ return k;

var u = n.toLowerCase();
j[u] && (s = u), e && (j[u] = e, s = u);
j[u] && (i = u), e && (j[u] = e, i = u);
var c = n.split("-");
if (!s && c.length > 1)
if (!i && c.length > 1)
return o(c[0]);
} else {
var m = n.name;
j[m] = n, s = m;
j[m] = n, i = m;
}
return !h && s && (k = s), s || !h && k;
}, x = function(o, n) {
return !h && i && (k = i), i || !h && k;
}, y = function(o, n) {
if (dt(o))

@@ -88,3 +88,3 @@ return o.clone();

d.l = tt, d.i = dt, d.w = function(o, n) {
return x(o, { locale: n.$L, utc: n.$u, x: n.$x, $offset: n.$offset });
return y(o, { locale: n.$L, utc: n.$u, x: n.$x, $offset: n.$offset });
};

@@ -98,17 +98,17 @@ var et = function() {

this.$d = function(h) {
var s = h.date, u = h.utc;
if (s === null)
var i = h.date, u = h.utc;
if (i === null)
return /* @__PURE__ */ new Date(NaN);
if (d.u(s))
if (d.u(i))
return /* @__PURE__ */ new Date();
if (s instanceof Date)
return new Date(s);
if (typeof s == "string" && !/Z$/i.test(s)) {
var c = s.match(ft);
if (i instanceof Date)
return new Date(i);
if (typeof i == "string" && !/Z$/i.test(i)) {
var c = i.match(ft);
if (c) {
var m = c[2] - 1 || 0, D = (c[7] || "0").substring(0, 3);
return u ? new Date(Date.UTC(c[1], m, c[3] || 1, c[4] || 0, c[5] || 0, c[6] || 0, D)) : new Date(c[1], m, c[3] || 1, c[4] || 0, c[5] || 0, c[6] || 0, D);
var m = c[2] - 1 || 0, w = (c[7] || "0").substring(0, 3);
return u ? new Date(Date.UTC(c[1], m, c[3] || 1, c[4] || 0, c[5] || 0, c[6] || 0, w)) : new Date(c[1], m, c[3] || 1, c[4] || 0, c[5] || 0, c[6] || 0, w);
}
}
return new Date(s);
return new Date(i);
}(e), this.$x = e.x || {}, this.init();

@@ -123,10 +123,10 @@ }, n.init = function() {

}, n.isSame = function(e, h) {
var s = x(e);
return this.startOf(h) <= s && s <= this.endOf(h);
var i = y(e);
return this.startOf(h) <= i && i <= this.endOf(h);
}, n.isAfter = function(e, h) {
return x(e) < this.startOf(h);
return y(e) < this.startOf(h);
}, n.isBefore = function(e, h) {
return this.endOf(h) < x(e);
}, n.$g = function(e, h, s) {
return d.u(e) ? this[h] : this.set(s, e);
return this.endOf(h) < y(e);
}, n.$g = function(e, h, i) {
return d.u(e) ? this[h] : this.set(i, e);
}, n.unix = function() {

@@ -137,25 +137,25 @@ return Math.floor(this.valueOf() / 1e3);

}, n.startOf = function(e, h) {
var s = this, u = !!d.u(h) || h, c = d.p(e), m = function(U, C) {
var I = d.w(s.$u ? Date.UTC(s.$y, C, U) : new Date(s.$y, C, U), s);
return u ? I : I.endOf(w);
}, D = function(U, C) {
return d.w(s.toDate()[U].apply(s.toDate("s"), (u ? [0, 0, 0, 0] : [23, 59, 59, 999]).slice(C)), s);
}, M = this.$W, S = this.$M, z = this.$D, _ = "set" + (this.$u ? "UTC" : "");
var i = this, u = !!d.u(h) || h, c = d.p(e), m = function(U, C) {
var I = d.w(i.$u ? Date.UTC(i.$y, C, U) : new Date(i.$y, C, U), i);
return u ? I : I.endOf(x);
}, w = function(U, C) {
return d.w(i.toDate()[U].apply(i.toDate("s"), (u ? [0, 0, 0, 0] : [23, 59, 59, 999]).slice(C)), i);
}, M = this.$W, S = this.$M, z = this.$D, E = "set" + (this.$u ? "UTC" : "");
switch (c) {
case E:
case _:
return u ? m(1, 0) : m(31, 11);
case D:
return u ? m(1, S) : m(0, S + 1);
case b:
return u ? m(1, S) : m(0, S + 1);
case y:
var R = this.$locale().weekStart || 0, q = (M < R ? M + 7 : M) - R;
return m(u ? z - q : z + (6 - q), S);
case w:
case x:
case W:
return D(_ + "Hours", 0);
return w(E + "Hours", 0);
case v:
return D(_ + "Minutes", 1);
return w(E + "Minutes", 1);
case p:
return D(_ + "Seconds", 2);
return w(E + "Seconds", 2);
case $:
return D(_ + "Milliseconds", 3);
return w(E + "Milliseconds", 3);
default:

@@ -167,8 +167,8 @@ return this.clone();

}, n.$set = function(e, h) {
var s, u = d.p(e), c = "set" + (this.$u ? "UTC" : ""), m = (s = {}, s[w] = c + "Date", s[W] = c + "Date", s[b] = c + "Month", s[E] = c + "FullYear", s[v] = c + "Hours", s[p] = c + "Minutes", s[$] = c + "Seconds", s[g] = c + "Milliseconds", s)[u], D = u === w ? this.$D + (h - this.$W) : h;
if (u === b || u === E) {
var i, u = d.p(e), c = "set" + (this.$u ? "UTC" : ""), m = (i = {}, i[x] = c + "Date", i[W] = c + "Date", i[D] = c + "Month", i[_] = c + "FullYear", i[v] = c + "Hours", i[p] = c + "Minutes", i[$] = c + "Seconds", i[g] = c + "Milliseconds", i)[u], w = u === x ? this.$D + (h - this.$W) : h;
if (u === D || u === _) {
var M = this.clone().set(W, 1);
M.$d[m](D), M.init(), this.$d = M.set(W, Math.min(this.$D, M.daysInMonth())).$d;
M.$d[m](w), M.init(), this.$d = M.set(W, Math.min(this.$D, M.daysInMonth())).$d;
} else
m && this.$d[m](D);
m && this.$d[m](w);
return this.init(), this;

@@ -180,17 +180,17 @@ }, n.set = function(e, h) {

}, n.add = function(e, h) {
var s, u = this;
var i, u = this;
e = Number(e);
var c = d.p(h), m = function(S) {
var z = x(u);
var z = y(u);
return d.w(z.date(z.date() + Math.round(S * e)), u);
};
if (c === D)
return this.set(D, this.$M + e);
if (c === _)
return this.set(_, this.$y + e);
if (c === x)
return m(1);
if (c === b)
return this.set(b, this.$M + e);
if (c === E)
return this.set(E, this.$y + e);
if (c === w)
return m(1);
if (c === y)
return m(7);
var D = (s = {}, s[p] = r, s[v] = l, s[$] = i, s)[c] || 1, M = this.$d.getTime() + e * D;
var w = (i = {}, i[p] = r, i[v] = l, i[$] = s, i)[c] || 1, M = this.$d.getTime() + e * w;
return d.w(M, this);

@@ -200,13 +200,13 @@ }, n.subtract = function(e, h) {

}, n.format = function(e) {
var h = this, s = this.$locale();
var h = this, i = this.$locale();
if (!this.isValid())
return s.invalidDate || Q;
var u = e || "YYYY-MM-DDTHH:mm:ssZ", c = d.z(this), m = this.$H, D = this.$m, M = this.$M, S = s.weekdays, z = s.months, _ = function(C, I, mt, st) {
return C && (C[I] || C(h, u)) || mt[I].slice(0, st);
return i.invalidDate || Q;
var u = e || "YYYY-MM-DDTHH:mm:ssZ", c = d.z(this), m = this.$H, w = this.$m, M = this.$M, S = i.weekdays, z = i.months, E = function(C, I, mt, it) {
return C && (C[I] || C(h, u)) || mt[I].slice(0, it);
}, R = function(C) {
return d.s(m % 12 || 12, C, "0");
}, q = s.meridiem || function(C, I, mt) {
var st = C < 12 ? "AM" : "PM";
return mt ? st.toLowerCase() : st;
}, U = { YY: String(this.$y).slice(-2), YYYY: d.s(this.$y, 4, "0"), M: M + 1, MM: d.s(M + 1, 2, "0"), MMM: _(s.monthsShort, M, z, 3), MMMM: _(z, M), D: this.$D, DD: d.s(this.$D, 2, "0"), d: String(this.$W), dd: _(s.weekdaysMin, this.$W, S, 2), ddd: _(s.weekdaysShort, this.$W, S, 3), dddd: S[this.$W], H: String(m), HH: d.s(m, 2, "0"), h: R(1), hh: R(2), a: q(m, D, !0), A: q(m, D, !1), m: String(D), mm: d.s(D, 2, "0"), s: String(this.$s), ss: d.s(this.$s, 2, "0"), SSS: d.s(this.$ms, 3, "0"), Z: c };
}, q = i.meridiem || function(C, I, mt) {
var it = C < 12 ? "AM" : "PM";
return mt ? it.toLowerCase() : it;
}, U = { YY: String(this.$y).slice(-2), YYYY: d.s(this.$y, 4, "0"), M: M + 1, MM: d.s(M + 1, 2, "0"), MMM: E(i.monthsShort, M, z, 3), MMMM: E(z, M), D: this.$D, DD: d.s(this.$D, 2, "0"), d: String(this.$W), dd: E(i.weekdaysMin, this.$W, S, 2), ddd: E(i.weekdaysShort, this.$W, S, 3), dddd: S[this.$W], H: String(m), HH: d.s(m, 2, "0"), h: R(1), hh: R(2), a: q(m, w, !0), A: q(m, w, !1), m: String(w), mm: d.s(w, 2, "0"), s: String(this.$s), ss: d.s(this.$s, 2, "0"), SSS: d.s(this.$ms, 3, "0"), Z: c };
return u.replace(K, function(C, I) {

@@ -217,7 +217,7 @@ return I || U[C] || c.replace(":", "");

return 15 * -Math.round(this.$d.getTimezoneOffset() / 15);
}, n.diff = function(e, h, s) {
var u, c = d.p(h), m = x(e), D = (m.utcOffset() - this.utcOffset()) * r, M = this - m, S = d.m(this, m);
return S = (u = {}, u[E] = S / 12, u[b] = S, u[F] = S / 3, u[y] = (M - D) / 6048e5, u[w] = (M - D) / 864e5, u[v] = M / l, u[p] = M / r, u[$] = M / i, u)[c] || M, s ? S : d.a(S);
}, n.diff = function(e, h, i) {
var u, c = d.p(h), m = y(e), w = (m.utcOffset() - this.utcOffset()) * r, M = this - m, S = d.m(this, m);
return S = (u = {}, u[_] = S / 12, u[D] = S, u[F] = S / 3, u[b] = (M - w) / 6048e5, u[x] = (M - w) / 864e5, u[v] = M / l, u[p] = M / r, u[$] = M / s, u)[c] || M, i ? S : d.a(S);
}, n.daysInMonth = function() {
return this.endOf(b).$D;
return this.endOf(D).$D;
}, n.$locale = function() {

@@ -228,4 +228,4 @@ return j[this.$L];

return this.$L;
var s = this.clone(), u = tt(e, h, !0);
return u && (s.$L = u), s;
var i = this.clone(), u = tt(e, h, !0);
return u && (i.$L = u), i;
}, n.clone = function() {

@@ -243,32 +243,32 @@ return d.w(this.$d, this);

}(), pt = et.prototype;
return x.prototype = pt, [["$ms", g], ["$s", $], ["$m", p], ["$H", v], ["$W", w], ["$M", b], ["$y", E], ["$D", W]].forEach(function(o) {
return y.prototype = pt, [["$ms", g], ["$s", $], ["$m", p], ["$H", v], ["$W", x], ["$M", D], ["$y", _], ["$D", W]].forEach(function(o) {
pt[o[1]] = function(n) {
return this.$g(n, o[0], o[1]);
};
}), x.extend = function(o, n) {
return o.$i || (o(n, et, x), o.$i = !0), x;
}, x.locale = tt, x.isDayjs = dt, x.unix = function(o) {
return x(1e3 * o);
}, x.en = j[k], x.Ls = j, x.p = {}, x;
}), y.extend = function(o, n) {
return o.$i || (o(n, et, y), o.$i = !0), y;
}, y.locale = tt, y.isDayjs = dt, y.unix = function(o) {
return y(1e3 * o);
}, y.en = j[k], y.Ls = j, y.p = {}, y;
});
})(Yt);
var Et = Yt.exports;
const _t = /* @__PURE__ */ Ot(Et), $t = (a, t = "MM/DD HH:mm") => _t(a).format(t), Mt = (a, t) => {
let i, r = 0;
var _t = Yt.exports;
const Et = /* @__PURE__ */ Lt(_t), $t = (a, t = "MM/DD HH:mm") => Et(a).format(t), Mt = (a, t) => {
let s, r = 0;
return (...l) => {
const g = Date.now(), $ = g - r;
!r || $ >= t ? (r = g, a.apply(void 0, l)) : i || (i = setTimeout(() => {
r = g, a.apply(void 0, l), i = null;
!r || $ >= t ? (r = g, a.apply(void 0, l)) : s || (s = setTimeout(() => {
r = g, a.apply(void 0, l), s = null;
}, t - $));
};
}, At = (a, t) => {
const i = document.createElement("canvas");
i.width = i.height = 1;
const r = i.getContext("2d");
const s = document.createElement("canvas");
s.width = s.height = 1;
const r = s.getContext("2d");
r.fillStyle = a, r.fillRect(0, 0, 1, 1);
const l = r.getImageData(0, 0, 1, 1).data;
return `rgba(${l[0]}, ${l[1]}, ${l[2]}, ${t})`;
}, Wt = ({ xCenterPoint: a, cfg: t, timePerPixel: i, timeSpacing: r, currentTime: l, $canvas: g, screenScaleCount: $, scaleHeight: p, startTime: v, drawLine: w, drawText: y, drawArea: b }) => {
const F = ({ space: E, scaleFormat: W, bgFormat: Q, currentFormat: ft }) => {
y({
}, Wt = ({ xCenterPoint: a, cfg: t, timePerPixel: s, timeSpacing: r, currentTime: l, $canvas: g, screenScaleCount: $, scaleHeight: p, startTime: v, drawLine: x, drawText: b, drawArea: D }) => {
const F = ({ space: _, scaleFormat: W, bgFormat: Q, currentFormat: ft }) => {
b({
x: g.width - a / 10,

@@ -282,7 +282,7 @@ y: 6,

});
const K = v % r, lt = K / i;
const K = v % r, lt = K / s;
for (let P = 0; P < $; P++) {
const J = P * t.scaleSpacing - lt - t.pointWidth / 2, k = v + P * r - K;
if (k % (r * E) === 0) {
w({ x: J, y: p.long }), y({
if (k % (r * _) === 0) {
x({ x: J, y: p.long }), b({
x: J,

@@ -295,5 +295,5 @@ y: g.height - p.long - 5,

}
w({ x: J, y: p.short });
x({ x: J, y: p.short });
}
w({
x({
x: a - t.pointWidth / 2,

@@ -303,3 +303,3 @@ y: g.height,

color: t.pointColor
}), b({
}), D({
startX: a - 50,

@@ -310,3 +310,3 @@ startY: 4,

bgColor: t.pointColor
}), y({
}), b({
x: a,

@@ -335,5 +335,5 @@ y: 6,

};
var Z, L, A, Y, X, N, nt, Dt, rt, wt, at, yt, ot, xt, ht, bt, ct, St, G, vt, B, it, ut, Tt;
var Z, O, A, Y, X, N, nt, Dt, rt, wt, at, xt, ot, yt, ht, bt, ct, St, G, vt, B, st, ut, Tt;
class zt {
constructor(t, i) {
constructor(t, s) {
// 拖拽

@@ -361,3 +361,3 @@ T(this, nt);

T(this, Z, Ht());
T(this, L, 0);
T(this, O, 0);
T(this, A, void 0);

@@ -371,14 +371,12 @@ T(this, Y, void 0);

throw new Error("canvas Element Or Element ID is required!");
if (typeof t == "string" ? this.$canvas = document.querySelector(t) : this.$canvas = t, !(this.$canvas instanceof HTMLCanvasElement))
throw new Error("element must be canvas!");
this.ctx = this.$canvas.getContext("2d"), this.cfg = { ...Pt, ...i };
const { fill: r, width: l, height: g, zoom: $, timeSpacingList: p, scaleHeight: v, textColor: w } = this.cfg;
if (this.cfg.bgTextColor = At(w, 0.18), $ < 0 || $ >= p.length || $ % 1 !== 0)
typeof t == "string" ? this.$canvas = document.querySelector(t) : this.$canvas = t, this.ctx = this.$canvas.getContext("2d"), this.cfg = { ...Pt, ...s };
const { fill: r, width: l, height: g, zoom: $, timeSpacingList: p, scaleHeight: v, textColor: x, bgTextColor: b } = this.cfg;
if (b || (this.cfg.bgTextColor = At(x, 0.18)), $ < 0 || $ >= p.length || $ % 1 !== 0)
throw new Error(`zoom must be 0 ~ ${p.length - 1}, and must be an integer`);
if (r) {
const y = this.$canvas.parentElement;
this.$canvasParent = y, this.$canvas.width = y.clientWidth, this.$canvas.height = y.clientHeight, new ResizeObserver(Mt(H(this, at, yt).bind(this), 200)).observe(y);
const D = this.$canvas.parentElement;
this.$canvasParent = D, this.$canvas.width = D.clientWidth, this.$canvas.height = D.clientHeight, new ResizeObserver(Mt(H(this, at, xt).bind(this), 200)).observe(D);
} else
l && (this.$canvas.width = l), g && (this.$canvas.height = g);
O(this, Y, p[$]), v != null && v.long && (v != null && v.short) ? O(this, X, v) : O(this, X, {
L(this, Y, p[$]), v != null && v.long && (v != null && v.short) ? L(this, X, v) : L(this, X, {
long: this.$canvas.height / 3,

@@ -393,8 +391,8 @@ // 1/3高度

// 绘制时间轴
draw({ currentTime: t, areas: i, _privateFlag: r } = {}) {
draw({ currentTime: t, areas: s, _privateFlag: r } = {}) {
if (f(this, N) && !r)
return;
O(this, L, t || Date.now()), O(this, A, i || []);
const l = Math.ceil(this.$canvas.width / this.cfg.scaleSpacing), g = l * f(this, Y), $ = f(this, L) - g / 2, p = f(this, L) + g / 2, v = this.$canvas.width / 2, w = g / this.$canvas.width;
H(this, ot, xt).call(this), H(this, B, it).call(this, {
L(this, O, t || Date.now()), L(this, A, s || []);
const l = Math.ceil(this.$canvas.width / this.cfg.scaleSpacing), g = l * f(this, Y), $ = f(this, O) - g / 2, p = f(this, O) + g / 2, v = this.$canvas.width / 2, x = g / this.$canvas.width;
H(this, ot, yt).call(this), H(this, B, st).call(this, {
startX: 0,

@@ -405,10 +403,10 @@ startY: 0,

bgColor: this.cfg.bgColor
}), f(this, A).forEach((y) => {
const b = y.startTime < $ ? 0 : Math.floor((y.startTime - $) / w), F = y.endTime > p ? this.$canvas.width : Math.floor((y.endTime - $) / w);
H(this, B, it).call(this, {
startX: b,
}), f(this, A).forEach((b) => {
const D = b.startTime < $ ? 0 : Math.floor((b.startTime - $) / x), F = b.endTime > p ? this.$canvas.width : Math.floor((b.endTime - $) / x);
H(this, B, st).call(this, {
startX: D,
startY: 0,
endX: F,
endY: this.$canvas.height,
bgColor: y.bgColor || this.cfg.areaBgColor
bgColor: b.bgColor || this.cfg.areaBgColor
});

@@ -419,6 +417,6 @@ }), Wt.bind(this)({

startTime: $,
timePerPixel: w,
timePerPixel: x,
scaleHeight: f(this, X),
timeSpacing: f(this, Y),
currentTime: f(this, L),
currentTime: f(this, O),
$canvas: this.$canvas,

@@ -428,3 +426,3 @@ cfg: this.cfg,

drawText: H(this, G, vt).bind(this),
drawArea: H(this, B, it).bind(this)
drawArea: H(this, B, st).bind(this)
}), H(this, ht, bt).call(this);

@@ -434,14 +432,14 @@ }

getCurrentTime() {
return f(this, L);
return f(this, O);
}
on(t, i) {
f(this, Z).on(t, i);
on(t, s) {
f(this, Z).on(t, s);
}
off(t, i) {
f(this, Z).off(t, i);
off(t, s) {
f(this, Z).off(t, s);
}
}
Z = new WeakMap(), L = new WeakMap(), A = new WeakMap(), Y = new WeakMap(), X = new WeakMap(), N = new WeakMap(), nt = new WeakSet(), Dt = function(t) {
O(this, N, !0);
let i = 0, r = f(this, L);
Z = new WeakMap(), O = new WeakMap(), A = new WeakMap(), Y = new WeakMap(), X = new WeakMap(), N = new WeakMap(), nt = new WeakSet(), Dt = function(t) {
L(this, N, !0);
let s = 0, r = f(this, O);
const l = Mt(({ offsetX: p }) => {

@@ -451,3 +449,3 @@ if (!f(this, N))

const v = p - t.offsetX;
r = Math.round(f(this, L) - f(this, Y) / this.cfg.scaleSpacing * (v - i)), i = v, this.draw({
r = Math.round(f(this, O) - f(this, Y) / this.cfg.scaleSpacing * (v - s)), s = v, this.draw({
currentTime: r,

@@ -460,3 +458,3 @@ areas: f(this, A),

}, $ = () => {
this.$canvas.removeEventListener("mousemove", l), this.$canvas.removeEventListener("mousemove", g), document.removeEventListener("mouseup", $), O(this, N, !1), H(this, ut, Tt).call(this, "dragged", r);
this.$canvas.removeEventListener("mousemove", l), this.$canvas.removeEventListener("mousemove", g), document.removeEventListener("mouseup", $), L(this, N, !1), H(this, ut, Tt).call(this, "dragged", r);
};

@@ -466,14 +464,14 @@ this.$canvas.addEventListener("mousemove", l), this.$canvas.addEventListener("mousemove", g), document.addEventListener("mouseup", $);

t.preventDefault();
const i = this.cfg.timeSpacingList.findIndex((r) => r === f(this, Y));
t.deltaY < 0 && i > 0 ? (O(this, Y, this.cfg.timeSpacingList[i - 1]), this.draw({
currentTime: f(this, L),
const s = this.cfg.timeSpacingList.findIndex((r) => r === f(this, Y));
t.deltaY < 0 && s > 0 ? (L(this, Y, this.cfg.timeSpacingList[s - 1]), this.draw({
currentTime: f(this, O),
areas: f(this, A),
_privateFlag: !0
})) : t.deltaY > 0 && i < this.cfg.timeSpacingList.length - 1 && (O(this, Y, this.cfg.timeSpacingList[i + 1]), this.draw({
currentTime: f(this, L),
})) : t.deltaY > 0 && s < this.cfg.timeSpacingList.length - 1 && (L(this, Y, this.cfg.timeSpacingList[s + 1]), this.draw({
currentTime: f(this, O),
areas: f(this, A),
_privateFlag: !0
}));
}, at = new WeakSet(), yt = function() {
this.$canvasParent && (this.$canvas.width = this.$canvasParent.clientWidth, this.$canvas.height = this.$canvasParent.clientHeight, this.cfg.scaleHeight || O(this, X, {
}, at = new WeakSet(), xt = function() {
this.$canvasParent && (this.$canvas.width = this.$canvasParent.clientWidth, this.$canvas.height = this.$canvasParent.clientHeight, this.cfg.scaleHeight || L(this, X, {
long: this.$canvas.height / 3,

@@ -486,6 +484,6 @@ // 1/3高度

}), this.draw({
currentTime: f(this, L),
currentTime: f(this, O),
areas: f(this, A)
}));
}, ot = new WeakSet(), xt = function() {
}, ot = new WeakSet(), yt = function() {
this.ctx.clearRect(0, 0, this.$canvas.width, this.$canvas.height);

@@ -501,8 +499,8 @@ }, ht = new WeakSet(), bt = function() {

}), this.ctx.beginPath(), this.ctx.moveTo(5, 6), this.ctx.lineTo(5, 10), this.ctx.lineTo(this.cfg.scaleSpacing + 6, 10), this.ctx.lineTo(this.cfg.scaleSpacing + 6, 6), this.ctx.strokeStyle = this.cfg.scaleColor, this.ctx.lineWidth = 1.5, this.ctx.stroke();
}, ct = new WeakSet(), St = function({ x: t, y: i, width: r = 1, color: l = this.cfg.scaleColor }) {
this.ctx.beginPath(), this.ctx.moveTo(t, this.$canvas.height), this.ctx.lineTo(t, this.$canvas.height - i), this.ctx.closePath(), this.ctx.strokeStyle = l, this.ctx.lineWidth = r, this.ctx.stroke();
}, G = new WeakSet(), vt = function({ x: t, y: i, text: r, color: l = this.cfg.textColor, fontSize: g = "11px", align: $ = "center", baseLine: p = "alphabetic" }) {
this.ctx.beginPath(), this.ctx.font = `${g} Arial`, this.ctx.fillStyle = l, this.ctx.textAlign = $, this.ctx.textBaseline = p, this.ctx.fillText(r, t, i);
}, B = new WeakSet(), it = function({ startX: t, startY: i, endX: r, endY: l, bgColor: g }) {
this.ctx.beginPath(), this.ctx.rect(t, i, r - t, l - i), this.ctx.fillStyle = g, this.ctx.fill();
}, ct = new WeakSet(), St = function({ x: t, y: s, width: r = 1, color: l = this.cfg.scaleColor }) {
this.ctx.beginPath(), this.ctx.moveTo(t, this.$canvas.height), this.ctx.lineTo(t, this.$canvas.height - s), this.ctx.closePath(), this.ctx.strokeStyle = l, this.ctx.lineWidth = r, this.ctx.stroke();
}, G = new WeakSet(), vt = function({ x: t, y: s, text: r, color: l = this.cfg.textColor, fontSize: g = "11px", align: $ = "center", baseLine: p = "alphabetic" }) {
this.ctx.beginPath(), this.ctx.font = `${g} Arial`, this.ctx.fillStyle = l, this.ctx.textAlign = $, this.ctx.textBaseline = p, this.ctx.fillText(r, t, s);
}, B = new WeakSet(), st = function({ startX: t, startY: s, endX: r, endY: l, bgColor: g }) {
this.ctx.beginPath(), this.ctx.rect(t, s, r - t, l - s), this.ctx.fillStyle = g, this.ctx.fill();
}, ut = new WeakSet(), Tt = function(...t) {

@@ -509,0 +507,0 @@ f(this, Z).emit(...t);

2

dist/timeline.iife.js

@@ -1,1 +0,1 @@

var $timeline=function(){var J,E,P,w,U,Z,st,xt,it,bt,nt,St,rt,Tt,at,Ft,ot,Ct,G,Dt,R,mt,ht,Ht;"use strict";var Pt=Object.defineProperty;var kt=(p,M,y)=>M in p?Pt(p,M,{enumerable:!0,configurable:!0,writable:!0,value:y}):p[M]=y;var et=(p,M,y)=>(kt(p,typeof M!="symbol"?M+"":M,y),y),Yt=(p,M,y)=>{if(!M.has(p))throw TypeError("Cannot "+y)};var u=(p,M,y)=>(Yt(p,M,"read from private field"),y?y.call(p):M.get(p)),H=(p,M,y)=>{if(M.has(p))throw TypeError("Cannot add the same private member more than once");M instanceof WeakSet?M.add(p):M.set(p,y)},A=(p,M,y,V)=>(Yt(p,M,"write to private field"),V?V.call(p,y):M.set(p,y),y);var _=(p,M,y)=>(Yt(p,M,"access private method"),y);function p(l){return{all:l=l||new Map,on:function(n,r){var i=l.get(n);i?i.push(r):l.set(n,[r])},off:function(n,r){var i=l.get(n);i&&(r?i.splice(i.indexOf(r)>>>0,1):l.set(n,[]))},emit:function(n,r){var i=l.get(n);i&&i.slice().map(function(f){f(r)}),(i=l.get("*"))&&i.slice().map(function(f){f(n,r)})}}}var M=typeof globalThis<"u"?globalThis:typeof window<"u"?window:typeof global<"u"?global:typeof self<"u"?self:{};function y(l){return l&&l.__esModule&&Object.prototype.hasOwnProperty.call(l,"default")?l.default:l}var V={exports:{}};(function(l,n){(function(r,i){l.exports=i()})(M,function(){var r=1e3,i=6e4,f=36e5,g="millisecond",$="second",Y="minute",v="hour",b="day",S="week",F="month",L="quarter",W="year",z="date",ct="Invalid Date",$t=/^(\d{4})[-/]?(\d{1,2})?[-/]?(\d{0,2})[Tt\s]*(\d{1,2})?:?(\d{1,2})?:?(\d{1,2})?[.:]?(\d+)?$/,ut=/\[([^\]]+)]|Y{1,4}|M{1,4}|D{1,2}|d{1,4}|H{1,2}|h{1,2}|a|A|m{1,2}|s{1,2}|Z{1,2}|SSS/g,vt={name:"en",weekdays:"Sunday_Monday_Tuesday_Wednesday_Thursday_Friday_Saturday".split("_"),months:"January_February_March_April_May_June_July_August_September_October_November_December".split("_"),ordinal:function(a){var s=["th","st","nd","rd"],t=a%100;return"["+a+(s[(t-20)%10]||s[t]||s[0])+"]"}},I=function(a,s,t){var o=String(a);return!o||o.length>=s?a:""+Array(s+1-o.length).join(t)+a},Q={s:I,z:function(a){var s=-a.utcOffset(),t=Math.abs(s),o=Math.floor(t/60),e=t%60;return(s<=0?"+":"-")+I(o,2,"0")+":"+I(e,2,"0")},m:function a(s,t){if(s.date()<t.date())return-a(t,s);var o=12*(t.year()-s.year())+(t.month()-s.month()),e=s.clone().add(o,F),c=t-e<0,h=s.clone().add(o+(c?-1:1),F);return+(-(o+(t-e)/(c?e-h:h-e))||0)},a:function(a){return a<0?Math.ceil(a)||0:Math.floor(a)},p:function(a){return{M:F,y:W,w:S,d:b,D:z,h:v,m:Y,s:$,ms:g,Q:L}[a]||String(a||"").toLowerCase().replace(/s$/,"")},u:function(a){return a===void 0}},j="en",B={};B[j]=vt;var Mt=function(a){return a instanceof lt},ft=function a(s,t,o){var e;if(!s)return j;if(typeof s=="string"){var c=s.toLowerCase();B[c]&&(e=c),t&&(B[c]=t,e=c);var h=s.split("-");if(!e&&h.length>1)return a(h[0])}else{var m=s.name;B[m]=s,e=m}return!o&&e&&(j=e),e||!o&&j},T=function(a,s){if(Mt(a))return a.clone();var t=typeof s=="object"?s:{};return t.date=a,t.args=arguments,new lt(t)},d=Q;d.l=ft,d.i=Mt,d.w=function(a,s){return T(a,{locale:s.$L,utc:s.$u,x:s.$x,$offset:s.$offset})};var lt=function(){function a(t){this.$L=ft(t.locale,null,!0),this.parse(t)}var s=a.prototype;return s.parse=function(t){this.$d=function(o){var e=o.date,c=o.utc;if(e===null)return new Date(NaN);if(d.u(e))return new Date;if(e instanceof Date)return new Date(e);if(typeof e=="string"&&!/Z$/i.test(e)){var h=e.match($t);if(h){var m=h[2]-1||0,x=(h[7]||"0").substring(0,3);return c?new Date(Date.UTC(h[1],m,h[3]||1,h[4]||0,h[5]||0,h[6]||0,x)):new Date(h[1],m,h[3]||1,h[4]||0,h[5]||0,h[6]||0,x)}}return new Date(e)}(t),this.$x=t.x||{},this.init()},s.init=function(){var t=this.$d;this.$y=t.getFullYear(),this.$M=t.getMonth(),this.$D=t.getDate(),this.$W=t.getDay(),this.$H=t.getHours(),this.$m=t.getMinutes(),this.$s=t.getSeconds(),this.$ms=t.getMilliseconds()},s.$utils=function(){return d},s.isValid=function(){return this.$d.toString()!==ct},s.isSame=function(t,o){var e=T(t);return this.startOf(o)<=e&&e<=this.endOf(o)},s.isAfter=function(t,o){return T(t)<this.startOf(o)},s.isBefore=function(t,o){return this.endOf(o)<T(t)},s.$g=function(t,o,e){return d.u(t)?this[o]:this.set(e,t)},s.unix=function(){return Math.floor(this.valueOf()/1e3)},s.valueOf=function(){return this.$d.getTime()},s.startOf=function(t,o){var e=this,c=!!d.u(o)||o,h=d.p(t),m=function(q,O){var N=d.w(e.$u?Date.UTC(e.$y,O,q):new Date(e.$y,O,q),e);return c?N:N.endOf(b)},x=function(q,O){return d.w(e.toDate()[q].apply(e.toDate("s"),(c?[0,0,0,0]:[23,59,59,999]).slice(O)),e)},D=this.$W,C=this.$M,X=this.$D,k="set"+(this.$u?"UTC":"");switch(h){case W:return c?m(1,0):m(31,11);case F:return c?m(1,C):m(0,C+1);case S:var K=this.$locale().weekStart||0,tt=(D<K?D+7:D)-K;return m(c?X-tt:X+(6-tt),C);case b:case z:return x(k+"Hours",0);case v:return x(k+"Minutes",1);case Y:return x(k+"Seconds",2);case $:return x(k+"Milliseconds",3);default:return this.clone()}},s.endOf=function(t){return this.startOf(t,!1)},s.$set=function(t,o){var e,c=d.p(t),h="set"+(this.$u?"UTC":""),m=(e={},e[b]=h+"Date",e[z]=h+"Date",e[F]=h+"Month",e[W]=h+"FullYear",e[v]=h+"Hours",e[Y]=h+"Minutes",e[$]=h+"Seconds",e[g]=h+"Milliseconds",e)[c],x=c===b?this.$D+(o-this.$W):o;if(c===F||c===W){var D=this.clone().set(z,1);D.$d[m](x),D.init(),this.$d=D.set(z,Math.min(this.$D,D.daysInMonth())).$d}else m&&this.$d[m](x);return this.init(),this},s.set=function(t,o){return this.clone().$set(t,o)},s.get=function(t){return this[d.p(t)]()},s.add=function(t,o){var e,c=this;t=Number(t);var h=d.p(o),m=function(C){var X=T(c);return d.w(X.date(X.date()+Math.round(C*t)),c)};if(h===F)return this.set(F,this.$M+t);if(h===W)return this.set(W,this.$y+t);if(h===b)return m(1);if(h===S)return m(7);var x=(e={},e[Y]=i,e[v]=f,e[$]=r,e)[h]||1,D=this.$d.getTime()+t*x;return d.w(D,this)},s.subtract=function(t,o){return this.add(-1*t,o)},s.format=function(t){var o=this,e=this.$locale();if(!this.isValid())return e.invalidDate||ct;var c=t||"YYYY-MM-DDTHH:mm:ssZ",h=d.z(this),m=this.$H,x=this.$m,D=this.$M,C=e.weekdays,X=e.months,k=function(O,N,pt,dt){return O&&(O[N]||O(o,c))||pt[N].slice(0,dt)},K=function(O){return d.s(m%12||12,O,"0")},tt=e.meridiem||function(O,N,pt){var dt=O<12?"AM":"PM";return pt?dt.toLowerCase():dt},q={YY:String(this.$y).slice(-2),YYYY:d.s(this.$y,4,"0"),M:D+1,MM:d.s(D+1,2,"0"),MMM:k(e.monthsShort,D,X,3),MMMM:k(X,D),D:this.$D,DD:d.s(this.$D,2,"0"),d:String(this.$W),dd:k(e.weekdaysMin,this.$W,C,2),ddd:k(e.weekdaysShort,this.$W,C,3),dddd:C[this.$W],H:String(m),HH:d.s(m,2,"0"),h:K(1),hh:K(2),a:tt(m,x,!0),A:tt(m,x,!1),m:String(x),mm:d.s(x,2,"0"),s:String(this.$s),ss:d.s(this.$s,2,"0"),SSS:d.s(this.$ms,3,"0"),Z:h};return c.replace(ut,function(O,N){return N||q[O]||h.replace(":","")})},s.utcOffset=function(){return 15*-Math.round(this.$d.getTimezoneOffset()/15)},s.diff=function(t,o,e){var c,h=d.p(o),m=T(t),x=(m.utcOffset()-this.utcOffset())*i,D=this-m,C=d.m(this,m);return C=(c={},c[W]=C/12,c[F]=C,c[L]=C/3,c[S]=(D-x)/6048e5,c[b]=(D-x)/864e5,c[v]=D/f,c[Y]=D/i,c[$]=D/r,c)[h]||D,e?C:d.a(C)},s.daysInMonth=function(){return this.endOf(F).$D},s.$locale=function(){return B[this.$L]},s.locale=function(t,o){if(!t)return this.$L;var e=this.clone(),c=ft(t,o,!0);return c&&(e.$L=c),e},s.clone=function(){return d.w(this.$d,this)},s.toDate=function(){return new Date(this.valueOf())},s.toJSON=function(){return this.isValid()?this.toISOString():null},s.toISOString=function(){return this.$d.toISOString()},s.toString=function(){return this.$d.toUTCString()},a}(),yt=lt.prototype;return T.prototype=yt,[["$ms",g],["$s",$],["$m",Y],["$H",v],["$W",b],["$M",F],["$y",W],["$D",z]].forEach(function(a){yt[a[1]]=function(s){return this.$g(s,a[0],a[1])}}),T.extend=function(a,s){return a.$i||(a(s,lt,T),a.$i=!0),T},T.locale=ft,T.isDayjs=Mt,T.unix=function(a){return T(1e3*a)},T.en=B[j],T.Ls=B,T.p={},T})})(V);var Lt=V.exports;const Ot=y(Lt),gt=(l,n="MM/DD HH:mm")=>Ot(l).format(n),wt=(l,n)=>{let r,i=0;return(...f)=>{const g=Date.now(),$=g-i;!i||$>=n?(i=g,l.apply(void 0,f)):r||(r=setTimeout(()=>{i=g,l.apply(void 0,f),r=null},n-$))}},Et=(l,n)=>{const r=document.createElement("canvas");r.width=r.height=1;const i=r.getContext("2d");i.fillStyle=l,i.fillRect(0,0,1,1);const f=i.getImageData(0,0,1,1).data;return`rgba(${f[0]}, ${f[1]}, ${f[2]}, ${n})`},_t=({xCenterPoint:l,cfg:n,timePerPixel:r,timeSpacing:i,currentTime:f,$canvas:g,screenScaleCount:$,scaleHeight:Y,startTime:v,drawLine:b,drawText:S,drawArea:F})=>{const L=({space:W,scaleFormat:z,bgFormat:ct,currentFormat:$t})=>{S({x:g.width-l/10,y:6,text:gt(f,ct),fontSize:`${g.height-5}px`,align:"right",baseLine:"top",color:n.bgTextColor});const ut=v%i,vt=ut/r;for(let I=0;I<$;I++){const Q=I*n.scaleSpacing-vt-n.pointWidth/2,j=v+I*i-ut;if(j%(i*W)===0){b({x:Q,y:Y.long}),S({x:Q,y:g.height-Y.long-5,text:gt(j,z),baseLine:"bottom"});continue}b({x:Q,y:Y.short})}b({x:l-n.pointWidth/2,y:g.height,width:n.pointWidth,color:n.pointColor}),F({startX:l-50,startY:4,endX:l+50,endY:18,bgColor:n.pointColor}),S({x:l,y:6,text:gt(f,$t),align:"center",baseLine:"top"})};i<100?L({space:10,scaleFormat:"mm:ss:SSS",bgFormat:"YYYY/MM/DD",currentFormat:"HH:mm:ss:SSS"}):i<1e3?L({space:10,scaleFormat:"mm:ss",bgFormat:"YYYY/MM/DD",currentFormat:"HH:mm:ss:SSS"}):i<1e4?L({space:10,scaleFormat:"mm:ss",bgFormat:"YYYY/MM/DD",currentFormat:"HH:mm:ss"}):i<6e4?L({space:12,scaleFormat:"HH:mm:ss",bgFormat:"YYYY/MM/DD",currentFormat:"HH:mm:ss"}):i<6e5?L({space:10,scaleFormat:"HH:mm:ss",bgFormat:"YYYY/MM/DD",currentFormat:"HH:mm:ss"}):i<36e5?L({space:12,scaleFormat:"MM/DD HH:mm",bgFormat:"YYYY/MM",currentFormat:"MM/DD HH:mm:ss"}):i<864e5?L({space:12,scaleFormat:"MM/DD HH:mm",bgFormat:"YYYY/MM",currentFormat:"YYYY/MM/DD HH:mm"}):i<6048e5?L({space:10,scaleFormat:"YYYY/MM/DD",bgFormat:"YYYY",currentFormat:"YYYY/MM/DD"}):L({space:10,scaleFormat:"YYYY/MM/DD",bgFormat:"YYYY",currentFormat:"YYYY/MM/DD"})},At={fill:!0,width:1e3,height:60,bgColor:"rgba(0,0,0,0.5)",areaBgColor:"#ffffff55",textColor:"#ffffff",scaleColor:"#ffffff",pointColor:"#00aeec",pointWidth:3,scaleSpacing:7,fps:60,zoom:3,timeSpacingList:[10,100,1e3,1e4,6e4,6e5,36e5,864e5,6048e5]};class Wt{constructor(n,r){H(this,st);H(this,it);H(this,nt);H(this,rt);H(this,at);H(this,ot);H(this,G);H(this,R);H(this,ht);et(this,"$canvas");et(this,"ctx");et(this,"$canvasParent");et(this,"cfg");H(this,J,p());H(this,E,0);H(this,P,void 0);H(this,w,void 0);H(this,U,void 0);H(this,Z,!1);if(!n)throw new Error("canvas Element Or Element ID is required!");if(typeof n=="string"?this.$canvas=document.querySelector(n):this.$canvas=n,!(this.$canvas instanceof HTMLCanvasElement))throw new Error("element must be canvas!");this.ctx=this.$canvas.getContext("2d"),this.cfg={...At,...r};const{fill:i,width:f,height:g,zoom:$,timeSpacingList:Y,scaleHeight:v,textColor:b}=this.cfg;if(this.cfg.bgTextColor=Et(b,.18),$<0||$>=Y.length||$%1!==0)throw new Error(`zoom must be 0 ~ ${Y.length-1}, and must be an integer`);if(i){const S=this.$canvas.parentElement;this.$canvasParent=S,this.$canvas.width=S.clientWidth,this.$canvas.height=S.clientHeight,new ResizeObserver(wt(_(this,nt,St).bind(this),200)).observe(S)}else f&&(this.$canvas.width=f),g&&(this.$canvas.height=g);A(this,w,Y[$]),v!=null&&v.long&&(v!=null&&v.short)?A(this,U,v):A(this,U,{long:this.$canvas.height/3,medium:this.$canvas.height/6,short:this.$canvas.height/10}),this.draw(),this.$canvas.addEventListener("wheel",_(this,it,bt).bind(this),{passive:!1}),this.$canvas.addEventListener("mousedown",_(this,st,xt).bind(this))}draw({currentTime:n,areas:r,_privateFlag:i}={}){if(u(this,Z)&&!i)return;A(this,E,n||Date.now()),A(this,P,r||[]);const f=Math.ceil(this.$canvas.width/this.cfg.scaleSpacing),g=f*u(this,w),$=u(this,E)-g/2,Y=u(this,E)+g/2,v=this.$canvas.width/2,b=g/this.$canvas.width;_(this,rt,Tt).call(this),_(this,R,mt).call(this,{startX:0,startY:0,endX:this.$canvas.width,endY:this.$canvas.height,bgColor:this.cfg.bgColor}),u(this,P).forEach(S=>{const F=S.startTime<$?0:Math.floor((S.startTime-$)/b),L=S.endTime>Y?this.$canvas.width:Math.floor((S.endTime-$)/b);_(this,R,mt).call(this,{startX:F,startY:0,endX:L,endY:this.$canvas.height,bgColor:S.bgColor||this.cfg.areaBgColor})}),_t.bind(this)({xCenterPoint:v,screenScaleCount:f,startTime:$,timePerPixel:b,scaleHeight:u(this,U),timeSpacing:u(this,w),currentTime:u(this,E),$canvas:this.$canvas,cfg:this.cfg,drawLine:_(this,ot,Ct).bind(this),drawText:_(this,G,Dt).bind(this),drawArea:_(this,R,mt).bind(this)}),_(this,at,Ft).call(this)}getCurrentTime(){return u(this,E)}on(n,r){u(this,J).on(n,r)}off(n,r){u(this,J).off(n,r)}}return J=new WeakMap,E=new WeakMap,P=new WeakMap,w=new WeakMap,U=new WeakMap,Z=new WeakMap,st=new WeakSet,xt=function(n){A(this,Z,!0);let r=0,i=u(this,E);const f=wt(({offsetX:Y})=>{if(!u(this,Z))return;const v=Y-n.offsetX;i=Math.round(u(this,E)-u(this,w)/this.cfg.scaleSpacing*(v-r)),r=v,this.draw({currentTime:i,areas:u(this,P),_privateFlag:!0})},1e3/this.cfg.fps),g=({offsetX:Y,offsetY:v})=>{(Y<3||Y>this.$canvas.width-3||v<3||v>this.$canvas.height-3)&&(this.$canvas.removeEventListener("mousemove",f),this.$canvas.removeEventListener("mousemove",g))},$=()=>{this.$canvas.removeEventListener("mousemove",f),this.$canvas.removeEventListener("mousemove",g),document.removeEventListener("mouseup",$),A(this,Z,!1),_(this,ht,Ht).call(this,"dragged",i)};this.$canvas.addEventListener("mousemove",f),this.$canvas.addEventListener("mousemove",g),document.addEventListener("mouseup",$)},it=new WeakSet,bt=function(n){n.preventDefault();const r=this.cfg.timeSpacingList.findIndex(i=>i===u(this,w));n.deltaY<0&&r>0?(A(this,w,this.cfg.timeSpacingList[r-1]),this.draw({currentTime:u(this,E),areas:u(this,P),_privateFlag:!0})):n.deltaY>0&&r<this.cfg.timeSpacingList.length-1&&(A(this,w,this.cfg.timeSpacingList[r+1]),this.draw({currentTime:u(this,E),areas:u(this,P),_privateFlag:!0}))},nt=new WeakSet,St=function(){this.$canvasParent&&(this.$canvas.width=this.$canvasParent.clientWidth,this.$canvas.height=this.$canvasParent.clientHeight,this.cfg.scaleHeight||A(this,U,{long:this.$canvas.height/3,medium:this.$canvas.height/6,short:this.$canvas.height/10}),this.draw({currentTime:u(this,E),areas:u(this,P)}))},rt=new WeakSet,Tt=function(){this.ctx.clearRect(0,0,this.$canvas.width,this.$canvas.height)},at=new WeakSet,Ft=function(){const n=()=>u(this,w)<1e3?`${u(this,w)}ms`:u(this,w)<6e4?`${Math.round(u(this,w)/100)/10}sec`:u(this,w)<36e5?`${Math.round(u(this,w)/100/60)/10}min`:u(this,w)<864e5?`${Math.round(u(this,w)/100/60/60)/10}hours`:u(this,w)<6048e5?`${Math.round(u(this,w)/100/60/60/24)/10}days`:`${Math.round(u(this,w)/100/60/60/24/7)/10}weeks`;_(this,G,Dt).call(this,{x:this.cfg.scaleSpacing+12,y:9,text:n(),align:"left",baseLine:"middle"}),this.ctx.beginPath(),this.ctx.moveTo(5,6),this.ctx.lineTo(5,10),this.ctx.lineTo(this.cfg.scaleSpacing+6,10),this.ctx.lineTo(this.cfg.scaleSpacing+6,6),this.ctx.strokeStyle=this.cfg.scaleColor,this.ctx.lineWidth=1.5,this.ctx.stroke()},ot=new WeakSet,Ct=function({x:n,y:r,width:i=1,color:f=this.cfg.scaleColor}){this.ctx.beginPath(),this.ctx.moveTo(n,this.$canvas.height),this.ctx.lineTo(n,this.$canvas.height-r),this.ctx.closePath(),this.ctx.strokeStyle=f,this.ctx.lineWidth=i,this.ctx.stroke()},G=new WeakSet,Dt=function({x:n,y:r,text:i,color:f=this.cfg.textColor,fontSize:g="11px",align:$="center",baseLine:Y="alphabetic"}){this.ctx.beginPath(),this.ctx.font=`${g} Arial`,this.ctx.fillStyle=f,this.ctx.textAlign=$,this.ctx.textBaseline=Y,this.ctx.fillText(i,n,r)},R=new WeakSet,mt=function({startX:n,startY:r,endX:i,endY:f,bgColor:g}){this.ctx.beginPath(),this.ctx.rect(n,r,i-n,f-r),this.ctx.fillStyle=g,this.ctx.fill()},ht=new WeakSet,Ht=function(...n){u(this,J).emit(...n)},Wt}();
var $timeline=function(){var J,_,P,w,U,Z,it,xt,st,bt,nt,St,rt,Tt,at,Ft,ot,Ct,G,Dt,R,mt,ht,Ht;"use strict";var Pt=Object.defineProperty;var kt=(M,p,y)=>p in M?Pt(M,p,{enumerable:!0,configurable:!0,writable:!0,value:y}):M[p]=y;var et=(M,p,y)=>(kt(M,typeof p!="symbol"?p+"":p,y),y),Yt=(M,p,y)=>{if(!p.has(M))throw TypeError("Cannot "+y)};var u=(M,p,y)=>(Yt(M,p,"read from private field"),y?y.call(M):p.get(M)),H=(M,p,y)=>{if(p.has(M))throw TypeError("Cannot add the same private member more than once");p instanceof WeakSet?p.add(M):p.set(M,y)},A=(M,p,y,V)=>(Yt(M,p,"write to private field"),V?V.call(M,y):p.set(M,y),y);var E=(M,p,y)=>(Yt(M,p,"access private method"),y);function M(l){return{all:l=l||new Map,on:function(n,r){var s=l.get(n);s?s.push(r):l.set(n,[r])},off:function(n,r){var s=l.get(n);s&&(r?s.splice(s.indexOf(r)>>>0,1):l.set(n,[]))},emit:function(n,r){var s=l.get(n);s&&s.slice().map(function(f){f(r)}),(s=l.get("*"))&&s.slice().map(function(f){f(n,r)})}}}var p=typeof globalThis<"u"?globalThis:typeof window<"u"?window:typeof global<"u"?global:typeof self<"u"?self:{};function y(l){return l&&l.__esModule&&Object.prototype.hasOwnProperty.call(l,"default")?l.default:l}var V={exports:{}};(function(l,n){(function(r,s){l.exports=s()})(p,function(){var r=1e3,s=6e4,f=36e5,g="millisecond",$="second",Y="minute",v="hour",S="day",F="week",x="month",O="quarter",W="year",z="date",ct="Invalid Date",$t=/^(\d{4})[-/]?(\d{1,2})?[-/]?(\d{0,2})[Tt\s]*(\d{1,2})?:?(\d{1,2})?:?(\d{1,2})?[.:]?(\d+)?$/,ut=/\[([^\]]+)]|Y{1,4}|M{1,4}|D{1,2}|d{1,4}|H{1,2}|h{1,2}|a|A|m{1,2}|s{1,2}|Z{1,2}|SSS/g,vt={name:"en",weekdays:"Sunday_Monday_Tuesday_Wednesday_Thursday_Friday_Saturday".split("_"),months:"January_February_March_April_May_June_July_August_September_October_November_December".split("_"),ordinal:function(a){var i=["th","st","nd","rd"],t=a%100;return"["+a+(i[(t-20)%10]||i[t]||i[0])+"]"}},I=function(a,i,t){var o=String(a);return!o||o.length>=i?a:""+Array(i+1-o.length).join(t)+a},Q={s:I,z:function(a){var i=-a.utcOffset(),t=Math.abs(i),o=Math.floor(t/60),e=t%60;return(i<=0?"+":"-")+I(o,2,"0")+":"+I(e,2,"0")},m:function a(i,t){if(i.date()<t.date())return-a(t,i);var o=12*(t.year()-i.year())+(t.month()-i.month()),e=i.clone().add(o,x),c=t-e<0,h=i.clone().add(o+(c?-1:1),x);return+(-(o+(t-e)/(c?e-h:h-e))||0)},a:function(a){return a<0?Math.ceil(a)||0:Math.floor(a)},p:function(a){return{M:x,y:W,w:F,d:S,D:z,h:v,m:Y,s:$,ms:g,Q:O}[a]||String(a||"").toLowerCase().replace(/s$/,"")},u:function(a){return a===void 0}},j="en",B={};B[j]=vt;var pt=function(a){return a instanceof lt},ft=function a(i,t,o){var e;if(!i)return j;if(typeof i=="string"){var c=i.toLowerCase();B[c]&&(e=c),t&&(B[c]=t,e=c);var h=i.split("-");if(!e&&h.length>1)return a(h[0])}else{var m=i.name;B[m]=i,e=m}return!o&&e&&(j=e),e||!o&&j},T=function(a,i){if(pt(a))return a.clone();var t=typeof i=="object"?i:{};return t.date=a,t.args=arguments,new lt(t)},d=Q;d.l=ft,d.i=pt,d.w=function(a,i){return T(a,{locale:i.$L,utc:i.$u,x:i.$x,$offset:i.$offset})};var lt=function(){function a(t){this.$L=ft(t.locale,null,!0),this.parse(t)}var i=a.prototype;return i.parse=function(t){this.$d=function(o){var e=o.date,c=o.utc;if(e===null)return new Date(NaN);if(d.u(e))return new Date;if(e instanceof Date)return new Date(e);if(typeof e=="string"&&!/Z$/i.test(e)){var h=e.match($t);if(h){var m=h[2]-1||0,b=(h[7]||"0").substring(0,3);return c?new Date(Date.UTC(h[1],m,h[3]||1,h[4]||0,h[5]||0,h[6]||0,b)):new Date(h[1],m,h[3]||1,h[4]||0,h[5]||0,h[6]||0,b)}}return new Date(e)}(t),this.$x=t.x||{},this.init()},i.init=function(){var t=this.$d;this.$y=t.getFullYear(),this.$M=t.getMonth(),this.$D=t.getDate(),this.$W=t.getDay(),this.$H=t.getHours(),this.$m=t.getMinutes(),this.$s=t.getSeconds(),this.$ms=t.getMilliseconds()},i.$utils=function(){return d},i.isValid=function(){return this.$d.toString()!==ct},i.isSame=function(t,o){var e=T(t);return this.startOf(o)<=e&&e<=this.endOf(o)},i.isAfter=function(t,o){return T(t)<this.startOf(o)},i.isBefore=function(t,o){return this.endOf(o)<T(t)},i.$g=function(t,o,e){return d.u(t)?this[o]:this.set(e,t)},i.unix=function(){return Math.floor(this.valueOf()/1e3)},i.valueOf=function(){return this.$d.getTime()},i.startOf=function(t,o){var e=this,c=!!d.u(o)||o,h=d.p(t),m=function(q,L){var N=d.w(e.$u?Date.UTC(e.$y,L,q):new Date(e.$y,L,q),e);return c?N:N.endOf(S)},b=function(q,L){return d.w(e.toDate()[q].apply(e.toDate("s"),(c?[0,0,0,0]:[23,59,59,999]).slice(L)),e)},D=this.$W,C=this.$M,X=this.$D,k="set"+(this.$u?"UTC":"");switch(h){case W:return c?m(1,0):m(31,11);case x:return c?m(1,C):m(0,C+1);case F:var K=this.$locale().weekStart||0,tt=(D<K?D+7:D)-K;return m(c?X-tt:X+(6-tt),C);case S:case z:return b(k+"Hours",0);case v:return b(k+"Minutes",1);case Y:return b(k+"Seconds",2);case $:return b(k+"Milliseconds",3);default:return this.clone()}},i.endOf=function(t){return this.startOf(t,!1)},i.$set=function(t,o){var e,c=d.p(t),h="set"+(this.$u?"UTC":""),m=(e={},e[S]=h+"Date",e[z]=h+"Date",e[x]=h+"Month",e[W]=h+"FullYear",e[v]=h+"Hours",e[Y]=h+"Minutes",e[$]=h+"Seconds",e[g]=h+"Milliseconds",e)[c],b=c===S?this.$D+(o-this.$W):o;if(c===x||c===W){var D=this.clone().set(z,1);D.$d[m](b),D.init(),this.$d=D.set(z,Math.min(this.$D,D.daysInMonth())).$d}else m&&this.$d[m](b);return this.init(),this},i.set=function(t,o){return this.clone().$set(t,o)},i.get=function(t){return this[d.p(t)]()},i.add=function(t,o){var e,c=this;t=Number(t);var h=d.p(o),m=function(C){var X=T(c);return d.w(X.date(X.date()+Math.round(C*t)),c)};if(h===x)return this.set(x,this.$M+t);if(h===W)return this.set(W,this.$y+t);if(h===S)return m(1);if(h===F)return m(7);var b=(e={},e[Y]=s,e[v]=f,e[$]=r,e)[h]||1,D=this.$d.getTime()+t*b;return d.w(D,this)},i.subtract=function(t,o){return this.add(-1*t,o)},i.format=function(t){var o=this,e=this.$locale();if(!this.isValid())return e.invalidDate||ct;var c=t||"YYYY-MM-DDTHH:mm:ssZ",h=d.z(this),m=this.$H,b=this.$m,D=this.$M,C=e.weekdays,X=e.months,k=function(L,N,Mt,dt){return L&&(L[N]||L(o,c))||Mt[N].slice(0,dt)},K=function(L){return d.s(m%12||12,L,"0")},tt=e.meridiem||function(L,N,Mt){var dt=L<12?"AM":"PM";return Mt?dt.toLowerCase():dt},q={YY:String(this.$y).slice(-2),YYYY:d.s(this.$y,4,"0"),M:D+1,MM:d.s(D+1,2,"0"),MMM:k(e.monthsShort,D,X,3),MMMM:k(X,D),D:this.$D,DD:d.s(this.$D,2,"0"),d:String(this.$W),dd:k(e.weekdaysMin,this.$W,C,2),ddd:k(e.weekdaysShort,this.$W,C,3),dddd:C[this.$W],H:String(m),HH:d.s(m,2,"0"),h:K(1),hh:K(2),a:tt(m,b,!0),A:tt(m,b,!1),m:String(b),mm:d.s(b,2,"0"),s:String(this.$s),ss:d.s(this.$s,2,"0"),SSS:d.s(this.$ms,3,"0"),Z:h};return c.replace(ut,function(L,N){return N||q[L]||h.replace(":","")})},i.utcOffset=function(){return 15*-Math.round(this.$d.getTimezoneOffset()/15)},i.diff=function(t,o,e){var c,h=d.p(o),m=T(t),b=(m.utcOffset()-this.utcOffset())*s,D=this-m,C=d.m(this,m);return C=(c={},c[W]=C/12,c[x]=C,c[O]=C/3,c[F]=(D-b)/6048e5,c[S]=(D-b)/864e5,c[v]=D/f,c[Y]=D/s,c[$]=D/r,c)[h]||D,e?C:d.a(C)},i.daysInMonth=function(){return this.endOf(x).$D},i.$locale=function(){return B[this.$L]},i.locale=function(t,o){if(!t)return this.$L;var e=this.clone(),c=ft(t,o,!0);return c&&(e.$L=c),e},i.clone=function(){return d.w(this.$d,this)},i.toDate=function(){return new Date(this.valueOf())},i.toJSON=function(){return this.isValid()?this.toISOString():null},i.toISOString=function(){return this.$d.toISOString()},i.toString=function(){return this.$d.toUTCString()},a}(),yt=lt.prototype;return T.prototype=yt,[["$ms",g],["$s",$],["$m",Y],["$H",v],["$W",S],["$M",x],["$y",W],["$D",z]].forEach(function(a){yt[a[1]]=function(i){return this.$g(i,a[0],a[1])}}),T.extend=function(a,i){return a.$i||(a(i,lt,T),a.$i=!0),T},T.locale=ft,T.isDayjs=pt,T.unix=function(a){return T(1e3*a)},T.en=B[j],T.Ls=B,T.p={},T})})(V);var Ot=V.exports;const Lt=y(Ot),gt=(l,n="MM/DD HH:mm")=>Lt(l).format(n),wt=(l,n)=>{let r,s=0;return(...f)=>{const g=Date.now(),$=g-s;!s||$>=n?(s=g,l.apply(void 0,f)):r||(r=setTimeout(()=>{s=g,l.apply(void 0,f),r=null},n-$))}},_t=(l,n)=>{const r=document.createElement("canvas");r.width=r.height=1;const s=r.getContext("2d");s.fillStyle=l,s.fillRect(0,0,1,1);const f=s.getImageData(0,0,1,1).data;return`rgba(${f[0]}, ${f[1]}, ${f[2]}, ${n})`},Et=({xCenterPoint:l,cfg:n,timePerPixel:r,timeSpacing:s,currentTime:f,$canvas:g,screenScaleCount:$,scaleHeight:Y,startTime:v,drawLine:S,drawText:F,drawArea:x})=>{const O=({space:W,scaleFormat:z,bgFormat:ct,currentFormat:$t})=>{F({x:g.width-l/10,y:6,text:gt(f,ct),fontSize:`${g.height-5}px`,align:"right",baseLine:"top",color:n.bgTextColor});const ut=v%s,vt=ut/r;for(let I=0;I<$;I++){const Q=I*n.scaleSpacing-vt-n.pointWidth/2,j=v+I*s-ut;if(j%(s*W)===0){S({x:Q,y:Y.long}),F({x:Q,y:g.height-Y.long-5,text:gt(j,z),baseLine:"bottom"});continue}S({x:Q,y:Y.short})}S({x:l-n.pointWidth/2,y:g.height,width:n.pointWidth,color:n.pointColor}),x({startX:l-50,startY:4,endX:l+50,endY:18,bgColor:n.pointColor}),F({x:l,y:6,text:gt(f,$t),align:"center",baseLine:"top"})};s<100?O({space:10,scaleFormat:"mm:ss:SSS",bgFormat:"YYYY/MM/DD",currentFormat:"HH:mm:ss:SSS"}):s<1e3?O({space:10,scaleFormat:"mm:ss",bgFormat:"YYYY/MM/DD",currentFormat:"HH:mm:ss:SSS"}):s<1e4?O({space:10,scaleFormat:"mm:ss",bgFormat:"YYYY/MM/DD",currentFormat:"HH:mm:ss"}):s<6e4?O({space:12,scaleFormat:"HH:mm:ss",bgFormat:"YYYY/MM/DD",currentFormat:"HH:mm:ss"}):s<6e5?O({space:10,scaleFormat:"HH:mm:ss",bgFormat:"YYYY/MM/DD",currentFormat:"HH:mm:ss"}):s<36e5?O({space:12,scaleFormat:"MM/DD HH:mm",bgFormat:"YYYY/MM",currentFormat:"MM/DD HH:mm:ss"}):s<864e5?O({space:12,scaleFormat:"MM/DD HH:mm",bgFormat:"YYYY/MM",currentFormat:"YYYY/MM/DD HH:mm"}):s<6048e5?O({space:10,scaleFormat:"YYYY/MM/DD",bgFormat:"YYYY",currentFormat:"YYYY/MM/DD"}):O({space:10,scaleFormat:"YYYY/MM/DD",bgFormat:"YYYY",currentFormat:"YYYY/MM/DD"})},At={fill:!0,width:1e3,height:60,bgColor:"rgba(0,0,0,0.5)",areaBgColor:"#ffffff55",textColor:"#ffffff",scaleColor:"#ffffff",pointColor:"#00aeec",pointWidth:3,scaleSpacing:7,fps:60,zoom:3,timeSpacingList:[10,100,1e3,1e4,6e4,6e5,36e5,864e5,6048e5]};class Wt{constructor(n,r){H(this,it);H(this,st);H(this,nt);H(this,rt);H(this,at);H(this,ot);H(this,G);H(this,R);H(this,ht);et(this,"$canvas");et(this,"ctx");et(this,"$canvasParent");et(this,"cfg");H(this,J,M());H(this,_,0);H(this,P,void 0);H(this,w,void 0);H(this,U,void 0);H(this,Z,!1);if(!n)throw new Error("canvas Element Or Element ID is required!");typeof n=="string"?this.$canvas=document.querySelector(n):this.$canvas=n,this.ctx=this.$canvas.getContext("2d"),this.cfg={...At,...r};const{fill:s,width:f,height:g,zoom:$,timeSpacingList:Y,scaleHeight:v,textColor:S,bgTextColor:F}=this.cfg;if(F||(this.cfg.bgTextColor=_t(S,.18)),$<0||$>=Y.length||$%1!==0)throw new Error(`zoom must be 0 ~ ${Y.length-1}, and must be an integer`);if(s){const x=this.$canvas.parentElement;this.$canvasParent=x,this.$canvas.width=x.clientWidth,this.$canvas.height=x.clientHeight,new ResizeObserver(wt(E(this,nt,St).bind(this),200)).observe(x)}else f&&(this.$canvas.width=f),g&&(this.$canvas.height=g);A(this,w,Y[$]),v!=null&&v.long&&(v!=null&&v.short)?A(this,U,v):A(this,U,{long:this.$canvas.height/3,medium:this.$canvas.height/6,short:this.$canvas.height/10}),this.draw(),this.$canvas.addEventListener("wheel",E(this,st,bt).bind(this),{passive:!1}),this.$canvas.addEventListener("mousedown",E(this,it,xt).bind(this))}draw({currentTime:n,areas:r,_privateFlag:s}={}){if(u(this,Z)&&!s)return;A(this,_,n||Date.now()),A(this,P,r||[]);const f=Math.ceil(this.$canvas.width/this.cfg.scaleSpacing),g=f*u(this,w),$=u(this,_)-g/2,Y=u(this,_)+g/2,v=this.$canvas.width/2,S=g/this.$canvas.width;E(this,rt,Tt).call(this),E(this,R,mt).call(this,{startX:0,startY:0,endX:this.$canvas.width,endY:this.$canvas.height,bgColor:this.cfg.bgColor}),u(this,P).forEach(F=>{const x=F.startTime<$?0:Math.floor((F.startTime-$)/S),O=F.endTime>Y?this.$canvas.width:Math.floor((F.endTime-$)/S);E(this,R,mt).call(this,{startX:x,startY:0,endX:O,endY:this.$canvas.height,bgColor:F.bgColor||this.cfg.areaBgColor})}),Et.bind(this)({xCenterPoint:v,screenScaleCount:f,startTime:$,timePerPixel:S,scaleHeight:u(this,U),timeSpacing:u(this,w),currentTime:u(this,_),$canvas:this.$canvas,cfg:this.cfg,drawLine:E(this,ot,Ct).bind(this),drawText:E(this,G,Dt).bind(this),drawArea:E(this,R,mt).bind(this)}),E(this,at,Ft).call(this)}getCurrentTime(){return u(this,_)}on(n,r){u(this,J).on(n,r)}off(n,r){u(this,J).off(n,r)}}return J=new WeakMap,_=new WeakMap,P=new WeakMap,w=new WeakMap,U=new WeakMap,Z=new WeakMap,it=new WeakSet,xt=function(n){A(this,Z,!0);let r=0,s=u(this,_);const f=wt(({offsetX:Y})=>{if(!u(this,Z))return;const v=Y-n.offsetX;s=Math.round(u(this,_)-u(this,w)/this.cfg.scaleSpacing*(v-r)),r=v,this.draw({currentTime:s,areas:u(this,P),_privateFlag:!0})},1e3/this.cfg.fps),g=({offsetX:Y,offsetY:v})=>{(Y<3||Y>this.$canvas.width-3||v<3||v>this.$canvas.height-3)&&(this.$canvas.removeEventListener("mousemove",f),this.$canvas.removeEventListener("mousemove",g))},$=()=>{this.$canvas.removeEventListener("mousemove",f),this.$canvas.removeEventListener("mousemove",g),document.removeEventListener("mouseup",$),A(this,Z,!1),E(this,ht,Ht).call(this,"dragged",s)};this.$canvas.addEventListener("mousemove",f),this.$canvas.addEventListener("mousemove",g),document.addEventListener("mouseup",$)},st=new WeakSet,bt=function(n){n.preventDefault();const r=this.cfg.timeSpacingList.findIndex(s=>s===u(this,w));n.deltaY<0&&r>0?(A(this,w,this.cfg.timeSpacingList[r-1]),this.draw({currentTime:u(this,_),areas:u(this,P),_privateFlag:!0})):n.deltaY>0&&r<this.cfg.timeSpacingList.length-1&&(A(this,w,this.cfg.timeSpacingList[r+1]),this.draw({currentTime:u(this,_),areas:u(this,P),_privateFlag:!0}))},nt=new WeakSet,St=function(){this.$canvasParent&&(this.$canvas.width=this.$canvasParent.clientWidth,this.$canvas.height=this.$canvasParent.clientHeight,this.cfg.scaleHeight||A(this,U,{long:this.$canvas.height/3,medium:this.$canvas.height/6,short:this.$canvas.height/10}),this.draw({currentTime:u(this,_),areas:u(this,P)}))},rt=new WeakSet,Tt=function(){this.ctx.clearRect(0,0,this.$canvas.width,this.$canvas.height)},at=new WeakSet,Ft=function(){const n=()=>u(this,w)<1e3?`${u(this,w)}ms`:u(this,w)<6e4?`${Math.round(u(this,w)/100)/10}sec`:u(this,w)<36e5?`${Math.round(u(this,w)/100/60)/10}min`:u(this,w)<864e5?`${Math.round(u(this,w)/100/60/60)/10}hours`:u(this,w)<6048e5?`${Math.round(u(this,w)/100/60/60/24)/10}days`:`${Math.round(u(this,w)/100/60/60/24/7)/10}weeks`;E(this,G,Dt).call(this,{x:this.cfg.scaleSpacing+12,y:9,text:n(),align:"left",baseLine:"middle"}),this.ctx.beginPath(),this.ctx.moveTo(5,6),this.ctx.lineTo(5,10),this.ctx.lineTo(this.cfg.scaleSpacing+6,10),this.ctx.lineTo(this.cfg.scaleSpacing+6,6),this.ctx.strokeStyle=this.cfg.scaleColor,this.ctx.lineWidth=1.5,this.ctx.stroke()},ot=new WeakSet,Ct=function({x:n,y:r,width:s=1,color:f=this.cfg.scaleColor}){this.ctx.beginPath(),this.ctx.moveTo(n,this.$canvas.height),this.ctx.lineTo(n,this.$canvas.height-r),this.ctx.closePath(),this.ctx.strokeStyle=f,this.ctx.lineWidth=s,this.ctx.stroke()},G=new WeakSet,Dt=function({x:n,y:r,text:s,color:f=this.cfg.textColor,fontSize:g="11px",align:$="center",baseLine:Y="alphabetic"}){this.ctx.beginPath(),this.ctx.font=`${g} Arial`,this.ctx.fillStyle=f,this.ctx.textAlign=$,this.ctx.textBaseline=Y,this.ctx.fillText(s,n,r)},R=new WeakSet,mt=function({startX:n,startY:r,endX:s,endY:f,bgColor:g}){this.ctx.beginPath(),this.ctx.rect(n,r,s-n,f-r),this.ctx.fillStyle=g,this.ctx.fill()},ht=new WeakSet,Ht=function(...n){u(this,J).emit(...n)},Wt}();

2

dist/timeline.umd.js

@@ -1,1 +0,1 @@

(function($,d){typeof exports=="object"&&typeof module<"u"?module.exports=d():typeof define=="function"&&define.amd?define(d):($=typeof globalThis<"u"?globalThis:$||self,$.$timeline=d())})(this,function(){var J,E,P,w,U,Z,it,xt,st,bt,nt,St,rt,Tt,at,Ft,ot,Ct,G,Dt,R,mt,ht,Ht;"use strict";var Pt=Object.defineProperty;var kt=($,d,y)=>d in $?Pt($,d,{enumerable:!0,configurable:!0,writable:!0,value:y}):$[d]=y;var et=($,d,y)=>(kt($,typeof d!="symbol"?d+"":d,y),y),Yt=($,d,y)=>{if(!d.has($))throw TypeError("Cannot "+y)};var u=($,d,y)=>(Yt($,d,"read from private field"),y?y.call($):d.get($)),H=($,d,y)=>{if(d.has($))throw TypeError("Cannot add the same private member more than once");d instanceof WeakSet?d.add($):d.set($,y)},A=($,d,y,V)=>(Yt($,d,"write to private field"),V?V.call($,y):d.set($,y),y);var _=($,d,y)=>(Yt($,d,"access private method"),y);function $(l){return{all:l=l||new Map,on:function(n,r){var s=l.get(n);s?s.push(r):l.set(n,[r])},off:function(n,r){var s=l.get(n);s&&(r?s.splice(s.indexOf(r)>>>0,1):l.set(n,[]))},emit:function(n,r){var s=l.get(n);s&&s.slice().map(function(f){f(r)}),(s=l.get("*"))&&s.slice().map(function(f){f(n,r)})}}}var d=typeof globalThis<"u"?globalThis:typeof window<"u"?window:typeof global<"u"?global:typeof self<"u"?self:{};function y(l){return l&&l.__esModule&&Object.prototype.hasOwnProperty.call(l,"default")?l.default:l}var V={exports:{}};(function(l,n){(function(r,s){l.exports=s()})(d,function(){var r=1e3,s=6e4,f=36e5,v="millisecond",p="second",Y="minute",M="hour",b="day",S="week",F="month",L="quarter",W="year",z="date",ct="Invalid Date",$t=/^(\d{4})[-/]?(\d{1,2})?[-/]?(\d{0,2})[Tt\s]*(\d{1,2})?:?(\d{1,2})?:?(\d{1,2})?[.:]?(\d+)?$/,ut=/\[([^\]]+)]|Y{1,4}|M{1,4}|D{1,2}|d{1,4}|H{1,2}|h{1,2}|a|A|m{1,2}|s{1,2}|Z{1,2}|SSS/g,vt={name:"en",weekdays:"Sunday_Monday_Tuesday_Wednesday_Thursday_Friday_Saturday".split("_"),months:"January_February_March_April_May_June_July_August_September_October_November_December".split("_"),ordinal:function(a){var i=["th","st","nd","rd"],t=a%100;return"["+a+(i[(t-20)%10]||i[t]||i[0])+"]"}},I=function(a,i,t){var o=String(a);return!o||o.length>=i?a:""+Array(i+1-o.length).join(t)+a},Q={s:I,z:function(a){var i=-a.utcOffset(),t=Math.abs(i),o=Math.floor(t/60),e=t%60;return(i<=0?"+":"-")+I(o,2,"0")+":"+I(e,2,"0")},m:function a(i,t){if(i.date()<t.date())return-a(t,i);var o=12*(t.year()-i.year())+(t.month()-i.month()),e=i.clone().add(o,F),c=t-e<0,h=i.clone().add(o+(c?-1:1),F);return+(-(o+(t-e)/(c?e-h:h-e))||0)},a:function(a){return a<0?Math.ceil(a)||0:Math.floor(a)},p:function(a){return{M:F,y:W,w:S,d:b,D:z,h:M,m:Y,s:p,ms:v,Q:L}[a]||String(a||"").toLowerCase().replace(/s$/,"")},u:function(a){return a===void 0}},j="en",B={};B[j]=vt;var pt=function(a){return a instanceof lt},ft=function a(i,t,o){var e;if(!i)return j;if(typeof i=="string"){var c=i.toLowerCase();B[c]&&(e=c),t&&(B[c]=t,e=c);var h=i.split("-");if(!e&&h.length>1)return a(h[0])}else{var g=i.name;B[g]=i,e=g}return!o&&e&&(j=e),e||!o&&j},T=function(a,i){if(pt(a))return a.clone();var t=typeof i=="object"?i:{};return t.date=a,t.args=arguments,new lt(t)},m=Q;m.l=ft,m.i=pt,m.w=function(a,i){return T(a,{locale:i.$L,utc:i.$u,x:i.$x,$offset:i.$offset})};var lt=function(){function a(t){this.$L=ft(t.locale,null,!0),this.parse(t)}var i=a.prototype;return i.parse=function(t){this.$d=function(o){var e=o.date,c=o.utc;if(e===null)return new Date(NaN);if(m.u(e))return new Date;if(e instanceof Date)return new Date(e);if(typeof e=="string"&&!/Z$/i.test(e)){var h=e.match($t);if(h){var g=h[2]-1||0,x=(h[7]||"0").substring(0,3);return c?new Date(Date.UTC(h[1],g,h[3]||1,h[4]||0,h[5]||0,h[6]||0,x)):new Date(h[1],g,h[3]||1,h[4]||0,h[5]||0,h[6]||0,x)}}return new Date(e)}(t),this.$x=t.x||{},this.init()},i.init=function(){var t=this.$d;this.$y=t.getFullYear(),this.$M=t.getMonth(),this.$D=t.getDate(),this.$W=t.getDay(),this.$H=t.getHours(),this.$m=t.getMinutes(),this.$s=t.getSeconds(),this.$ms=t.getMilliseconds()},i.$utils=function(){return m},i.isValid=function(){return this.$d.toString()!==ct},i.isSame=function(t,o){var e=T(t);return this.startOf(o)<=e&&e<=this.endOf(o)},i.isAfter=function(t,o){return T(t)<this.startOf(o)},i.isBefore=function(t,o){return this.endOf(o)<T(t)},i.$g=function(t,o,e){return m.u(t)?this[o]:this.set(e,t)},i.unix=function(){return Math.floor(this.valueOf()/1e3)},i.valueOf=function(){return this.$d.getTime()},i.startOf=function(t,o){var e=this,c=!!m.u(o)||o,h=m.p(t),g=function(q,O){var N=m.w(e.$u?Date.UTC(e.$y,O,q):new Date(e.$y,O,q),e);return c?N:N.endOf(b)},x=function(q,O){return m.w(e.toDate()[q].apply(e.toDate("s"),(c?[0,0,0,0]:[23,59,59,999]).slice(O)),e)},D=this.$W,C=this.$M,X=this.$D,k="set"+(this.$u?"UTC":"");switch(h){case W:return c?g(1,0):g(31,11);case F:return c?g(1,C):g(0,C+1);case S:var K=this.$locale().weekStart||0,tt=(D<K?D+7:D)-K;return g(c?X-tt:X+(6-tt),C);case b:case z:return x(k+"Hours",0);case M:return x(k+"Minutes",1);case Y:return x(k+"Seconds",2);case p:return x(k+"Milliseconds",3);default:return this.clone()}},i.endOf=function(t){return this.startOf(t,!1)},i.$set=function(t,o){var e,c=m.p(t),h="set"+(this.$u?"UTC":""),g=(e={},e[b]=h+"Date",e[z]=h+"Date",e[F]=h+"Month",e[W]=h+"FullYear",e[M]=h+"Hours",e[Y]=h+"Minutes",e[p]=h+"Seconds",e[v]=h+"Milliseconds",e)[c],x=c===b?this.$D+(o-this.$W):o;if(c===F||c===W){var D=this.clone().set(z,1);D.$d[g](x),D.init(),this.$d=D.set(z,Math.min(this.$D,D.daysInMonth())).$d}else g&&this.$d[g](x);return this.init(),this},i.set=function(t,o){return this.clone().$set(t,o)},i.get=function(t){return this[m.p(t)]()},i.add=function(t,o){var e,c=this;t=Number(t);var h=m.p(o),g=function(C){var X=T(c);return m.w(X.date(X.date()+Math.round(C*t)),c)};if(h===F)return this.set(F,this.$M+t);if(h===W)return this.set(W,this.$y+t);if(h===b)return g(1);if(h===S)return g(7);var x=(e={},e[Y]=s,e[M]=f,e[p]=r,e)[h]||1,D=this.$d.getTime()+t*x;return m.w(D,this)},i.subtract=function(t,o){return this.add(-1*t,o)},i.format=function(t){var o=this,e=this.$locale();if(!this.isValid())return e.invalidDate||ct;var c=t||"YYYY-MM-DDTHH:mm:ssZ",h=m.z(this),g=this.$H,x=this.$m,D=this.$M,C=e.weekdays,X=e.months,k=function(O,N,Mt,dt){return O&&(O[N]||O(o,c))||Mt[N].slice(0,dt)},K=function(O){return m.s(g%12||12,O,"0")},tt=e.meridiem||function(O,N,Mt){var dt=O<12?"AM":"PM";return Mt?dt.toLowerCase():dt},q={YY:String(this.$y).slice(-2),YYYY:m.s(this.$y,4,"0"),M:D+1,MM:m.s(D+1,2,"0"),MMM:k(e.monthsShort,D,X,3),MMMM:k(X,D),D:this.$D,DD:m.s(this.$D,2,"0"),d:String(this.$W),dd:k(e.weekdaysMin,this.$W,C,2),ddd:k(e.weekdaysShort,this.$W,C,3),dddd:C[this.$W],H:String(g),HH:m.s(g,2,"0"),h:K(1),hh:K(2),a:tt(g,x,!0),A:tt(g,x,!1),m:String(x),mm:m.s(x,2,"0"),s:String(this.$s),ss:m.s(this.$s,2,"0"),SSS:m.s(this.$ms,3,"0"),Z:h};return c.replace(ut,function(O,N){return N||q[O]||h.replace(":","")})},i.utcOffset=function(){return 15*-Math.round(this.$d.getTimezoneOffset()/15)},i.diff=function(t,o,e){var c,h=m.p(o),g=T(t),x=(g.utcOffset()-this.utcOffset())*s,D=this-g,C=m.m(this,g);return C=(c={},c[W]=C/12,c[F]=C,c[L]=C/3,c[S]=(D-x)/6048e5,c[b]=(D-x)/864e5,c[M]=D/f,c[Y]=D/s,c[p]=D/r,c)[h]||D,e?C:m.a(C)},i.daysInMonth=function(){return this.endOf(F).$D},i.$locale=function(){return B[this.$L]},i.locale=function(t,o){if(!t)return this.$L;var e=this.clone(),c=ft(t,o,!0);return c&&(e.$L=c),e},i.clone=function(){return m.w(this.$d,this)},i.toDate=function(){return new Date(this.valueOf())},i.toJSON=function(){return this.isValid()?this.toISOString():null},i.toISOString=function(){return this.$d.toISOString()},i.toString=function(){return this.$d.toUTCString()},a}(),yt=lt.prototype;return T.prototype=yt,[["$ms",v],["$s",p],["$m",Y],["$H",M],["$W",b],["$M",F],["$y",W],["$D",z]].forEach(function(a){yt[a[1]]=function(i){return this.$g(i,a[0],a[1])}}),T.extend=function(a,i){return a.$i||(a(i,lt,T),a.$i=!0),T},T.locale=ft,T.isDayjs=pt,T.unix=function(a){return T(1e3*a)},T.en=B[j],T.Ls=B,T.p={},T})})(V);var Lt=V.exports;const Ot=y(Lt),gt=(l,n="MM/DD HH:mm")=>Ot(l).format(n),wt=(l,n)=>{let r,s=0;return(...f)=>{const v=Date.now(),p=v-s;!s||p>=n?(s=v,l.apply(void 0,f)):r||(r=setTimeout(()=>{s=v,l.apply(void 0,f),r=null},n-p))}},Et=(l,n)=>{const r=document.createElement("canvas");r.width=r.height=1;const s=r.getContext("2d");s.fillStyle=l,s.fillRect(0,0,1,1);const f=s.getImageData(0,0,1,1).data;return`rgba(${f[0]}, ${f[1]}, ${f[2]}, ${n})`},_t=({xCenterPoint:l,cfg:n,timePerPixel:r,timeSpacing:s,currentTime:f,$canvas:v,screenScaleCount:p,scaleHeight:Y,startTime:M,drawLine:b,drawText:S,drawArea:F})=>{const L=({space:W,scaleFormat:z,bgFormat:ct,currentFormat:$t})=>{S({x:v.width-l/10,y:6,text:gt(f,ct),fontSize:`${v.height-5}px`,align:"right",baseLine:"top",color:n.bgTextColor});const ut=M%s,vt=ut/r;for(let I=0;I<p;I++){const Q=I*n.scaleSpacing-vt-n.pointWidth/2,j=M+I*s-ut;if(j%(s*W)===0){b({x:Q,y:Y.long}),S({x:Q,y:v.height-Y.long-5,text:gt(j,z),baseLine:"bottom"});continue}b({x:Q,y:Y.short})}b({x:l-n.pointWidth/2,y:v.height,width:n.pointWidth,color:n.pointColor}),F({startX:l-50,startY:4,endX:l+50,endY:18,bgColor:n.pointColor}),S({x:l,y:6,text:gt(f,$t),align:"center",baseLine:"top"})};s<100?L({space:10,scaleFormat:"mm:ss:SSS",bgFormat:"YYYY/MM/DD",currentFormat:"HH:mm:ss:SSS"}):s<1e3?L({space:10,scaleFormat:"mm:ss",bgFormat:"YYYY/MM/DD",currentFormat:"HH:mm:ss:SSS"}):s<1e4?L({space:10,scaleFormat:"mm:ss",bgFormat:"YYYY/MM/DD",currentFormat:"HH:mm:ss"}):s<6e4?L({space:12,scaleFormat:"HH:mm:ss",bgFormat:"YYYY/MM/DD",currentFormat:"HH:mm:ss"}):s<6e5?L({space:10,scaleFormat:"HH:mm:ss",bgFormat:"YYYY/MM/DD",currentFormat:"HH:mm:ss"}):s<36e5?L({space:12,scaleFormat:"MM/DD HH:mm",bgFormat:"YYYY/MM",currentFormat:"MM/DD HH:mm:ss"}):s<864e5?L({space:12,scaleFormat:"MM/DD HH:mm",bgFormat:"YYYY/MM",currentFormat:"YYYY/MM/DD HH:mm"}):s<6048e5?L({space:10,scaleFormat:"YYYY/MM/DD",bgFormat:"YYYY",currentFormat:"YYYY/MM/DD"}):L({space:10,scaleFormat:"YYYY/MM/DD",bgFormat:"YYYY",currentFormat:"YYYY/MM/DD"})},At={fill:!0,width:1e3,height:60,bgColor:"rgba(0,0,0,0.5)",areaBgColor:"#ffffff55",textColor:"#ffffff",scaleColor:"#ffffff",pointColor:"#00aeec",pointWidth:3,scaleSpacing:7,fps:60,zoom:3,timeSpacingList:[10,100,1e3,1e4,6e4,6e5,36e5,864e5,6048e5]};class Wt{constructor(n,r){H(this,it);H(this,st);H(this,nt);H(this,rt);H(this,at);H(this,ot);H(this,G);H(this,R);H(this,ht);et(this,"$canvas");et(this,"ctx");et(this,"$canvasParent");et(this,"cfg");H(this,J,$());H(this,E,0);H(this,P,void 0);H(this,w,void 0);H(this,U,void 0);H(this,Z,!1);if(!n)throw new Error("canvas Element Or Element ID is required!");if(typeof n=="string"?this.$canvas=document.querySelector(n):this.$canvas=n,!(this.$canvas instanceof HTMLCanvasElement))throw new Error("element must be canvas!");this.ctx=this.$canvas.getContext("2d"),this.cfg={...At,...r};const{fill:s,width:f,height:v,zoom:p,timeSpacingList:Y,scaleHeight:M,textColor:b}=this.cfg;if(this.cfg.bgTextColor=Et(b,.18),p<0||p>=Y.length||p%1!==0)throw new Error(`zoom must be 0 ~ ${Y.length-1}, and must be an integer`);if(s){const S=this.$canvas.parentElement;this.$canvasParent=S,this.$canvas.width=S.clientWidth,this.$canvas.height=S.clientHeight,new ResizeObserver(wt(_(this,nt,St).bind(this),200)).observe(S)}else f&&(this.$canvas.width=f),v&&(this.$canvas.height=v);A(this,w,Y[p]),M!=null&&M.long&&(M!=null&&M.short)?A(this,U,M):A(this,U,{long:this.$canvas.height/3,medium:this.$canvas.height/6,short:this.$canvas.height/10}),this.draw(),this.$canvas.addEventListener("wheel",_(this,st,bt).bind(this),{passive:!1}),this.$canvas.addEventListener("mousedown",_(this,it,xt).bind(this))}draw({currentTime:n,areas:r,_privateFlag:s}={}){if(u(this,Z)&&!s)return;A(this,E,n||Date.now()),A(this,P,r||[]);const f=Math.ceil(this.$canvas.width/this.cfg.scaleSpacing),v=f*u(this,w),p=u(this,E)-v/2,Y=u(this,E)+v/2,M=this.$canvas.width/2,b=v/this.$canvas.width;_(this,rt,Tt).call(this),_(this,R,mt).call(this,{startX:0,startY:0,endX:this.$canvas.width,endY:this.$canvas.height,bgColor:this.cfg.bgColor}),u(this,P).forEach(S=>{const F=S.startTime<p?0:Math.floor((S.startTime-p)/b),L=S.endTime>Y?this.$canvas.width:Math.floor((S.endTime-p)/b);_(this,R,mt).call(this,{startX:F,startY:0,endX:L,endY:this.$canvas.height,bgColor:S.bgColor||this.cfg.areaBgColor})}),_t.bind(this)({xCenterPoint:M,screenScaleCount:f,startTime:p,timePerPixel:b,scaleHeight:u(this,U),timeSpacing:u(this,w),currentTime:u(this,E),$canvas:this.$canvas,cfg:this.cfg,drawLine:_(this,ot,Ct).bind(this),drawText:_(this,G,Dt).bind(this),drawArea:_(this,R,mt).bind(this)}),_(this,at,Ft).call(this)}getCurrentTime(){return u(this,E)}on(n,r){u(this,J).on(n,r)}off(n,r){u(this,J).off(n,r)}}return J=new WeakMap,E=new WeakMap,P=new WeakMap,w=new WeakMap,U=new WeakMap,Z=new WeakMap,it=new WeakSet,xt=function(n){A(this,Z,!0);let r=0,s=u(this,E);const f=wt(({offsetX:Y})=>{if(!u(this,Z))return;const M=Y-n.offsetX;s=Math.round(u(this,E)-u(this,w)/this.cfg.scaleSpacing*(M-r)),r=M,this.draw({currentTime:s,areas:u(this,P),_privateFlag:!0})},1e3/this.cfg.fps),v=({offsetX:Y,offsetY:M})=>{(Y<3||Y>this.$canvas.width-3||M<3||M>this.$canvas.height-3)&&(this.$canvas.removeEventListener("mousemove",f),this.$canvas.removeEventListener("mousemove",v))},p=()=>{this.$canvas.removeEventListener("mousemove",f),this.$canvas.removeEventListener("mousemove",v),document.removeEventListener("mouseup",p),A(this,Z,!1),_(this,ht,Ht).call(this,"dragged",s)};this.$canvas.addEventListener("mousemove",f),this.$canvas.addEventListener("mousemove",v),document.addEventListener("mouseup",p)},st=new WeakSet,bt=function(n){n.preventDefault();const r=this.cfg.timeSpacingList.findIndex(s=>s===u(this,w));n.deltaY<0&&r>0?(A(this,w,this.cfg.timeSpacingList[r-1]),this.draw({currentTime:u(this,E),areas:u(this,P),_privateFlag:!0})):n.deltaY>0&&r<this.cfg.timeSpacingList.length-1&&(A(this,w,this.cfg.timeSpacingList[r+1]),this.draw({currentTime:u(this,E),areas:u(this,P),_privateFlag:!0}))},nt=new WeakSet,St=function(){this.$canvasParent&&(this.$canvas.width=this.$canvasParent.clientWidth,this.$canvas.height=this.$canvasParent.clientHeight,this.cfg.scaleHeight||A(this,U,{long:this.$canvas.height/3,medium:this.$canvas.height/6,short:this.$canvas.height/10}),this.draw({currentTime:u(this,E),areas:u(this,P)}))},rt=new WeakSet,Tt=function(){this.ctx.clearRect(0,0,this.$canvas.width,this.$canvas.height)},at=new WeakSet,Ft=function(){const n=()=>u(this,w)<1e3?`${u(this,w)}ms`:u(this,w)<6e4?`${Math.round(u(this,w)/100)/10}sec`:u(this,w)<36e5?`${Math.round(u(this,w)/100/60)/10}min`:u(this,w)<864e5?`${Math.round(u(this,w)/100/60/60)/10}hours`:u(this,w)<6048e5?`${Math.round(u(this,w)/100/60/60/24)/10}days`:`${Math.round(u(this,w)/100/60/60/24/7)/10}weeks`;_(this,G,Dt).call(this,{x:this.cfg.scaleSpacing+12,y:9,text:n(),align:"left",baseLine:"middle"}),this.ctx.beginPath(),this.ctx.moveTo(5,6),this.ctx.lineTo(5,10),this.ctx.lineTo(this.cfg.scaleSpacing+6,10),this.ctx.lineTo(this.cfg.scaleSpacing+6,6),this.ctx.strokeStyle=this.cfg.scaleColor,this.ctx.lineWidth=1.5,this.ctx.stroke()},ot=new WeakSet,Ct=function({x:n,y:r,width:s=1,color:f=this.cfg.scaleColor}){this.ctx.beginPath(),this.ctx.moveTo(n,this.$canvas.height),this.ctx.lineTo(n,this.$canvas.height-r),this.ctx.closePath(),this.ctx.strokeStyle=f,this.ctx.lineWidth=s,this.ctx.stroke()},G=new WeakSet,Dt=function({x:n,y:r,text:s,color:f=this.cfg.textColor,fontSize:v="11px",align:p="center",baseLine:Y="alphabetic"}){this.ctx.beginPath(),this.ctx.font=`${v} Arial`,this.ctx.fillStyle=f,this.ctx.textAlign=p,this.ctx.textBaseline=Y,this.ctx.fillText(s,n,r)},R=new WeakSet,mt=function({startX:n,startY:r,endX:s,endY:f,bgColor:v}){this.ctx.beginPath(),this.ctx.rect(n,r,s-n,f-r),this.ctx.fillStyle=v,this.ctx.fill()},ht=new WeakSet,Ht=function(...n){u(this,J).emit(...n)},Wt});
(function($,d){typeof exports=="object"&&typeof module<"u"?module.exports=d():typeof define=="function"&&define.amd?define(d):($=typeof globalThis<"u"?globalThis:$||self,$.$timeline=d())})(this,function(){var J,_,P,w,U,Z,it,xt,st,bt,nt,St,rt,Tt,at,Ft,ot,Ct,G,Dt,R,mt,ht,Ht;"use strict";var Pt=Object.defineProperty;var kt=($,d,y)=>d in $?Pt($,d,{enumerable:!0,configurable:!0,writable:!0,value:y}):$[d]=y;var et=($,d,y)=>(kt($,typeof d!="symbol"?d+"":d,y),y),Yt=($,d,y)=>{if(!d.has($))throw TypeError("Cannot "+y)};var u=($,d,y)=>(Yt($,d,"read from private field"),y?y.call($):d.get($)),H=($,d,y)=>{if(d.has($))throw TypeError("Cannot add the same private member more than once");d instanceof WeakSet?d.add($):d.set($,y)},A=($,d,y,V)=>(Yt($,d,"write to private field"),V?V.call($,y):d.set($,y),y);var E=($,d,y)=>(Yt($,d,"access private method"),y);function $(l){return{all:l=l||new Map,on:function(n,r){var s=l.get(n);s?s.push(r):l.set(n,[r])},off:function(n,r){var s=l.get(n);s&&(r?s.splice(s.indexOf(r)>>>0,1):l.set(n,[]))},emit:function(n,r){var s=l.get(n);s&&s.slice().map(function(f){f(r)}),(s=l.get("*"))&&s.slice().map(function(f){f(n,r)})}}}var d=typeof globalThis<"u"?globalThis:typeof window<"u"?window:typeof global<"u"?global:typeof self<"u"?self:{};function y(l){return l&&l.__esModule&&Object.prototype.hasOwnProperty.call(l,"default")?l.default:l}var V={exports:{}};(function(l,n){(function(r,s){l.exports=s()})(d,function(){var r=1e3,s=6e4,f=36e5,v="millisecond",p="second",Y="minute",M="hour",S="day",F="week",x="month",O="quarter",W="year",z="date",ct="Invalid Date",$t=/^(\d{4})[-/]?(\d{1,2})?[-/]?(\d{0,2})[Tt\s]*(\d{1,2})?:?(\d{1,2})?:?(\d{1,2})?[.:]?(\d+)?$/,ut=/\[([^\]]+)]|Y{1,4}|M{1,4}|D{1,2}|d{1,4}|H{1,2}|h{1,2}|a|A|m{1,2}|s{1,2}|Z{1,2}|SSS/g,vt={name:"en",weekdays:"Sunday_Monday_Tuesday_Wednesday_Thursday_Friday_Saturday".split("_"),months:"January_February_March_April_May_June_July_August_September_October_November_December".split("_"),ordinal:function(a){var i=["th","st","nd","rd"],t=a%100;return"["+a+(i[(t-20)%10]||i[t]||i[0])+"]"}},I=function(a,i,t){var o=String(a);return!o||o.length>=i?a:""+Array(i+1-o.length).join(t)+a},Q={s:I,z:function(a){var i=-a.utcOffset(),t=Math.abs(i),o=Math.floor(t/60),e=t%60;return(i<=0?"+":"-")+I(o,2,"0")+":"+I(e,2,"0")},m:function a(i,t){if(i.date()<t.date())return-a(t,i);var o=12*(t.year()-i.year())+(t.month()-i.month()),e=i.clone().add(o,x),c=t-e<0,h=i.clone().add(o+(c?-1:1),x);return+(-(o+(t-e)/(c?e-h:h-e))||0)},a:function(a){return a<0?Math.ceil(a)||0:Math.floor(a)},p:function(a){return{M:x,y:W,w:F,d:S,D:z,h:M,m:Y,s:p,ms:v,Q:O}[a]||String(a||"").toLowerCase().replace(/s$/,"")},u:function(a){return a===void 0}},j="en",B={};B[j]=vt;var pt=function(a){return a instanceof lt},ft=function a(i,t,o){var e;if(!i)return j;if(typeof i=="string"){var c=i.toLowerCase();B[c]&&(e=c),t&&(B[c]=t,e=c);var h=i.split("-");if(!e&&h.length>1)return a(h[0])}else{var g=i.name;B[g]=i,e=g}return!o&&e&&(j=e),e||!o&&j},T=function(a,i){if(pt(a))return a.clone();var t=typeof i=="object"?i:{};return t.date=a,t.args=arguments,new lt(t)},m=Q;m.l=ft,m.i=pt,m.w=function(a,i){return T(a,{locale:i.$L,utc:i.$u,x:i.$x,$offset:i.$offset})};var lt=function(){function a(t){this.$L=ft(t.locale,null,!0),this.parse(t)}var i=a.prototype;return i.parse=function(t){this.$d=function(o){var e=o.date,c=o.utc;if(e===null)return new Date(NaN);if(m.u(e))return new Date;if(e instanceof Date)return new Date(e);if(typeof e=="string"&&!/Z$/i.test(e)){var h=e.match($t);if(h){var g=h[2]-1||0,b=(h[7]||"0").substring(0,3);return c?new Date(Date.UTC(h[1],g,h[3]||1,h[4]||0,h[5]||0,h[6]||0,b)):new Date(h[1],g,h[3]||1,h[4]||0,h[5]||0,h[6]||0,b)}}return new Date(e)}(t),this.$x=t.x||{},this.init()},i.init=function(){var t=this.$d;this.$y=t.getFullYear(),this.$M=t.getMonth(),this.$D=t.getDate(),this.$W=t.getDay(),this.$H=t.getHours(),this.$m=t.getMinutes(),this.$s=t.getSeconds(),this.$ms=t.getMilliseconds()},i.$utils=function(){return m},i.isValid=function(){return this.$d.toString()!==ct},i.isSame=function(t,o){var e=T(t);return this.startOf(o)<=e&&e<=this.endOf(o)},i.isAfter=function(t,o){return T(t)<this.startOf(o)},i.isBefore=function(t,o){return this.endOf(o)<T(t)},i.$g=function(t,o,e){return m.u(t)?this[o]:this.set(e,t)},i.unix=function(){return Math.floor(this.valueOf()/1e3)},i.valueOf=function(){return this.$d.getTime()},i.startOf=function(t,o){var e=this,c=!!m.u(o)||o,h=m.p(t),g=function(q,L){var N=m.w(e.$u?Date.UTC(e.$y,L,q):new Date(e.$y,L,q),e);return c?N:N.endOf(S)},b=function(q,L){return m.w(e.toDate()[q].apply(e.toDate("s"),(c?[0,0,0,0]:[23,59,59,999]).slice(L)),e)},D=this.$W,C=this.$M,X=this.$D,k="set"+(this.$u?"UTC":"");switch(h){case W:return c?g(1,0):g(31,11);case x:return c?g(1,C):g(0,C+1);case F:var K=this.$locale().weekStart||0,tt=(D<K?D+7:D)-K;return g(c?X-tt:X+(6-tt),C);case S:case z:return b(k+"Hours",0);case M:return b(k+"Minutes",1);case Y:return b(k+"Seconds",2);case p:return b(k+"Milliseconds",3);default:return this.clone()}},i.endOf=function(t){return this.startOf(t,!1)},i.$set=function(t,o){var e,c=m.p(t),h="set"+(this.$u?"UTC":""),g=(e={},e[S]=h+"Date",e[z]=h+"Date",e[x]=h+"Month",e[W]=h+"FullYear",e[M]=h+"Hours",e[Y]=h+"Minutes",e[p]=h+"Seconds",e[v]=h+"Milliseconds",e)[c],b=c===S?this.$D+(o-this.$W):o;if(c===x||c===W){var D=this.clone().set(z,1);D.$d[g](b),D.init(),this.$d=D.set(z,Math.min(this.$D,D.daysInMonth())).$d}else g&&this.$d[g](b);return this.init(),this},i.set=function(t,o){return this.clone().$set(t,o)},i.get=function(t){return this[m.p(t)]()},i.add=function(t,o){var e,c=this;t=Number(t);var h=m.p(o),g=function(C){var X=T(c);return m.w(X.date(X.date()+Math.round(C*t)),c)};if(h===x)return this.set(x,this.$M+t);if(h===W)return this.set(W,this.$y+t);if(h===S)return g(1);if(h===F)return g(7);var b=(e={},e[Y]=s,e[M]=f,e[p]=r,e)[h]||1,D=this.$d.getTime()+t*b;return m.w(D,this)},i.subtract=function(t,o){return this.add(-1*t,o)},i.format=function(t){var o=this,e=this.$locale();if(!this.isValid())return e.invalidDate||ct;var c=t||"YYYY-MM-DDTHH:mm:ssZ",h=m.z(this),g=this.$H,b=this.$m,D=this.$M,C=e.weekdays,X=e.months,k=function(L,N,Mt,dt){return L&&(L[N]||L(o,c))||Mt[N].slice(0,dt)},K=function(L){return m.s(g%12||12,L,"0")},tt=e.meridiem||function(L,N,Mt){var dt=L<12?"AM":"PM";return Mt?dt.toLowerCase():dt},q={YY:String(this.$y).slice(-2),YYYY:m.s(this.$y,4,"0"),M:D+1,MM:m.s(D+1,2,"0"),MMM:k(e.monthsShort,D,X,3),MMMM:k(X,D),D:this.$D,DD:m.s(this.$D,2,"0"),d:String(this.$W),dd:k(e.weekdaysMin,this.$W,C,2),ddd:k(e.weekdaysShort,this.$W,C,3),dddd:C[this.$W],H:String(g),HH:m.s(g,2,"0"),h:K(1),hh:K(2),a:tt(g,b,!0),A:tt(g,b,!1),m:String(b),mm:m.s(b,2,"0"),s:String(this.$s),ss:m.s(this.$s,2,"0"),SSS:m.s(this.$ms,3,"0"),Z:h};return c.replace(ut,function(L,N){return N||q[L]||h.replace(":","")})},i.utcOffset=function(){return 15*-Math.round(this.$d.getTimezoneOffset()/15)},i.diff=function(t,o,e){var c,h=m.p(o),g=T(t),b=(g.utcOffset()-this.utcOffset())*s,D=this-g,C=m.m(this,g);return C=(c={},c[W]=C/12,c[x]=C,c[O]=C/3,c[F]=(D-b)/6048e5,c[S]=(D-b)/864e5,c[M]=D/f,c[Y]=D/s,c[p]=D/r,c)[h]||D,e?C:m.a(C)},i.daysInMonth=function(){return this.endOf(x).$D},i.$locale=function(){return B[this.$L]},i.locale=function(t,o){if(!t)return this.$L;var e=this.clone(),c=ft(t,o,!0);return c&&(e.$L=c),e},i.clone=function(){return m.w(this.$d,this)},i.toDate=function(){return new Date(this.valueOf())},i.toJSON=function(){return this.isValid()?this.toISOString():null},i.toISOString=function(){return this.$d.toISOString()},i.toString=function(){return this.$d.toUTCString()},a}(),yt=lt.prototype;return T.prototype=yt,[["$ms",v],["$s",p],["$m",Y],["$H",M],["$W",S],["$M",x],["$y",W],["$D",z]].forEach(function(a){yt[a[1]]=function(i){return this.$g(i,a[0],a[1])}}),T.extend=function(a,i){return a.$i||(a(i,lt,T),a.$i=!0),T},T.locale=ft,T.isDayjs=pt,T.unix=function(a){return T(1e3*a)},T.en=B[j],T.Ls=B,T.p={},T})})(V);var Ot=V.exports;const Lt=y(Ot),gt=(l,n="MM/DD HH:mm")=>Lt(l).format(n),wt=(l,n)=>{let r,s=0;return(...f)=>{const v=Date.now(),p=v-s;!s||p>=n?(s=v,l.apply(void 0,f)):r||(r=setTimeout(()=>{s=v,l.apply(void 0,f),r=null},n-p))}},_t=(l,n)=>{const r=document.createElement("canvas");r.width=r.height=1;const s=r.getContext("2d");s.fillStyle=l,s.fillRect(0,0,1,1);const f=s.getImageData(0,0,1,1).data;return`rgba(${f[0]}, ${f[1]}, ${f[2]}, ${n})`},Et=({xCenterPoint:l,cfg:n,timePerPixel:r,timeSpacing:s,currentTime:f,$canvas:v,screenScaleCount:p,scaleHeight:Y,startTime:M,drawLine:S,drawText:F,drawArea:x})=>{const O=({space:W,scaleFormat:z,bgFormat:ct,currentFormat:$t})=>{F({x:v.width-l/10,y:6,text:gt(f,ct),fontSize:`${v.height-5}px`,align:"right",baseLine:"top",color:n.bgTextColor});const ut=M%s,vt=ut/r;for(let I=0;I<p;I++){const Q=I*n.scaleSpacing-vt-n.pointWidth/2,j=M+I*s-ut;if(j%(s*W)===0){S({x:Q,y:Y.long}),F({x:Q,y:v.height-Y.long-5,text:gt(j,z),baseLine:"bottom"});continue}S({x:Q,y:Y.short})}S({x:l-n.pointWidth/2,y:v.height,width:n.pointWidth,color:n.pointColor}),x({startX:l-50,startY:4,endX:l+50,endY:18,bgColor:n.pointColor}),F({x:l,y:6,text:gt(f,$t),align:"center",baseLine:"top"})};s<100?O({space:10,scaleFormat:"mm:ss:SSS",bgFormat:"YYYY/MM/DD",currentFormat:"HH:mm:ss:SSS"}):s<1e3?O({space:10,scaleFormat:"mm:ss",bgFormat:"YYYY/MM/DD",currentFormat:"HH:mm:ss:SSS"}):s<1e4?O({space:10,scaleFormat:"mm:ss",bgFormat:"YYYY/MM/DD",currentFormat:"HH:mm:ss"}):s<6e4?O({space:12,scaleFormat:"HH:mm:ss",bgFormat:"YYYY/MM/DD",currentFormat:"HH:mm:ss"}):s<6e5?O({space:10,scaleFormat:"HH:mm:ss",bgFormat:"YYYY/MM/DD",currentFormat:"HH:mm:ss"}):s<36e5?O({space:12,scaleFormat:"MM/DD HH:mm",bgFormat:"YYYY/MM",currentFormat:"MM/DD HH:mm:ss"}):s<864e5?O({space:12,scaleFormat:"MM/DD HH:mm",bgFormat:"YYYY/MM",currentFormat:"YYYY/MM/DD HH:mm"}):s<6048e5?O({space:10,scaleFormat:"YYYY/MM/DD",bgFormat:"YYYY",currentFormat:"YYYY/MM/DD"}):O({space:10,scaleFormat:"YYYY/MM/DD",bgFormat:"YYYY",currentFormat:"YYYY/MM/DD"})},At={fill:!0,width:1e3,height:60,bgColor:"rgba(0,0,0,0.5)",areaBgColor:"#ffffff55",textColor:"#ffffff",scaleColor:"#ffffff",pointColor:"#00aeec",pointWidth:3,scaleSpacing:7,fps:60,zoom:3,timeSpacingList:[10,100,1e3,1e4,6e4,6e5,36e5,864e5,6048e5]};class Wt{constructor(n,r){H(this,it);H(this,st);H(this,nt);H(this,rt);H(this,at);H(this,ot);H(this,G);H(this,R);H(this,ht);et(this,"$canvas");et(this,"ctx");et(this,"$canvasParent");et(this,"cfg");H(this,J,$());H(this,_,0);H(this,P,void 0);H(this,w,void 0);H(this,U,void 0);H(this,Z,!1);if(!n)throw new Error("canvas Element Or Element ID is required!");typeof n=="string"?this.$canvas=document.querySelector(n):this.$canvas=n,this.ctx=this.$canvas.getContext("2d"),this.cfg={...At,...r};const{fill:s,width:f,height:v,zoom:p,timeSpacingList:Y,scaleHeight:M,textColor:S,bgTextColor:F}=this.cfg;if(F||(this.cfg.bgTextColor=_t(S,.18)),p<0||p>=Y.length||p%1!==0)throw new Error(`zoom must be 0 ~ ${Y.length-1}, and must be an integer`);if(s){const x=this.$canvas.parentElement;this.$canvasParent=x,this.$canvas.width=x.clientWidth,this.$canvas.height=x.clientHeight,new ResizeObserver(wt(E(this,nt,St).bind(this),200)).observe(x)}else f&&(this.$canvas.width=f),v&&(this.$canvas.height=v);A(this,w,Y[p]),M!=null&&M.long&&(M!=null&&M.short)?A(this,U,M):A(this,U,{long:this.$canvas.height/3,medium:this.$canvas.height/6,short:this.$canvas.height/10}),this.draw(),this.$canvas.addEventListener("wheel",E(this,st,bt).bind(this),{passive:!1}),this.$canvas.addEventListener("mousedown",E(this,it,xt).bind(this))}draw({currentTime:n,areas:r,_privateFlag:s}={}){if(u(this,Z)&&!s)return;A(this,_,n||Date.now()),A(this,P,r||[]);const f=Math.ceil(this.$canvas.width/this.cfg.scaleSpacing),v=f*u(this,w),p=u(this,_)-v/2,Y=u(this,_)+v/2,M=this.$canvas.width/2,S=v/this.$canvas.width;E(this,rt,Tt).call(this),E(this,R,mt).call(this,{startX:0,startY:0,endX:this.$canvas.width,endY:this.$canvas.height,bgColor:this.cfg.bgColor}),u(this,P).forEach(F=>{const x=F.startTime<p?0:Math.floor((F.startTime-p)/S),O=F.endTime>Y?this.$canvas.width:Math.floor((F.endTime-p)/S);E(this,R,mt).call(this,{startX:x,startY:0,endX:O,endY:this.$canvas.height,bgColor:F.bgColor||this.cfg.areaBgColor})}),Et.bind(this)({xCenterPoint:M,screenScaleCount:f,startTime:p,timePerPixel:S,scaleHeight:u(this,U),timeSpacing:u(this,w),currentTime:u(this,_),$canvas:this.$canvas,cfg:this.cfg,drawLine:E(this,ot,Ct).bind(this),drawText:E(this,G,Dt).bind(this),drawArea:E(this,R,mt).bind(this)}),E(this,at,Ft).call(this)}getCurrentTime(){return u(this,_)}on(n,r){u(this,J).on(n,r)}off(n,r){u(this,J).off(n,r)}}return J=new WeakMap,_=new WeakMap,P=new WeakMap,w=new WeakMap,U=new WeakMap,Z=new WeakMap,it=new WeakSet,xt=function(n){A(this,Z,!0);let r=0,s=u(this,_);const f=wt(({offsetX:Y})=>{if(!u(this,Z))return;const M=Y-n.offsetX;s=Math.round(u(this,_)-u(this,w)/this.cfg.scaleSpacing*(M-r)),r=M,this.draw({currentTime:s,areas:u(this,P),_privateFlag:!0})},1e3/this.cfg.fps),v=({offsetX:Y,offsetY:M})=>{(Y<3||Y>this.$canvas.width-3||M<3||M>this.$canvas.height-3)&&(this.$canvas.removeEventListener("mousemove",f),this.$canvas.removeEventListener("mousemove",v))},p=()=>{this.$canvas.removeEventListener("mousemove",f),this.$canvas.removeEventListener("mousemove",v),document.removeEventListener("mouseup",p),A(this,Z,!1),E(this,ht,Ht).call(this,"dragged",s)};this.$canvas.addEventListener("mousemove",f),this.$canvas.addEventListener("mousemove",v),document.addEventListener("mouseup",p)},st=new WeakSet,bt=function(n){n.preventDefault();const r=this.cfg.timeSpacingList.findIndex(s=>s===u(this,w));n.deltaY<0&&r>0?(A(this,w,this.cfg.timeSpacingList[r-1]),this.draw({currentTime:u(this,_),areas:u(this,P),_privateFlag:!0})):n.deltaY>0&&r<this.cfg.timeSpacingList.length-1&&(A(this,w,this.cfg.timeSpacingList[r+1]),this.draw({currentTime:u(this,_),areas:u(this,P),_privateFlag:!0}))},nt=new WeakSet,St=function(){this.$canvasParent&&(this.$canvas.width=this.$canvasParent.clientWidth,this.$canvas.height=this.$canvasParent.clientHeight,this.cfg.scaleHeight||A(this,U,{long:this.$canvas.height/3,medium:this.$canvas.height/6,short:this.$canvas.height/10}),this.draw({currentTime:u(this,_),areas:u(this,P)}))},rt=new WeakSet,Tt=function(){this.ctx.clearRect(0,0,this.$canvas.width,this.$canvas.height)},at=new WeakSet,Ft=function(){const n=()=>u(this,w)<1e3?`${u(this,w)}ms`:u(this,w)<6e4?`${Math.round(u(this,w)/100)/10}sec`:u(this,w)<36e5?`${Math.round(u(this,w)/100/60)/10}min`:u(this,w)<864e5?`${Math.round(u(this,w)/100/60/60)/10}hours`:u(this,w)<6048e5?`${Math.round(u(this,w)/100/60/60/24)/10}days`:`${Math.round(u(this,w)/100/60/60/24/7)/10}weeks`;E(this,G,Dt).call(this,{x:this.cfg.scaleSpacing+12,y:9,text:n(),align:"left",baseLine:"middle"}),this.ctx.beginPath(),this.ctx.moveTo(5,6),this.ctx.lineTo(5,10),this.ctx.lineTo(this.cfg.scaleSpacing+6,10),this.ctx.lineTo(this.cfg.scaleSpacing+6,6),this.ctx.strokeStyle=this.cfg.scaleColor,this.ctx.lineWidth=1.5,this.ctx.stroke()},ot=new WeakSet,Ct=function({x:n,y:r,width:s=1,color:f=this.cfg.scaleColor}){this.ctx.beginPath(),this.ctx.moveTo(n,this.$canvas.height),this.ctx.lineTo(n,this.$canvas.height-r),this.ctx.closePath(),this.ctx.strokeStyle=f,this.ctx.lineWidth=s,this.ctx.stroke()},G=new WeakSet,Dt=function({x:n,y:r,text:s,color:f=this.cfg.textColor,fontSize:v="11px",align:p="center",baseLine:Y="alphabetic"}){this.ctx.beginPath(),this.ctx.font=`${v} Arial`,this.ctx.fillStyle=f,this.ctx.textAlign=p,this.ctx.textBaseline=Y,this.ctx.fillText(s,n,r)},R=new WeakSet,mt=function({startX:n,startY:r,endX:s,endY:f,bgColor:v}){this.ctx.beginPath(),this.ctx.rect(n,r,s-n,f-r),this.ctx.fillStyle=v,this.ctx.fill()},ht=new WeakSet,Ht=function(...n){u(this,J).emit(...n)},Wt});

6

package.json
{
"name": "@losting/timeline",
"version": "3.0.0",
"version": "3.0.1",
"description": "Canvas timeline supports zooming, dragging, infinite scrolling, and custom control levels.",

@@ -43,4 +43,4 @@ "type": "module",

"@types/color": "^3.0.3",
"release-it": "^15.10.3",
"typescript": "^5.0.4",
"release-it": "^15.11.0",
"typescript": "^5.1.3",
"vite": "^4.3.9"

@@ -47,0 +47,0 @@ },

46

README.md

@@ -5,3 +5,3 @@ 简体中文 | [English](./README_EN.md)

![预览图](./example/demo.png)
[演示地址](thelostword.github.io/timeline/)
[演示地址](https://thelostword.github.io/timeline/)

@@ -68,20 +68,21 @@ ## 如何使用

### Config
| 属性 | 类型 | 默认值 | 说明 |
| --- | --- | --- | --- |
| fill | boolean | true | 是否适应父容器宽高，若为false则需要手动设定canvas宽高 |
| width | number | 1000 | canvas宽度 |
| height | number | 60 | canvas高度 |
| bgColor | string | rgba(0,0,0,0.5) | canvas背景色 |
| textColor | string | #ffffff | 文字颜色 |
| scaleColor | string | #ffffff | 刻度颜色 |
| scaleSpacing | number | 7 | 刻度间距 |
| areaBgColor | string | #ffffff55 | 阴影区域背景颜色 |
| pointColor | string | #00aeec | 当前时间指针颜色 |
| pointWidth | number | 3 | 当前时间指针宽度 |
| fps | number | 60 | 帧数 |
| zoom | integer | 3 | 初始缩放值，`0` ~ `timeSpacingList.length - 1` 之间(包含)的正整数。 对应 `timeSpacingList` 的索引值 |
| timeSpacingList | number[] | [10, 100, 1000, 10000, 60000, 600000, 3600000, 86400000, 604800000] | 自定义每刻度所占时间（毫秒） |
| ~~maxZoom~~ | - | - | 已移除，设置 `timeSpacingList` 替代 |
| ~~minZoom~~ | - | - | 已移除，设置 `timeSpacingList` 替代 |
| ~~timeFormat~~ | - | - | 已移除 |
| 属性 | 类型 | 是否必填 | 默认值 | 说明 |
| --- | --- | --- | --- | --- |
| fill | boolean | 否 | true | 是否适应父容器宽高，若为false则需要手动设定canvas宽高 |
| width | number | 否 | 1000 | canvas宽度 |
| height | number | 否 | 60 | canvas高度 |
| bgColor | string | 否 | rgba(0,0,0,0.5) | canvas背景色 |
| textColor | string | 否 | #ffffff | 文字颜色 |
| scaleColor | string | 否 | #ffffff | 刻度颜色 |
| scaleSpacing | number | 否 | 7 | 刻度间距 |
| areaBgColor | string | 否 | #ffffff55 | 阴影区域背景颜色 |
| pointColor | string | 否 | #00aeec | 当前时间指针颜色 |
| pointWidth | number | 否 | 3 | 当前时间指针宽度 |
| fps | number | 否 | 60 | 帧数 |
| zoom | integer | 否 | 3 | 初始缩放值，`0` ~ `timeSpacingList.length - 1` 之间(包含)的正整数。 对应 `timeSpacingList` 的索引值 |
| timeSpacingList | number[] | 否 | `[10, 100, 1000, 10000, 60000, 600000, 3600000, 86400000, 604800000]` | 自定义每刻度所占时间（毫秒） |
| scaleHeight | object | 否 | `{ long: this.$canvas.height / 3, short: this.$canvas.height / 10 }` | 刻度高度，如果设置此项，则long、short必填 |
| ~~maxZoom~~ | - | - | - | 已移除，设置 `timeSpacingList` 替代 |
| ~~minZoom~~ | - | - | - | 已移除，设置 `timeSpacingList` 替代 |
| ~~timeFormat~~ | - | - | - | 已移除

@@ -92,5 +93,6 @@ ### Events

| --- | --- | --- |
| draw | timeline 的绘制方法 | draw([DrawConfig](#DrawConfig)) |
| draw | timeline 的自定义绘制方法 | draw([DrawConfig](#DrawConfig)) |
| on | 监听 timeline 内部事件，目前只支持事件名 `dragged`， 拖动结束的回调事件。 | on(name, (listener) => void) |
| off | 取消监听 timeline 内部事件 | off(name, listener)、 取消全部 off('*') |
| getCurrentTime | 获取当前时间 | - |

@@ -101,3 +103,3 @@

| --- | --- | --- | --- | --- |
| currentTime | number | 否 | Date.now() | 中心点指向时间戳（毫秒） |
| currentTime | number | 否 | `Date.now()` | 中心点指向时间戳（毫秒） |
| areas | Object[] | 否 | [] | 阴影区配置，见 [AreaConfig](#AreaConfig) |

@@ -150,2 +152,2 @@

Copyright (c) 2022-present, XiuLiu <https://www.github.com/thelostword>
Copyright (c) 2022-present losting<https://www.github.com/thelostword>

64

types/timeline.d.ts

@@ -1,2 +0,2 @@

export = timeline;
export = timeline.TimeLine;

@@ -32,3 +32,5 @@ declare namespace timeline {

// 时间间距
timeSpacingList: number[],
timeSpacingList?: number[],
// 背景文字颜色
bgTextColor?: string,
}

@@ -49,14 +51,19 @@

class TimeLine {
constructor (el: ElementType, config: ConfigMap);
export class TimeLine {
constructor (el: ElementType, config?: ConfigMap);
/**
* draw methods.
* Custom draw methods.
* ```
* new TimeLine(document.querySelector('#Timeline'), {
* ...
* })
* .draw({...})
* const timeline = new TimeLine('#Timeline');
* timeline.draw({
* currentTime: 1651827817000,
* areas: [{
* startTime: 1651827433000,
* endTime: 1651829413000,
* bgColor: '#f897aa',
* }, ...]
* });
* ```
* Docs: https://github.com/thelostword/timeline#draw
* Docs: https://github.com/thelostword/timeline#Events
*/

@@ -66,10 +73,8 @@ draw(cfg: DrawType): void;

/**
* get time of center point.
* Get the current time.
* ```
* new TimeLine(document.querySelector('#Timeline'), {
* ...
* })
* .getCurrentTime() // => timestamp
* const timeline = new TimeLine('#Timeline');
* timeline.getCurrentTime(); // => timestamp
* ```
* Docs: https://github.com/thelostword/timeline#getCurrentTime
* Docs: https://github.com/thelostword/timeline#Events
*/

@@ -81,10 +86,9 @@ getCurrentTime(): number;

* ```
* new TimeLine(document.querySelector('#Timeline'), {
* ...
* })
* .on('dragend', (timestamp) => {
* ....
* })
* const timeline = new TimeLine('#Timeline');
* const listener = (timestamp) => {
* // ...
* }
* timeline.on('dragend', listener);
* ```
* Docs: https://github.com/thelostword/timeline#on
* Docs: https://github.com/thelostword/timeline#Events
*/

@@ -96,8 +100,12 @@ on(event: DragendEventType, listener: DragendHandler): void;

* ```
* new TimeLine(document.querySelector('#Timeline'), {
* ...
* })
* .off('dragend', listener)
* const timeline = new TimeLine('#Timeline');
* const listener = (timestamp) => {
* // ...
* }
* timeline.on('dragend', listener);
* timeline.off('dragend', listener);
* // Cancel all event listeners
* timeline.off('*');
* ```
* Docs: https://github.com/thelostword/timeline#off
* Docs: https://github.com/thelostword/timeline#Events
*/

@@ -104,0 +112,0 @@ off(event: DragendEventType, listener: DragendHandler): void;

LICENSE

Sorry, the diff of this file is not supported yet

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

About

Packages

npm

Go

Maven

PyPI

Rubygems

Stay in touch

Get open source security insights delivered straight into your inbox.

  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc