locar 0.2.2 → 0.2.4
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +1 -1
- package/dist/locar.es.js +375 -544
- package/dist/locar.umd.js +2 -2
- package/dist/three/app.d.ts +32 -0
- package/dist/three/click-handler.d.ts +25 -0
- package/dist/three/device-orientation-controls.d.ts +55 -0
- package/dist/three/event-emitter.d.ts +24 -0
- package/dist/three/locar.d.ts +112 -0
- package/dist/three/main.d.ts +9 -0
- package/dist/three/sphmerc-projection.d.ts +29 -0
- package/dist/three/webcam.d.ts +27 -0
- package/dist/types/locar.d.ts +89 -0
- package/package.json +11 -17
- package/dist/locar.d.ts +0 -375
package/dist/locar.d.ts
DELETED
|
@@ -1,375 +0,0 @@
|
|
|
1
|
-
import { EventDispatcher } from 'three';
|
|
2
|
-
import { Object3D } from 'three';
|
|
3
|
-
import { Quaternion } from 'three';
|
|
4
|
-
import * as THREE from 'three';
|
|
5
|
-
|
|
6
|
-
/** Application class to orchestrate the interaction between the individual LocAR classes and the Three.js camera, renderer and scene. */
|
|
7
|
-
export declare class App extends EventEmitter {
|
|
8
|
-
#private;
|
|
9
|
-
locar: LocAR;
|
|
10
|
-
camera: THREE.PerspectiveCamera;
|
|
11
|
-
renderer: THREE.WebGLRenderer;
|
|
12
|
-
scene: THREE.Scene;
|
|
13
|
-
webcam: Webcam;
|
|
14
|
-
deviceOrientationControls: DeviceOrientationControls | null;
|
|
15
|
-
cameraFeedDimensions: {
|
|
16
|
-
landWidth: number;
|
|
17
|
-
landHeight: number;
|
|
18
|
-
} | null; /** camera feed dimensions in LANDSCAPE */
|
|
19
|
-
origHfov: number;
|
|
20
|
-
/**
|
|
21
|
-
* Create an App object.
|
|
22
|
-
* @param {AppOptions} - Startup options.
|
|
23
|
-
*/
|
|
24
|
-
constructor({ cameraOptions, canvas, gpsOptions, videoConstraints, deviceOrientationOptions, serverLogger, projection }: AppOptions);
|
|
25
|
-
/**
|
|
26
|
-
* Start the app.
|
|
27
|
-
* Must be called after construction.
|
|
28
|
-
* @returns {Promise<LocAR>}
|
|
29
|
-
* Promise resolving with LocAR object. Rejects with object containing code and message.
|
|
30
|
-
*/
|
|
31
|
-
start(): Promise<LocAR>;
|
|
32
|
-
}
|
|
33
|
-
|
|
34
|
-
/** Options to pass into the App object. */
|
|
35
|
-
export declare interface AppOptions {
|
|
36
|
-
/** the three.js camera options to use - note however we specify horizontal, not vertical, field of view */
|
|
37
|
-
cameraOptions?: {
|
|
38
|
-
hFov: number;
|
|
39
|
-
near: number;
|
|
40
|
-
far: number;
|
|
41
|
-
};
|
|
42
|
-
/** the canvas to render the AR scene into (one will be created if omitted) */
|
|
43
|
-
canvas?: HTMLCanvasElement;
|
|
44
|
-
/** GPS options, see GpsOptions documentation for details */
|
|
45
|
-
gpsOptions?: GpsOptions;
|
|
46
|
-
/** Video constraints for Media Devices API */
|
|
47
|
-
videoConstraints?: {
|
|
48
|
-
video: {
|
|
49
|
-
facingMode: string;
|
|
50
|
-
};
|
|
51
|
-
};
|
|
52
|
-
/** Device orientation options for DeviceOrientationControls */
|
|
53
|
-
deviceOrientationOptions?: DeviceOrientationControlsOptions & {
|
|
54
|
-
enabled: boolean;
|
|
55
|
-
};
|
|
56
|
-
/** Projection to use (default: SphMercProjection) */
|
|
57
|
-
projection?: Projection;
|
|
58
|
-
/** Server logger to use - ensure you gain consent from the user if you are doing this, it's usually a Data Protection legal requirement */
|
|
59
|
-
serverLogger?: ServerLogger;
|
|
60
|
-
}
|
|
61
|
-
|
|
62
|
-
/**
|
|
63
|
-
* Class to handle object detection via mouse clicks/touch events
|
|
64
|
-
* and raycasting.
|
|
65
|
-
*/
|
|
66
|
-
export declare class ClickHandler {
|
|
67
|
-
raycaster: THREE.Raycaster;
|
|
68
|
-
normalisedMousePosition: THREE.Vector2 | null;
|
|
69
|
-
/**
|
|
70
|
-
* Create a ClickHandler.
|
|
71
|
-
* @param {THREE.WebGLRenderer} - The Three.js renderer on which the click
|
|
72
|
-
* events will be handled.
|
|
73
|
-
*/
|
|
74
|
-
constructor(renderer: THREE.WebGLRenderer);
|
|
75
|
-
/**
|
|
76
|
-
* Cast a ray into the scene to detect objects.
|
|
77
|
-
* @param {THREE.Camera} - The active Three.js camera, from which the ray
|
|
78
|
-
* will be cast.
|
|
79
|
-
* @param {THREE.Scene} - The active Three.js scene, which the ray will be
|
|
80
|
-
* cast into.
|
|
81
|
-
* @return {Array} - array of all intersected objects.
|
|
82
|
-
*/
|
|
83
|
-
raycast(camera: THREE.Camera, scene: THREE.Scene): THREE.Intersection[];
|
|
84
|
-
}
|
|
85
|
-
|
|
86
|
-
export declare class DeviceOrientationControls extends EventDispatcher {
|
|
87
|
-
eventEmitter: EventEmitter;
|
|
88
|
-
object: Object3D;
|
|
89
|
-
enabled: boolean;
|
|
90
|
-
deviceOrientation: {
|
|
91
|
-
alpha?: number;
|
|
92
|
-
beta?: number;
|
|
93
|
-
gamma?: number;
|
|
94
|
-
webkitCompassHeading?: number;
|
|
95
|
-
absolute?: boolean;
|
|
96
|
-
} | null;
|
|
97
|
-
screenOrientation: number;
|
|
98
|
-
alphaOffset: number;
|
|
99
|
-
orientationOffset: number;
|
|
100
|
-
initialOffset: boolean | null;
|
|
101
|
-
lastQuaternion: Quaternion | null;
|
|
102
|
-
orientationChangeEventName: "deviceorientation" | "deviceorientationabsolute";
|
|
103
|
-
smoothingFactor: number;
|
|
104
|
-
enablePermissionDialog: boolean;
|
|
105
|
-
enableInlineStyling: boolean;
|
|
106
|
-
preferConfirmDialog: boolean;
|
|
107
|
-
orientationChangeThreshold: number;
|
|
108
|
-
connect: () => void;
|
|
109
|
-
disconnect: () => void;
|
|
110
|
-
requestOrientationPermissions: () => void;
|
|
111
|
-
update: () => void;
|
|
112
|
-
getCorrectedHeading: () => number;
|
|
113
|
-
updateAlphaOffset: () => void;
|
|
114
|
-
dispose: () => void;
|
|
115
|
-
getAlpha: () => number;
|
|
116
|
-
getBeta: () => number;
|
|
117
|
-
getGamma: () => number;
|
|
118
|
-
createObtainPermissionGestureDialog: () => void;
|
|
119
|
-
obtainPermissionGesture: () => void;
|
|
120
|
-
/**
|
|
121
|
-
* Create an instance of DeviceOrientationControls.
|
|
122
|
-
* @param {Object} object - the object to attach the controls to
|
|
123
|
-
* (usually your Three.js camera)
|
|
124
|
-
* @param {Object} options - options for DeviceOrientationControls:
|
|
125
|
-
* currently accepts smoothingFactor (< 1), enablePermissionDialog, orientationChangeThreshold (radians)
|
|
126
|
-
*/
|
|
127
|
-
constructor(object: Object3D, options?: DeviceOrientationControlsOptions);
|
|
128
|
-
on(eventName: string, eventHandler: (event: any) => void): void;
|
|
129
|
-
/**
|
|
130
|
-
* Initialise device orientation controls.
|
|
131
|
-
* Should be called after you have created the DeviceOrientationControls
|
|
132
|
-
* object and set up the deviceorientationgranted and deviceorientationerror
|
|
133
|
-
* event handlers.
|
|
134
|
-
*/
|
|
135
|
-
init: () => void;
|
|
136
|
-
}
|
|
137
|
-
|
|
138
|
-
/** Options to pass into DeviceOrientationControls. */
|
|
139
|
-
export declare type DeviceOrientationControlsOptions = {
|
|
140
|
-
/** smoothingFactor - default 0.2. If too high, AR content movement will lag behind the sensors. If too low, the scene will be jittery. */
|
|
141
|
-
smoothingFactor?: number;
|
|
142
|
-
/** Movement threshold to detect an orientation change (radians). */
|
|
143
|
-
orientationChangeThreshold?: number;
|
|
144
|
-
/** On iOS, enable permission dialog to seek permission to use device orientation through a user gesture. Recommended to set to true */
|
|
145
|
-
enablePermissionDialog?: boolean;
|
|
146
|
-
/** Set iOS-look and feel styling for the permission dialog for device orientation */
|
|
147
|
-
enableStyling?: boolean;
|
|
148
|
-
/** Use a standard confirm dialog rather than a custom element to grant device orientation permissions */
|
|
149
|
-
preferConfirmDialog?: boolean;
|
|
150
|
-
};
|
|
151
|
-
|
|
152
|
-
/** Event emitted when there is an error with device orientation. */
|
|
153
|
-
export declare interface DeviceOrientationErrorEvent {
|
|
154
|
-
code: string;
|
|
155
|
-
message: string;
|
|
156
|
-
}
|
|
157
|
-
|
|
158
|
-
/** Event emitted when device orientation permission has been granted. */
|
|
159
|
-
export declare interface DeviceOrientationGrantedEvent {
|
|
160
|
-
target: DeviceOrientationControls;
|
|
161
|
-
}
|
|
162
|
-
|
|
163
|
-
/** Event emitter class to handle events. */
|
|
164
|
-
export declare class EventEmitter {
|
|
165
|
-
eventHandlers: Record<string, ((...args: any[]) => void)[]>;
|
|
166
|
-
constructor();
|
|
167
|
-
/**
|
|
168
|
-
* Add an event handler.
|
|
169
|
-
* @param {string} eventName - the event to handle.
|
|
170
|
-
* @param {Function} eventHandler - the event handler function.
|
|
171
|
-
*/
|
|
172
|
-
on: (eventName: string, eventHandler: (...args: any[]) => void) => void;
|
|
173
|
-
/**
|
|
174
|
-
* Emit an event.
|
|
175
|
-
* @param {string} eventName - the event to emit.
|
|
176
|
-
* @param ...params - parameters to pass to the event handlers.
|
|
177
|
-
*/
|
|
178
|
-
emit: (eventName: string, ...params: any[]) => void;
|
|
179
|
-
/**
|
|
180
|
-
* Remove an event handler.
|
|
181
|
-
* @param {string} eventName - the event to remove a handler from.
|
|
182
|
-
* @param {Function} eventHandler - the event handler function to remove.
|
|
183
|
-
*/
|
|
184
|
-
off: (eventName: string, eventHandler: (...args: any[]) => void) => void;
|
|
185
|
-
}
|
|
186
|
-
|
|
187
|
-
/** GPS intialisation options. */
|
|
188
|
-
export declare interface GpsOptions {
|
|
189
|
-
gpsMinDistance?: number;
|
|
190
|
-
gpsMinAccuracy?: number;
|
|
191
|
-
}
|
|
192
|
-
|
|
193
|
-
/** Event emitted when a GPS position is received. */
|
|
194
|
-
export declare interface GpsReceivedEvent {
|
|
195
|
-
/** The new GPS position */
|
|
196
|
-
position: GeolocationPosition;
|
|
197
|
-
/** distance moved in metres since last GpsReceivedEvent */
|
|
198
|
-
distMoved: number;
|
|
199
|
-
}
|
|
200
|
-
|
|
201
|
-
/** The main engine class for the LocAR.js system.
|
|
202
|
-
* Can be obtained either via App.start() - which resolves with a LocAR object - or on its own.
|
|
203
|
-
* If you use this class without App, you must set up the three.js scene yourself, as you did with locar.js 0.1.x.
|
|
204
|
-
*/
|
|
205
|
-
export declare class LocAR extends EventEmitter {
|
|
206
|
-
#private;
|
|
207
|
-
scene: THREE.Scene;
|
|
208
|
-
camera: THREE.Camera;
|
|
209
|
-
/**
|
|
210
|
-
* @param {THREE.Scene} scene - The Three.js scene to use.
|
|
211
|
-
* @param {THREE.Camera} camera - The Three.js camera to use. Should usually
|
|
212
|
-
* be a THREE.PerspectiveCamera.
|
|
213
|
-
* @param {Object} options - Initialisation options for the GPS; see
|
|
214
|
-
* setGpsOptions() below.
|
|
215
|
-
* @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.
|
|
216
|
-
*/
|
|
217
|
-
constructor(scene: THREE.Scene, camera: THREE.Camera, options?: GpsOptions, serverLogger?: ServerLogger | null, projection?: Projection);
|
|
218
|
-
/**
|
|
219
|
-
* Set the projection to use.
|
|
220
|
-
* @param {Object} any object which includes a project() method
|
|
221
|
-
* taking longitude and latitude as arguments and returning an array
|
|
222
|
-
* containing easting and northing.
|
|
223
|
-
*/
|
|
224
|
-
setProjection(proj: Projection): void;
|
|
225
|
-
/**
|
|
226
|
-
* Set the GPS options.
|
|
227
|
-
* @param {Object} object containing gpsMinDistance and/or gpsMinAccuracy
|
|
228
|
-
* properties. The former specifies the number of metres which the device
|
|
229
|
-
* must move to process a new GPS reading, and the latter specifies the
|
|
230
|
-
* minimum accuracy, in metres, for a GPS reading to be counted.
|
|
231
|
-
*/
|
|
232
|
-
setGpsOptions(options?: GpsOptions): void;
|
|
233
|
-
/**
|
|
234
|
-
* Start the GPS on a real device
|
|
235
|
-
* @return {boolean} code indicating whether the GPS was started successfully.
|
|
236
|
-
* GPS errors can be handled by handling the gpserror event.
|
|
237
|
-
*/
|
|
238
|
-
startGps(): Promise<boolean>;
|
|
239
|
-
/**
|
|
240
|
-
* Stop the GPS on a real device
|
|
241
|
-
* @return {boolean} true if the GPS was stopped, false if it could not be
|
|
242
|
-
* stopped (i.e. it was never started).
|
|
243
|
-
*/
|
|
244
|
-
stopGps(): boolean;
|
|
245
|
-
/**
|
|
246
|
-
* Send a fake GPS signal. Useful for testing on a desktop or laptop.
|
|
247
|
-
* @param {number} lon - The longitude.
|
|
248
|
-
* @param {number} lat - The latitude.
|
|
249
|
-
* @param {number} elev - The elevation in metres. (optional, set to null
|
|
250
|
-
* for no elevation).
|
|
251
|
-
* @param {number} acc - The accuracy of the GPS reading in metres. May be
|
|
252
|
-
* ignored if lower than the specified minimum accuracy.
|
|
253
|
-
*/
|
|
254
|
-
fakeGps(lon: number, lat: number, elev?: number | null, acc?: number): void;
|
|
255
|
-
/**
|
|
256
|
-
* Convert longitude and latitude to three.js/WebGL world coordinates.
|
|
257
|
-
* Uses the specified projection, and negates the northing (in typical
|
|
258
|
-
* projections, northings increase northwards, but in the WebGL coordinate
|
|
259
|
-
* system, we face negative z if the camera is at the origin with default
|
|
260
|
-
* rotation).
|
|
261
|
-
* Must not be called until an initial position is determined.
|
|
262
|
-
* @param {number} lon - The longitude.
|
|
263
|
-
* @param {number} lat - The latitude.
|
|
264
|
-
* @return {Array} a two member array containing the WebGL x and z coordinates
|
|
265
|
-
*/
|
|
266
|
-
lonLatToWorldCoords(lon: number, lat: number): number[];
|
|
267
|
-
/**
|
|
268
|
-
* Add a new AR object at a given latitude, longitude and elevation.
|
|
269
|
-
* @param {THREE.Mesh} object the object
|
|
270
|
-
* @param {number} lon - the longitude.
|
|
271
|
-
* @param {number} lat - the latitude.
|
|
272
|
-
* @param {number} elev - the elevation in metres
|
|
273
|
-
* (if not specified, 0 is assigned)
|
|
274
|
-
* @param {Object} properties - properties describing the object (for example,
|
|
275
|
-
* the contents of the GeoJSON properties field).
|
|
276
|
-
*/
|
|
277
|
-
add(object: THREE.Object3D, lon: number, lat: number, elev?: number | undefined, properties?: Record<string, any>): void;
|
|
278
|
-
addGeoLine(points: Array<[number, number, number?]>, material: THREE.Material, lineWidth?: number): THREE.Mesh;
|
|
279
|
-
/**
|
|
280
|
-
* Set the elevation (y coordinate) of the camera.
|
|
281
|
-
* @param {number} elev - the elevation in metres.
|
|
282
|
-
*/
|
|
283
|
-
setElevation(elev: number): void;
|
|
284
|
-
/**
|
|
285
|
-
* Calculate haversine distance between two lat/lon pairs.
|
|
286
|
-
*
|
|
287
|
-
* Taken from original A-Frame AR.js location-based components
|
|
288
|
-
*/
|
|
289
|
-
static haversineDist(src: LonLat, dest: LonLat): number;
|
|
290
|
-
/**
|
|
291
|
-
* Obtain the last known GPS location.
|
|
292
|
-
*
|
|
293
|
-
* @return {Object} object containing latitude and longitude fields, or null if no previous GPS location.
|
|
294
|
-
*/
|
|
295
|
-
getLastKnownLocation(): LonLat | null;
|
|
296
|
-
}
|
|
297
|
-
|
|
298
|
-
/** Longitude and latitude. */
|
|
299
|
-
export declare interface LonLat {
|
|
300
|
-
longitude: number;
|
|
301
|
-
latitude: number;
|
|
302
|
-
}
|
|
303
|
-
|
|
304
|
-
/** Projection interface, you can create your own custom projection by implementing project() and unproject(). */
|
|
305
|
-
export declare interface Projection {
|
|
306
|
-
project: (lon: number, lat: number) => [number, number];
|
|
307
|
-
unproject: (projected: [number, number]) => [number, number];
|
|
308
|
-
}
|
|
309
|
-
|
|
310
|
-
/** Server logger interface. */
|
|
311
|
-
export declare interface ServerLogger {
|
|
312
|
-
sendData(endpoint: string, data: any): Promise<Response> | Response;
|
|
313
|
-
}
|
|
314
|
-
|
|
315
|
-
export declare class SphMercProjection implements Projection {
|
|
316
|
-
#private;
|
|
317
|
-
EARTH: number;
|
|
318
|
-
HALF_EARTH: number;
|
|
319
|
-
/**
|
|
320
|
-
* Create a SphMercProjection.
|
|
321
|
-
*/
|
|
322
|
-
constructor();
|
|
323
|
-
/**
|
|
324
|
-
* Project a longitude and latitude into Spherical Mercator.
|
|
325
|
-
* @param {number} lon - the longitude.
|
|
326
|
-
* @param {number} lat - the latitude.
|
|
327
|
-
* @return {Array} Two-member array containing easting and northing.
|
|
328
|
-
*/
|
|
329
|
-
project: (lon: number, lat: number) => [number, number];
|
|
330
|
-
/**
|
|
331
|
-
* Unproject a Spherical Mercator easting and northing.
|
|
332
|
-
* @param {Array} projected - Two-member array containing easting and northing
|
|
333
|
-
* @return {Array} Two-member array containing longitude and latitude
|
|
334
|
-
*/
|
|
335
|
-
unproject: (projected: [number, number]) => [number, number];
|
|
336
|
-
/**
|
|
337
|
-
* Return the projection's ID.
|
|
338
|
-
* @return {string} The value "epsg:3857".
|
|
339
|
-
*/
|
|
340
|
-
getID: () => string;
|
|
341
|
-
}
|
|
342
|
-
|
|
343
|
-
/** Class to setup the webcam. */
|
|
344
|
-
export declare class Webcam extends EventEmitter {
|
|
345
|
-
#private;
|
|
346
|
-
sceneWebcam: THREE.Scene;
|
|
347
|
-
/**
|
|
348
|
-
* Create a Webcam.
|
|
349
|
-
* @param constraints {Object} - options to use for initialising the camera.
|
|
350
|
-
* This is the same constraints object as used by standard MediaDevices API.
|
|
351
|
-
* @param {string} videoElementSelector - selector to obtain the HTML video
|
|
352
|
-
* element to render the webcam feed. If a falsy value (e.g. null or
|
|
353
|
-
* undefined), a video element will be created.
|
|
354
|
-
*/
|
|
355
|
-
constructor(constraints?: {
|
|
356
|
-
video: {
|
|
357
|
-
facingMode: string;
|
|
358
|
-
};
|
|
359
|
-
}, videoElementSelector?: string);
|
|
360
|
-
getVideoDimensions(): string;
|
|
361
|
-
}
|
|
362
|
-
|
|
363
|
-
/** Event emitted when the webcam encounters an error. */
|
|
364
|
-
export declare interface WebcamErrorEvent {
|
|
365
|
-
code: string;
|
|
366
|
-
message: string;
|
|
367
|
-
}
|
|
368
|
-
|
|
369
|
-
/** Event emitted when the webcam starts. */
|
|
370
|
-
export declare interface WebcamStartedEvent {
|
|
371
|
-
videoWidth: number;
|
|
372
|
-
videoHeight: number;
|
|
373
|
-
}
|
|
374
|
-
|
|
375
|
-
export { }
|