diff --git a/packages/viewer/example/example.html b/packages/viewer/example/example.html index c84d7f574..56b938bbf 100644 --- a/packages/viewer/example/example.html +++ b/packages/viewer/example/example.html @@ -5,21 +5,13 @@ Speckle Viewer - + + @@ -29,28 +21,19 @@

Viewer

Controls summary:
-

Click an object to select it. Double click it to focus on it. Press `esc` to clear the selection. Press `shift-s` to toggle a section plane. Press `s` while the section plane is active to toggle its control mode. Double click anywhere outside an object to zoom extents to the entire scene.

+

Click an object to select it. Double click it to focus on it. Press `esc` to clear the selection. Press `shift-s` to toggle a section plane. Press `s` while the section plane is active to toggle its control mode. Double click anywhere outside an object to zoom extents to the entire scene.

+
- - -
-
- - - - - -
diff --git a/packages/viewer/package-lock.json b/packages/viewer/package-lock.json index 2ec9abb95..21fcabdeb 100644 --- a/packages/viewer/package-lock.json +++ b/packages/viewer/package-lock.json @@ -1,6 +1,6 @@ { "name": "@speckle/viewer", - "version": "2.0.0", + "version": "2.0.1", "lockfileVersion": 1, "requires": true, "dependencies": { @@ -2009,6 +2009,12 @@ "@sinonjs/commons": "^1.7.0" } }, + "@speckle/objectloader": { + "version": "2.0.0", + "resolved": "https://registry.npmjs.org/@speckle/objectloader/-/objectloader-2.0.0.tgz", + "integrity": "sha512-s1vH5gGzB5nJgrMFESaQqGJZuzVOAViKP1Xk9ZZV/zSP2b4vpkINMDC1WQvP9j2kqzCjQcQfkl+KqM6IuGvHgg==", + "dev": true + }, "@types/anymatch": { "version": "1.3.1", "resolved": "https://registry.npmjs.org/@types/anymatch/-/anymatch-1.3.1.tgz", @@ -3366,9 +3372,9 @@ "dev": true }, "camera-controls": { - "version": "1.26.0", - "resolved": "https://registry.npmjs.org/camera-controls/-/camera-controls-1.26.0.tgz", - "integrity": "sha512-oR8NOW63i+Ei2J59TqIvW3UsVaPfpzgAnyO16qO8n2a1lPGsjzcmsvJjby+7VIo3ORHGYldBVK3RSfeSW8uWHg==" + "version": "1.28.0", + "resolved": "https://registry.npmjs.org/camera-controls/-/camera-controls-1.28.0.tgz", + "integrity": "sha512-V9HIwjcdD843RpToJjW2fUZfZUQaFIA2/Wx87+zq781/tJGzjE1g1PBeMTOV8oTGl8cskS5yV8AqtBn9+HlrUQ==" }, "caniuse-lite": { "version": "1.0.30001173", diff --git a/packages/viewer/package.json b/packages/viewer/package.json index 3036b8961..ae9b41e71 100644 --- a/packages/viewer/package.json +++ b/packages/viewer/package.json @@ -20,7 +20,13 @@ }, "author": "AEC Systems", "license": "Apache-2.0", - "keywords": ["speckle", "aec", "3d", "3d viewer", "threejs"], + "keywords": [ + "speckle", + "aec", + "3d", + "3d viewer", + "threejs" + ], "devDependencies": { "@babel/cli": "7.12.10", "@babel/core": "7.12.10", @@ -46,8 +52,8 @@ "@speckle/objectloader": "^2.0.0" }, "dependencies": { - "camera-controls": "^1.26.0", + "camera-controls": "^1.28.0", "lodash.debounce": "^4.0.8", - "three": "^0.124.0" + "three": "0.124.0" } } diff --git a/packages/viewer/src/modules/InteractionHandler.js b/packages/viewer/src/modules/InteractionHandler.js index 5c988fda0..d755e8ffe 100644 --- a/packages/viewer/src/modules/InteractionHandler.js +++ b/packages/viewer/src/modules/InteractionHandler.js @@ -101,37 +101,37 @@ export default class InteractionHandler { this.toggleSectionBox( ) } - zoomToObject( target ) { + zoomToObject( target, fit = 1.2, transition = true ) { const box = new THREE.Box3().setFromObject( target ) - this.zoomToBox( box ) + this.zoomToBox( box, fit, transition ) } - zoomExtents() { + zoomExtents( fit = 1.2, transition = true ) { if ( this.sectionBox.display.visible ) { this.zoomToObject( this.sectionBox.boxMesh ) return } if ( this.viewer.sceneManager.objects.length === 0 ) { let box = new THREE.Box3( new THREE.Vector3( -1,-1,-1 ), new THREE.Vector3( 1,1,1 ) ) - this.zoomToBox( box ) + this.zoomToBox( box, fit, transition ) this.viewer.controls.setBoundary( box ) return } let box = new THREE.Box3().setFromObject( this.viewer.sceneManager.userObjects ) - this.zoomToBox( box ) + this.zoomToBox( box, fit, transition ) this.viewer.controls.setBoundary( box ) } - zoomToBox( box ) { - const fitOffset = 1.2 + zoomToBox( box, fit = 1.2, transition = true ) { + const fitOffset = fit const size = box.getSize( new THREE.Vector3() ) let target = new THREE.Sphere() box.getBoundingSphere( target ) target.radius = target.radius * fitOffset - this.viewer.controls.fitToSphere( target, true ) + this.viewer.controls.fitToSphere( target, transition ) const maxSize = Math.max( size.x, size.y, size.z ) const fitHeightDistance = maxSize / ( 2 * Math.atan( Math.PI * this.viewer.camera.fov / 360 ) ) @@ -144,4 +144,12 @@ export default class InteractionHandler { this.viewer.camera.far = distance * 100 this.viewer.camera.updateProjectionMatrix() } + + rotateCamera( azimuthAngle = 0.261799, polarAngle = 0, transition = true ) { + this.viewer.controls.rotate( azimuthAngle, polarAngle, transition ) + } + + screenshot() { + return this.viewer.renderer.domElement.toDataUrl() + } } diff --git a/packages/viewer/src/modules/SceneObjectManager.js b/packages/viewer/src/modules/SceneObjectManager.js index 93db9978c..d92f1194b 100644 --- a/packages/viewer/src/modules/SceneObjectManager.js +++ b/packages/viewer/src/modules/SceneObjectManager.js @@ -6,7 +6,7 @@ import debounce from 'lodash.debounce' */ export default class SceneObjectManager { - constructor( viewer ) { + constructor( viewer, skipPostLoad = false ) { this.viewer = viewer this.scene = viewer.scene this.userObjects = new THREE.Group() @@ -46,6 +46,7 @@ export default class SceneObjectManager { this.objectIds = [] this.postLoad = debounce( () => { this._postLoadFunction() }, 200 ) + this.skipPostLoad = skipPostLoad this.loaders = [] } @@ -175,6 +176,7 @@ export default class SceneObjectManager { } _postLoadFunction() { + if ( this.skipPostLoad ) return this.viewer.interactions.zoomExtents() this.viewer.interactions.hideSectionBox() this.viewer.reflectionsNeedUpdate = true diff --git a/packages/viewer/src/modules/SectionBox.js b/packages/viewer/src/modules/SectionBox.js index 34aed5d2c..ded5e7063 100644 --- a/packages/viewer/src/modules/SectionBox.js +++ b/packages/viewer/src/modules/SectionBox.js @@ -27,7 +27,7 @@ export default class SectionBox { this.hoverPlane = new THREE.Mesh( plane, new THREE.MeshStandardMaterial( { transparent: true, side: THREE.DoubleSide, - opacity: 0.05, + opacity: 0.02, color: 0x0A66FF, metalness: 0.1, roughness: 0.75, diff --git a/packages/viewer/src/modules/ViewerObjectLoader.js b/packages/viewer/src/modules/ViewerObjectLoader.js index fa4267e47..95e105dde 100644 --- a/packages/viewer/src/modules/ViewerObjectLoader.js +++ b/packages/viewer/src/modules/ViewerObjectLoader.js @@ -13,7 +13,6 @@ export default class ViewerObjectLoader { this.token = authToken || localStorage.getItem( 'AuthToken' ) if ( !this.token ) { - // throw new Error( 'No suitable authorization token found.' ) console.warn( 'Viewer: no auth token present. Requests to non-public stream objects will fail.' ) }