From d1e7b1dc7349879e089b3543cd6ec2eb1a5086a2 Mon Sep 17 00:00:00 2001 From: "Mr.doob" Date: Thu, 30 Jul 2015 16:01:21 -0400 Subject: [PATCH] MorphNormals code clean up. --- examples/js/MD2Character.js | 8 ++------ examples/js/MD2CharacterComplex.js | 8 ++------ examples/scenes/test_scene.js | 2 +- examples/webgl_animation_cloth.html | 5 ++--- examples/webgl_lights_hemisphere.html | 3 +-- examples/webgl_morphnormals.html | 3 +-- examples/webgl_morphtargets_md2.html | 15 ++++++--------- examples/webgl_morphtargets_md2_control.html | 18 ++++++++++-------- examples/webgl_shading_physical.html | 8 +++----- 9 files changed, 28 insertions(+), 42 deletions(-) diff --git a/examples/js/MD2Character.js b/examples/js/MD2Character.js index 0a87f3fe08..3fc6cdceb8 100644 --- a/examples/js/MD2Character.js +++ b/examples/js/MD2Character.js @@ -199,12 +199,8 @@ THREE.MD2Character = function () { function createPart( geometry, skinMap ) { - geometry.computeMorphNormals(); - - var whiteMap = THREE.ImageUtils.generateDataTexture( 1, 1, new THREE.Color( 0xffffff ) ); - var materialWireframe = new THREE.MeshPhongMaterial( { color: 0xffaa00, specular: 0x111111, shininess: 50, wireframe: true, shading: THREE.SmoothShading, map: whiteMap, morphTargets: true, morphNormals: true, metal: false } ); - - var materialTexture = new THREE.MeshPhongMaterial( { color: 0xffffff, specular: 0x111111, shininess: 50, wireframe: false, shading: THREE.SmoothShading, map: skinMap, morphTargets: true, morphNormals: true, metal: false } ); + var materialWireframe = new THREE.MeshBasicMaterial( { color: 0xffaa00, wireframe: true, shading: THREE.SmoothShading, morphTargets: true } ); + var materialTexture = new THREE.MeshBasicMaterial( { color: 0xffffff, wireframe: false, shading: THREE.SmoothShading, map: skinMap, morphTargets: true } ); // diff --git a/examples/js/MD2CharacterComplex.js b/examples/js/MD2CharacterComplex.js index ba3aebaa48..778feaa25d 100644 --- a/examples/js/MD2CharacterComplex.js +++ b/examples/js/MD2CharacterComplex.js @@ -522,12 +522,8 @@ THREE.MD2CharacterComplex = function () { function createPart( geometry, skinMap ) { - geometry.computeMorphNormals(); - - var whiteMap = THREE.ImageUtils.generateDataTexture( 1, 1, new THREE.Color( 0xffffff ) ); - var materialWireframe = new THREE.MeshPhongMaterial( { color: 0xffaa00, specular: 0x111111, shininess: 50, wireframe: true, shading: THREE.SmoothShading, map: whiteMap, morphTargets: true, morphNormals: true, metal: true } ); - - var materialTexture = new THREE.MeshPhongMaterial( { color: 0xffffff, specular: 0x111111, shininess: 50, wireframe: false, shading: THREE.SmoothShading, map: skinMap, morphTargets: true, morphNormals: true, metal: true } ); + var materialWireframe = new THREE.MeshBasicMaterial( { color: 0xffaa00, wireframe: true, shading: THREE.SmoothShading, morphTargets: true } ); + var materialTexture = new THREE.MeshBasicMaterial( { color: 0xffffff, wireframe: false, shading: THREE.SmoothShading, map: skinMap, morphTargets: true } ); // diff --git a/examples/scenes/test_scene.js b/examples/scenes/test_scene.js index 52cffba8f8..057c449da1 100644 --- a/examples/scenes/test_scene.js +++ b/examples/scenes/test_scene.js @@ -597,7 +597,7 @@ "phong_morph": { "type": "MeshPhongMaterial", - "parameters": { "color": 0, "specular": 16777215, "shininess": 50, "envMap": "cube_reflection", "reflectivity": 0.125, "combine": "MixOperation", "shading": "flat", "side": "double", "morphTargets": true, "morphNormals" : true } + "parameters": { "color": 0, "specular": 16777215, "shininess": 50, "envMap": "cube_reflection", "reflectivity": 0.125, "combine": "MixOperation", "shading": "flat", "side": "double", "morphTargets": true } }, "phong_skin": { diff --git a/examples/webgl_animation_cloth.html b/examples/webgl_animation_cloth.html index 463195ffa6..fafef64320 100644 --- a/examples/webgl_animation_cloth.html +++ b/examples/webgl_animation_cloth.html @@ -14,11 +14,10 @@ } #info { - text-align: center; + position: absolute; padding: 10px; - z-index: 10; width: 100%; - position: absolute; + text-align: center; } a { diff --git a/examples/webgl_lights_hemisphere.html b/examples/webgl_lights_hemisphere.html index 598824fbf2..a25bd01252 100644 --- a/examples/webgl_lights_hemisphere.html +++ b/examples/webgl_lights_hemisphere.html @@ -202,9 +202,8 @@ loader.load( "models/animated/flamingo.js", function( geometry ) { morphColorsToFaceColors( geometry ); - geometry.computeMorphNormals(); - var material = new THREE.MeshPhongMaterial( { color: 0xffffff, specular: 0xffffff, shininess: 20, morphTargets: true, morphNormals: true, vertexColors: THREE.FaceColors, shading: THREE.FlatShading } ); + var material = new THREE.MeshPhongMaterial( { color: 0xffffff, specular: 0xffffff, shininess: 20, morphTargets: true, vertexColors: THREE.FaceColors, shading: THREE.FlatShading } ); var meshAnim = new THREE.MorphAnimMesh( geometry, material ); meshAnim.duration = 1000; diff --git a/examples/webgl_morphnormals.html b/examples/webgl_morphnormals.html index 521fdc55b0..e581a9ffca 100644 --- a/examples/webgl_morphnormals.html +++ b/examples/webgl_morphnormals.html @@ -91,9 +91,8 @@ loader.load( "models/animated/flamingo.js", function( geometry ) { morphColorsToFaceColors( geometry ); - geometry.computeMorphNormals(); - var material = new THREE.MeshPhongMaterial( { color: 0xffffff, morphTargets: true, morphNormals: true, vertexColors: THREE.FaceColors, shading: THREE.FlatShading } ); + var material = new THREE.MeshPhongMaterial( { color: 0xffffff, morphTargets: true, vertexColors: THREE.FaceColors, shading: THREE.FlatShading } ); var meshAnim = new THREE.MorphAnimMesh( geometry, material ); meshAnim.duration = 5000; diff --git a/examples/webgl_morphtargets_md2.html b/examples/webgl_morphtargets_md2.html index a7e06a3bb8..b70563febd 100644 --- a/examples/webgl_morphtargets_md2.html +++ b/examples/webgl_morphtargets_md2.html @@ -18,14 +18,11 @@ } #info { - color:#fff; - position: relative; - margin: 0 auto -2.1em; - top: 0px; - width: 70em; - - padding: 5px; - z-index:100; + position: absolute; + padding: 10px; + width: 100%; + text-align: center; + color: #fff; } a { color: skyblue; } @@ -40,7 +37,7 @@
three.js - morphtargets - - MD2 character by Brian Collins - + MD2 character by Brian Collins
converted by @oosmoxiecode's MD2 converter
diff --git a/examples/webgl_morphtargets_md2_control.html b/examples/webgl_morphtargets_md2_control.html index c75cdc70e0..7178cd04f0 100644 --- a/examples/webgl_morphtargets_md2_control.html +++ b/examples/webgl_morphtargets_md2_control.html @@ -18,13 +18,11 @@ } #info { - color:#000; - position: relative; - margin: 0 auto -2.1em; - top: 0px; - - padding: 5px; - z-index:100; + position: absolute; + padding: 10px; + width: 100%; + text-align: center; + color: #000; } a { color: skyblue; } @@ -40,7 +38,7 @@
three.js - morphtargets - Ogro by Magarnigal - - converted by @oosmoxiecode's MD2 converter - + converted by @oosmoxiecode's MD2 converter
use arrows to control characters, mouse for camera
@@ -280,6 +278,8 @@ function onKeyDown ( event ) { + event.stopPropagation(); + switch( event.keyCode ) { case 38: /*up*/ @@ -304,6 +304,8 @@ function onKeyUp ( event ) { + event.stopPropagation(); + switch( event.keyCode ) { case 38: /*up*/ diff --git a/examples/webgl_shading_physical.html b/examples/webgl_shading_physical.html index c7b7ec8cbd..ffff338163 100644 --- a/examples/webgl_shading_physical.html +++ b/examples/webgl_shading_physical.html @@ -268,10 +268,8 @@ loader.load( "models/animated/sittingBox.js", function( geometry ) { - var morphMaterial = new THREE.MeshPhongMaterial( { color: 0x000000, specular: 0xff9900, shininess: 50, morphTargets: true, morphNormals: true, side: THREE.DoubleSide } ); - morphMaterial.shading = THREE.FlatShading; + var morphMaterial = new THREE.MeshPhongMaterial( { color: 0x000000, specular: 0xff9900, shininess: 50, morphTargets: true, side: THREE.DoubleSide, shading: THREE.FlatShading } ); - geometry.computeMorphNormals(); morph = new THREE.MorphAnimMesh( geometry, morphMaterial ); var s = 200; @@ -389,7 +387,7 @@ gui = new dat.GUI(); shadowGUI = gui.addFolder( "Shadow" ); - + shadowGUI.add( shadowConfig, 'shadowCameraVisible' ).onChange( function() { sunLight.shadowCameraVisible = shadowConfig.shadowCameraVisible; @@ -429,7 +427,7 @@ shadowGUI.open(); gammaGUI = gui.addFolder( "Gamma" ); - + gammaGUI.add( gamma, 'gammaFactor', 0.1, 4.0 ).onChange( function() { renderer.gammaFactor = gamma.gammaFactor; -- GitLab