Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More →
photo-sphere-viewer
Advanced tools
photo-sphere-viewer - npm Package Compare versions
Comparing version 4.5.3 to 4.6.0
| /*! | ||
| * Photo Sphere Viewer 4.5.3 | ||
| * Photo Sphere Viewer 4.6.0 | ||
| * @copyright 2014-2015 Jérémy Heleine | ||
@@ -298,2 +298,3 @@ * @copyright 2015-2022 Damien "Mistic" Sorel | ||
| * @memberof PSV.adapters | ||
| * @extends PSV.adapters.AbstractAdapter | ||
| */ | ||
@@ -300,0 +301,0 @@ |
| /*! | ||
| * Photo Sphere Viewer 4.5.3 | ||
| * Photo Sphere Viewer 4.6.0 | ||
| * @copyright 2014-2015 Jérémy Heleine | ||
@@ -70,2 +70,3 @@ * @copyright 2015-2022 Damien "Mistic" Sorel | ||
| * @memberof PSV.adapters | ||
| * @extends PSV.adapters.AbstractAdapter | ||
| */ | ||
@@ -72,0 +73,0 @@ |
| /*! | ||
| * Photo Sphere Viewer 4.5.3 | ||
| * Photo Sphere Viewer 4.6.0 | ||
| * @copyright 2014-2015 Jérémy Heleine | ||
@@ -320,2 +320,3 @@ * @copyright 2015-2022 Damien "Mistic" Sorel | ||
| * @memberof PSV.adapters | ||
| * @extends PSV.adapters.AbstractAdapter | ||
| */ | ||
@@ -510,3 +511,6 @@ | ||
| croppedX: 0, | ||
| croppedY: 0 | ||
| croppedY: 0, | ||
| poseHeading: 0, | ||
| posePitch: 0, | ||
| poseRoll: 0 | ||
| }; | ||
@@ -513,0 +517,0 @@ |
@@ -1,2 +0,2 @@ | ||
| import { Texture, Vector3, Euler, Mesh, Intersection } from 'three'; | ||
| import { Texture, Vector3, Euler, Intersection, Mesh } from 'three'; | ||
| import { EventEmitter, Event } from 'uevent'; | ||
@@ -164,7 +164,2 @@ | ||
| /** | ||
| * @summary Returns the key name of a KeyboardEvent | ||
| */ | ||
| declare function getEventKey(evt: KeyboardEvent): string; | ||
| /** | ||
| * @summary Detects if fullscreen is enabled | ||
@@ -273,2 +268,3 @@ */ | ||
| caption?: string; | ||
| description?: string; | ||
| transition?: boolean | number; | ||
@@ -470,2 +466,46 @@ showLoader?: boolean; | ||
| type AnimationOptions<T> = { | ||
| properties: { [key in keyof T]: { start: number, end: number } }; | ||
| duration: number; | ||
| delay?: number; | ||
| easing?: string | ((progress: number) => number); | ||
| onTick: (properties: { [key in keyof T]: number }, progress: number) => void; | ||
| }; | ||
| /** | ||
| * @summary Interpolation helper for animations | ||
| * @description | ||
| * Implements the Promise API with an additional "cancel" method. | ||
| * The promise is resolved when the animation is complete and rejected if the animation is cancelled. | ||
| */ | ||
| declare class Animation<T> implements PromiseLike<boolean> { | ||
| constructor(options: AnimationOptions<T>); | ||
| then<TResult = boolean>(onFulfilled?: ((completed: boolean) => TResult | PromiseLike<TResult>) | undefined | null): PromiseLike<TResult>; | ||
| cancel(); | ||
| /** | ||
| * @deprecated does not accept a rejection handler anymore | ||
| */ | ||
| then(onFulfilled?: (() => void | Animation<any> | PromiseLike<void>) | undefined | null, onRejected?: (() => void | Animation<any> | PromiseLike<void>) | undefined | null): Animation<unknown>; | ||
| /** | ||
| * @deprecated not supported anymore | ||
| */ | ||
| catch(onRejected?: (() => void | Animation<any> | PromiseLike<void>) | undefined | null): Animation<unknown>; | ||
| /** | ||
| * @deprecated not supported anymore | ||
| */ | ||
| finally(onFinally?: (() => void | Animation<any> | PromiseLike<void>) | undefined | null): Animation<unknown>; | ||
| /** | ||
| * @deprecated not supported anymore | ||
| */ | ||
| static resolve(): Animation<unknown>; | ||
| } | ||
| declare const index_d_toggleClass: typeof toggleClass; | ||
@@ -476,3 +516,2 @@ declare const index_d_addClasses: typeof addClasses; | ||
| declare const index_d_getClosest: typeof getClosest; | ||
| declare const index_d_getEventKey: typeof getEventKey; | ||
| declare const index_d_isFullscreenEnabled: typeof isFullscreenEnabled; | ||
@@ -509,2 +548,5 @@ declare const index_d_requestFullscreen: typeof requestFullscreen; | ||
| declare const index_d_applyEulerInverse: typeof applyEulerInverse; | ||
| type index_d_AnimationOptions<T> = AnimationOptions<T>; | ||
| type index_d_Animation<T> = Animation<T>; | ||
| declare const index_d_Animation: typeof Animation; | ||
| declare namespace index_d { | ||
@@ -517,3 +559,2 @@ export { | ||
| index_d_getClosest as getClosest, | ||
| index_d_getEventKey as getEventKey, | ||
| index_d_isFullscreenEnabled as isFullscreenEnabled, | ||
@@ -550,2 +591,4 @@ index_d_requestFullscreen as requestFullscreen, | ||
| index_d_applyEulerInverse as applyEulerInverse, | ||
| index_d_AnimationOptions as AnimationOptions, | ||
| index_d_Animation as Animation, | ||
| }; | ||
@@ -555,109 +598,2 @@ } | ||
| /** | ||
| * @summary Base adapters class | ||
| * @template T type of the panorama configuration object | ||
| */ | ||
| declare abstract class AbstractAdapter<T> { | ||
| /** | ||
| * @summary Unique identifier of the adapter | ||
| */ | ||
| static id: string; | ||
| /** | ||
| * @summary Indicates if the adapter supports panorama download natively | ||
| */ | ||
| static supportsDownload: boolean; | ||
| constructor(parent: Viewer); | ||
| /** | ||
| * @summary Destroys the adapter | ||
| */ | ||
| destroy(); | ||
| /** | ||
| * @summary Indicates if the adapter supports transitions between panoramas | ||
| */ | ||
| supportsTransition(panorama: T): boolean; | ||
| /** | ||
| * @summary Indicates if the adapter supports preload of a panorama | ||
| */ | ||
| supportsPreload(panorama: T): boolean; | ||
| /** | ||
| * @summary Loads the panorama texture(s) | ||
| */ | ||
| loadTexture(panorama: T, newPanoData?: PanoData | PanoDataProvider): Promise<TextureData>; | ||
| /** | ||
| * @summary Creates the cube mesh | ||
| * @param {number} [scale=1] | ||
| */ | ||
| createMesh(scale?: number): Mesh; | ||
| /** | ||
| * @summary Applies the texture to the mesh | ||
| */ | ||
| setTexture(mesh: Mesh, textureData: TextureData, transition?: boolean); | ||
| /** | ||
| * @summary Changes the opacity of the mesh | ||
| */ | ||
| setTextureOpacity(mesh: Mesh, opacity: number); | ||
| /** | ||
| * @abstract | ||
| */ | ||
| disposeTexture(textureData: TextureData); | ||
| } | ||
| type AdapterConstructor<T extends AbstractAdapter<any>> = new (psv: Viewer, options?: any) => T; | ||
| type AnimationOptions<T> = { | ||
| properties: { [key in keyof T]: { start: number, end: number } }; | ||
| duration: number; | ||
| delay?: number; | ||
| easing?: string | ((progress: number) => number); | ||
| onTick: (properties: { [key in keyof T]: number }, progress: number) => void; | ||
| }; | ||
| /** | ||
| * @summary Interpolation helper for animations | ||
| * @description | ||
| * Implements the Promise API with an additional "cancel" method. | ||
| * The promise is resolved when the animation is complete and rejected if the animation is cancelled. | ||
| */ | ||
| declare class Animation<T> implements PromiseLike<boolean> { | ||
| constructor(options: AnimationOptions<T>); | ||
| then<TResult = boolean>(onFulfilled?: ((completed: boolean) => TResult | PromiseLike<TResult>) | undefined | null): PromiseLike<TResult>; | ||
| cancel(); | ||
| /** | ||
| * @deprecated does not accept a rejection handler anymore | ||
| */ | ||
| then(onFulfilled?: (() => void | Animation<any> | PromiseLike<void>) | undefined | null, onRejected?: (() => void | Animation<any> | PromiseLike<void>) | undefined | null): Animation<unknown>; | ||
| /** | ||
| * @deprecated not supported anymore | ||
| */ | ||
| catch(onRejected?: (() => void | Animation<any> | PromiseLike<void>) | undefined | null): Animation<unknown>; | ||
| /** | ||
| * @deprecated not supported anymore | ||
| */ | ||
| finally(onFinally?: (() => void | Animation<any> | PromiseLike<void>) | undefined | null): Animation<unknown>; | ||
| /** | ||
| * @deprecated not supported anymore | ||
| */ | ||
| static resolve(): Animation<unknown>; | ||
| } | ||
| /** | ||
| * @summary Base component class | ||
@@ -715,2 +651,7 @@ */ | ||
| /** | ||
| * @summary Identifier to declare a group of buttons | ||
| */ | ||
| static groupId?: string; | ||
| /** | ||
| * @summary SVG icon name injected in the button | ||
@@ -792,2 +733,3 @@ */ | ||
| type NotificationOptions = { | ||
| id?: string; | ||
| content: string; | ||
@@ -1038,2 +980,3 @@ timeout?: number; | ||
| caption?: string; | ||
| description?: string; | ||
| downloadUrl?: string; | ||
@@ -1345,3 +1288,3 @@ loadingImg?: string; | ||
| */ | ||
| on(e: 'hide-notification', cb: (e: Event) => void): this; | ||
| on(e: 'hide-notification', cb: (e: Event, id: string | undefined) => void): this; | ||
| /** | ||
@@ -1356,2 +1299,6 @@ * @summary Triggered when the overlay is hidden | ||
| /** | ||
| * @summary Triggered when a key is pressed, can be cancelled | ||
| */ | ||
| on(e: 'key-press', cb: (e: Event, key: string) => void): this; | ||
| /** | ||
| * @summary Triggered when the loader value changes | ||
@@ -1367,3 +1314,3 @@ */ | ||
| */ | ||
| on(e: 'panorama-loaded', cb: (e: Event) => void): this; | ||
| on(e: 'panorama-loaded', cb: (e: Event, textureData: TextureData) => void): this; | ||
| /** | ||
@@ -1380,3 +1327,3 @@ * @summary Triggered when the view longitude and/or latitude changes | ||
| */ | ||
| on(e: 'show-notification', cb: (e: Event) => void): this; | ||
| on(e: 'show-notification', cb: (e: Event, id: string | undefined) => void): this; | ||
| /** | ||
@@ -1406,2 +1353,78 @@ * @summary Trigered when the overlay is shown | ||
| /** | ||
| * @summary Base adapters class | ||
| * @template T type of the panorama configuration object | ||
| */ | ||
| declare abstract class AbstractAdapter<T> { | ||
| /** | ||
| * @summary Unique identifier of the adapter | ||
| */ | ||
| static id: string; | ||
| /** | ||
| * @summary Indicates if the adapter supports panorama download natively | ||
| */ | ||
| static supportsDownload: boolean; | ||
| constructor(parent: Viewer); | ||
| /** | ||
| * @summary Destroys the adapter | ||
| */ | ||
| destroy(); | ||
| /** | ||
| * @summary Indicates if the adapter supports transitions between panoramas | ||
| */ | ||
| supportsTransition(panorama: T): boolean; | ||
| /** | ||
| * @summary Indicates if the adapter supports preload of a panorama | ||
| */ | ||
| supportsPreload(panorama: T): boolean; | ||
| /** | ||
| * @summary Loads the panorama texture(s) | ||
| */ | ||
| loadTexture(panorama: T, newPanoData?: PanoData | PanoDataProvider): Promise<TextureData>; | ||
| /** | ||
| * @summary Creates the cube mesh | ||
| * @param {number} [scale=1] | ||
| */ | ||
| createMesh(scale?: number): Mesh; | ||
| /** | ||
| * @summary Applies the texture to the mesh | ||
| */ | ||
| setTexture(mesh: Mesh, textureData: TextureData, transition?: boolean); | ||
| /** | ||
| * @summary Changes the opacity of the mesh | ||
| */ | ||
| setTextureOpacity(mesh: Mesh, opacity: number); | ||
| /** | ||
| * @summary Cleanup a loaded texture, used on load abort | ||
| */ | ||
| disposeTexture(textureData: TextureData); | ||
| } | ||
| type AdapterConstructor<T extends AbstractAdapter<any>> = new (psv: Viewer, options?: any) => T; | ||
| type EquirectangularAdapterOptions = { | ||
| resolution?: number, | ||
| }; | ||
| /** | ||
| * @summary Adapter for equirectangular panoramas | ||
| */ | ||
| declare class EquirectangularAdapter extends AbstractAdapter<string> { | ||
| constructor(psv: Viewer, options: EquirectangularAdapterOptions); | ||
| } | ||
| /** | ||
| * @summary Default options | ||
@@ -1425,16 +1448,3 @@ */ | ||
| type EquirectangularAdapterOptions = { | ||
| resolution?: number, | ||
| }; | ||
| /** | ||
| * @summary Adapter for equirectangular panoramas | ||
| */ | ||
| declare class EquirectangularAdapter extends AbstractAdapter<string> { | ||
| constructor(psv: Viewer, options: EquirectangularAdapterOptions); | ||
| } | ||
| /** | ||
| * @summary Custom error used in the lib | ||
@@ -1446,2 +1456,2 @@ */ | ||
| export { AbstractAdapter, AbstractButton, AbstractPlugin, AdapterConstructor, AnimateOptions, Animation, AnimationOptions, constants_d as CONSTANTS, ClickData, CssSize, DEFAULTS, DataHelper, EquirectangularAdapter, EquirectangularAdapterOptions, ExtendedPosition, Loader, Navbar, NavbarCustomButton, Notification, NotificationOptions, Overlay, OverlayOptions, PSVError, Panel, PanelOptions, PanoData, PanoDataProvider, PanoramaOptions, PluginConstructor, Point, Position, SYSTEM, Size, SphereCorrection, TextureData, TextureLoader, Tooltip, TooltipOptions, TooltipPosition, TooltipRenderer, Viewer, ViewerOptions, ViewerProps, registerButton, index_d as utils }; | ||
| export { AbstractAdapter, AbstractButton, AbstractComponent, AbstractPlugin, AdapterConstructor, AnimateOptions, Animation, AnimationOptions, constants_d as CONSTANTS, ClickData, CssSize, DEFAULTS, DataHelper, EquirectangularAdapter, EquirectangularAdapterOptions, ExtendedPosition, Loader, Navbar, NavbarCustomButton, Notification, NotificationOptions, Overlay, OverlayOptions, PSVError, Panel, PanelOptions, PanoData, PanoDataProvider, PanoramaOptions, PluginConstructor, Point, Position, SYSTEM, Size, SphereCorrection, TextureData, TextureLoader, Tooltip, TooltipOptions, TooltipPosition, TooltipRenderer, Viewer, ViewerOptions, ViewerProps, registerButton, index_d as utils }; |
| /*! | ||
| * Photo Sphere Viewer 4.5.3 | ||
| * Photo Sphere Viewer 4.6.0 | ||
| * @copyright 2014-2015 Jérémy Heleine | ||
@@ -8,6 +8,6 @@ * @copyright 2015-2022 Damien "Mistic" Sorel | ||
| (function (global, factory) { | ||
| typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('photo-sphere-viewer')) : | ||
| typeof define === 'function' && define.amd ? define(['exports', 'photo-sphere-viewer'], factory) : | ||
| (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory((global.PhotoSphereViewer = global.PhotoSphereViewer || {}, global.PhotoSphereViewer.AutorotateKeypointsPlugin = {}), global.PhotoSphereViewer)); | ||
| })(this, (function (exports, photoSphereViewer) { 'use strict'; | ||
| typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('three'), require('photo-sphere-viewer')) : | ||
| typeof define === 'function' && define.amd ? define(['exports', 'three', 'photo-sphere-viewer'], factory) : | ||
| (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory((global.PhotoSphereViewer = global.PhotoSphereViewer || {}, global.PhotoSphereViewer.AutorotateKeypointsPlugin = {}), global.THREE, global.PhotoSphereViewer)); | ||
| })(this, (function (exports, THREE, photoSphereViewer) { 'use strict'; | ||
@@ -49,14 +49,18 @@ function _extends() { | ||
| /** | ||
| * @typedef {PSV.ExtendedPosition|string|Object} PSV.plugins.AutorotateKeypointsPlugin.Keypoints | ||
| * @summary Definition of keypoints for automatic rotation, can be a position object, a marker id or an object with the following properties | ||
| * @property {string} [markerId] | ||
| * @typedef {Object} PSV.plugins.AutorotateKeypointsPlugin.KeypointObject | ||
| * @property {PSV.ExtendedPosition} [position] | ||
| * @property {string} [markerId] - use the position and tooltip of a marker | ||
| * @property {number} [pause=0] - pause the animation when reaching this point, will display the tooltip if available | ||
| * @property {string|{content: string, position: string}} [tooltip] | ||
| * @property {number} [pause=0] | ||
| */ | ||
| /** | ||
| * @typedef {PSV.ExtendedPosition|string|PSV.plugins.AutorotateKeypointsPlugin.KeypointObject} PSV.plugins.AutorotateKeypointsPlugin.Keypoint | ||
| * @summary Definition of keypoints for automatic rotation, can be a position object, a marker id or an keypoint object | ||
| */ | ||
| /** | ||
| * @typedef {Object} PSV.plugins.AutorotateKeypointsPlugin.Options | ||
| * @property {boolean} [startFromClosest=true] - start from the closest keypoint instead of the first keypoint | ||
| * @property {PSV.plugins.AutorotateKeypointsPlugin.Keypoints[]} keypoints | ||
| * @property {PSV.plugins.AutorotateKeypointsPlugin.Keypoint[]} keypoints | ||
| */ | ||
@@ -91,4 +95,4 @@ | ||
| * @property {number[][]} curve - curve between idx and idx + 1 | ||
| * @property {number[]} startPt - start point of the current step | ||
| * @property {number[]} endPt - end point of the current step | ||
| * @property {number[]} startStep - start point of the current step | ||
| * @property {number[]} endStep - end point of the current step | ||
| * @property {number} startTime - start time of the current step | ||
@@ -112,3 +116,3 @@ * @property {number} stepDuration - expected duration of the step | ||
| /** | ||
| * @type {PSV.plugins.AutorotateKeypointsPlugin.Keypoints[]} keypoints | ||
| * @type {PSV.plugins.AutorotateKeypointsPlugin.Keypoint[]} keypoints | ||
| */ | ||
@@ -172,3 +176,3 @@ | ||
| * @summary Changes the keypoints | ||
| * @param {PSV.plugins.AutorotateKeypointsPlugin.Keypoints[]} keypoints | ||
| * @param {PSV.plugins.AutorotateKeypointsPlugin.Keypoint[]} keypoints | ||
| */ | ||
@@ -200,3 +204,3 @@ ; | ||
| if (!_this2.markers) { | ||
| throw new photoSphereViewer.PSVError("Keypoint #" + i + " references a marker but markers plugin is not loaded"); | ||
| throw new photoSphereViewer.PSVError("Keypoint #" + i + " references a marker but the markers plugin is not loaded"); | ||
| } | ||
@@ -243,4 +247,4 @@ | ||
| curve: [], | ||
| startPt: null, | ||
| endPt: null, | ||
| startStep: null, | ||
| endStep: null, | ||
| startTime: null, | ||
@@ -274,3 +278,3 @@ stepDuration: null, | ||
| if (!this.state.startTime) { | ||
| this.state.endPt = serializePt(this.psv.getPosition()); | ||
| this.state.endStep = serializePt(this.psv.getPosition()); | ||
@@ -346,3 +350,3 @@ this.__nextStep(); | ||
| // get the 4 points necessary to compute the current movement | ||
| // one point before and two points after the current | ||
| // the two points of the current segments and one point before and after | ||
| var workPoints = []; | ||
@@ -361,3 +365,3 @@ | ||
| var workPoints2 = [workPoints[0].slice(0)]; | ||
| var workVectors = [new THREE.Vector2(workPoints[0][0], workPoints[0][1])]; | ||
| var k = 0; | ||
@@ -378,15 +382,16 @@ | ||
| // do not modify first point, apply the reverse offset the the previous point instead | ||
| workPoints2[0][0] -= k * 2 * Math.PI; | ||
| workVectors[0].x -= k * 2 * Math.PI; | ||
| k = 0; | ||
| } | ||
| workPoints2.push([workPoints[_i][0] + k * 2 * Math.PI, workPoints[_i][1]]); | ||
| workVectors.push(new THREE.Vector2(workPoints[_i][0] + k * 2 * Math.PI, workPoints[_i][1])); | ||
| } | ||
| var curve = this.__getCurvePoints(workPoints2, 0.6, NUM_STEPS); // __debugCurve(this.markers, curve); | ||
| var curve = new THREE.SplineCurve(workVectors).getPoints(NUM_STEPS * 3).map(function (p) { | ||
| return [p.x, p.y]; | ||
| }); // debugCurve(this.markers, curve, NUM_STEPS); | ||
| // only keep the curve for the current movement | ||
| this.state.curve = curve.slice(NUM_STEPS + 1, NUM_STEPS * 2 + 1); | ||
| this.state.curve = curve.slice(NUM_STEPS, NUM_STEPS * 2); | ||
| if (this.state.idx !== -1) { | ||
@@ -414,10 +419,10 @@ this.state.remainingPause = this.keypoints[this.state.idx].pause; | ||
| this.state.endPt[0] = photoSphereViewer.utils.parseAngle(this.state.endPt[0]); | ||
| this.state.endStep[0] = photoSphereViewer.utils.parseAngle(this.state.endStep[0]); | ||
| } // target next point | ||
| this.state.startPt = this.state.endPt; | ||
| this.state.endPt = this.state.curve.shift(); // compute duration from distance and speed | ||
| this.state.startStep = this.state.endStep; | ||
| this.state.endStep = this.state.curve.shift(); // compute duration from distance and speed | ||
| var distance = photoSphereViewer.utils.greatArcDistance(this.state.startPt, this.state.endPt); | ||
| var distance = photoSphereViewer.utils.greatArcDistance(this.state.startStep, this.state.endStep); | ||
| this.state.stepDuration = distance * 1000 / Math.abs(this.psv.config.autorotateSpeed); | ||
@@ -463,13 +468,7 @@ | ||
| this.psv.rotate({ | ||
| longitude: this.state.startPt[0] + (this.state.endPt[0] - this.state.startPt[0]) * progress, | ||
| latitude: this.state.startPt[1] + (this.state.endPt[1] - this.state.startPt[1]) * progress | ||
| longitude: this.state.startStep[0] + (this.state.endStep[0] - this.state.startStep[0]) * progress, | ||
| latitude: this.state.startStep[1] + (this.state.endStep[1] - this.state.startStep[1]) * progress | ||
| }); | ||
| } | ||
| /** | ||
| * @summary Interpolate curvature points using cardinal spline | ||
| * {@link https://stackoverflow.com/a/15528789/1207670} | ||
| * @param {number[][]} pts | ||
| * @param {number} [tension=0.5] | ||
| * @param {number} [numOfSegments=16] | ||
| * @returns {number[][]} | ||
| * @private | ||
@@ -479,49 +478,2 @@ */ | ||
| _proto.__getCurvePoints = function __getCurvePoints(pts, tension, numOfSegments) { | ||
| if (tension === void 0) { | ||
| tension = 0.5; | ||
| } | ||
| if (numOfSegments === void 0) { | ||
| numOfSegments = 16; | ||
| } | ||
| var res = []; // The algorithm require a previous and next point to the actual point array. | ||
| var _pts = pts.slice(0); | ||
| _pts.unshift(pts[0]); | ||
| _pts.push(pts[pts.length - 1]); // 1. loop through each point | ||
| // 2. loop through each segment | ||
| for (var i = 1; i < _pts.length - 2; i++) { | ||
| // calc tension vectors | ||
| var t1x = (_pts[i + 1][0] - _pts[i - 1][0]) * tension; | ||
| var t2x = (_pts[i + 2][0] - _pts[i][0]) * tension; | ||
| var t1y = (_pts[i + 1][1] - _pts[i - 1][1]) * tension; | ||
| var t2y = (_pts[i + 2][1] - _pts[i][1]) * tension; | ||
| for (var t = 1; t <= numOfSegments; t++) { | ||
| // calc step | ||
| var st = t / numOfSegments; | ||
| var st3 = Math.pow(st, 3); | ||
| var st2 = Math.pow(st, 2); // calc cardinals | ||
| var c1 = 2 * st3 - 3 * st2 + 1; | ||
| var c2 = -2 * st3 + 3 * st2; | ||
| var c3 = st3 - 2 * st2 + st; | ||
| var c4 = st3 - st2; // calc x and y cords with common control vectors | ||
| var x = c1 * _pts[i][0] + c2 * _pts[i + 1][0] + c3 * t1x + c4 * t2x; | ||
| var y = c1 * _pts[i][1] + c2 * _pts[i + 1][1] + c3 * t1y + c4 * t2y; // store points in array | ||
| res.push([x, y]); | ||
| } | ||
| } | ||
| return res; | ||
| }; | ||
| _proto.__findMinIndex = function __findMinIndex(array, mapper) { | ||
@@ -528,0 +480,0 @@ var idx = 0; |
| /*! | ||
| * Photo Sphere Viewer 4.5.3 | ||
| * Photo Sphere Viewer 4.6.0 | ||
| * @copyright 2014-2015 Jérémy Heleine | ||
@@ -4,0 +4,0 @@ * @copyright 2015-2022 Damien "Mistic" Sorel |
@@ -18,2 +18,4 @@ import { AbstractPlugin, Viewer } from 'photo-sphere-viewer'; | ||
| static EVENTS: typeof EVENTS; | ||
| constructor(psv: Viewer, options: GyroscopePluginOptions); | ||
@@ -20,0 +22,0 @@ |
| /*! | ||
| * Photo Sphere Viewer 4.5.3 | ||
| * Photo Sphere Viewer 4.6.0 | ||
| * @copyright 2014-2015 Jérémy Heleine | ||
@@ -282,6 +282,2 @@ * @copyright 2015-2022 Damien "Mistic" Sorel | ||
| /** | ||
| * @deprecated use the EVENTS constants of the module | ||
| */ | ||
| /** | ||
| * @param {PSV.Viewer} psv | ||
@@ -472,4 +468,5 @@ * @param {PSV.plugins.GyroscopePlugin.Options} options | ||
| return; | ||
| } // on first run compute the offset depending on the current viewer position and device orientation | ||
| } | ||
| var position = this.psv.getPosition(); // on first run compute the offset depending on the current viewer position and device orientation | ||
@@ -480,3 +477,3 @@ if (this.prop.alphaOffset === null) { | ||
| var sphericalCoords = this.psv.dataHelper.vector3ToSphericalCoords(direction); | ||
| this.prop.alphaOffset = sphericalCoords.longitude - this.psv.getPosition().longitude; | ||
| this.prop.alphaOffset = sphericalCoords.longitude - position.longitude; | ||
| } else { | ||
@@ -487,9 +484,10 @@ this.controls.alphaOffset = this.prop.alphaOffset; | ||
| var _sphericalCoords = this.psv.dataHelper.vector3ToSphericalCoords(direction); // TODO use dynamic goto for smooth movement | ||
| var _sphericalCoords = this.psv.dataHelper.vector3ToSphericalCoords(direction); | ||
| this.psv.dynamics.position.setValue({ | ||
| var target = { | ||
| longitude: _sphericalCoords.longitude, | ||
| latitude: -_sphericalCoords.latitude | ||
| }); | ||
| }; // having a slow speed on smalls movements allows to absorb the device/hand vibrations | ||
| this.psv.dynamics.position.goto(target, photoSphereViewer.utils.getAngle(position, target) < 0.01 ? 1 : 3); | ||
| } | ||
@@ -496,0 +494,0 @@ } |
@@ -138,2 +138,4 @@ import { ExtendedPosition, AbstractPlugin, Viewer, Animation } from 'photo-sphere-viewer'; | ||
| static EVENTS: typeof EVENTS; | ||
| constructor(psv: Viewer, options: MarkersPluginOptions); | ||
@@ -140,0 +142,0 @@ |
@@ -24,2 +24,4 @@ import { AbstractPlugin, Viewer } from 'photo-sphere-viewer'; | ||
| static EVENTS: typeof EVENTS; | ||
| constructor(psv: Viewer, options: ResolutionPluginOptions); | ||
@@ -26,0 +28,0 @@ |
| /*! | ||
| * Photo Sphere Viewer 4.5.3 | ||
| * Photo Sphere Viewer 4.6.0 | ||
| * @copyright 2014-2015 Jérémy Heleine | ||
@@ -121,6 +121,2 @@ * @copyright 2015-2022 Damien "Mistic" Sorel | ||
| /** | ||
| * @deprecated use the EVENTS constants of the module | ||
| */ | ||
| /** | ||
| * @param {PSV.Viewer} psv | ||
@@ -127,0 +123,0 @@ * @param {PSV.plugins.ResolutionPlugin.Options} options |
@@ -51,2 +51,4 @@ import { Event } from 'uevent'; | ||
| static EVENTS: typeof EVENTS; | ||
| constructor(psv: Viewer); | ||
@@ -53,0 +55,0 @@ |
| /*! | ||
| * Photo Sphere Viewer 4.5.3 | ||
| * Photo Sphere Viewer 4.6.0 | ||
| * @copyright 2014-2015 Jérémy Heleine | ||
@@ -41,4 +41,2 @@ * @copyright 2015-2022 Damien "Mistic" Sorel | ||
| var icon = "<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 100 100\"><path fill=\"currentColor\" d=\"M98.4 43.7c-.8-.5-7-4.3-9.6-5.4l-3-7.5c.9-2.5 2.6-9.4 3-10.6a3.3 3.3 0 00-1-3.1L83 12.2a3.3 3.3 0 00-3-.9c-1 .2-8 2-10.7 3l-7.5-3.1c-1-2.4-4.8-8.6-5.4-9.6A3.3 3.3 0 0053.4 0h-6.8a3.4 3.4 0 00-2.9 1.6c-.5.8-4.2 7-5.4 9.6l-7.5 3-10.6-3a3.3 3.3 0 00-3.1 1L12.2 17a3.3 3.3 0 00-.9 3c.2 1 2 8 3 10.7l-3.1 7.5c-2.4 1-8.6 4.8-9.6 5.4A3.3 3.3 0 000 46.6v6.8a3.4 3.4 0 001.6 2.9c.8.5 7 4.2 9.6 5.4l3 7.5-3 10.6a3.3 3.3 0 001 3.1l4.8 4.9a3.3 3.3 0 003.1.9c1-.2 8-2 10.7-3l7.5 3c1 2.5 4.7 8.6 5.4 9.7a3.3 3.3 0 002.9 1.6h6.8a3.4 3.4 0 002.9-1.6c.5-.8 4.2-7 5.4-9.6l7.5-3c2.5.9 9.4 2.6 10.6 3a3.3 3.3 0 003.1-1l4.9-4.8a3.3 3.3 0 00.9-3.1c-.2-1-2-8-3-10.7l3-7.5c2.5-1 8.6-4.7 9.7-5.4a3.3 3.3 0 001.6-2.9v-6.8a3.3 3.3 0 00-1.6-2.9zM50 71.7A21.8 21.8 0 1171.8 50 21.8 21.8 0 0150 71.8z\"/><!-- Created by i cons from the Noun Project --></svg>\n"; | ||
| var switchOff = "<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 200 100\" width=\"2.4em\" height=\"1.2em\"><path fill=\"currentColor\" transform=\"scale(1.88) translate(0, -25)\" d=\"M72 73.2H44A26.4 26.4 0 0044 30h28a21.6 21.6 0 010 43.2M7.2 51.6a21.6 21.6 0 1143.2 0 21.6 21.6 0 01-43.2 0M72 25.2H28.8a26.4 26.4 0 000 52.8H72a26.4 26.4 0 000-52.8\"/><!-- Created by Nikita from the Noun Project --></svg>\n"; | ||
@@ -98,3 +96,2 @@ | ||
| * @param {PSV.plugins.SettingsPlugin.Setting[]} settings | ||
| * @param {string} title | ||
| * @param {string} dataKey | ||
@@ -107,4 +104,4 @@ * @param {function} optionsCurrent | ||
| var SETTINGS_TEMPLATE = function SETTINGS_TEMPLATE(settings, title, dataKey, optionsCurrent) { | ||
| return "\n<div class=\"psv-panel-menu\">\n <h1 class=\"psv-panel-menu-title\">" + icon + " " + title + "</h1>\n <ul class=\"psv-panel-menu-list\">\n " + settings.map(function (s) { | ||
| var SETTINGS_TEMPLATE = function SETTINGS_TEMPLATE(settings, dataKey, optionsCurrent) { | ||
| return "\n<div class=\"psv-panel-menu psv-settings-menu\">\n <ul class=\"psv-panel-menu-list\">\n " + settings.map(function (s) { | ||
| return "\n <li class=\"psv-panel-menu-item\" data-" + dataKey + "=\"" + s.id + "\">\n " + SETTINGS_TEMPLATE_[s.type](s, optionsCurrent) + "\n </li>\n "; | ||
@@ -116,3 +113,2 @@ }).join('') + "\n </ul>\n</div>\n"; | ||
| * @param {PSV.plugins.SettingsPlugin.OptionsSetting} setting | ||
| * @param {string} title | ||
| * @param {string} dataKey | ||
@@ -125,4 +121,4 @@ * @param {function} optionActive | ||
| var SETTING_OPTIONS_TEMPLATE = function SETTING_OPTIONS_TEMPLATE(setting, title, dataKey, optionActive) { | ||
| return "\n<div class=\"psv-panel-menu\">\n <h1 class=\"psv-panel-menu-title\">" + icon + " " + title + "</h1>\n <ul class=\"psv-panel-menu-list\">\n <li class=\"psv-panel-menu-item psv-settings-item--header\" data-" + dataKey + "=\"__back\">\n <span class=\"psv-settings-item-icon\">" + chevron + "</span>\n <span class=\"psv-settings-item-label\">" + setting.label + "</span>\n </li>\n " + setting.options().map(function (s) { | ||
| var SETTING_OPTIONS_TEMPLATE = function SETTING_OPTIONS_TEMPLATE(setting, dataKey, optionActive) { | ||
| return "\n<div class=\"psv-panel-menu psv-settings-menu\">\n <ul class=\"psv-panel-menu-list\">\n <li class=\"psv-panel-menu-item psv-settings-item--header\" data-" + dataKey + "=\"__back\">\n <span class=\"psv-settings-item-icon\">" + chevron + "</span>\n <span class=\"psv-settings-item-label\">" + setting.label + "</span>\n </li>\n " + setting.options().map(function (s) { | ||
| return "\n <li class=\"psv-panel-menu-item\" data-" + dataKey + "=\"" + s.id + "\">\n <span class=\"psv-settings-item-icon\">" + (optionActive(s) ? check : '') + "</span>\n <span class=\"psv-settings-item-value\">" + s.label + "</span>\n </li>\n "; | ||
@@ -132,2 +128,4 @@ }).join('') + "\n </ul>\n</div>\n"; | ||
| var icon = "<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 100 100\"><path fill=\"currentColor\" d=\"M98.4 43.7c-.8-.5-7-4.3-9.6-5.4l-3-7.5c.9-2.5 2.6-9.4 3-10.6a3.3 3.3 0 00-1-3.1L83 12.2a3.3 3.3 0 00-3-.9c-1 .2-8 2-10.7 3l-7.5-3.1c-1-2.4-4.8-8.6-5.4-9.6A3.3 3.3 0 0053.4 0h-6.8a3.4 3.4 0 00-2.9 1.6c-.5.8-4.2 7-5.4 9.6l-7.5 3-10.6-3a3.3 3.3 0 00-3.1 1L12.2 17a3.3 3.3 0 00-.9 3c.2 1 2 8 3 10.7l-3.1 7.5c-2.4 1-8.6 4.8-9.6 5.4A3.3 3.3 0 000 46.6v6.8a3.4 3.4 0 001.6 2.9c.8.5 7 4.2 9.6 5.4l3 7.5-3 10.6a3.3 3.3 0 001 3.1l4.8 4.9a3.3 3.3 0 003.1.9c1-.2 8-2 10.7-3l7.5 3c1 2.5 4.7 8.6 5.4 9.7a3.3 3.3 0 002.9 1.6h6.8a3.4 3.4 0 002.9-1.6c.5-.8 4.2-7 5.4-9.6l7.5-3c2.5.9 9.4 2.6 10.6 3a3.3 3.3 0 003.1-1l4.9-4.8a3.3 3.3 0 00.9-3.1c-.2-1-2-8-3-10.7l3-7.5c2.5-1 8.6-4.7 9.7-5.4a3.3 3.3 0 001.6-2.9v-6.8a3.3 3.3 0 00-1.6-2.9zM50 71.7A21.8 21.8 0 1171.8 50 21.8 21.8 0 0150 71.8z\"/><!-- Created by i cons from the Noun Project --></svg>\n"; | ||
| /** | ||
@@ -329,3 +327,3 @@ * @summary Navigation bar settings button class | ||
| _proto.destroy = function destroy() { | ||
| delete this.settings; | ||
| this.settings.length = 0; | ||
@@ -374,11 +372,4 @@ _AbstractPlugin.prototype.destroy.call(this); | ||
| _proto.removeSetting = function removeSetting(id) { | ||
| var idx = -1; // FIXME use findIndex, one day, when IE11 is totally dead | ||
| this.settings.some(function (setting, i) { | ||
| if (setting.id === id) { | ||
| idx = i; | ||
| return true; | ||
| } | ||
| return false; | ||
| var idx = this.settings.findIndex(function (setting) { | ||
| return setting.id === id; | ||
| }); | ||
@@ -426,3 +417,3 @@ | ||
| id: ID_PANEL, | ||
| content: SETTINGS_TEMPLATE(this.settings, this.psv.config.lang[SettingsButton.id], photoSphereViewer.utils.dasherize(SETTING_DATA), function (setting) { | ||
| content: SETTINGS_TEMPLATE(this.settings, photoSphereViewer.utils.dasherize(SETTING_DATA), function (setting) { | ||
| // retrocompatibility with "current" returning a label | ||
@@ -480,3 +471,3 @@ var current = setting.current(); | ||
| id: ID_PANEL, | ||
| content: SETTING_OPTIONS_TEMPLATE(setting, this.psv.config.lang[SettingsButton.id], photoSphereViewer.utils.dasherize(SETTING_DATA), function (option) { | ||
| content: SETTING_OPTIONS_TEMPLATE(setting, photoSphereViewer.utils.dasherize(SETTING_DATA), function (option) { | ||
| // retrocompatibility with options having an "active" flag | ||
@@ -521,2 +512,3 @@ return 'active' in option ? option.active : option.id === current; | ||
| SettingsPlugin.id = 'settings'; | ||
| SettingsPlugin.EVENTS = EVENTS; | ||
@@ -523,0 +515,0 @@ exports.EVENTS = EVENTS; |
@@ -13,2 +13,4 @@ import { AbstractPlugin, Viewer } from 'photo-sphere-viewer'; | ||
| static EVENTS: typeof EVENTS; | ||
| constructor(psv: Viewer); | ||
@@ -15,0 +17,0 @@ |
| /*! | ||
| * Photo Sphere Viewer 4.5.3 | ||
| * Photo Sphere Viewer 4.6.0 | ||
| * @copyright 2014-2015 Jérémy Heleine | ||
@@ -207,6 +207,2 @@ * @copyright 2015-2022 Damien "Mistic" Sorel | ||
| /** | ||
| * @deprecated use the EVENTS constants of the module | ||
| */ | ||
| /** | ||
| * @param {PSV.Viewer} psv | ||
@@ -446,3 +442,3 @@ */ | ||
| var displayRotateMessage = function displayRotateMessage() { | ||
| if (_this4.isEnabled() && window.innerHeight > window.innerWidth) { | ||
| if (window.innerHeight > window.innerWidth) { | ||
| _this4.psv.overlay.show({ | ||
@@ -449,0 +445,0 @@ id: ID_OVERLAY_PLEASE_ROTATE, |
@@ -17,2 +17,3 @@ import { Event } from 'uevent'; | ||
| caption?: string; | ||
| description?: string; | ||
| markers?: Marker[]; | ||
@@ -80,2 +81,9 @@ }; | ||
| declare const MODE_CLIENT = 'client'; | ||
| declare const MODE_SERVER = 'server'; | ||
| declare const MODE_MANUAL = 'manual'; | ||
| declare const MODE_GPS = 'gps'; | ||
| declare const MODE_MARKERS = 'markers'; | ||
| declare const MODE_3D = '3d'; | ||
| /** | ||
@@ -86,2 +94,10 @@ * @summary Replaces the standard autorotate animation by a smooth transition between multiple points | ||
| static EVENTS: typeof EVENTS; | ||
| static MODE_CLIENT: typeof MODE_CLIENT; | ||
| static MODE_SERVER: typeof MODE_SERVER; | ||
| static MODE_3D: typeof MODE_3D; | ||
| static MODE_MARKERS: typeof MODE_MARKERS; | ||
| static MODE_MANUAL: typeof MODE_MANUAL; | ||
| static MODE_GPS: typeof MODE_GPS; | ||
| constructor(psv: Viewer, options: VirtualTourPluginPluginOptions); | ||
@@ -127,2 +143,2 @@ | ||
| export { EVENTS, VirtualTourArrowStyle, VirtualTourNode, VirtualTourNodeChangedData, VirtualTourNodeLink, VirtualTourPlugin, VirtualTourPluginPluginOptions }; | ||
| export { EVENTS, MODE_3D, MODE_CLIENT, MODE_GPS, MODE_MANUAL, MODE_MARKERS, MODE_SERVER, VirtualTourArrowStyle, VirtualTourNode, VirtualTourNodeChangedData, VirtualTourNodeLink, VirtualTourPlugin, VirtualTourPluginPluginOptions }; |
| /*! | ||
| * Photo Sphere Viewer 4.5.3 | ||
| * Photo Sphere Viewer 4.6.0 | ||
| * @copyright 2014-2015 Jérémy Heleine | ||
@@ -57,3 +57,3 @@ * @copyright 2015-2022 Damien "Mistic" Sorel | ||
| * @memberOf PSV.plugins.VirtualTourPlugin | ||
| * @package | ||
| * @private | ||
| */ | ||
@@ -186,3 +186,3 @@ | ||
| * @memberOf PSV.plugins.VirtualTourPlugin | ||
| * @package | ||
| * @private | ||
| */ | ||
@@ -515,3 +515,3 @@ | ||
| * @memberOf PSV.plugins.VirtualTourPlugin | ||
| * @package | ||
| * @private | ||
| */ | ||
@@ -628,2 +628,3 @@ | ||
| * @property {string} [caption] - caption visible in the navbar | ||
| * @property {string} [description] - description visible in the side panel | ||
| * @property {string} [thumbnail] - thumbnail for the nodes list in the side panel | ||
@@ -1033,2 +1034,3 @@ * @property {PSV.plugins.MarkersPlugin.Properties[]} [markers] - additional markers to use on this node | ||
| caption: node.caption, | ||
| description: node.description, | ||
| panoData: node.panoData, | ||
@@ -1336,2 +1338,9 @@ sphereCorrection: node.sphereCorrection | ||
| VirtualTourPlugin.id = 'virtual-tour'; | ||
| VirtualTourPlugin.EVENTS = EVENTS; | ||
| VirtualTourPlugin.MODE_CLIENT = MODE_CLIENT; | ||
| VirtualTourPlugin.MODE_SERVER = MODE_SERVER; | ||
| VirtualTourPlugin.MODE_3D = MODE_3D; | ||
| VirtualTourPlugin.MODE_MARKERS = MODE_MARKERS; | ||
| VirtualTourPlugin.MODE_MANUAL = MODE_MANUAL; | ||
| VirtualTourPlugin.MODE_GPS = MODE_GPS; | ||
@@ -1338,0 +1347,0 @@ exports.EVENTS = EVENTS; |
| /*! | ||
| * Photo Sphere Viewer 4.5.3 | ||
| * Photo Sphere Viewer 4.6.0 | ||
| * @copyright 2014-2015 Jérémy Heleine | ||
@@ -4,0 +4,0 @@ * @copyright 2015-2022 Damien "Mistic" Sorel |
| { | ||
| "name": "photo-sphere-viewer", | ||
| "version": "4.5.3", | ||
| "version": "4.6.0", | ||
| "description": "A JavaScript library to display Photo Sphere panoramas", | ||
@@ -36,3 +36,3 @@ "homepage": "https://photo-sphere-viewer.js.org", | ||
| "dependencies": { | ||
| "three": "^0.138.0", | ||
| "three": "^0.139.0", | ||
| "uevent": "^2.1.1" | ||
@@ -98,5 +98,5 @@ }, | ||
| "start:doc": "vuepress dev docs", | ||
| "dev:serve": "live-server --watch=dist,example --open=example", | ||
| "dev:serve": "node -e \"setTimeout(() => process.exit(0), 10000)\" && live-server --watch=dist,example --open=example", | ||
| "dev:watch": "npm run compile -- --watch" | ||
| } | ||
| } |
| import * as THREE from 'three'; | ||
| import { CONSTANTS, PSVError, utils } from '../..'; | ||
| import { CUBE_HASHMAP, CubemapAdapter } from '../cubemap'; | ||
| import { Queue } from '../tiles-shared/Queue'; | ||
| import { Task } from '../tiles-shared/Task'; | ||
| import { buildErrorMaterial, createBaseTexture } from '../tiles-shared/utils'; | ||
| import { Queue } from '../shared/Queue'; | ||
| import { Task } from '../shared/Task'; | ||
| import { buildErrorMaterial, createBaseTexture } from '../shared/tiles-utils'; | ||
@@ -70,2 +70,3 @@ if (!CubemapAdapter) { | ||
| * @memberof PSV.adapters | ||
| * @extends PSV.adapters.AbstractAdapter | ||
| */ | ||
@@ -72,0 +73,0 @@ export class CubemapTilesAdapter extends CubemapAdapter { |
@@ -31,2 +31,3 @@ import * as THREE from 'three'; | ||
| * @memberof PSV.adapters | ||
| * @extends PSV.adapters.AbstractAdapter | ||
| */ | ||
@@ -33,0 +34,0 @@ export class CubemapAdapter extends AbstractAdapter { |
| import * as THREE from 'three'; | ||
| import { CONSTANTS, EquirectangularAdapter, PSVError, utils } from '../..'; | ||
| import { Queue } from '../tiles-shared/Queue'; | ||
| import { Task } from '../tiles-shared/Task'; | ||
| import { buildErrorMaterial, createBaseTexture } from '../tiles-shared/utils'; | ||
| import { Queue } from '../shared/Queue'; | ||
| import { Task } from '../shared/Task'; | ||
| import { buildErrorMaterial, createBaseTexture } from '../shared/tiles-utils'; | ||
@@ -90,2 +90,3 @@ | ||
| * @memberof PSV.adapters | ||
| * @extends PSV.adapters.AbstractAdapter | ||
| */ | ||
@@ -263,2 +264,5 @@ export class EquirectangularTilesAdapter extends EquirectangularAdapter { | ||
| croppedY : 0, | ||
| poseHeading : 0, | ||
| posePitch : 0, | ||
| poseRoll : 0, | ||
| }; | ||
@@ -283,3 +287,8 @@ | ||
| createMesh(scale = 1) { | ||
| const geometry = new THREE.SphereGeometry(CONSTANTS.SPHERE_RADIUS * scale, this.SPHERE_SEGMENTS, this.SPHERE_HORIZONTAL_SEGMENTS, -Math.PI / 2) | ||
| const geometry = new THREE.SphereGeometry( | ||
| CONSTANTS.SPHERE_RADIUS * scale, | ||
| this.SPHERE_SEGMENTS, | ||
| this.SPHERE_HORIZONTAL_SEGMENTS, | ||
| -Math.PI / 2 | ||
| ) | ||
| .scale(-1, 1, 1) | ||
@@ -286,0 +295,0 @@ .toNonIndexed(); |
@@ -18,2 +18,3 @@ import * as THREE from 'three'; | ||
| * @memberof PSV.adapters | ||
| * @extends PSV.adapters.AbstractAdapter | ||
| */ | ||
@@ -131,3 +132,3 @@ export class EquirectangularAdapter extends AbstractAdapter { | ||
| if (a !== -1 && b !== -1 && data.indexOf('GPano:') !== -1) { | ||
| if (a !== -1 && b !== -1 && data.includes('GPano:')) { | ||
| return { | ||
@@ -210,3 +211,8 @@ fullWidth : getXMPValue(data, 'FullPanoWidthPixels'), | ||
| // The middle of the panorama is placed at longitude=0 | ||
| const geometry = new THREE.SphereGeometry(SPHERE_RADIUS * scale, this.SPHERE_SEGMENTS, this.SPHERE_HORIZONTAL_SEGMENTS, -Math.PI / 2) | ||
| const geometry = new THREE.SphereGeometry( | ||
| SPHERE_RADIUS * scale, | ||
| this.SPHERE_SEGMENTS, | ||
| this.SPHERE_HORIZONTAL_SEGMENTS, | ||
| -Math.PI / 2 | ||
| ) | ||
| .scale(-1, 1, 1); | ||
@@ -223,6 +229,4 @@ | ||
| setTexture(mesh, textureData) { | ||
| const { texture } = textureData; | ||
| mesh.material.map?.dispose(); | ||
| mesh.material.map = texture; | ||
| mesh.material.map = textureData.texture; | ||
| } | ||
@@ -229,0 +233,0 @@ |
| import { AbstractComponent } from '../components/AbstractComponent'; | ||
| import { KEY_CODES } from '../data/constants'; | ||
| import { PSVError } from '../PSVError'; | ||
| import { getEventKey, isPlainObject, toggleClass } from '../utils'; | ||
| import { isPlainObject, toggleClass } from '../utils'; | ||
@@ -27,2 +27,10 @@ /** | ||
| /** | ||
| * @summary Identifier to declare a group of buttons | ||
| * @member {string} | ||
| * @readonly | ||
| * @static | ||
| */ | ||
| static groupId = null; | ||
| /** | ||
| * @summary SVG icon name injected in the button | ||
@@ -92,3 +100,3 @@ * @member {string} | ||
| this.container.addEventListener('keydown', (e) => { | ||
| if (getEventKey(e) === KEY_CODES.Enter && this.prop.enabled) { | ||
| if (e.key === KEY_CODES.Enter && this.prop.enabled) { | ||
| this.onClick(); | ||
@@ -116,6 +124,6 @@ e.stopPropagation(); | ||
| this.prop.supported = supported; | ||
| if (!supported && this.prop.visible) { | ||
| if (!supported) { | ||
| this.hide(); | ||
| } | ||
| else if (supported && !this.prop.visible) { | ||
| else { | ||
| this.show(); | ||
@@ -125,5 +133,10 @@ } | ||
| } | ||
| else if (!supportedOrObject) { | ||
| this.hide(); | ||
| this.prop.supported = false; | ||
| else { | ||
| this.prop.supported = supportedOrObject; | ||
| if (!supportedOrObject) { | ||
| this.hide(); | ||
| } | ||
| else { | ||
| this.show(); | ||
| } | ||
| } | ||
@@ -224,4 +237,4 @@ } | ||
| container.innerHTML = icon; | ||
| // classList not supported on IE11, className is read-only !!!! | ||
| container.querySelector('svg').setAttribute('class', 'psv-button-svg'); | ||
| // className is read-only on SVGElement | ||
| container.querySelector('svg').classList.add('psv-button-svg'); | ||
| } | ||
@@ -228,0 +241,0 @@ else { |
| import { KEY_CODES } from '../data/constants'; | ||
| import { SYSTEM } from '../data/system'; | ||
| import arrow from '../icons/arrow.svg'; | ||
| import { getEventKey } from '../utils'; | ||
| import { PressHandler } from '../utils/PressHandler'; | ||
@@ -29,2 +28,4 @@ import { AbstractButton } from './AbstractButton'; | ||
| static groupId = 'move'; | ||
| /** | ||
@@ -81,4 +82,4 @@ * @param {PSV.components.Navbar} navbar | ||
| case 'touchend': this.__onMouseUp(); break; | ||
| case 'keydown': getEventKey(e) === KEY_CODES.Enter && this.__onMouseDown(); break; | ||
| case 'keyup': getEventKey(e) === KEY_CODES.Enter && this.__onMouseUp(); break; | ||
| case 'keydown': e.key === KEY_CODES.Enter && this.__onMouseDown(); break; | ||
| case 'keyup': e.key === KEY_CODES.Enter && this.__onMouseUp(); break; | ||
| // @formatter:on | ||
@@ -85,0 +86,0 @@ } |
| import { KEY_CODES } from '../data/constants'; | ||
| import { SYSTEM } from '../data/system'; | ||
| import { getEventKey } from '../utils'; | ||
| import { PressHandler } from '../utils/PressHandler'; | ||
@@ -14,2 +13,4 @@ import { AbstractButton } from './AbstractButton'; | ||
| static groupId = 'zoom'; | ||
| /** | ||
@@ -64,4 +65,4 @@ * @param {PSV.components.Navbar} navbar | ||
| case 'touchend': this.__onMouseUp(); break; | ||
| case 'keydown': getEventKey(e) === KEY_CODES.Enter && this.__onMouseDown(); break; | ||
| case 'keyup': getEventKey(e) === KEY_CODES.Enter && this.__onMouseUp(); break; | ||
| case 'keydown': e.key === KEY_CODES.Enter && this.__onMouseDown(); break; | ||
| case 'keyup': e.key === KEY_CODES.Enter && this.__onMouseUp(); break; | ||
| // @formatter:on | ||
@@ -68,0 +69,0 @@ } |
| import { EVENTS } from '../data/constants'; | ||
| import { SYSTEM } from '../data/system'; | ||
| import { getStyle } from '../utils'; | ||
| import { getStyle, Slider } from '../utils'; | ||
| import { AbstractButton } from './AbstractButton'; | ||
@@ -14,2 +14,3 @@ | ||
| static id = 'zoomRange'; | ||
| static groupId = 'zoom'; | ||
@@ -24,3 +25,2 @@ /** | ||
| * @override | ||
| * @property {boolean} mousedown | ||
| * @property {number} mediaMinWidth | ||
@@ -30,3 +30,2 @@ */ | ||
| ...this.prop, | ||
| mousedown : false, | ||
| mediaMinWidth: 0, | ||
@@ -53,13 +52,16 @@ }; | ||
| /** | ||
| * @member {PSV.Slider} | ||
| * @readonly | ||
| * @private | ||
| */ | ||
| this.slider = new Slider({ | ||
| container: this.container, | ||
| direction: Slider.HORIZONTAL, | ||
| onUpdate : e => this.__onSliderUpdate(e), | ||
| }); | ||
| this.prop.mediaMinWidth = parseInt(getStyle(this.container, 'maxWidth'), 10); | ||
| this.container.addEventListener('mousedown', this); | ||
| this.container.addEventListener('touchstart', this); | ||
| this.psv.container.addEventListener('mousemove', this); | ||
| this.psv.container.addEventListener('touchmove', this); | ||
| this.psv.container.addEventListener('mouseup', this); | ||
| this.psv.container.addEventListener('touchend', this); | ||
| this.psv.on(EVENTS.ZOOM_UPDATED, this); | ||
| if (this.psv.prop.ready) { | ||
@@ -79,9 +81,4 @@ this.__moveZoomValue(this.psv.getZoomLevel()); | ||
| destroy() { | ||
| this.__stopZoomChange(); | ||
| this.slider.destroy(); | ||
| this.psv.container.removeEventListener('mousemove', this); | ||
| this.psv.container.removeEventListener('touchmove', this); | ||
| this.psv.container.removeEventListener('mouseup', this); | ||
| this.psv.container.removeEventListener('touchend', this); | ||
| delete this.zoomRange; | ||
@@ -104,8 +101,2 @@ delete this.zoomValue; | ||
| // @formatter:off | ||
| case 'mousedown': this.__initZoomChangeWithMouse(e); break; | ||
| case 'touchstart': this.__initZoomChangeByTouch(e); break; | ||
| case 'mousemove': this.__changeZoomWithMouse(e); break; | ||
| case 'touchmove': this.__changeZoomByTouch(e); break; | ||
| case 'mouseup': this.__stopZoomChange(e); break; | ||
| case 'touchend': this.__stopZoomChange(e); break; | ||
| case EVENTS.ZOOM_UPDATED: this.__moveZoomValue(e.args[0]); break; | ||
@@ -155,80 +146,13 @@ case EVENTS.READY: this.__moveZoomValue(this.psv.getZoomLevel()); break; | ||
| /** | ||
| * @summary Handles mouse down events | ||
| * @param {MouseEvent} evt | ||
| * @private | ||
| */ | ||
| __initZoomChangeWithMouse(evt) { | ||
| if (!this.prop.enabled) { | ||
| return; | ||
| } | ||
| this.prop.mousedown = true; | ||
| this.__changeZoom(evt.clientX); | ||
| } | ||
| /** | ||
| * @summary Handles touch events | ||
| * @param {TouchEvent} evt | ||
| * @summary Zoom change | ||
| * @private | ||
| */ | ||
| __initZoomChangeByTouch(evt) { | ||
| if (!this.prop.enabled) { | ||
| return; | ||
| __onSliderUpdate(e) { | ||
| if (e.mousedown) { | ||
| this.psv.zoom(e.value * 100); | ||
| } | ||
| this.prop.mousedown = true; | ||
| this.__changeZoom(evt.changedTouches[0].clientX); | ||
| } | ||
| /** | ||
| * @summary Handles mouse up events | ||
| * @private | ||
| */ | ||
| __stopZoomChange() { | ||
| if (!this.prop.enabled) { | ||
| return; | ||
| } | ||
| this.prop.mousedown = false; | ||
| this.prop.buttondown = false; | ||
| } | ||
| /** | ||
| * @summary Handles mouse move events | ||
| * @param {MouseEvent} evt | ||
| * @private | ||
| */ | ||
| __changeZoomWithMouse(evt) { | ||
| if (!this.prop.enabled || !this.prop.mousedown) { | ||
| return; | ||
| } | ||
| evt.preventDefault(); | ||
| this.__changeZoom(evt.clientX); | ||
| } | ||
| /** | ||
| * @summary Handles touch move events | ||
| * @param {TouchEvent} evt | ||
| * @private | ||
| */ | ||
| __changeZoomByTouch(evt) { | ||
| if (!this.prop.enabled || !this.prop.mousedown) { | ||
| return; | ||
| } | ||
| this.__changeZoom(evt.changedTouches[0].clientX); | ||
| } | ||
| /** | ||
| * @summary Zoom change | ||
| * @param {number} x - mouse/touch position | ||
| * @private | ||
| */ | ||
| __changeZoom(x) { | ||
| const userInput = x - this.zoomRange.getBoundingClientRect().left; | ||
| const zoomLevel = userInput / this.zoomRange.offsetWidth * 100; | ||
| this.psv.zoom(zoomLevel); | ||
| } | ||
| } |
| import { AutorotateButton } from '../buttons/AutorotateButton'; | ||
| import { CustomButton } from '../buttons/CustomButton'; | ||
| import { DescriptionButton } from '../buttons/DescriptionButton'; | ||
| import { DownloadButton } from '../buttons/DownloadButton'; | ||
@@ -27,2 +28,9 @@ import { FullscreenButton } from '../buttons/FullscreenButton'; | ||
| /** | ||
| * @summary List of available buttons | ||
| * @type {Object<string, Array<Class<PSV.buttons.AbstractButton>>>} | ||
| * @private | ||
| */ | ||
| const AVAILABLE_GROUPS = {}; | ||
| /** | ||
| * @summary Register a new button available for all viewers | ||
@@ -41,2 +49,7 @@ * @param {Class<PSV.buttons.AbstractButton>} button | ||
| if (button.groupId) { | ||
| AVAILABLE_GROUPS[button.groupId] = AVAILABLE_GROUPS[button.groupId] || []; | ||
| AVAILABLE_GROUPS[button.groupId].push(button); | ||
| } | ||
| if (typeof defaultPosition === 'string') { | ||
@@ -59,9 +72,10 @@ switch (defaultPosition) { | ||
| AutorotateButton, | ||
| ZoomOutButton, | ||
| ZoomRangeButton, | ||
| ZoomInButton, | ||
| ZoomRangeButton, | ||
| ZoomOutButton, | ||
| DescriptionButton, | ||
| DownloadButton, | ||
| FullscreenButton, | ||
| MoveLeftButton, | ||
| MoveRightButton, | ||
| MoveLeftButton, | ||
| MoveUpButton, | ||
@@ -108,4 +122,11 @@ MoveDownButton, | ||
| const cleanedButtons = this.__cleanButtons(buttons); | ||
| // force description button if caption is present (used on narrow screens) | ||
| if (cleanedButtons.indexOf(NavbarCaption.id) !== -1 && cleanedButtons.indexOf(DescriptionButton.id) === -1) { | ||
| cleanedButtons.splice(cleanedButtons.indexOf(NavbarCaption.id), 0, DescriptionButton.id); | ||
| } | ||
| /* eslint-disable no-new */ | ||
| this.__cleanButtons(buttons).forEach((button) => { | ||
| cleanedButtons.forEach((button) => { | ||
| if (typeof button === 'object') { | ||
@@ -117,16 +138,8 @@ new CustomButton(this, button); | ||
| } | ||
| else if (button === 'caption') { | ||
| else if (AVAILABLE_GROUPS[button]) { | ||
| AVAILABLE_GROUPS[button].forEach(buttonCtor => new buttonCtor(this)); // eslint-disable-line new-cap | ||
| } | ||
| else if (button === NavbarCaption.id) { | ||
| new NavbarCaption(this, this.psv.config.caption); | ||
| } | ||
| else if (button === 'zoom') { | ||
| new ZoomOutButton(this); | ||
| new ZoomRangeButton(this); | ||
| new ZoomInButton(this); | ||
| } | ||
| else if (button === 'move') { | ||
| new MoveLeftButton(this); | ||
| new MoveRightButton(this); | ||
| new MoveUpButton(this); | ||
| new MoveDownButton(this); | ||
| } | ||
| else { | ||
@@ -152,3 +165,3 @@ throw new PSVError('Unknown button ' + button); | ||
| setCaption(html) { | ||
| const caption = this.getButton('caption', false); | ||
| const caption = this.getButton(NavbarCaption.id, false); | ||
| caption?.setCaption(html); | ||
@@ -155,0 +168,0 @@ } |
@@ -1,2 +0,2 @@ | ||
| import { CaptionButton } from '../buttons/CaptionButton'; | ||
| import { DescriptionButton } from '../buttons/DescriptionButton'; | ||
| import { AbstractComponent } from './AbstractComponent'; | ||
@@ -21,10 +21,2 @@ | ||
| /** | ||
| * @member {PSV.buttons.CaptionButton} | ||
| * @readonly | ||
| * @private | ||
| */ | ||
| this.button = new CaptionButton(this); | ||
| this.button.hide(); | ||
| /** | ||
| * @override | ||
@@ -42,3 +34,3 @@ * @property {string} id | ||
| collapsable : false, | ||
| width : this.button.prop.width, | ||
| width : 0, | ||
| caption : '', | ||
@@ -65,3 +57,2 @@ contentVisible: true, | ||
| destroy() { | ||
| delete this.button; | ||
| delete this.content; | ||
@@ -81,11 +72,8 @@ | ||
| if (html) { | ||
| this.show(false); | ||
| this.content.style.display = ''; | ||
| this.prop.contentWidth = this.content.offsetWidth; | ||
| this.refreshUi(); | ||
| this.refreshUi('caption change'); | ||
| } | ||
| else { | ||
| this.hide(); | ||
| else if (!this.prop.contentVisible) { | ||
| this.prop.contentVisible = true; | ||
| this.__refreshButton(); | ||
| } | ||
@@ -103,3 +91,2 @@ } | ||
| this.prop.contentVisible = true; | ||
| this.button.hide(false); | ||
| } | ||
@@ -109,6 +96,13 @@ else if (availableWidth < this.prop.contentWidth && this.prop.contentVisible) { | ||
| this.prop.contentVisible = false; | ||
| this.button.show(false); | ||
| } | ||
| this.__refreshButton(); | ||
| } | ||
| /** | ||
| * @private | ||
| */ | ||
| __refreshButton() { | ||
| this.psv.navbar.getButton(DescriptionButton.id, false)?.refreshUi(true); | ||
| } | ||
| } |
| import { EVENTS } from '../data/constants'; | ||
| import { PSVError } from '../PSVError'; | ||
| import { AbstractComponent } from './AbstractComponent'; | ||
@@ -23,4 +24,5 @@ | ||
| ...this.prop, | ||
| visible: false, | ||
| timeout: null, | ||
| visible : false, | ||
| contentId: undefined, | ||
| timeout : null, | ||
| }; | ||
@@ -51,4 +53,22 @@ | ||
| /** | ||
| * @override | ||
| * @param {string} [id] | ||
| */ | ||
| isVisible(id) { | ||
| return this.prop.visible && (!id || !this.prop.contentId || this.prop.contentId === id); | ||
| } | ||
| /** | ||
| * @override | ||
| * @summary This method is not supported | ||
| * @throws {PSV.PSVError} always | ||
| */ | ||
| toggle() { | ||
| throw new PSVError('Notification cannot be toggled'); | ||
| } | ||
| /** | ||
| * @summary Displays a notification on the viewer | ||
| * @param {Object|string} config | ||
| * @param {string} [config.id] - unique identifier to use with "hide" | ||
| * @param {string} config.content | ||
@@ -73,11 +93,12 @@ * @param {number} [config.timeout] | ||
| this.prop.contentId = config.id; | ||
| this.content.innerHTML = config.content; | ||
| this.prop.visible = true; | ||
| this.container.classList.add('psv-notification--visible'); | ||
| this.prop.visible = true; | ||
| this.psv.trigger(EVENTS.SHOW_NOTIFICATION); | ||
| this.psv.trigger(EVENTS.SHOW_NOTIFICATION, config.id); | ||
| if (config.timeout) { | ||
| this.prop.timeout = setTimeout(() => this.hide(), config.timeout); | ||
| this.prop.timeout = setTimeout(() => this.hide(config.id), config.timeout); | ||
| } | ||
@@ -88,11 +109,15 @@ } | ||
| * @summary Hides the notification | ||
| * @param {string} [id] | ||
| * @fires PSV.hide-notification | ||
| */ | ||
| hide() { | ||
| if (this.prop.visible) { | ||
| hide(id) { | ||
| if (this.isVisible(id)) { | ||
| const contentId = this.prop.contentId; | ||
| this.container.classList.remove('psv-notification--visible'); | ||
| this.prop.visible = false; | ||
| this.psv.trigger(EVENTS.HIDE_NOTIFICATION); | ||
| this.prop.contentId = undefined; | ||
| this.psv.trigger(EVENTS.HIDE_NOTIFICATION, contentId); | ||
| } | ||
@@ -99,0 +124,0 @@ } |
| import { EVENTS, KEY_CODES } from '../data/constants'; | ||
| import { getEventKey } from '../utils'; | ||
| import { PSVError } from '../PSVError'; | ||
| import { AbstractComponent } from './AbstractComponent'; | ||
| import { PSVError } from '../PSVError'; | ||
@@ -60,6 +59,5 @@ /** | ||
| this.container.addEventListener('mouseup', this); | ||
| this.psv.on(EVENTS.CLICK, this); | ||
| this.psv.on(EVENTS.KEY_PRESS, this); | ||
| document.addEventListener('keydown', this); | ||
| super.hide(); | ||
@@ -72,3 +70,4 @@ } | ||
| destroy() { | ||
| document.removeEventListener('keydown', this); | ||
| this.psv.off(EVENTS.CLICK, this); | ||
| this.psv.off(EVENTS.KEY_PRESS, this); | ||
@@ -90,6 +89,14 @@ delete this.image; | ||
| switch (e.type) { | ||
| // @formatter:off | ||
| case 'mouseup': this.prop.dissmisable && this.hide(); break; | ||
| case 'keydown': getEventKey(e) === KEY_CODES.Escape && this.prop.dissmisable && this.hide(); break; | ||
| // @formatter:on | ||
| case EVENTS.CLICK: | ||
| if (this.isVisible() && this.prop.dissmisable) { | ||
| this.hide(); | ||
| e.stopPropagation(); | ||
| } | ||
| break; | ||
| case EVENTS.KEY_PRESS: | ||
| if (this.isVisible() && this.prop.dissmisable && e.args[0] === KEY_CODES.Escape) { | ||
| this.hide(); | ||
| e.preventDefault(); | ||
| } | ||
| break; | ||
| } | ||
@@ -148,3 +155,3 @@ /* eslint-enable */ | ||
| hide(id) { | ||
| if (this.isVisible() && (!id || !this.prop.contentId || this.prop.contentId === id)) { | ||
| if (this.isVisible(id)) { | ||
| const contentId = this.prop.contentId; | ||
@@ -151,0 +158,0 @@ |
| import { EVENTS, KEY_CODES } from '../data/constants'; | ||
| import { SYSTEM } from '../data/system'; | ||
| import { PSVError } from '../PSVError'; | ||
| import { getEventKey, toggleClass } from '../utils'; | ||
| import { toggleClass } from '../utils'; | ||
| import { AbstractComponent } from './AbstractComponent'; | ||
@@ -80,3 +80,3 @@ | ||
| document.addEventListener('keydown', this); | ||
| this.psv.on(EVENTS.KEY_PRESS, this); | ||
| } | ||
@@ -88,2 +88,4 @@ | ||
| destroy() { | ||
| this.psv.off(EVENTS.KEY_PRESS, this); | ||
| this.psv.container.removeEventListener('mousemove', this); | ||
@@ -94,4 +96,2 @@ this.psv.container.removeEventListener('touchmove', this); | ||
| document.removeEventListener('keydown', this); | ||
| delete this.prop; | ||
@@ -118,3 +118,8 @@ delete this.content; | ||
| case 'touchend': this.__onMouseUp(e); break; | ||
| case 'keydown': getEventKey(e) === KEY_CODES.Escape && this.hide(); break; | ||
| case EVENTS.KEY_PRESS: | ||
| if (this.isVisible() && e.args[0] === KEY_CODES.Escape) { | ||
| this.hide(); | ||
| e.preventDefault(); | ||
| } | ||
| break; | ||
| // @formatter:on | ||
@@ -188,3 +193,3 @@ } | ||
| this.prop.keyHandler = (e) => { | ||
| if (getEventKey(e) === KEY_CODES.Enter) { | ||
| if (e.key === KEY_CODES.Enter) { | ||
| config.clickHandler(e); | ||
@@ -191,0 +196,0 @@ } |
@@ -20,2 +20,3 @@ import { AbstractAdapter } from '../adapters/AbstractAdapter'; | ||
| caption : null, | ||
| description : null, | ||
| downloadUrl : null, | ||
@@ -53,2 +54,3 @@ loadingImg : null, | ||
| 'download', | ||
| 'description', | ||
| 'caption', | ||
@@ -55,0 +57,0 @@ 'fullscreen', |
@@ -169,2 +169,3 @@ /** | ||
| * @summary Triggered when the notification is hidden | ||
| * @param {string} [id] | ||
| */ | ||
@@ -187,2 +188,9 @@ HIDE_NOTIFICATION : 'hide-notification', | ||
| /** | ||
| * @event key-press | ||
| * @memberof PSV | ||
| * @summary Triggered when a key is pressed, can be cancelled | ||
| * @param {string} key | ||
| */ | ||
| KEY_PRESS : 'key-press', | ||
| /** | ||
| * @event load-progress | ||
@@ -205,2 +213,3 @@ * @memberof PSV | ||
| * @summary Triggered when a panorama image has been loaded | ||
| * @param {PSV.TextureData} textureData | ||
| */ | ||
@@ -231,2 +240,3 @@ PANORAMA_LOADED : 'panorama-loaded', | ||
| * @summary Triggered when the notification is shown | ||
| * @param {string} [id] | ||
| */ | ||
@@ -319,2 +329,3 @@ SHOW_NOTIFICATION : 'show-notification', | ||
| ERROR : 'error', | ||
| DESCRIPTION: 'description', | ||
| }; | ||
@@ -321,0 +332,0 @@ |
@@ -1,3 +0,5 @@ | ||
| import { Animation } from './Animation'; | ||
| import { AbstractAdapter } from './adapters/AbstractAdapter'; | ||
| import { EquirectangularAdapter } from './adapters/equirectangular'; | ||
| import { AbstractButton } from './buttons/AbstractButton'; | ||
| import { AbstractComponent } from './components/AbstractComponent'; | ||
| import { registerButton } from './components/Navbar'; | ||
@@ -10,12 +12,15 @@ import { DEFAULTS } from './data/config'; | ||
| import { PSVError } from './PSVError'; | ||
| import { AbstractAdapter } from './adapters/AbstractAdapter'; | ||
| import { EquirectangularAdapter } from './adapters/equirectangular'; | ||
| import './styles/index.scss'; | ||
| import * as utils from './utils'; | ||
| import { Animation } from './utils/Animation'; | ||
| import { Viewer } from './Viewer'; | ||
| import './styles/index.scss'; | ||
| export { | ||
| AbstractAdapter, | ||
| AbstractButton, | ||
| AbstractComponent, | ||
| AbstractPlugin, | ||
| AbstractAdapter, | ||
| /** | ||
| * @deprecated use `utils.Animation` | ||
| */ | ||
| Animation, | ||
@@ -28,4 +33,4 @@ CONSTANTS, | ||
| SYSTEM, | ||
| Viewer, | ||
| utils | ||
| utils, | ||
| Viewer | ||
| }; | ||
@@ -113,2 +118,3 @@ | ||
| * @property {string} [caption] - new navbar caption | ||
| * @property {string} [description] - new panel description | ||
| * @property {boolean|number} [transition=1500] - duration of the transition between all and new panorama | ||
@@ -115,0 +121,0 @@ * @property {boolean} [showLoader=true] - show the loader while loading the new panorama |
@@ -0,17 +1,21 @@ | ||
| import * as THREE from 'three'; | ||
| import { AbstractPlugin, CONSTANTS, PSVError, utils } from '../..'; | ||
| /** | ||
| * @typedef {PSV.ExtendedPosition|string|Object} PSV.plugins.AutorotateKeypointsPlugin.Keypoints | ||
| * @summary Definition of keypoints for automatic rotation, can be a position object, a marker id or an object with the following properties | ||
| * @property {string} [markerId] | ||
| * @typedef {Object} PSV.plugins.AutorotateKeypointsPlugin.KeypointObject | ||
| * @property {PSV.ExtendedPosition} [position] | ||
| * @property {string} [markerId] - use the position and tooltip of a marker | ||
| * @property {number} [pause=0] - pause the animation when reaching this point, will display the tooltip if available | ||
| * @property {string|{content: string, position: string}} [tooltip] | ||
| * @property {number} [pause=0] | ||
| */ | ||
| /** | ||
| * @typedef {PSV.ExtendedPosition|string|PSV.plugins.AutorotateKeypointsPlugin.KeypointObject} PSV.plugins.AutorotateKeypointsPlugin.Keypoint | ||
| * @summary Definition of keypoints for automatic rotation, can be a position object, a marker id or an keypoint object | ||
| */ | ||
| /** | ||
| * @typedef {Object} PSV.plugins.AutorotateKeypointsPlugin.Options | ||
| * @property {boolean} [startFromClosest=true] - start from the closest keypoint instead of the first keypoint | ||
| * @property {PSV.plugins.AutorotateKeypointsPlugin.Keypoints[]} keypoints | ||
| * @property {PSV.plugins.AutorotateKeypointsPlugin.Keypoint[]} keypoints | ||
| */ | ||
@@ -47,4 +51,4 @@ | ||
| * @property {number[][]} curve - curve between idx and idx + 1 | ||
| * @property {number[]} startPt - start point of the current step | ||
| * @property {number[]} endPt - end point of the current step | ||
| * @property {number[]} startStep - start point of the current step | ||
| * @property {number[]} endStep - end point of the current step | ||
| * @property {number} startTime - start time of the current step | ||
@@ -69,3 +73,3 @@ * @property {number} stepDuration - expected duration of the step | ||
| /** | ||
| * @type {PSV.plugins.AutorotateKeypointsPlugin.Keypoints[]} keypoints | ||
| * @type {PSV.plugins.AutorotateKeypointsPlugin.Keypoint[]} keypoints | ||
| */ | ||
@@ -125,3 +129,3 @@ this.keypoints = null; | ||
| * @summary Changes the keypoints | ||
| * @param {PSV.plugins.AutorotateKeypointsPlugin.Keypoints[]} keypoints | ||
| * @param {PSV.plugins.AutorotateKeypointsPlugin.Keypoint[]} keypoints | ||
| */ | ||
@@ -145,3 +149,3 @@ setKeypoints(keypoints) { | ||
| if (!this.markers) { | ||
| throw new PSVError(`Keypoint #${i} references a marker but markers plugin is not loaded`); | ||
| throw new PSVError(`Keypoint #${i} references a marker but the markers plugin is not loaded`); | ||
| } | ||
@@ -185,4 +189,4 @@ const marker = this.markers.getMarker(pt.markerId); | ||
| curve : [], | ||
| startPt : null, | ||
| endPt : null, | ||
| startStep : null, | ||
| endStep : null, | ||
| startTime : null, | ||
@@ -212,3 +216,3 @@ stepDuration : null, | ||
| if (!this.state.startTime) { | ||
| this.state.endPt = serializePt(this.psv.getPosition()); | ||
| this.state.endStep = serializePt(this.psv.getPosition()); | ||
| this.__nextStep(); | ||
@@ -281,3 +285,3 @@ | ||
| // get the 4 points necessary to compute the current movement | ||
| // one point before and two points after the current | ||
| // the two points of the current segments and one point before and after | ||
| const workPoints = []; | ||
@@ -303,3 +307,3 @@ if (this.state.idx === -1) { | ||
| // apply offsets to avoid crossing the origin | ||
| const workPoints2 = [workPoints[0].slice(0)]; | ||
| const workVectors = [new THREE.Vector2(workPoints[0][0], workPoints[0][1])]; | ||
@@ -317,13 +321,16 @@ let k = 0; | ||
| // do not modify first point, apply the reverse offset the the previous point instead | ||
| workPoints2[0][0] -= k * 2 * Math.PI; | ||
| workVectors[0].x -= k * 2 * Math.PI; | ||
| k = 0; | ||
| } | ||
| workPoints2.push([workPoints[i][0] + k * 2 * Math.PI, workPoints[i][1]]); | ||
| workVectors.push(new THREE.Vector2(workPoints[i][0] + k * 2 * Math.PI, workPoints[i][1])); | ||
| } | ||
| const curve = this.__getCurvePoints(workPoints2, 0.6, NUM_STEPS); | ||
| // __debugCurve(this.markers, curve); | ||
| const curve = new THREE.SplineCurve(workVectors) | ||
| .getPoints(NUM_STEPS * 3) | ||
| .map(p => ([p.x, p.y])); | ||
| // debugCurve(this.markers, curve, NUM_STEPS); | ||
| // only keep the curve for the current movement | ||
| this.state.curve = curve.slice(NUM_STEPS, NUM_STEPS * 2); | ||
| this.state.curve = curve.slice(NUM_STEPS + 1, NUM_STEPS * 2 + 1); | ||
@@ -353,11 +360,11 @@ if (this.state.idx !== -1) { | ||
| // reset transformation made to the previous point | ||
| this.state.endPt[0] = utils.parseAngle(this.state.endPt[0]); | ||
| this.state.endStep[0] = utils.parseAngle(this.state.endStep[0]); | ||
| } | ||
| // target next point | ||
| this.state.startPt = this.state.endPt; | ||
| this.state.endPt = this.state.curve.shift(); | ||
| this.state.startStep = this.state.endStep; | ||
| this.state.endStep = this.state.curve.shift(); | ||
| // compute duration from distance and speed | ||
| const distance = utils.greatArcDistance(this.state.startPt, this.state.endPt); | ||
| const distance = utils.greatArcDistance(this.state.startStep, this.state.endStep); | ||
| this.state.stepDuration = distance * 1000 / Math.abs(this.psv.config.autorotateSpeed); | ||
@@ -398,4 +405,4 @@ | ||
| this.psv.rotate({ | ||
| longitude: this.state.startPt[0] + (this.state.endPt[0] - this.state.startPt[0]) * progress, | ||
| latitude : this.state.startPt[1] + (this.state.endPt[1] - this.state.startPt[1]) * progress, | ||
| longitude: this.state.startStep[0] + (this.state.endStep[0] - this.state.startStep[0]) * progress, | ||
| latitude : this.state.startStep[1] + (this.state.endStep[1] - this.state.startStep[1]) * progress, | ||
| }); | ||
@@ -405,53 +412,4 @@ } | ||
| /** | ||
| * @summary Interpolate curvature points using cardinal spline | ||
| * {@link https://stackoverflow.com/a/15528789/1207670} | ||
| * @param {number[][]} pts | ||
| * @param {number} [tension=0.5] | ||
| * @param {number} [numOfSegments=16] | ||
| * @returns {number[][]} | ||
| * @private | ||
| */ | ||
| __getCurvePoints(pts, tension = 0.5, numOfSegments = 16) { | ||
| const res = []; | ||
| // The algorithm require a previous and next point to the actual point array. | ||
| const _pts = pts.slice(0); | ||
| _pts.unshift(pts[0]); | ||
| _pts.push(pts[pts.length - 1]); | ||
| // 1. loop through each point | ||
| // 2. loop through each segment | ||
| for (let i = 1; i < _pts.length - 2; i++) { | ||
| // calc tension vectors | ||
| const t1x = (_pts[i + 1][0] - _pts[i - 1][0]) * tension; | ||
| const t2x = (_pts[i + 2][0] - _pts[i][0]) * tension; | ||
| const t1y = (_pts[i + 1][1] - _pts[i - 1][1]) * tension; | ||
| const t2y = (_pts[i + 2][1] - _pts[i][1]) * tension; | ||
| for (let t = 1; t <= numOfSegments; t++) { | ||
| // calc step | ||
| const st = t / numOfSegments; | ||
| const st3 = Math.pow(st, 3); | ||
| const st2 = Math.pow(st, 2); | ||
| // calc cardinals | ||
| const c1 = 2 * st3 - 3 * st2 + 1; | ||
| const c2 = -2 * st3 + 3 * st2; | ||
| const c3 = st3 - 2 * st2 + st; | ||
| const c4 = st3 - st2; | ||
| // calc x and y cords with common control vectors | ||
| const x = c1 * _pts[i][0] + c2 * _pts[i + 1][0] + c3 * t1x + c4 * t2x; | ||
| const y = c1 * _pts[i][1] + c2 * _pts[i + 1][1] + c3 * t1y + c4 * t2y; | ||
| // store points in array | ||
| res.push([x, y]); | ||
| } | ||
| } | ||
| return res; | ||
| } | ||
| __findMinIndex(array, mapper) { | ||
@@ -473,37 +431,1 @@ let idx = 0; | ||
| } | ||
| let debugMarkers = []; | ||
| function __debugCurve(markers, curve) { // eslint-disable-line no-unused-vars | ||
| debugMarkers.forEach((marker) => { | ||
| try { | ||
| markers.removeMarker(marker.id); | ||
| } | ||
| catch (e) { | ||
| // noop | ||
| } | ||
| }); | ||
| debugMarkers = [ | ||
| markers.addMarker({ | ||
| id : 'autorotate-path', | ||
| polylineRad: curve, | ||
| svgStyle : { | ||
| stroke : 'white', | ||
| strokeWidth: '2px', | ||
| }, | ||
| }), | ||
| ]; | ||
| curve.forEach((pos, i) => { | ||
| debugMarkers.push(markers.addMarker({ | ||
| id : 'autorotate-path-' + i, | ||
| circle : 5, | ||
| longitude: pos[0], | ||
| latitude : pos[1], | ||
| svgStyle : { | ||
| fill: 'black', | ||
| }, | ||
| })); | ||
| }); | ||
| } |
@@ -35,5 +35,2 @@ import * as THREE from 'three'; | ||
| /** | ||
| * @deprecated use the EVENTS constants of the module | ||
| */ | ||
| static EVENTS = EVENTS; | ||
@@ -226,2 +223,4 @@ | ||
| const position = this.psv.getPosition(); | ||
| // on first run compute the offset depending on the current viewer position and device orientation | ||
@@ -233,3 +232,3 @@ if (this.prop.alphaOffset === null) { | ||
| const sphericalCoords = this.psv.dataHelper.vector3ToSphericalCoords(direction); | ||
| this.prop.alphaOffset = sphericalCoords.longitude - this.psv.getPosition().longitude; | ||
| this.prop.alphaOffset = sphericalCoords.longitude - position.longitude; | ||
| } | ||
@@ -242,7 +241,10 @@ else { | ||
| const sphericalCoords = this.psv.dataHelper.vector3ToSphericalCoords(direction); | ||
| // TODO use dynamic goto for smooth movement | ||
| this.psv.dynamics.position.setValue({ | ||
| const target = { | ||
| longitude: sphericalCoords.longitude, | ||
| latitude : -sphericalCoords.latitude, | ||
| }); | ||
| }; | ||
| // having a slow speed on smalls movements allows to absorb the device/hand vibrations | ||
| this.psv.dynamics.position.goto(target, utils.getAngle(position, target) < 0.01 ? 1 : 3); | ||
| } | ||
@@ -249,0 +251,0 @@ } |
@@ -50,5 +50,2 @@ import * as THREE from 'three'; | ||
| /** | ||
| * @deprecated use the EVENTS constants of the module | ||
| */ | ||
| static EVENTS = EVENTS; | ||
@@ -55,0 +52,0 @@ |
@@ -35,5 +35,2 @@ import { AbstractPlugin, CONSTANTS, DEFAULTS, PSVError } from '../..'; | ||
| /** | ||
| * @deprecated use the EVENTS constants of the module | ||
| */ | ||
| static EVENTS = EVENTS; | ||
@@ -40,0 +37,0 @@ |
| import check from './check.svg'; | ||
| import chevron from './chevron.svg'; | ||
| import icon from './settings.svg'; | ||
| import switchOff from './switch-off.svg'; | ||
@@ -61,3 +60,2 @@ import switchOn from './switch-on.svg'; | ||
| * @param {PSV.plugins.SettingsPlugin.Setting[]} settings | ||
| * @param {string} title | ||
| * @param {string} dataKey | ||
@@ -69,5 +67,4 @@ * @param {function} optionsCurrent | ||
| */ | ||
| export const SETTINGS_TEMPLATE = (settings, title, dataKey, optionsCurrent) => ` | ||
| <div class="psv-panel-menu"> | ||
| <h1 class="psv-panel-menu-title">${icon} ${title}</h1> | ||
| export const SETTINGS_TEMPLATE = (settings, dataKey, optionsCurrent) => ` | ||
| <div class="psv-panel-menu psv-settings-menu"> | ||
| <ul class="psv-panel-menu-list"> | ||
@@ -86,3 +83,2 @@ ${settings.map(s => ` | ||
| * @param {PSV.plugins.SettingsPlugin.OptionsSetting} setting | ||
| * @param {string} title | ||
| * @param {string} dataKey | ||
@@ -94,5 +90,4 @@ * @param {function} optionActive | ||
| */ | ||
| export const SETTING_OPTIONS_TEMPLATE = (setting, title, dataKey, optionActive) => ` | ||
| <div class="psv-panel-menu"> | ||
| <h1 class="psv-panel-menu-title">${icon} ${title}</h1> | ||
| export const SETTING_OPTIONS_TEMPLATE = (setting, dataKey, optionActive) => ` | ||
| <div class="psv-panel-menu psv-settings-menu"> | ||
| <ul class="psv-panel-menu-list"> | ||
@@ -99,0 +94,0 @@ <li class="psv-panel-menu-item psv-settings-item--header" data-${dataKey}="__back"> |
@@ -65,2 +65,4 @@ import { AbstractPlugin, DEFAULTS, PSVError, registerButton, utils } from '../..'; | ||
| static EVENTS = EVENTS; | ||
| /** | ||
@@ -93,3 +95,3 @@ * @param {PSV.Viewer} psv | ||
| destroy() { | ||
| delete this.settings; | ||
| this.settings.length = 0; | ||
@@ -132,11 +134,3 @@ super.destroy(); | ||
| removeSetting(id) { | ||
| let idx = -1; | ||
| // FIXME use findIndex, one day, when IE11 is totally dead | ||
| this.settings.some((setting, i) => { | ||
| if (setting.id === id) { | ||
| idx = i; | ||
| return true; | ||
| } | ||
| return false; | ||
| }); | ||
| const idx = this.settings.findIndex(setting => setting.id === id); | ||
| if (idx !== -1) { | ||
@@ -180,3 +174,2 @@ this.settings.splice(idx, 1); | ||
| this.settings, | ||
| this.psv.config.lang[SettingsButton.id], | ||
| utils.dasherize(SETTING_DATA), | ||
@@ -228,3 +221,2 @@ (setting) => { // retrocompatibility with "current" returning a label | ||
| setting, | ||
| this.psv.config.lang[SettingsButton.id], | ||
| utils.dasherize(SETTING_DATA), | ||
@@ -231,0 +223,0 @@ (option) => { // retrocompatibility with options having an "active" flag |
@@ -35,5 +35,2 @@ import { AbstractPlugin, CONSTANTS, DEFAULTS, PSVError, registerButton, utils } from '../..'; | ||
| /** | ||
| * @deprecated use the EVENTS constants of the module | ||
| */ | ||
| static EVENTS = EVENTS; | ||
@@ -252,3 +249,3 @@ | ||
| const displayRotateMessage = () => { | ||
| if (this.isEnabled() && window.innerHeight > window.innerWidth) { | ||
| if (window.innerHeight > window.innerWidth) { | ||
| this.psv.overlay.show({ | ||
@@ -255,0 +252,0 @@ id : ID_OVERLAY_PLEASE_ROTATE, |
@@ -5,3 +5,3 @@ import { PSVError } from 'photo-sphere-viewer'; | ||
| * @memberOf PSV.plugins.VirtualTourPlugin | ||
| * @package | ||
| * @private | ||
| */ | ||
@@ -8,0 +8,0 @@ export class AbstractDatasource { |
@@ -7,3 +7,3 @@ import { PSVError, utils } from 'photo-sphere-viewer'; | ||
| * @memberOf PSV.plugins.VirtualTourPlugin | ||
| * @package | ||
| * @private | ||
| */ | ||
@@ -10,0 +10,0 @@ export class ClientSideDatasource extends AbstractDatasource { |
@@ -63,2 +63,3 @@ import * as THREE from 'three'; | ||
| * @property {string} [caption] - caption visible in the navbar | ||
| * @property {string} [description] - description visible in the side panel | ||
| * @property {string} [thumbnail] - thumbnail for the nodes list in the side panel | ||
@@ -131,2 +132,10 @@ * @property {PSV.plugins.MarkersPlugin.Properties[]} [markers] - additional markers to use on this node | ||
| static EVENTS = EVENTS; | ||
| static MODE_CLIENT = MODE_CLIENT; | ||
| static MODE_SERVER = MODE_SERVER; | ||
| static MODE_3D = MODE_3D; | ||
| static MODE_MARKERS = MODE_MARKERS; | ||
| static MODE_MANUAL = MODE_MANUAL; | ||
| static MODE_GPS = MODE_GPS; | ||
| /** | ||
@@ -445,2 +454,3 @@ * @param {PSV.Viewer} psv | ||
| caption : node.caption, | ||
| description : node.description, | ||
| panoData : node.panoData, | ||
@@ -447,0 +457,0 @@ sphereCorrection: node.sphereCorrection, |
@@ -7,3 +7,3 @@ import { PSVError, utils } from 'photo-sphere-viewer'; | ||
| * @memberOf PSV.plugins.VirtualTourPlugin | ||
| * @package | ||
| * @private | ||
| */ | ||
@@ -10,0 +10,0 @@ export class ServerSideDatasource extends AbstractDatasource { |
| import * as THREE from 'three'; | ||
| import { Animation } from '../Animation'; | ||
| import { | ||
@@ -19,14 +18,4 @@ ACTIONS, | ||
| import mousewheelIcon from '../icons/mousewheel.svg'; | ||
| import { | ||
| clone, | ||
| distance, | ||
| each, | ||
| getClosest, | ||
| getEventKey, | ||
| getPosition, | ||
| isEmpty, | ||
| isFullscreenEnabled, | ||
| normalizeWheel, | ||
| throttle | ||
| } from '../utils'; | ||
| import { clone, distance, each, getClosest, getPosition, isEmpty, isFullscreenEnabled, normalizeWheel, throttle } from '../utils'; | ||
| import { Animation } from '../utils/Animation'; | ||
| import { PressHandler } from '../utils/PressHandler'; | ||
@@ -204,10 +193,8 @@ import { AbstractService } from './AbstractService'; | ||
| * @summary Handles keyboard events | ||
| * @param {KeyboardEvent} evt | ||
| * @param {KeyboardEvent} e | ||
| * @private | ||
| */ | ||
| __onKeyDown(evt) { | ||
| const key = getEventKey(evt); | ||
| __onKeyDown(e) { | ||
| if (this.config.mousewheelCtrlKey) { | ||
| this.state.ctrlKeyDown = key === KEY_CODES.Control; | ||
| this.state.ctrlKeyDown = e.key === KEY_CODES.Control; | ||
@@ -220,2 +207,7 @@ if (this.state.ctrlKeyDown) { | ||
| const e2 = this.psv.trigger(EVENTS.KEY_PRESS, e.key); | ||
| if (e2.isDefaultPrevented()) { | ||
| return; | ||
| } | ||
| if (!this.state.keyboardEnabled) { | ||
@@ -225,8 +217,8 @@ return; | ||
| if (this.config.keyboard[key] === ACTIONS.TOGGLE_AUTOROTATE) { | ||
| if (this.config.keyboard[e.key] === ACTIONS.TOGGLE_AUTOROTATE) { | ||
| this.psv.toggleAutorotate(); | ||
| } | ||
| else if (this.config.keyboard[key] && !this.state.keyHandler.time) { | ||
| else if (this.config.keyboard[e.key] && !this.state.keyHandler.time) { | ||
| /* eslint-disable */ | ||
| switch (this.config.keyboard[key]) { | ||
| switch (this.config.keyboard[e.key]) { | ||
| // @formatter:off | ||
@@ -233,0 +225,0 @@ case ACTIONS.ROTATE_LAT_UP: this.psv.dynamics.position.roll({latitude: false}); break; |
| import * as THREE from 'three'; | ||
| import { Animation } from '../Animation'; | ||
| import { Animation } from '../utils/Animation'; | ||
| import { EVENTS, MESH_USER_DATA, SPHERE_RADIUS } from '../data/constants'; | ||
@@ -137,6 +137,6 @@ import { SYSTEM } from '../data/system'; | ||
| case EVENTS.CONFIG_CHANGED: | ||
| if (evt.args[0].indexOf('fisheye') !== -1) { | ||
| if (evt.args[0].includes('fisheye')) { | ||
| this.__onPositionUpdated(); | ||
| } | ||
| if (evt.args[0].indexOf('mousemove') !== -1) { | ||
| if (evt.args[0].includes('mousemove')) { | ||
| this.canvasContainer.style.cursor = this.psv.config.mousemove ? 'move' : 'default'; | ||
@@ -246,3 +246,3 @@ } | ||
| this.psv.trigger(EVENTS.PANORAMA_LOADED); | ||
| this.psv.trigger(EVENTS.PANORAMA_LOADED, textureData); | ||
| } | ||
@@ -249,0 +249,0 @@ |
@@ -9,18 +9,3 @@ /** | ||
| export function toggleClass(element, className, active) { | ||
| // manual implementation for IE11 and SVGElement | ||
| if (!element.classList) { | ||
| let currentClassName = element.getAttribute('class') || ''; | ||
| const currentActive = currentClassName.indexOf(className) !== -1; | ||
| const regex = new RegExp('(?:^|\\s)' + className + '(?:\\s|$)'); | ||
| if ((active === undefined || active) && !currentActive) { | ||
| currentClassName += currentClassName.length > 0 ? ' ' + className : className; | ||
| } | ||
| else if (!active) { | ||
| currentClassName = currentClassName.replace(regex, ' '); | ||
| } | ||
| element.setAttribute('class', currentClassName); | ||
| } | ||
| else if (active === undefined) { | ||
| if (active === undefined) { | ||
| element.classList.toggle(className); | ||
@@ -92,11 +77,11 @@ } | ||
| export function getClosest(el, selector) { | ||
| const matches = el.matches || el.msMatchesSelector; | ||
| let test = el; | ||
| // When el is document or window, the matches does not exist | ||
| if (!matches) { | ||
| if (!el.matches) { | ||
| return null; | ||
| } | ||
| let test = el; | ||
| do { | ||
| if (matches.bind(test)(selector)) { | ||
| if (test.matches(selector)) { | ||
| return test; | ||
@@ -132,60 +117,2 @@ } | ||
| /** | ||
| * @summary Map between keyboard events `keyCode|which` and `key` | ||
| * @memberOf PSV.utils | ||
| * @type {Object<int, string>} | ||
| * @readonly | ||
| * @private | ||
| */ | ||
| const KEYMAP = { | ||
| 13 : 'Enter', | ||
| 17 : 'Control', | ||
| 27 : 'Escape', | ||
| 32 : ' ', | ||
| 33 : 'PageUp', | ||
| 34 : 'PageDown', | ||
| 37 : 'ArrowLeft', | ||
| 38 : 'ArrowUp', | ||
| 39 : 'ArrowRight', | ||
| 40 : 'ArrowDown', | ||
| 46 : 'Delete', | ||
| 107: '+', | ||
| 109: '-', | ||
| }; | ||
| /** | ||
| * @summary Map for non standard keyboard events `key` for IE and Edge | ||
| * @see https://github.com/shvaikalesh/shim-keyboard-event-key | ||
| * @type {Object<string, string>} | ||
| * @readonly | ||
| * @private | ||
| */ | ||
| const MS_KEYMAP = { | ||
| Add : '+', | ||
| Del : 'Delete', | ||
| Down : 'ArrowDown', | ||
| Esc : 'Escape', | ||
| Left : 'ArrowLeft', | ||
| Right : 'ArrowRight', | ||
| Spacebar: ' ', | ||
| Subtract: '-', | ||
| Up : 'ArrowUp', | ||
| }; | ||
| /** | ||
| * @summary Returns the key name of a KeyboardEvent | ||
| * @memberOf PSV.utils | ||
| * @param {KeyboardEvent} evt | ||
| * @returns {string} | ||
| */ | ||
| export function getEventKey(evt) { | ||
| let key = evt.key || KEYMAP[evt.keyCode || evt.which]; | ||
| if (key && MS_KEYMAP[key]) { | ||
| key = MS_KEYMAP[key]; | ||
| } | ||
| return key; | ||
| } | ||
| /** | ||
| * @summary Detects if fullscreen is enabled | ||
@@ -197,4 +124,3 @@ * @memberOf PSV.utils | ||
| export function isFullscreenEnabled(elt) { | ||
| /* eslint-disable-next-line max-len */ | ||
| return (document.fullscreenElement || document.mozFullScreenElement || document.webkitFullscreenElement || document.msFullscreenElement) === elt; | ||
| return (document.fullscreenElement || document.webkitFullscreenElement) === elt; | ||
| } | ||
@@ -208,4 +134,3 @@ | ||
| export function requestFullscreen(elt) { | ||
| /* eslint-disable-next-line max-len */ | ||
| (elt.requestFullscreen || elt.mozRequestFullScreen || elt.webkitRequestFullscreen || elt.msRequestFullscreen).call(elt); | ||
| (elt.requestFullscreen || elt.webkitRequestFullscreen).call(elt); | ||
| } | ||
@@ -218,4 +143,3 @@ | ||
| export function exitFullscreen() { | ||
| /* eslint-disable-next-line max-len */ | ||
| (document.exitFullscreen || document.mozCancelFullScreen || document.webkitExitFullscreen || document.msExitFullscreen).call(document); | ||
| (document.exitFullscreen || document.webkitExitFullscreen).call(document); | ||
| } | ||
@@ -222,0 +146,0 @@ |
@@ -1,7 +0,7 @@ | ||
| import { bound } from './index'; | ||
| import { PSVError } from '../PSVError'; | ||
| import { bound, loop } from './index'; | ||
| /** | ||
| * @summary Represents a variable that can dynamically change with time (using requestAnimationFrame) | ||
| * @memberOf PSV | ||
| * @package | ||
| * @memberOf PSV.utils | ||
| */ | ||
@@ -19,4 +19,5 @@ export class Dynamic { | ||
| * @param {number} [max] Maximum position | ||
| * @param {boolean} [loopValue] Loop value between min and max | ||
| */ | ||
| constructor(fn, defaultValue = 0, min = -Infinity, max = Infinity) { | ||
| constructor(fn, defaultValue = 0, min = -Infinity, max = Infinity, loopValue = false) { | ||
| /** | ||
@@ -77,2 +78,12 @@ * @type {Function} | ||
| /** | ||
| * @type {boolean} | ||
| * @private | ||
| */ | ||
| this.loopValue = loopValue; | ||
| if (loopValue && min !== 0) { | ||
| throw new PSVError('invalid config'); | ||
| } | ||
| if (this.fn) { | ||
@@ -98,3 +109,3 @@ this.fn(defaultValue); | ||
| this.mode = Dynamic.POSITION; | ||
| this.target = bound(position, this.min, this.max); | ||
| this.target = this.loopValue ? loop(position, this.max) : bound(position, this.min, this.max); | ||
| this.speedMult = speedMult; | ||
@@ -135,10 +146,9 @@ } | ||
| * Defines the current position and immediately stops movement | ||
| * @param {number} values | ||
| * @param {number} value | ||
| */ | ||
| setValue(values) { | ||
| const next = bound(values, this.min, this.max); | ||
| this.target = next; | ||
| setValue(value) { | ||
| this.target = this.loopValue ? loop(value, this.max) : bound(value, this.min, this.max); | ||
| this.mode = Dynamic.STOP; | ||
| if (next !== this.current) { | ||
| this.current = next; | ||
| if (this.target !== this.current) { | ||
| this.current = this.target; | ||
| if (this.fn) { | ||
@@ -158,2 +168,7 @@ this.fn(this.current); | ||
| if (this.mode === Dynamic.POSITION) { | ||
| // in loop mode, alter "current" to avoid crossing the origin | ||
| if (this.loopValue && Math.abs(this.target - this.current) > this.max / 2) { | ||
| this.current = this.current < this.target ? this.current + this.max : this.current - this.max; | ||
| } | ||
| const dstStop = this.currentSpeed * this.currentSpeed / (this.speed * this.speedMult * 4); | ||
@@ -188,3 +203,3 @@ if (Math.abs(this.target - this.current) <= dstStop) { | ||
| if (next !== null) { | ||
| next = bound(next, this.min, this.max); | ||
| next = this.loopValue ? loop(next, this.max) : bound(next, this.min, this.max); | ||
| if (next !== this.current) { | ||
@@ -191,0 +206,0 @@ this.current = next; |
@@ -5,4 +5,4 @@ import { bound } from './math'; | ||
| /** | ||
| * @summary Implementation of {@link PSV.Dynamic} for any number of variables, unused | ||
| * @memberOf PSV | ||
| * @summary Implementation of {@link PSV.utils.Dynamic} for any number of variables, unused | ||
| * @memberOf PSV.utils | ||
| * @private | ||
@@ -9,0 +9,0 @@ */ |
@@ -9,1 +9,6 @@ /** | ||
| export * from './psv'; | ||
| export * from './Animation'; | ||
| export * from './Dynamic'; | ||
| export * from './MultiDynamic'; | ||
| export * from './Slider'; |
@@ -14,2 +14,18 @@ /** | ||
| /** | ||
| * @summary Ensure a value is within 0 and `max` | ||
| * @param {number} value | ||
| * @param {number} max | ||
| * @return {number} | ||
| */ | ||
| export function loop(value, max) { | ||
| let result = value % max; | ||
| if (result < 0) { | ||
| result += max; | ||
| } | ||
| return result; | ||
| } | ||
| /** | ||
| * @summary Checks if a value is an integer | ||
@@ -16,0 +32,0 @@ * @memberOf PSV.utils |
| import { each } from './index'; | ||
| /** | ||
| * @summary Wrapper for multiple {@link PSV.Dynamic} evolving together | ||
| * @memberOf PSV | ||
| * @package | ||
| * @summary Wrapper for multiple {@link PSV.utils.Dynamic} evolving together | ||
| * @memberOf PSV.utils | ||
| */ | ||
@@ -23,3 +22,3 @@ export class MultiDynamic { | ||
| /** | ||
| * @param {Record<string, PSV.Dynamic>} dynamics | ||
| * @param {Record<string, PSV.utils.Dynamic>} dynamics | ||
| * @param {Function} [fn] Callback function | ||
@@ -36,3 +35,3 @@ */ | ||
| /** | ||
| * @type {Record<string, PSV.Dynamic>} | ||
| * @type {Record<string, PSV.utils.Dynamic>} | ||
| * @private | ||
@@ -39,0 +38,0 @@ * @readonly |
| /** | ||
| * @summary Helper for pressable things (buttons, keyboard) | ||
| * @description When the pressed thing goes up and was not pressed long enough, wait a bit more before execution | ||
| * @package | ||
| * @package | ||
| * @private | ||
| */ | ||
@@ -7,0 +6,0 @@ export class PressHandler { |
| import * as THREE from 'three'; | ||
| import { PSVError } from '../PSVError'; | ||
| import { bound } from './math'; | ||
| import { bound, loop } from './math'; | ||
@@ -299,8 +299,4 @@ /** | ||
| parsed = (zeroCenter ? parsed + Math.PI : parsed) % (Math.PI * 2); | ||
| parsed = loop(zeroCenter ? parsed + Math.PI : parsed, Math.PI * 2); | ||
| if (parsed < 0) { | ||
| parsed += Math.PI * 2; | ||
| } | ||
| return zeroCenter ? bound(parsed - Math.PI, -Math.PI / (halfCircle ? 2 : 1), Math.PI / (halfCircle ? 2 : 1)) : parsed; | ||
@@ -307,0 +303,0 @@ } |
| import * as THREE from 'three'; | ||
| import { EventEmitter } from 'uevent'; | ||
| import { Animation } from './Animation'; | ||
| import { Loader } from './components/Loader'; | ||
@@ -21,2 +20,4 @@ import { Navbar } from './components/Navbar'; | ||
| import { | ||
| Animation, | ||
| Dynamic, | ||
| each, | ||
@@ -31,2 +32,3 @@ exitFullscreen, | ||
| logWarn, | ||
| MultiDynamic, | ||
| pluginInterop, | ||
@@ -37,4 +39,2 @@ requestFullscreen, | ||
| } from './utils'; | ||
| import { Dynamic } from './utils/Dynamic'; | ||
| import { MultiDynamic } from './utils/MultiDynamic'; | ||
@@ -229,3 +229,3 @@ THREE.Cache.enabled = true; | ||
| /** | ||
| * @member {Record<string, PSV.Dynamic>} | ||
| * @member {Record<string, PSV.utils.Dynamic>} | ||
| * @package | ||
@@ -241,7 +241,7 @@ */ | ||
| position: new MultiDynamic({ | ||
| longitude: new Dynamic(null, this.config.defaultLong), | ||
| longitude: new Dynamic(null, this.config.defaultLong, 0, 2 * Math.PI, true), | ||
| latitude : new Dynamic(null, this.config.defaultLat, -Math.PI / 2, Math.PI / 2), | ||
| }, (position) => { | ||
| this.dataHelper.sphericalCoordsToVector3(position, this.prop.direction); | ||
| this.trigger(EVENTS.POSITION_UPDATED, this.dataHelper.cleanPosition(position)); | ||
| this.trigger(EVENTS.POSITION_UPDATED, position); | ||
| }), | ||
@@ -481,2 +481,5 @@ }; | ||
| } | ||
| if (options.description === undefined) { | ||
| options.description = this.config.description; | ||
| } | ||
@@ -494,2 +497,3 @@ const positionProvided = isExtendedPosition(options); | ||
| this.config.caption = options.caption; | ||
| this.config.description = options.description; | ||
@@ -598,3 +602,4 @@ const done = (err) => { | ||
| case 'caption': | ||
| this.navbar.setCaption(value); | ||
| case 'description': | ||
| this.navbar.setCaption(this.config.caption); | ||
| break; | ||
@@ -601,0 +606,0 @@ |
@@ -60,3 +60,3 @@ import { Mesh } from 'three'; | ||
| /** | ||
| * @abstract | ||
| * @summary Cleanup a loaded texture, used on load abort | ||
| */ | ||
@@ -63,0 +63,0 @@ disposeTexture(textureData: TextureData); |
@@ -15,2 +15,7 @@ import { AbstractComponent } from '../components/AbstractComponent'; | ||
| /** | ||
| * @summary Identifier to declare a group of buttons | ||
| */ | ||
| static groupId?: string; | ||
| /** | ||
| * @summary SVG icon name injected in the button | ||
@@ -17,0 +22,0 @@ */ |
| import { AbstractComponent } from './AbstractComponent'; | ||
| export type NotificationOptions = { | ||
| id?: string; | ||
| content: string; | ||
@@ -5,0 +6,0 @@ timeout?: number; |
| import * as CONSTANTS from './data/constants'; | ||
| import * as utils from './utils'; | ||
| export * from './models'; | ||
| export * from './data/config'; | ||
| export * from './data/system'; | ||
| export * from './adapters/AbstractAdapter'; | ||
| export * from './adapters/equirectangular'; | ||
| export * from './buttons/AbstractButton'; | ||
| export * from './plugins/AbstractPlugin'; | ||
| export * from './Animation'; | ||
| export * from './PSVError'; | ||
| export * from './components/AbstractComponent'; | ||
| export * from './components/Loader'; | ||
| export * from './components/Navbar'; | ||
| export * from './components/Loader'; | ||
| export * from './components/Notification'; | ||
@@ -19,6 +14,15 @@ export * from './components/Overlay'; | ||
| export * from './components/Tooltip'; | ||
| export * from './data/config'; | ||
| export * from './data/system'; | ||
| export * from './models'; | ||
| export * from './plugins/AbstractPlugin'; | ||
| export * from './PSVError'; | ||
| export * from './services/DataHelper'; | ||
| export * from './services/TextureLoader'; | ||
| export * from './services/TooltipRenderer'; | ||
| /** | ||
| * @deprecated use `utils.Animation` | ||
| */ | ||
| export * from './utils/Animation'; | ||
| export * from './Viewer'; | ||
| export { CONSTANTS, utils }; |
@@ -79,2 +79,3 @@ import { Texture } from 'three'; | ||
| caption?: string; | ||
| description?: string; | ||
| transition?: boolean | number; | ||
@@ -81,0 +82,0 @@ showLoader?: boolean; |
@@ -18,2 +18,4 @@ import { AbstractPlugin, Viewer } from '../..'; | ||
| static EVENTS: typeof EVENTS; | ||
| constructor(psv: Viewer, options: GyroscopePluginOptions); | ||
@@ -20,0 +22,0 @@ |
@@ -138,2 +138,4 @@ import { AbstractPlugin, Animation, ExtendedPosition, Viewer } from '../..'; | ||
| static EVENTS: typeof EVENTS; | ||
| constructor(psv: Viewer, options: MarkersPluginOptions); | ||
@@ -140,0 +142,0 @@ |
@@ -24,2 +24,4 @@ import { AbstractPlugin, Viewer } from '../..'; | ||
| static EVENTS: typeof EVENTS; | ||
| constructor(psv: Viewer, options: ResolutionPluginOptions); | ||
@@ -26,0 +28,0 @@ |
@@ -51,2 +51,4 @@ import { Event } from 'uevent'; | ||
| static EVENTS: typeof EVENTS; | ||
| constructor(psv: Viewer); | ||
@@ -53,0 +55,0 @@ |
@@ -13,2 +13,4 @@ import { AbstractPlugin, Viewer } from '../..'; | ||
| static EVENTS: typeof EVENTS; | ||
| constructor(psv: Viewer); | ||
@@ -15,0 +17,0 @@ |
@@ -17,2 +17,3 @@ import { Event } from 'uevent'; | ||
| caption?: string; | ||
| description?: string; | ||
| markers?: Marker[]; | ||
@@ -80,2 +81,9 @@ }; | ||
| export const MODE_CLIENT = 'client'; | ||
| export const MODE_SERVER = 'server'; | ||
| export const MODE_MANUAL = 'manual'; | ||
| export const MODE_GPS = 'gps'; | ||
| export const MODE_MARKERS = 'markers'; | ||
| export const MODE_3D = '3d'; | ||
| /** | ||
@@ -86,2 +94,10 @@ * @summary Replaces the standard autorotate animation by a smooth transition between multiple points | ||
| static EVENTS: typeof EVENTS; | ||
| static MODE_CLIENT: typeof MODE_CLIENT; | ||
| static MODE_SERVER: typeof MODE_SERVER; | ||
| static MODE_3D: typeof MODE_3D; | ||
| static MODE_MARKERS: typeof MODE_MARKERS; | ||
| static MODE_MANUAL: typeof MODE_MANUAL; | ||
| static MODE_GPS: typeof MODE_GPS; | ||
| constructor(psv: Viewer, options: VirtualTourPluginPluginOptions); | ||
@@ -88,0 +104,0 @@ |
@@ -27,7 +27,2 @@ /** | ||
| /** | ||
| * @summary Returns the key name of a KeyboardEvent | ||
| */ | ||
| export function getEventKey(evt: KeyboardEvent): string; | ||
| /** | ||
| * @summary Detects if fullscreen is enabled | ||
@@ -34,0 +29,0 @@ */ |
@@ -5,1 +5,3 @@ export * from './browser'; | ||
| export * from './psv'; | ||
| export * from './Animation'; |
| import { Vector3 } from 'three'; | ||
| import { Event, EventEmitter } from 'uevent'; | ||
| import { AdapterConstructor } from './adapters/AbstractAdapter'; | ||
| import { Animation } from './Animation'; | ||
| import { Animation } from './utils/Animation'; | ||
| import { Loader } from './components/Loader'; | ||
@@ -21,3 +21,4 @@ import { Navbar } from './components/Navbar'; | ||
| Position, | ||
| Size | ||
| Size, | ||
| TextureData | ||
| } from './models'; | ||
@@ -37,2 +38,3 @@ import { AbstractPlugin, PluginConstructor } from './plugins/AbstractPlugin'; | ||
| caption?: string; | ||
| description?: string; | ||
| downloadUrl?: string; | ||
@@ -344,3 +346,3 @@ loadingImg?: string; | ||
| */ | ||
| on(e: 'hide-notification', cb: (e: Event) => void): this; | ||
| on(e: 'hide-notification', cb: (e: Event, id: string | undefined) => void): this; | ||
| /** | ||
@@ -355,2 +357,6 @@ * @summary Triggered when the overlay is hidden | ||
| /** | ||
| * @summary Triggered when a key is pressed, can be cancelled | ||
| */ | ||
| on(e: 'key-press', cb: (e: Event, key: string) => void): this; | ||
| /** | ||
| * @summary Triggered when the loader value changes | ||
@@ -366,3 +372,3 @@ */ | ||
| */ | ||
| on(e: 'panorama-loaded', cb: (e: Event) => void): this; | ||
| on(e: 'panorama-loaded', cb: (e: Event, textureData: TextureData) => void): this; | ||
| /** | ||
@@ -379,3 +385,3 @@ * @summary Triggered when the view longitude and/or latitude changes | ||
| */ | ||
| on(e: 'show-notification', cb: (e: Event) => void): this; | ||
| on(e: 'show-notification', cb: (e: Event, id: string | undefined) => void): this; | ||
| /** | ||
@@ -382,0 +388,0 @@ * @summary Trigered when the overlay is shown |
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is too big to display
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is too big to display
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
New alerts
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
Long strings
Supply chain riskContains long string literals, which may be a sign of obfuscated or packed code.
Found 1 instance in 1 package
Fixed alerts
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
Improved metrics
- Total package byte prevSize
- increased by11.33%
2271218
- Number of package files
- increased by13.33%
255
- Lines of code
- increased by11.72%
38339
Worsened metrics
- Number of low supply chain risk alerts
- increased by33.33%
4
Dependency changes
+ Addedthree@0.139.2(transitive)
- Removedthree@0.138.3(transitive)
Updatedthree@^0.139.0