diff --git a/service2.js b/service2.js
index ed33cb3..2ca3ed3 100644
--- a/service2.js
+++ b/service2.js
@@ -162,11 +162,11 @@ class BesService {
this.statusDiv,
this.hostElement.nextSibling
)
- const statusPopup = document.createElement('bes-popup-status-el')
- document.body.appendChild(statusPopup)
- this.statusDiv.addEventListener('click', e =>
- this.handleStatusClick(e, statusPopup)
- )
+ // const statusPopup = document.createElement('bes-popup-status')
+ // document.body.appendChild(statusPopup)
+ // this.statusDiv.addEventListener('click', e =>
+ // statusPopup.show(e.clientX, e.clientY, this)
+ // )
}
/**
@@ -742,7 +742,7 @@ class BesDOMService extends BesService {
}
}
}
- BesPopupEl.hide()
+ BesPopup.hide()
}
/**
@@ -784,14 +784,17 @@ class BesDOMService extends BesService {
*
* Grammar mistake popup dialog
*
- */
-class BesPopupEl extends HTMLElement {
+ *************************************************************************/
+class BesPopup extends HTMLElement {
constructor() {
super()
this.attachShadow({ mode: 'open' })
}
- render() {
+ /**
+ * Called each time the element is added to the document
+ */
+ connectedCallback() {
this.shadowRoot.innerHTML = `
+//
+// `
+// }
+
+// /**
+// * Shows popup window.
+// *
+// * @param {Number} x X location hint
+// * @param {Number} y Y location hint
+// * @param {BesService} service Grammar checking service
+// */
+// show(x, y, service) {
+// this.style.position = 'fixed'
+// this.style.display = 'block'
+
+// // Element needs some initial placement for the browser to provide this.offsetWidth and this.offsetHeight measurements.
+// // The fade-in effect on the popup window should prevent flicker.
+// this.style.left = `0px`
+// this.style.top = `0px`
+// this.classList.add('show')
+
+// if (x + this.offsetWidth <= window.innerWidth) {
+// this.style.left = `${x}px`
+// } else if (this.offsetWidth <= x) {
+// this.style.left = `${x - this.offsetWidth}px`
+// } else {
+// this.style.left = `${x - this.offsetWidth / 2}px`
+// }
+
+// if (y + 20 + this.offsetHeight <= window.innerHeight) {
+// this.style.top = `${y + 20}px`
+// } else if (this.offsetHeight <= y) {
+// this.style.top = `${y - this.offsetHeight}px`
+// } else {
+// this.style.top = `${y - this.offsetHeight / 2}px`
+// }
+
+// if (service) {
+// const disableButton = this.shadowRoot.querySelector('.bes-service-btn')
+// disableButton.onclick = () => {
+// service.unregister()
+// BesStatusPopup.hide()
+// }
+// }
+// this.classList.add('show')
+// }
+
+// /**
+// * Dismisses all the popups.
+// */
+// static hide() {
+// const popup = document.querySelector('bes-popup-status.show')
+// popup?.classList?.remove('show')
+// }
+// }
+
+// customElements.define('bes-popup-status', BesStatusPopup)
// Auto-register all elements with bes-service class.
window.addEventListener('load', () => {
diff --git a/styles.css b/styles.css
index 37be4e5..0f738dd 100644
--- a/styles.css
+++ b/styles.css
@@ -1,3 +1,5 @@
+/* TODO: Dark mode theme */
+
/* Mistake types styles */
.bes-typo-mistake {
border-bottom: 2px solid red;
@@ -79,17 +81,17 @@
}
.bes-status-icon.bes-status-success {
- background-image: url('/images/checkmark-svgrepo-com.svg');
+ background-image: url('images/checkmark-svgrepo-com.svg');
}
.bes-status-icon.bes-status-loading {
- background-image: url('/images/loading-svgrepo-com.svg');
+ background-image: url('images/loading-svgrepo-com.svg');
}
.bes-status-icon.bes-status-error {
- background-image: url('/images/error-svgrepo-com.svg');
+ background-image: url('images/error-svgrepo-com.svg');
}
.bes-status-icon.bes-status-mistakes {
- background-image: url('/images/mistake-svgrepo-com.svg');
+ background-image: url('images/mistake-svgrepo-com.svg');
}