48 lines
1.1 KiB
JavaScript
48 lines
1.1 KiB
JavaScript
import { Tool } from '../tool.js';
|
|
|
|
export class PlayPause extends Tool {
|
|
playHTML = '<h2>Play</h2>';
|
|
pauseHTML = '<h2>Pause</h2>';
|
|
|
|
constructor(toolbar) {
|
|
super(toolbar);
|
|
|
|
const pauseButton = document.createElement('button');
|
|
const playButton = document.createElement('button');
|
|
|
|
this.div.appendChild(pauseButton);
|
|
this.div.appendChild(playButton);
|
|
|
|
pauseButton.innerHTML = this.pauseHTML;
|
|
playButton.innerHTML = this.playHTML;
|
|
|
|
pauseButton.style.opacity = this.sim.playing ? '100%' : '50%';
|
|
playButton.style.opacity = this.sim.playing ? '50%' : '100%';
|
|
|
|
pauseButton.addEventListener('click', (e) => {
|
|
e.stopPropagation();
|
|
if (this.playing) {
|
|
this.playing = false;
|
|
pauseButton.style.opacity = '50%';
|
|
playButton.style.opacity = '100%';
|
|
}
|
|
});
|
|
|
|
playButton.addEventListener('click', (e) => {
|
|
if (!this.playing) {
|
|
this.playing = true;
|
|
pauseButton.style.opacity = '100%';
|
|
playButton.style.opacity = '50%';
|
|
}
|
|
});
|
|
}
|
|
|
|
get playing() {
|
|
return this.sim.playing;
|
|
}
|
|
|
|
set playing(playing) {
|
|
return this.sim.playing = playing;
|
|
}
|
|
}
|