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.
35 lines
1.2 KiB
35 lines
1.2 KiB
function switch_tool(state, item) { |
|
const tool = item.getAttribute('data-tool'); |
|
|
|
if (state.tools.active_element) { |
|
state.tools.active_element.classList.remove('active'); |
|
} |
|
|
|
state.tools.active = tool; |
|
state.tools.active_element = item; |
|
state.tools.active_element.classList.add('active'); |
|
} |
|
|
|
function switch_color(state, item) { |
|
const color = item.getAttribute('data-color'); |
|
|
|
if (state.colors.active_element) { |
|
state.colors.active_element.classList.remove('active'); |
|
} |
|
|
|
state.colors.active = color_to_u32(color); |
|
state.colors.active_element = item; |
|
state.colors.active_element.classList.add('active'); |
|
} |
|
|
|
function init_tools(state) { |
|
const tools = document.querySelectorAll('.tools .tool'); |
|
const colors = document.querySelectorAll('.pallete .color'); |
|
|
|
tools.forEach((item) => { item.addEventListener('click', () => switch_tool(state, item)); }); |
|
colors.forEach((item) => { item.addEventListener('click', () => switch_color(state, item)); }); |
|
|
|
// TODO: from localstorage |
|
switch_tool(state, document.querySelector('.tool[data-tool="pencil"]')); |
|
switch_color(state, document.querySelector('.color[data-color="000000"]')); |
|
} |