MultiplayerMinesweeper/client/www/scripts/interface/mainmenu/picker.js

47 lines
1.2 KiB
JavaScript
Raw Normal View History

2022-06-23 19:27:36 +00:00
export class Picker {
constructor(parentID, spriteSheet, ranges, style, selected = null, clickEvent){
this.parentID = parentID
this.selected = selected;
this.buttons = []
const buttonBar = document.getElementById(parentID);
2022-06-23 19:27:36 +00:00
for(let i=0;i < ranges[1]-ranges[0];i++) {
let span = document.createElement('span')
span.className = `button ${style}`
const n = i + ranges[0]
span.appendChild(spriteSheet[n]);
buttonBar.appendChild(span);
span.no = i;
2022-06-23 19:27:36 +00:00
span.addEventListener('click', e => {
this.select(e.target.no);
if (clickEvent instanceof Function) {
clickEvent()
}
});
this.buttons.push(span)
};
if (typeof selected ==="number") {
this.select(selected)
}
2022-06-23 19:27:36 +00:00
}
select(number) {
const target = this.buttons[number]
this.selected = number
document.getElementById(this.parentID).querySelectorAll('.button').forEach(item => {
item.style ="";
item.active ="false";
})
target.style = "background: #4CAF50;"
target.active = "true"
}
2022-06-23 19:27:36 +00:00
}
export function destroy(parentID) {
const buttonBar = document.getElementById(parentID);
while (buttonBar.lastChild) {
buttonBar.removeChild(buttonBar.lastChild)
}
}