Forráskód Böngészése

removing 'curvature driving specular+texture' example

Sneha Belkhale 7 éve
szülő
commit
d2af1656d9
1 módosított fájl, 10 hozzáadás és 162 törlés
  1. 10 162
      examples/webgl_curvature_estimation.html

+ 10 - 162
examples/webgl_curvature_estimation.html

@@ -35,9 +35,7 @@
 
 		<div id="container"></div>
 		<div id="info"><a href="http://threejs.org" target="_blank" rel="noopener">three.js</a> - curvature estimation of a geometry by <a href="http://codercat.club" target="_blank" rel="noopener">CoderCat</a></div>
-		<div class="label" style="position: absolute;left: 20%;bottom: 10%;">Raw curvature values</div>
-		<div class="label" style="position: absolute;left: 68%;bottom: 10%;">Curvature driving specular + texture </div>
-		
+
 		<script src="../build/three.js"></script>
 		<script src="js/Detector.js"></script>
 
@@ -45,29 +43,6 @@
 		<script src="js/loaders/OBJLoader.js"></script>
 		<script src="js/libs/dat.gui.min.js"></script>
 
-		<script id="vertexShader" type="x-shader/x-vertex">
-
-		attribute float curvature;
-
-		varying vec3 vPos;
-		varying vec3 vNormal;
-		varying vec3 vViewPosition;
-		varying float vCurvature;
-
-		void main() {
-
-			vec3 p = position;
-			vPos = p;
-			vec4 modelViewPosition = modelViewMatrix * vec4( p , 1.0 );
-			vViewPosition = -modelViewPosition.xyz;
-			gl_Position = projectionMatrix * modelViewPosition;
-			vNormal = normalMatrix * normal;
-			vCurvature = curvature;
-
-		}
-
-		</script>
-
 		<script id="vertexShaderRaw" type="x-shader/x-vertex">
 
 		attribute float curvature;
@@ -96,122 +71,15 @@
 
 		</script>
 
-		<script id="fragmentShader" type="x-shader/x-fragment">
-
-		varying vec3 vPos;
-		varying vec3 vNormal;
-		varying vec3 vViewPosition;
-		varying float vCurvature;
-
-		vec4 permute( vec4 x ){ return mod((( x * 34.0 ) + 1.0 ) * x, 289.0); }
-		vec4 taylorInvSqrt( vec4 r ){ return 1.79284291400159 - 0.85373472095314 * r; }
-		vec3 fade( vec3 t ) { return t * t * t * ( t * ( t * 6.0 - 15.0 ) + 10.0 ); }
-
-		float cnoise( vec3 P ){
-		  vec3 Pi0 = floor( P ); // Integer part for indexing
-		  vec3 Pi1 = Pi0 + vec3( 1.0 ); // Integer part + 1
-		  Pi0 = mod( Pi0, 289.0 );
-		  Pi1 = mod( Pi1, 289.0 );
-		  vec3 Pf0 = fract( P ); // Fractional part for interpolation
-		  vec3 Pf1 = Pf0 - vec3( 1.0 ); // Fractional part - 1.0
-		  vec4 ix = vec4( Pi0.x, Pi1.x, Pi0.x, Pi1.x );
-		  vec4 iy = vec4( Pi0.yy, Pi1.yy );
-		  vec4 iz0 = Pi0.zzzz;
-		  vec4 iz1 = Pi1.zzzz;
-
-		  vec4 ixy = permute( permute( ix ) + iy );
-		  vec4 ixy0 = permute( ixy + iz0 );
-		  vec4 ixy1 = permute( ixy + iz1 );
-
-		  vec4 gx0 = ixy0 / 7.0;
-		  vec4 gy0 = fract( floor( gx0 ) / 7.0 ) - 0.5;
-		  gx0 = fract( gx0 );
-		  vec4 gz0 = vec4( 0.5 ) - abs( gx0 ) - abs( gy0 );
-		  vec4 sz0 = step( gz0, vec4( 0.0 ));
-		  gx0 -= sz0 * ( step( 0.0, gx0 ) - 0.5 );
-		  gy0 -= sz0 * ( step( 0.0, gy0 ) - 0.5 );
-
-		  vec4 gx1 = ixy1 / 7.0;
-		  vec4 gy1 = fract( floor( gx1 ) / 7.0 ) - 0.5;
-		  gx1 = fract( gx1 );
-		  vec4 gz1 = vec4( 0.5 ) - abs( gx1 ) - abs( gy1 );
-		  vec4 sz1 = step( gz1, vec4( 0.0 ) );
-		  gx1 -= sz1 * ( step( 0.0, gx1 ) - 0.5 );
-		  gy1 -= sz1 * ( step( 0.0, gy1 ) - 0.5 );
-
-		  vec3 g000 = vec3( gx0.x, gy0.x, gz0.x );
-		  vec3 g100 = vec3( gx0.y, gy0.y, gz0.y );
-		  vec3 g010 = vec3( gx0.z, gy0.z, gz0.z );
-		  vec3 g110 = vec3( gx0.w, gy0.w, gz0.w );
-		  vec3 g001 = vec3( gx1.x, gy1.x, gz1.x );
-		  vec3 g101 = vec3( gx1.y, gy1.y, gz1.y );
-		  vec3 g011 = vec3( gx1.z, gy1.z, gz1.z );
-		  vec3 g111 = vec3( gx1.w, gy1.w, gz1.w );
-
-		  vec4 norm0 = taylorInvSqrt( vec4( dot( g000, g000 ), dot( g010, g010 ), dot( g100, g100 ), dot( g110, g110 ) ) );
-		  g000 *= norm0.x;
-		  g010 *= norm0.y;
-		  g100 *= norm0.z;
-		  g110 *= norm0.w;
-		  vec4 norm1 = taylorInvSqrt( vec4( dot( g001, g001 ), dot( g011, g011 ), dot( g101, g101 ), dot( g111, g111 ) ) );
-		  g001 *= norm1.x;
-		  g011 *= norm1.y;
-		  g101 *= norm1.z;
-		  g111 *= norm1.w;
-
-		  float n000 = dot( g000, Pf0 );
-		  float n100 = dot( g100, vec3( Pf1.x, Pf0.yz ) );
-		  float n010 = dot( g010, vec3( Pf0.x, Pf1.y, Pf0.z ) );
-		  float n110 = dot( g110, vec3( Pf1.xy, Pf0.z ) );
-		  float n001 = dot( g001, vec3( Pf0.xy, Pf1.z ) );
-		  float n101 = dot( g101, vec3( Pf1.x, Pf0.y, Pf1.z ) );
-		  float n011 = dot( g011, vec3( Pf0.x, Pf1.yz ) );
-		  float n111 = dot( g111, Pf1);
-
-		  vec3 fade_xyz = fade( Pf0 );
-		  vec4 n_z = mix( vec4( n000, n100, n010, n110 ), vec4( n001, n101, n011, n111 ), fade_xyz.z );
-		  vec2 n_yz = mix( n_z.xy, n_z.zw, fade_xyz.y );
-		  float n_xyz = mix( n_yz.x, n_yz.y, fade_xyz.x );
-		  return 2.2 * n_xyz;
-
-		}
-
-		void main() {
-			vec3 V = vViewPosition; //view vector
-			vec3 N = vNormal; //normal vector
-			vec3 L = vec3( 50.0, 22.0, 50.0 ); //imaginary light
-			vec3 R = reflect( -L, N ); //reflection from light
-
-			//specular coefficient
-			float spec = vCurvature * vCurvature * max( 0.0, dot( R, normalize( V ) ) / 5.0 );
-			vec4 specColor = vec4( 1.0, 1.0, 1.0, 1.0 );
-
-			//calculate noise coefficient
-			float x = cnoise( 10.0 * vPos );
-			vec4 diffuseColor = vec4(x, x, x, 1.0 );
-			float diffuse = pow( vCurvature , 2.0 );
-
-			if ( spec < 0.1 ) diffuse = 0.0;
-			diffuseColor.xyz =  diffuse * diffuseColor.xyz;
-
-			gl_FragColor = spec * specColor + diffuseColor;
-
-		}
-
-		</script>
-
 		<script>
 
 			if ( ! Detector.webgl ) Detector.addGetWebGLMessage();
 
 			var container;
 
