2022-07-24 11:20:22 +02:00
|
|
|
import * as Dom from UnitJS.Dom;
|
|
|
|
|
2022-07-25 13:43:47 +02:00
|
|
|
var tool;
|
|
|
|
var colors;
|
2022-07-24 11:20:22 +02:00
|
|
|
|
|
|
|
return {
|
|
|
|
init: init,
|
2022-07-25 13:43:47 +02:00
|
|
|
tool: tool,
|
|
|
|
color: color
|
2022-07-24 11:20:22 +02:00
|
|
|
};
|
|
|
|
|
|
|
|
function init(size, elementId) {
|
2022-07-25 13:43:47 +02:00
|
|
|
root = document.getElementById(elementId || 'toolbox');
|
|
|
|
colors = root.querySelector('#colors');
|
|
|
|
for(var i = 0; i < size; i++) {
|
|
|
|
colors.appendChild(Dom.make('option', {class: 'color' + i}));
|
2022-07-24 11:20:22 +02:00
|
|
|
}
|
2022-07-25 13:43:47 +02:00
|
|
|
colors.addEventListener('change', function() {
|
|
|
|
colors.className = color();
|
2022-07-24 11:20:22 +02:00
|
|
|
});
|
2022-07-25 13:43:47 +02:00
|
|
|
tool = root.querySelector('#tool');
|
2022-07-24 11:20:22 +02:00
|
|
|
}
|
|
|
|
|
2022-07-25 13:43:47 +02:00
|
|
|
function tool() {
|
|
|
|
return tool.value;
|
2022-07-24 11:20:22 +02:00
|
|
|
}
|
|
|
|
|
2022-07-25 13:43:47 +02:00
|
|
|
function color() {
|
|
|
|
return 'color' + colors.selectedIndex;
|
2022-07-24 11:20:22 +02:00
|
|
|
}
|