@oscarpalmer/timer 0.3.0 → 0.4.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/timer.js +50 -21
- package/package.json +2 -1
- package/src/index.d.ts +1 -0
- package/src/index.ts +73 -32
- package/test/index.html +24 -0
- package/test/test.js +121 -0
package/dist/timer.js
CHANGED
|
@@ -7,51 +7,74 @@ var __publicField = (obj, key, value) => {
|
|
|
7
7
|
};
|
|
8
8
|
|
|
9
9
|
// src/index.ts
|
|
10
|
+
var milliseconds = 1e3 / 60;
|
|
10
11
|
var Timed = class {
|
|
11
|
-
constructor(callback, time, count) {
|
|
12
|
+
constructor(type, callback, time, count) {
|
|
13
|
+
__publicField(this, "callback");
|
|
14
|
+
__publicField(this, "count");
|
|
15
|
+
__publicField(this, "frame");
|
|
16
|
+
__publicField(this, "running", false);
|
|
17
|
+
__publicField(this, "time");
|
|
18
|
+
__publicField(this, "type");
|
|
19
|
+
if (typeof callback !== "function") {
|
|
20
|
+
throw new Error(`A ${type} timer must have a callback function`);
|
|
21
|
+
}
|
|
22
|
+
if (typeof time !== "number" || time < 0) {
|
|
23
|
+
throw new Error(`A ${type} timer must have a non-negative number as its time`);
|
|
24
|
+
}
|
|
25
|
+
if (type === "repeated" && (typeof count !== "number" || count < 2)) {
|
|
26
|
+
throw new Error(`A ${type} timer must have a number above 1 as its repeat count`);
|
|
27
|
+
}
|
|
28
|
+
this.type = type;
|
|
12
29
|
this.callback = callback;
|
|
13
30
|
this.time = time;
|
|
14
31
|
this.count = count;
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
32
|
+
}
|
|
33
|
+
get active() {
|
|
34
|
+
return this.running;
|
|
18
35
|
}
|
|
19
36
|
restart() {
|
|
20
37
|
this.stop();
|
|
21
|
-
this.stopped = false;
|
|
22
38
|
Timed.run(this);
|
|
39
|
+
return this;
|
|
23
40
|
}
|
|
24
41
|
start() {
|
|
25
|
-
if (this.
|
|
26
|
-
|
|
42
|
+
if (this.running) {
|
|
43
|
+
return this;
|
|
27
44
|
}
|
|
45
|
+
Timed.run(this);
|
|
46
|
+
return this;
|
|
28
47
|
}
|
|
29
48
|
stop() {
|
|
30
|
-
this.
|
|
49
|
+
this.running = false;
|
|
31
50
|
if (typeof this.frame === "undefined") {
|
|
32
|
-
return;
|
|
51
|
+
return this;
|
|
33
52
|
}
|
|
34
53
|
window.cancelAnimationFrame(this.frame);
|
|
35
54
|
this.frame = void 0;
|
|
55
|
+
return this;
|
|
36
56
|
}
|
|
37
57
|
static run(timed) {
|
|
38
|
-
|
|
58
|
+
timed.running = true;
|
|
39
59
|
let count = 0;
|
|
40
60
|
let start;
|
|
41
61
|
function step(timestamp) {
|
|
42
|
-
if (timed.
|
|
62
|
+
if (!timed.running) {
|
|
43
63
|
return;
|
|
44
64
|
}
|
|
45
65
|
start ?? (start = timestamp);
|
|
46
66
|
const elapsed = timestamp - start;
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
67
|
+
const elapsedMinimum = elapsed - milliseconds;
|
|
68
|
+
const elapsedMaximum = elapsed + milliseconds;
|
|
69
|
+
if (elapsedMinimum < timed.time && timed.time < elapsedMaximum) {
|
|
70
|
+
if (timed.running) {
|
|
71
|
+
timed.callback(timed.type === "repeated" ? count : void 0);
|
|
50
72
|
}
|
|
51
73
|
count += 1;
|
|
52
|
-
if (timed.
|
|
74
|
+
if (timed.type === "repeated" && count < timed.count) {
|
|
53
75
|
start = void 0;
|
|
54
76
|
} else {
|
|
77
|
+
timed.stop();
|
|
55
78
|
return;
|
|
56
79
|
}
|
|
57
80
|
}
|
|
@@ -61,15 +84,21 @@ var Timed = class {
|
|
|
61
84
|
}
|
|
62
85
|
};
|
|
63
86
|
var Repeated = class extends Timed {
|
|
87
|
+
constructor(callback, time, count) {
|
|
88
|
+
super("repeated", callback, time, count);
|
|
89
|
+
}
|
|
64
90
|
};
|
|
65
91
|
var Waited = class extends Timed {
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
static repeat(callback, time, count) {
|
|
69
|
-
return new Repeated(callback, time, count);
|
|
92
|
+
constructor(callback, time) {
|
|
93
|
+
super("waited", callback, time, 1);
|
|
70
94
|
}
|
|
71
|
-
|
|
72
|
-
|
|
95
|
+
};
|
|
96
|
+
var Timer = {
|
|
97
|
+
repeat: (callback, time, count) => {
|
|
98
|
+
return new Repeated(callback, time, count).start();
|
|
99
|
+
},
|
|
100
|
+
wait: (callback, time) => {
|
|
101
|
+
return new Waited(callback, time).start();
|
|
73
102
|
}
|
|
74
103
|
};
|
|
75
104
|
export {
|
package/package.json
CHANGED
|
@@ -40,6 +40,7 @@
|
|
|
40
40
|
"build": "esbuild ./src/index.ts --bundle --target=es2020 --platform=browser --outfile=./dist/timer.js --format=esm",
|
|
41
41
|
"watch": "esbuild ./src/index.ts --bundle --target=es2020 --platform=browser --outfile=./dist/timer.js --format=esm --watch"
|
|
42
42
|
},
|
|
43
|
+
"type": "module",
|
|
43
44
|
"unpkg": "dist/timer.js",
|
|
44
|
-
"version": "0.
|
|
45
|
+
"version": "0.4.0"
|
|
45
46
|
}
|
package/src/index.d.ts
CHANGED
package/src/index.ts
CHANGED
|
@@ -1,53 +1,81 @@
|
|
|
1
1
|
type RepeatedCallback = (index: number) => void;
|
|
2
|
+
type TimerType = 'repeated' | 'waited';
|
|
2
3
|
type WaitedCallback = () => void;
|
|
3
4
|
|
|
5
|
+
const milliseconds = 1000 / 60;
|
|
6
|
+
|
|
4
7
|
abstract class Timed<Callback> {
|
|
8
|
+
private readonly callback: Callback;
|
|
9
|
+
private readonly count: number;
|
|
5
10
|
private frame: number | undefined;
|
|
6
|
-
private
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
11
|
+
private running = false;
|
|
12
|
+
private readonly time: number;
|
|
13
|
+
private readonly type: TimerType;
|
|
14
|
+
|
|
15
|
+
get active(): boolean {
|
|
16
|
+
return this.running;
|
|
17
|
+
}
|
|
18
|
+
|
|
19
|
+
protected constructor(type: TimerType, callback: Callback, time: number, count: number) {
|
|
20
|
+
if (typeof callback !== 'function') {
|
|
21
|
+
throw new Error(`A ${type} timer must have a callback function`);
|
|
22
|
+
}
|
|
23
|
+
|
|
24
|
+
if (typeof time !== 'number' || time < 0) {
|
|
25
|
+
throw new Error(`A ${type} timer must have a non-negative number as its time`);
|
|
26
|
+
}
|
|
27
|
+
|
|
28
|
+
if (type === 'repeated' && (typeof count !== 'number' || count < 2)) {
|
|
29
|
+
throw new Error(`A ${type} timer must have a number above 1 as its repeat count`);
|
|
30
|
+
}
|
|
31
|
+
|
|
32
|
+
this.type = type;
|
|
33
|
+
this.callback = callback;
|
|
34
|
+
this.time = time;
|
|
35
|
+
this.count = count;
|
|
14
36
|
}
|
|
15
37
|
|
|
16
|
-
restart():
|
|
38
|
+
restart(): Timed<Callback> {
|
|
17
39
|
this.stop();
|
|
18
40
|
|
|
19
|
-
this
|
|
41
|
+
Timed.run(this as never);
|
|
20
42
|
|
|
21
|
-
|
|
43
|
+
return this;
|
|
22
44
|
}
|
|
23
45
|
|
|
24
|
-
start():
|
|
25
|
-
if (this.
|
|
26
|
-
|
|
46
|
+
start(): Timed<Callback> {
|
|
47
|
+
if (this.running) {
|
|
48
|
+
return this;
|
|
27
49
|
}
|
|
50
|
+
|
|
51
|
+
Timed.run(this as never);
|
|
52
|
+
|
|
53
|
+
return this;
|
|
28
54
|
}
|
|
29
55
|
|
|
30
|
-
stop():
|
|
31
|
-
this.
|
|
56
|
+
stop(): Timed<Callback> {
|
|
57
|
+
this.running = false;
|
|
32
58
|
|
|
33
59
|
if (typeof this.frame === 'undefined') {
|
|
34
|
-
return;
|
|
60
|
+
return this;
|
|
35
61
|
}
|
|
36
62
|
|
|
37
63
|
window.cancelAnimationFrame(this.frame);
|
|
38
64
|
|
|
39
65
|
this.frame = undefined;
|
|
66
|
+
|
|
67
|
+
return this;
|
|
40
68
|
}
|
|
41
69
|
|
|
42
70
|
private static run(timed: Timed<(index: number | undefined) => void>): void {
|
|
43
|
-
|
|
71
|
+
timed.running = true;
|
|
44
72
|
|
|
45
73
|
let count = 0;
|
|
46
74
|
|
|
47
75
|
let start: DOMHighResTimeStamp | undefined;
|
|
48
76
|
|
|
49
77
|
function step(timestamp: DOMHighResTimeStamp): void {
|
|
50
|
-
if (timed.
|
|
78
|
+
if (!timed.running) {
|
|
51
79
|
return;
|
|
52
80
|
}
|
|
53
81
|
|
|
@@ -55,16 +83,21 @@ abstract class Timed<Callback> {
|
|
|
55
83
|
|
|
56
84
|
const elapsed = timestamp - start;
|
|
57
85
|
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
86
|
+
const elapsedMinimum = elapsed - milliseconds;
|
|
87
|
+
const elapsedMaximum = elapsed + milliseconds;
|
|
88
|
+
|
|
89
|
+
if (elapsedMinimum < timed.time && timed.time < elapsedMaximum) {
|
|
90
|
+
if (timed.running) {
|
|
91
|
+
timed.callback(timed.type === 'repeated' ? count : undefined);
|
|
61
92
|
}
|
|
62
93
|
|
|
63
94
|
count += 1;
|
|
64
95
|
|
|
65
|
-
if (timed.
|
|
96
|
+
if (timed.type === 'repeated' && count < timed.count) {
|
|
66
97
|
start = undefined;
|
|
67
98
|
} else {
|
|
99
|
+
timed.stop();
|
|
100
|
+
|
|
68
101
|
return;
|
|
69
102
|
}
|
|
70
103
|
}
|
|
@@ -76,16 +109,24 @@ abstract class Timed<Callback> {
|
|
|
76
109
|
}
|
|
77
110
|
}
|
|
78
111
|
|
|
79
|
-
export class Repeated extends Timed<RepeatedCallback> {
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
// eslint-disable-next-line @typescript-eslint/no-extraneous-class
|
|
83
|
-
export class Timer {
|
|
84
|
-
static repeat(callback: RepeatedCallback, time: number, count: number): Repeated {
|
|
85
|
-
return new Repeated(callback, time, count);
|
|
112
|
+
export class Repeated extends Timed<RepeatedCallback> {
|
|
113
|
+
constructor(callback: RepeatedCallback, time: number, count: number) {
|
|
114
|
+
super('repeated', callback, time, count);
|
|
86
115
|
}
|
|
116
|
+
}
|
|
87
117
|
|
|
88
|
-
|
|
89
|
-
|
|
118
|
+
export class Waited extends Timed<WaitedCallback> {
|
|
119
|
+
constructor(callback: WaitedCallback, time: number) {
|
|
120
|
+
super('waited', callback, time, 1);
|
|
90
121
|
}
|
|
91
122
|
}
|
|
123
|
+
|
|
124
|
+
export const Timer = {
|
|
125
|
+
repeat: (callback: RepeatedCallback, time: number, count: number): Repeated => {
|
|
126
|
+
return (new Repeated(callback, time, count)).start();
|
|
127
|
+
},
|
|
128
|
+
|
|
129
|
+
wait: (callback: WaitedCallback, time: number): Waited => {
|
|
130
|
+
return (new Waited(callback, time)).start();
|
|
131
|
+
},
|
|
132
|
+
}
|
package/test/index.html
ADDED
|
@@ -0,0 +1,24 @@
|
|
|
1
|
+
<!DOCTYPE html>
|
|
2
|
+
<html lang="en">
|
|
3
|
+
<head>
|
|
4
|
+
<meta charset="utf-8" />
|
|
5
|
+
<title>Mocha Tests</title>
|
|
6
|
+
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
|
7
|
+
<link rel="stylesheet" href="https://unpkg.com/mocha/mocha.css" />
|
|
8
|
+
</head>
|
|
9
|
+
<body>
|
|
10
|
+
<div id="mocha"></div>
|
|
11
|
+
|
|
12
|
+
<script src="https://unpkg.com/chai/chai.js"></script>
|
|
13
|
+
<script src="https://unpkg.com/mocha/mocha.js"></script>
|
|
14
|
+
|
|
15
|
+
<script class="mocha-init">
|
|
16
|
+
mocha.setup('bdd');
|
|
17
|
+
mocha.checkLeaks();
|
|
18
|
+
</script>
|
|
19
|
+
<script src="test/test.js" type="module"></script>
|
|
20
|
+
<script class="mocha-exec">
|
|
21
|
+
mocha.run();
|
|
22
|
+
</script>
|
|
23
|
+
</body>
|
|
24
|
+
</html>
|
package/test/test.js
ADDED
|
@@ -0,0 +1,121 @@
|
|
|
1
|
+
import {Repeated, Timer, Waited} from '../dist/timer.js';
|
|
2
|
+
|
|
3
|
+
describe('Timer, factory', function () {
|
|
4
|
+
it('should create and start a repeated timer', function () {
|
|
5
|
+
chai.assert.ok(Timer.repeat(() => {}, 0, 2) instanceof Repeated);
|
|
6
|
+
});
|
|
7
|
+
|
|
8
|
+
it('should create and start a waited timer', function () {
|
|
9
|
+
chai.assert.ok(Timer.wait(() => {}, 0) instanceof Waited);
|
|
10
|
+
});
|
|
11
|
+
});
|
|
12
|
+
|
|
13
|
+
describe('Timer, Repeated', function () {
|
|
14
|
+
describe('Constructor', function () {
|
|
15
|
+
it('should create a proper repeated timer', function () {
|
|
16
|
+
chai.assert.ok(new Repeated(() => {}, 0, 2) instanceof Repeated);
|
|
17
|
+
});
|
|
18
|
+
|
|
19
|
+
it('should handle bad parameters', function () {
|
|
20
|
+
chai.assert.throws(function () { new Repeated(null, null, null); }, /callback/);
|
|
21
|
+
chai.assert.throws(function () { new Repeated(() => {}, null, null); }, /time/);
|
|
22
|
+
chai.assert.throws(function () { new Repeated(() => {}, 0, null); }, /count/);
|
|
23
|
+
chai.assert.throws(function () { new Repeated(() => {}, 0, 1); }, /count/);
|
|
24
|
+
});
|
|
25
|
+
});
|
|
26
|
+
|
|
27
|
+
describe('Run', function () {
|
|
28
|
+
it('should run as many times as set', function (done) {
|
|
29
|
+
let value = 0;
|
|
30
|
+
|
|
31
|
+
Timer.repeat(() => {
|
|
32
|
+
value += 1;
|
|
33
|
+
}, 25, 10);
|
|
34
|
+
|
|
35
|
+
Timer.wait(() => {
|
|
36
|
+
chai.assert.equal(value, 10);
|
|
37
|
+
|
|
38
|
+
done();
|
|
39
|
+
}, 500);
|
|
40
|
+
});
|
|
41
|
+
|
|
42
|
+
it('should run until canceled', function (done) {
|
|
43
|
+
let value = 0;
|
|
44
|
+
|
|
45
|
+
const repeated = Timer.repeat(() => {
|
|
46
|
+
value += 1;
|
|
47
|
+
}, 25, 10);
|
|
48
|
+
|
|
49
|
+
Timer.wait(() => {
|
|
50
|
+
repeated.stop();
|
|
51
|
+
}, 125);
|
|
52
|
+
|
|
53
|
+
Timer.wait(() => {
|
|
54
|
+
chai.assert.ok(value < 10);
|
|
55
|
+
|
|
56
|
+
done();
|
|
57
|
+
}, 500);
|
|
58
|
+
});
|
|
59
|
+
});
|
|
60
|
+
});
|
|
61
|
+
|
|
62
|
+
describe('Timer, Waited', function () {
|
|
63
|
+
describe('Constructor', function () {
|
|
64
|
+
it('should create a proper waited timer', function () {
|
|
65
|
+
chai.assert.ok(new Waited(() => {}, 0));
|
|
66
|
+
});
|
|
67
|
+
|
|
68
|
+
it('should handle bad parameters', function () {
|
|
69
|
+
chai.assert.throws(function () { new Waited(null, null); }, /callback/);
|
|
70
|
+
chai.assert.throws(function () { new Waited(() => {}, null); }, /time/);
|
|
71
|
+
});
|
|
72
|
+
});
|
|
73
|
+
});
|
|
74
|
+
|
|
75
|
+
describe('Timer, Repeated & Waited', function () {
|
|
76
|
+
describe('Methods', function () {
|
|
77
|
+
it('should be able to start', function (done) {
|
|
78
|
+
(new Waited(() => {
|
|
79
|
+
done();
|
|
80
|
+
}, 125)).start();
|
|
81
|
+
});
|
|
82
|
+
|
|
83
|
+
it('should be able to stop', function (done) {
|
|
84
|
+
let value = 0;
|
|
85
|
+
|
|
86
|
+
const waited = new Waited(() => {
|
|
87
|
+
value = 1234;
|
|
88
|
+
}, 125);
|
|
89
|
+
|
|
90
|
+
Timer.wait(() => {
|
|
91
|
+
waited.stop();
|
|
92
|
+
}, 250);
|
|
93
|
+
|
|
94
|
+
Timer.wait(() => {
|
|
95
|
+
chai.assert.equal(value, 0);
|
|
96
|
+
|
|
97
|
+
done();
|
|
98
|
+
}, 375);
|
|
99
|
+
});
|
|
100
|
+
|
|
101
|
+
it('should be able to restart', function (done) {
|
|
102
|
+
let value = 0;
|
|
103
|
+
|
|
104
|
+
const waited = new Waited(() => {
|
|
105
|
+
value += 1;
|
|
106
|
+
}, 125);
|
|
107
|
+
|
|
108
|
+
waited.start();
|
|
109
|
+
|
|
110
|
+
Timer.wait(() => {
|
|
111
|
+
waited.restart();
|
|
112
|
+
}, 250);
|
|
113
|
+
|
|
114
|
+
Timer.wait(() => {
|
|
115
|
+
chai.assert.equal(value, 2);
|
|
116
|
+
|
|
117
|
+
done();
|
|
118
|
+
}, 500);
|
|
119
|
+
});
|
|
120
|
+
});
|
|
121
|
+
});
|