53 lines
1.2 KiB
JavaScript
53 lines
1.2 KiB
JavaScript
import {
|
|
TALL_CLASSNAME
|
|
} from '../config.js';
|
|
import {Tool} from '../tool.js';
|
|
|
|
export class PlayPause extends Tool {
|
|
playHTML = 'Play';
|
|
pauseHTML = 'Pause';
|
|
pauseButton = undefined;
|
|
playButton = undefined;
|
|
|
|
updateButtons() {
|
|
this.pauseButton.style.opacity = this.sim.playing ? '100%' : '50%';
|
|
this.playButton.style.opacity = this.sim.playing ? '50%' : '100%';
|
|
}
|
|
|
|
constructor(container) {
|
|
super(container);
|
|
|
|
const pauseButton = document.createElement('button');
|
|
const playButton = document.createElement('button');
|
|
|
|
this.pauseButton = pauseButton;
|
|
this.playButton = playButton;
|
|
|
|
this.div.appendChild(pauseButton);
|
|
this.div.appendChild(playButton);
|
|
|
|
pauseButton.innerHTML = this.pauseHTML;
|
|
playButton.innerHTML = this.playHTML;
|
|
|
|
playButton.classList.add(TALL_CLASSNAME);
|
|
pauseButton.classList.add(TALL_CLASSNAME);
|
|
|
|
this.updateButtons();
|
|
|
|
pauseButton.addEventListener('click', () => {
|
|
this.sim.panning = undefined;
|
|
if (this.sim.playing) {
|
|
this.sim.playing = false;
|
|
this.updateButtons();
|
|
}
|
|
});
|
|
|
|
playButton.addEventListener('click', () => {
|
|
if (!this.sim.playing) {
|
|
this.sim.playing = true;
|
|
this.updateButtons();
|
|
}
|
|
});
|
|
}
|
|
}
|