@lumiscaphe/viewer 4.2.1 → 4.3.0

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 D from "debounce-promise";
-import * as M from "twgl.js";
-import { v3 as h, m4 as c } from "twgl.js";
-import U from "regression";
-class f {
+(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;touch-action:none}.ls-viewer-container-vrcube-grabbing{cursor:move;cursor:grabbing}.ls-viewer-container-vrobject{cursor:move;cursor:grab;touch-action:none}.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 T from "debounce-promise";
+import * as A from "twgl.js";
+import { v3 as h, m4 as d } from "twgl.js";
+import z from "regression";
+class b {
   constructor(t, e) {
     this.width = t, this.height = e;
   }
@@ -11,43 +11,43 @@ class f {
     return this.width / this.height;
   }
 }
-const P = class P {
-  constructor(t, e, i, s) {
-    this.top = t, this.left = e, this.width = i, this.height = s;
+const x = class x {
+  constructor(t, e, i, r) {
+    this.top = t, this.left = e, this.width = i, this.height = r;
   }
   static contains(t, e) {
     return e.x >= 0 && e.x < t.width && e.y >= 0 && e.y < t.height;
   }
   static fit(t, e, i) {
-    const s = t.aspect, r = e.aspect;
+    const r = t.aspect, s = e.aspect;
     let a = 0, n = 0;
     switch (i) {
       case "contain":
-        a = r < s ? e.width : e.height * s, n = r < s ? e.width / s : e.height;
+        a = s < r ? e.width : e.height * r, n = s < r ? e.width / r : e.height;
         break;
       case "cover":
       default:
-        a = r < s ? e.height * s : e.width, n = r < s ? e.height : e.width / s;
+        a = s < r ? e.height * r : e.width, n = s < r ? e.height : e.width / r;
         break;
       case "fill":
         a = e.width, n = e.height;
         break;
     }
-    const o = (e.height - n) / 2, u = (e.width - a) / 2;
-    return new P(o, u, a, n);
+    const o = (e.height - n) / 2, m = (e.width - a) / 2;
+    return new x(o, m, 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;
+  static project(t, e, i, r) {
+    const s = x.fit(t, e, i), a = s.width / t.width, n = s.height / t.height;
     return {
-      x: Math.round(r.left + s.x * a),
-      y: Math.round(r.top + s.y * n)
+      x: Math.round(s.left + r.x * a),
+      y: Math.round(s.top + r.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;
+  static unproject(t, e, i, r) {
+    const s = x.fit(t, e, i), a = s.width / t.width, n = s.height / t.height;
     return {
-      x: Math.round((s.x - r.left) / a),
-      y: Math.round((s.y - r.top) / n)
+      x: Math.round((r.x - s.left) / a),
+      y: Math.round((r.y - s.top) / n)
     };
   }
   static getStandardAspectRatio(t, e, i) {
@@ -55,33 +55,33 @@ const P = class P {
       return 0;
     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;
+    const r = t / e;
+    return t < e ? r < x.PORTRAIT_ASPECT_BOUNDARY ? 9 / 16 : 3 / 4 : r < x.LANDSCAPE_ASPECT_BOUNDARY ? 4 / 3 : 16 / 9;
   }
   static getStandardResolution(t, e, i) {
     if (t === 0 || e === 0)
-      return new f(0, 0);
-    const s = P.getStandardAspectRatio(t, e, i);
+      return new b(0, 0);
+    const r = x.getStandardAspectRatio(t, e, i);
     if (i) {
-      const a = P.getStandardQuality(Math.min(t, e));
-      return new f(Math.round(a * s), Math.round(a));
+      const a = x.getStandardQuality(Math.min(t, e));
+      return new b(Math.round(a * r), Math.round(a));
     }
     if (t < e) {
-      const a = P.getStandardQuality(Math.max(e * s, t));
-      return new f(Math.round(a), Math.round(a / s));
+      const a = x.getStandardQuality(Math.max(e * r, t));
+      return new b(Math.round(a), Math.round(a / r));
     }
-    const r = P.getStandardQuality(Math.max(t / s, e));
-    return new f(Math.round(r * s), Math.round(r));
+    const s = x.getStandardQuality(Math.max(t / r, e));
+    return new b(Math.round(s * r), Math.round(s));
   }
   static getStandardQuality(t) {
     return t <= 720 ? 720 : 1080;
   }
 };
-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 {
+x.LANDSCAPE_ASPECT_BOUNDARY = Math.sqrt(4 / 3 * (16 / 9)), x.PORTRAIT_ASPECT_BOUNDARY = Math.sqrt(3 / 4 * (9 / 16));
+let P = x;
+class U {
   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;
+    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.context.imageSmoothingQuality = "high", this.backCanvas = document.createElement("canvas"), this.backContext = this.backCanvas.getContext("2d"), this.backContext.imageSmoothingQuality = "high", this.fit = t;
   }
   destroy() {
     this.requestAnimationId && (cancelAnimationFrame(this.requestAnimationId), this.requestAnimationId = void 0);
@@ -92,33 +92,31 @@ class N {
   hide(t) {
     t ? this.element.style.display = "none" : this.element.style.opacity = "0";
   }
-  get resolution() {
-    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;
+    const r = Math.floor(t * i), s = Math.floor(e * i);
+    this.element.style.width = `${t}px`, this.element.style.height = `${e}px`, !(this.element.width === r && this.element.height === s) && (this.element.width = r, this.element.height = s, this.context.imageSmoothingQuality = "high", this.backCanvas.width = r, this.backCanvas.height = s, this.backContext.imageSmoothingQuality = "high", this.image && this.draw(this.image, !1));
   }
   draw(t, e, i) {
     if (!t)
       return;
     this.requestAnimationId && (cancelAnimationFrame(this.requestAnimationId), this.requestAnimationId = void 0);
-    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;
+    const r = P.fit(new b(t.width, t.height), new b(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, r.left, r.top, r.width, r.height)), this.image = t;
   }
   fadeLoop(t, e) {
     if (this.context.globalAlpha >= 1) {
       cancelAnimationFrame(this.requestAnimationId), this.requestAnimationId = void 0;
       return;
     }
-    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(() => {
+    const i = Math.min(this.context.globalAlpha + e, 1), r = P.fit(new b(t.width, t.height), new b(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, r.left, r.top, r.width, r.height), this.requestAnimationId = requestAnimationFrame(() => {
       this.fadeLoop(t, e);
     });
   }
 }
-class B {
+class N {
   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 = M.getContext(this.element, { preserveDrawingBuffer: !0 }), this.context && this.context.isContextLost() && (this.context = void 0), M.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 = A.getContext(this.element, { preserveDrawingBuffer: !0 }), this.context && this.context.isContextLost() && (this.context = void 0), A.setDefaults({ textureColor: [1, 1, 1, 1] });
   }
   show() {
     this.element.style.opacity = "1";
@@ -130,7 +128,7 @@ class B {
     this.element.width = t * i, this.element.height = e * i, this.element.style.width = `${t}px`, this.element.style.height = `${e}px`;
   }
 }
-class w {
+class p {
   static accelerate(t, e) {
     const i = e || 1.5;
     return Math.abs(t) ** i * (t > 0 ? 1 : -1);
@@ -147,45 +145,45 @@ class w {
   static mod(t, e) {
     return t - e * Math.floor(t / e);
   }
-  static perspectiveWithFovX(t, e, i, s, r) {
+  static perspectiveWithFovX(t, e, i, r, s) {
     const a = Math.tan(t / 2), n = a / e;
-    return this.perspectiveWithLeft(-a, a, -n, n, i, s, r);
+    return this.perspectiveWithLeft(-a, a, -n, n, i, r, s);
   }
-  static perspectiveWithFovY(t, e, i, s, r) {
+  static perspectiveWithFovY(t, e, i, r, s) {
     const a = i * Math.tan(t / 2), n = a * e;
-    return this.perspectiveWithLeft(-n, n, -a, a, i, s, r);
+    return this.perspectiveWithLeft(-n, n, -a, a, i, r, s);
   }
-  static perspectiveWithLeft(t, e, i, s, r, a, n) {
+  static perspectiveWithLeft(t, e, i, r, s, a, n) {
     n = n || new Float32Array(16);
-    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 o = e + t, m = e - t, l = r + i, v = r - i, c = a - s;
+    return n[0] = 2 * s / m, n[1] = 0, n[2] = 0, n[3] = 0, n[4] = 0, n[5] = 2 * s / v, n[6] = 0, n[7] = 0, n[8] = o / m, n[9] = l / v, n[10] = -a / c, n[11] = -1, n[12] = 0, n[13] = 0, n[14] = -a * s / c, n[15] = 0, n;
   }
 }
 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));
+    let r = [0, 0, 0];
+    const s = h.subtract(e, t), a = h.mulScalar([0, 1, 0], h.length(s)), n = h.mulScalar(h.normalize(h.cross(s, a)), h.length(s)), o = h.mulScalar(h.normalize(h.cross(a, n)), h.length(s));
     switch (i) {
       case "front":
-        e = h.add(t, o), s = h.normalize(a);
+        e = h.add(t, o), r = h.normalize(a);
         break;
       case "right":
-        e = h.add(t, n), s = h.normalize(a);
+        e = h.add(t, n), r = h.normalize(a);
         break;
       case "back":
-        e = h.subtract(t, o), s = h.normalize(a);
+        e = h.subtract(t, o), r = h.normalize(a);
         break;
       case "left":
-        e = h.subtract(t, n), s = h.normalize(a);
+        e = h.subtract(t, n), r = h.normalize(a);
         break;
       case "up":
-        e = h.add(t, a), s = h.normalize(h.mulScalar(o, -1));
+        e = h.add(t, a), r = h.normalize(h.mulScalar(o, -1));
         break;
       case "down":
-        e = h.subtract(t, a), s = h.normalize(o);
+        e = h.subtract(t, a), r = h.normalize(o);
         break;
     }
-    return new O(e, t, s);
+    return new O(e, t, r);
   }
   constructor(t, e, i) {
     this.target = h.copy(t), this.eye = h.copy(e), this.up = h.copy(i);
@@ -197,7 +195,7 @@ const O = class O {
     return h.normalize(h.cross(this.viewVector, this.up));
   }
   get viewMatrix() {
-    return c.inverse(c.lookAt(this.eye, this.target, this.up));
+    return d.inverse(d.lookAt(this.eye, this.target, this.up));
   }
   clone() {
     return new O(h.copy(this.target), h.copy(this.eye), h.copy(this.up));
@@ -205,49 +203,49 @@ const O = class O {
 };
 O.default = new O([0, 0, 0], [2, 2, 2], [0, 1, 0]);
 let S = O;
-class X {
+class B {
   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]);
-    this.longitude = Math.atan2(i, r), this.latitude = Math.atan2(s, Math.sqrt(i * i + r * r)), h.dot(t.up, [0, 1, 0]) < 0 && (this.longitude = Math.PI + this.longitude, this.latitude = Math.PI - this.latitude), this.distance = h.length(h.subtract(t.target, t.eye));
+    const e = h.normalize(h.subtract(t.eye, t.target)), i = h.dot(e, [1, 0, 0]), r = h.dot(e, [0, 1, 0]), s = h.dot(e, [0, 0, 1]);
+    this.longitude = Math.atan2(i, s), this.latitude = Math.atan2(r, Math.sqrt(i * i + s * s)), h.dot(t.up, [0, 1, 0]) < 0 && (this.longitude = Math.PI + this.longitude, this.latitude = Math.PI - this.latitude), this.distance = h.length(h.subtract(t.target, t.eye));
   }
   get vector() {
-    const t = Math.cos(this.latitude) * this.distance, e = Math.sin(this.latitude) * this.distance, i = Math.cos(this.longitude) * t, s = Math.sin(this.longitude) * t;
-    return [i, e, s];
+    const t = Math.cos(this.latitude) * this.distance, e = Math.sin(this.latitude) * this.distance, i = Math.cos(this.longitude) * t, r = Math.sin(this.longitude) * t;
+    return [i, e, r];
   }
   pointOfView(t) {
-    const e = c.rotationY(this.longitude), i = c.rotationX(-this.latitude), s = c.rotationZ(0), r = c.multiply(e, c.multiply(i, s));
+    const e = d.rotationY(this.longitude), i = d.rotationX(-this.latitude), r = d.rotationZ(0), s = d.multiply(e, d.multiply(i, r));
     let a = [0, 0, -1];
-    a = c.transformPoint(r, a);
+    a = d.transformPoint(s, a);
     let n = [0, 1, 0];
-    n = c.transformPoint(r, n);
+    n = d.transformPoint(s, n);
     const o = h.subtract(t, h.mulScalar(a, this.distance));
     return new S(t, o, n);
   }
 }
-class Y {
+class X {
   constructor() {
   }
-  async animation(t) {
+  async animation(t, e) {
     return t.scene;
   }
   async database(t) {
     throw new Error("Unavailable");
   }
-  async image(t) {
+  async image(t, e) {
     return t.scene;
   }
   async video(t) {
     return t.scene;
   }
-  async vrCube(t) {
+  async vrCube(t, e) {
     return t.scene;
   }
-  async vrObject(t) {
+  async vrObject(t, e) {
     return t.scene;
   }
 }
-class H {
+class q {
   constructor(t) {
     this.xmlDoc = t;
   }
@@ -310,7 +308,7 @@ class H {
     };
   }
 }
-const g = class g {
+const w = class w {
   constructor(t) {
     this.server = t;
   }
@@ -318,14 +316,14 @@ const g = class g {
     return Object.entries(t).filter(([e, i]) => i != null).map(([e, i]) => `${e}=${i}`).join("&");
   }
   static sceneParameters(t) {
-    const e = t.scene, i = e.length > 1 ? e.find((a) => a.accessory) : null, s = e.length > 1 ? e.find((a) => a.decor) : null, r = e.find((a) => a !== i && a !== s);
+    const e = t.scene, i = e.length > 1 ? e.find((a) => a.accessory) : null, r = e.length > 1 ? e.find((a) => a.decor) : null, s = e.find((a) => a !== i && a !== r);
     return {
-      databaseId: r.database,
-      configuration: r?.configuration,
-      animations: r?.animations?.join("/"),
+      databaseId: s.database,
+      configuration: s?.configuration,
+      animations: s?.animations?.join("/"),
       accessoryDatabaseId: i?.database,
-      decorDatabaseId: s?.database,
-      decorDeltaAltitude: s?.translation?.y
+      decorDatabaseId: r?.database,
+      decorDeltaAltitude: r?.translation?.y
     };
   }
   static renderParameters(t) {
@@ -345,44 +343,44 @@ const g = class g {
       imageQuality: e.quality
     };
   }
-  static async fetch(t) {
-    return fetch(t).then((e) => e.text()).then((e) => {
-      const s = e.replace(/&amp;/g, "&").match(this.xmlRegex);
-      return s ? s.map((r) => r.replace(this.xmlRegex, "$1")) : Promise.reject();
+  static async fetch(t, e) {
+    return fetch(t, { signal: e }).then((i) => i.text()).then((i) => {
+      const s = i.replace(/&amp;/g, "&").match(this.xmlRegex);
+      return s ? s.map((a) => a.replace(this.xmlRegex, "$1")) : Promise.reject();
     });
   }
-  async animation(t) {
-    const e = {
-      ...g.sceneParameters(t),
+  async animation(t, e) {
+    const i = {
+      ...w.sceneParameters(t),
       animation: t.view.animation,
       bookmarkSet: t.view.camera.split("/")[0],
       bookmark: t.view.camera.split("/")[1],
       frames: t.view.frames,
       loop: !!t.view.loop,
-      ...g.renderParameters(t),
-      ...g.encoderParameters(t)
-    }, i = g.buildQuery(e);
-    return g.fetch(`${this.server}/ImagesFromAnimation?${i}`);
+      ...w.renderParameters(t),
+      ...w.encoderParameters(t)
+    }, r = w.buildQuery(i);
+    return w.fetch(`${this.server}/ImagesFromAnimation?${r}`, e);
   }
   async database(t) {
     return fetch(`${this.server}/Database?databaseId=${t}`).then((e) => e.text()).then((e) => {
       const i = new DOMParser().parseFromString(e, "application/xml");
-      return new H(i);
+      return new q(i);
     });
   }
-  async image(t) {
-    const e = {
-      ...g.sceneParameters(t),
+  async image(t, e) {
+    const i = {
+      ...w.sceneParameters(t),
       bookmarkSet: t.view.camera.split("/")[0],
       bookmark: t.view.camera.split("/")[1],
-      ...g.renderParameters(t),
-      ...g.encoderParameters(t)
-    }, i = g.buildQuery(e);
-    return Promise.resolve(`${this.server}/ImageFromBookmark?${i}`);
+      ...w.renderParameters(t),
+      ...w.encoderParameters(t)
+    }, r = w.buildQuery(i);
+    return Promise.resolve(`${this.server}/ImageFromBookmark?${r}`);
   }
   async video(t) {
     const e = {
-      ...g.sceneParameters(t),
+      ...w.sceneParameters(t),
       animation: t.view.animation,
       bookmarkSet: t.view.camera.split("/")[0],
       bookmark: t.view.camera.split("/")[1],
@@ -390,43 +388,43 @@ const g = class g {
       frames: t.view.frames,
       loop: !!t.view.loop,
       reverse: !!t.view.reverse,
-      ...g.renderParameters(t),
-      ...g.encoderParameters(t)
-    }, i = g.buildQuery(e);
+      ...w.renderParameters(t),
+      ...w.encoderParameters(t)
+    }, i = w.buildQuery(e);
     return Promise.resolve(`${this.server}/ImagesFromAnimation?${i}`);
   }
-  async vrCube(t) {
-    const e = {
-      ...g.sceneParameters(t),
+  async vrCube(t, e) {
+    const i = {
+      ...w.sceneParameters(t),
       bookmarkSet: t.view.camera.split("/")[0],
       bookmark: t.view.camera.split("/")[1],
-      ...g.renderParameters(t),
-      ...g.encoderParameters(t)
+      ...w.renderParameters(t),
+      ...w.encoderParameters(t)
     };
-    e.width = Math.max(e.width, e.height), e.height = Math.max(e.width, e.height);
-    const i = g.buildQuery(e);
-    return g.fetch(`${this.server}/CubeFromBookmark?${i}`);
+    i.width = Math.max(i.width, i.height), i.height = Math.max(i.width, i.height);
+    const r = w.buildQuery(i);
+    return w.fetch(`${this.server}/CubeFromBookmark?${r}`, e);
   }
-  async vrObject(t) {
-    const e = {
-      ...g.sceneParameters(t),
+  async vrObject(t, e) {
+    const i = {
+      ...w.sceneParameters(t),
       bookmarkSet: t.view.camera,
-      ...g.renderParameters(t),
-      ...g.encoderParameters(t)
-    }, i = g.buildQuery(e);
-    return g.fetch(`${this.server}/ImagesFromBookmarkSet?${i}`);
+      ...w.renderParameters(t),
+      ...w.encoderParameters(t)
+    }, r = w.buildQuery(i);
+    return w.fetch(`${this.server}/ImagesFromBookmarkSet?${r}`, e);
   }
 };
-g.xmlRegex = /directUrl="([^"]*)"/g;
-let F = g;
-class m {
+w.xmlRegex = /directUrl="([^"]*)"/g;
+let C = w;
+class u {
   constructor(t) {
     this.server = t;
   }
   static scene(t) {
     return t.scene.map((e) => {
-      const { accessory: i, decor: s, ...r } = e;
-      return r;
+      const { accessory: i, decor: r, ...s } = e;
+      return s;
     });
   }
   static renderParameters(t) {
@@ -462,11 +460,11 @@ class m {
       }
     };
   }
-  static async fetchFrame(t, e) {
-    return fetch(t, { method: "POST", body: JSON.stringify(e) }).then((i) => i.json()).then((i) => i.url);
+  static async fetchFrame(t, e, i) {
+    return fetch(t, { method: "POST", body: JSON.stringify(e), signal: i }).then((r) => r.json()).then((r) => r.url);
   }
-  static async fetchFrameArray(t, e) {
-    return fetch(t, { method: "POST", body: JSON.stringify(e) }).then((i) => i.json()).then((i) => i.map((s) => s.url));
+  static async fetchFrameArray(t, e, i) {
+    return fetch(t, { method: "POST", body: JSON.stringify(e), signal: i }).then((r) => r.json()).then((r) => r.map((s) => s.url));
   }
   static async fetchHotspots(t, e) {
     return fetch(t, { method: "POST", body: JSON.stringify(e) }).then((i) => i.json());
@@ -480,47 +478,47 @@ class m {
   async database(t) {
     return fetch(`${this.server}/Database?databaseId=${t}`).then((e) => e.text()).then((e) => {
       const i = new DOMParser().parseFromString(e, "application/xml");
-      return new H(i);
+      return new q(i);
     });
   }
-  async image(t) {
-    const e = {
-      scene: m.scene(t),
+  async image(t, e) {
+    const i = {
+      scene: u.scene(t),
       mode: {
         image: {
           camera: t.view.camera
         }
       },
-      renderParameters: m.renderParameters(t),
-      encoder: m.encoder(t)
+      renderParameters: u.renderParameters(t),
+      encoder: u.encoder(t)
     };
-    return m.fetchFrame(`${this.server}/Snapshot`, e);
+    return u.fetchFrame(`${this.server}/Snapshot`, i, e);
   }
-  async vrCube(t) {
-    const e = {
-      scene: m.scene(t),
+  async vrCube(t, e) {
+    const i = {
+      scene: u.scene(t),
       mode: {
         vrCube: {
           camera: t.view.camera
         }
       },
-      renderParameters: m.renderParameters(t),
-      encoder: m.encoder(t)
+      renderParameters: u.renderParameters(t),
+      encoder: u.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), m.fetchFrameArray(`${this.server}/Snapshot`, e);
+    return i.renderParameters.width = Math.max(i.renderParameters.width, i.renderParameters.height), i.renderParameters.height = Math.max(i.renderParameters.width, i.renderParameters.height), u.fetchFrameArray(`${this.server}/Snapshot`, i, e);
   }
-  async vrObject(t) {
-    let e;
-    t.view.cameraGroup ? e = {
+  async vrObject(t, e) {
+    let i;
+    t.view.cameraGroup ? i = {
       images: {
         cameraGroup: t.view.cameraGroup
       }
-    } : t.view.frames ? e = {
+    } : t.view.frames ? i = {
       vrObject: {
         camera: t.view.camera,
         frames: t.view.frames
       }
-    } : e = {
+    } : i = {
       vrObject: {
         camera: t.view.camera,
         panFrames: t.view.panFrames || 1,
@@ -533,17 +531,17 @@ class m {
         tiltLoop: t.view.tiltLoop || !1
       }
     };
-    const i = {
-      scene: m.scene(t),
-      mode: e,
-      renderParameters: m.renderParameters(t),
-      encoder: m.encoder(t)
+    const r = {
+      scene: u.scene(t),
+      mode: i,
+      renderParameters: u.renderParameters(t),
+      encoder: u.encoder(t)
     };
-    return m.fetchFrameArray(`${this.server}/Snapshot`, i);
+    return u.fetchFrameArray(`${this.server}/Snapshot`, r, e);
   }
-  async animation(t) {
-    const e = {
-      scene: m.scene(t),
+  async animation(t, e) {
+    const i = {
+      scene: u.scene(t),
       mode: {
         animation: {
           id: t.view.animation,
@@ -551,45 +549,45 @@ class m {
           fps: t.view.fps
         }
       },
-      renderParameters: m.renderParameters(t),
-      encoder: m.encoder(t)
+      renderParameters: u.renderParameters(t),
+      encoder: u.encoder(t)
     };
-    return m.fetchFrameArray(`${this.server}/Snapshot`, e);
+    return u.fetchFrameArray(`${this.server}/Snapshot`, i, e);
   }
   async imageHotspots(t, e) {
     const i = {
-      scene: m.scene(t),
+      scene: u.scene(t),
       mode: {
         image: {
           camera: t.view.camera
         }
       },
-      renderParameters: m.renderParameters(t),
+      renderParameters: u.renderParameters(t),
       ...this.hotspotsBody(e)
     };
-    return await m.fetchHotspots(`${this.server}/Hotspot`, i);
+    return await u.fetchHotspots(`${this.server}/Hotspot`, i);
   }
   async imagePick(t, e) {
     const i = {
-      scene: m.scene(t),
+      scene: u.scene(t),
       camera: t.view.camera,
-      renderParameters: m.renderParameters(t),
+      renderParameters: u.renderParameters(t),
       positions: [e]
     };
-    return await m.fetchPick(`${this.server}/Pick`, i);
+    return await u.fetchPick(`${this.server}/Pick`, i);
   }
   async vrCubeHotspots(t, e) {
     const i = {
-      scene: m.scene(t),
+      scene: u.scene(t),
       mode: {
         vrCube: {
           camera: t.view.camera
         }
       },
-      renderParameters: m.renderParameters(t),
+      renderParameters: u.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 m.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 u.fetchHotspotsArray(`${this.server}/Hotspot`, i);
   }
   async vrObjectHotspots(t, e) {
     let i;
@@ -615,13 +613,13 @@ class m {
         tiltLoop: t.view.tiltLoop || !1
       }
     };
-    const s = {
-      scene: m.scene(t),
+    const r = {
+      scene: u.scene(t),
       mode: i,
-      renderParameters: m.renderParameters(t),
+      renderParameters: u.renderParameters(t),
       ...this.hotspotsBody(e)
     };
-    return await m.fetchHotspotsArray(`${this.server}/Hotspot`, s);
+    return await u.fetchHotspotsArray(`${this.server}/Hotspot`, r);
   }
   hotspotsBody(t) {
     return {
@@ -630,23 +628,23 @@ class m {
     };
   }
 }
-class V {
+class D {
   constructor(t, e, i) {
     switch (e) {
       case "static":
-        this.webrender = new Y();
+        this.webrender = new X();
         break;
       case "v1":
-        this.webrender = new F(t), this.webrenderV2 = new m(t);
+        this.webrender = new C(t), this.webrenderV2 = new u(t);
         break;
       case "v2":
-        this.webrender = new m(t), this.webrenderV2 = new m(t);
+        this.webrender = new u(t), this.webrenderV2 = new u(t);
         break;
       default:
-        this.webrender = new F(t), this.webrenderV2 = new m(t);
+        this.webrender = new C(t), this.webrenderV2 = new u(t);
         break;
     }
-    this.delegate = i, this.loadingId = 0, this.loaded = 0, this.total = 0, this.databases = [], this.onLoadStart = i && i.onLoadStart ? i.onLoadStart : () => {
+    this.delegate = i, this.controller = new AbortController(), this.loaded = 0, this.total = 0, this.databases = [], this.onLoadStart = i && i.onLoadStart ? i.onLoadStart : () => {
     }, this.onLoadProgress = i && i.onLoadProgress ? i.onLoadProgress : () => {
     }, this.onLoadEnd = i && i.onLoadEnd ? i.onLoadEnd : () => {
     };
@@ -654,116 +652,142 @@ class V {
   get progress() {
     return this.total ? this.loaded / this.total : 0;
   }
+  // Abort the previous logical load and start a fresh AbortController for the new
+  // one. Aborting actively cancels the previous operation's in-flight fetches and
+  // image downloads, instead of merely ignoring their late results.
+  renew() {
+    return this.controller.abort(), this.controller = new AbortController(), this.controller.signal;
+  }
   async loadImageSnapshot(t) {
-    this.loadingId += 1, this.loaded = 0, this.total = 1, this.onLoadStart(this.progress);
-    const { loadingId: e } = this;
-    return this.webrender.image(t).then((i) => this.loadImage(i, e)).then((i) => (this.onLoadEnd(this.progress), i));
+    const e = this.renew();
+    return this.loaded = 0, this.total = 1, this.onLoadStart(this.progress), this.webrender.image(t, e).then((i) => this.loadImage(i, e)).then((i) => (this.onLoadEnd(this.progress), i));
   }
   async loadVideoSnapshot(t, e) {
-    this.loadingId += 1, this.loaded = 0, this.total = 1, this.onLoadStart(this.progress);
-    const { loadingId: i } = this;
-    return this.webrender.video(e).then((s) => this.loadVideo(t, s, !!e.view.loop, i)).then(() => (this.onLoadEnd(this.progress), t));
+    const i = this.renew();
+    return this.loaded = 0, this.total = 1, this.onLoadStart(this.progress), this.webrender.video(e).then((r) => this.loadVideo(t, r, !!e.view.loop, i)).then(() => (this.onLoadEnd(this.progress), t));
   }
   async loadVRCubeSnapshot(t) {
-    this.loadingId += 1, this.loaded = 0, this.total = 0, this.onLoadStart(this.progress);
-    const { loadingId: e } = this;
-    return this.webrender.vrCube(t).then((i) => {
+    const e = this.renew();
+    return this.loaded = 0, this.total = 0, this.onLoadStart(this.progress), this.webrender.vrCube(t, e).then((i) => {
       this.total = i.length;
-      const s = i.map((r) => this.loadImage(r, e));
-      return Promise.all(s);
+      const r = i.map((s) => this.loadImage(s, e));
+      return Promise.all(r);
     }).then((i) => (this.onLoadEnd(this.progress), i));
   }
   async loadVRObjectSnapshot(t, e) {
-    this.loadingId += 1, this.loaded = 0, this.total = 0, this.onLoadStart(this.progress);
-    const { loadingId: i } = this;
-    return t.view.animation ? t.encoder?.format === "mp4" ? this.webrender.video(t).then((s) => this.loadVideoFrames(s, t.view.frames, 30, i)) : this.webrender.animation(t).then((s) => this.loadImageFrames(s, t.view.loop, e, i)) : this.webrender.vrObject(t).then((s) => this.loadImageFrames(s, t.view.loop, e, i));
+    const i = this.renew();
+    return this.loaded = 0, this.total = 0, this.onLoadStart(this.progress), t.view.animation ? t.encoder?.format === "mp4" ? this.webrender.video(t).then((r) => this.loadVideoFrames(r, t.view.frames, 30, i)) : this.webrender.animation(t, i).then((r) => this.loadImageFrames(r, t.view.loop, e, i)) : this.webrender.vrObject(t, i).then((r) => this.loadImageFrames(r, t.view.loop, e, i));
   }
   async loadImage(t, e) {
     const i = new Image();
-    i.crossOrigin = location.protocol === "file:" && !V.isValidHttpUrl(t) ? null : "anonymous";
-    const s = new Promise((r, a) => {
+    i.crossOrigin = location.protocol === "file:" && !D.isValidHttpUrl(t) ? null : "anonymous";
+    const r = new Promise((s, a) => {
+      const n = () => {
+        i.src = "", a(new DOMException("Image load aborted", "AbortError"));
+      };
+      if (e.aborted) {
+        n();
+        return;
+      }
       i.addEventListener(
         "load",
         () => {
-          e === this.loadingId && (this.loaded += 1, this.onLoadProgress(this.progress), r(i));
+          e.removeEventListener("abort", n), this.loaded += 1, this.onLoadProgress(this.progress), s(i);
         },
         { once: !0 }
       ), i.addEventListener(
         "error",
-        (n) => {
-          e === this.loadingId && a(`${n.type} : ${t}`);
+        (o) => {
+          e.removeEventListener("abort", n), a(`${o.type} : ${t}`);
         },
         { once: !0 }
-      );
+      ), e.addEventListener("abort", n, { once: !0 });
     });
-    return i.src = t, s;
+    return i.src = t, r;
   }
-  loadImageFrames(t, e, i, s) {
+  loadImageFrames(t, e, i, r) {
     this.total = t.length;
-    const r = new Array(t.length), a = i || 0;
+    const s = 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), l = e ? w.mod(a + u, o) : n;
-      r[l] = this.loadImage(t[l], s);
+      const m = Math.ceil(n / 2) * (n % 2 === 0 ? 1 : -1), l = e ? p.mod(a + m, o) : n;
+      s[l] = this.loadImage(t[l], r);
     }
-    return Promise.all(r).then(() => this.onLoadEnd(this.progress)).catch(() => {
-    }), r;
+    return Promise.all(s).then(() => this.onLoadEnd(this.progress)).catch((n) => {
+      n instanceof DOMException && n.name === "AbortError" || this.onLoadEnd(this.progress);
+    }), s;
   }
-  async loadVideo(t, e, i, s) {
+  async loadVideo(t, e, i, r) {
     t.loop = i;
-    const r = new Promise((a, n) => {
+    const s = new Promise((a, n) => {
+      const o = () => {
+        t.removeAttribute("src"), t.load(), n(new DOMException("Video load aborted", "AbortError"));
+      };
+      if (r.aborted) {
+        o();
+        return;
+      }
       t.addEventListener(
         "canplaythrough",
         () => {
-          s === this.loadingId && (this.loaded += 1, this.onLoadProgress(this.progress), a());
+          r.removeEventListener("abort", o), this.loaded += 1, this.onLoadProgress(this.progress), a();
         },
         { once: !0 }
       ), t.addEventListener(
         "error",
-        (o) => {
-          s === this.loadingId && n(`${o.type} : ${e}`);
+        (m) => {
+          r.removeEventListener("abort", o), n(`${m.type} : ${e}`);
         },
         { once: !0 }
-      );
+      ), r.addEventListener("abort", o, { once: !0 });
     });
-    return t.src = e, t.load(), r;
+    return t.src = e, t.load(), s;
   }
-  async loadVideoFrame(t, e, i, s, r) {
+  async loadVideoFrame(t, e, i, r, s) {
     let a = 0;
     return new Promise((n, o) => {
-      const u = () => {
-        if (r !== this.loadingId) return;
-        if (a !== s) {
+      const m = () => {
+        if (s.aborted) return;
+        if (a !== r) {
           a += 1;
           return;
         }
-        t.removeEventListener("seeked", u);
-        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 = l.toDataURL(), n(d), this.loaded += 1, this.onLoadProgress(this.progress), s !== i - 1 && (t.currentTime += 1 / e);
+        t.removeEventListener("seeked", m), t.removeEventListener("error", l), s.removeEventListener("abort", v);
+        const c = document.createElement("canvas");
+        c.width = t.videoWidth, c.height = t.videoHeight, c.getContext("2d").drawImage(t, 0, 0);
+        const M = new Image();
+        M.src = c.toDataURL(), n(M), this.loaded += 1, this.onLoadProgress(this.progress), r !== i - 1 && (t.currentTime += 1 / e);
+      }, l = (c) => {
+        s.removeEventListener("abort", v), o(c);
+      }, v = () => {
+        t.removeEventListener("seeked", m), t.removeEventListener("error", l), o(new DOMException("Video frame load aborted", "AbortError"));
       };
-      t.addEventListener("seeked", u), t.addEventListener(
-        "error",
-        (l) => {
-          r === this.loadingId && o(l);
-        },
-        { once: !0 }
-      );
+      if (s.aborted) {
+        v();
+        return;
+      }
+      t.addEventListener("seeked", m), t.addEventListener("error", l, { once: !0 }), s.addEventListener("abort", v, { once: !0 });
     });
   }
-  loadVideoFrames(t, e, i, s) {
+  loadVideoFrames(t, e, i, r) {
     this.total = e;
-    const r = new Array(e), a = document.createElement("video");
+    const s = new Array(e), a = document.createElement("video");
     for (let n = 0, o = e; n < o; n += 1)
-      r[n] = this.loadVideoFrame(a, i, e, n, s);
+      s[n] = this.loadVideoFrame(a, i, e, n, r);
     return a.addEventListener(
       "canplaythrough",
       () => {
-        s === this.loadingId && (a.currentTime = 1 / i / 2);
+        r.aborted || (a.currentTime = 1 / i / 2);
       },
       { once: !0 }
-    ), a.src = t, a.load(), Promise.all(r).then(() => this.onLoadEnd(this.progress)).catch(() => {
-    }), r;
+    ), r.addEventListener(
+      "abort",
+      () => {
+        a.removeAttribute("src"), a.load();
+      },
+      { once: !0 }
+    ), a.src = t, a.load(), Promise.all(s).then(() => this.onLoadEnd(this.progress)).catch((n) => {
+      n instanceof DOMException && n.name === "AbortError" || this.onLoadEnd(this.progress);
+    }), s;
   }
   async loadImageHotspots(t, e) {
     return this.webrenderV2 ? await this.webrenderV2.imageHotspots(await this.convert(t), e) : Promise.reject(new Error("Hotspots only available with api V2"));
@@ -777,21 +801,21 @@ class V {
   async loadImagePick(t, e) {
     return this.webrenderV2 ? await this.webrenderV2.imagePick(await this.convert(t), e) : Promise.reject(new Error("Picking only available with api V2"));
   }
-  async loadVRObjectPick(t, e, i, s) {
-    return this.webrenderV2 ? await this.webrenderV2.imagePick(await this.vrObjectFrameSnapshot(t, i, s), e) : Promise.reject(new Error("Picking only available with api V2"));
+  async loadVRObjectPick(t, e, i, r) {
+    return this.webrenderV2 ? await this.webrenderV2.imagePick(await this.vrObjectFrameSnapshot(t, i, r), e) : Promise.reject(new Error("Picking only available with api V2"));
   }
   async loadVRCubePick(t, e, i) {
     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 m || !t.view.camera)
+    if (!this.webrenderV2 || this.webrender instanceof u || !t.view.camera)
       return t;
     const e = t.scene.find((o) => !o.decor && !o.accessory);
     if (!e)
       return t;
     let i = this.databases.find((o) => o.id === e.database);
     (!i || !i.xmlDoc) && (i = await this.webrender.database(e.database), this.databases.push(i));
-    const s = t.view.camera.split("/"), r = s.length === 2 ? s[0] : void 0, a = s.length === 2 ? s[1] : s[0], n = i.getCameraId(a, r);
+    const r = t.view.camera.split("/"), s = r.length === 2 ? r[0] : void 0, a = r.length === 2 ? r[1] : r[0], n = i.getCameraId(a, s);
     if (n)
       return { ...t, view: { ...t.view, camera: n } };
     {
@@ -802,29 +826,29 @@ class V {
   async vrObjectFrameSnapshot(t, e, i) {
     if (!this.webrenderV2)
       return t;
-    const s = t.scene.find((a) => !a.decor && !a.accessory);
-    if (!s)
+    const r = t.scene.find((a) => !a.decor && !a.accessory);
+    if (!r)
       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 F) {
+    let s = this.databases.find((a) => a.id === r.database);
+    if (s || (s = await this.webrender.database(r.database), this.databases.push(s)), this.webrender instanceof C) {
       if (!t.view.camera)
         return t;
-      const a = r.getCameraGroupId(t.view.camera);
+      const a = s.getCameraGroupId(t.view.camera);
       if (!a)
         return t;
-      const n = r.getCameraGroupById(a);
+      const n = s.getCameraGroupById(a);
       if (!n)
         return t;
       const o = n.cameras[e];
       return o ? { ...t, view: { ...t.view, camera: o.id } } : t;
-    } else if (this.webrender instanceof m) {
+    } else if (this.webrender instanceof u) {
       const a = typeof t.view.camera == "string" ? t.view.camera : t.view.camera?.id;
       if (a) {
-        const n = r.getCameraById(a);
+        const n = s.getCameraById(a);
         if (!n)
           return t;
-        const o = new X(n.pointOfView), u = 2 * Math.PI / i;
-        o.longitude += e * u % (2 * Math.PI);
+        const o = new B(n.pointOfView), m = 2 * Math.PI / i;
+        o.longitude += e * m % (2 * Math.PI);
         const l = o.pointOfView(n.pointOfView.target);
         return {
           ...t,
@@ -853,7 +877,7 @@ class V {
           }
         };
       } else if (t.view.cameraGroup) {
-        const n = r.getCameraGroupById(t.view.cameraGroup);
+        const n = s.getCameraGroupById(t.view.cameraGroup);
         if (!n)
           return t;
         const o = n.cameras[e];
@@ -867,17 +891,17 @@ class V {
     const i = t.scene.find((o) => !o.decor && !o.accessory);
     if (!i)
       return t;
-    let s = this.databases.find((o) => o.id === i.database);
-    if (s || (s = await this.webrender.database(i.database), this.databases.push(s)), !t.view.camera)
+    let r = this.databases.find((o) => o.id === i.database);
+    if (r || (r = await this.webrender.database(i.database), this.databases.push(r)), !t.view.camera)
       return t;
-    let r;
-    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)
+    let s;
+    if (this.webrender instanceof C) {
+      const o = t.view.camera.split("/"), m = o.length === 2 ? o[0] : void 0, l = o.length === 2 ? o[1] : o[0];
+      s = r.getCameraId(l, m);
+    } else this.webrender instanceof u && (s = typeof t.view.camera == "string" ? t.view.camera : t.view.camera.id);
+    if (!s)
       return t;
-    const a = s.getCameraById(r);
+    const a = r.getCameraById(s);
     if (!a)
       return t;
     const n = S.initCubeFace(a.pointOfView.eye, a.pointOfView.target, e);
@@ -935,7 +959,7 @@ class V {
     return e.protocol === "http:" || e.protocol === "https:";
   }
 }
-class J {
+class Y {
   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");
   }
@@ -945,9 +969,9 @@ class J {
   hide() {
     this.element.style.opacity = "0";
   }
-  resize(t, e, i, 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);
+  resize(t, e, i, r) {
+    const s = P.fit(i, new b(t, e), r);
+    this.element.style.top = `${s.top}px`, this.element.style.left = `${s.left}px`, this.element.style.width = `${s.width}px`, this.element.style.height = `${s.height}px`, (i.width !== this.element.width || i.height !== this.element.height) && (this.element.width = i.width, this.element.height = i.height);
   }
 }
 class Q {
@@ -962,122 +986,115 @@ class Q {
   hide() {
     this.canvas.hide(!1), this.container.classList.remove("ls-viewer-container-image");
   }
-  async load(t, e, i, s) {
-    let r = Promise.resolve();
+  async load(t, e, i, r) {
+    let s = Promise.resolve();
     const a = JSON.stringify(t);
-    a === this.snapshotHash && this.image ? r = r.then(() => this.canvas.draw(this.image, s, 0.05)) : r = r.then(
+    a === this.snapshotHash && this.image ? s = s.then(() => this.canvas.draw(this.image, r, 0.05)) : s = s.then(
       () => this.loader.loadImageSnapshot(t).then((o) => {
-        this.canvas.draw(o, s, 0.05), this.image = o;
+        this.canvas.draw(o, r, 0.05), this.image = o;
       })
     );
     const n = JSON.stringify(e);
-    return (a !== this.snapshotHash || n !== this.hotspotsHash) && (e.length ? r = r.then(
+    return (a !== this.snapshotHash || n !== this.hotspotsHash) && (e.length ? s = s.then(
       () => this.loader.loadImageHotspots(t, e).then((o) => {
         this.hotspotList = o;
       })
-    ) : this.hotspotList = []), this.hotspotsHash = n, this.snapshotHash = a, r;
+    ) : this.hotspotList = []), this.hotspotsHash = n, this.snapshotHash = a, s;
   }
   async pick(t, 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);
+    const i = new b(t.parameters.width, t.parameters.height), r = P.unproject(i, this.canvas.resolution, this.canvas.fit, e);
+    return this.loader.loadImagePick(t, r);
   }
   hotspots(t) {
-    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" }));
+    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" }));
   }
   snapshot(t, e) {
     return this.canvas.element.toDataURL(t, e);
   }
-  onMouseDown(t) {
-  }
-  onMouseMove(t) {
-  }
-  onMouseUp(t) {
+  onPointerDown(t) {
   }
-  onMouseEnter(t) {
+  onPointerMove(t) {
   }
-  onTouchStart(t) {
+  onPointerUp(t) {
   }
-  onTouchMove(t) {
-  }
-  onTouchEnd(t) {
+  onPointerCancel(t) {
   }
   onDeviceOrientation(t) {
   }
 }
-class L {
-  constructor(t, e) {
-    this.x = t, this.y = e;
-  }
-  clone() {
-    return new L(this.x, this.y);
-  }
-}
-class y {
-  static pointFromMouseEvent(t) {
-    return new L(t.screenX, t.screenY);
-  }
-  static pointFromTouchEvent(t) {
-    const e = t.targetTouches[0] || t.changedTouches[0];
-    return new L(e.screenX, e.screenY);
-  }
-}
-class j {
+class V {
   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]);
   }
   get localToGlobalMatrix() {
-    const t = [this.u[0], this.u[1], this.u[2], 0], e = [this.v[0], this.v[1], this.v[2], 0], i = [this.w[0], this.w[1], this.w[2], 0], s = [this.o[0], this.o[1], this.o[2], 1];
-    return [...t, ...e, ...i, ...s];
+    const t = [this.u[0], this.u[1], this.u[2], 0], e = [this.v[0], this.v[1], this.v[2], 0], i = [this.w[0], this.w[1], this.w[2], 0], r = [this.o[0], this.o[1], this.o[2], 1];
+    return [...t, ...e, ...i, ...r];
   }
   get globalToLocalMatrix() {
-    return c.inverse(this.localToGlobalMatrix);
+    return d.inverse(this.localToGlobalMatrix);
   }
 }
-class Z {
+class J {
   constructor(t, e, i) {
     this.x = t, this.y = e, this.time = i;
   }
 }
-class R {
+class y {
+  constructor(t, e) {
+    this.x = t, this.y = e;
+  }
+  clone() {
+    return new y(this.x, this.y);
+  }
+}
+class H {
   constructor(t) {
-    this.points = [], this.onMotion = t, this.lastPoint = new L(0, 0), this.velocity = new L(0, 0), this.loop = this.loop.bind(this);
+    this.loop = () => {
+      if (Math.abs(this.velocity.x) < 1 && Math.abs(this.velocity.y) < 1) {
+        this.animationFrameId = void 0, this.points = [];
+        return;
+      }
+      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);
+    }, this.points = [], this.onMotion = t, this.lastPoint = new y(0, 0), this.velocity = new y(0, 0);
   }
   destroy() {
     this.animationFrameId && (cancelAnimationFrame(this.animationFrameId), this.animationFrameId = void 0);
   }
   track(t) {
     const e = Date.now();
-    this.points = this.points.filter((i) => e - i.time <= 100), this.points.push(new Z(t.x, t.y, e)), this.lastPoint = t;
+    this.points = this.points.filter((i) => e - i.time <= 100), this.points.push(new J(t.x, t.y, e)), this.lastPoint = t;
   }
   start() {
     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 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);
+    const t = this.points[0], e = this.points[this.points.length - 1], i = e.x - t.x, r = e.y - t.y, s = e.time - t.time;
+    this.velocity = new y(s === 0 ? 0 : i / (s / 15), s === 0 ? 0 : r / (s / 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 = [];
   }
-  loop() {
-    if (Math.abs(this.velocity.x) < 1 && Math.abs(this.velocity.y) < 1) {
-      this.animationFrameId = void 0, this.points = [];
-      return;
-    }
-    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 W {
+class Z {
   constructor(t, e, i) {
-    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);
+    this.motion = (r) => {
+      this.isStarted && this.inertia.track(r);
+      const s = {
+        x: r.x - this.previousPoint.x,
+        y: r.y - this.previousPoint.y
+      }, a = p.accelerate(s.x, 1.3) / this.startSize.width * 0.2 * Math.PI * 1.5, n = p.accelerate(s.y, 1.3) / this.startSize.height * 0.2 * Math.PI, o = d.multiply(d.rotationY(a), d.rotationX(-n)), m = h.normalize(h.cross(this.pov.up, this.pov.target)), l = new V(m, [0, 1, 0], this.pov.eye), v = d.identity();
+      d.multiply(v, l.localToGlobalMatrix, v), d.multiply(v, o, v), d.multiply(v, l.globalToLocalMatrix, v);
+      const c = d.transformPoint(v, this.pov.target), f = d.transformDirection(v, this.pov.up);
+      h.cross(f, [0, 0, 1])[0] >= 0 && (this.pov.target = c, this.pov.up = f), this.previousPoint = r, this.onMotion();
+    }, this.isStarted = !1, this.pov = t, this.fov = p.degreesToRadians(e), this.orientationMatrix = d.identity(), this.inertia = new H(this.motion), this.onMotion = i, this.initPov = this.pov, this.initFov = this.fov, this.initOrientation = p.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 y(0, 0);
   }
   destroy() {
     this.inertia.destroy();
   }
   get orientedPov() {
-    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 S(s, r, a);
+    const t = h.normalize(h.cross(this.pov.up, this.pov.target)), e = new V(t, [0, 1, 0], this.pov.eye), i = d.identity();
+    d.multiply(i, e.localToGlobalMatrix, i), d.multiply(i, this.orientationMatrix, i), d.multiply(i, e.globalToLocalMatrix, i);
+    const r = d.transformDirection(i, this.pov.target), s = this.pov.eye, a = d.transformDirection(i, this.pov.up);
+    return new S(r, s, a);
   }
   reset() {
     this.pov = this.initPov.clone(), this.fov = this.initFov;
@@ -1085,22 +1102,12 @@ class W {
   start(t, e) {
     this.isStarted = !0, this.startPov = this.pov, this.startSize = e, this.previousPoint = t, this.inertia.stop();
   }
-  motion(t) {
-    this.isStarted && this.inertia.track(t);
-    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 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), 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());
   }
   orientation(t, e, i) {
-    const s = w.degreesToRadians(window.orientation) || 0, r = w.degreesToRadians(t), a = w.degreesToRadians(-e), n = w.degreesToRadians(-i), o = c.rotationX(w.degreesToRadians(90));
-    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();
+    const r = p.degreesToRadians(window.orientation) || 0, s = p.degreesToRadians(t), a = p.degreesToRadians(-e), n = p.degreesToRadians(-i), o = d.rotationX(p.degreesToRadians(90));
+    d.rotateZ(o, this.initOrientation, o), d.rotateZ(o, s, o), d.rotateX(o, a, o), d.rotateY(o, n, o), d.rotateZ(o, -r, o), this.orientationMatrix = o, this.onMotion();
   }
 }
 var _ = `precision mediump float;
@@ -1115,7 +1122,7 @@ void main() {
   vec4 backColor = textureCube(u_texture_back, direction);
   vec4 color = textureCube(u_texture, direction);
   gl_FragColor = mix(backColor, color, u_mix);
-}`, K = `attribute vec4 position;
+}`, W = `attribute vec4 position;
 
 uniform mat4 u_mvpi;
 
@@ -1125,33 +1132,35 @@ void main() {
   direction = (u_mvpi * position).xyz;
   gl_Position = position;
 }`;
-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, () => {
+class K {
+  constructor(t, e, i, r, s) {
+    this.render = () => {
+      this.gl.viewport(0, 0, this.gl.canvas.width, this.gl.canvas.height), this.uniforms.u_mvpi = d.inverse(this.modelViewProjectionMatrix), this.gl.useProgram(this.programInfo.program), A.setBuffersAndAttributes(this.gl, this.programInfo, this.quad), A.setUniforms(this.programInfo, this.uniforms), A.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.container = t, this.canvas = e, this.loader = i, this.aspectRatioOverride = s, this.images = [], this.hotspotsList = [[]];
+    const a = new S([0, 0, 1], [0, 0, 0], [0, 1, 0]), n = 60, o = d.rotationX(p.degreesToRadians(15));
+    d.transformDirection(o, a.target, a.target), d.transformDirection(o, a.up, a.up), this.interaction = new Z(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 = M.createProgramInfo(this.gl, [`${K}
+    }), this.onInteraction = r, this.gl = this.canvas.context, this.programInfo = A.createProgramInfo(this.gl, [`${W}
 `, `${_}
-`]), this.quad = M.primitives.createXYQuadBufferInfo(this.gl), this.uniforms = {
-      u_mvpi: c.identity(),
+`]), this.quad = A.primitives.createXYQuadBufferInfo(this.gl), this.uniforms = {
+      u_mvpi: d.identity(),
       u_mix: 0,
-      u_texture_back: M.createTexture(this.gl, {
+      u_texture_back: A.createTexture(this.gl, {
         target: this.gl.TEXTURE_CUBE_MAP,
         minMag: this.gl.LINEAR,
         width: 1,
         height: 1
       }),
-      u_texture: M.createTexture(this.gl, {
+      u_texture: A.createTexture(this.gl, {
         target: this.gl.TEXTURE_CUBE_MAP,
         minMag: this.gl.LINEAR,
         width: 1,
         height: 1
       })
-    }, this.render = this.render.bind(this);
+    };
   }
   destroy() {
     this.interaction.destroy(), this.animationFrameId && (cancelAnimationFrame(this.animationFrameId), this.animationFrameId = void 0);
@@ -1169,21 +1178,21 @@ class tt {
     this.interaction.pov.eye.every((e, i) => e === t.eye[i]) && this.interaction.pov.target.every((e, i) => e === t.target[i]) && this.interaction.pov.up.every((e, i) => e === t.up[i]) || (this.interaction.pov = t.clone(), this.animationFrameId = requestAnimationFrame(this.render));
   }
   get fov() {
-    return w.radiansToDegrees(this.interaction.fov);
+    return p.radiansToDegrees(this.interaction.fov);
   }
   set fov(t) {
-    this.interaction.fov !== t && (this.interaction.fov = w.degreesToRadians(t), this.animationFrameId = requestAnimationFrame(this.render));
+    this.interaction.fov !== t && (this.interaction.fov = p.degreesToRadians(t), this.animationFrameId = requestAnimationFrame(this.render));
   }
-  async load(t, e, i, s) {
-    let r = Promise.resolve();
+  async load(t, e, i, r) {
+    let s = Promise.resolve();
     {
       const o = this.gl.getExtension("WEBGL_debug_renderer_info");
       o && navigator.platform === "MacIntel" && navigator.userAgent.includes("Chrome") && this.gl.getParameter(o.UNMASKED_RENDERER_WEBGL).includes("OpenGL") && (t.parameters.width = Math.min(t.parameters.width, 1812), t.parameters.height = Math.min(t.parameters.height, 1812));
     }
     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(
+    a === this.snapshotHash ? s = s.then(() => (this.animationFrameId = requestAnimationFrame(this.render), Promise.resolve())) : (this.images = [], this.animationFrameId = requestAnimationFrame(this.render), s = s.then(
       () => this.loader.loadVRCubeSnapshot(t).then((o) => {
-        this.images = o, M.createTexture(
+        this.images = o, A.createTexture(
           this.gl,
           {
             target: this.gl.TEXTURE_CUBE_MAP,
@@ -1200,86 +1209,86 @@ class tt {
             ],
             src: o
           },
-          (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));
+          (m, l) => {
+            m || (i && this.interaction.reset(), this.uniforms.u_mix = r ? 0 : 1, this.uniforms.u_texture_back = this.uniforms.u_texture, this.uniforms.u_texture = l, this.animationFrameId = requestAnimationFrame(this.render));
           }
         );
       })
     ));
     const n = JSON.stringify(e);
-    return (a !== this.snapshotHash || n !== this.hotspotsHash) && (e.length ? r = r.then(
+    return (a !== this.snapshotHash || n !== this.hotspotsHash) && (e.length ? s = s.then(
       () => this.loader.loadVRCubeHotspots(t, e).then((o) => {
         this.hotspotsList = o;
       })
-    ) : this.hotspotsList = [[]]), this.hotspotsHash = n, this.snapshotHash = a, r;
+    ) : this.hotspotsList = [[]]), this.hotspotsHash = n, this.snapshotHash = a, s;
   }
   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], 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) {
+    const i = this.canvas.element.clientWidth, r = this.canvas.element.clientHeight, s = e.x, a = r - e.y, n = 2 * s / i - 1, o = 2 * a / r - 1, m = [n, o, 0], l = this.modelViewProjectionMatrix, v = d.inverse(l), c = h.normalize(d.transformPoint(v, m)), f = Math.max(Math.abs(c[0]), Math.abs(c[1]), Math.abs(c[2]));
+    let M = "";
+    Math.abs(c[0]) === f ? M = c[0] > 0 ? "XPOS" : "XNEG" : Math.abs(c[1]) === f ? M = c[1] > 0 ? "YPOS" : "YNEG" : M = c[2] > 0 ? "ZPOS" : "ZNEG";
+    let E = 0, L = 0, I = "";
+    switch (M) {
       case "XPOS":
-        x = (-d[2] / Math.abs(d[0]) + 1) / 2, E = (-d[1] / Math.abs(d[0]) + 1) / 2, I = "right";
+        E = (-c[2] / Math.abs(c[0]) + 1) / 2, L = (-c[1] / Math.abs(c[0]) + 1) / 2, I = "right";
         break;
       case "XNEG":
-        x = (d[2] / Math.abs(d[0]) + 1) / 2, E = (-d[1] / Math.abs(d[0]) + 1) / 2, I = "left";
+        E = (c[2] / Math.abs(c[0]) + 1) / 2, L = (-c[1] / Math.abs(c[0]) + 1) / 2, I = "left";
         break;
       case "YPOS":
-        x = (d[0] / Math.abs(d[1]) + 1) / 2, E = (d[2] / Math.abs(d[1]) + 1) / 2, I = "up";
+        E = (c[0] / Math.abs(c[1]) + 1) / 2, L = (c[2] / Math.abs(c[1]) + 1) / 2, I = "up";
         break;
       case "YNEG":
-        x = (d[0] / Math.abs(d[1]) + 1) / 2, E = (-d[2] / Math.abs(d[1]) + 1) / 2, I = "down";
+        E = (c[0] / Math.abs(c[1]) + 1) / 2, L = (-c[2] / Math.abs(c[1]) + 1) / 2, I = "down";
         break;
       case "ZPOS":
-        x = (d[0] / Math.abs(d[2]) + 1) / 2, E = (-d[1] / Math.abs(d[2]) + 1) / 2, I = "front";
+        E = (c[0] / Math.abs(c[2]) + 1) / 2, L = (-c[1] / Math.abs(c[2]) + 1) / 2, I = "front";
         break;
       case "ZNEG":
-        x = (-d[0] / Math.abs(d[2]) + 1) / 2, E = (-d[1] / Math.abs(d[2]) + 1) / 2, I = "back";
+        E = (-c[0] / Math.abs(c[2]) + 1) / 2, L = (-c[1] / Math.abs(c[2]) + 1) / 2, I = "back";
         break;
     }
-    const C = {
-      x: Math.round(x * Math.max(t.parameters.width, t.parameters.height)),
-      y: Math.round(E * Math.max(t.parameters.width, t.parameters.height))
+    const F = {
+      x: Math.round(E * Math.max(t.parameters.width, t.parameters.height)),
+      y: Math.round(L * Math.max(t.parameters.width, t.parameters.height))
     };
-    return this.loader.loadVRCubePick(t, C, I);
+    return this.loader.loadVRCubePick(t, F, I);
   }
   hotspots() {
     const t = [];
     if (this.hotspotsList.length === 0)
       return [];
     const e = this.hotspotsList[0]?.length ?? 0, i = this.modelViewProjectionMatrix;
-    for (let s = 0; s < e; s++) {
-      const r = this.hotspotsList.findIndex(($) => $[s].visibility !== "OutOfFrustum");
-      if (r === -1)
+    for (let r = 0; r < e; r++) {
+      const s = this.hotspotsList.findIndex(($) => $[r].visibility !== "OutOfFrustum");
+      if (s === -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, l = 0, p = 0;
-      switch (r) {
+      const a = { ...this.hotspotsList[s][r] }, n = a.position2D.x / this.images[0].width, o = a.position2D.y / this.images[0].height;
+      let m = 0, l = 0, v = 0;
+      switch (s) {
         case 0:
-          this.pov.target[2] < 0 && (a.visibility = "OutOfFrustum"), u = 2 * n - 1, l = 1 - 2 * o, p = 1;
+          this.pov.target[2] < 0 && (a.visibility = "OutOfFrustum"), m = 2 * n - 1, l = 1 - 2 * o, v = 1;
           break;
         case 1:
-          this.pov.target[0] > 0 && (a.visibility = "OutOfFrustum"), u = 1, l = 1 - 2 * o, p = 1 - 2 * n;
+          this.pov.target[0] > 0 && (a.visibility = "OutOfFrustum"), m = 1, l = 1 - 2 * o, v = 1 - 2 * n;
           break;
         case 2:
-          this.pov.target[2] > 0 && (a.visibility = "OutOfFrustum"), u = 1 - 2 * n, l = 1 - 2 * o, p = -1;
+          this.pov.target[2] > 0 && (a.visibility = "OutOfFrustum"), m = 1 - 2 * n, l = 1 - 2 * o, v = -1;
           break;
         case 3:
-          this.pov.target[0] < 0 && (a.visibility = "OutOfFrustum"), u = -1, l = 1 - 2 * o, p = 2 * n - 1;
+          this.pov.target[0] < 0 && (a.visibility = "OutOfFrustum"), m = -1, l = 1 - 2 * o, v = 2 * n - 1;
           break;
         case 4:
-          this.pov.target[1] < 0 && (a.visibility = "OutOfFrustum"), u = 2 * n - 1, l = 1, p = 2 * o - 1;
+          this.pov.target[1] < 0 && (a.visibility = "OutOfFrustum"), m = 2 * n - 1, l = 1, v = 2 * o - 1;
           break;
         case 5:
-          this.pov.target[1] > 0 && (a.visibility = "OutOfFrustum"), u = 2 * n - 1, l = -1, p = 1 - 2 * o;
+          this.pov.target[1] > 0 && (a.visibility = "OutOfFrustum"), m = 2 * n - 1, l = -1, v = 1 - 2 * o;
           break;
       }
-      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 });
+      const c = h.normalize([m, l, v]), f = d.transformPoint(i, c), M = this.canvas.element.clientWidth, E = this.canvas.element.clientHeight, L = 0.5 * M * (f[0] + 1), I = 0.5 * E * (f[1] + 1), F = {
+        x: Math.round(L),
+        y: Math.round(E - I)
+      }, R = new b(M, E), G = P.contains(R, F) ? a.visibility : "OutOfFrustum";
+      t.push({ ...a, position2D: F, visibility: G });
     }
     return t;
   }
@@ -1287,46 +1296,47 @@ class tt {
     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 = 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);
+    const t = this.canvas.element.clientWidth, e = this.canvas.element.clientHeight, i = t > e ? t / e : e / t, r = P.getStandardAspectRatio(t, e, this.aspectRatioOverride), s = this.interaction.fov * (r / i), a = d.setAxis(d.identity(), [-1, 0, 0], 0), n = t > e ? p.perspectiveWithFovY(s, t / e, 0.5, 100) : p.perspectiveWithFovX(s, t / e, 0.5, 100), o = this.interaction.orientedPov, m = d.inverse(d.lookAt(o.eye, o.target, o.up));
+    return d.multiply(d.multiply(n, m), 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), 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), {
+  onPointerDown(t) {
+    this.container.setPointerCapture(t.pointerId), this.container.classList.add("ls-viewer-container-vrcube-grabbing"), this.interaction.start(new y(t.screenX, t.screenY), {
       width: this.gl.canvas.width,
       height: this.gl.canvas.height
     });
   }
-  onMouseMove(t) {
-    this.interaction.isStarted && (this.interaction.motion(y.pointFromMouseEvent(t)), t.preventDefault());
-  }
-  onMouseUp(t) {
-    this.interaction.isStarted && (this.container.classList.remove("ls-viewer-container-vrcube-grabbing"), this.interaction.end(y.pointFromMouseEvent(t), !0));
+  onPointerMove(t) {
+    this.interaction.isStarted && (this.interaction.motion(new y(t.screenX, t.screenY)), t.preventDefault());
   }
-  onMouseEnter(t) {
-    this.interaction.isStarted && t.buttons === 0 && (this.container.classList.remove("ls-viewer-container-vrcube-grabbing"), this.interaction.end(y.pointFromMouseEvent(t), !1));
+  onPointerUp(t) {
+    this.interaction.isStarted && (this.container.classList.remove("ls-viewer-container-vrcube-grabbing"), this.interaction.end(new y(t.screenX, t.screenY), !0));
   }
-  onTouchStart(t) {
-    this.container.classList.add("ls-viewer-container-vrcube-grabbing"), this.interaction.start(y.pointFromTouchEvent(t), {
-      width: this.gl.canvas.width,
-      height: this.gl.canvas.height
-    });
-  }
-  onTouchMove(t) {
-    this.interaction.isStarted && (this.interaction.motion(y.pointFromTouchEvent(t)), t.preventDefault());
-  }
-  onTouchEnd(t) {
-    this.interaction.isStarted && (this.container.classList.remove("ls-viewer-container-vrcube-grabbing"), this.interaction.end(y.pointFromTouchEvent(t), !0));
+  onPointerCancel(t) {
+    this.interaction.isStarted && (this.container.classList.remove("ls-viewer-container-vrcube-grabbing"), this.interaction.end(new y(t.screenX, t.screenY), !1));
   }
   onDeviceOrientation(t) {
     this.interaction.orientation(t.alpha, t.beta, t.gamma);
   }
 }
-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 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;
+class tt {
+  constructor(t, e, i, r, s) {
+    this.motion = (a) => {
+      this.isStarted && this.inertia.track(a), this.lastPoints.push({ x: a.x, y: a.y }), this.lastPoints.splice(0, this.lastPoints.length - this.lastPointsNumber);
+      const n = z.linear(this.lastPoints.map((m) => [m.x, m.y])), o = 25;
+      if (Math.abs(n.equation[0]) < 1) {
+        const m = p.accelerate(a.x - this.startPoint.x, 1.3) / this.startSize.width * (this.frames / 4);
+        let l = this.startPosition.x - Math.round(m);
+        l = this.loop ? p.mod(l, this.frames) : Math.max(0, Math.min(l, this.frames - 1)), l !== this.position.x && (this.position.x = l, this.onMotion());
+        const v = Math.min(...this.lastPoints.map((f) => f.x));
+        Math.max(...this.lastPoints.map((f) => f.x)) - v > o && (this.startPoint.y = a.y, this.startPosition.y = this.position.y);
+      } else {
+        const m = p.accelerate(a.y - this.startPoint.y, 1.7) / this.startSize.height * (this.rows / 4);
+        let l = this.startPosition.y + Math.round(m);
+        l = Math.max(0, Math.min(l, this.rows - 1)), l !== this.position.y && (this.position.y = l, this.onMotion());
+        const v = Math.min(...this.lastPoints.map((f) => f.y));
+        Math.max(...this.lastPoints.map((f) => f.y)) - v > o && (this.startPoint.x = a.x, this.startPosition.x = this.position.x);
+      }
+    }, this.isStarted = !1, this.position = t, this.frames = e, this.rows = i, this.loop = r, this.onMotion = s, this.inertia = new H(this.motion), this.initPosition = { ...this.position }, this.startPosition = { x: 0, y: 0 }, this.startPoint = new y(0, 0), this.startSize = { width: 0, height: 0 }, this.lastPoints = [], this.lastPointsNumber = 20;
   }
   destroy() {
     this.inertia.destroy();
@@ -1340,40 +1350,23 @@ class et {
   set positionIndex(t) {
     if (this.positionIndex === t)
       return;
-    const e = this.loop ? w.mod(t, this.frames * this.rows) : Math.max(0, Math.min(t, this.frames * this.rows));
-    this.position.x = w.mod(e, this.frames), this.position.y = Math.floor(e / this.frames);
+    const e = this.loop ? p.mod(t, this.frames * this.rows) : Math.max(0, Math.min(t, this.frames * this.rows));
+    this.position.x = p.mod(e, this.frames), this.position.y = Math.floor(e / this.frames);
   }
   start(t, e) {
     this.isStarted = !0, this.startPosition = { ...this.position }, this.startPoint = t, this.startSize = e, this.lastPoints = [], this.inertia.stop();
   }
-  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 = 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);
-      r = this.loop ? w.mod(r, this.frames) : Math.max(0, Math.min(r, this.frames - 1)), r !== this.position.x && (this.position.x = r, this.onMotion());
-      const a = Math.min(...this.lastPoints.map((o) => o.x));
-      Math.max(...this.lastPoints.map((o) => o.x)) - a > i && (this.startPoint.y = t.y, this.startPosition.y = this.position.y);
-    } else {
-      const s = w.accelerate(t.y - this.startPoint.y, 1.7) / this.startSize.height * (this.rows / 4);
-      let r = this.startPosition.y + Math.round(s);
-      r = Math.max(0, Math.min(r, this.rows - 1)), r !== this.position.y && (this.position.y = r, this.onMotion());
-      const a = Math.min(...this.lastPoints.map((o) => o.y));
-      Math.max(...this.lastPoints.map((o) => o.y)) - a > i && (this.startPoint.x = t.x, this.startPosition.x = this.position.x);
-    }
-  }
   end(t, e) {
     this.isStarted = !1, e && (this.inertia.track(t), this.inertia.start());
   }
 }
 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 et({ x: 0, y: 0 }, 1, 1, !1, () => {
+  constructor(t, e, i, r) {
+    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.canvas.draw(this.image, !0, 0.5), this.onInteraction({
         position: this.interaction.positionIndex
       });
-    }), this.onInteraction = s;
+    }), this.onInteraction = r;
   }
   destroy() {
     this.animationFrameId && (cancelAnimationFrame(this.animationFrameId), this.animationFrameId = void 0);
@@ -1387,15 +1380,15 @@ class k {
   async goto(t) {
     return new Promise((e) => {
       let i = this.interaction.positionIndex;
-      const s = () => {
+      const r = () => {
         if (this.interaction.positionIndex === t)
           e();
         else {
-          let r = i > t ? -1 : 1;
-          this.interaction.loop && this.interaction.frames - i + t < Math.abs(t - i) && (r *= -1), i += 0.5 * r, this.position = Math.floor(i), this.animationFrameId = requestAnimationFrame(s);
+          let s = i > t ? -1 : 1;
+          this.interaction.loop && this.interaction.frames - i + t < Math.abs(t - i) && (s *= -1), i += 0.5 * s, this.position = Math.floor(i), this.animationFrameId = requestAnimationFrame(r);
         }
       };
-      this.animationFrameId = requestAnimationFrame(s);
+      this.animationFrameId = requestAnimationFrame(r);
     });
   }
   get position() {
@@ -1407,69 +1400,57 @@ class k {
   get image() {
     return this.images[this.interaction.positionIndex];
   }
-  async load(t, e, i, s) {
-    let r = Promise.resolve();
+  async load(t, e, i, r) {
+    let s = Promise.resolve();
     i && this.interaction.reset();
     const a = JSON.stringify(t);
-    a === this.snapshotHash && this.image ? r = r.then(() => this.canvas.draw(this.image, s, 0.05)) : (this.images = [], r = r.then(
+    a === this.snapshotHash && this.image ? s = s.then(() => this.canvas.draw(this.image, r, 0.05)) : (this.images = [], s = s.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((l, p) => {
-          l.then((d) => {
-            this.images[p] = d, d === this.image && this.canvas.draw(this.image, s, 0.05);
+        const m = o.length;
+        return this.images = new Array(m), this.interaction.frames = t.view.frames ?? t.view.panFrames ?? this.frames, this.interaction.rows = m / this.interaction.frames, this.interaction.loop = !!t.view.loop, i && this.interaction.reset(), o.forEach((l, v) => {
+          l.then((c) => {
+            this.images[v] = c, c === this.image && this.canvas.draw(this.image, r, 0.05);
           }).catch(() => {
           });
         }), o[this.interaction.positionIndex].then(() => Promise.resolve());
       })
     ));
     const n = JSON.stringify(e);
-    return (a !== this.snapshotHash || n !== this.hotspotsHash) && (e.length ? r = r.then(
+    return (a !== this.snapshotHash || n !== this.hotspotsHash) && (e.length ? s = s.then(
       () => this.loader.loadVRObjectHotspots(t, e).then((o) => {
         this.hotspotsList = o;
       })
-    ) : this.hotspotsList = [[]]), this.hotspotsHash = n, this.snapshotHash = a, r;
+    ) : this.hotspotsList = [[]]), this.hotspotsHash = n, this.snapshotHash = a, s;
   }
   async pick(t, 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);
+    const i = new b(t.parameters.width, t.parameters.height), r = P.unproject(i, this.canvas.resolution, this.canvas.fit, e);
+    return this.loader.loadVRObjectPick(t, r, this.position, this.frames);
   }
   hotspots(t) {
-    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" }));
+    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" }));
   }
   snapshot(t, e) {
     return this.canvas.element.toDataURL(t, e);
   }
-  onMouseDown(t) {
-    this.container.classList.add("ls-viewer-container-vrobject-grabbing"), this.interaction.start(y.pointFromMouseEvent(t), {
+  onPointerDown(t) {
+    this.container.setPointerCapture(t.pointerId), this.container.classList.add("ls-viewer-container-vrobject-grabbing"), this.interaction.start(new y(t.screenX, t.screenY), {
       width: this.canvas.element.width,
       height: this.canvas.element.height
     });
   }
-  onMouseMove(t) {
-    this.interaction.isStarted && (this.interaction.motion(y.pointFromMouseEvent(t)), t.preventDefault());
-  }
-  onMouseUp(t) {
-    this.interaction.isStarted && (this.container.classList.remove("ls-viewer-container-vrobject-grabbing"), this.interaction.end(y.pointFromMouseEvent(t), !0));
-  }
-  onMouseEnter(t) {
-    this.interaction.isStarted && t.buttons === 0 && (this.container.classList.remove("ls-viewer-container-vrobject-grabbing"), this.interaction.end(y.pointFromMouseEvent(t), !1));
-  }
-  onTouchStart(t) {
-    this.container.classList.add("ls-viewer-container-vrobject-grabbing"), this.interaction.start(y.pointFromTouchEvent(t), {
-      width: this.canvas.element.width,
-      height: this.canvas.element.height
-    });
+  onPointerMove(t) {
+    this.interaction.isStarted && (this.interaction.motion(new y(t.screenX, t.screenY)), t.preventDefault());
   }
-  onTouchMove(t) {
-    this.interaction.isStarted && (this.interaction.motion(y.pointFromTouchEvent(t)), t.preventDefault());
+  onPointerUp(t) {
+    this.interaction.isStarted && (this.container.classList.remove("ls-viewer-container-vrobject-grabbing"), this.interaction.end(new y(t.screenX, t.screenY), !0));
   }
-  onTouchEnd(t) {
-    this.interaction.isStarted && (this.container.classList.remove("ls-viewer-container-vrobject-grabbing"), this.interaction.end(y.pointFromTouchEvent(t), !0));
+  onPointerCancel(t) {
+    this.interaction.isStarted && (this.container.classList.remove("ls-viewer-container-vrobject-grabbing"), this.interaction.end(new y(t.screenX, t.screenY), !1));
   }
   onDeviceOrientation(t) {
   }
 }
-class it {
+class et {
   constructor(t, e, i) {
     this.container = t, this.loader = i, this.video = e;
   }
@@ -1505,55 +1486,59 @@ class it {
       ), this.video.element.play().catch(e), this.show();
     });
   }
-  onMouseDown(t) {
-  }
-  onMouseMove(t) {
-  }
-  onMouseUp(t) {
-  }
-  onMouseEnter(t) {
+  onPointerDown(t) {
   }
-  onTouchStart(t) {
+  onPointerMove(t) {
   }
-  onTouchMove(t) {
+  onPointerUp(t) {
   }
-  onTouchEnd(t) {
+  onPointerCancel(t) {
   }
   onDeviceOrientation(t) {
   }
 }
-class nt {
+class at {
   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 = {
+    this.onPointerDown = (i) => {
+      this.container.addEventListener("pointermove", this.onPointerMove, { passive: !1 }), this.widget.onPointerDown(i);
+    }, this.onPointerMove = (i) => {
+      this.widget.onPointerMove(i);
+    }, this.onPointerUp = (i) => {
+      this.container.removeEventListener("pointermove", this.onPointerMove), this.widget.onPointerUp(i);
+    }, this.onPointerCancel = (i) => {
+      this.container.removeEventListener("pointermove", this.onPointerMove), this.widget.onPointerCancel(i);
+    }, this.onDeviceOrientation = (i) => {
+      this.widget.onDeviceOrientation(i);
+    }, this.onResize = () => {
+      const i = this.container.clientWidth, r = this.container.clientHeight;
+      this.options.autores && (this.resolution = P.getStandardResolution(i * window.devicePixelRatio, r * window.devicePixelRatio, this.aspectRatioOverride), this.parameters.width = this.resolution.width, this.parameters.height = this.resolution.height), this.canvas2D.resize(i, r, this.getCanvas2DPixelRatio(i, r)), this.canvas3D.resize(i, r, window.devicePixelRatio), this.video.resize(i, r, this.resolution, this.options.fit), this.loadWidget(!1, !1).then(() => {
+        this.onHotspotsChange();
+      }).catch((s) => {
+        this.onLoadError(s);
+      });
+    }, this.onVrcubeInteraction = (i) => {
+      this.onHotspotsChange(), this.options.events.onInteraction?.(i), this.options.events.onVrcubeInteraction?.(i);
+    }, this.onVrobjectInteraction = (i) => {
+      this.onHotspotsChange(), this.options.events.onInteraction?.(i.position), this.options.events.onVrobjectInteraction?.(i.position);
+    }, this.onHotspotsChange = () => {
+      const i = this.widget.hotspots(this.resolution);
+      i.length && this.options.events.onHotspotsChange?.(i);
+    }, this.onLoadStart = (i) => {
+      this.container.classList.add("ls-viewer-container-loading"), this.options.events.onLoadStart?.(i);
+    }, this.onLoadProgress = (i) => {
+      this.options.events.onLoadProgress?.(i);
+    }, this.onLoadEnd = (i) => {
+      this.container.classList.remove("ls-viewer-container-loading"), this.options.events.onLoadEnd?.(i);
+    }, this.onLoadError = (i) => {
+      i instanceof DOMException && i.name === "AbortError" || (this.container.classList.remove("ls-viewer-container-loading"), this.options.events.onLoadError?.(i));
+    }, this.options = {
       server: "localhost",
       api: "v1",
       autores: !0,
       fit: "cover",
-      image: {},
-      video: {},
-      vrcube: {},
-      vrobject: {},
-      events: {},
-      ...e
-    }, this.options.events = {
-      onLoadStart: () => {
-      },
-      onLoadProgress: () => {
-      },
-      onLoadEnd: () => {
-      },
-      onLoadError: () => {
-      },
-      onInteraction: () => {
-      },
-      onVrcubeInteraction: () => {
-      },
-      onVrobjectInteraction: () => {
-      },
-      onHotspotsChange: () => {
-      },
-      ...e.events
-    }, 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 = {
+      ...e,
+      events: { ...e.events }
+    }, this.options.events.onLoadError && (this.options.events.onLoadError = T(this.options.events.onLoadError, 10)), this.container = t, this.container.classList.add("ls-viewer-container"), 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 = {
       width: 0,
       height: 0,
       antialiasing: !1,
@@ -1561,15 +1546,15 @@ class nt {
     }, this.encoder = {
       format: "jpeg",
       quality: 80
-    }, 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);
+    }, this.hotspots = [], this.widgetImage = new Q(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.aspectRatioOverride)), this.widget = this.widgetImage, this.container.addEventListener("pointerdown", this.onPointerDown), this.container.addEventListener("pointerup", this.onPointerUp), this.container.addEventListener("pointercancel", this.onPointerCancel), this.loadWidget = T(this.loadWidget, 10), this.resizeObserver = new ResizeObserver(this.onResize), this.resizeObserver.observe(this.container);
   }
   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;
+    this.resizeObserver.disconnect(), this.canvas2D.destroy(), this.container.removeEventListener("pointerdown", this.onPointerDown), this.container.removeEventListener("pointerup", this.onPointerUp), this.container.removeEventListener("pointercancel", this.onPointerCancel), this.container.removeEventListener("pointermove", this.onPointerMove);
   }
   async load(t, e) {
     let i = Promise.resolve();
-    return e?.animation && (i = i.then(() => this.loadAnimation(e.animation))), this.view && e?.fromPosition !== void 0 && this.viewWidget instanceof k && (this.view.mode, i = i.then(() => this.viewWidget.goto(e.fromPosition))), e?.animation && (i = i.then(() => this.widgetVideo.play())), i = i.then(() => (this.scene = Array.isArray(t) ? [...t] : [t], this.loadWidget(!1, !(e && e.animation)))), i.catch((s) => {
-      this.onLoadError(s);
+    return e?.animation && (i = i.then(() => this.loadAnimation(e.animation))), this.view && e?.fromPosition !== void 0 && this.viewWidget instanceof k && (this.view.mode, i = i.then(() => this.viewWidget.goto(e.fromPosition))), e?.animation && (i = i.then(() => this.widgetVideo.play())), i = i.then(() => (this.scene = Array.isArray(t) ? [...t] : [t], this.loadWidget(!1, !(e && e.animation)))), i.catch((r) => {
+      this.onLoadError(r);
     }), i;
   }
   async setEncoder(t) {
@@ -1580,7 +1565,12 @@ class nt {
     }), e;
   }
   setParameters(t) {
-    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;
+    if (t.width && t.height) {
+      this.resolution = new b(t.width, t.height);
+      const i = this.container.clientWidth, r = this.container.clientHeight;
+      this.canvas2D.resize(i, r, this.getCanvas2DPixelRatio(i, r));
+    }
+    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);
@@ -1592,10 +1582,10 @@ class nt {
   async setView(t, e) {
     let i = Promise.resolve();
     return e?.animation && (i = i.then(() => this.loadAnimation(e.animation))), this.view && e?.fromPosition !== void 0 && this.viewWidget instanceof k && (i = i.then(() => this.viewWidget.goto(e.fromPosition))), e?.animation && (i = i.then(() => this.widgetVideo.play())), i = i.then(() => {
-      let s = !0;
-      return this.view = { ...t }, this.view && this.viewWidget instanceof k && e?.toPosition !== void 0 && (s = !1, this.viewWidget.position = e.toPosition), this.loadWidget(s, !(e && e.animation));
-    }), i.catch((s) => {
-      this.onLoadError(s);
+      let r = !0;
+      return this.view = { ...t }, this.view && this.viewWidget instanceof k && e?.toPosition !== void 0 && (r = !1, this.viewWidget.position = e.toPosition), this.loadWidget(r, !(e && e.animation));
+    }), i.catch((r) => {
+      this.onLoadError(r);
     }), i;
   }
   setVrcube(t) {
@@ -1645,8 +1635,8 @@ class nt {
     return await this.viewWidget.pick(e, t);
   }
   async pickHotspot(t) {
-    const e = await this.pick(t), i = Object.values(e.point), s = h.normalize(Object.values(e.normal)), r = h.add(i, h.mulScalar(s, 0.01));
-    return e.point = { x: r[0], y: r[1], z: r[2] }, e;
+    const e = await this.pick(t), i = Object.values(e.point), r = h.normalize(Object.values(e.normal)), s = h.add(i, h.mulScalar(r, 0.01));
+    return e.point = { x: s[0], y: s[1], z: s[2] }, e;
   }
   snapshot(t, e) {
     return this.viewWidget.snapshot(t, e);
@@ -1657,13 +1647,13 @@ class nt {
     const i = this.viewWidget;
     if (!i)
       return Promise.reject(new Error("Unknown view mode"));
-    const s = {
+    const r = {
       scene: this.scene,
       view: this.view,
       parameters: this.parameters,
       encoder: this.encoder
     };
-    return s.view.background || (s.view.background = "product"), i.load(s, this.hotspots, t, e).then(() => {
+    return r.view.background || (r.view.background = "product"), i.load(r, this.hotspots, t, e).then(() => {
       this.widget.hide(), this.widget = i, this.widget.show(), this.widgetVideo.hide(), this.onHotspotsChange();
     });
   }
@@ -1691,86 +1681,31 @@ class nt {
         return this.widgetImage;
     }
   }
-  checkResize() {
-    if (this.isDestroyed)
-      return;
-    const t = this.container.clientWidth, e = this.container.clientHeight;
-    (t !== this.containerWidth || e !== this.containerHeight) && (this.containerWidth = t, this.containerHeight = e, this.onResize()), this.isDestroyed || requestAnimationFrame(this.checkResize);
-  }
-  onMouseDown(t) {
-    this.widget.onMouseDown(t);
-  }
-  onMouseEnter(t) {
-    this.widget.onMouseEnter(t);
-  }
-  onMouseMove(t) {
-    this.widget.onMouseMove(t);
-  }
-  onMouseUp(t) {
-    this.widget.onMouseUp(t);
-  }
-  onTouchStart(t) {
-    this.widget.onTouchStart(t);
-  }
-  onTouchMove(t) {
-    this.widget.onTouchMove(t);
-  }
-  onTouchEnd(t) {
-    this.widget.onTouchEnd(t);
-  }
-  onDeviceOrientation(t) {
-    this.widget.onDeviceOrientation(t);
-  }
-  onResize() {
-    const t = this.container.clientWidth, e = this.container.clientHeight;
-    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);
-    });
-  }
-  onVrcubeInteraction(...t) {
-    this.onHotspotsChange(), this.options.events.onInteraction(...t), this.options.events.onVrcubeInteraction(...t);
-  }
-  onVrobjectInteraction(t) {
-    this.onHotspotsChange(), this.options.events.onInteraction(t.position), this.options.events.onVrobjectInteraction(t.position);
-  }
-  onHotspotsChange() {
-    const t = this.widget.hotspots(this.resolution);
-    t.length && this.options.events.onHotspotsChange(t);
-  }
-  onLoadStart(...t) {
-    this.container.classList.add("ls-viewer-container-loading"), this.options.events.onLoadStart(...t);
-  }
-  onLoadProgress(...t) {
-    this.options.events.onLoadProgress(...t);
-  }
-  onLoadEnd(...t) {
-    this.container.classList.remove("ls-viewer-container-loading"), this.options.events.onLoadEnd(...t);
-  }
-  onLoadError(...t) {
-    this.container.classList.remove("ls-viewer-container-loading"), this.options.events.onLoadError(...t);
+  // Cap per-axis so the canvas backing never exceeds the source resolution; otherwise
+  // drawImage upscales the JPEG and looks blurry on iOS / MacOS.
+  getCanvas2DPixelRatio(t, e) {
+    return t <= 0 || e <= 0 || this.resolution.width <= 0 || this.resolution.height <= 0 ? window.devicePixelRatio : Math.min(window.devicePixelRatio, this.resolution.width / t, this.resolution.height / e);
   }
 }
-var q;
-((v) => {
+var j;
+((g) => {
   ((t) => {
     t.Visible = "Visible", t.Occluded = "Occluded", t.Clipped = "Clipped", t.OutOfFrustum = "OutOfFrustum";
-  })(v.HotspotVisibility || (v.HotspotVisibility = {})), ((t) => {
+  })(g.HotspotVisibility || (g.HotspotVisibility = {})), ((t) => {
     t.VeryLow = "veryLow", t.Low = "low", t.Medium = "medium", t.Fine = "fine", t.Ultra = "ultra";
-  })(v.SunShadowQualityMode || (v.SunShadowQualityMode = {})), ((t) => {
+  })(g.SunShadowQualityMode || (g.SunShadowQualityMode = {})), ((t) => {
     t.None = "none", t.Weak = "weak", t.Normal = "normal", t.Fine = "fine", t.UltraFine = "ultraFine", t.Max = "max";
-  })(v.SunShadowSmoothnessMode || (v.SunShadowSmoothnessMode = {})), ((t) => {
+  })(g.SunShadowSmoothnessMode || (g.SunShadowSmoothnessMode = {})), ((t) => {
     t.Manual = "manual", t.TimeAndLoc = "timeAndLoc", t.ExtractedFromEnv = "extractedFromEnv";
-  })(v.SunUseCaseMode || (v.SunUseCaseMode = {})), ((t) => {
+  })(g.SunUseCaseMode || (g.SunUseCaseMode = {})), ((t) => {
     t.ShowOnly = "showOnly", t.HideOnly = "hideOnly";
-  })(v.SurfacesFilterMode || (v.SurfacesFilterMode = {}));
-})(q || (q = {}));
+  })(g.SurfacesFilterMode || (g.SurfacesFilterMode = {}));
+})(j || (j = {}));
 export {
-  nt as Viewer,
-  q as WRAPIv2,
+  at as Viewer,
+  j as WRAPIv2,
   Q as WidgetImage,
-  tt as WidgetVRCube,
+  K as WidgetVRCube,
   k as WidgetVRObject,
-  it as WidgetVideo
+  et as WidgetVideo
 };