43 lines
1.3 KiB
Plaintext
43 lines
1.3 KiB
Plaintext
{% assign content_type = content_type | default: 'awdawd' %}
|
|
|
|
{% if content_type == 'init' %}
|
|
|
|
<script type="text/javascript">
|
|
// create new html tag called "shx-drehteller"
|
|
|
|
class MyCustomElement extends HTMLElement {
|
|
constructor() {
|
|
super();
|
|
// element functionality written in here
|
|
this.currentVariant = null;
|
|
}
|
|
|
|
connectedCallback() {
|
|
this.attachShadow({ mode: 'open' }); // Attach a shadow root to the element.
|
|
this.shadowRoot.innerHTML = `<div>Hello, world!</div>`; // Add a div to the shadow DOM.
|
|
}
|
|
|
|
disconnectedCallback() {
|
|
// Clean up the element when it is removed from the DOM.
|
|
}
|
|
|
|
reloadCurrentVariant(id) {
|
|
this.currentVariant = id;
|
|
|
|
// edit inner html
|
|
this.shadowRoot.innerHTML = `<div>Current variant: ${this.currentVariant}</div>`;
|
|
}
|
|
|
|
initCurrentVariant(id) {
|
|
this.currentVariant = id;
|
|
|
|
// edit inner html
|
|
this.shadowRoot.innerHTML = `<div>Init variant: ${this.currentVariant}</div>`;
|
|
}
|
|
}
|
|
|
|
customElements.define('shx-drehteller', MyCustomElement);
|
|
</script>
|
|
|
|
|
|
{% endif %} |