@shopware-ag/dive 1.6.5 → 1.8.0

package/build/dive.d.cts

@@ -1,5 +1,5 @@
 import { ShadowMapType, ToneMapping, WebGLRenderer, Scene, Camera, PerspectiveCamera, Box3, Vector3Like, Mesh, ColorRepresentation, Object3D, Intersection, Vector2, Raycaster, Vector3 } from 'three';
-import { OrbitControls } from 'three/examples/jsm/Addons.js';
+import { OrbitControls } from 'three/examples/jsm/controls/OrbitControls';
 import { Tween } from '@tweenjs/tween.js';
 import { TransformControls } from 'three/examples/jsm/Addons';
 
@@ -10,6 +10,7 @@ type DIVERendererSettings = {
     shadowMapEnabled: boolean;
     shadowMapType: ShadowMapType;
     toneMapping: ToneMapping;
+    canvas?: HTMLCanvasElement;
 };
 /**
  * A changed version of the WebGLRenderer.
@@ -24,7 +25,7 @@ declare class DIVERenderer extends WebGLRenderer {
     private force;
     private preRenderCallbacks;
     private postRenderCallbacks;
-    constructor(rendererSettings?: DIVERendererSettings);
+    constructor(rendererSettings?: Partial<DIVERendererSettings>);
     Dispose(): void;
     StartRenderer(scene: Scene, cam: Camera): void;
     PauseRenderer(): void;
@@ -83,7 +84,7 @@ declare class DIVEPerspectiveCamera extends PerspectiveCamera {
     static readonly EDITOR_VIEW_LAYER_MASK: number;
     static readonly LIVE_VIEW_LAYER_MASK = 16;
     onSetCameraLayer: (mask: number) => void;
-    constructor(settings?: DIVEPerspectiveCameraSettings);
+    constructor(settings?: Partial<DIVEPerspectiveCameraSettings>);
     OnResize(width: number, height: number): void;
     SetCameraLayer(layer: 'LIVE' | 'EDITOR'): void;
 }
@@ -123,7 +124,7 @@ declare class DIVEOrbitControls extends OrbitControls {
     object: DIVEPerspectiveCamera;
     domElement: HTMLCanvasElement;
     private _removePreRenderCallback;
-    constructor(camera: DIVEPerspectiveCamera, renderer: DIVERenderer, animationSystem: DIVEAnimationSystem, settings?: DIVEOrbitControlsSettings);
+    constructor(camera: DIVEPerspectiveCamera, renderer: DIVERenderer, animationSystem: DIVEAnimationSystem, settings?: Partial<DIVEOrbitControlsSettings>);
     Dispose(): void;
     ComputeEncompassingView(bb: Box3): {
         position: Vector3Like;
@@ -676,12 +677,41 @@ declare const DIVEMath: {
     signedAngleTo: typeof signedAngleTo;
 };
 
+declare class DIVEInfo {
+    private static _supportsWebXR;
+    /**
+     *
+     * @returns The system the user is using. Possible values are "Android", "iOS", "Windows", "MacOS", "Linux" or "Unknown".
+     */
+    static GetSystem(): string;
+    /**
+     * @returns A promise that resolves to a boolean indicating whether the user's device supports WebXR.
+     */
+    static GetSupportsWebXR(): Promise<boolean>;
+    /**
+     * @returns A boolean indicating whether the user's device supports AR Quick Look.
+     */
+    static GetSupportsARQuickLook(): boolean;
+    /**
+     * @returns A boolean indicating whether the user's device is a mobile device.
+     */
+    static get isMobile(): boolean;
+    /**
+     * @returns A boolean indicating whether the user's device is a desktop device.
+     */
+    static get isDesktop(): boolean;
+    /**
+     * @returns A promise that resolves to a boolean indicating whether the user's device is capable of AR.
+     */
+    static GetIsARCapable(): Promise<boolean>;
+}
+
 type DIVESettings = {
     autoResize: boolean;
     displayAxes: boolean;
-    renderer: DIVERendererSettings;
-    perspectiveCamera: DIVEPerspectiveCameraSettings;
-    orbitControls: DIVEOrbitControlsSettings;
+    renderer: Partial<DIVERendererSettings>;
+    perspectiveCamera: Partial<DIVEPerspectiveCameraSettings>;
+    orbitControls: Partial<DIVEOrbitControlsSettings>;
 };
 declare const DIVEDefaultSettings: DIVESettings;
 /**
@@ -722,6 +752,7 @@ declare class DIVE {
     private axisCamera;
     get Communication(): DIVECommunication;
     get Canvas(): HTMLCanvasElement;
+    get Info(): DIVEInfo;
     set Settings(settings: Partial<DIVESettings>);
     constructor(settings?: Partial<DIVESettings>);
     Dispose(): void;

package/build/dive.d.ts

@@ -1,5 +1,5 @@
 import { ShadowMapType, ToneMapping, WebGLRenderer, Scene, Camera, PerspectiveCamera, Box3, Vector3Like, Mesh, ColorRepresentation, Object3D, Intersection, Vector2, Raycaster, Vector3 } from 'three';
-import { OrbitControls } from 'three/examples/jsm/Addons.js';
+import { OrbitControls } from 'three/examples/jsm/controls/OrbitControls';
 import { Tween } from '@tweenjs/tween.js';
 import { TransformControls } from 'three/examples/jsm/Addons';
 
@@ -10,6 +10,7 @@ type DIVERendererSettings = {
     shadowMapEnabled: boolean;
     shadowMapType: ShadowMapType;
     toneMapping: ToneMapping;
+    canvas?: HTMLCanvasElement;
 };
 /**
  * A changed version of the WebGLRenderer.
@@ -24,7 +25,7 @@ declare class DIVERenderer extends WebGLRenderer {
     private force;
     private preRenderCallbacks;
     private postRenderCallbacks;
-    constructor(rendererSettings?: DIVERendererSettings);
+    constructor(rendererSettings?: Partial<DIVERendererSettings>);
     Dispose(): void;
     StartRenderer(scene: Scene, cam: Camera): void;
     PauseRenderer(): void;
@@ -83,7 +84,7 @@ declare class DIVEPerspectiveCamera extends PerspectiveCamera {
     static readonly EDITOR_VIEW_LAYER_MASK: number;
     static readonly LIVE_VIEW_LAYER_MASK = 16;
     onSetCameraLayer: (mask: number) => void;
-    constructor(settings?: DIVEPerspectiveCameraSettings);
+    constructor(settings?: Partial<DIVEPerspectiveCameraSettings>);
     OnResize(width: number, height: number): void;
     SetCameraLayer(layer: 'LIVE' | 'EDITOR'): void;
 }
@@ -123,7 +124,7 @@ declare class DIVEOrbitControls extends OrbitControls {
     object: DIVEPerspectiveCamera;
     domElement: HTMLCanvasElement;
     private _removePreRenderCallback;
-    constructor(camera: DIVEPerspectiveCamera, renderer: DIVERenderer, animationSystem: DIVEAnimationSystem, settings?: DIVEOrbitControlsSettings);
+    constructor(camera: DIVEPerspectiveCamera, renderer: DIVERenderer, animationSystem: DIVEAnimationSystem, settings?: Partial<DIVEOrbitControlsSettings>);
     Dispose(): void;
     ComputeEncompassingView(bb: Box3): {
         position: Vector3Like;
@@ -676,12 +677,41 @@ declare const DIVEMath: {
     signedAngleTo: typeof signedAngleTo;
 };
 
+declare class DIVEInfo {
+    private static _supportsWebXR;
+    /**
+     *
+     * @returns The system the user is using. Possible values are "Android", "iOS", "Windows", "MacOS", "Linux" or "Unknown".
+     */
+    static GetSystem(): string;
+    /**
+     * @returns A promise that resolves to a boolean indicating whether the user's device supports WebXR.
+     */
+    static GetSupportsWebXR(): Promise<boolean>;
+    /**
+     * @returns A boolean indicating whether the user's device supports AR Quick Look.
+     */
+    static GetSupportsARQuickLook(): boolean;
+    /**
+     * @returns A boolean indicating whether the user's device is a mobile device.
+     */
+    static get isMobile(): boolean;
+    /**
+     * @returns A boolean indicating whether the user's device is a desktop device.
+     */
+    static get isDesktop(): boolean;
+    /**
+     * @returns A promise that resolves to a boolean indicating whether the user's device is capable of AR.
+     */
+    static GetIsARCapable(): Promise<boolean>;
+}
+
 type DIVESettings = {
     autoResize: boolean;
     displayAxes: boolean;
-    renderer: DIVERendererSettings;
-    perspectiveCamera: DIVEPerspectiveCameraSettings;
-    orbitControls: DIVEOrbitControlsSettings;
+    renderer: Partial<DIVERendererSettings>;
+    perspectiveCamera: Partial<DIVEPerspectiveCameraSettings>;
+    orbitControls: Partial<DIVEOrbitControlsSettings>;
 };
 declare const DIVEDefaultSettings: DIVESettings;
 /**
@@ -722,6 +752,7 @@ declare class DIVE {
     private axisCamera;
     get Communication(): DIVECommunication;
     get Canvas(): HTMLCanvasElement;
+    get Info(): DIVEInfo;
     set Settings(settings: Partial<DIVESettings>);
     constructor(settings?: Partial<DIVESettings>);
     Dispose(): void;

package/build/dive.js

@@ -449,7 +449,12 @@ var init_PerspectiveCamera = __esm({
     };
     _DIVEPerspectiveCamera = class _DIVEPerspectiveCamera extends PerspectiveCamera {
       constructor(settings = DIVEPerspectiveCameraDefaultSettings) {
-        super(settings.fov, 1, settings.near, settings.far);
+        super(
+          settings.fov || DIVEPerspectiveCameraDefaultSettings.fov,
+          1,
+          settings.near || DIVEPerspectiveCameraDefaultSettings.near,
+          settings.far || DIVEPerspectiveCameraDefaultSettings.far
+        );
         this.onSetCameraLayer = () => {
         };
         this.layers.mask = _DIVEPerspectiveCamera.EDITOR_VIEW_LAYER_MASK;
@@ -524,14 +529,16 @@ var DIVERendererDefaultSettings = {
   stencil: false,
   shadowMapEnabled: true,
   shadowMapType: PCFSoftShadowMap,
-  toneMapping: NoToneMapping
+  toneMapping: NoToneMapping,
+  canvas: void 0
 };
 var DIVERenderer = class extends WebGLRenderer {
   constructor(rendererSettings = DIVERendererDefaultSettings) {
     super({
-      antialias: rendererSettings.antialias,
-      alpha: rendererSettings.alpha,
-      preserveDrawingBuffer: true
+      antialias: rendererSettings.antialias || DIVERendererDefaultSettings.antialias,
+      alpha: rendererSettings.alpha || DIVERendererDefaultSettings.alpha,
+      preserveDrawingBuffer: true,
+      canvas: rendererSettings.canvas
     });
     // basic functionality members
     this.paused = false;
@@ -541,9 +548,9 @@ var DIVERenderer = class extends WebGLRenderer {
     this.preRenderCallbacks = /* @__PURE__ */ new Map();
     this.postRenderCallbacks = /* @__PURE__ */ new Map();
     this.setPixelRatio(window.devicePixelRatio);
