few fixes to ExplorerButoon

This commit is contained in:
jfh
2020-11-10 21:16:42 +01:00
parent d66a22fe4e
commit b692a32f70
2 changed files with 13 additions and 5 deletions

View File

@@ -115,6 +115,7 @@ export class ExplorerButton extends HTMLElement {
this.$overall = this._shadowRoot.querySelector('.overall');
this.$img = this._shadowRoot.querySelector('.menu-button img');
this.$menu = this._shadowRoot.querySelector('.menu');
this.$handle = this._shadowRoot.querySelector('.handle');
this.$lib = this._shadowRoot.querySelector('.image-lib');
this.files = [];
this.request = new XMLHttpRequest();
@@ -250,25 +251,33 @@ export class ExplorerButton extends HTMLElement {
this.currentAction = ev.target;
this.$img.setAttribute('src', this.currentAction.getAttribute('src'));
this.dataset.draw = this.data[this.currentAction.dataset.shape];
this._shadowRoot.querySelectorAll('.image-lib > .pressed').forEach((b) => { b.classList.remove('pressed'); });
this.currentAction.setAttribute('pressed', 'pressed');
// and close the menu
this.$menu.classList.remove('open');
this.$lib.classList.remove('open-lib');
break;
case 'DIV':
this._shadowRoot.querySelectorAll('.menu > .pressed').forEach((b) => { b.classList.remove('pressed'); });
ev.target.classList.add('pressed');
this.updateLib(ev.target.dataset.menu);
if (ev.target.classList[0] === 'handle') {
// this is a click on the handle so let's open/close the menu.
this.$menu.classList.toggle('open');
this.$lib.classList.toggle('open-lib');
} else {
this._shadowRoot.querySelectorAll('.menu > .pressed').forEach((b) => { b.classList.remove('pressed'); });
ev.target.classList.add('pressed');
this.updateLib(ev.target.dataset.menu);
}
break;
default:
// eslint-disable-next-line no-console
console.error('unkonw nodeName for:', ev.target, ev.target.className);
console.error('unknown nodeName for:', ev.target, ev.target.className);
}
};
// capture event from slots
this.addEventListener('click', onClickHandler);
this.$menu.addEventListener('click', onClickHandler);
this.$lib.addEventListener('click', onClickHandler);
this.$handle.addEventListener('click', onClickHandler);
}
/**
* @function updateLib

View File

@@ -210,7 +210,6 @@ export class FlyingButton extends HTMLElement {
this.$img.setAttribute('src', this.activeSlot.getAttribute('src'));
// capture click event on the button to manage the logic
const onClickHandler = (ev) => {
console.log(ev.target);
ev.stopPropagation();
switch (ev.target.nodeName) {
case 'SE-FLYINGBUTTON':