@aidenlx/player/dist/media/ui/MediaUiElement.js

Headless web components that make integrating media on the a web a breeze.

import {
  __decorateClass
} from "../../chunks/chunk.S6UZ27SZ.js";
import { IS_IOS, setAttribute } from "@vidstack/foundation";
import {
  html,
  LitElement
} from "lit";
import { state } from "lit/decorators.js";
import { mediaStoreSubscription } from "../store";
import { bindMediaPropsToAttrs, bindMediaPropsToCssProps } from "../style";
import { ViewType } from "../ViewType";
import { mediaUiElementStyles } from "./styles";
class MediaUiElement extends LitElement {
  constructor() {
    super();
    this.__mediaFullscreen = false;
    this.__mediaIsVideoView = false;
    this.__mediaPlaysinline = false;
    mediaStoreSubscription(this, "fullscreen", ($fullscreen) => {
      this.__mediaFullscreen = $fullscreen;
    });
    mediaStoreSubscription(this, "viewType", ($viewType) => {
      this.__mediaIsVideoView = $viewType === ViewType.Video;
    });
    mediaStoreSubscription(this, "playsinline", ($playsinline) => {
      this.__mediaPlaysinline = $playsinline;
    });
    bindMediaPropsToAttrs(this, [
      "autoplay",
      "autoplayError",
      "canLoad",
      "canPlay",
      "canFullscreen",
      "ended",
      "error",
      "fullscreen",
      "idle",
      "loop",
      "mediaType",
      "muted",
      "paused",
      "playing",
      "playsinline",
      "seeking",
      "started",
      "viewType",
      "waiting"
    ]);
    bindMediaPropsToCssProps(this, ["bufferedAmount", "currentTime", "duration", "seekableAmount"]);
  }
  static get styles() {
    return [mediaUiElementStyles];
  }
  static get parts() {
    return [];
  }
  update(changedProperties) {
    setAttribute(this, "hidden", this._isUiHidden());
    super.update(changedProperties);
  }
  render() {
    return this._renderDefaultSlot();
  }
  _renderDefaultSlot() {
    return html`<slot></slot>`;
  }
  _isUiHidden() {
    return IS_IOS && this.__mediaIsVideoView && (!this.__mediaPlaysinline || this.__mediaFullscreen);
  }
}
__decorateClass([
  state()
], MediaUiElement.prototype, "__mediaFullscreen", 2);
__decorateClass([
  state()
], MediaUiElement.prototype, "__mediaIsVideoView", 2);
__decorateClass([
  state()
], MediaUiElement.prototype, "__mediaPlaysinline", 2);
export {
  MediaUiElement
};
//# sourceMappingURL=MediaUiElement.js.map