@nent/core/dist/components/n-video-switch.js

Functional elements to add routing, data-binding, dynamic HTML, declarative actions, audio, video, and so much more. Supercharge static HTML files into web apps without script or builds.

/*!
 * NENT 2022
 */
import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
import { e as eventBus } from './index2.js';
import { g as getDataProvider } from './factory.js';
import { c as createStore } from './index3.js';
import { b as VIDEO_EVENTS } from './interfaces6.js';

/* istanbul ignore file */
const store = createStore({
  autoplay: true,
});
const { state, onChange, reset, dispose } = store;

const VideoSwitch = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
  constructor() {
    super();
    this.__registerHost();
    this.enabledKey = 'autoplay';
    this.storage = null;
    this.autoPlay = true;
    /**
     * The data provider to store the audio-enabled state in.
     */
    this.dataProvider = 'storage';
  }
  async componentWillLoad() {
    this.autoPlay = state.autoplay;
    this.storage = (await getDataProvider(this.dataProvider));
    if (this.storage) {
      const autoplay = await this.storage.get(this.enabledKey);
      state.autoplay = autoplay !== 'false';
    }
    this.videoSubscription = onChange('autoplay', async (a) => {
      var _a;
      this.autoPlay = a;
      await ((_a = this.storage) === null || _a === void 0 ? void 0 : _a.set(this.enabledKey, a.toString()));
      eventBus === null || eventBus === void 0 ? void 0 : eventBus.emit(VIDEO_EVENTS.AutoPlayChanged, a);
    });
  }
  toggleAutoPlay() {
    var _a;
    state.autoplay = ((_a = this.checkbox) === null || _a === void 0 ? void 0 : _a.checked) || false;
  }
  disconnectedCallback() {
    var _a;
    (_a = this.videoSubscription) === null || _a === void 0 ? void 0 : _a.call(this);
  }
  render() {
    return (h(Host, null, h("input", { type: "checkbox", class: this.inputClass, id: this.inputId, ref: e => {
        this.checkbox = e;
      }, onChange: () => this.toggleAutoPlay(), checked: this.autoPlay })));
  }
}, [0, "n-video-switch", {
    "inputClass": [1, "input-class"],
    "inputId": [1, "input-id"],
    "dataProvider": [1, "data-provider"],
    "autoPlay": [32]
  }]);
function defineCustomElement$1() {
  if (typeof customElements === "undefined") {
    return;
  }
  const components = ["n-video-switch"];
  components.forEach(tagName => { switch (tagName) {
    case "n-video-switch":
      if (!customElements.get(tagName)) {
        customElements.define(tagName, VideoSwitch);
      }
      break;
  } });
}

const NVideoSwitch = VideoSwitch;
const defineCustomElement = defineCustomElement$1;

export { NVideoSwitch, defineCustomElement };