Pulse Generator
Implements a pulse generator using
by Kees C. Bakker
HTML
<h1>
Stopwatch example - Strongly Typed Events for TypeScript
</h1>
<p>
See <a href="http://keestalkstech.com/2016/03/strongly-typed-event-handlers-in-typescript-part-1/">Strongly typed event handlers in TypeScript (Part 1)</a> for more information.
</p>
<p id="display"></p>
<p id="action"></p>
<p>
<button onclick="sw.start();">Start</button>
<button onclick="sw.pause();">Pause</button>
<button onclick="sw.reset();">Reset</button>
</p>
<p>
© Kees C. Bakker - <a href="http://keestalkstech.com">KeesTalksTech</a>
</p>
CSS
* {
font-family: Arial;
}
body {
font-size: 12px;
}
TypeScript
window.onload = function() {
sw = new Stopwatch();
sw.onStart.subscribe((sender, args) => {
document.getElementById('action').innerHTML =
'Stopwatch started after ' + args.display + '.';
});
sw.onPause.subscribe((sender, args) => {
document.getElementById('action').innerHTML =
'Paused after ' + args.display + '.';
});
sw.onReset.subscribe((sender, args) => {
document.getElementById('action').innerHTML =
'Clock reset!';
});
sw.start();
window.setTimeout(function () {
sw.pause();
}, 3000);
window.setTimeout(function () {
sw.start();
}, 4000);
window.setInterval(()=>{
document.getElementById('display').innerHTML = sw.display();
}, 100);
}
class Stopwatch {
private _events: EventList<Stopwatch, StopwatchEventArgs> = new EventList<Stopwatch, StopwatchEventArgs>();
private _ticks: number = 0;
private _timer: number;
get onStart(): IEvent<Stopwatch, StopwatchEventArgs> {
return this._events.get('onStart');
}
get onPause(): IEvent<Stopwatch, StopwatchEventArgs> {
return this._events.get('onPause');
}
get onReset(): IEvent<Stopwatch, StopwatchEventArgs> {
return this._events.get('onReset');
}
private dispatch(name: string) {
this._events.get(name).dispatch(
this,
new StopwatchEventArgs(this._ticks, this.display())
);
}
start(): void {
if (this._timer == null) {
this._timer = Date.now();
this.dispatch('onStart');
}
}
pause(): void {
if (this._timer) {
this._ticks = this.getTicks();
this._timer = null;
this.dispatch('onPause');
}
}
reset(): void {
this._ticks = 0;
this._timer = Date.now();
this.dispatch('onReset');
}
getTicks(): number {
if (this._timer) {
return (Date.now() - this._timer) + this._ticks;
...