lion/tools/singleton-manager/demo/singleton-complex/node_modules/page-b/page-b.js
2020-12-16 13:25:07 +01:00

49 lines
1.1 KiB
JavaScript

import { LitElement, html, css } from 'lit-element';
import { overlays } from 'overlays/instance.js';
export class PageB extends LitElement {
getInstance(sym, fallback) {
const ev = new CustomEvent('request-instance', {
detail: { key: sym },
bubbles: true,
cancelable: true,
composed: true,
});
this.dispatchEvent(ev);
return ev.detail.instance || fallback();
}
connectedCallback() {
super.connectedCallback();
}
static get styles() {
return css`
:host {
display: block;
padding: 10px;
border: 2px solid #ccc;
}
`;
}
render() {
return html`
<h3>I am page B</h3>
<p>Overlays Status:</p>
<p>Name: ${overlays.name}</p>
<p>Blocked: ${overlays._blockBody}</p>
<button @click=${() => {
overlays.blockBody(); this.requestUpdate();
}}>block</button>
<button @click=${() => {
overlays.unBlockBody(); this.requestUpdate();
}}>un-block</button>
<button @click=${() => {
this.requestUpdate();
}}>refresh</button>
`;
}
}
customElements.define('page-b', PageB);