@lumiscaphe/viewer 4.2.0 → 4.2.1

package/dist/lib/index.js

@@ -1,9 +1,9 @@
 (function(){"use strict";try{if(typeof document<"u"){var e=document.createElement("style");e.appendChild(document.createTextNode(".ls-viewer-container{display:block;position:relative;overflow:hidden;-webkit-user-select:none;user-select:none;width:100%;height:100%}.ls-viewer-container-image,.ls-viewer-container-video{cursor:default;pointer-events:none}.ls-viewer-container-vrcube{cursor:pointer;cursor:grab}.ls-viewer-container-vrcube-grabbing{cursor:move;cursor:grabbing}.ls-viewer-container-vrobject{cursor:move;cursor:grab}.ls-viewer-container-vrobject-grabbing{cursor:move;cursor:grabbing}.ls-viewer-container-loading{cursor:progress}.ls-viewer-canvas{position:absolute;opacity:0;transition:opacity .5s}.ls-viewer-video{position:absolute}")),document.head.appendChild(e)}}catch(r){console.error("vite-plugin-css-injected-by-js",r)}})();
-import C from "debounce-promise";
-import * as P from "twgl.js";
+import D from "debounce-promise";
+import * as M from "twgl.js";
 import { v3 as h, m4 as c } from "twgl.js";
