@arcgis/map-components/dist/components/arcgis-video-player-controls-group/customElement.js

ArcGIS Map Components

/* COPYRIGHT Esri - https://js.arcgis.com/5.1/LICENSE.txt */
import { c as b } from "../../chunks/runtime.js";
import { html as i } from "lit";
import { watch as w } from "@arcgis/core/core/reactiveUtils.js";
import { LitElement as h } from "@arcgis/lumina";
function u(a) {
  return a.followingMode === "none" ? "circle-disallowed" : a.followingMode === "follow-sensor" ? "zoom-to-object" : a.followingMode === "follow-frame" ? "follow" : "video";
}
class v extends h {
  constructor() {
    super(...arguments), this._disabled = !1;
  }
  static {
    this.properties = { _disabled: 16, viewModel: 0, toggleMetadata: 0, messages: 0 };
  }
  loaded() {
    this.manager.onLifecycle(() => [
      w(() => this.viewModel.state, (e) => {
        this._disabled = e === "not-ready" || e === "waiting";
      }, { initial: !0 })
    ]);
  }
  render() {
    const { viewModel: e, messages: l, _disabled: o } = this, t = e.currentTime > 0, c = !!e.layer?.telemetry?.sensorLocation, n = !!e.layer?.telemetry?.sensorPath, r = !!e.layer?.telemetry?.sensorTrail, d = !!e.layer?.telemetry?.lineOfSight, m = !!e.layer?.telemetry?.frameCenter, s = !!e.layer?.telemetry?.frameOutline, g = !!e.layer?.groundControlPoints, $ = i`<div><calcite-popover auto-close .label=${l.layers} overlay-positioning=fixed placement=top-end pointer-disabled reference-element=layers-action scale=s><calcite-panel .heading=${l.layers}><calcite-list .label=${l.layers} selection-mode=multiple><calcite-list-item .disabled=${t && !c} .label=${l.sensor} @click=${() => {
      e.toggleSensorDisplay();
    }} .selected=${!!e.layer?.telemetryDisplay?.sensorLocation}></calcite-list-item><calcite-list-item .disabled=${t && !d} .label=${l.sightLine} @click=${() => {
      e.toggleSensorSightLineDisplay();
    }} .selected=${!!e.layer?.telemetryDisplay?.lineOfSight}></calcite-list-item><calcite-list-item .disabled=${t && !n} .label=${l.sensorPath} @click=${() => {
      e.toggleSensorPathDisplay();
    }} .selected=${!!e.layer?.telemetryDisplay?.sensorPath}></calcite-list-item><calcite-list-item .disabled=${t && !r} .label=${l.sensorTrail} @click=${() => {
      e.toggleSensorTrailDisplay();
    }} .selected=${!!e.layer?.telemetryDisplay?.sensorTrail}></calcite-list-item><calcite-list-item .disabled=${t && !m} .label=${l.frameCenter} @click=${() => {
      e.toggleFrameCenterDisplay();
    }} .selected=${!!e.layer?.telemetryDisplay?.frameCenter}></calcite-list-item><calcite-list-item .disabled=${t && !s} .label=${l.frameOutline} @click=${() => {
      e.toggleFrameOutlineDisplay();
    }} .selected=${!!e.layer?.telemetryDisplay?.frameOutline}></calcite-list-item><calcite-list-item .disabled=${t && !g} .label=${l.frame} @click=${() => {
      e.toggleFrameDisplay();
    }} .selected=${!!e.layer?.telemetryDisplay?.frame}></calcite-list-item></calcite-list></calcite-panel></calcite-popover><calcite-action alignment=center .disabled=${o} icon=layers id=layers-action scale=s slot=trigger .text=${l.layers}></calcite-action></div>`, y = i`<div><calcite-popover auto-close .label=${l.follow} overlay-positioning=fixed placement=top-end pointer-disabled reference-element=follow-action scale=s><calcite-panel .heading=${l.follow}><calcite-list .label=${l.follow} selection-mode=single><calcite-list-item .label=${l.none} @click=${() => {
      e.followingMode = "none";
    }} .selected=${e.followingMode === "none"}><calcite-icon icon=circle-disallowed scale=s slot=content-start></calcite-icon></calcite-list-item><calcite-list-item .disabled=${t && !c} .label=${l.sensor} @click=${() => {
      e.followingMode = "follow-sensor";
    }} .selected=${e.followingMode === "follow-sensor"}><calcite-icon icon=zoom-to-object scale=s slot=content-start></calcite-icon></calcite-list-item><calcite-list-item .disabled=${t && !s} .label=${l.frame} @click=${() => {
      e.followingMode = "follow-frame";
    }} .selected=${e.followingMode === "follow-frame"}><calcite-icon icon=follow scale=s slot=content-start></calcite-icon></calcite-list-item><calcite-list-item .disabled=${t && !s && !c} .label=${l.video} @click=${() => {
      e.followingMode = "follow-both";
    }} .selected=${e.followingMode === "follow-both"}><calcite-icon icon=video scale=s slot=content-start></calcite-icon></calcite-list-item></calcite-list></calcite-panel></calcite-popover><calcite-action alignment=center .disabled=${o} .icon=${u(e)} id=follow-action scale=s slot=trigger .text=${l.follow}></calcite-action></div>`, f = i`<arcgis-video-player-settings .messages=${l} .viewModel=${e}></arcgis-video-player-settings>`, p = i`<calcite-action alignment=center .disabled=${o} icon=feature-details @click=${() => this.toggleMetadata()} scale=s .text=${l.metadata}></calcite-action>`;
    return i`<calcite-action-bar expand-disabled layout=horizontal scale=s>${[$, y, f, p]}</calcite-action-bar>`;
  }
}
b("arcgis-video-player-controls-group", v);
export {
  v as VideoPlayerControlsGroup
};