locar 0.0.3 → 0.0.7

package/README.md

@@ -22,6 +22,10 @@ Some of these issues, such as incorrect North on some devices, may well be to do
 
 For this reason, the focus at present will be on developing a **pure three.js version only**. When we believe that the key bugs and issues have been resolved, the plan is to then provide an A-Frame wrapper.
 
+## 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
+
 ## Using the library
 
 The library has been published to `npm` so you can install with:
@@ -38,13 +42,17 @@ import * as LocAR from 'locar';
 as long as you include `locar` as a dependency, e.g. in your `package.json`:
 ```
 "dependencies": {
-   "locar" : "^0.0.3",
+   "locar" : "^0.0.7",
    "three" : "^0.169.0"
 }
 ```
 
 Including the library bundle directly as an import has issues with duplicate three.js imports which we have not resolved, so we recommend the approach above.
 
+## API documentation
+
+Please see [here](https://ar-js-org.github.io/locar.js/api) for full API documentation.
+
 ## Tutorial
 
 Please see [here](https://github.com/AR-js-org/locar.js/blob/master/docs/tutorial/index.md) for a tutorial introducing LocAR.js.

package/dist/locar.es.js

@@ -1,122 +1,274 @@
-import * as s from "three";
-class v {
+var j = (r) => {
+  throw TypeError(r);
+};
+var F = (r, t, e) => t.has(r) || j("Cannot " + e);
+var n = (r, t, e) => (F(r, t, "read from private field"), e ? e.call(r) : t.get(r)), m = (r, t, e) => t.has(r) ? j("Cannot add the same private member more than once") : t instanceof WeakSet ? t.add(r) : t.set(r, e), d = (r, t, e, i) => (F(r, t, "write to private field"), i ? i.call(r, e) : t.set(r, e), e), v = (r, t, e) => (F(r, t, "access private method"), e);
+var q = (r, t, e, i) => ({
+  set _(o) {
+    d(r, t, o, e);
+  },
+  get _() {
+    return n(r, t, i);
+  }
+});
+import * as f from "three";
+import { Vector3 as Z, Euler as N, Quaternion as _, EventDispatcher as B, MathUtils as D } from "three";
+var P, U, G, X, Q;
+class K {
+  /**
+   * Create a SphMercProjection.
+   */
   constructor() {
+    m(this, P);
     this.EARTH = 4007501668e-2, this.HALF_EARTH = 2003750834e-2;
   }
-  project(e, t) {
-    return [this.lonToSphMerc(e), this.latToSphMerc(t)];
-  }
-  unproject(e) {
-    return [this.sphMercToLon(e[0]), this.sphMercToLat(e[1])];
-  }
-  lonToSphMerc(e) {
-    return e / 180 * this.HALF_EARTH;
-  }
-  latToSphMerc(e) {
-    var t = Math.log(Math.tan((90 + e) * Math.PI / 360)) / (Math.PI / 180);
-    return t * this.HALF_EARTH / 180;
-  }
-  sphMercToLon(e) {
-    return e / this.HALF_EARTH * 180;
+  /**
+   * Project a longitude and latitude into Spherical Mercator.
+   * @param {number} lon - the longitude.
+   * @param {number} lat - the latitude.
+   * @return {Array} Two-member array containing easting and northing.
+   */
+  project(t, e) {
+    return [v(this, P, U).call(this, t), v(this, P, G).call(this, e)];
   }
-  sphMercToLat(e) {
-    var t = e / this.HALF_EARTH * 180;
-    return t = 180 / Math.PI * (2 * Math.atan(Math.exp(t * Math.PI / 180)) - Math.PI / 2), t;
+  /**
+   * 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 [v(this, P, X).call(this, t[0]), v(this, P, Q).call(this, t[1])];
   }
+  /**
+   * Return the projection's ID.
+   * @return {string} The value "epsg:3857".
+   */
   getID() {
     return "epsg:3857";
   }
 }
-class w {
-  constructor(e, t, i = {}) {
-    this._scene = e, this._camera = t, this._proj = new v(), this._eventHandlers = {}, this._lastCoords = null, this._gpsMinDistance = 0, this._gpsMinAccuracy = 100, this._watchPositionId = null, this.setGpsOptions(i), this.initialPosition = null;
+P = new WeakSet(), U = function(t) {
+  return t / 180 * this.HALF_EARTH;
+}, G = function(t) {
+  var e = Math.log(Math.tan((90 + t) * Math.PI / 360)) / (Math.PI / 180);
+  return e * this.HALF_EARTH / 180;
+}, X = function(t) {
+  return t / this.HALF_EARTH * 180;
+}, Q = function(t) {
+  var e = t / this.HALF_EARTH * 180;
+  return e = 180 / Math.PI * (2 * Math.atan(Math.exp(e * Math.PI / 180)) - Math.PI / 2), e;
+};
+var R, A, C, L, x, b, E, I, T, O, p, S, V, W, Y;
+class st {
+  /**
+   * @param {THREE.Scene} scene - The Three.js scene to use.
+   * @param {THREE.Camera} camera - The Three.js camera to use. Should usually 
+   * be a THREE.PerspectiveCamera.
+   * @param {Object} options - Initialisation options for the GPS; see
+   * 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, e, i = {}, o = null) {
+    m(this, p);
+    m(this, R);
+    m(this, A);
+    m(this, C);
+    m(this, L);
+    m(this, x);
+    m(this, b);
+    m(this, E);
+    m(this, I);
+    m(this, T);
+    m(this, O);
+    this.scene = t, this.camera = e, d(this, R, new K()), d(this, A, {}), d(this, C, null), d(this, L, 0), d(this, x, 100), d(this, b, null), this.setGpsOptions(i), d(this, E, null), d(this, I, 0), d(this, T, 0), d(this, O, o);
   }
-  setProjection(e) {
-    this._proj = e;
+  /**
+   * Set the projection to use.
+   * @param {Object} any object which includes a project() method 
+   * taking longitude and latitude as arguments and returning an array 
+   * containing easting and northing.
+   */
+  setProjection(t) {
+    d(this, R, t);
   }
-  setGpsOptions(e = {}) {
-    e.gpsMinDistance !== void 0 && (this._gpsMinDistance = e.gpsMinDistance), e.gpsMinAccuracy !== void 0 && (this._gpsMinAccuracy = e.gpsMinAccuracy);
+  /**
+   * Set the GPS options.
+   * @param {Object} object containing gpsMinDistance and/or gpsMinAccuracy
+   * properties. The former specifies the number of metres which the device
+   * 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 && d(this, L, t.gpsMinDistance), t.gpsMinAccuracy !== void 0 && d(this, x, t.gpsMinAccuracy);
   }
-  startGps() {
-    return this._watchPositionId === null ? (this._watchPositionId = navigator.geolocation.watchPosition(
-      (e) => {
-        this._gpsReceived(e);
+  /**
+   * Start the GPS on a real device
+   * @return {boolean} code indicating whether the GPS was started successfully.
+   * GPS errors can be handled by handling the gpserror event.
+   */
+  async startGps() {
+    if (n(this, O)) {
+      const e = await (await n(this, O).sendData("/gps/start", {
+        gpsMinDistance: n(this, L),
+        gpsMinAccuracy: n(this, x)
+      })).json();
+      d(this, T, e.session);
+    }
+    return n(this, b) === null ? (d(this, b, navigator.geolocation.watchPosition(
+      (t) => {
+        v(this, p, W).call(this, t);
       },
-      (e) => {
-        this._eventHandlers.gpserror ? this._eventHandlers.gpserror(e.code) : alert(`GPS error: code ${e.code}`);
+      (t) => {
+        n(this, A).gpserror ? n(this, A).gpserror(t.code) : alert(`GPS error: code ${t.code}`);
       },
       {
         enableHighAccuracy: !0
       }
-    ), !0) : !1;
+    )), !0) : !1;
   }
+  /**
+   * Stop the GPS on a real device
+   * @return {boolean} true if the GPS was stopped, false if it could not be
+   * stopped (i.e. it was never started).
+   */
   stopGps() {
-    return this._watchPositionId !== null ? (navigator.geolocation.clearWatch(this._watchPositionId), this._watchPositionId = null, !0) : !1;
+    return n(this, b) !== null ? (navigator.geolocation.clearWatch(n(this, b)), d(this, b, null), !0) : !1;
   }
-  fakeGps(e, t, i = null, n = 0) {
-    i !== null && this.setElevation(i), this._gpsReceived({
+  /**
+   * Send a fake GPS signal. Useful for testing on a desktop or laptop.
+   * @param {number} lon - The longitude.
+   * @param {number} lat - The latitude.
+   * @param {number} elev - The elevation in metres. (optional, set to null
+   * for no elevation).
+   * @param {number} acc - The accuracy of the GPS reading in metres. May be
+   * ignored if lower than the specified minimum accuracy.
+   */
+  fakeGps(t, e, i = null, o = 0) {
+    i !== null && this.setElevation(i), v(this, p, W).call(this, {
       coords: {
-        longitude: e,
-        latitude: t,
-        accuracy: n
+        longitude: t,
+        latitude: e,
+        accuracy: o
       }
     });
   }
-  lonLatToWorldCoords(e, t) {
-    const i = this._proj.project(e, t);
-    if (this.initialPosition)
-      i[0] -= this.initialPosition[0], i[1] -= this.initialPosition[1];
+  /**
+   * Convert longitude and latitude to three.js/WebGL world coordinates.
+   * Uses the specified projection, and negates the northing (in typical
+   * projections, northings increase northwards, but in the WebGL coordinate
+   * system, we face negative z if the camera is at the origin with default
+   * rotation).
+   * @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, e) {
+    const i = n(this, R).project(t, e);
+    if (n(this, E))
+      i[0] -= n(this, E)[0], i[1] -= n(this, E)[1];
     else
       throw "No initial position determined";
     return [i[0], -i[1]];
   }
-  add(e, t, i, n, a = {}) {
-    e.properties = a, this.setWorldPosition(e, t, i, n), this._scene.add(e);
-  }
-  setWorldPosition(e, t, i, n) {
-    const a = this.lonLatToWorldCoords(t, i);
-    n !== void 0 && (e.position.y = n), [e.position.x, e.position.z] = a;
-  }
-  setElevation(e) {
-    this._camera.position.y = e;
-  }
-  on(e, t) {
-    this._eventHandlers[e] = t;
-  }
-  setWorldOrigin(e, t) {
-    this.initialPosition = this._proj.project(e, t);
+  /**
+   * Add a new AR object at a given latitude, longitude and elevation.
+   * @param {THREE.Mesh} object the object
+   * @param {number} lon - the longitude.
+   * @param {number} lat - the latitude.
+   * @param {number} elev - the elevation in metres 
+   * (if not specified, 0 is assigned)
+   * @param {Object} properties - properties describing the object (for example,
+   * the contents of the GeoJSON properties field).
+   */
+  add(t, e, i, o, u = {}) {
+    var g;
+    t.properties = u, v(this, p, S).call(this, t, e, i, o), this.scene.add(t), (g = n(this, O)) == null || g.sendData("/object/new", {
+      position: t.position,
+      x: t.position.x,
+      z: t.position.z,
+      session: n(this, T),
+      properties: u
+    });
   }
-  _gpsReceived(e) {
-    let t = Number.MAX_VALUE;
-    console.log(`_gpsReceived(): position ${e.coords.latitude},${e.coords.longitude}, accuracy ${e.coords.accuracy}, accuracy limit ${this._gpsMinAccuracy}`), e.coords.accuracy <= this._gpsMinAccuracy && (this._lastCoords === null ? this._lastCoords = {
-      latitude: e.coords.latitude,
-      longitude: e.coords.longitude
-    } : t = this._haversineDist(this._lastCoords, e.coords), t >= this._gpsMinDistance && (this._lastCoords.longitude = e.coords.longitude, this._lastCoords.latitude = e.coords.latitude, this.initialPosition || this.setWorldOrigin(
-      e.coords.longitude,
-      e.coords.latitude
-    ), this.setWorldPosition(
-      this._camera,
-      e.coords.longitude,
-      e.coords.latitude
-    ), this._eventHandlers.gpsupdate && this._eventHandlers.gpsupdate(e, t)));
+  /**
+   * Set the elevation (y coordinate) of the camera.
+   * @param {number} elev - the elevation in metres.
+   */
+  setElevation(t) {
+    this.camera.position.y = t;
   }
   /**
-   * Calculate haversine distance between two lat/lon pairs.
-   *
-   * Taken from original A-Frame AR.js location-based components
+   * 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
    */
-  _haversineDist(e, t) {
-    const i = s.MathUtils.degToRad(t.longitude - e.longitude), n = s.MathUtils.degToRad(t.latitude - e.latitude), a = Math.sin(n / 2) * Math.sin(n / 2) + Math.cos(s.MathUtils.degToRad(e.latitude)) * Math.cos(s.MathUtils.degToRad(t.latitude)) * (Math.sin(i / 2) * Math.sin(i / 2));
-    return 2 * Math.atan2(Math.sqrt(a), Math.sqrt(1 - a)) * 6371e3;
+  on(t, e) {
+    n(this, A)[t] = e;
   }
 }
-class E {
-  constructor(e, t, i) {
-    this.renderer = e, this.renderer.autoClear = !1, this.sceneWebcam = new s.Scene();
-    let n;
-    t === void 0 ? (n = document.createElement("video"), n.setAttribute("autoplay", !0), n.setAttribute("playsinline", !0), n.style.display = "none", document.body.appendChild(n)) : n = document.querySelector(t), this.geom = new s.PlaneGeometry(), this.texture = new s.VideoTexture(n), this.material = new s.MeshBasicMaterial({ map: this.texture });
-    const a = new s.Mesh(this.geom, this.material);
-    if (this.sceneWebcam.add(a), this.cameraWebcam = new s.OrthographicCamera(
+R = new WeakMap(), A = new WeakMap(), C = new WeakMap(), L = new WeakMap(), x = new WeakMap(), b = new WeakMap(), E = new WeakMap(), I = new WeakMap(), T = new WeakMap(), O = new WeakMap(), p = new WeakSet(), S = function(t, e, i, o) {
+  const u = this.lonLatToWorldCoords(e, i);
+  o !== void 0 && (t.position.y = o), [t.position.x, t.position.z] = u;
+}, V = function(t, e) {
+  d(this, E, n(this, R).project(t, e));
+}, W = function(t) {
+  var i, o, u;
+  let e = Number.MAX_VALUE;
+  q(this, I)._++, (i = n(this, O)) == null || i.sendData("/gps/new", {
+    gpsCount: n(this, I),
+    lat: t.coords.latitude,
+    lon: t.coords.longitude,
+    acc: t.coords.accuracy,
+    session: n(this, T)
+  }), t.coords.accuracy <= n(this, x) && (n(this, C) === null ? d(this, C, {
+    latitude: t.coords.latitude,
+    longitude: t.coords.longitude
+  }) : e = v(this, p, Y).call(this, n(this, C), t.coords), e >= n(this, L) && (n(this, C).longitude = t.coords.longitude, n(this, C).latitude = t.coords.latitude, n(this, E) || (v(this, p, V).call(this, t.coords.longitude, t.coords.latitude), (o = n(this, O)) == null || o.sendData("/worldorigin/new", {
+    gpsCount: n(this, I),
+    lat: t.coords.latitude,
+    lon: t.coords.longitude,
+    session: n(this, T),
+    initialPosition: n(this, E)
+  })), v(this, p, S).call(this, this.camera, t.coords.longitude, t.coords.latitude), (u = n(this, O)) == null || u.sendData("/gps/accepted", {
+    gpsCount: n(this, I),
+    cameraX: this.camera.position.x,
+    cameraZ: this.camera.position.z,
+    session: n(this, T),
+    distMoved: e
+  }), n(this, A).gpsupdate && n(this, A).gpsupdate(t, e)));
+}, /**
+ * Calculate haversine distance between two lat/lon pairs.
+ *
+ * Taken from original A-Frame AR.js location-based components
+ */
+Y = function(t, e) {
+  const i = f.MathUtils.degToRad(e.longitude - t.longitude), o = f.MathUtils.degToRad(e.latitude - t.latitude), u = Math.sin(o / 2) * Math.sin(o / 2) + Math.cos(f.MathUtils.degToRad(t.latitude)) * Math.cos(f.MathUtils.degToRad(e.latitude)) * (Math.sin(i / 2) * Math.sin(i / 2));
+  return 2 * Math.atan2(Math.sqrt(u), Math.sqrt(1 - u)) * 6371e3;
+};
+class ot {
+  /**
+   * Create a WebcamRenderer.
+   * @param {THREE.WebGLRenderer} renderer - the Three.js renderer.
+   * @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.
+   * @options {Object} - options to use for initialising the camera. Currently
+   * width and height properties are understood.
+   */
+  constructor(t, e, i) {
+    this.renderer = t, this.renderer.autoClear = !1, this.sceneWebcam = new f.Scene();
+    let o;
+    e ? o = document.querySelector(e) : (o = document.createElement("video"), o.setAttribute("autoplay", !0), o.setAttribute("playsinline", !0), o.style.display = "none", document.body.appendChild(o)), this.geom = new f.PlaneGeometry(), this.texture = new f.VideoTexture(o), this.material = new f.MeshBasicMaterial({ map: this.texture });
+    const u = new f.Mesh(this.geom, this.material);
+    if (this.sceneWebcam.add(u), this.cameraWebcam = new f.OrthographicCamera(
       -0.5,
       0.5,
       0.5,
@@ -124,21 +276,21 @@ class E {
       0,
       10
     ), navigator.mediaDevices && navigator.mediaDevices.getUserMedia) {
-      const r = {
+      const g = {
         video: {
           width: (i == null ? void 0 : i.width) || 1280,
           height: (i == null ? void 0 : i.height) || 720,
           facingMode: "environment"
         }
       };
-      navigator.mediaDevices.getUserMedia(r).then((c) => {
-        console.log("using the webcam successfully..."), n.srcObject = c, n.play();
-      }).catch((c) => {
+      navigator.mediaDevices.getUserMedia(g).then((w) => {
+        console.log("using the webcam successfully..."), o.srcObject = w, o.play();
+      }).catch((w) => {
         setTimeout(() => {
           alert(
             `Webcam Error
-Name: ` + c.name + `
-Message: ` + c.message
+Name: ` + w.name + `
+Message: ` + w.message
           );
         }, 1e3);
       });
@@ -147,67 +299,241 @@ Message: ` + c.message
         alert("sorry - media devices API not supported");
       }, 1e3);
   }
+  /**
+   * Update the webcam.
+   * Should be called from your Three.js rendering (animation) function.
+   */
   update() {
     this.renderer.clear(), this.renderer.render(this.sceneWebcam, this.cameraWebcam), this.renderer.clearDepth();
   }
+  /**
+   * Free up the memory associated with the webcam.
+   * Should be called when your application closes.
+   */
   dispose() {
     this.material.dispose(), this.texture.dispose(), this.geom.dispose();
   }
 }
-const p = new s.Vector3(0, 0, 1), m = new s.Euler(), M = new s.Quaternion(), f = new s.Quaternion(-Math.sqrt(0.5), 0, 0, Math.sqrt(0.5)), _ = { type: "change" };
-class y extends s.EventDispatcher {
-  constructor(e) {
-    super(), window.isSecureContext === !1 && console.error("THREE.DeviceOrientationControls: DeviceOrientationEvent is only available in secure contexts (https)");
-    const t = this, i = 1e-6, n = new s.Quaternion();
-    this.object = e, this.object.rotation.reorder("YXZ"), this.enabled = !0, this.deviceOrientation = {}, this.screenOrientation = 0, this.alphaOffset = 0, this.deviceOrientationEventName = "ondeviceorientationabsolute" in window ? "deviceorientationabsolute" : "deviceorientation";
-    const a = function(o) {
-      t.deviceOrientation = o;
-    }, r = function() {
-      t.screenOrientation = window.orientation || 0;
-    }, c = function(o, l, h, u, g) {
-      m.set(h, l, -u, "YXZ"), o.setFromEuler(m), o.multiply(f), o.multiply(M.setFromAxisAngle(p, -g));
+const k = navigator.userAgent.match(/iPhone|iPad|iPod/i), $ = new Z(0, 0, 1), z = new N(), J = new _(), tt = new _(-Math.sqrt(0.5), 0, 0, Math.sqrt(0.5)), et = { type: "change" };
+class at extends B {
+  /**
+   * Create an instance of DeviceOrientationControls.
+   * @param {Object} object - the object to attach the controls to
+   * (usually your Three.js camera)
+   */
+  constructor(t) {
+    super(), window.isSecureContext === !1 && console.error(
+      "THREE.DeviceOrientationControls: DeviceOrientationEvent is only available in secure contexts (https)"
+    );
+    const e = this, i = 1e-6, o = new _();
+    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 = 1;
+    const u = function({
+      alpha: s,
+      beta: c,
+      gamma: h,
+      webkitCompassHeading: a
+    }) {
+      if (k) {
+        const l = 360 - a;
+        e.alphaOffset = D.degToRad(l - s), e.deviceOrientation = { alpha: s, beta: c, gamma: h, webkitCompassHeading: a };
+      } else
+        s < 0 && (s += 360), e.deviceOrientation = { alpha: s, beta: c, gamma: h };
+      window.dispatchEvent(
+        new CustomEvent("camera-rotation-change", {
+          detail: { cameraRotation: t.rotation }
+        })
+      );
+    }, g = function() {
+      e.screenOrientation = window.orientation || 0;
+    }, w = function(s, c, h, a, l) {
+      z.set(h, c, -a, "YXZ"), s.setFromEuler(z), s.multiply(tt), s.multiply(J.setFromAxisAngle($, -l));
     };
     this.connect = function() {
-      r(), window.DeviceOrientationEvent !== void 0 && typeof window.DeviceOrientationEvent.requestPermission == "function" ? window.DeviceOrientationEvent.requestPermission().then(function(o) {
-        o == "granted" && (window.addEventListener("orientationchange", r), window.addEventListener(t.deviceOrientationEventName, a));
-      }).catch(function(o) {
-        console.error("THREE.DeviceOrientationControls: Unable to use DeviceOrientation API:", o);
-      }) : (window.addEventListener("orientationchange", r), window.addEventListener(t.deviceOrientationEventName, a)), t.enabled = !0;
+      g(), window.DeviceOrientationEvent !== void 0 && typeof window.DeviceOrientationEvent.requestPermission == "function" ? window.DeviceOrientationEvent.requestPermission().then((s) => {
+        s === "granted" && (window.addEventListener(
+          "orientationchange",
+          g
+        ), window.addEventListener(
+          e.orientationChangeEventName,
+          u
+        ));
+      }).catch(function(s) {
+        console.error(
+          "THREE.DeviceOrientationControls: Unable to use DeviceOrientation API:",
+          s
+        );
+      }) : (window.addEventListener(
+        "orientationchange",
+        g
+      ), window.addEventListener(
+        e.orientationChangeEventName,
+        u
+      )), e.enabled = !0;
     }, this.disconnect = function() {
-      window.removeEventListener("orientationchange", r), window.removeEventListener(t.deviceOrientationEventName, a), t.enabled = !1;
-    }, this.update = function() {
-      if (t.enabled === !1) return;
-      const o = t.deviceOrientation;
-      if (o) {
-        const l = o.alpha ? s.MathUtils.degToRad(o.alpha) + t.alphaOffset : 0, h = o.beta ? s.MathUtils.degToRad(o.beta) : 0, u = o.gamma ? s.MathUtils.degToRad(o.gamma) : 0, g = t.screenOrientation ? s.MathUtils.degToRad(t.screenOrientation) : 0;
-        c(t.object.quaternion, l, h, u, g), 8 * (1 - n.dot(t.object.quaternion)) > i && (n.copy(t.object.quaternion), t.dispatchEvent(_));
+      window.removeEventListener(
+        "orientationchange",
+        g
+      ), window.removeEventListener(
+        e.orientationChangeEventName,
+        u
+      ), e.enabled = !1, e.initialOffset = !1, e.deviceOrientation = null;
+    }, this.update = function({ theta: s = 0 } = { theta: 0 }) {
+      if (e.enabled === !1) return;
+      const c = e.deviceOrientation;
+      if (c) {
+        let h = c.alpha ? D.degToRad(c.alpha) + e.alphaOffset : 0, a = c.beta ? D.degToRad(c.beta) : 0, l = c.gamma ? D.degToRad(c.gamma) : 0;
+        const H = e.screenOrientation ? D.degToRad(e.screenOrientation) : 0;
+        if (k) {
+          const y = new _();
+          w(y, h, a, l, H);
+          const M = new N().setFromQuaternion(
+            y,
+            "YXZ"
+          );
+          console.log(M.x, M.y, M.z), M.y = D.degToRad(
+            360 - c.webkitCompassHeading
+          ), y.setFromEuler(M), e.object.quaternion.copy(y);
+        } else {
+          if (this.smoothingFactor < 1) {
+            if (this.lastOrientation) {
+              const y = this.smoothingFactor;
+              h = this._getSmoothedAngle(
+                h,
+                this.lastOrientation.alpha,
+                y
+              ), a = this._getSmoothedAngle(
+                a + Math.PI,
+                this.lastOrientation.beta,
+                y
+              ), l = this._getSmoothedAngle(
+                l + this.HALF_PI,
+                this.lastOrientation.gamma,
+                y,
+                Math.PI
+              );
+            } else
+              a += Math.PI, l += this.HALF_PI;
+            this.lastOrientation = {
+              alpha: h,
+              beta: a,
+              gamma: l
+            };
+          }
+          w(
+            e.object.quaternion,
+            h + s,
+            this.smoothingFactor < 1 ? a - Math.PI : a,
+            this.smoothingFactor < 1 ? l - this.HALF_PI : l,
+            H
+          );
+        }
+        8 * (1 - o.dot(e.object.quaternion)) > i && (o.copy(e.object.quaternion), e.dispatchEvent(et));
       }
+    }, this._orderAngle = function(s, c, h = this.TWO_PI) {
+      return c > s && Math.abs(c - s) < h / 2 || s > c && Math.abs(c - s) > h / 2 ? { left: s, right: c } : { left: c, right: s };
+    }, this._getSmoothedAngle = function(s, c, h, a = this.TWO_PI) {
+      const l = this._orderAngle(s, c, a), H = l.left, y = l.right;
+      l.left = 0, l.right -= H, l.right < 0 && (l.right += a);
+      let M = y == c ? (1 - h) * l.right + h * l.left : h * l.right + (1 - h) * l.left;
+      return M += H, M >= a && (M -= a), M;
+    }, this.updateAlphaOffset = function() {
+      e.initialOffset = !1;
     }, this.dispose = function() {
-      t.disconnect();
-    }, this.connect();
+      e.disconnect();
+    }, this.getAlpha = function() {
+      const { deviceOrientation: s } = e;
+      return s && s.alpha ? D.degToRad(s.alpha) + e.alphaOffset : 0;
+    }, this.getBeta = function() {
+      const { deviceOrientation: s } = e;
+      return s && s.beta ? D.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"), e = document.createElement("div"), i = document.createElement("div"), o = document.createElement("div");
+    document.body.appendChild(t);
+    const u = {
+      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"
+    }, w = {
+      width: "100%",
+      height: "70%",
+      display: "flex",
+      justifyContent: "center",
+      alignItems: "center"
+    }, s = {
+      display: "inline-flex",
+      width: "100%",
+      height: "30%",
+      justifyContent: "center",
+      alignItems: "center"
+    };
+    for (let a in u)
+      t.style[a] = u[a];
+    for (let a in g)
+      e.style[a] = g[a];
+    for (let a in w)
+      i.style[a] = w[a];
+    for (let a in s)
+      o.style[a] = s[a];
+    t.appendChild(e), e.appendChild(i), e.appendChild(o), i.innerHTML = '<div style="font-size: 24pt; margin: 1rem;">This immersive website requires access to your device motion sensors.</div>';
+    const c = () => {
+      this.connect(), t.style.display = "none";
+    }, h = document.createElement("button");
+    h.addEventListener("click", c), h.style.width = "50%", h.style.height = "80%", h.style.fontSize = "20pt", h.appendChild(document.createTextNode("OK")), o.appendChild(h), document.body.appendChild(t);
   }
 }
-class P {
-  constructor(e) {
-    this.raycaster = new s.Raycaster(), this.normalisedMousePosition = new s.Vector2(null, null), e.domElement.addEventListener("click", (t) => {
+class rt {
+  /**
+   * Create a ClickHandler.
+   * @param {THREE.WebGLRenderer} - The Three.js renderer on which the click
+   * events will be handled.
+   */
+  constructor(t) {
+    this.raycaster = new f.Raycaster(), this.normalisedMousePosition = new f.Vector2(null, null), t.domElement.addEventListener("click", (e) => {
       this.normalisedMousePosition.set(
-        t.clientX / e.domElement.clientWidth * 2 - 1,
-        -(t.clientY / e.domElement.clientHeight * 2) + 1
+        e.clientX / t.domElement.clientWidth * 2 - 1,
+        -(e.clientY / t.domElement.clientHeight * 2) + 1
       );
     });
   }
-  raycast(e, t) {
+  /**
+   * Cast a ray into the scene to detect objects.
+   * @param {THREE.Camera} - The active Three.js camera, from which the ray
+   * will be cast.
+   * @param {THREE.Scene} - The active Three.js scene, which the ray will be
+   * cast into.
+   * @return {Array} - array of all intersected objects.
+   */
+  raycast(t, e) {
     if (this.normalisedMousePosition.x !== null && this.normalisedMousePosition.y !== null) {
-      this.raycaster.setFromCamera(this.normalisedMousePosition, e);
-      const i = this.raycaster.intersectObjects(t.children, !1);
+      this.raycaster.setFromCamera(this.normalisedMousePosition, t);
+      const i = this.raycaster.intersectObjects(e.children, !1);
       return this.normalisedMousePosition.set(null, null), i;
     }
     return [];
   }
 }
 export {
-  P as ClickHandler,
-  y as DeviceOrientationControls,
-  w as LocationBased,
-  E as WebcamRenderer
+  rt as ClickHandler,
+  at as DeviceOrientationControls,
+  st as LocationBased,
+  K as SphMercProjection,
+  ot as WebcamRenderer
 };

package/dist/locar.umd.js

@@ -1,3 +1,3 @@
-(function(r,h){typeof exports=="object"&&typeof module<"u"?h(exports,require("three")):typeof define=="function"&&define.amd?define(["exports","three"],h):(r=typeof globalThis<"u"?globalThis:r||self,h(r.locar={},r.THREE))})(this,function(r,h){"use strict";function v(c){const e=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(c){for(const t in c)if(t!=="default"){const i=Object.getOwnPropertyDescriptor(c,t);Object.defineProperty(e,t,i.get?i:{enumerable:!0,get:()=>c[t]})}}return e.default=c,Object.freeze(e)}const n=v(h);class M{constructor(){this.EARTH=4007501668e-2,this.HALF_EARTH=2003750834e-2}project(e,t){return[this.lonToSphMerc(e),this.latToSphMerc(t)]}unproject(e){return[this.sphMercToLon(e[0]),this.sphMercToLat(e[1])]}lonToSphMerc(e){return e/180*this.HALF_EARTH}latToSphMerc(e){var t=Math.log(Math.tan((90+e)*Math.PI/360))/(Math.PI/180);return t*this.HALF_EARTH/180}sphMercToLon(e){return e/this.HALF_EARTH*180}sphMercToLat(e){var t=e/this.HALF_EARTH*180;return t=180/Math.PI*(2*Math.atan(Math.exp(t*Math.PI/180))-Math.PI/2),t}getID(){return"epsg:3857"}}class _{constructor(e,t,i={}){this._scene=e,this._camera=t,this._proj=new M,this._eventHandlers={},this._lastCoords=null,this._gpsMinDistance=0,this._gpsMinAccuracy=100,this._watchPositionId=null,this.setGpsOptions(i),this.initialPosition=null}setProjection(e){this._proj=e}setGpsOptions(e={}){e.gpsMinDistance!==void 0&&(this._gpsMinDistance=e.gpsMinDistance),e.gpsMinAccuracy!==void 0&&(this._gpsMinAccuracy=e.gpsMinAccuracy)}startGps(){return this._watchPositionId===null?(this._watchPositionId=navigator.geolocation.watchPosition(e=>{this._gpsReceived(e)},e=>{this._eventHandlers.gpserror?this._eventHandlers.gpserror(e.code):alert(`GPS error: code ${e.code}`)},{enableHighAccuracy:!0}),!0):!1}stopGps(){return this._watchPositionId!==null?(navigator.geolocation.clearWatch(this._watchPositionId),this._watchPositionId=null,!0):!1}fakeGps(e,t,i=null,s=0){i!==null&&this.setElevation(i),this._gpsReceived({coords:{longitude:e,latitude:t,accuracy:s}})}lonLatToWorldCoords(e,t){const i=this._proj.project(e,t);if(this.initialPosition)i[0]-=this.initialPosition[0],i[1]-=this.initialPosition[1];else throw"No initial position determined";return[i[0],-i[1]]}add(e,t,i,s,a={}){e.properties=a,this.setWorldPosition(e,t,i,s),this._scene.add(e)}setWorldPosition(e,t,i,s){const a=this.lonLatToWorldCoords(t,i);s!==void 0&&(e.position.y=s),[e.position.x,e.position.z]=a}setElevation(e){this._camera.position.y=e}on(e,t){this._eventHandlers[e]=t}setWorldOrigin(e,t){this.initialPosition=this._proj.project(e,t)}_gpsReceived(e){let t=Number.MAX_VALUE;console.log(`_gpsReceived(): position ${e.coords.latitude},${e.coords.longitude}, accuracy ${e.coords.accuracy}, accuracy limit ${this._gpsMinAccuracy}`),e.coords.accuracy<=this._gpsMinAccuracy&&(this._lastCoords===null?this._lastCoords={latitude:e.coords.latitude,longitude:e.coords.longitude}:t=this._haversineDist(this._lastCoords,e.coords),t>=this._gpsMinDistance&&(this._lastCoords.longitude=e.coords.longitude,this._lastCoords.latitude=e.coords.latitude,this.initialPosition||this.setWorldOrigin(e.coords.longitude,e.coords.latitude),this.setWorldPosition(this._camera,e.coords.longitude,e.coords.latitude),this._eventHandlers.gpsupdate&&this._eventHandlers.gpsupdate(e,t)))}_haversineDist(e,t){const i=n.MathUtils.degToRad(t.longitude-e.longitude),s=n.MathUtils.degToRad(t.latitude-e.latitude),a=Math.sin(s/2)*Math.sin(s/2)+Math.cos(n.MathUtils.degToRad(e.latitude))*Math.cos(n.MathUtils.degToRad(t.latitude))*(Math.sin(i/2)*Math.sin(i/2));return 2*Math.atan2(Math.sqrt(a),Math.sqrt(1-a))*6371e3}}class w{constructor(e,t,i){this.renderer=e,this.renderer.autoClear=!1,this.sceneWebcam=new n.Scene;let s;t===void 0?(s=document.createElement("video"),s.setAttribute("autoplay",!0),s.setAttribute("playsinline",!0),s.style.display="none",document.body.appendChild(s)):s=document.querySelector(t),this.geom=new n.PlaneGeometry,this.texture=new n.VideoTexture(s),this.material=new n.MeshBasicMaterial({map:this.texture});const a=new n.Mesh(this.geom,this.material);if(this.sceneWebcam.add(a),this.cameraWebcam=new n.OrthographicCamera(-.5,.5,.5,-.5,0,10),navigator.mediaDevices&&navigator.mediaDevices.getUserMedia){const d={video:{width:(i==null?void 0:i.width)||1280,height:(i==null?void 0:i.height)||720,facingMode:"environment"}};navigator.mediaDevices.getUserMedia(d).then(l=>{console.log("using the webcam successfully..."),s.srcObject=l,s.play()}).catch(l=>{setTimeout(()=>{alert(`Webcam Error
-Name: `+l.name+`
-Message: `+l.message)},1e3)})}else setTimeout(()=>{alert("sorry - media devices API not supported")},1e3)}update(){this.renderer.clear(),this.renderer.render(this.sceneWebcam,this.cameraWebcam),this.renderer.clearDepth()}dispose(){this.material.dispose(),this.texture.dispose(),this.geom.dispose()}}const y=new n.Vector3(0,0,1),f=new n.Euler,E=new n.Quaternion,P=new n.Quaternion(-Math.sqrt(.5),0,0,Math.sqrt(.5)),b={type:"change"};class O extends n.EventDispatcher{constructor(e){super(),window.isSecureContext===!1&&console.error("THREE.DeviceOrientationControls: DeviceOrientationEvent is only available in secure contexts (https)");const t=this,i=1e-6,s=new n.Quaternion;this.object=e,this.object.rotation.reorder("YXZ"),this.enabled=!0,this.deviceOrientation={},this.screenOrientation=0,this.alphaOffset=0,this.deviceOrientationEventName="ondeviceorientationabsolute"in window?"deviceorientationabsolute":"deviceorientation";const a=function(o){t.deviceOrientation=o},d=function(){t.screenOrientation=window.orientation||0},l=function(o,u,g,m,p){f.set(g,u,-m,"YXZ"),o.setFromEuler(f),o.multiply(P),o.multiply(E.setFromAxisAngle(y,-p))};this.connect=function(){d(),window.DeviceOrientationEvent!==void 0&&typeof window.DeviceOrientationEvent.requestPermission=="function"?window.DeviceOrientationEvent.requestPermission().then(function(o){o=="granted"&&(window.addEventListener("orientationchange",d),window.addEventListener(t.deviceOrientationEventName,a))}).catch(function(o){console.error("THREE.DeviceOrientationControls: Unable to use DeviceOrientation API:",o)}):(window.addEventListener("orientationchange",d),window.addEventListener(t.deviceOrientationEventName,a)),t.enabled=!0},this.disconnect=function(){window.removeEventListener("orientationchange",d),window.removeEventListener(t.deviceOrientationEventName,a),t.enabled=!1},this.update=function(){if(t.enabled===!1)return;const o=t.deviceOrientation;if(o){const u=o.alpha?n.MathUtils.degToRad(o.alpha)+t.alphaOffset:0,g=o.beta?n.MathUtils.degToRad(o.beta):0,m=o.gamma?n.MathUtils.degToRad(o.gamma):0,p=t.screenOrientation?n.MathUtils.degToRad(t.screenOrientation):0;l(t.object.quaternion,u,g,m,p),8*(1-s.dot(t.object.quaternion))>i&&(s.copy(t.object.quaternion),t.dispatchEvent(b))}},this.dispose=function(){t.disconnect()},this.connect()}}class T{constructor(e){this.raycaster=new n.Raycaster,this.normalisedMousePosition=new n.Vector2(null,null),e.domElement.addEventListener("click",t=>{this.normalisedMousePosition.set(t.clientX/e.domElement.clientWidth*2-1,-(t.clientY/e.domElement.clientHeight*2)+1)})}raycast(e,t){if(this.normalisedMousePosition.x!==null&&this.normalisedMousePosition.y!==null){this.raycaster.setFromCamera(this.normalisedMousePosition,e);const i=this.raycaster.intersectObjects(t.children,!1);return this.normalisedMousePosition.set(null,null),i}return[]}}r.ClickHandler=T,r.DeviceOrientationControls=O,r.LocationBased=_,r.WebcamRenderer=w,Object.defineProperty(r,Symbol.toStringTag,{value:"Module"})});
+(function(a,i){typeof exports=="object"&&typeof module<"u"?i(exports,require("three")):typeof define=="function"&&define.amd?define(["exports","three"],i):(a=typeof globalThis<"u"?globalThis:a||self,i(a.locar={},a.THREE))})(this,function(a,i){"use strict";var H=a=>{throw TypeError(a)};var U=(a,i,f)=>i.has(a)||H("Cannot "+f);var n=(a,i,f)=>(U(a,i,"read from private field"),f?f.call(a):i.get(a)),v=(a,i,f)=>i.has(a)?H("Cannot add the same private member more than once"):i instanceof WeakSet?i.add(a):i.set(a,f),u=(a,i,f,m)=>(U(a,i,"write to private field"),m?m.call(a,f):i.set(a,f),f),y=(a,i,f)=>(U(a,i,"access private method"),f);var N=(a,i,f,m)=>({set _(W){u(a,i,W,f)},get _(){return n(a,i,m)}});var w,Q,G,X,B,S,I,_,j,x,L,O,T,E,P,M,q,V,R,Y;function f(b){const t=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(b){for(const e in b)if(e!=="default"){const s=Object.getOwnPropertyDescriptor(b,e);Object.defineProperty(t,e,s.get?s:{enumerable:!0,get:()=>b[e]})}}return t.default=b,Object.freeze(t)}const m=f(i);class W{constructor(){v(this,w);this.EARTH=4007501668e-2,this.HALF_EARTH=2003750834e-2}project(t,e){return[y(this,w,Q).call(this,t),y(this,w,G).call(this,e)]}unproject(t){return[y(this,w,X).call(this,t[0]),y(this,w,B).call(this,t[1])]}getID(){return"epsg:3857"}}w=new WeakSet,Q=function(t){return t/180*this.HALF_EARTH},G=function(t){var e=Math.log(Math.tan((90+t)*Math.PI/360))/(Math.PI/180);return e*this.HALF_EARTH/180},X=function(t){return t/this.HALF_EARTH*180},B=function(t){var e=t/this.HALF_EARTH*180;return e=180/Math.PI*(2*Math.atan(Math.exp(e*Math.PI/180))-Math.PI/2),e};class Z{constructor(t,e,s={},r=null){v(this,M);v(this,S);v(this,I);v(this,_);v(this,j);v(this,x);v(this,L);v(this,O);v(this,T);v(this,E);v(this,P);this.scene=t,this.camera=e,u(this,S,new W),u(this,I,{}),u(this,_,null),u(this,j,0),u(this,x,100),u(this,L,null),this.setGpsOptions(s),u(this,O,null),u(this,T,0),u(this,E,0),u(this,P,r)}setProjection(t){u(this,S,t)}setGpsOptions(t={}){t.gpsMinDistance!==void 0&&u(this,j,t.gpsMinDistance),t.gpsMinAccuracy!==void 0&&u(this,x,t.gpsMinAccuracy)}async startGps(){if(n(this,P)){const e=await(await n(this,P).sendData("/gps/start",{gpsMinDistance:n(this,j),gpsMinAccuracy:n(this,x)})).json();u(this,E,e.session)}return n(this,L)===null?(u(this,L,navigator.geolocation.watchPosition(t=>{y(this,M,R).call(this,t)},t=>{n(this,I).gpserror?n(this,I).gpserror(t.code):alert(`GPS error: code ${t.code}`)},{enableHighAccuracy:!0})),!0):!1}stopGps(){return n(this,L)!==null?(navigator.geolocation.clearWatch(n(this,L)),u(this,L,null),!0):!1}fakeGps(t,e,s=null,r=0){s!==null&&this.setElevation(s),y(this,M,R).call(this,{coords:{longitude:t,latitude:e,accuracy:r}})}lonLatToWorldCoords(t,e){const s=n(this,S).project(t,e);if(n(this,O))s[0]-=n(this,O)[0],s[1]-=n(this,O)[1];else throw"No initial position determined";return[s[0],-s[1]]}add(t,e,s,r,g={}){var p;t.properties=g,y(this,M,q).call(this,t,e,s,r),this.scene.add(t),(p=n(this,P))==null||p.sendData("/object/new",{position:t.position,x:t.position.x,z:t.position.z,session:n(this,E),properties:g})}setElevation(t){this.camera.position.y=t}on(t,e){n(this,I)[t]=e}}S=new WeakMap,I=new WeakMap,_=new WeakMap,j=new WeakMap,x=new WeakMap,L=new WeakMap,O=new WeakMap,T=new WeakMap,E=new WeakMap,P=new WeakMap,M=new WeakSet,q=function(t,e,s,r){const g=this.lonLatToWorldCoords(e,s);r!==void 0&&(t.position.y=r),[t.position.x,t.position.z]=g},V=function(t,e){u(this,O,n(this,S).project(t,e))},R=function(t){var s,r,g;let e=Number.MAX_VALUE;N(this,T)._++,(s=n(this,P))==null||s.sendData("/gps/new",{gpsCount:n(this,T),lat:t.coords.latitude,lon:t.coords.longitude,acc:t.coords.accuracy,session:n(this,E)}),t.coords.accuracy<=n(this,x)&&(n(this,_)===null?u(this,_,{latitude:t.coords.latitude,longitude:t.coords.longitude}):e=y(this,M,Y).call(this,n(this,_),t.coords),e>=n(this,j)&&(n(this,_).longitude=t.coords.longitude,n(this,_).latitude=t.coords.latitude,n(this,O)||(y(this,M,V).call(this,t.coords.longitude,t.coords.latitude),(r=n(this,P))==null||r.sendData("/worldorigin/new",{gpsCount:n(this,T),lat:t.coords.latitude,lon:t.coords.longitude,session:n(this,E),initialPosition:n(this,O)})),y(this,M,q).call(this,this.camera,t.coords.longitude,t.coords.latitude),(g=n(this,P))==null||g.sendData("/gps/accepted",{gpsCount:n(this,T),cameraX:this.camera.position.x,cameraZ:this.camera.position.z,session:n(this,E),distMoved:e}),n(this,I).gpsupdate&&n(this,I).gpsupdate(t,e)))},Y=function(t,e){const s=m.MathUtils.degToRad(e.longitude-t.longitude),r=m.MathUtils.degToRad(e.latitude-t.latitude),g=Math.sin(r/2)*Math.sin(r/2)+Math.cos(m.MathUtils.degToRad(t.latitude))*Math.cos(m.MathUtils.degToRad(e.latitude))*(Math.sin(s/2)*Math.sin(s/2));return 2*Math.atan2(Math.sqrt(g),Math.sqrt(1-g))*6371e3};class K{constructor(t,e,s){this.renderer=t,this.renderer.autoClear=!1,this.sceneWebcam=new m.Scene;let r;e?r=document.querySelector(e):(r=document.createElement("video"),r.setAttribute("autoplay",!0),r.setAttribute("playsinline",!0),r.style.display="none",document.body.appendChild(r)),this.geom=new m.PlaneGeometry,this.texture=new m.VideoTexture(r),this.material=new m.MeshBasicMaterial({map:this.texture});const g=new m.Mesh(this.geom,this.material);if(this.sceneWebcam.add(g),this.cameraWebcam=new m.OrthographicCamera(-.5,.5,.5,-.5,0,10),navigator.mediaDevices&&navigator.mediaDevices.getUserMedia){const p={video:{width:(s==null?void 0:s.width)||1280,height:(s==null?void 0:s.height)||720,facingMode:"environment"}};navigator.mediaDevices.getUserMedia(p).then(C=>{console.log("using the webcam successfully..."),r.srcObject=C,r.play()}).catch(C=>{setTimeout(()=>{alert(`Webcam Error
+Name: `+C.name+`
+Message: `+C.message)},1e3)})}else setTimeout(()=>{alert("sorry - media devices API not supported")},1e3)}update(){this.renderer.clear(),this.renderer.render(this.sceneWebcam,this.cameraWebcam),this.renderer.clearDepth()}dispose(){this.material.dispose(),this.texture.dispose(),this.geom.dispose()}}const k=navigator.userAgent.match(/iPhone|iPad|iPod/i),$=new i.Vector3(0,0,1),z=new i.Euler,J=new i.Quaternion,tt=new i.Quaternion(-Math.sqrt(.5),0,0,Math.sqrt(.5)),et={type:"change"};class it extends i.EventDispatcher{constructor(t){super(),window.isSecureContext===!1&&console.error("THREE.DeviceOrientationControls: DeviceOrientationEvent is only available in secure contexts (https)");const e=this,s=1e-6,r=new i.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=1;const g=function({alpha:o,beta:h,gamma:l,webkitCompassHeading:c}){if(k){const d=360-c;e.alphaOffset=i.MathUtils.degToRad(d-o),e.deviceOrientation={alpha:o,beta:h,gamma:l,webkitCompassHeading:c}}else o<0&&(o+=360),e.deviceOrientation={alpha:o,beta:h,gamma:l};window.dispatchEvent(new CustomEvent("camera-rotation-change",{detail:{cameraRotation:t.rotation}}))},p=function(){e.screenOrientation=window.orientation||0},C=function(o,h,l,c,d){z.set(l,h,-c,"YXZ"),o.setFromEuler(z),o.multiply(tt),o.multiply(J.setFromAxisAngle($,-d))};this.connect=function(){p(),window.DeviceOrientationEvent!==void 0&&typeof window.DeviceOrientationEvent.requestPermission=="function"?window.DeviceOrientationEvent.requestPermission().then(o=>{o==="granted"&&(window.addEventListener("orientationchange",p),window.addEventListener(e.orientationChangeEventName,g))}).catch(function(o){console.error("THREE.DeviceOrientationControls: Unable to use DeviceOrientation API:",o)}):(window.addEventListener("orientationchange",p),window.addEventListener(e.orientationChangeEventName,g)),e.enabled=!0},this.disconnect=function(){window.removeEventListener("orientationchange",p),window.removeEventListener(e.orientationChangeEventName,g),e.enabled=!1,e.initialOffset=!1,e.deviceOrientation=null},this.update=function({theta:o=0}={theta:0}){if(e.enabled===!1)return;const h=e.deviceOrientation;if(h){let l=h.alpha?i.MathUtils.degToRad(h.alpha)+e.alphaOffset:0,c=h.beta?i.MathUtils.degToRad(h.beta):0,d=h.gamma?i.MathUtils.degToRad(h.gamma):0;const F=e.screenOrientation?i.MathUtils.degToRad(e.screenOrientation):0;if(k){const A=new i.Quaternion;C(A,l,c,d,F);const D=new i.Euler().setFromQuaternion(A,"YXZ");console.log(D.x,D.y,D.z),D.y=i.MathUtils.degToRad(360-h.webkitCompassHeading),A.setFromEuler(D),e.object.quaternion.copy(A)}else{if(this.smoothingFactor<1){if(this.lastOrientation){const A=this.smoothingFactor;l=this._getSmoothedAngle(l,this.lastOrientation.alpha,A),c=this._getSmoothedAngle(c+Math.PI,this.lastOrientation.beta,A),d=this._getSmoothedAngle(d+this.HALF_PI,this.lastOrientation.gamma,A,Math.PI)}else c+=Math.PI,d+=this.HALF_PI;this.lastOrientation={alpha:l,beta:c,gamma:d}}C(e.object.quaternion,l+o,this.smoothingFactor<1?c-Math.PI:c,this.smoothingFactor<1?d-this.HALF_PI:d,F)}8*(1-r.dot(e.object.quaternion))>s&&(r.copy(e.object.quaternion),e.dispatchEvent(et))}},this._orderAngle=function(o,h,l=this.TWO_PI){return h>o&&Math.abs(h-o)<l/2||o>h&&Math.abs(h-o)>l/2?{left:o,right:h}:{left:h,right:o}},this._getSmoothedAngle=function(o,h,l,c=this.TWO_PI){const d=this._orderAngle(o,h,c),F=d.left,A=d.right;d.left=0,d.right-=F,d.right<0&&(d.right+=c);let D=A==h?(1-l)*d.right+l*d.left:l*d.right+(1-l)*d.left;return D+=F,D>=c&&(D-=c),D},this.updateAlphaOffset=function(){e.initialOffset=!1},this.dispose=function(){e.disconnect()},this.getAlpha=function(){const{deviceOrientation:o}=e;return o&&o.alpha?i.MathUtils.degToRad(o.alpha)+e.alphaOffset:0},this.getBeta=function(){const{deviceOrientation:o}=e;return o&&o.beta?i.MathUtils.degToRad(o.beta):0},window.DeviceOrientationEvent!==void 0&&typeof window.DeviceOrientationEvent.requestPermission=="function"?this.initPermissionDialog():this.connect()}initPermissionDialog(){const t=document.createElement("div"),e=document.createElement("div"),s=document.createElement("div"),r=document.createElement("div");document.body.appendChild(t);const g={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"},C={width:"100%",height:"70%",display:"flex",justifyContent:"center",alignItems:"center"},o={display:"inline-flex",width:"100%",height:"30%",justifyContent:"center",alignItems:"center"};for(let c in g)t.style[c]=g[c];for(let c in p)e.style[c]=p[c];for(let c in C)s.style[c]=C[c];for(let c in o)r.style[c]=o[c];t.appendChild(e),e.appendChild(s),e.appendChild(r),s.innerHTML='<div style="font-size: 24pt; margin: 1rem;">This immersive website requires access to your device motion sensors.</div>';const h=()=>{this.connect(),t.style.display="none"},l=document.createElement("button");l.addEventListener("click",h),l.style.width="50%",l.style.height="80%",l.style.fontSize="20pt",l.appendChild(document.createTextNode("OK")),r.appendChild(l),document.body.appendChild(t)}}class nt{constructor(t){this.raycaster=new m.Raycaster,this.normalisedMousePosition=new m.Vector2(null,null),t.domElement.addEventListener("click",e=>{this.normalisedMousePosition.set(e.clientX/t.domElement.clientWidth*2-1,-(e.clientY/t.domElement.clientHeight*2)+1)})}raycast(t,e){if(this.normalisedMousePosition.x!==null&&this.normalisedMousePosition.y!==null){this.raycaster.setFromCamera(this.normalisedMousePosition,t);const s=this.raycaster.intersectObjects(e.children,!1);return this.normalisedMousePosition.set(null,null),s}return[]}}a.ClickHandler=nt,a.DeviceOrientationControls=it,a.LocationBased=Z,a.SphMercProjection=W,a.WebcamRenderer=K,Object.defineProperty(a,Symbol.toStringTag,{value:"Module"})});

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "locar",
-  "version": "0.0.3",
+  "version": "0.0.7",
   "description": "Location-based AR from AR.js.",
   "files": [
     "dist"
@@ -14,9 +14,11 @@
     }
   },
   "scripts": {
-    "build": "vite build && npm pack"
+    "build": "vite build && npm pack",
+    "makedocs": "jsdoc -r lib -d docs/api"
   },
   "devDependencies": {
+    "jsdoc": "^4.0.4",
     "vite": "^5.4.8"
   }
 }