-import $ from "regression";
-class b {
+import U from "regression";
+class f {
   constructor(t, e) {
     this.width = t, this.height = e;
   }
@@ -11,7 +11,7 @@ class b {
     return this.width / this.height;
   }
 }
-class p {
+const P = class P {
   constructor(t, e, i, s) {
     this.top = t, this.left = e, this.width = i, this.height = s;
   }
@@ -34,49 +34,52 @@ class p {
         break;
     }
     const o = (e.height - n) / 2, u = (e.width - a) / 2;
-    return new p(o, u, a, n);
+    return new P(o, u, a, n);
   }
   static project(t, e, i, s) {
-    const r = p.fit(t, e, i), a = r.width / t.width, n = r.height / t.height;
+    const r = P.fit(t, e, i), a = r.width / t.width, n = r.height / t.height;
     return {
       x: Math.round(r.left + s.x * a),
       y: Math.round(r.top + s.y * n)
     };
   }
   static unproject(t, e, i, s) {
-    const r = p.fit(t, e, i), a = r.width / t.width, n = r.height / t.height;
+    const r = P.fit(t, e, i), a = r.width / t.width, n = r.height / t.height;
     return {
       x: Math.round((s.x - r.left) / a),
       y: Math.round((s.y - r.top) / n)
     };
   }
-  static getStandardAspectRatio(t, e) {
+  static getStandardAspectRatio(t, e, i) {
     if (t === 0 || e === 0)
       return 0;
-    const i = t / e;
-    if (t < e) {
-      const a = Math.abs(0.75 - i), n = Math.abs(9 / 16 - i);
-      return a < n ? 3 / 4 : 9 / 16;
-    }
-    const s = Math.abs(4 / 3 - i), r = Math.abs(16 / 9 - i);
-    return s < r ? 4 / 3 : 16 / 9;
+    if (i)
+      return i;
+    const s = t / e;
+    return t < e ? s < P.PORTRAIT_ASPECT_BOUNDARY ? 9 / 16 : 3 / 4 : s < P.LANDSCAPE_ASPECT_BOUNDARY ? 4 / 3 : 16 / 9;
   }
-  static getStandardResolution(t, e) {
+  static getStandardResolution(t, e, i) {
     if (t === 0 || e === 0)
-      return new b(0, 0);
-    const i = p.getStandardAspectRatio(t, e);
+      return new f(0, 0);
+    const s = P.getStandardAspectRatio(t, e, i);
+    if (i) {
+      const a = P.getStandardQuality(Math.min(t, e));
+      return new f(Math.round(a * s), Math.round(a));
+    }
     if (t < e) {
-      const r = p.getStandardQuality(Math.max(e * i, t));
-      return new b(Math.round(r), Math.round(r / i));
+      const a = P.getStandardQuality(Math.max(e * s, t));
+      return new f(Math.round(a), Math.round(a / s));
     }
-    const s = p.getStandardQuality(Math.max(t / i, e));
-    return new b(Math.round(s * i), Math.round(s));
+    const r = P.getStandardQuality(Math.max(t / s, e));
+    return new f(Math.round(r * s), Math.round(r));
   }
   static getStandardQuality(t) {
     return t <= 720 ? 720 : 1080;
   }
-}
-class U {
+};
+P.LANDSCAPE_ASPECT_BOUNDARY = Math.sqrt(4 / 3 * (16 / 9)), P.PORTRAIT_ASPECT_BOUNDARY = Math.sqrt(3 / 4 * (9 / 16));
+let b = P;
+class N {
   constructor(t) {
     this.element = document.createElement("canvas"), this.element.classList.add("ls-viewer-canvas"), this.element.style.opacity = "0", this.element.width = 0, this.element.height = 0, this.context = this.element.getContext("2d"), this.backCanvas = document.createElement("canvas"), this.backContext = this.backCanvas.getContext("2d"), this.fit = t, this.pixelRatio = 1;
   }
@@ -90,7 +93,7 @@ class U {
     t ? this.element.style.display = "none" : this.element.style.opacity = "0";
   }
   get resolution() {
-    return new b(this.element.width / this.pixelRatio, this.element.height / this.pixelRatio);
+    return new f(this.element.width / this.pixelRatio, this.element.height / this.pixelRatio);
   }
   resize(t, e, i) {
     this.element.width = t * i, this.element.height = e * i, this.element.style.width = `${t}px`, this.element.style.height = `${e}px`, this.backCanvas.width = t * i, this.backCanvas.height = e * i, this.pixelRatio = i;
@@ -99,7 +102,7 @@ class U {
     if (!t)
       return;
     this.requestAnimationId && (cancelAnimationFrame(this.requestAnimationId), this.requestAnimationId = void 0);
-    const s = p.fit(new b(t.width, t.height), new b(this.element.width, this.element.height), this.fit);
+    const s = b.fit(new f(t.width, t.height), new f(this.element.width, this.element.height), this.fit);
     e ? (this.backContext.drawImage(this.element, 0, 0), this.context.globalAlpha = 0, this.fadeLoop(t, i || 0)) : (this.context.globalAlpha = 1, this.context.drawImage(t, s.left, s.top, s.width, s.height)), this.image = t;
   }
   fadeLoop(t, e) {
@@ -107,15 +110,15 @@ class U {
       cancelAnimationFrame(this.requestAnimationId), this.requestAnimationId = void 0;
       return;
     }
-    const i = Math.min(this.context.globalAlpha + e, 1), s = p.fit(new b(t.width, t.height), new b(this.element.width, this.element.height), this.fit);
+    const i = Math.min(this.context.globalAlpha + e, 1), s = b.fit(new f(t.width, t.height), new f(this.element.width, this.element.height), this.fit);
     this.context.clearRect(0, 0, this.element.width, this.element.height), this.context.globalAlpha = 1, this.context.drawImage(this.backCanvas, 0, 0), this.context.globalAlpha = i, this.context.drawImage(t, s.left, s.top, s.width, s.height), this.requestAnimationId = requestAnimationFrame(() => {
       this.fadeLoop(t, e);
     });
   }
 }
-class N {
+class B {
   constructor() {
-    this.element = document.createElement("canvas"), this.element.classList.add("ls-viewer-canvas"), this.element.style.opacity = "0", this.element.width = 0, this.element.height = 0, this.context = P.getContext(this.element, { preserveDrawingBuffer: !0 }), this.context && this.context.isContextLost() && (this.context = void 0), P.setDefaults({ textureColor: [1, 1, 1, 1] });
+    this.element = document.createElement("canvas"), this.element.classList.add("ls-viewer-canvas"), this.element.style.opacity = "0", this.element.width = 0, this.element.height = 0, this.context = M.getContext(this.element, { preserveDrawingBuffer: !0 }), this.context && this.context.isContextLost() && (this.context = void 0), M.setDefaults({ textureColor: [1, 1, 1, 1] });
   }
   show() {
     this.element.style.opacity = "1";
@@ -154,11 +157,11 @@ class w {
   }
   static perspectiveWithLeft(t, e, i, s, r, a, n) {
     n = n || new Float32Array(16);
-    const o = e + t, u = e - t, m = s + i, f = s - i, d = a - r;
-    return n[0] = 2 * r / u, n[1] = 0, n[2] = 0, n[3] = 0, n[4] = 0, n[5] = 2 * r / f, n[6] = 0, n[7] = 0, n[8] = o / u, n[9] = m / f, n[10] = -a / d, n[11] = -1, n[12] = 0, n[13] = 0, n[14] = -a * r / d, n[15] = 0, n;
+    const o = e + t, u = e - t, l = s + i, p = s - i, d = a - r;
+    return n[0] = 2 * r / u, n[1] = 0, n[2] = 0, n[3] = 0, n[4] = 0, n[5] = 2 * r / p, n[6] = 0, n[7] = 0, n[8] = o / u, n[9] = l / p, n[10] = -a / d, n[11] = -1, n[12] = 0, n[13] = 0, n[14] = -a * r / d, n[15] = 0, n;
   }
 }
-const A = class A {
+const O = class O {
   static initCubeFace(t, e, i) {
     let s = [0, 0, 0];
     const r = h.subtract(e, t), a = h.mulScalar([0, 1, 0], h.length(r)), n = h.mulScalar(h.normalize(h.cross(r, a)), h.length(r)), o = h.mulScalar(h.normalize(h.cross(a, n)), h.length(r));
@@ -182,7 +185,7 @@ const A = class A {
         e = h.subtract(t, a), s = h.normalize(o);
         break;
     }
-    return new A(e, t, s);
+    return new O(e, t, s);
   }
   constructor(t, e, i) {
     this.target = h.copy(t), this.eye = h.copy(e), this.up = h.copy(i);
@@ -197,12 +200,12 @@ const A = class A {
     return c.inverse(c.lookAt(this.eye, this.target, this.up));
   }
   clone() {
-    return new A(h.copy(this.target), h.copy(this.eye), h.copy(this.up));
+    return new O(h.copy(this.target), h.copy(this.eye), h.copy(this.up));
   }
 };
-A.default = new A([0, 0, 0], [2, 2, 2], [0, 1, 0]);
-let L = A;
-class B {
+O.default = new O([0, 0, 0], [2, 2, 2], [0, 1, 0]);
+let S = O;
+class X {
   constructor(t) {
     this.target = t.target;
     const e = h.normalize(h.subtract(t.eye, t.target)), i = h.dot(e, [1, 0, 0]), s = h.dot(e, [0, 1, 0]), r = h.dot(e, [0, 0, 1]);
@@ -219,10 +222,10 @@ class B {
     let n = [0, 1, 0];
     n = c.transformPoint(r, n);
     const o = h.subtract(t, h.mulScalar(a, this.distance));
-    return new L(t, o, n);
+    return new S(t, o, n);
   }
 }
-class X {
+class Y {
   constructor() {
   }
   async animation(t) {
@@ -277,7 +280,7 @@ class H {
     return {
       id: t.getAttribute("id"),
       name: t.getAttribute("name"),
-      pointOfView: new L(
+      pointOfView: new S(
         [
           parseFloat(t.querySelector("PointOfView Target").getAttribute("x")),
           //
@@ -415,8 +418,8 @@ const g = class g {
   }
 };
 g.xmlRegex = /directUrl="([^"]*)"/g;
-let S = g;
-class l {
+let F = g;
+class m {
   constructor(t) {
     this.server = t;
   }
@@ -482,29 +485,29 @@ class l {
   }
   async image(t) {
     const e = {
-      scene: l.scene(t),
+      scene: m.scene(t),
       mode: {
         image: {
           camera: t.view.camera
         }
       },
-      renderParameters: l.renderParameters(t),
-      encoder: l.encoder(t)
+      renderParameters: m.renderParameters(t),
+      encoder: m.encoder(t)
     };
-    return l.fetchFrame(`${this.server}/Snapshot`, e);
+    return m.fetchFrame(`${this.server}/Snapshot`, e);
   }
   async vrCube(t) {
     const e = {
-      scene: l.scene(t),
+      scene: m.scene(t),
       mode: {
         vrCube: {
           camera: t.view.camera
         }
       },
-      renderParameters: l.renderParameters(t),
-      encoder: l.encoder(t)
+      renderParameters: m.renderParameters(t),
+      encoder: m.encoder(t)
     };
-    return e.renderParameters.width = Math.max(e.renderParameters.width, e.renderParameters.height), e.renderParameters.height = Math.max(e.renderParameters.width, e.renderParameters.height), l.fetchFrameArray(`${this.server}/Snapshot`, e);
+    return e.renderParameters.width = Math.max(e.renderParameters.width, e.renderParameters.height), e.renderParameters.height = Math.max(e.renderParameters.width, e.renderParameters.height), m.fetchFrameArray(`${this.server}/Snapshot`, e);
   }
   async vrObject(t) {
     let e;
@@ -531,16 +534,16 @@ class l {
       }
     };
     const i = {
-      scene: l.scene(t),
+      scene: m.scene(t),
       mode: e,
-      renderParameters: l.renderParameters(t),
-      encoder: l.encoder(t)
+      renderParameters: m.renderParameters(t),
+      encoder: m.encoder(t)
     };
-    return l.fetchFrameArray(`${this.server}/Snapshot`, i);
+    return m.fetchFrameArray(`${this.server}/Snapshot`, i);
   }
   async animation(t) {
     const e = {
-      scene: l.scene(t),
+      scene: m.scene(t),
       mode: {
         animation: {
           id: t.view.animation,
@@ -548,45 +551,45 @@ class l {
           fps: t.view.fps
         }
       },
-      renderParameters: l.renderParameters(t),
-      encoder: l.encoder(t)
+      renderParameters: m.renderParameters(t),
+      encoder: m.encoder(t)
     };
-    return l.fetchFrameArray(`${this.server}/Snapshot`, e);
+    return m.fetchFrameArray(`${this.server}/Snapshot`, e);
   }
   async imageHotspots(t, e) {
     const i = {
-      scene: l.scene(t),
+      scene: m.scene(t),
       mode: {
         image: {
           camera: t.view.camera
         }
       },
-      renderParameters: l.renderParameters(t),
+      renderParameters: m.renderParameters(t),
       ...this.hotspotsBody(e)
     };
-    return await l.fetchHotspots(`${this.server}/Hotspot`, i);
+    return await m.fetchHotspots(`${this.server}/Hotspot`, i);
   }
   async imagePick(t, e) {
     const i = {
-      scene: l.scene(t),
+      scene: m.scene(t),
       camera: t.view.camera,
-      renderParameters: l.renderParameters(t),
+      renderParameters: m.renderParameters(t),
       positions: [e]
     };
-    return await l.fetchPick(`${this.server}/Pick`, i);
+    return await m.fetchPick(`${this.server}/Pick`, i);
   }
   async vrCubeHotspots(t, e) {
     const i = {
-      scene: l.scene(t),
+      scene: m.scene(t),
       mode: {
         vrCube: {
           camera: t.view.camera
         }
       },
-      renderParameters: l.renderParameters(t),
+      renderParameters: m.renderParameters(t),
       ...this.hotspotsBody(e)
     };
-    return i.renderParameters.width = Math.max(i.renderParameters.width, i.renderParameters.height), i.renderParameters.height = Math.max(i.renderParameters.width, i.renderParameters.height), await l.fetchHotspotsArray(`${this.server}/Hotspot`, i);
+    return i.renderParameters.width = Math.max(i.renderParameters.width, i.renderParameters.height), i.renderParameters.height = Math.max(i.renderParameters.width, i.renderParameters.height), await m.fetchHotspotsArray(`${this.server}/Hotspot`, i);
   }
   async vrObjectHotspots(t, e) {
     let i;
@@ -613,12 +616,12 @@ class l {
       }
     };
     const s = {
-      scene: l.scene(t),
+      scene: m.scene(t),
       mode: i,
-      renderParameters: l.renderParameters(t),
+      renderParameters: m.renderParameters(t),
       ...this.hotspotsBody(e)
     };
-    return await l.fetchHotspotsArray(`${this.server}/Hotspot`, s);
+    return await m.fetchHotspotsArray(`${this.server}/Hotspot`, s);
   }
   hotspotsBody(t) {
     return {
@@ -627,20 +630,20 @@ class l {
     };
   }
 }
-class D {
+class V {
   constructor(t, e, i) {
     switch (e) {
       case "static":
-        this.webrender = new X();
+        this.webrender = new Y();
         break;
       case "v1":
-        this.webrender = new S(t), this.webrenderV2 = new l(t);
+        this.webrender = new F(t), this.webrenderV2 = new m(t);
         break;
       case "v2":
-        this.webrender = new l(t), this.webrenderV2 = new l(t);
+        this.webrender = new m(t), this.webrenderV2 = new m(t);
         break;
       default:
-        this.webrender = new S(t), this.webrenderV2 = new l(t);
+        this.webrender = new F(t), this.webrenderV2 = new m(t);
         break;
     }
     this.delegate = i, this.loadingId = 0, this.loaded = 0, this.total = 0, this.databases = [], this.onLoadStart = i && i.onLoadStart ? i.onLoadStart : () => {
@@ -677,7 +680,7 @@ class D {
   }
   async loadImage(t, e) {
     const i = new Image();
-    i.crossOrigin = location.protocol === "file:" && !D.isValidHttpUrl(t) ? null : "anonymous";
+    i.crossOrigin = location.protocol === "file:" && !V.isValidHttpUrl(t) ? null : "anonymous";
     const s = new Promise((r, a) => {
       i.addEventListener(
         "load",
@@ -699,8 +702,8 @@ class D {
     this.total = t.length;
     const r = new Array(t.length), a = i || 0;
     for (let n = 0, o = t.length; n < o; n += 1) {
-      const u = Math.ceil(n / 2) * (n % 2 === 0 ? 1 : -1), m = e ? w.mod(a + u, o) : n;
-      r[m] = this.loadImage(t[m], s);
+      const u = Math.ceil(n / 2) * (n % 2 === 0 ? 1 : -1), l = e ? w.mod(a + u, o) : n;
+      r[l] = this.loadImage(t[l], s);
     }
     return Promise.all(r).then(() => this.onLoadEnd(this.progress)).catch(() => {
     }), r;
@@ -734,15 +737,15 @@ class D {
           return;
         }
         t.removeEventListener("seeked", u);
-        const m = document.createElement("canvas");
-        m.width = t.videoWidth, m.height = t.videoHeight, m.getContext("2d").drawImage(t, 0, 0);
+        const l = document.createElement("canvas");
+        l.width = t.videoWidth, l.height = t.videoHeight, l.getContext("2d").drawImage(t, 0, 0);
         const d = new Image();
-        d.src = m.toDataURL(), n(d), this.loaded += 1, this.onLoadProgress(this.progress), s !== i - 1 && (t.currentTime += 1 / e);
+        d.src = l.toDataURL(), n(d), this.loaded += 1, this.onLoadProgress(this.progress), s !== i - 1 && (t.currentTime += 1 / e);
       };
       t.addEventListener("seeked", u), t.addEventListener(
         "error",
-        (m) => {
-          r === this.loadingId && o(m);
+        (l) => {
+          r === this.loadingId && o(l);
         },
         { once: !0 }
       );
@@ -781,7 +784,7 @@ class D {
     return this.webrenderV2 ? await this.webrenderV2.imagePick(await this.vrCubeFrameSnapshot(t, i), e) : Promise.reject(new Error("Picking only available with api V2"));
   }
   async convert(t) {
-    if (!this.webrenderV2 || this.webrender instanceof l || !t.view.camera)
+    if (!this.webrenderV2 || this.webrender instanceof m || !t.view.camera)
       return t;
     const e = t.scene.find((o) => !o.decor && !o.accessory);
     if (!e)
@@ -803,7 +806,7 @@ class D {
     if (!s)
       return t;
     let r = this.databases.find((a) => a.id === s.database);
-    if (r || (r = await this.webrender.database(s.database), this.databases.push(r)), this.webrender instanceof S) {
+    if (r || (r = await this.webrender.database(s.database), this.databases.push(r)), this.webrender instanceof F) {
       if (!t.view.camera)
         return t;
       const a = r.getCameraGroupId(t.view.camera);
@@ -814,15 +817,15 @@ class D {
         return t;
       const o = n.cameras[e];
       return o ? { ...t, view: { ...t.view, camera: o.id } } : t;
-    } else if (this.webrender instanceof l) {
+    } else if (this.webrender instanceof m) {
       const a = typeof t.view.camera == "string" ? t.view.camera : t.view.camera?.id;
       if (a) {
         const n = r.getCameraById(a);
         if (!n)
           return t;
-        const o = new B(n.pointOfView), u = 2 * Math.PI / i;
+        const o = new X(n.pointOfView), u = 2 * Math.PI / i;
         o.longitude += e * u % (2 * Math.PI);
-        const m = o.pointOfView(n.pointOfView.target);
+        const l = o.pointOfView(n.pointOfView.target);
         return {
           ...t,
           view: {
@@ -831,19 +834,19 @@ class D {
               id: n.id,
               pov: {
                 target: {
-                  x: m.target[0],
-                  y: m.target[1],
-                  z: m.target[2]
+                  x: l.target[0],
+                  y: l.target[1],
+                  z: l.target[2]
                 },
                 eye: {
-                  x: m.eye[0],
-                  y: m.eye[1],
-                  z: m.eye[2]
+                  x: l.eye[0],
+                  y: l.eye[1],
+                  z: l.eye[2]
                 },
                 up: {
-                  x: m.up[0],
-                  y: m.up[1],
-                  z: m.up[2]
+                  x: l.up[0],
+                  y: l.up[1],
+                  z: l.up[2]
                 }
               }
             }
@@ -868,16 +871,16 @@ class D {
     if (s || (s = await this.webrender.database(i.database), this.databases.push(s)), !t.view.camera)
       return t;
     let r;
-    if (this.webrender instanceof S) {
-      const o = t.view.camera.split("/"), u = o.length === 2 ? o[0] : void 0, m = o.length === 2 ? o[1] : o[0];
-      r = s.getCameraId(m, u);
-    } else this.webrender instanceof l && (r = typeof t.view.camera == "string" ? t.view.camera : t.view.camera.id);
+    if (this.webrender instanceof F) {
+      const o = t.view.camera.split("/"), u = o.length === 2 ? o[0] : void 0, l = o.length === 2 ? o[1] : o[0];
+      r = s.getCameraId(l, u);
+    } else this.webrender instanceof m && (r = typeof t.view.camera == "string" ? t.view.camera : t.view.camera.id);
     if (!r)
       return t;
     const a = s.getCameraById(r);
     if (!a)
       return t;
-    const n = L.initCubeFace(a.pointOfView.eye, a.pointOfView.target, e);
+    const n = S.initCubeFace(a.pointOfView.eye, a.pointOfView.target, e);
     return {
       ...t,
       view: {
@@ -932,7 +935,7 @@ class D {
     return e.protocol === "http:" || e.protocol === "https:";
   }
 }
-class Y {
+class J {
   constructor() {
     this.element = document.createElement("video"), this.element.classList.add("ls-viewer-video"), this.element.style.opacity = "0", this.element.width = 0, this.element.height = 0, this.element.setAttribute("muted", ""), this.element.setAttribute("playsinline", ""), this.element.setAttribute("preload", "auto");
   }
@@ -943,11 +946,11 @@ class Y {
     this.element.style.opacity = "0";
   }
   resize(t, e, i, s) {
-    const r = p.fit(i, new b(t, e), s);
+    const r = b.fit(i, new f(t, e), s);
     this.element.style.top = `${r.top}px`, this.element.style.left = `${r.left}px`, this.element.style.width = `${r.width}px`, this.element.style.height = `${r.height}px`, (i.width !== this.element.width || i.height !== this.element.height) && (this.element.width = i.width, this.element.height = i.height);
   }
 }
-class J {
+class Q {
   constructor(t, e, i) {
     this.container = t, this.canvas = e, this.loader = i, this.hotspotList = [];
   }
@@ -975,11 +978,11 @@ class J {
     ) : this.hotspotList = []), this.hotspotsHash = n, this.snapshotHash = a, r;
   }
   async pick(t, e) {
-    const i = new b(t.parameters.width, t.parameters.height), s = p.unproject(i, this.canvas.resolution, this.canvas.fit, e);
+    const i = new f(t.parameters.width, t.parameters.height), s = b.unproject(i, this.canvas.resolution, this.canvas.fit, e);
     return this.loader.loadImagePick(t, s);
   }
   hotspots(t) {
-    return this.hotspotList.map((e) => ({ ...e, position2D: p.project(t, this.canvas.resolution, this.canvas.fit, e.position2D) })).map((e) => ({ ...e, visibility: p.contains(this.canvas.resolution, e.position2D) ? e.visibility : "OutOfFrustum" }));
+    return this.hotspotList.map((e) => ({ ...e, position2D: b.project(t, this.canvas.resolution, this.canvas.fit, e.position2D) })).map((e) => ({ ...e, visibility: b.contains(this.canvas.resolution, e.position2D) ? e.visibility : "OutOfFrustum" }));
   }
   snapshot(t, e) {
     return this.canvas.element.toDataURL(t, e);
@@ -1001,24 +1004,24 @@ class J {
   onDeviceOrientation(t) {
   }
 }
-class I {
+class L {
   constructor(t, e) {
     this.x = t, this.y = e;
   }
   clone() {
-    return new I(this.x, this.y);
+    return new L(this.x, this.y);
   }
 }
 class y {
   static pointFromMouseEvent(t) {
-    return new I(t.screenX, t.screenY);
+    return new L(t.screenX, t.screenY);
   }
   static pointFromTouchEvent(t) {
     const e = t.targetTouches[0] || t.changedTouches[0];
-    return new I(e.screenX, e.screenY);
+    return new L(e.screenX, e.screenY);
   }
 }
-class V {
+class j {
   constructor(...t) {
     t.length === 3 ? ({ 0: this.u, 1: this.v, 2: this.o } = t, this.w = h.cross(this.u, this.v)) : t.length === 4 ? { 0: this.u, 1: this.v, 2: this.w, 3: this.o } = t : (this.u = [1, 0, 0], this.v = [0, 1, 0], this.w = [0, 0, 1], this.o = [0, 0, 0]);
   }
@@ -1035,9 +1038,9 @@ class Z {
     this.x = t, this.y = e, this.time = i;
   }
 }
-class q {
+class R {
   constructor(t) {
-    this.points = [], this.onMotion = t, this.lastPoint = new I(0, 0), this.velocity = new I(0, 0), this.loop = this.loop.bind(this);
+    this.points = [], this.onMotion = t, this.lastPoint = new L(0, 0), this.velocity = new L(0, 0), this.loop = this.loop.bind(this);
   }
   destroy() {
     this.animationFrameId && (cancelAnimationFrame(this.animationFrameId), this.animationFrameId = void 0);
@@ -1050,7 +1053,7 @@ class q {
     if (this.points.length === 0)
       return;
     const t = this.points[0], e = this.points[this.points.length - 1], i = e.x - t.x, s = e.y - t.y, r = e.time - t.time;
-    this.velocity = new I(r === 0 ? 0 : i / (r / 15), r === 0 ? 0 : s / (r / 15)), this.animationFrameId && (cancelAnimationFrame(this.animationFrameId), this.animationFrameId = void 0), this.animationFrameId = requestAnimationFrame(this.loop);
+    this.velocity = new L(r === 0 ? 0 : i / (r / 15), r === 0 ? 0 : s / (r / 15)), this.animationFrameId && (cancelAnimationFrame(this.animationFrameId), this.animationFrameId = void 0), this.animationFrameId = requestAnimationFrame(this.loop);
   }
   stop() {
     this.animationFrameId && (cancelAnimationFrame(this.animationFrameId), this.animationFrameId = void 0), this.points = [];
@@ -1063,18 +1066,18 @@ class q {
     this.lastPoint.x += this.velocity.x, this.lastPoint.y += this.velocity.y, this.velocity.x *= 0.9, this.velocity.y *= 0.9, this.onMotion(this.lastPoint.clone()), this.animationFrameId = requestAnimationFrame(this.loop);
   }
 }
-class Q {
+class W {
   constructor(t, e, i) {
-    this.isStarted = !1, this.pov = t, this.fov = w.degreesToRadians(e), this.orientationMatrix = c.identity(), this.inertia = new q(this.motion.bind(this)), this.onMotion = i, this.initPov = this.pov, this.initFov = this.fov, this.initOrientation = w.degreesToRadians(window.orientation) || 0, this.startPov = new L([0, 0, 1], [0, 0, 0], [0, 1, 0]), this.startSize = { width: 0, height: 0 }, this.previousPoint = new I(0, 0);
+    this.isStarted = !1, this.pov = t, this.fov = w.degreesToRadians(e), this.orientationMatrix = c.identity(), this.inertia = new R(this.motion.bind(this)), this.onMotion = i, this.initPov = this.pov, this.initFov = this.fov, this.initOrientation = w.degreesToRadians(window.orientation) || 0, this.startPov = new S([0, 0, 1], [0, 0, 0], [0, 1, 0]), this.startSize = { width: 0, height: 0 }, this.previousPoint = new L(0, 0);
   }
   destroy() {
     this.inertia.destroy();
   }
   get orientedPov() {
-    const t = h.normalize(h.cross(this.pov.up, this.pov.target)), e = new V(t, [0, 1, 0], this.pov.eye), i = c.identity();
+    const t = h.normalize(h.cross(this.pov.up, this.pov.target)), e = new j(t, [0, 1, 0], this.pov.eye), i = c.identity();
     c.multiply(i, e.localToGlobalMatrix, i), c.multiply(i, this.orientationMatrix, i), c.multiply(i, e.globalToLocalMatrix, i);
     const s = c.transformDirection(i, this.pov.target), r = this.pov.eye, a = c.transformDirection(i, this.pov.up);
-    return new L(s, r, a);
+    return new S(s, r, a);
   }
   reset() {
     this.pov = this.initPov.clone(), this.fov = this.initFov;
@@ -1087,10 +1090,10 @@ class Q {
     const e = {
       x: t.x - this.previousPoint.x,
       y: t.y - this.previousPoint.y
-    }, i = w.accelerate(e.x, 1.3) / this.startSize.width * 0.2 * Math.PI * 1.5, s = w.accelerate(e.y, 1.3) / this.startSize.height * 0.2 * Math.PI, r = c.multiply(c.rotationY(i), c.rotationX(-s)), a = h.normalize(h.cross(this.pov.up, this.pov.target)), n = new V(a, [0, 1, 0], this.pov.eye), o = c.identity();
+    }, i = w.accelerate(e.x, 1.3) / this.startSize.width * 0.2 * Math.PI * 1.5, s = w.accelerate(e.y, 1.3) / this.startSize.height * 0.2 * Math.PI, r = c.multiply(c.rotationY(i), c.rotationX(-s)), a = h.normalize(h.cross(this.pov.up, this.pov.target)), n = new j(a, [0, 1, 0], this.pov.eye), o = c.identity();
     c.multiply(o, n.localToGlobalMatrix, o), c.multiply(o, r, o), c.multiply(o, n.globalToLocalMatrix, o);
-    const u = c.transformPoint(o, this.pov.target), m = c.transformDirection(o, this.pov.up);
-    h.cross(m, [0, 0, 1])[0] >= 0 && (this.pov.target = u, this.pov.up = m), this.previousPoint = t, this.onMotion();
+    const u = c.transformPoint(o, this.pov.target), l = c.transformDirection(o, this.pov.up);
+    h.cross(l, [0, 0, 1])[0] >= 0 && (this.pov.target = u, this.pov.up = l), this.previousPoint = t, this.onMotion();
   }
   end(t, e) {
     this.isStarted = !1, e && (this.inertia.track(t), this.inertia.start());
@@ -1100,7 +1103,7 @@ class Q {
     c.rotateZ(o, this.initOrientation, o), c.rotateZ(o, r, o), c.rotateX(o, a, o), c.rotateY(o, n, o), c.rotateZ(o, -s, o), this.orientationMatrix = o, this.onMotion();
   }
 }
-var W = `precision mediump float;
+var _ = `precision mediump float;
 
 uniform float u_mix;
 uniform samplerCube u_texture;
@@ -1112,7 +1115,7 @@ void main() {
   vec4 backColor = textureCube(u_texture_back, direction);
   vec4 color = textureCube(u_texture, direction);
   gl_FragColor = mix(backColor, color, u_mix);
-}`, _ = `attribute vec4 position;
+}`, K = `attribute vec4 position;
 
 uniform mat4 u_mvpi;
 
@@ -1122,27 +1125,27 @@ void main() {
   direction = (u_mvpi * position).xyz;
   gl_Position = position;
 }`;
-class K {
-  constructor(t, e, i, s) {
-    this.container = t, this.canvas = e, this.loader = i, this.images = [], this.hotspotsList = [[]];
-    const r = new L([0, 0, 1], [0, 0, 0], [0, 1, 0]), a = 60, n = c.rotationX(w.degreesToRadians(15));
-    c.transformDirection(n, r.target, r.target), c.transformDirection(n, r.up, r.up), this.interaction = new Q(r, a, () => {
+class tt {
+  constructor(t, e, i, s, r) {
+    this.container = t, this.canvas = e, this.loader = i, this.aspectRatioOverride = r, this.images = [], this.hotspotsList = [[]];
+    const a = new S([0, 0, 1], [0, 0, 0], [0, 1, 0]), n = 60, o = c.rotationX(w.degreesToRadians(15));
+    c.transformDirection(o, a.target, a.target), c.transformDirection(o, a.up, a.up), this.interaction = new W(a, n, () => {
       this.animationFrameId = requestAnimationFrame(this.render), this.onInteraction({
         pov: this.interaction.pov.clone(),
         fov: this.interaction.fov
       });
-    }), this.onInteraction = s, this.gl = this.canvas.context, this.programInfo = P.createProgramInfo(this.gl, [`${_}
-`, `${W}
-`]), this.quad = P.primitives.createXYQuadBufferInfo(this.gl), this.uniforms = {
+    }), this.onInteraction = s, this.gl = this.canvas.context, this.programInfo = M.createProgramInfo(this.gl, [`${K}
+`, `${_}
+`]), this.quad = M.primitives.createXYQuadBufferInfo(this.gl), this.uniforms = {
       u_mvpi: c.identity(),
       u_mix: 0,
-      u_texture_back: P.createTexture(this.gl, {
+      u_texture_back: M.createTexture(this.gl, {
         target: this.gl.TEXTURE_CUBE_MAP,
         minMag: this.gl.LINEAR,
         width: 1,
         height: 1
       }),
-      u_texture: P.createTexture(this.gl, {
+      u_texture: M.createTexture(this.gl, {
         target: this.gl.TEXTURE_CUBE_MAP,
         minMag: this.gl.LINEAR,
         width: 1,
@@ -1180,7 +1183,7 @@ class K {
     const a = JSON.stringify(t);
     a === this.snapshotHash ? r = r.then(() => (this.animationFrameId = requestAnimationFrame(this.render), Promise.resolve())) : (this.images = [], this.animationFrameId = requestAnimationFrame(this.render), r = r.then(
       () => this.loader.loadVRCubeSnapshot(t).then((o) => {
-        this.images = o, P.createTexture(
+        this.images = o, M.createTexture(
           this.gl,
           {
             target: this.gl.TEXTURE_CUBE_MAP,
@@ -1197,8 +1200,8 @@ class K {
             ],
             src: o
           },
-          (u, m) => {
-            u || (i && this.interaction.reset(), this.uniforms.u_mix = s ? 0 : 1, this.uniforms.u_texture_back = this.uniforms.u_texture, this.uniforms.u_texture = m, this.animationFrameId = requestAnimationFrame(this.render));
+          (u, l) => {
+            u || (i && this.interaction.reset(), this.uniforms.u_mix = s ? 0 : 1, this.uniforms.u_texture_back = this.uniforms.u_texture, this.uniforms.u_texture = l, this.animationFrameId = requestAnimationFrame(this.render));
           }
         );
       })
@@ -1211,35 +1214,35 @@ class K {
     ) : this.hotspotsList = [[]]), this.hotspotsHash = n, this.snapshotHash = a, r;
   }
   async pick(t, e) {
-    const i = this.canvas.element.clientWidth, s = this.canvas.element.clientHeight, r = e.x, a = s - e.y, n = 2 * r / i - 1, o = 2 * a / s - 1, u = [n, o, 0], m = this.modelViewProjectionMatrix, f = c.inverse(m), d = h.normalize(c.transformPoint(f, u)), T = Math.max(Math.abs(d[0]), Math.abs(d[1]), Math.abs(d[2]));
-    let F = "";
-    Math.abs(d[0]) === T ? F = d[0] > 0 ? "XPOS" : "XNEG" : Math.abs(d[1]) === T ? F = d[1] > 0 ? "YPOS" : "YNEG" : F = d[2] > 0 ? "ZPOS" : "ZNEG";
-    let x = 0, M = 0, E = "";
-    switch (F) {
+    const i = this.canvas.element.clientWidth, s = this.canvas.element.clientHeight, r = e.x, a = s - e.y, n = 2 * r / i - 1, o = 2 * a / s - 1, u = [n, o, 0], l = this.modelViewProjectionMatrix, p = c.inverse(l), d = h.normalize(c.transformPoint(p, u)), T = Math.max(Math.abs(d[0]), Math.abs(d[1]), Math.abs(d[2]));
+    let A = "";
+    Math.abs(d[0]) === T ? A = d[0] > 0 ? "XPOS" : "XNEG" : Math.abs(d[1]) === T ? A = d[1] > 0 ? "YPOS" : "YNEG" : A = d[2] > 0 ? "ZPOS" : "ZNEG";
+    let x = 0, E = 0, I = "";
+    switch (A) {
       case "XPOS":
-        x = (-d[2] / Math.abs(d[0]) + 1) / 2, M = (-d[1] / Math.abs(d[0]) + 1) / 2, E = "right";
+        x = (-d[2] / Math.abs(d[0]) + 1) / 2, E = (-d[1] / Math.abs(d[0]) + 1) / 2, I = "right";
         break;
       case "XNEG":
-        x = (d[2] / Math.abs(d[0]) + 1) / 2, M = (-d[1] / Math.abs(d[0]) + 1) / 2, E = "left";
+        x = (d[2] / Math.abs(d[0]) + 1) / 2, E = (-d[1] / Math.abs(d[0]) + 1) / 2, I = "left";
         break;
       case "YPOS":
-        x = (d[0] / Math.abs(d[1]) + 1) / 2, M = (d[2] / Math.abs(d[1]) + 1) / 2, E = "up";
+        x = (d[0] / Math.abs(d[1]) + 1) / 2, E = (d[2] / Math.abs(d[1]) + 1) / 2, I = "up";
         break;
       case "YNEG":
-        x = (d[0] / Math.abs(d[1]) + 1) / 2, M = (-d[2] / Math.abs(d[1]) + 1) / 2, E = "down";
+        x = (d[0] / Math.abs(d[1]) + 1) / 2, E = (-d[2] / Math.abs(d[1]) + 1) / 2, I = "down";
         break;
       case "ZPOS":
-        x = (d[0] / Math.abs(d[2]) + 1) / 2, M = (-d[1] / Math.abs(d[2]) + 1) / 2, E = "front";
+        x = (d[0] / Math.abs(d[2]) + 1) / 2, E = (-d[1] / Math.abs(d[2]) + 1) / 2, I = "front";
         break;
       case "ZNEG":
-        x = (-d[0] / Math.abs(d[2]) + 1) / 2, M = (-d[1] / Math.abs(d[2]) + 1) / 2, E = "back";
+        x = (-d[0] / Math.abs(d[2]) + 1) / 2, E = (-d[1] / Math.abs(d[2]) + 1) / 2, I = "back";
         break;
     }
-    const O = {
+    const C = {
       x: Math.round(x * Math.max(t.parameters.width, t.parameters.height)),
-      y: Math.round(M * Math.max(t.parameters.width, t.parameters.height))
+      y: Math.round(E * Math.max(t.parameters.width, t.parameters.height))
     };
-    return this.loader.loadVRCubePick(t, O, E);
+    return this.loader.loadVRCubePick(t, C, I);
   }
   hotspots() {
     const t = [];
@@ -1247,36 +1250,36 @@ class K {
       return [];
     const e = this.hotspotsList[0]?.length ?? 0, i = this.modelViewProjectionMatrix;
     for (let s = 0; s < e; s++) {
-      const r = this.hotspotsList.findIndex((R) => R[s].visibility !== "OutOfFrustum");
+      const r = this.hotspotsList.findIndex(($) => $[s].visibility !== "OutOfFrustum");
       if (r === -1)
         continue;
       const a = { ...this.hotspotsList[r][s] }, n = a.position2D.x / this.images[0].width, o = a.position2D.y / this.images[0].height;
-      let u = 0, m = 0, f = 0;
+      let u = 0, l = 0, p = 0;
       switch (r) {
         case 0:
-          this.pov.target[2] < 0 && (a.visibility = "OutOfFrustum"), u = 2 * n - 1, m = 1 - 2 * o, f = 1;
+          this.pov.target[2] < 0 && (a.visibility = "OutOfFrustum"), u = 2 * n - 1, l = 1 - 2 * o, p = 1;
           break;
         case 1:
-          this.pov.target[0] > 0 && (a.visibility = "OutOfFrustum"), u = 1, m = 1 - 2 * o, f = 1 - 2 * n;
+          this.pov.target[0] > 0 && (a.visibility = "OutOfFrustum"), u = 1, l = 1 - 2 * o, p = 1 - 2 * n;
           break;
         case 2:
-          this.pov.target[2] > 0 && (a.visibility = "OutOfFrustum"), u = 1 - 2 * n, m = 1 - 2 * o, f = -1;
+          this.pov.target[2] > 0 && (a.visibility = "OutOfFrustum"), u = 1 - 2 * n, l = 1 - 2 * o, p = -1;
           break;
         case 3:
-          this.pov.target[0] < 0 && (a.visibility = "OutOfFrustum"), u = -1, m = 1 - 2 * o, f = 2 * n - 1;
+          this.pov.target[0] < 0 && (a.visibility = "OutOfFrustum"), u = -1, l = 1 - 2 * o, p = 2 * n - 1;
           break;
         case 4:
-          this.pov.target[1] < 0 && (a.visibility = "OutOfFrustum"), u = 2 * n - 1, m = 1, f = 2 * o - 1;
+          this.pov.target[1] < 0 && (a.visibility = "OutOfFrustum"), u = 2 * n - 1, l = 1, p = 2 * o - 1;
           break;
         case 5:
-          this.pov.target[1] > 0 && (a.visibility = "OutOfFrustum"), u = 2 * n - 1, m = -1, f = 1 - 2 * o;
+          this.pov.target[1] > 0 && (a.visibility = "OutOfFrustum"), u = 2 * n - 1, l = -1, p = 1 - 2 * o;
           break;
       }
-      const d = h.normalize([u, m, f]), T = c.transformPoint(i, d), F = this.canvas.element.clientWidth, x = this.canvas.element.clientHeight, M = 0.5 * F * (T[0] + 1), E = 0.5 * x * (T[1] + 1), O = {
-        x: Math.round(M),
-        y: Math.round(x - E)
-      }, G = new b(F, x), z = p.contains(G, O) ? a.visibility : "OutOfFrustum";
-      t.push({ ...a, position2D: O, visibility: z });
+      const d = h.normalize([u, l, p]), T = c.transformPoint(i, d), A = this.canvas.element.clientWidth, x = this.canvas.element.clientHeight, E = 0.5 * A * (T[0] + 1), I = 0.5 * x * (T[1] + 1), C = {
+        x: Math.round(E),
+        y: Math.round(x - I)
+      }, G = new f(A, x), z = b.contains(G, C) ? a.visibility : "OutOfFrustum";
+      t.push({ ...a, position2D: C, visibility: z });
     }
     return t;
   }
@@ -1284,11 +1287,11 @@ class K {
     return this.canvas.element.toDataURL(t, e);
   }
   get modelViewProjectionMatrix() {
-    const t = this.canvas.element.clientWidth, e = this.canvas.element.clientHeight, i = t > e ? t / e : e / t, s = p.getStandardAspectRatio(t, e), r = this.interaction.fov * (s / i), a = c.setAxis(c.identity(), [-1, 0, 0], 0), n = t > e ? w.perspectiveWithFovY(r, t / e, 0.5, 100) : w.perspectiveWithFovX(r, t / e, 0.5, 100), o = this.interaction.orientedPov, u = c.inverse(c.lookAt(o.eye, o.target, o.up));
+    const t = this.canvas.element.clientWidth, e = this.canvas.element.clientHeight, i = t > e ? t / e : e / t, s = b.getStandardAspectRatio(t, e, this.aspectRatioOverride), r = this.interaction.fov * (s / i), a = c.setAxis(c.identity(), [-1, 0, 0], 0), n = t > e ? w.perspectiveWithFovY(r, t / e, 0.5, 100) : w.perspectiveWithFovX(r, t / e, 0.5, 100), o = this.interaction.orientedPov, u = c.inverse(c.lookAt(o.eye, o.target, o.up));
     return c.multiply(c.multiply(n, u), a);
   }
   render() {
-    this.gl.viewport(0, 0, this.gl.canvas.width, this.gl.canvas.height), this.uniforms.u_mvpi = c.inverse(this.modelViewProjectionMatrix), this.gl.useProgram(this.programInfo.program), P.setBuffersAndAttributes(this.gl, this.programInfo, this.quad), P.setUniforms(this.programInfo, this.uniforms), P.drawBufferInfo(this.gl, this.quad), this.uniforms.u_mix < 1 && (this.uniforms.u_mix = Math.min(this.uniforms.u_mix + 0.05, 1), this.animationFrameId = requestAnimationFrame(this.render));
+    this.gl.viewport(0, 0, this.gl.canvas.width, this.gl.canvas.height), this.uniforms.u_mvpi = c.inverse(this.modelViewProjectionMatrix), this.gl.useProgram(this.programInfo.program), M.setBuffersAndAttributes(this.gl, this.programInfo, this.quad), M.setUniforms(this.programInfo, this.uniforms), M.drawBufferInfo(this.gl, this.quad), this.uniforms.u_mix < 1 && (this.uniforms.u_mix = Math.min(this.uniforms.u_mix + 0.05, 1), this.animationFrameId = requestAnimationFrame(this.render));
   }
   onMouseDown(t) {
     this.container.classList.add("ls-viewer-container-vrcube-grabbing"), this.interaction.start(y.pointFromMouseEvent(t), {
@@ -1321,9 +1324,9 @@ class K {
     this.interaction.orientation(t.alpha, t.beta, t.gamma);
   }
 }
-class tt {
+class et {
   constructor(t, e, i, s, r) {
-    this.isStarted = !1, this.position = t, this.frames = e, this.rows = i, this.loop = s, this.onMotion = r, this.inertia = new q(this.motion.bind(this)), this.initPosition = { ...this.position }, this.startPosition = { x: 0, y: 0 }, this.startPoint = new I(0, 0), this.startSize = { width: 0, height: 0 }, this.lastPoints = [], this.lastPointsNumber = 20;
+    this.isStarted = !1, this.position = t, this.frames = e, this.rows = i, this.loop = s, this.onMotion = r, this.inertia = new R(this.motion.bind(this)), this.initPosition = { ...this.position }, this.startPosition = { x: 0, y: 0 }, this.startPoint = new L(0, 0), this.startSize = { width: 0, height: 0 }, this.lastPoints = [], this.lastPointsNumber = 20;
   }
   destroy() {
     this.inertia.destroy();
@@ -1345,7 +1348,7 @@ class tt {
   }
   motion(t) {
     this.isStarted && this.inertia.track(t), this.lastPoints.push({ x: t.x, y: t.y }), this.lastPoints.splice(0, this.lastPoints.length - this.lastPointsNumber);
-    const e = $.linear(this.lastPoints.map((s) => [s.x, s.y])), i = 25;
+    const e = U.linear(this.lastPoints.map((s) => [s.x, s.y])), i = 25;
     if (Math.abs(e.equation[0]) < 1) {
       const s = w.accelerate(t.x - this.startPoint.x, 1.3) / this.startSize.width * (this.frames / 4);
       let r = this.startPosition.x - Math.round(s);
@@ -1366,7 +1369,7 @@ class tt {
 }
 class k {
   constructor(t, e, i, s) {
-    this.container = t, this.canvas = e, this.loader = i, this.images = [], this.frames = 24, this.hotspotsList = [[]], this.interaction = new tt({ x: 0, y: 0 }, 1, 1, !1, () => {
+    this.container = t, this.canvas = e, this.loader = i, this.images = [], this.frames = 24, this.hotspotsList = [[]], this.interaction = new et({ x: 0, y: 0 }, 1, 1, !1, () => {
       this.canvas.draw(this.image, !0, 0.5), this.onInteraction({
         position: this.interaction.positionIndex
       });
@@ -1411,9 +1414,9 @@ class k {
     a === this.snapshotHash && this.image ? r = r.then(() => this.canvas.draw(this.image, s, 0.05)) : (this.images = [], r = r.then(
       () => this.loader.loadVRObjectSnapshot(t, this.interaction.positionIndex).then((o) => {
         const u = o.length;
-        return this.images = new Array(u), this.interaction.frames = t.view.frames ?? t.view.panFrames ?? this.frames, this.interaction.rows = u / this.interaction.frames, this.interaction.loop = !!t.view.loop, i && this.interaction.reset(), o.forEach((m, f) => {
-          m.then((d) => {
-            this.images[f] = d, d === this.image && this.canvas.draw(this.image, s, 0.05);
+        return this.images = new Array(u), this.interaction.frames = t.view.frames ?? t.view.panFrames ?? this.frames, this.interaction.rows = u / this.interaction.frames, this.interaction.loop = !!t.view.loop, i && this.interaction.reset(), o.forEach((l, p) => {
+          l.then((d) => {
+            this.images[p] = d, d === this.image && this.canvas.draw(this.image, s, 0.05);
           }).catch(() => {
           });
         }), o[this.interaction.positionIndex].then(() => Promise.resolve());
@@ -1427,11 +1430,11 @@ class k {
     ) : this.hotspotsList = [[]]), this.hotspotsHash = n, this.snapshotHash = a, r;
   }
   async pick(t, e) {
-    const i = new b(t.parameters.width, t.parameters.height), s = p.unproject(i, this.canvas.resolution, this.canvas.fit, e);
+    const i = new f(t.parameters.width, t.parameters.height), s = b.unproject(i, this.canvas.resolution, this.canvas.fit, e);
     return this.loader.loadVRObjectPick(t, s, this.position, this.frames);
   }
   hotspots(t) {
-    return (this.hotspotsList[this.interaction.positionIndex] || []).map((i) => ({ ...i, position2D: p.project(t, this.canvas.resolution, this.canvas.fit, i.position2D) })).map((i) => ({ ...i, visibility: p.contains(this.canvas.resolution, i.position2D) ? i.visibility : "OutOfFrustum" }));
+    return (this.hotspotsList[this.interaction.positionIndex] || []).map((i) => ({ ...i, position2D: b.project(t, this.canvas.resolution, this.canvas.fit, i.position2D) })).map((i) => ({ ...i, visibility: b.contains(this.canvas.resolution, i.position2D) ? i.visibility : "OutOfFrustum" }));
   }
   snapshot(t, e) {
     return this.canvas.element.toDataURL(t, e);
@@ -1466,7 +1469,7 @@ class k {
   onDeviceOrientation(t) {
   }
 }
-class et {
+class it {
   constructor(t, e, i) {
     this.container = t, this.loader = i, this.video = e;
   }
@@ -1519,7 +1522,7 @@ class et {
   onDeviceOrientation(t) {
   }
 }
-class at {
+class nt {
   constructor(t, e) {
     this.checkResize = this.checkResize.bind(this), this.onDeviceOrientation = this.onDeviceOrientation.bind(this), this.onResize = this.onResize.bind(this), this.onMouseDown = this.onMouseDown.bind(this), this.onMouseMove = this.onMouseMove.bind(this), this.onMouseUp = this.onMouseUp.bind(this), this.onMouseEnter = this.onMouseEnter.bind(this), this.onTouchStart = this.onTouchStart.bind(this), this.onTouchMove = this.onTouchMove.bind(this), this.onTouchEnd = this.onTouchEnd.bind(this), this.onLoadStart = this.onLoadStart.bind(this), this.onLoadProgress = this.onLoadProgress.bind(this), this.onLoadEnd = this.onLoadEnd.bind(this), this.onLoadError = this.onLoadError.bind(this), this.onHotspotsChange = this.onHotspotsChange.bind(this), this.onVrcubeInteraction = this.onVrcubeInteraction.bind(this), this.onVrobjectInteraction = this.onVrobjectInteraction.bind(this), this.options = {
       server: "localhost",
@@ -1550,7 +1553,7 @@ class at {
       onHotspotsChange: () => {
       },
       ...e.events
-    }, this.options.events.onLoadError = C(this.options.events.onLoadError, 10), this.container = t, this.container.classList.add("ls-viewer-container"), this.containerWidth = 0, this.containerHeight = 0, this.canvas2D = new U(this.options.fit), this.container.prepend(this.canvas2D.element), this.canvas3D = new N(), this.container.prepend(this.canvas3D.element), this.video = new Y(), this.container.prepend(this.video.element), this.loader = new D(this.options.server, this.options.api, this), this.resolution = new b(0, 0), this.parameters = {
+    }, this.options.events.onLoadError = D(this.options.events.onLoadError, 10), this.container = t, this.container.classList.add("ls-viewer-container"), this.containerWidth = 0, this.containerHeight = 0, this.canvas2D = new N(this.options.fit), this.container.prepend(this.canvas2D.element), this.canvas3D = new B(), this.container.prepend(this.canvas3D.element), this.video = new J(), this.container.prepend(this.video.element), this.loader = new V(this.options.server, this.options.api, this), this.resolution = new f(0, 0), this.parameters = {
       width: 0,
       height: 0,
       antialiasing: !1,
@@ -1558,7 +1561,7 @@ class at {
     }, this.encoder = {
       format: "jpeg",
       quality: 80
-    }, this.hotspots = [], this.widgetImage = new J(t, this.canvas2D, this.loader), this.widgetVideo = new et(t, this.video, this.loader), this.widgetVRObject = new k(t, this.canvas2D, this.loader, this.onVrobjectInteraction), this.canvas3D.context && (this.widgetVRCube = new K(t, this.canvas3D, this.loader, this.onVrcubeInteraction)), this.widget = this.widgetImage, this.isDestroyed = !1, this.container.addEventListener("mousedown", this.onMouseDown), this.container.addEventListener("mouseenter", this.onMouseEnter), this.container.addEventListener("touchstart", this.onTouchStart), document.addEventListener("mousemove", this.onMouseMove, { passive: !1 }), document.addEventListener("mouseup", this.onMouseUp), document.addEventListener("touchmove", this.onTouchMove, { passive: !1 }), document.addEventListener("touchend", this.onTouchEnd), this.loadWidget = C(this.loadWidget, 10), this.onResize = C(this.onResize, 250), requestAnimationFrame(this.checkResize);
+    }, this.hotspots = [], this.widgetImage = new Q(t, this.canvas2D, this.loader), this.widgetVideo = new it(t, this.video, this.loader), this.widgetVRObject = new k(t, this.canvas2D, this.loader, this.onVrobjectInteraction), this.canvas3D.context && (this.widgetVRCube = new tt(t, this.canvas3D, this.loader, this.onVrcubeInteraction, this.aspectRatioOverride)), this.widget = this.widgetImage, this.isDestroyed = !1, this.container.addEventListener("mousedown", this.onMouseDown), this.container.addEventListener("mouseenter", this.onMouseEnter), this.container.addEventListener("touchstart", this.onTouchStart), document.addEventListener("mousemove", this.onMouseMove, { passive: !1 }), document.addEventListener("mouseup", this.onMouseUp), document.addEventListener("touchmove", this.onTouchMove, { passive: !1 }), document.addEventListener("touchend", this.onTouchEnd), this.loadWidget = D(this.loadWidget, 10), this.onResize = D(this.onResize, 250), requestAnimationFrame(this.checkResize);
   }
   destroy() {
     this.canvas2D.destroy(), this.container.removeEventListener("mousedown", this.onMouseDown), this.container.removeEventListener("mouseenter", this.onMouseEnter), this.container.removeEventListener("touchstart", this.onTouchStart), document.removeEventListener("mousemove", this.onMouseMove), document.removeEventListener("mouseup", this.onMouseUp), document.removeEventListener("touchmove", this.onTouchMove), document.removeEventListener("touchend", this.onTouchEnd), this.isDestroyed = !0;
@@ -1577,7 +1580,7 @@ class at {
     }), e;
   }
   setParameters(t) {
-    t.width && t.height && (this.resolution = new b(t.width, t.height)), this.parameters = { ...t }, this.parameters.width = this.resolution.width, this.parameters.height = this.resolution.height;
+    t.width && t.height && (this.resolution = new f(t.width, t.height)), this.parameters = { ...t }, this.parameters.width = this.resolution.width, this.parameters.height = this.resolution.height;
     let e = Promise.resolve();
     return e = e.then(() => this.loadWidget(!1, !0)), e.catch((i) => {
       this.onLoadError(i);
@@ -1664,6 +1667,16 @@ class at {
       this.widget.hide(), this.widget = i, this.widget.show(), this.widgetVideo.hide(), this.onHotspotsChange();
     });
   }
+  get aspectRatioOverride() {
+    switch (this.options.aspectRatio) {
+      case "4:3":
+        return 4 / 3;
+      case "16:9":
+        return 16 / 9;
+      default:
+        return;
+    }
+  }
   get viewWidget() {
     switch (this.view?.mode) {
       case "image":
@@ -1710,7 +1723,7 @@ class at {
   }
   onResize() {
     const t = this.container.clientWidth, e = this.container.clientHeight;
-    this.options.autores && (this.resolution = p.getStandardResolution(t * window.devicePixelRatio, e * window.devicePixelRatio), this.parameters.width = this.resolution.width, this.parameters.height = this.resolution.height), this.canvas2D.resize(t, e, window.devicePixelRatio), this.canvas3D.resize(t, e, window.devicePixelRatio), this.video.resize(t, e, this.resolution, this.options.fit), this.loadWidget(!1, !1).then(() => {
+    this.options.autores && (this.resolution = b.getStandardResolution(t * window.devicePixelRatio, e * window.devicePixelRatio, this.aspectRatioOverride), this.parameters.width = this.resolution.width, this.parameters.height = this.resolution.height), this.canvas2D.resize(t, e, window.devicePixelRatio), this.canvas3D.resize(t, e, window.devicePixelRatio), this.video.resize(t, e, this.resolution, this.options.fit), this.loadWidget(!1, !1).then(() => {
       this.onHotspotsChange();
     }).catch((i) => {
       this.onLoadError(i);
@@ -1739,7 +1752,7 @@ class at {
     this.container.classList.remove("ls-viewer-container-loading"), this.options.events.onLoadError(...t);
   }
 }
-var j;
+var q;
 ((v) => {
   ((t) => {
     t.Visible = "Visible", t.Occluded = "Occluded", t.Clipped = "Clipped", t.OutOfFrustum = "OutOfFrustum";
@@ -1752,12 +1765,12 @@ var j;
   })(v.SunUseCaseMode || (v.SunUseCaseMode = {})), ((t) => {
     t.ShowOnly = "showOnly", t.HideOnly = "hideOnly";
   })(v.SurfacesFilterMode || (v.SurfacesFilterMode = {}));
-})(j || (j = {}));
+})(q || (q = {}));
 export {
-  at as Viewer,
-  j as WRAPIv2,
-  J as WidgetImage,
-  K as WidgetVRCube,
+  nt as Viewer,
+  q as WRAPIv2,
+  Q as WidgetImage,
+  tt as WidgetVRCube,
   k as WidgetVRObject,
-  et as WidgetVideo
+  it as WidgetVideo
 };