You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

58 lines
1.3 KiB

7 months ago
class Tool {
constructor({name, key, iconPath, mouseDown, mouseMove, mouseDrag, mouseUp, mouseLeave}) {
this.name = name;
this.key = key;
this.iconPath = iconPath;
this.mouseDown = mouseDown;
this.mouseMove = mouseMove;
this.mouseDrag = mouseDrag;
this.mouseUp = mouseUp;
this.mouseLeave = mouseLeave;
}
}
class Tools {
constructor({controllersElement}) {
this.tools = [];
this.activeTool = null;
this.controllersElement = controllersElement;
}
addTool({name, key, iconPath, mouseDown, mouseMove, mouseDrag, mouseUp, mouseLeave}) {
this.tools.push(new Tool({name, key, iconPath, mouseDown, mouseMove, mouseDrag, mouseUp, mouseLeave}));
this.refreshControllers();
return this;
}
setActiveTool({tool}) {
this.activeTool = tool;
return this;
}
getActiveTool() {
return this.activeTool;
}
getTool({key}) {
return this.tools.find(tool => tool.key === key);
}
refreshControllers() {
this.controllersElement.innerHTML = '';
this.tools.forEach(tool => {
const button = document.createElement('div');
button.classList.add('button');
button.classList.add('tool-button');
button.innerHTML = `<img src="${tool.iconPath}" alt="${tool.name}">`;
button.addEventListener('click', () => {
this.setActiveTool({tool});
});
this.controllersElement.appendChild(button);
});
return this;
}
}
export { Tools };