Enhance user-friendliness of popup

This commit is contained in:
Aljaž Grilc 2024-03-15 08:53:32 +01:00
parent acc047f48f
commit 3bb8b6df1c

View File

@ -517,7 +517,7 @@ class BesService {
} }
} }
} }
popup.hide() BesPopupEl.hide()
} }
// This function should be able to handle both cases or find a way that works for both. // This function should be able to handle both cases or find a way that works for both.
@ -722,7 +722,7 @@ class BesPopupEl extends HTMLElement {
</style> </style>
<div class="bes-popup-container"> <div class="bes-popup-container">
<div class="bes-toolbar"> <div class="bes-toolbar">
<button class="bes-close-btn">X</button> <button class="bes-close-btn" onclick="BesPopupEl.hide()">X</button>
</div> </div>
<div class="bes-text-div"> <div class="bes-text-div">
<span class="popup-text"> <span class="popup-text">
@ -767,10 +767,6 @@ class BesPopupEl extends HTMLElement {
} }
} }
hide() {
this.classList.remove('show')
}
changeText(text) { changeText(text) {
this.clear() this.clear()
this.shadowRoot.querySelector('.popup-text').textContent = text this.shadowRoot.querySelector('.popup-text').textContent = text
@ -783,14 +779,16 @@ class BesPopupEl extends HTMLElement {
replacementBtn.textContent = replacement replacementBtn.textContent = replacement
replacementBtn.classList.add('bes-replacement') replacementBtn.classList.add('bes-replacement')
replacementBtn.addEventListener('click', () => { replacementBtn.addEventListener('click', () => {
if (allowReplacements) service.replaceText(el, match, replacement) if (allowReplacements) {
// TODO: Close popup service.replaceText(el, match, replacement)
BesPopupEl.hide()
}
}) })
replacementDiv.appendChild(replacementBtn) replacementDiv.appendChild(replacementBtn)
} }
dragMouseDown(e) { dragMouseDown(e) {
e = e || window.event e = e
e.preventDefault() e.preventDefault()
this.initialMouseX = e.clientX this.initialMouseX = e.clientX
this.initialMouseY = e.clientY this.initialMouseY = e.clientY
@ -843,6 +841,13 @@ class BesPopupEl extends HTMLElement {
this.isMouseDownRegistered = true this.isMouseDownRegistered = true
} }
} }
static hide() {
let popups = document.querySelectorAll('bes-popup-el')
popups.forEach(popup => {
popup.classList.remove('show')
})
}
} }
window.onload = () => { window.onload = () => {