locar 0.0.12 → 0.1.0

package/README.md

@@ -22,7 +22,9 @@ Some of these issues, such as incorrect North on some devices, may well be to do
 
 ## Cross-platform Compatibility
 
-Chrome on Android is recommended. It may also work on Chrome in iOS; please file an issue if not. It will not work on Safari on iOS, due to permissions issues - **though pull requests are welcome to fix this**. Firefox unfortunately does not appear to fully implement the Device Orientation API so is unlikely to work
+It should now work on Chrome (and possibly Safari) on iOS as well as Android, due to a number of recent iOS fixes by project contributors.
+
+Firefox unfortunately does not appear to fully implement the Device Orientation API so is unlikely to work.
 
 ## Using the library
 
@@ -40,7 +42,7 @@ import * as LocAR from 'locar';
 as long as you include `locar` as a dependency, e.g. in your `package.json`:
 ```
 "dependencies": {
-   "locar" : "^0.0.11",
+   "locar" : "^0.1.0",
    "three" : "^0.175.0"
 }
 ```
@@ -55,6 +57,10 @@ Please see [here](https://ar-js-org.github.io/locar.js/api) for full API documen
 
 Please see [here](https://github.com/AR-js-org/locar.js/blob/master/docs/tutorial/index.md) for a tutorial introducing LocAR.js.
 
+## Contributors
+
+Many thanks to all contributors to the project, in particular [Darian Elias Weiß](https://github.com/darianwwu) and [Kazuhiro Matsuyama](https://github.com/ma2yama) for providing extremely valuable iOS fixes and enhancements.
+
 ## Disclaimer
 
 This is an open-source project licensed under the [MIT License](LICENSE) and thus comes with no warranty. Also it is a volunteer-led project; work on the project by AR.js maintainers or any other contributor will be undertaken *time-permitting* only. For this reason we welcome contributors! The more people working on the project, the more likely it is that it will become full-featured and issues will be resolved.

package/dist/locar.es.js

@@ -1,25 +1,10 @@
-var q = (r) => {
-  throw TypeError(r);
-};
-var S = (r, t, i) => t.has(r) || q("Cannot " + i);
-var n = (r, t, i) => (S(r, t, "read from private field"), i ? i.call(r) : t.get(r)), m = (r, t, i) => t.has(r) ? q("Cannot add the same private member more than once") : t instanceof WeakSet ? t.add(r) : t.set(r, i), l = (r, t, i, e) => (S(r, t, "write to private field"), e ? e.call(r, i) : t.set(r, i), i), p = (r, t, i) => (S(r, t, "access private method"), i);
-var k = (r, t, i, e) => ({
-  set _(c) {
-    l(r, t, c, i);
-  },
-  get _() {
-    return n(r, t, e);
-  }
-});
-import * as b from "three";
-import { Vector3 as B, Euler as U, Quaternion as F, EventDispatcher as K, MathUtils as C } from "three";
-var E, G, X, Q, V;
-class $ {
+import * as f from "three";
+import { Vector3 as I, Euler as A, Quaternion as w, EventDispatcher as C, MathUtils as m } from "three";
+class T {
   /**
    * Create a SphMercProjection.
    */
   constructor() {
-    m(this, E);
     this.EARTH = 4007501668e-2, this.HALF_EARTH = 2003750834e-2;
   }
   /**
@@ -28,16 +13,30 @@ class $ {
    * @param {number} lat - the latitude.
    * @return {Array} Two-member array containing easting and northing.
    */
-  project(t, i) {
-    return [p(this, E, G).call(this, t), p(this, E, X).call(this, i)];
+  project(e, i) {
+    return [this.#t(e), this.#h(i)];
   }
   /**
    * Unproject a Spherical Mercator easting and northing.
    * @param {Array} projected - Two-member array containing easting and northing
    * @return {Array} Two-member array containing longitude and latitude 
    */
-  unproject(t) {
-    return [p(this, E, Q).call(this, t[0]), p(this, E, V).call(this, t[1])];
+  unproject(e) {
+    return [this.#e(e[0]), this.#s(e[1])];
+  }
+  #t(e) {
+    return e / 180 * this.HALF_EARTH;
+  }
+  #h(e) {
+    var i = Math.log(Math.tan((90 + e) * Math.PI / 360)) / (Math.PI / 180);
+    return i * this.HALF_EARTH / 180;
+  }
+  #e(e) {
+    return e / this.HALF_EARTH * 180;
+  }
+  #s(e) {
+    var i = e / this.HALF_EARTH * 180;
+    return i = 180 / Math.PI * (2 * Math.atan(Math.exp(i * Math.PI / 180)) - Math.PI / 2), i;
   }
   /**
    * Return the projection's ID.
@@ -47,19 +46,38 @@ class $ {
     return "epsg:3857";
   }
 }
-E = new WeakSet(), G = function(t) {
-  return t / 180 * this.HALF_EARTH;
-}, X = function(t) {
-  var i = Math.log(Math.tan((90 + t) * Math.PI / 360)) / (Math.PI / 180);
-  return i * this.HALF_EARTH / 180;
-}, Q = function(t) {
-  return t / this.HALF_EARTH * 180;
-}, V = function(t) {
-  var i = t / this.HALF_EARTH * 180;
-  return i = 180 / Math.PI * (2 * Math.atan(Math.exp(i * Math.PI / 180)) - Math.PI / 2), i;
-};
-var x, O, P, H, L, A, y, D, T, M, f, j, Y, W, Z;
-class ot {
+class P {
+  constructor() {
+    this.eventHandlers = {};
+  }
+  /**
+   * Add an event handler.
+   * @param {string} eventName - the event to handle.
+   * @param {Function} eventHandler - the event handler function.
+   */
+  on(e, i) {
+    this.eventHandlers[e] = i;
+  }
+  /**
+   * Emit an event. 
+   * @param {string} eventName - the event to emit.
+   * @param ...params - parameters to pass to the event handler. 
+   */
+  emit(e, ...i) {
+    this.eventHandlers[e]?.call(this, ...i);
+  }
+}
+class L extends P {
+  #t;
+  #h;
+  #e;
+  #s;
+  #c;
+  #o;
+  #i;
+  #r;
+  #a;
+  #n;
   /**
    * @param {THREE.Scene} scene - The Three.js scene to use.
    * @param {THREE.Camera} camera - The Three.js camera to use. Should usually 
@@ -68,19 +86,8 @@ class ot {
    * setGpsOptions() below.
    * @param {Object} serverLogger - an object which can optionally log GPS position to a server for debugging. null by default, so no logging will be done. This object should implement a sendData() method to send data (2nd arg) to a given endpoint (1st arg). Please see source code for details. Ensure you comply with privacy laws (GDPR or equivalent) if implementing this.
    */
-  constructor(t, i, e = {}, c = null) {
-    m(this, f);
-    m(this, x);
-    m(this, O);
-    m(this, P);
-    m(this, H);
-    m(this, L);
-    m(this, A);
-    m(this, y);
-    m(this, D);
-    m(this, T);
-    m(this, M);
-    this.scene = t, this.camera = i, l(this, x, new $()), l(this, O, {}), l(this, P, null), l(this, H, 0), l(this, L, 100), l(this, A, null), this.setGpsOptions(e), l(this, y, null), l(this, D, 0), l(this, T, 0), l(this, M, c);
+  constructor(e, i, t = {}, c = null) {
+    super(), this.scene = e, this.camera = i, this.#t = new T(), this.#e = null, this.#s = 0, this.#c = 100, this.#o = null, this.setGpsOptions(t), this.#i = null, this.#r = 0, this.#a = 0, this.#n = c;
   }
   /**
    * Set the projection to use.
@@ -88,8 +95,8 @@ class ot {
    * taking longitude and latitude as arguments and returning an array 
    * containing easting and northing.
    */
-  setProjection(t) {
-    l(this, x, t);
+  setProjection(e) {
+    this.#t = e;
   }
   /**
    * Set the GPS options.
@@ -98,8 +105,8 @@ class ot {
    * must move to process a new GPS reading, and the latter specifies the 
    * minimum accuracy, in metres, for a GPS reading to be counted.
    */
-  setGpsOptions(t = {}) {
-    t.gpsMinDistance !== void 0 && l(this, H, t.gpsMinDistance), t.gpsMinAccuracy !== void 0 && l(this, L, t.gpsMinAccuracy);
+  setGpsOptions(e = {}) {
+    e.gpsMinDistance !== void 0 && (this.#s = e.gpsMinDistance), e.gpsMinAccuracy !== void 0 && (this.#c = e.gpsMinAccuracy);
   }
   /**
    * Start the GPS on a real device
@@ -107,24 +114,24 @@ class ot {
    * GPS errors can be handled by handling the gpserror event.
    */
   async startGps() {
-    if (n(this, M)) {
-      const i = await (await n(this, M).sendData("/gps/start", {
-        gpsMinDistance: n(this, H),
-        gpsMinAccuracy: n(this, L)
+    if (this.#n) {
+      const i = await (await this.#n.sendData("/gps/start", {
+        gpsMinDistance: this.#s,
+        gpsMinAccuracy: this.#c
       })).json();
-      l(this, T, i.session);
+      this.#a = i.session;
     }
-    return n(this, A) === null ? (l(this, A, navigator.geolocation.watchPosition(
-      (t) => {
-        p(this, f, W).call(this, t);
+    return this.#o === null ? (this.#o = navigator.geolocation.watchPosition(
+      (e) => {
+        this.#l(e);
       },
-      (t) => {
-        n(this, O).gpserror ? n(this, O).gpserror(t.code) : alert(`GPS error: code ${t.code}`);
+      (e) => {
+        this.emit("gpserror", e);
       },
       {
         enableHighAccuracy: !0
       }
-    )), !0) : !1;
+    ), !0) : !1;
   }
   /**
    * Stop the GPS on a real device
@@ -132,7 +139,7 @@ class ot {
    * stopped (i.e. it was never started).
    */
   stopGps() {
-    return n(this, A) !== null ? (navigator.geolocation.clearWatch(n(this, A)), l(this, A, null), !0) : !1;
+    return this.#o !== null ? (navigator.geolocation.clearWatch(this.#o), this.#o = null, !0) : !1;
   }
   /**
    * Send a fake GPS signal. Useful for testing on a desktop or laptop.
@@ -143,10 +150,10 @@ class ot {
    * @param {number} acc - The accuracy of the GPS reading in metres. May be
    * ignored if lower than the specified minimum accuracy.
    */
-  fakeGps(t, i, e = null, c = 0) {
-    e !== null && this.setElevation(e), p(this, f, W).call(this, {
+  fakeGps(e, i, t = null, c = 0) {
+    t !== null && this.setElevation(t), this.#l({
       coords: {
-        longitude: t,
+        longitude: e,
         latitude: i,
         accuracy: c
       }
@@ -158,17 +165,18 @@ class ot {
    * projections, northings increase northwards, but in the WebGL coordinate
    * system, we face negative z if the camera is at the origin with default
    * rotation).
+   * Must not be called until an initial position is determined.
    * @param {number} lon - The longitude.
    * @param {number} lat - The latitude.
    * @return {Array} a two member array containing the WebGL x and z coordinates
    */
-  lonLatToWorldCoords(t, i) {
-    const e = n(this, x).project(t, i);
-    if (n(this, y))
-      e[0] -= n(this, y)[0], e[1] -= n(this, y)[1];
+  lonLatToWorldCoords(e, i) {
+    const t = this.#t.project(e, i);
+    if (this.#i)
+      t[0] -= this.#i[0], t[1] -= this.#i[1];
     else
       throw "No initial position determined";
-    return [e[0], -e[1]];
+    return [t[0], -t[1]];
   }
   /**
    * Add a new AR object at a given latitude, longitude and elevation.
@@ -180,121 +188,95 @@ class ot {
    * @param {Object} properties - properties describing the object (for example,
    * the contents of the GeoJSON properties field).
    */
-  add(t, i, e, c, d = {}) {
-    var g;
-    t.properties = d, p(this, f, j).call(this, t, i, e, c), this.scene.add(t), (g = n(this, M)) == null || g.sendData("/object/new", {
-      position: t.position,
-      x: t.position.x,
-      z: t.position.z,
-      session: n(this, T),
+  add(e, i, t, c, d = {}) {
+    e.properties = d, this.#d(e, i, t, c), this.scene.add(e), this.#n?.sendData("/object/new", {
+      position: e.position,
+      x: e.position.x,
+      z: e.position.z,
+      session: this.#a,
       properties: d
     });
   }
+  #d(e, i, t, c) {
+    const d = this.lonLatToWorldCoords(i, t);
+    c !== void 0 && (e.position.y = c), [e.position.x, e.position.z] = d;
+  }
   /**
    * Set the elevation (y coordinate) of the camera.
    * @param {number} elev - the elevation in metres.
    */
-  setElevation(t) {
-    this.camera.position.y = t;
+  setElevation(e) {
+    this.camera.position.y = e;
+  }
+  #u(e, i) {
+    this.#i = this.#t.project(e, i);
+  }
+  #l(e) {
+    let i = Number.MAX_VALUE;
+    this.#r++, this.#n?.sendData("/gps/new", {
+      gpsCount: this.#r,
+      lat: e.coords.latitude,
+      lon: e.coords.longitude,
+      acc: e.coords.accuracy,
+      session: this.#a
+    }), e.coords.accuracy <= this.#c && (this.#e === null ? this.#e = {
+      latitude: e.coords.latitude,
+      longitude: e.coords.longitude
+    } : i = this.#m(this.#e, e.coords), i >= this.#s && (this.#e.longitude = e.coords.longitude, this.#e.latitude = e.coords.latitude, this.#i || (this.#u(
+      e.coords.longitude,
+      e.coords.latitude
+    ), this.#n?.sendData("/worldorigin/new", {
+      gpsCount: this.#r,
+      lat: e.coords.latitude,
+      lon: e.coords.longitude,
+      session: this.#a,
+      initialPosition: this.#i
+    })), this.#d(
+      this.camera,
+      e.coords.longitude,
+      e.coords.latitude
+    ), this.#n?.sendData("/gps/accepted", {
+      gpsCount: this.#r,
+      cameraX: this.camera.position.x,
+      cameraZ: this.camera.position.z,
+      session: this.#a,
+      distMoved: i
+    }), this.emit("gpsupdate", { position: e, distMoved: i })));
   }
   /**
-   * Add an event handler.
-   * Currently-understood events: "gpsupdate" and "gpserror".
-   * The former fires when a GPS update is received, and is passed the
-   * standard Geolocation API position object, along with the distance moved
-   * since the last GPS update in metres.
-   * The latter fires when a GPS error is generated, and is passed the
-   * standard Geolocation API numerical error code.
-   * @param {string} eventName - the event to handle.
-   * @param {Function} eventHandler - the event handler function.
-   * @listens LocationBased#gpsupdate
-   * @listens LocationBased#gpserror
+   * Calculate haversine distance between two lat/lon pairs.
+   *
+   * Taken from original A-Frame AR.js location-based components
    */
-  on(t, i) {
-    n(this, O)[t] = i;
+  #m(e, i) {
+    const t = f.MathUtils.degToRad(i.longitude - e.longitude), c = f.MathUtils.degToRad(i.latitude - e.latitude), d = Math.sin(c / 2) * Math.sin(c / 2) + Math.cos(f.MathUtils.degToRad(e.latitude)) * Math.cos(f.MathUtils.degToRad(i.latitude)) * (Math.sin(t / 2) * Math.sin(t / 2));
+    return 2 * Math.atan2(Math.sqrt(d), Math.sqrt(1 - d)) * 6371e3;
   }
 }
-x = new WeakMap(), O = new WeakMap(), P = new WeakMap(), H = new WeakMap(), L = new WeakMap(), A = new WeakMap(), y = new WeakMap(), D = new WeakMap(), T = new WeakMap(), M = new WeakMap(), f = new WeakSet(), j = function(t, i, e, c) {
-  const d = this.lonLatToWorldCoords(i, e);
-  c !== void 0 && (t.position.y = c), [t.position.x, t.position.z] = d;
-}, Y = function(t, i) {
-  l(this, y, n(this, x).project(t, i));
-}, W = function(t) {
-  var e, c, d;
-  let i = Number.MAX_VALUE;
-  k(this, D)._++, (e = n(this, M)) == null || e.sendData("/gps/new", {
-    gpsCount: n(this, D),
-    lat: t.coords.latitude,
-    lon: t.coords.longitude,
-    acc: t.coords.accuracy,
-    session: n(this, T)
-  }), t.coords.accuracy <= n(this, L) && (n(this, P) === null ? l(this, P, {
-    latitude: t.coords.latitude,
-    longitude: t.coords.longitude
-  }) : i = p(this, f, Z).call(this, n(this, P), t.coords), i >= n(this, H) && (n(this, P).longitude = t.coords.longitude, n(this, P).latitude = t.coords.latitude, n(this, y) || (p(this, f, Y).call(this, t.coords.longitude, t.coords.latitude), (c = n(this, M)) == null || c.sendData("/worldorigin/new", {
-    gpsCount: n(this, D),
-    lat: t.coords.latitude,
-    lon: t.coords.longitude,
-    session: n(this, T),
-    initialPosition: n(this, y)
-  })), p(this, f, j).call(this, this.camera, t.coords.longitude, t.coords.latitude), (d = n(this, M)) == null || d.sendData("/gps/accepted", {
-    gpsCount: n(this, D),
-    cameraX: this.camera.position.x,
-    cameraZ: this.camera.position.z,
-    session: n(this, T),
-    distMoved: i
-  }), n(this, O).gpsupdate && n(this, O).gpsupdate(t, i)));
-}, /**
- * Calculate haversine distance between two lat/lon pairs.
- *
- * Taken from original A-Frame AR.js location-based components
- */
-Z = function(t, i) {
-  const e = b.MathUtils.degToRad(i.longitude - t.longitude), c = b.MathUtils.degToRad(i.latitude - t.latitude), d = Math.sin(c / 2) * Math.sin(c / 2) + Math.cos(b.MathUtils.degToRad(t.latitude)) * Math.cos(b.MathUtils.degToRad(i.latitude)) * (Math.sin(e / 2) * Math.sin(e / 2));
-  return 2 * Math.atan2(Math.sqrt(d), Math.sqrt(1 - d)) * 6371e3;
-};
-class at {
+class H extends P {
+  #t;
   /**
    * Create a Webcam.
-   * @param options {Object} - options to use for initialising the camera. 
-   * Currently idealWidth and idealHeight properties are understood as well as 
-   * onVideoStarted(), a *required* callback which runs when the camera has
-   * been initialised. 
-   * This takes a THREE.VideoTexture as an argument which can be used to set 
-   * the background of your three.js scene within a callback.
+   * @param constraints {Object} - options to use for initialising the camera. 
+   * The same constraints object as used by standard MediaDevices API.
    * @param {string} videoElementSelector - selector to obtain the HTML video 
    * element to render the webcam feed. If a falsy value (e.g. null or 
    * undefined), a video element will be created.
    */
-  constructor(t = {}, i) {
-    this.sceneWebcam = new b.Scene();
-    let e;
-    if (i ? e = document.querySelector(i) : (e = document.createElement("video"), e.setAttribute("autoplay", !0), e.setAttribute("playsinline", !0), e.style.display = "none", document.body.appendChild(e)), this.texture = new b.VideoTexture(e), navigator.mediaDevices && navigator.mediaDevices.getUserMedia) {
-      const c = {
-        video: {
-          width: { ideal: t.idealWidth || 1280 },
-          height: { ideal: t.idealHeight || 720 },
-          facingMode: "environment"
-        }
-      };
-      navigator.mediaDevices.getUserMedia(c).then((d) => {
-        e.addEventListener("loadedmetadata", () => {
-          var g;
-          e.setAttribute("width", e.videoWidth), e.setAttribute("height", e.videoHeight), e.play(), (g = t.onVideoStarted) == null || g.call(this, this.texture);
-        }), e.srcObject = d;
-      }).catch((d) => {
-        setTimeout(() => {
-          alert(
-            `Webcam Error
-Name: ` + d.name + `
-Message: ` + d.message
-          );
-        }, 1e3);
+  constructor(e = { video: { facingMode: "environment" } }, i) {
+    super(), this.sceneWebcam = new f.Scene(), i ? this.#t = document.querySelector(i) : (this.#t = document.createElement("video"), this.#t.setAttribute("autoplay", !0), this.#t.setAttribute("playsinline", !0), this.#t.style.display = "none", document.body.appendChild(this.#t)), this.texture = new f.VideoTexture(this.#t), navigator.mediaDevices && navigator.mediaDevices.getUserMedia ? navigator.mediaDevices.getUserMedia(e).then((t) => {
+      this.#t.addEventListener("loadedmetadata", () => {
+        this.#t.setAttribute("width", this.#t.videoWidth), this.#t.setAttribute("height", this.#t.videoHeight), this.#t.play(), this.emit("webcamstarted", { texture: this.texture });
+      }), this.#t.srcObject = t;
+    }).catch((t) => {
+      this.emit("webcamerror", {
+        code: t.name,
+        message: t.message
       });
-    } else
-      setTimeout(() => {
-        alert("sorry - media devices API not supported");
-      }, 1e3);
+    }) : this.emit("webcamerror", {
+      code: "LOCAR_NO_MEDIA_DEVICES_API",
+      message: "Media devices API not supported"
+    });
   }
   /**
    * Free up the memory associated with the webcam.
@@ -304,203 +286,224 @@ Message: ` + d.message
     this.texture.dispose();
   }
 }
-const z = navigator.userAgent.match(/iPhone|iPad|iPod/i) || /Macintosh/i.test(navigator.userAgent) && navigator.maxTouchPoints != null && navigator.maxTouchPoints > 1, J = new B(0, 0, 1), N = new U(), tt = new F(), et = new F(-Math.sqrt(0.5), 0, 0, Math.sqrt(0.5)), it = { type: "change" };
-class rt extends K {
+const E = navigator.userAgent.match(/iPhone|iPad|iPod/i) || /Macintosh/i.test(navigator.userAgent) && navigator.maxTouchPoints != null && navigator.maxTouchPoints > 1, _ = new I(0, 0, 1), y = new A(), R = new w(), D = new w(-Math.sqrt(0.5), 0, 0, Math.sqrt(0.5));
+class x extends C {
   /**
-   * Create an instance of DeviceOrientationControls.
-   * @param {Object} object - the object to attach the controls to
-   * (usually your Three.js camera)
-   * @param {Object} options - options for DeviceOrientationControls: currently accepts smoothingFactor
-   */
-  constructor(t, i = {}) {
-    super(), window.isSecureContext === !1 && console.error(
-      "THREE.DeviceOrientationControls: DeviceOrientationEvent is only available in secure contexts (https)"
-    );
-    const e = this, c = 1e-6, d = new F();
-    this.object = t, this.object.rotation.reorder("YXZ"), this.enabled = !0, this.deviceOrientation = null, this.screenOrientation = 0, this.alphaOffset = 0, this.initialOffset = null, this.TWO_PI = 2 * Math.PI, this.HALF_PI = 0.5 * Math.PI, this.orientationChangeEventName = "ondeviceorientationabsolute" in window ? "deviceorientationabsolute" : "deviceorientation", this.smoothingFactor = i.smoothingFactor || 1;
-    const g = function({
-      alpha: s,
-      beta: o,
+    * Create an instance of DeviceOrientationControls.
+    * @param {Object} object - the object to attach the controls to
+    * (usually your Three.js camera)
+    * @param {Object} options - options for DeviceOrientationControls: currently accepts smoothingFactor, enablePermissionDialog
+    */
+  constructor(e, i = {}) {
+    super(), this.eventEmitter = new P();
+    const t = this;
+    this.object = e, this.object.rotation.reorder("YXZ"), this.enabled = !0, this.deviceOrientation = null, this.screenOrientation = 0, this.alphaOffset = 0, this.orientationOffset = 0, this.initialOffset = null, this.lastCompassY = void 0, this.lastOrientation = null, this.TWO_PI = 2 * Math.PI, this.HALF_PI = 0.5 * Math.PI, this.orientationChangeEventName = "ondeviceorientationabsolute" in window ? "deviceorientationabsolute" : "deviceorientation", console.log("Device Orientation Event Name:", this.orientationChangeEventName), this.smoothingFactor = i.smoothingFactor || 1, this.enablePermissionDialog = i.enablePermissionDialog ?? !0;
+    const c = function({
+      alpha: n,
+      beta: s,
       gamma: a,
-      webkitCompassHeading: u
+      webkitCompassHeading: r
     }) {
-      if (z) {
-        const h = 360 - u;
-        e.alphaOffset = C.degToRad(h - s), e.deviceOrientation = { alpha: s, beta: o, gamma: a, webkitCompassHeading: u };
+      if (E) {
+        const o = 360 - r;
+        t.alphaOffset = m.degToRad(o - n), t.deviceOrientation = { alpha: n, beta: s, gamma: a, webkitCompassHeading: r };
       } else
-        s < 0 && (s += 360), e.deviceOrientation = { alpha: s, beta: o, gamma: a };
+        n < 0 && (n += 360), t.deviceOrientation = { alpha: n, beta: s, gamma: a };
       window.dispatchEvent(
         new CustomEvent("camera-rotation-change", {
-          detail: { cameraRotation: t.rotation }
+          detail: { cameraRotation: e.rotation }
         })
       );
-    }, I = function() {
-      e.screenOrientation = window.orientation || 0;
-    }, R = function(s, o, a, u, h) {
-      N.set(a, o, -u, "YXZ"), s.setFromEuler(N), s.multiply(et), s.multiply(tt.setFromAxisAngle(J, -h));
+    }, d = function() {
+      t.screenOrientation = window.orientation || 0, E && (t.screenOrientation === 90 ? t.orientationOffset = -t.HALF_PI : t.screenOrientation === -90 ? t.orientationOffset = t.HALF_PI : t.orientationOffset = 0);
+    }, M = function(n, s, a, r, o) {
+      y.set(a, s, -r, "YXZ"), n.setFromEuler(y), n.multiply(D), n.multiply(R.setFromAxisAngle(_, -o));
     };
     this.connect = function() {
-      I(), window.DeviceOrientationEvent !== void 0 && typeof window.DeviceOrientationEvent.requestPermission == "function" ? window.DeviceOrientationEvent.requestPermission().then((s) => {
-        s === "granted" && (window.addEventListener(
-          "orientationchange",
-          I
-        ), window.addEventListener(
-          e.orientationChangeEventName,
-          g
-        ));
-      }).catch(function(s) {
-        console.error(
-          "THREE.DeviceOrientationControls: Unable to use DeviceOrientation API:",
-          s
-        );
-      }) : (window.addEventListener(
+      d(), window.addEventListener(
         "orientationchange",
-        I
+        d
       ), window.addEventListener(
-        e.orientationChangeEventName,
-        g
-      )), e.enabled = !0;
+        t.orientationChangeEventName,
+        c
+      ), t.enabled = !0;
     }, this.disconnect = function() {
       window.removeEventListener(
         "orientationchange",
-        I
+        d
       ), window.removeEventListener(
-        e.orientationChangeEventName,
-        g
-      ), e.enabled = !1, e.initialOffset = !1, e.deviceOrientation = null;
-    }, this.update = function({ theta: s = 0 } = { theta: 0 }) {
-      if (e.enabled === !1) return;
-      const o = e.deviceOrientation;
-      if (o) {
-        let a = o.alpha ? C.degToRad(o.alpha) + e.alphaOffset : 0, u = o.beta ? C.degToRad(o.beta) : 0, h = o.gamma ? C.degToRad(o.gamma) : 0;
-        const _ = e.screenOrientation ? C.degToRad(e.screenOrientation) : 0;
-        if (z) {
-          const v = new F();
-          R(v, a, u, h, _);
-          const w = new U().setFromQuaternion(
-            v,
+        t.orientationChangeEventName,
+        c
+      ), t.enabled = !1, t.initialOffset = !1, t.deviceOrientation = null;
+    }, this.requestOrientationPermissions = function() {
+      window.DeviceOrientationEvent !== void 0 && typeof window.DeviceOrientationEvent.requestPermission == "function" ? window.DeviceOrientationEvent.requestPermission().then((n) => {
+        n === "granted" ? this.eventEmitter.emit("deviceorientationgranted", {
+          target: this
+        }) : this.eventEmitter.emit("deviceorientationerror", {
+          code: "LOCAR_DEVICE_ORIENTATION_PERMISSION_DENIED",
+          message: "Permission for device orientation denied - AR will not work correctly"
+        });
+      }).catch(function(n) {
+        this.eventEmitter.emit("deviceorientationerror", {
+          code: "LOCAR_DEVICE_ORIENTATION_PERMISSION_FAILED",
+          message: "Permission request for device orientation failed - AR will not work correctly"
+        });
+      }) : this.eventEmitter.emit("deviceorientationerror", {
+        code: "LOCAR_DEVICE_ORIENTATION_INTERNAL_ERROR",
+        message: "Internal error: no requestPermission() found although requestOrientationPermissions() was called - please raise an issue on GitHub"
+      });
+    }, this.update = function({ theta: n = 0 } = { theta: 0 }) {
+      if (t.enabled === !1) return;
+      const s = t.deviceOrientation;
+      if (s) {
+        let a = s.alpha ? m.degToRad(s.alpha) + t.alphaOffset : 0, r = s.beta ? m.degToRad(s.beta) : 0, o = s.gamma ? m.degToRad(s.gamma) : 0;
+        const g = t.screenOrientation ? m.degToRad(t.screenOrientation) : 0;
+        if (t.smoothingFactor < 1) {
+          if (t.lastOrientation) {
+            const h = t.smoothingFactor;
+            a = t._getSmoothedAngle(
+              a,
+              t.lastOrientation.alpha,
+              h
+            ), r = t._getSmoothedAngle(
+              r + Math.PI,
+              t.lastOrientation.beta,
+              h
+            ), o = t._getSmoothedAngle(
+              o + t.HALF_PI,
+              t.lastOrientation.gamma,
+              h,
+              Math.PI
+            );
+          } else
+            r += Math.PI, o += t.HALF_PI;
+          t.lastOrientation = {
+            alpha: a,
+            beta: r,
+            gamma: o
+          };
+        }
+        if (E) {
+          const h = new w();
+          M(
+            h,
+            a,
+            t.smoothingFactor < 1 ? r - Math.PI : r,
+            t.smoothingFactor < 1 ? o - Math.PI / 2 : o,
+            g
+          );
+          const u = new A().setFromQuaternion(
+            h,
             "YXZ"
           );
-          console.log(w.x, w.y, w.z), w.y = C.degToRad(
-            360 - o.webkitCompassHeading
-          ), v.setFromEuler(w), e.object.quaternion.copy(v);
-        } else {
-          if (this.smoothingFactor < 1) {
-            if (this.lastOrientation) {
-              const v = this.smoothingFactor;
-              a = this._getSmoothedAngle(
-                a,
-                this.lastOrientation.alpha,
-                v
-              ), u = this._getSmoothedAngle(
-                u + Math.PI,
-                this.lastOrientation.beta,
-                v
-              ), h = this._getSmoothedAngle(
-                h + this.HALF_PI,
-                this.lastOrientation.gamma,
-                v,
-                Math.PI
-              );
-            } else
-              u += Math.PI, h += this.HALF_PI;
-            this.lastOrientation = {
-              alpha: a,
-              beta: u,
-              gamma: h
-            };
-          }
-          R(
-            e.object.quaternion,
-            a + s,
-            this.smoothingFactor < 1 ? u - Math.PI : u,
-            this.smoothingFactor < 1 ? h - this.HALF_PI : h,
-            _
+          let v = m.degToRad(360 - s.webkitCompassHeading);
+          t.smoothingFactor < 1 && t.lastCompassY !== void 0 && (v = t._getSmoothedAngle(v, t.lastCompassY, t.smoothingFactor)), t.lastCompassY = v, u.y = v + (t.orientationOffset || 0), h.setFromEuler(u), t.object.quaternion.copy(h);
+        } else
+          M(
+            t.object.quaternion,
+            E ? a + t.alphaOffset : a,
+            t.smoothingFactor < 1 ? r - Math.PI : r,
+            t.smoothingFactor < 1 ? o - Math.PI / 2 : o,
+            g
           );
-        }
-        8 * (1 - d.dot(e.object.quaternion)) > c && (d.copy(e.object.quaternion), e.dispatchEvent(it));
       }
-    }, this._orderAngle = function(s, o, a = this.TWO_PI) {
-      return o > s && Math.abs(o - s) < a / 2 || s > o && Math.abs(o - s) > a / 2 ? { left: s, right: o } : { left: o, right: s };
-    }, this._getSmoothedAngle = function(s, o, a, u = this.TWO_PI) {
-      const h = this._orderAngle(s, o, u), _ = h.left, v = h.right;
-      h.left = 0, h.right -= _, h.right < 0 && (h.right += u);
-      let w = v == o ? (1 - a) * h.right + a * h.left : a * h.right + (1 - a) * h.left;
-      return w += _, w >= u && (w -= u), w;
+    }, this.getCorrectedHeading = function() {
+      const { deviceOrientation: n } = t;
+      if (!n) return 0;
+      let s = 0;
+      return E ? (s = 360 - n.webkitCompassHeading, t.orientationOffset && (s += t.orientationOffset * (180 / Math.PI), s = (s + 360) % 360)) : (n.absolute === !0 || t.orientationChangeEventName, s = n.alpha ? n.alpha : 0, s = (360 - s) % 360, s < 0 && (s += 360)), s;
+    }, this._orderAngle = function(n, s, a = t.TWO_PI) {
+      return s > n && Math.abs(s - n) < a / 2 || n > s && Math.abs(s - n) > a / 2 ? { left: n, right: s } : { left: s, right: n };
+    }, this._getSmoothedAngle = function(n, s, a, r = t.TWO_PI) {
+      const o = t._orderAngle(n, s, r), g = o.left, h = o.right;
+      o.left = 0, o.right -= g, o.right < 0 && (o.right += r);
+      let u = h == s ? (1 - a) * o.right + a * o.left : a * o.right + (1 - a) * o.left;
+      return u += g, u >= r && (u -= r), u;
     }, this.updateAlphaOffset = function() {
-      e.initialOffset = !1;
+      t.initialOffset = !1;
     }, this.dispose = function() {
-      e.disconnect();
+      t.disconnect();
     }, this.getAlpha = function() {
-      const { deviceOrientation: s } = e;
-      return s && s.alpha ? C.degToRad(s.alpha) + e.alphaOffset : 0;
+      const { deviceOrientation: n } = t;
+      return n && n.alpha ? m.degToRad(n.alpha) + t.alphaOffset : 0;
     }, this.getBeta = function() {
-      const { deviceOrientation: s } = e;
-      return s && s.beta ? C.degToRad(s.beta) : 0;
-    }, window.DeviceOrientationEvent !== void 0 && typeof window.DeviceOrientationEvent.requestPermission == "function" ? this.initPermissionDialog() : this.connect();
-  }
-  // Provide gesture before initialising device orientation controls
-  // From PR #659 on the main AR.js repo
-  // Thanks to @ma2yama
-  initPermissionDialog() {
-    const t = document.createElement("div"), i = document.createElement("div"), e = document.createElement("div"), c = document.createElement("div");
-    document.body.appendChild(t);
-    const d = {
-      display: "flex",
-      position: "fixed",
-      top: 0,
-      left: 0,
-      width: "100%",
-      height: "100%",
-      zIndex: 1,
-      backgroundColor: "rgba(0,0,0,0.6)",
-      justifyContent: "center",
-      alignItems: "center"
-    }, g = {
-      backgroundColor: "white",
-      padding: "6px",
-      borderRadius: "3px",
-      width: "36rem",
-      height: "24rem"
-    }, I = {
-      width: "100%",
-      height: "70%",
-      display: "flex",
-      justifyContent: "center",
-      alignItems: "center"
-    }, R = {
-      display: "inline-flex",
-      width: "100%",
-      height: "30%",
-      justifyContent: "center",
-      alignItems: "center"
+      const { deviceOrientation: n } = t;
+      return n && n.beta ? m.degToRad(n.beta) : 0;
+    }, this.getGamma = function() {
+      const { deviceOrientation: n } = t;
+      return n && n.gamma ? m.degToRad(n.gamma) : 0;
+    }, this.obtainPermissionGesture = function() {
+      const n = document.createElement("div"), s = document.createElement("div"), a = document.createElement("div"), r = document.createElement("div");
+      document.body.appendChild(n);
+      const o = {
+        display: "flex",
+        position: "fixed",
+        top: 0,
+        left: 0,
+        width: "100%",
+        height: "100%",
+        zIndex: 1,
+        backgroundColor: "rgba(0,0,0,0.6)",
+        justifyContent: "center",
+        alignItems: "center"
+      }, g = {
+        backgroundColor: "white",
+        padding: "6px",
+        borderRadius: "3px",
+        width: "36rem",
+        height: "24rem"
+      }, h = {
+        width: "100%",
+        height: "70%",
+        display: "flex",
+        justifyContent: "center",
+        alignItems: "center"
+      }, u = {
+        display: "inline-flex",
+        width: "100%",
+        height: "30%",
+        justifyContent: "center",
+        alignItems: "center"
+      };
+      for (let l in o)
+        n.style[l] = o[l];
+      for (let l in g)
+        s.style[l] = g[l];
+      for (let l in h)
+        a.style[l] = h[l];
+      for (let l in u)
+        r.style[l] = u[l];
+      n.appendChild(s), s.appendChild(a), s.appendChild(r), a.innerHTML = '<div style="font-size: 24pt; margin: 1rem;">This immersive website requires access to your device motion sensors.</div>';
+      const v = () => {
+        this.requestOrientationPermissions(), n.style.display = "none";
+      }, p = document.createElement("button");
+      p.addEventListener("click", v), p.style.width = "50%", p.style.height = "80%", p.style.fontSize = "20pt", p.appendChild(document.createTextNode("OK")), r.appendChild(p), document.body.appendChild(n);
     };
-    for (let a in d)
-      t.style[a] = d[a];
-    for (let a in g)
-      i.style[a] = g[a];
-    for (let a in I)
-      e.style[a] = I[a];
-    for (let a in R)
-      c.style[a] = R[a];
-    t.appendChild(i), i.appendChild(e), i.appendChild(c), e.innerHTML = '<div style="font-size: 24pt; margin: 1rem;">This immersive website requires access to your device motion sensors.</div>';
-    const s = () => {
-      this.connect(), t.style.display = "none";
-    }, o = document.createElement("button");
-    o.addEventListener("click", s), o.style.width = "50%", o.style.height = "80%", o.style.fontSize = "20pt", o.appendChild(document.createTextNode("OK")), c.appendChild(o), document.body.appendChild(t);
+  }
+  on(e, i) {
+    this.eventEmitter.on(e, i);
+  }
+  init() {
+    window.DeviceOrientationEvent === void 0 ? this.eventEmitter.emit("deviceorientationerror", {
+      code: "LOCAR_DEVICE_ORIENTATION_NOT_SUPPORTED",
+      message: "Device orientation API not supported"
+    }) : window.isSecureContext === !1 ? this.eventEmitter.emit("deviceorientationerror", {
+      code: "LOCAR_DEVICE_ORIENTATION_NO_HTTPS",
+      message: "DeviceOrientationEvent is only available in secure contexts (https)"
+    }) : typeof window.DeviceOrientationEvent.requestPermission == "function" && this.enablePermissionDialog ? this.obtainPermissionGesture() : this.eventEmitter.emit("deviceorientationgranted", { target: this });
   }
 }
-class ct {
+class N {
   /**
    * Create a ClickHandler.
    * @param {THREE.WebGLRenderer} - The Three.js renderer on which the click
    * events will be handled.
    */
-  constructor(t) {
-    this.raycaster = new b.Raycaster(), this.normalisedMousePosition = new b.Vector2(null, null), t.domElement.addEventListener("click", (i) => {
+  constructor(e) {
+    this.raycaster = new f.Raycaster(), this.normalisedMousePosition = new f.Vector2(null, null), e.domElement.addEventListener("click", (i) => {
       this.normalisedMousePosition.set(
-        i.clientX / t.domElement.clientWidth * 2 - 1,
-        -(i.clientY / t.domElement.clientHeight * 2) + 1
+        i.clientX / e.domElement.clientWidth * 2 - 1,
+        -(i.clientY / e.domElement.clientHeight * 2) + 1
       );
     });
   }
@@ -512,21 +515,22 @@ class ct {
    * cast into.
    * @return {Array} - array of all intersected objects.
    */
-  raycast(t, i) {
+  raycast(e, i) {
     if (this.normalisedMousePosition.x !== null && this.normalisedMousePosition.y !== null) {
-      this.raycaster.setFromCamera(this.normalisedMousePosition, t);
-      const e = this.raycaster.intersectObjects(i.children, !1);
-      return this.normalisedMousePosition.set(null, null), e;
+      this.raycaster.setFromCamera(this.normalisedMousePosition, e);
+      const t = this.raycaster.intersectObjects(i.children, !1);
+      return this.normalisedMousePosition.set(null, null), t;
     }
     return [];
   }
 }
-const ht = "0.0.10-noaframe-1";
+const S = "0.1.0";
 export {
-  ct as ClickHandler,
-  rt as DeviceOrientationControls,
-  ot as LocationBased,
-  $ as SphMercProjection,
-  at as Webcam,
-  ht as version
+  N as ClickHandler,
+  x as DeviceOrientationControls,
+  P as EventEmitter,
+  L as LocationBased,
+  T as SphMercProjection,
+  H as Webcam,
+  S as version
 };

package/dist/locar.umd.js

@@ -1,3 +1 @@
-(function(a,n){typeof exports=="object"&&typeof module<"u"?n(exports,require("three")):typeof define=="function"&&define.amd?define(["exports","three"],n):(a=typeof globalThis<"u"?globalThis:a||self,n(a.locar={},a.THREE))})(this,function(a,n){"use strict";var N=a=>{throw TypeError(a)};var q=(a,n,f)=>n.has(a)||N("Cannot "+f);var s=(a,n,f)=>(q(a,n,"read from private field"),f?f.call(a):n.get(a)),v=(a,n,f)=>n.has(a)?N("Cannot add the same private member more than once"):n instanceof WeakSet?n.add(a):n.set(a,f),u=(a,n,f,m)=>(q(a,n,"write to private field"),m?m.call(a,f):n.set(a,f),f),y=(a,n,f)=>(q(a,n,"access private method"),f);var Q=(a,n,f,m)=>({set _(W){u(a,n,W,f)},get _(){return s(a,n,m)}});var w,G,X,V,Y,E,D,I,S,j,L,O,_,T,P,M,H,Z,k,B;function f(b){const t=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(b){for(const i in b)if(i!=="default"){const e=Object.getOwnPropertyDescriptor(b,i);Object.defineProperty(t,i,e.get?e:{enumerable:!0,get:()=>b[i]})}}return t.default=b,Object.freeze(t)}const m=f(n);class W{constructor(){v(this,w);this.EARTH=4007501668e-2,this.HALF_EARTH=2003750834e-2}project(t,i){return[y(this,w,G).call(this,t),y(this,w,X).call(this,i)]}unproject(t){return[y(this,w,V).call(this,t[0]),y(this,w,Y).call(this,t[1])]}getID(){return"epsg:3857"}}w=new WeakSet,G=function(t){return t/180*this.HALF_EARTH},X=function(t){var i=Math.log(Math.tan((90+t)*Math.PI/360))/(Math.PI/180);return i*this.HALF_EARTH/180},V=function(t){return t/this.HALF_EARTH*180},Y=function(t){var i=t/this.HALF_EARTH*180;return i=180/Math.PI*(2*Math.atan(Math.exp(i*Math.PI/180))-Math.PI/2),i};class K{constructor(t,i,e={},l=null){v(this,M);v(this,E);v(this,D);v(this,I);v(this,S);v(this,j);v(this,L);v(this,O);v(this,_);v(this,T);v(this,P);this.scene=t,this.camera=i,u(this,E,new W),u(this,D,{}),u(this,I,null),u(this,S,0),u(this,j,100),u(this,L,null),this.setGpsOptions(e),u(this,O,null),u(this,_,0),u(this,T,0),u(this,P,l)}setProjection(t){u(this,E,t)}setGpsOptions(t={}){t.gpsMinDistance!==void 0&&u(this,S,t.gpsMinDistance),t.gpsMinAccuracy!==void 0&&u(this,j,t.gpsMinAccuracy)}async startGps(){if(s(this,P)){const i=await(await s(this,P).sendData("/gps/start",{gpsMinDistance:s(this,S),gpsMinAccuracy:s(this,j)})).json();u(this,T,i.session)}return s(this,L)===null?(u(this,L,navigator.geolocation.watchPosition(t=>{y(this,M,k).call(this,t)},t=>{s(this,D).gpserror?s(this,D).gpserror(t.code):alert(`GPS error: code ${t.code}`)},{enableHighAccuracy:!0})),!0):!1}stopGps(){return s(this,L)!==null?(navigator.geolocation.clearWatch(s(this,L)),u(this,L,null),!0):!1}fakeGps(t,i,e=null,l=0){e!==null&&this.setElevation(e),y(this,M,k).call(this,{coords:{longitude:t,latitude:i,accuracy:l}})}lonLatToWorldCoords(t,i){const e=s(this,E).project(t,i);if(s(this,O))e[0]-=s(this,O)[0],e[1]-=s(this,O)[1];else throw"No initial position determined";return[e[0],-e[1]]}add(t,i,e,l,h={}){var p;t.properties=h,y(this,M,H).call(this,t,i,e,l),this.scene.add(t),(p=s(this,P))==null||p.sendData("/object/new",{position:t.position,x:t.position.x,z:t.position.z,session:s(this,T),properties:h})}setElevation(t){this.camera.position.y=t}on(t,i){s(this,D)[t]=i}}E=new WeakMap,D=new WeakMap,I=new WeakMap,S=new WeakMap,j=new WeakMap,L=new WeakMap,O=new WeakMap,_=new WeakMap,T=new WeakMap,P=new WeakMap,M=new WeakSet,H=function(t,i,e,l){const h=this.lonLatToWorldCoords(i,e);l!==void 0&&(t.position.y=l),[t.position.x,t.position.z]=h},Z=function(t,i){u(this,O,s(this,E).project(t,i))},k=function(t){var e,l,h;let i=Number.MAX_VALUE;Q(this,_)._++,(e=s(this,P))==null||e.sendData("/gps/new",{gpsCount:s(this,_),lat:t.coords.latitude,lon:t.coords.longitude,acc:t.coords.accuracy,session:s(this,T)}),t.coords.accuracy<=s(this,j)&&(s(this,I)===null?u(this,I,{latitude:t.coords.latitude,longitude:t.coords.longitude}):i=y(this,M,B).call(this,s(this,I),t.coords),i>=s(this,S)&&(s(this,I).longitude=t.coords.longitude,s(this,I).latitude=t.coords.latitude,s(this,O)||(y(this,M,Z).call(this,t.coords.longitude,t.coords.latitude),(l=s(this,P))==null||l.sendData("/worldorigin/new",{gpsCount:s(this,_),lat:t.coords.latitude,lon:t.coords.longitude,session:s(this,T),initialPosition:s(this,O)})),y(this,M,H).call(this,this.camera,t.coords.longitude,t.coords.latitude),(h=s(this,P))==null||h.sendData("/gps/accepted",{gpsCount:s(this,_),cameraX:this.camera.position.x,cameraZ:this.camera.position.z,session:s(this,T),distMoved:i}),s(this,D).gpsupdate&&s(this,D).gpsupdate(t,i)))},B=function(t,i){const e=m.MathUtils.degToRad(i.longitude-t.longitude),l=m.MathUtils.degToRad(i.latitude-t.latitude),h=Math.sin(l/2)*Math.sin(l/2)+Math.cos(m.MathUtils.degToRad(t.latitude))*Math.cos(m.MathUtils.degToRad(i.latitude))*(Math.sin(e/2)*Math.sin(e/2));return 2*Math.atan2(Math.sqrt(h),Math.sqrt(1-h))*6371e3};class ${constructor(t={},i){this.sceneWebcam=new m.Scene;let e;if(i?e=document.querySelector(i):(e=document.createElement("video"),e.setAttribute("autoplay",!0),e.setAttribute("playsinline",!0),e.style.display="none",document.body.appendChild(e)),this.texture=new m.VideoTexture(e),navigator.mediaDevices&&navigator.mediaDevices.getUserMedia){const l={video:{width:{ideal:t.idealWidth||1280},height:{ideal:t.idealHeight||720},facingMode:"environment"}};navigator.mediaDevices.getUserMedia(l).then(h=>{e.addEventListener("loadedmetadata",()=>{var p;e.setAttribute("width",e.videoWidth),e.setAttribute("height",e.videoHeight),e.play(),(p=t.onVideoStarted)==null||p.call(this,this.texture)}),e.srcObject=h}).catch(h=>{setTimeout(()=>{alert(`Webcam Error
-Name: `+h.name+`
-Message: `+h.message)},1e3)})}else setTimeout(()=>{alert("sorry - media devices API not supported")},1e3)}dispose(){this.texture.dispose()}}const R=navigator.userAgent.match(/iPhone|iPad|iPod/i)||/Macintosh/i.test(navigator.userAgent)&&navigator.maxTouchPoints!=null&&navigator.maxTouchPoints>1,J=new n.Vector3(0,0,1),z=new n.Euler,tt=new n.Quaternion,et=new n.Quaternion(-Math.sqrt(.5),0,0,Math.sqrt(.5)),it={type:"change"};class nt extends n.EventDispatcher{constructor(t,i={}){super(),window.isSecureContext===!1&&console.error("THREE.DeviceOrientationControls: DeviceOrientationEvent is only available in secure contexts (https)");const e=this,l=1e-6,h=new n.Quaternion;this.object=t,this.object.rotation.reorder("YXZ"),this.enabled=!0,this.deviceOrientation=null,this.screenOrientation=0,this.alphaOffset=0,this.initialOffset=null,this.TWO_PI=2*Math.PI,this.HALF_PI=.5*Math.PI,this.orientationChangeEventName="ondeviceorientationabsolute"in window?"deviceorientationabsolute":"deviceorientation",this.smoothingFactor=i.smoothingFactor||1;const p=function({alpha:o,beta:r,gamma:c,webkitCompassHeading:g}){if(R){const d=360-g;e.alphaOffset=n.MathUtils.degToRad(d-o),e.deviceOrientation={alpha:o,beta:r,gamma:c,webkitCompassHeading:g}}else o<0&&(o+=360),e.deviceOrientation={alpha:o,beta:r,gamma:c};window.dispatchEvent(new CustomEvent("camera-rotation-change",{detail:{cameraRotation:t.rotation}}))},x=function(){e.screenOrientation=window.orientation||0},F=function(o,r,c,g,d){z.set(c,r,-g,"YXZ"),o.setFromEuler(z),o.multiply(et),o.multiply(tt.setFromAxisAngle(J,-d))};this.connect=function(){x(),window.DeviceOrientationEvent!==void 0&&typeof window.DeviceOrientationEvent.requestPermission=="function"?window.DeviceOrientationEvent.requestPermission().then(o=>{o==="granted"&&(window.addEventListener("orientationchange",x),window.addEventListener(e.orientationChangeEventName,p))}).catch(function(o){console.error("THREE.DeviceOrientationControls: Unable to use DeviceOrientation API:",o)}):(window.addEventListener("orientationchange",x),window.addEventListener(e.orientationChangeEventName,p)),e.enabled=!0},this.disconnect=function(){window.removeEventListener("orientationchange",x),window.removeEventListener(e.orientationChangeEventName,p),e.enabled=!1,e.initialOffset=!1,e.deviceOrientation=null},this.update=function({theta:o=0}={theta:0}){if(e.enabled===!1)return;const r=e.deviceOrientation;if(r){let c=r.alpha?n.MathUtils.degToRad(r.alpha)+e.alphaOffset:0,g=r.beta?n.MathUtils.degToRad(r.beta):0,d=r.gamma?n.MathUtils.degToRad(r.gamma):0;const U=e.screenOrientation?n.MathUtils.degToRad(e.screenOrientation):0;if(R){const A=new n.Quaternion;F(A,c,g,d,U);const C=new n.Euler().setFromQuaternion(A,"YXZ");console.log(C.x,C.y,C.z),C.y=n.MathUtils.degToRad(360-r.webkitCompassHeading),A.setFromEuler(C),e.object.quaternion.copy(A)}else{if(this.smoothingFactor<1){if(this.lastOrientation){const A=this.smoothingFactor;c=this._getSmoothedAngle(c,this.lastOrientation.alpha,A),g=this._getSmoothedAngle(g+Math.PI,this.lastOrientation.beta,A),d=this._getSmoothedAngle(d+this.HALF_PI,this.lastOrientation.gamma,A,Math.PI)}else g+=Math.PI,d+=this.HALF_PI;this.lastOrientation={alpha:c,beta:g,gamma:d}}F(e.object.quaternion,c+o,this.smoothingFactor<1?g-Math.PI:g,this.smoothingFactor<1?d-this.HALF_PI:d,U)}8*(1-h.dot(e.object.quaternion))>l&&(h.copy(e.object.quaternion),e.dispatchEvent(it))}},this._orderAngle=function(o,r,c=this.TWO_PI){return r>o&&Math.abs(r-o)<c/2||o>r&&Math.abs(r-o)>c/2?{left:o,right:r}:{left:r,right:o}},this._getSmoothedAngle=function(o,r,c,g=this.TWO_PI){const d=this._orderAngle(o,r,g),U=d.left,A=d.right;d.left=0,d.right-=U,d.right<0&&(d.right+=g);let C=A==r?(1-c)*d.right+c*d.left:c*d.right+(1-c)*d.left;return C+=U,C>=g&&(C-=g),C},this.updateAlphaOffset=function(){e.initialOffset=!1},this.dispose=function(){e.disconnect()},this.getAlpha=function(){const{deviceOrientation:o}=e;return o&&o.alpha?n.MathUtils.degToRad(o.alpha)+e.alphaOffset:0},this.getBeta=function(){const{deviceOrientation:o}=e;return o&&o.beta?n.MathUtils.degToRad(o.beta):0},window.DeviceOrientationEvent!==void 0&&typeof window.DeviceOrientationEvent.requestPermission=="function"?this.initPermissionDialog():this.connect()}initPermissionDialog(){const t=document.createElement("div"),i=document.createElement("div"),e=document.createElement("div"),l=document.createElement("div");document.body.appendChild(t);const h={display:"flex",position:"fixed",top:0,left:0,width:"100%",height:"100%",zIndex:1,backgroundColor:"rgba(0,0,0,0.6)",justifyContent:"center",alignItems:"center"},p={backgroundColor:"white",padding:"6px",borderRadius:"3px",width:"36rem",height:"24rem"},x={width:"100%",height:"70%",display:"flex",justifyContent:"center",alignItems:"center"},F={display:"inline-flex",width:"100%",height:"30%",justifyContent:"center",alignItems:"center"};for(let c in h)t.style[c]=h[c];for(let c in p)i.style[c]=p[c];for(let c in x)e.style[c]=x[c];for(let c in F)l.style[c]=F[c];t.appendChild(i),i.appendChild(e),i.appendChild(l),e.innerHTML='<div style="font-size: 24pt; margin: 1rem;">This immersive website requires access to your device motion sensors.</div>';const o=()=>{this.connect(),t.style.display="none"},r=document.createElement("button");r.addEventListener("click",o),r.style.width="50%",r.style.height="80%",r.style.fontSize="20pt",r.appendChild(document.createTextNode("OK")),l.appendChild(r),document.body.appendChild(t)}}class st{constructor(t){this.raycaster=new m.Raycaster,this.normalisedMousePosition=new m.Vector2(null,null),t.domElement.addEventListener("click",i=>{this.normalisedMousePosition.set(i.clientX/t.domElement.clientWidth*2-1,-(i.clientY/t.domElement.clientHeight*2)+1)})}raycast(t,i){if(this.normalisedMousePosition.x!==null&&this.normalisedMousePosition.y!==null){this.raycaster.setFromCamera(this.normalisedMousePosition,t);const e=this.raycaster.intersectObjects(i.children,!1);return this.normalisedMousePosition.set(null,null),e}return[]}}const ot="0.0.10-noaframe-1";a.ClickHandler=st,a.DeviceOrientationControls=nt,a.LocationBased=K,a.SphMercProjection=W,a.Webcam=$,a.version=ot,Object.defineProperty(a,Symbol.toStringTag,{value:"Module"})});
+(function(d,c){typeof exports=="object"&&typeof module<"u"?c(exports,require("three")):typeof define=="function"&&define.amd?define(["exports","three"],c):(d=typeof globalThis<"u"?globalThis:d||self,c(d.locar={},d.THREE))})(this,(function(d,c){"use strict";function E(u){const t=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(u){for(const i in u)if(i!=="default"){const e=Object.getOwnPropertyDescriptor(u,i);Object.defineProperty(t,i,e.get?e:{enumerable:!0,get:()=>u[i]})}}return t.default=u,Object.freeze(t)}const v=E(c);class A{constructor(){this.EARTH=4007501668e-2,this.HALF_EARTH=2003750834e-2}project(t,i){return[this.#t(t),this.#l(i)]}unproject(t){return[this.#e(t[0]),this.#s(t[1])]}#t(t){return t/180*this.HALF_EARTH}#l(t){var i=Math.log(Math.tan((90+t)*Math.PI/360))/(Math.PI/180);return i*this.HALF_EARTH/180}#e(t){return t/this.HALF_EARTH*180}#s(t){var i=t/this.HALF_EARTH*180;return i=180/Math.PI*(2*Math.atan(Math.exp(i*Math.PI/180))-Math.PI/2),i}getID(){return"epsg:3857"}}class y{constructor(){this.eventHandlers={}}on(t,i){this.eventHandlers[t]=i}emit(t,...i){this.eventHandlers[t]?.call(this,...i)}}class C extends y{#t;#l;#e;#s;#c;#o;#i;#r;#a;#n;constructor(t,i,e={},l=null){super(),this.scene=t,this.camera=i,this.#t=new A,this.#e=null,this.#s=0,this.#c=100,this.#o=null,this.setGpsOptions(e),this.#i=null,this.#r=0,this.#a=0,this.#n=l}setProjection(t){this.#t=t}setGpsOptions(t={}){t.gpsMinDistance!==void 0&&(this.#s=t.gpsMinDistance),t.gpsMinAccuracy!==void 0&&(this.#c=t.gpsMinAccuracy)}async startGps(){if(this.#n){const i=await(await this.#n.sendData("/gps/start",{gpsMinDistance:this.#s,gpsMinAccuracy:this.#c})).json();this.#a=i.session}return this.#o===null?(this.#o=navigator.geolocation.watchPosition(t=>{this.#h(t)},t=>{this.emit("gpserror",t)},{enableHighAccuracy:!0}),!0):!1}stopGps(){return this.#o!==null?(navigator.geolocation.clearWatch(this.#o),this.#o=null,!0):!1}fakeGps(t,i,e=null,l=0){e!==null&&this.setElevation(e),this.#h({coords:{longitude:t,latitude:i,accuracy:l}})}lonLatToWorldCoords(t,i){const e=this.#t.project(t,i);if(this.#i)e[0]-=this.#i[0],e[1]-=this.#i[1];else throw"No initial position determined";return[e[0],-e[1]]}add(t,i,e,l,m={}){t.properties=m,this.#d(t,i,e,l),this.scene.add(t),this.#n?.sendData("/object/new",{position:t.position,x:t.position.x,z:t.position.z,session:this.#a,properties:m})}#d(t,i,e,l){const m=this.lonLatToWorldCoords(i,e);l!==void 0&&(t.position.y=l),[t.position.x,t.position.z]=m}setElevation(t){this.camera.position.y=t}#u(t,i){this.#i=this.#t.project(t,i)}#h(t){let i=Number.MAX_VALUE;this.#r++,this.#n?.sendData("/gps/new",{gpsCount:this.#r,lat:t.coords.latitude,lon:t.coords.longitude,acc:t.coords.accuracy,session:this.#a}),t.coords.accuracy<=this.#c&&(this.#e===null?this.#e={latitude:t.coords.latitude,longitude:t.coords.longitude}:i=this.#m(this.#e,t.coords),i>=this.#s&&(this.#e.longitude=t.coords.longitude,this.#e.latitude=t.coords.latitude,this.#i||(this.#u(t.coords.longitude,t.coords.latitude),this.#n?.sendData("/worldorigin/new",{gpsCount:this.#r,lat:t.coords.latitude,lon:t.coords.longitude,session:this.#a,initialPosition:this.#i})),this.#d(this.camera,t.coords.longitude,t.coords.latitude),this.#n?.sendData("/gps/accepted",{gpsCount:this.#r,cameraX:this.camera.position.x,cameraZ:this.camera.position.z,session:this.#a,distMoved:i}),this.emit("gpsupdate",{position:t,distMoved:i})))}#m(t,i){const e=v.MathUtils.degToRad(i.longitude-t.longitude),l=v.MathUtils.degToRad(i.latitude-t.latitude),m=Math.sin(l/2)*Math.sin(l/2)+Math.cos(v.MathUtils.degToRad(t.latitude))*Math.cos(v.MathUtils.degToRad(i.latitude))*(Math.sin(e/2)*Math.sin(e/2));return 2*Math.atan2(Math.sqrt(m),Math.sqrt(1-m))*6371e3}}class _ extends y{#t;constructor(t={video:{facingMode:"environment"}},i){super(),this.sceneWebcam=new v.Scene,i?this.#t=document.querySelector(i):(this.#t=document.createElement("video"),this.#t.setAttribute("autoplay",!0),this.#t.setAttribute("playsinline",!0),this.#t.style.display="none",document.body.appendChild(this.#t)),this.texture=new v.VideoTexture(this.#t),navigator.mediaDevices&&navigator.mediaDevices.getUserMedia?navigator.mediaDevices.getUserMedia(t).then(e=>{this.#t.addEventListener("loadedmetadata",()=>{this.#t.setAttribute("width",this.#t.videoWidth),this.#t.setAttribute("height",this.#t.videoHeight),this.#t.play(),this.emit("webcamstarted",{texture:this.texture})}),this.#t.srcObject=e}).catch(e=>{this.emit("webcamerror",{code:e.name,message:e.message})}):this.emit("webcamerror",{code:"LOCAR_NO_MEDIA_DEVICES_API",message:"Media devices API not supported"})}dispose(){this.texture.dispose()}}const w=navigator.userAgent.match(/iPhone|iPad|iPod/i)||/Macintosh/i.test(navigator.userAgent)&&navigator.maxTouchPoints!=null&&navigator.maxTouchPoints>1,b=new c.Vector3(0,0,1),I=new c.Euler,D=new c.Quaternion,T=new c.Quaternion(-Math.sqrt(.5),0,0,Math.sqrt(.5));class L extends c.EventDispatcher{constructor(t,i={}){super(),this.eventEmitter=new y;const e=this;this.object=t,this.object.rotation.reorder("YXZ"),this.enabled=!0,this.deviceOrientation=null,this.screenOrientation=0,this.alphaOffset=0,this.orientationOffset=0,this.initialOffset=null,this.lastCompassY=void 0,this.lastOrientation=null,this.TWO_PI=2*Math.PI,this.HALF_PI=.5*Math.PI,this.orientationChangeEventName="ondeviceorientationabsolute"in window?"deviceorientationabsolute":"deviceorientation",console.log("Device Orientation Event Name:",this.orientationChangeEventName),this.smoothingFactor=i.smoothingFactor||1,this.enablePermissionDialog=i.enablePermissionDialog??!0;const l=function({alpha:n,beta:s,gamma:a,webkitCompassHeading:r}){if(w){const o=360-r;e.alphaOffset=c.MathUtils.degToRad(o-n),e.deviceOrientation={alpha:n,beta:s,gamma:a,webkitCompassHeading:r}}else n<0&&(n+=360),e.deviceOrientation={alpha:n,beta:s,gamma:a};window.dispatchEvent(new CustomEvent("camera-rotation-change",{detail:{cameraRotation:t.rotation}}))},m=function(){e.screenOrientation=window.orientation||0,w&&(e.screenOrientation===90?e.orientationOffset=-e.HALF_PI:e.screenOrientation===-90?e.orientationOffset=e.HALF_PI:e.orientationOffset=0)},P=function(n,s,a,r,o){I.set(a,s,-r,"YXZ"),n.setFromEuler(I),n.multiply(T),n.multiply(D.setFromAxisAngle(b,-o))};this.connect=function(){m(),window.addEventListener("orientationchange",m),window.addEventListener(e.orientationChangeEventName,l),e.enabled=!0},this.disconnect=function(){window.removeEventListener("orientationchange",m),window.removeEventListener(e.orientationChangeEventName,l),e.enabled=!1,e.initialOffset=!1,e.deviceOrientation=null},this.requestOrientationPermissions=function(){window.DeviceOrientationEvent!==void 0&&typeof window.DeviceOrientationEvent.requestPermission=="function"?window.DeviceOrientationEvent.requestPermission().then(n=>{n==="granted"?this.eventEmitter.emit("deviceorientationgranted",{target:this}):this.eventEmitter.emit("deviceorientationerror",{code:"LOCAR_DEVICE_ORIENTATION_PERMISSION_DENIED",message:"Permission for device orientation denied - AR will not work correctly"})}).catch(function(n){this.eventEmitter.emit("deviceorientationerror",{code:"LOCAR_DEVICE_ORIENTATION_PERMISSION_FAILED",message:"Permission request for device orientation failed - AR will not work correctly"})}):this.eventEmitter.emit("deviceorientationerror",{code:"LOCAR_DEVICE_ORIENTATION_INTERNAL_ERROR",message:"Internal error: no requestPermission() found although requestOrientationPermissions() was called - please raise an issue on GitHub"})},this.update=function({theta:n=0}={theta:0}){if(e.enabled===!1)return;const s=e.deviceOrientation;if(s){let a=s.alpha?c.MathUtils.degToRad(s.alpha)+e.alphaOffset:0,r=s.beta?c.MathUtils.degToRad(s.beta):0,o=s.gamma?c.MathUtils.degToRad(s.gamma):0;const p=e.screenOrientation?c.MathUtils.degToRad(e.screenOrientation):0;if(e.smoothingFactor<1){if(e.lastOrientation){const h=e.smoothingFactor;a=e._getSmoothedAngle(a,e.lastOrientation.alpha,h),r=e._getSmoothedAngle(r+Math.PI,e.lastOrientation.beta,h),o=e._getSmoothedAngle(o+e.HALF_PI,e.lastOrientation.gamma,h,Math.PI)}else r+=Math.PI,o+=e.HALF_PI;e.lastOrientation={alpha:a,beta:r,gamma:o}}if(w){const h=new c.Quaternion;P(h,a,e.smoothingFactor<1?r-Math.PI:r,e.smoothingFactor<1?o-Math.PI/2:o,p);const f=new c.Euler().setFromQuaternion(h,"YXZ");let O=c.MathUtils.degToRad(360-s.webkitCompassHeading);e.smoothingFactor<1&&e.lastCompassY!==void 0&&(O=e._getSmoothedAngle(O,e.lastCompassY,e.smoothingFactor)),e.lastCompassY=O,f.y=O+(e.orientationOffset||0),h.setFromEuler(f),e.object.quaternion.copy(h)}else P(e.object.quaternion,w?a+e.alphaOffset:a,e.smoothingFactor<1?r-Math.PI:r,e.smoothingFactor<1?o-Math.PI/2:o,p)}},this.getCorrectedHeading=function(){const{deviceOrientation:n}=e;if(!n)return 0;let s=0;return w?(s=360-n.webkitCompassHeading,e.orientationOffset&&(s+=e.orientationOffset*(180/Math.PI),s=(s+360)%360)):(n.absolute===!0||e.orientationChangeEventName,s=n.alpha?n.alpha:0,s=(360-s)%360,s<0&&(s+=360)),s},this._orderAngle=function(n,s,a=e.TWO_PI){return s>n&&Math.abs(s-n)<a/2||n>s&&Math.abs(s-n)>a/2?{left:n,right:s}:{left:s,right:n}},this._getSmoothedAngle=function(n,s,a,r=e.TWO_PI){const o=e._orderAngle(n,s,r),p=o.left,h=o.right;o.left=0,o.right-=p,o.right<0&&(o.right+=r);let f=h==s?(1-a)*o.right+a*o.left:a*o.right+(1-a)*o.left;return f+=p,f>=r&&(f-=r),f},this.updateAlphaOffset=function(){e.initialOffset=!1},this.dispose=function(){e.disconnect()},this.getAlpha=function(){const{deviceOrientation:n}=e;return n&&n.alpha?c.MathUtils.degToRad(n.alpha)+e.alphaOffset:0},this.getBeta=function(){const{deviceOrientation:n}=e;return n&&n.beta?c.MathUtils.degToRad(n.beta):0},this.getGamma=function(){const{deviceOrientation:n}=e;return n&&n.gamma?c.MathUtils.degToRad(n.gamma):0},this.obtainPermissionGesture=function(){const n=document.createElement("div"),s=document.createElement("div"),a=document.createElement("div"),r=document.createElement("div");document.body.appendChild(n);const o={display:"flex",position:"fixed",top:0,left:0,width:"100%",height:"100%",zIndex:1,backgroundColor:"rgba(0,0,0,0.6)",justifyContent:"center",alignItems:"center"},p={backgroundColor:"white",padding:"6px",borderRadius:"3px",width:"36rem",height:"24rem"},h={width:"100%",height:"70%",display:"flex",justifyContent:"center",alignItems:"center"},f={display:"inline-flex",width:"100%",height:"30%",justifyContent:"center",alignItems:"center"};for(let g in o)n.style[g]=o[g];for(let g in p)s.style[g]=p[g];for(let g in h)a.style[g]=h[g];for(let g in f)r.style[g]=f[g];n.appendChild(s),s.appendChild(a),s.appendChild(r),a.innerHTML='<div style="font-size: 24pt; margin: 1rem;">This immersive website requires access to your device motion sensors.</div>';const O=()=>{this.requestOrientationPermissions(),n.style.display="none"},M=document.createElement("button");M.addEventListener("click",O),M.style.width="50%",M.style.height="80%",M.style.fontSize="20pt",M.appendChild(document.createTextNode("OK")),r.appendChild(M),document.body.appendChild(n)}}on(t,i){this.eventEmitter.on(t,i)}init(){window.DeviceOrientationEvent===void 0?this.eventEmitter.emit("deviceorientationerror",{code:"LOCAR_DEVICE_ORIENTATION_NOT_SUPPORTED",message:"Device orientation API not supported"}):window.isSecureContext===!1?this.eventEmitter.emit("deviceorientationerror",{code:"LOCAR_DEVICE_ORIENTATION_NO_HTTPS",message:"DeviceOrientationEvent is only available in secure contexts (https)"}):typeof window.DeviceOrientationEvent.requestPermission=="function"&&this.enablePermissionDialog?this.obtainPermissionGesture():this.eventEmitter.emit("deviceorientationgranted",{target:this})}}class R{constructor(t){this.raycaster=new v.Raycaster,this.normalisedMousePosition=new v.Vector2(null,null),t.domElement.addEventListener("click",i=>{this.normalisedMousePosition.set(i.clientX/t.domElement.clientWidth*2-1,-(i.clientY/t.domElement.clientHeight*2)+1)})}raycast(t,i){if(this.normalisedMousePosition.x!==null&&this.normalisedMousePosition.y!==null){this.raycaster.setFromCamera(this.normalisedMousePosition,t);const e=this.raycaster.intersectObjects(i.children,!1);return this.normalisedMousePosition.set(null,null),e}return[]}}const S="0.1.0";d.ClickHandler=R,d.DeviceOrientationControls=L,d.EventEmitter=y,d.LocationBased=C,d.SphMercProjection=A,d.Webcam=_,d.version=S,Object.defineProperty(d,Symbol.toStringTag,{value:"Module"})}));

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "locar",
-  "version": "0.0.12",
+  "version": "0.1.0",
   "description": "Location-based AR from AR.js.",
   "files": [
     "dist"
@@ -19,7 +19,7 @@
   },
   "devDependencies": {
     "jsdoc": "^4.0.4",
-    "vite": "^5.4.8"
+    "vite": "^7.1.3"
   },
   "dependencies": {
     "three": "^0.175.0"