-			var camera, scene, sceneLeft, renderer;
-
-			var ninjaMesh, curvatureAttribute;
+			var camera, scene, renderer;
 
-			var windowHalfX = window.innerWidth / 2;
-			var windowHalfY = window.innerHeight / 2;
+			var ninjaMeshRaw, curvatureAttribute;
 
 			init();
 			animate();
@@ -276,10 +144,9 @@
 			//initialize the scene
 			function init() {
 
-				sceneRight = new THREE.Scene();
-				sceneLeft = new THREE.Scene();
+				scene = new THREE.Scene();
 
-				camera = new THREE.PerspectiveCamera( 75, windowHalfX / window.innerHeight, 0.1, 1000 );
+				camera = new THREE.PerspectiveCamera( 75, window.innerWidth / window.innerHeight, 0.1, 1000 );
 
 				camera.position.x = -23;
 				camera.position.y = 2;
@@ -421,15 +288,6 @@
 							var curvatureFiltered = new Float32Array( curvatureAttribute );
 							filterBoth(curvatureFiltered);
 
-							var material = new THREE.ShaderMaterial ({
-
-								vertexShader: document.getElementById( 'vertexShader' ).textContent,
-								fragmentShader: document.getElementById( 'fragmentShader' ).textContent
-
-							} );
-
-							ninjaMesh = new THREE.Mesh( bufferGeo, material );
-
 							var materialRaw = new THREE.ShaderMaterial ({
 
 								vertexShader: document.getElementById( 'vertexShaderRaw' ).textContent,
@@ -441,18 +299,15 @@
 
 						}
 					} );
-					sceneRight.add( ninjaMesh );
-					sceneLeft.add( ninjaMeshRaw );
-					render();
-					bufferGeo.attributes.curvature.needsUpdate = true;
-					render();
-					bufferGeo.attributes.curvature.needsUpdate = true;
+
+					scene.add( ninjaMeshRaw );
 
 				} );
 
 
 				//init GUI
 				var params = {
+
 					filterConvex: function () {
 
 						var curvatureFiltered = new Float32Array( curvatureAttribute );
@@ -498,8 +353,7 @@
 			function onWindowResize( event ) {
 
 				renderer.setSize( window.innerWidth, window.innerHeight );
-				windowHalfX = window.innerWidth / 2;
-				camera.aspect = windowHalfX / window.innerHeight;
+				camera.aspect = window.innerWidth / window.innerHeight;
 				camera.updateProjectionMatrix();
 
 			}
@@ -514,13 +368,7 @@
 
 			function render() {
 
-				renderer.clear();
-				renderer.setViewport( windowHalfX, 0, windowHalfX, window.innerHeight );
-				renderer.render(sceneRight, camera);
-
-				renderer.clearDepth();
-				renderer.setViewport( 0, 0, windowHalfX, window.innerHeight );
-				renderer.render(sceneLeft, camera);
+				renderer.render(scene, camera);
 
 			}