vive settings

index.html

@@ -353,7 +353,7 @@
     <script type="text/javascript" src="dependencies/flat-ui.min.js"></script>
     <script type="text/javascript" src="dependencies/three.js"></script>
     <script type="text/javascript" src="dependencies/binary_stl_writer.js"></script>
-    <script type="text/javascript" src="dependencies/OrthographicTrackballControls.js"></script>
+    <script type="text/javascript" src="dependencies/TrackballControls.js"></script>
     <script type="text/javascript" src="dependencies/Projector.js"></script>
     <script type="text/javascript" src="dependencies/SVGRenderer.js"></script>
     <script type="text/javascript" src="dependencies/underscore-min.js"></script>

js/ViveInterface.js

@@ -15,7 +15,7 @@ function initViveInterface(globals){
     $status.html("No device connected.");
     $("#VRoptions").show();
 
-    var mesh = new THREE.Mesh(new THREE.CubeGeometry(1, 1,1 ), new THREE.MeshLambertMaterial({color:0xff0000}));
+    var mesh = new THREE.Mesh(new THREE.CubeGeometry(1,1,1), new THREE.MeshLambertMaterial({color:0xff0000}));
 
     var controls = new THREE.VRControls(globals.threeView.camera);
     controls.standing = true;
@@ -44,16 +44,18 @@ function initViveInterface(globals){
             document.body.appendChild(button);
             var callback = button.onclick;
             button.onclick = function () {
-				if (display.isPresenting) globals.vrEnabled = false;
-                else globals.vrEnabled = true;
+				globals.vrEnabled = !display.isPresenting;
+                var y = 0;
+                if (globals.vrEnabled) y = 1;
+                globals.threeView.modelWrapper.position.set(0,y,0);
+                // var scale = 0.01;
+                // globals.threeView.modelWrapper.scale.set(scale, scale, scale);
                 if (callback) callback();
 			};
-
         } );
     }
 
     function disconnect(){
-
     }
 
     function render(){

js/model.js

@@ -174,7 +174,7 @@ function initModel(globals){
         if (globals.colorMode == "axialStrain") geometry.attributes.color.needsUpdate = true;
         geometry.computeVertexNormals();
         // geometry.computeBoundingBox();
-        // geometry.computeBoundingSphere();
+        geometry.computeBoundingSphere();
     }
 
     var inited = false;
@@ -318,7 +318,7 @@ function initModel(globals){
         geometry.computeBoundingSphere();
         geometry.center();
 
-        var scale = 100/geometry.boundingSphere.radius;
+        var scale = 1/geometry.boundingSphere.radius;
         globals.scale = scale;
 
         object3D.geometry.dispose();

js/threeView.js

@@ -6,13 +6,15 @@ function initThreeView(globals) {
 
     var scene = new THREE.Scene();
     var modelWrapper = new THREE.Object3D();
-    var camera = new THREE.OrthographicCamera(window.innerWidth / -2, window.innerWidth / 2, window.innerHeight / 2, window.innerHeight / -2, -10000, 10000);//-40, 40);
+
+    var camera = new THREE.PerspectiveCamera(70, window.innerWidth/window.innerHeight, 0.01, 1000);
+    // var camera = new THREE.OrthographicCamera(window.innerWidth / -2, window.innerWidth / 2, window.innerHeight / 2, window.innerHeight / -2, -10000, 10000);//-40, 40);
     var renderer = new THREE.WebGLRenderer({antialias: true});
     var svgRenderer = new THREE.SVGRenderer();
     var controls;
 
-    var depthMaterial, effectComposer, depthRenderTarget;
-    var ssaoPass;
+    // var depthMaterial, effectComposer, depthRenderTarget;
+    // var ssaoPass;
 
     var animationRunning = false;
     var pauseFlag = false;
@@ -45,52 +47,52 @@ function initThreeView(globals) {
         var directionalLight5 = new THREE.DirectionalLight(0xffffff, 0.3);
         directionalLight5.position.set(0, 30, -100);
         scene.add(directionalLight5);
-        var ambientLight = new THREE.AmbientLight(0xffffff, 0.1);
+        // var ambientLight = new THREE.AmbientLight(0xffffff, 0.1);
         // scene.add(ambientLight);
         //scene.fog = new THREE.FogExp2(0xf4f4f4, 1.7);
         //renderer.setClearColor(scene.fog.color);
 
         scene.add(camera);
 
-        camera.zoom = 5;
+        camera.zoom = 25;
         camera.updateProjectionMatrix();
-        camera.position.x = 200;
-        camera.position.y = 200;
-        camera.position.z = 200;
+        camera.position.x = 10;
+        camera.position.y = 10;
+        camera.position.z = 10;
 
-        controls = new THREE.OrthographicTrackballControls(camera, renderer.domElement);
-        controls.rotateSpeed = 1.5;
-        controls.zoomSpeed = 0.8;
+        controls = new THREE.TrackballControls(camera, renderer.domElement);
+        controls.rotateSpeed = 1.0;
+        controls.zoomSpeed = 1.2;
         controls.noPan = true;
         controls.staticMoving = true;
         controls.dynamicDampingFactor = 0.3;
         controls.addEventListener("change", render);
 
-        var renderPass = new THREE.RenderPass( scene, camera );
+        // var renderPass = new THREE.RenderPass( scene, camera );
 
         // Setup depth pass
-        depthMaterial = new THREE.MeshDepthMaterial();
-        depthMaterial.depthPacking = THREE.RGBADepthPacking;
-        depthMaterial.blending = THREE.NoBlending;
-
-        var pars = { minFilter: THREE.LinearFilter, magFilter: THREE.LinearFilter };
-        depthRenderTarget = new THREE.WebGLRenderTarget( window.innerWidth, window.innerHeight, pars );
-
-        // Setup SSAO pass
-        ssaoPass = new THREE.ShaderPass( THREE.SSAOShader );
-        ssaoPass.renderToScreen = true;
-        //ssaoPass.uniforms[ "tDiffuse" ].value will be set by ShaderPass
-        ssaoPass.uniforms[ "tDepth" ].value = depthRenderTarget.texture;
-        ssaoPass.uniforms[ 'size' ].value.set( window.innerWidth, window.innerHeight );
-        ssaoPass.uniforms[ 'cameraNear' ].value = camera.near;
-        ssaoPass.uniforms[ 'cameraFar' ].value = camera.far;
-        ssaoPass.uniforms[ 'onlyAO' ].value = 0;
-        ssaoPass.uniforms[ 'aoClamp' ].value = 0.7;
-        ssaoPass.uniforms[ 'lumInfluence' ].value = 0.8;
-        // Add pass to effect composer
-        effectComposer = new THREE.EffectComposer( renderer );
-        effectComposer.addPass( renderPass );
-        effectComposer.addPass( ssaoPass );
+        // depthMaterial = new THREE.MeshDepthMaterial();
+        // depthMaterial.depthPacking = THREE.RGBADepthPacking;
+        // depthMaterial.blending = THREE.NoBlending;
+
+        // var pars = { minFilter: THREE.LinearFilter, magFilter: THREE.LinearFilter };
+        // depthRenderTarget = new THREE.WebGLRenderTarget( window.innerWidth, window.innerHeight, pars );
+        //
+        // // Setup SSAO pass
+        // ssaoPass = new THREE.ShaderPass( THREE.SSAOShader );
+        // ssaoPass.renderToScreen = true;
+        // //ssaoPass.uniforms[ "tDiffuse" ].value will be set by ShaderPass
+        // ssaoPass.uniforms[ "tDepth" ].value = depthRenderTarget.texture;
+        // ssaoPass.uniforms[ 'size' ].value.set( window.innerWidth, window.innerHeight );
+        // ssaoPass.uniforms[ 'cameraNear' ].value = camera.near;
+        // ssaoPass.uniforms[ 'cameraFar' ].value = camera.far;
+        // ssaoPass.uniforms[ 'onlyAO' ].value = 0;
+        // ssaoPass.uniforms[ 'aoClamp' ].value = 0.7;
+        // ssaoPass.uniforms[ 'lumInfluence' ].value = 0.8;
+        // // Add pass to effect composer
+        // effectComposer = new THREE.EffectComposer( renderer );
+        // effectComposer.addPass( renderPass );
+        // effectComposer.addPass( ssaoPass );
     }
 
     function render() {
@@ -126,15 +128,15 @@ function initThreeView(globals) {
             globals.vive.render();
             return;
         }
-        if (globals.ambientOcclusion) {
-            // Render depth into depthRenderTarget
-            scene.overrideMaterial = depthMaterial;
-            renderer.render(scene, camera, depthRenderTarget, true);
-            // Render renderPass and SSAO shaderPass
-            scene.overrideMaterial = null;
-            effectComposer.render();
-            return;
-        }
+        // if (globals.ambientOcclusion) {
+        //     // Render depth into depthRenderTarget
+        //     scene.overrideMaterial = depthMaterial;
+        //     renderer.render(scene, camera, depthRenderTarget, true);
+        //     // Render renderPass and SSAO shaderPass
+        //     scene.overrideMaterial = null;
+        //     effectComposer.render();
+        //     return;
+        // }
         renderer.render(scene, camera);
     }
 
@@ -146,6 +148,7 @@ function initThreeView(globals) {
             });
             return;
         }
+        controls.update();//todo put this above callback?
         requestAnimationFrame(function(){
             if (pauseFlag) {
                 pauseFlag = false;
@@ -172,23 +175,24 @@ function initThreeView(globals) {
 
     function onWindowResize() {
         camera.aspect = window.innerWidth / window.innerHeight;
-        camera.left = -window.innerWidth / 2;
-        camera.right = window.innerWidth / 2;
-        camera.top = window.innerHeight / 2;
-        camera.bottom = -window.innerHeight / 2;
+        // camera.left = -window.innerWidth / 2;
+        // camera.right = window.innerWidth / 2;
+        // camera.top = window.innerHeight / 2;
+        // camera.bottom = -window.innerHeight / 2;
         camera.updateProjectionMatrix();
 
         renderer.setSize(window.innerWidth, window.innerHeight);
+        controls.handleResize();
 
-        var width = window.innerWidth;
-        var height = window.innerHeight;
+        // var width = window.innerWidth;
+        // var height = window.innerHeight;
 
-        ssaoPass.uniforms[ 'size' ].value.set( width, height );
-        var pixelRatio = renderer.getPixelRatio();
-        var newWidth  = Math.floor( width / pixelRatio ) || 1;
-        var newHeight = Math.floor( height / pixelRatio ) || 1;
-        depthRenderTarget.setSize( newWidth, newHeight );
-        effectComposer.setSize( newWidth, newHeight );
+        // ssaoPass.uniforms[ 'size' ].value.set( width, height );
+        // var pixelRatio = renderer.getPixelRatio();
+        // var newWidth  = Math.floor( width / pixelRatio ) || 1;
+        // var newHeight = Math.floor( height / pixelRatio ) || 1;
+        // depthRenderTarget.setSize( newWidth, newHeight );
+        // effectComposer.setSize( newWidth, newHeight );
 
         render();
     }
@@ -242,6 +246,7 @@ function initThreeView(globals) {
         scene: scene,
         camera: camera,
         renderer: renderer,
+        modelWrapper:modelWrapper,
         running: running,
         setScale:setScale,
         saveSVG: saveSVG