-    this.shadowMap.enabled = rendererSettings.shadowMapEnabled;
-    this.shadowMap.type = rendererSettings.shadowMapType;
-    this.toneMapping = rendererSettings.toneMapping;
+    this.shadowMap.enabled = rendererSettings.shadowMapEnabled || DIVERendererDefaultSettings.shadowMapEnabled;
+    this.shadowMap.type = rendererSettings.shadowMapType || DIVERendererDefaultSettings.shadowMapType;
+    this.toneMapping = rendererSettings.toneMapping || DIVERendererDefaultSettings.toneMapping;
     this.debug.checkShaderErrors = false;
   }
   // Stops renderings and disposes the renderer.
@@ -1552,7 +1559,7 @@ var DIVEScene = class extends Scene2 {
 init_PerspectiveCamera();
 
 // src/controls/OrbitControls.ts
-import { OrbitControls } from "three/examples/jsm/Addons.js";
+import { OrbitControls } from "three/examples/jsm/controls/OrbitControls";
 import { MathUtils as MathUtils2, Vector3 as Vector33 } from "three";
 import { Easing } from "@tweenjs/tween.js";
 var DIVEOrbitControlsDefaultSettings = {
@@ -1584,8 +1591,11 @@ var _DIVEOrbitControls = class _DIVEOrbitControls extends OrbitControls {
     this._removePreRenderCallback = () => {
       renderer.RemovePreRenderCallback(id);
     };
-    this.enableDamping = settings.enableDamping;
-    this.dampingFactor = settings.dampingFactor;
+    this.enableDamping = settings.enableDamping || DIVEOrbitControlsDefaultSettings.enableDamping;
+    this.dampingFactor = settings.dampingFactor || DIVEOrbitControlsDefaultSettings.dampingFactor;
+    this.object.position.set(0, 2, 2);
+    this.target.copy({ x: 0, y: 0.5, z: 0 });
+    this.update();
   }
   Dispose() {
     this._removePreRenderCallback();
@@ -1939,6 +1949,105 @@ var DIVEMath = {
 
 // src/dive.ts
 import { generateUUID as generateUUID2 } from "three/src/math/MathUtils";
+
+// src/info/Info.ts
+var DIVEInfo = class {
+  /**
+   *
+   * @returns The system the user is using. Possible values are "Android", "iOS", "Windows", "MacOS", "Linux" or "Unknown".
+   */
+  static GetSystem() {
+    const platform = navigator.platform;
+    if (/Android/.test(navigator.userAgent)) {
+      return "Android";
+    } else if (/iPhone|iPad|iPod/.test(navigator.userAgent)) {
+      return "iOS";
+    } else if (platform.startsWith("Win")) {
+      return "Windows";
+    } else if (platform.startsWith("Mac")) {
+      return "MacOS";
+    } else if (platform.startsWith("Linux")) {
+      return "Linux";
+    } else {
+      return "Unknown";
+    }
+  }
+  /**
+   * @returns A promise that resolves to a boolean indicating whether the user's device supports WebXR.
+   */
+  static GetSupportsWebXR() {
+    return __async(this, null, function* () {
+      if (this._supportsWebXR !== null) {
+        return this._supportsWebXR;
+      }
+      if (!navigator.xr) {
+        this._supportsWebXR = false;
+        return this._supportsWebXR;
+      }
+      try {
+        const supported = yield navigator.xr.isSessionSupported("immersive-ar");
+        this._supportsWebXR = supported;
+      } catch (error) {
+        this._supportsWebXR = false;
+      }
+      return this._supportsWebXR;
+    });
+  }
+  /**
+   * @returns A boolean indicating whether the user's device supports AR Quick Look.
+   */
+  static GetSupportsARQuickLook() {
+    const a = document.createElement("a");
+    if (a.relList.supports("ar")) {
+      return true;
+    }
+    const userAgent = navigator.userAgent;
+    const isIOS = /iPad|iPhone|iPod/.test(userAgent) && !window.MSStream;
+    if (!isIOS) {
+      return false;
+    }
+    const match = userAgent.match(/OS (\d+)_/);
+    if (!match || match.length < 2) {
+      return false;
+    }
+    const iOSVersion = parseInt(match[1], 10);
+    const minQuickLookVersion = 12;
+    if (iOSVersion < minQuickLookVersion) {
+      return false;
+    }
+    const isSupportedBrowser = /^((?!chrome|android).)*safari|CriOS|FxiOS/i.test(userAgent);
+    if (isSupportedBrowser) {
+      return true;
+    }
+    return false;
+  }
+  /**
+   * @returns A boolean indicating whether the user's device is a mobile device.
+   */
+  static get isMobile() {
+    return this.GetSystem() === "Android" || this.GetSystem() === "iOS";
+  }
+  /**
+   * @returns A boolean indicating whether the user's device is a desktop device.
+   */
+  static get isDesktop() {
+    return !this.isMobile;
+  }
+  /**
+   * @returns A promise that resolves to a boolean indicating whether the user's device is capable of AR.
+   */
+  static GetIsARCapable() {
+    return __async(this, null, function* () {
+      if (this.GetSupportsARQuickLook()) {
+        return true;
+      }
+      return yield this.GetSupportsWebXR();
+    });
+  }
+};
+DIVEInfo._supportsWebXR = null;
+
+// src/dive.ts
 var DIVEDefaultSettings = {
   autoResize: true,
   displayAxes: false,
@@ -2002,20 +2111,23 @@ var DIVE = class _DIVE {
   get Canvas() {
     return this.renderer.domElement;
   }
+  get Info() {
+    return DIVEInfo;
+  }
   // setters
   set Settings(settings) {
     var _a;
     const settingsDelta = getObjectDelta(this._settings, settings);
     if (settingsDelta.renderer) this.renderer = new DIVERenderer(this._settings.renderer);
     if (settingsDelta.perspectiveCamera) {
-      this.perspectiveCamera.fov = settingsDelta.perspectiveCamera.fov;
-      this.perspectiveCamera.near = settingsDelta.perspectiveCamera.near;
-      this.perspectiveCamera.far = settingsDelta.perspectiveCamera.far;
+      if (settingsDelta.perspectiveCamera.fov !== void 0) this.perspectiveCamera.fov = settingsDelta.perspectiveCamera.fov;
+      if (settingsDelta.perspectiveCamera.near !== void 0) this.perspectiveCamera.near = settingsDelta.perspectiveCamera.near;
+      if (settingsDelta.perspectiveCamera.far !== void 0) this.perspectiveCamera.far = settingsDelta.perspectiveCamera.far;
       this.perspectiveCamera.OnResize(this.renderer.domElement.width, this.renderer.domElement.height);
     }
     if (settingsDelta.orbitControls) {
-      this.orbitControls.enableDamping = settingsDelta.orbitControls.enableDamping;
-      this.orbitControls.dampingFactor = settingsDelta.orbitControls.dampingFactor;
+      if (settingsDelta.orbitControls.enableDamping !== void 0) this.orbitControls.enableDamping = settingsDelta.orbitControls.enableDamping;
+      if (settingsDelta.orbitControls.dampingFactor !== void 0) this.orbitControls.dampingFactor = settingsDelta.orbitControls.dampingFactor;
     }
     if (settingsDelta.autoResize !== this._settings.autoResize) {
       if (settingsDelta.autoResize) {
@@ -2058,6 +2170,7 @@ var DIVE = class _DIVE {
         console.log(this.scene);
       }
     };
+    console.log("DIVE initialized");
   }
   Dispose() {
     var _a;