File size: 2,692 Bytes
09a6f7f |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 |
import Component from '../lib/component.js';
import store from '../store/index.js';
/**
* @classdesc UI component for the main buttons.
*/
export default class MainButtons extends Component {
/**
* @constructor
*/
constructor() {
super({
store,
element: document.querySelector('#mainButtons'),
eventName: 'mainButtonsChange'
});
}
/**
* Renders the run, reset and save buttons.
*/
render() {
const status = store.state.simulationState.status;
let runButton = this.element.querySelector("#runButton");
let resetButton = this.element.querySelector("#resetButton");
let saveEnvButton = this.element.querySelector('#saveEnvButton');
let dict = window.lang_dict[store.state.language]['mainButtons'];
// Disables buttons while drawing
if(store.state.drawingModeState.drawing){
runButton.className = "btn btn-success disabled";
runButton.title = dict['runBtnTooltip'];
resetButton.className = "btn btn-danger disabled";
saveEnvButton.className = "btn btn-primary mx-3 disabled";
}
// Enables buttons when not drawing
else{
// Turns run button into pause button while running
if (status == 'running') {
runButton.className = "btn btn-warning";
runButton.childNodes[0].classList.add("fa-pause");
runButton.childNodes[0].classList.remove("fa-play");
runButton.title = dict['pauseBtnTooltip'];
}
// Turns pause button into run button when not running
else {
runButton.className = "btn btn-success";
runButton.childNodes[0].classList.remove("fa-pause");
runButton.childNodes[0].classList.add("fa-play");
runButton.title = dict['runBtnTooltip'];
}
// Disables save button during intro tour
if(store.state.simulationState.intro_tour){
saveEnvButton.className = "btn btn-primary mx-3 disabled";
}
else{
saveEnvButton.className = "btn btn-primary mx-3";
saveEnvButton.title = dict['saveBtnTooltip'];
}
resetButton.className = "btn btn-danger";
resetButton.title = dict['resetBtnTooltip'];
}
/* Initializes tooltips */
this.element.querySelectorAll('[data-bs-toggle="tooltip"]').forEach((el, index) => {
return new bootstrap.Tooltip(el, {
trigger: 'hover'
});
});
}
}; |