@epigraph/solutions 0.0.2-alpha → 0.0.4-alpha

package/dist/epigraph-threed-core.js

@@ -0,0 +1,8 @@
+import "./three.module-CYfxkCtM.js";
+import { E as e } from "./epigraph-threed-core-oXi9QFHJ.js";
+import "./AppHelpers-DdbyrHJf.js";
+import "./dimensions-manager.js";
+import "./HotspotsManager-mmFi8qV9.js";
+export {
+  e as EpigraphThreedCore
+};

package/dist/epigraph-tour.js

@@ -0,0 +1,196 @@
+import "./HotspotsManager-mmFi8qV9.js";
+import { V as r, E as p } from "./epigraph-viewer-7qd24J-r.js";
+import "./epg-button-view-in-your-space-29ehH_AX.js";
+import "./dimensions-manager.js";
+import { E as h, x as l } from "./three.module-CYfxkCtM.js";
+import { P as m, A as c } from "./AppHelpers-DdbyrHJf.js";
+class d extends r {
+  constructor({ nexusApiResultPayload: t }) {
+    super({ nexusApiResultPayload: t }), this._loggerContext = "TOUR EXPERIENCE DATA", this._data = t, window.epigraph.logger.info({ title: "nexusApiPayload", details: t, contextOverride: this._loggerContext });
+  }
+  getHotspots() {
+    return this._data.product_variant.hotspots;
+  }
+}
+class o extends p {
+  constructor() {
+    super(), this.featuresToEnable = {
+      viewer: !0,
+      hotspots: !0,
+      dimensions: !0,
+      viewInYourSpace: !0,
+      help: !0
+    }, this.epigraphWebsiteRedirectUrls = {
+      icon: "https://www.epigraph.us/?utm_source=web&utm_medium=experience&utm_campaign=tour&utm_id=powered-by&utm_content=icon",
+      modal: "https://www.epigraph.us/?utm_source=web&utm_medium=experience&utm_campaign=tour&utm_id=powered-by&utm_content=icon"
+    }, this._loggerContext = o.webComponentName.toUpperCase();
+  }
+  static {
+    this.webComponentName = "epigraph-tour";
+  }
+  static {
+    this.styles = [super.styles];
+  }
+  static setupWebComponent() {
+    window.customElements.get(o.webComponentName) || window.customElements.define(o.webComponentName, o);
+  }
+  async _fetchDataFromNexus() {
+    const t = new m(
+      c.resolveNexusEndpoint(this.apiMode),
+      window.location.href,
+      window.epigraph.epigraphSessionId,
+      this.solutionVersion,
+      this.xPath
+    );
+    let e = null;
+    switch (this._identifierType) {
+      case "sku":
+        e = await t.getTourBySku(this._identifier);
+        break;
+      case "shopify_variant_id":
+        e = await t.getTourByShopifyVariantId(this._identifier);
+        break;
+      case "upc":
+        e = await t.getTourByUpc(this._identifier);
+        break;
+      case "asin":
+        e = await t.getTourByAsin(this._identifier);
+        break;
+      default:
+        return window.epigraph.logger.error({
+          title: `Identifier type: '${this._identifierType}' not supported!`,
+          contextOverride: this._loggerContext
+        }), Promise.reject();
+    }
+    return e;
+  }
+  _initializeExperienceData(t) {
+    this._experienceData = new d({ nexusApiResultPayload: t.payload });
+  }
+  toggleHotspots() {
+    this.hotspotsManager.enabled ? this.hideHotspots() : this.showHotspots();
+  }
+  showHotspots() {
+    window.epigraph.logger.info({ title: "Showing Hotspots" }), this.hotspotsManager.enabled = !0, this.areHotspotsActive = !0, this.cameraManager.mainCameraControls.maxDistance = this.cameraManager.mainCameraControls.maxDistance + 0.3, this.appEvents.hotspotsVisibilityChanged.fire({ visible: !0 });
+  }
+  hideHotspots() {
+    window.epigraph.logger.info({ title: "Hiding Hotspots" }), this.hotspotsManager.enabled = !1, this.areHotspotsActive = !1, this.cameraManager.mainCameraControls.maxDistance = this.cameraManager.mainCameraControls.maxDistance - 0.3, this.appEvents.hotspotsVisibilityChanged.fire({ visible: !1 });
+  }
+  updateHotspotsOrder(t) {
+    this.hotspotsManager.updateHotspotsOrder(t);
+  }
+  _onHotspotsToolControlClick(t) {
+    t.stopPropagation(), t.preventDefault(), t.target.active ? this.showHotspots() : this.hideHotspots();
+  }
+  // Hotspot Tool functions	
+  openHotspot({ hotspotId: t, state: e }) {
+    this.hotspotsManager.openHotspot({ hotspotId: t, state: e });
+  }
+  closeActiveHotspot() {
+    this.hotspotsManager.closeActiveHotspot();
+  }
+  setActiveHotspotState(t) {
+    this.hotspotsManager.setActiveHotspotState(t);
+  }
+  nextHotspot() {
+    return this.hotspotsManager.nextHotspot();
+  }
+  previousHotspot() {
+    return this.hotspotsManager.previousHotspot();
+  }
+  getActiveHotspot() {
+    return this.hotspotsManager.activeHotspot;
+  }
+  areHotspotsVisible() {
+    return this.hotspotsManager.enabled;
+  }
+  getAllHotspots() {
+    return Array.from(this.hotspotsManager.hotspots.values());
+  }
+  getAllHotspotIds() {
+    return Array.from(this.hotspotsManager.hotspots.keys());
+  }
+  // Getters
+  getHotspotById(t) {
+    return this.hotspotsManager.hotspots.get(t);
+  }
+  createHotspots(t) {
+    this.hotspotsManager.createHotspots(t);
+  }
+  updateHotspots(t) {
+    this.hotspotsManager.updateHotspots(t);
+  }
+  removeHotspots(t) {
+    this.hotspotsManager.removeHotspots(t);
+  }
+  _onCameraPositionUpdate() {
+    super._onCameraPositionUpdate(), this.hotspotsManager?.enabled && this.hotspotsManager.recalculateHotspotPositions();
+  }
+  _resolveAnimationsOnHotspotEntry(t) {
+    this.stopAllAnimations();
+    for (const e of t)
+      this._activeAnimations.get(e.entry) || this.playAnimationByName({ animationName: e.entry }), setTimeout(
+        () => {
+          this._activeAnimations.delete(e.entry), this._activeAnimations.get(e.loop)?.loop || this.playAnimationByName({
+            animationName: e.loop,
+            loop: !0
+          });
+        },
+        this._animationFadeDurationInMiliseconds
+      );
+  }
+  _setupEventListeners() {
+    super._setupEventListeners(), this.addEventListener(
+      this.appEvents.hotspotOpenEvent.name,
+      (t) => {
+        this._isActiveHotspot = !0, this._resolveAnimationsOnHotspotEntry(t.detail.hotspot.animation);
+      }
+    ), this.addEventListener(
+      this.appEvents.hotspotClosedEvent.name,
+      () => {
+        this._isActiveHotspot = !1;
+      }
+    ), this.addEventListener(
+      this.appEvents.hotspotNextEvent.name,
+      (t) => {
+        this._resolveAnimationsOnHotspotEntry(t.detail.hotspot.animation);
+      }
+    ), this.addEventListener(
+      this.appEvents.hotspotPreviousEvent.name,
+      (t) => {
+        this._resolveAnimationsOnHotspotEntry(t.detail.hotspot.animation);
+      }
+    ), this.addEventListener(
+      this.appEvents.hotspotClosedEvent.name,
+      (t) => {
+        const s = this.hotspotsManager.hotspots.get(t.detail.hotspotId)?.animation;
+        if (s)
+          for (const i of s) {
+            const a = i.loop, n = i.exit;
+            a && this.stopAnimationByName(a), n && this.playAnimationByName({ animationName: n });
+          }
+      }
+    );
+  }
+  _renderHotspotsToolControl() {
+    return this._experienceData?.getHotspots()?.length ? l`
+            <epg-tool-control 
+                size="medium"
+                togglable="true"
+                left-icon="selective-solid" 
+                label="Hotspots" 
+                ?show-label=${this._isToolsetLargerThanTheLeftBottomQuadrant}
+                tooltip-label="Hotspots"
+                tooltip-placement=${this._isToolsetLargerThanTheLeftBottomQuadrant ? "none" : "top-center"}
+                ?active=${this.areHotspotsActive}
+                @epgonclick=${this._onHotspotsToolControlClick}
+            ></epg-tool-control>
+        ` : h;
+  }
+  _repopulateHotspotsOnIdentifierChange() {
+    this.hotspotsManager.removeAllHotspots(), this.createHotspots(this._experienceData.getHotspots());
+  }
+}
+export {
+  o as EpigraphTour
+};