-
-
Notifications
You must be signed in to change notification settings - Fork 2
/
bootstrap.js
42 lines (36 loc) · 1.77 KB
/
bootstrap.js
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
import Canvas from "./utils/Canvas.js";
window.canvas = new Canvas(document.querySelector('#view'));
let colors = document.querySelector('#container section.bottom.left');
let toolbar = document.querySelector('details[name="toolbar"]');
window.canvas.addEventListener('toolSelected', (name, tool) => {
container.style.setProperty('cursor', name === 'camera' ? 'move' : 'default');
colors !== null && colors.style[(/^(brush|c(urv|ircl)e|ellipse|heart|line|rectangle)$/i.test(name) ? 'remove' : 'set') + 'Property']('display', 'none');
// add setting option to automatically close toolbar
// toolbar.removeAttribute('open');
});
let contextmenu = document.querySelector('context-menu#ctx-menu');
contextmenu !== null && (contextmenu.remove(),
contextmenu.style.removeProperty('display'));
container.addEventListener('contextmenu', event => {
event.preventDefault();
contextmenu !== null && (contextmenu.style.setProperty('left', event.clientX + 'px'),
contextmenu.style.setProperty('top', event.clientY + 'px'),
document.body.appendChild(contextmenu));
});
document.documentElement.addEventListener('pointerdown', function (event) {
this.style.setProperty('--offsetX', event.offsetX);
this.style.setProperty('--offsetY', event.offsetY);
contextmenu !== null && contextmenu.remove();
});
let themeselect = document.querySelector('#theme-select');
if (themeselect !== null) {
themeselect.value = window.canvas.config.theme;
themeselect.addEventListener('change', event => {
window.canvas.config.theme = event.target.value;
});
}
let changes = document.querySelector('#changes');
if (changes !== null) {
let dismissed = window.canvas.config.dismissedNotices.includes('2023-11-23');
dismissed ? changes.remove() : changes.style.removeProperty('display');
}