SkeletonHelper: Changed line colors.

examples/webgl_animation_skinning_blending.html

@@ -31,7 +31,7 @@
 			<br> Cross fades (and warping) blend between 2 animations and end with a single animation.
 		</div>
 
-		<script src="../build/Three.js"></script>
+		<script src="../build/three.min.js"></script>
 
 		<script src="js/Detector.js"></script>
 		<script src="js/libs/stats.min.js"></script>

src/extras/helpers/SkeletonHelper.js

@@ -18,7 +18,7 @@ THREE.SkeletonHelper = function ( skeleton, jointBoxSize, scaleRatio ) {
 
 		var bone = skeleton.bones[ i ];
 		var boxGeometry = new THREE.BoxGeometry( boxSize, boxSize, boxSize );
-		var boxMaterial = new THREE.MeshBasicMaterial( { depthTest: false, depthWrite: false } );
+		var boxMaterial = new THREE.MeshBasicMaterial( { depthTest: false, depthWrite: false, transparent: true } );
 
 		bone.helper = {};
 		bone.helper.box = new THREE.Mesh( boxGeometry, boxMaterial );
@@ -29,13 +29,13 @@ THREE.SkeletonHelper = function ( skeleton, jointBoxSize, scaleRatio ) {
 
 		if ( bone.parent instanceof THREE.Bone ) {
 
-			var lineMaterial = new THREE.LineBasicMaterial( { vertexColors: true, depthTest: false, depthWrite: false } );
+			var lineMaterial = new THREE.LineBasicMaterial( { vertexColors: true, depthTest: false, depthWrite: false, transparent: true } );
 			var lineGeometry = new THREE.Geometry();
 
 			lineGeometry.vertices.push( new THREE.Vector3() );
 			lineGeometry.vertices.push( new THREE.Vector3() );
-			lineGeometry.colors.push( new THREE.Color( 1, 1, 0 ) );
-			lineGeometry.colors.push( new THREE.Color( 0, 0, 0 ) );
+			lineGeometry.colors.push( new THREE.Color( 0, 0, 1 ) );
+			lineGeometry.colors.push( new THREE.Color( 0, 1, 0 ) );
 
 			bone.helper.line = new THREE.Line( lineGeometry, lineMaterial );
 			this.add( bone.helper.line );
@@ -45,6 +45,7 @@ THREE.SkeletonHelper = function ( skeleton, jointBoxSize, scaleRatio ) {
 	}
 
 	this.update();
+
 };
 
 
@@ -52,7 +53,7 @@ THREE.SkeletonHelper.prototype = Object.create( THREE.Object3D.prototype );
 
 THREE.SkeletonHelper.prototype.update = function () {
 
-	for ( var i = 0; i < this.skeleton.bones.length; ++i ) {
+	for ( var i = 0; i < this.skeleton.bones.length; i ++ ) {
 
 		var bone = this.skeleton.bones[ i ];
 
@@ -65,11 +66,11 @@ THREE.SkeletonHelper.prototype.update = function () {
 			bone.helper.axes.position = bone.helper.box.position;
 			bone.helper.axes.scale = bone.helper.box.scale;
 
-			bone.helper.line.geometry.vertices[0].setFromMatrixPosition( bone.skinMatrix );
-			bone.helper.line.geometry.vertices[0].multiplyScalar( this.scaleRatio );
+			bone.helper.line.geometry.vertices[ 0 ].setFromMatrixPosition( bone.skinMatrix );
+			bone.helper.line.geometry.vertices[ 0 ].multiplyScalar( this.scaleRatio );
 
-			bone.helper.line.geometry.vertices[1].setFromMatrixPosition( bone.parent.skinMatrix );
-			bone.helper.line.geometry.vertices[1].multiplyScalar( this.scaleRatio );
+			bone.helper.line.geometry.vertices[ 1 ].setFromMatrixPosition( bone.parent.skinMatrix );
+			bone.helper.line.geometry.vertices[ 1 ].multiplyScalar( this.scaleRatio );
 
 			bone.helper.line.geometry.verticesNeedUpdate = true;
 
@@ -79,19 +80,20 @@ THREE.SkeletonHelper.prototype.update = function () {
 
 };
 
-THREE.SkeletonHelper.prototype.setVisible = function ( shouldBeVisible ) {
+THREE.SkeletonHelper.prototype.setVisible = function ( boolean ) {
 
-	for ( var i = 0; i < this.skeleton.bones.length; ++i ) {
+	for ( var i = 0; i < this.skeleton.bones.length; i ++ ) {
 
 		var bone = this.skeleton.bones[ i ];
+
 		if ( bone.helper ) {
 
-			bone.helper.box.visible = shouldBeVisible;
-			bone.helper.axes.visible = shouldBeVisible;
+			bone.helper.box.visible = boolean;
+			bone.helper.axes.visible = boolean;
 
 			if ( bone.parent instanceof THREE.Bone ) {
 
-				 bone.helper.line.visible = shouldBeVisible;
+				 bone.helper.line.visible = boolean;
 
 			}