Editor: added PointLightHelper.

Also added one PointLight to dummy starting scene to be able to test point lights (at least while there is no UI for adding lights).

Changed multiple gizmos not to be affected by fog.

Made DirectionalLightHelper constructor take sphere size as a parameter.

build/three.js

@@ -32595,7 +32595,7 @@ THREE.CameraHelper.__c = new THREE.Camera();
  *	- shows directional light color, intensity, position, orientation and target
  */
 
-THREE.DirectionalLightHelper = function ( light, arrowLength ) {
+THREE.DirectionalLightHelper = function ( light, sphereSize, arrowLength ) {
 
 	THREE.Object3D.call( this );
 
@@ -32616,13 +32616,16 @@ THREE.DirectionalLightHelper = function ( light, arrowLength ) {
 	this.direction = new THREE.Vector3();
 	this.direction.sub( light.target.position, light.position );
 
-	var targetGeo = new THREE.SphereGeometry( 5, 8, 4 );
-	var lightGeo = new THREE.SphereGeometry( 5, 16, 8 );
-	var lightMaterial = new THREE.MeshBasicMaterial( { color: hexColor } );
+	var targetGeo = new THREE.SphereGeometry( sphereSize, 8, 4 );
+	var lightGeo = new THREE.SphereGeometry( sphereSize, 16, 8 );
+	var lightMaterial = new THREE.MeshBasicMaterial( { color: hexColor, fog: false } );
 
 	this.lightArrow = new THREE.ArrowHelper( this.direction, null, arrowLength, hexColor );
 	this.lightSphere = new THREE.Mesh( lightGeo, lightMaterial );
 
+	this.lightArrow.cone.material.fog = false;
+	this.lightArrow.line.material.fog = false;
+
 	this.add( this.lightArrow );
 	this.add( this.lightSphere );
 
@@ -32630,7 +32633,7 @@ THREE.DirectionalLightHelper = function ( light, arrowLength ) {
 
 	if ( light.target.properties.targetInverse ) {
 
-		var targetMaterial = new THREE.MeshBasicMaterial( { color: hexColor, wireframe: true } );
+		var targetMaterial = new THREE.MeshBasicMaterial( { color: hexColor, wireframe: true, fog: false } );
 
 		this.targetSphere = new THREE.Mesh( targetGeo, targetMaterial );
 		this.targetSphere.position = light.target.position;
@@ -32639,7 +32642,7 @@ THREE.DirectionalLightHelper = function ( light, arrowLength ) {
 		this.targetSphere.properties.gizmoSubject = light.target;
 		this.targetSphere.properties.gizmoRoot = this.targetSphere;
 
-		var lineMaterial = new THREE.LineDashedMaterial( { color: hexColor, dashSize: 4, gapSize: 4, opacity: 0.75, transparent: true } );
+		var lineMaterial = new THREE.LineDashedMaterial( { color: hexColor, dashSize: 4, gapSize: 4, opacity: 0.75, transparent: true, fog: false } );
 		var lineGeometry = new THREE.Geometry();
 		lineGeometry.vertices.push( this.position.clone() );
 		lineGeometry.vertices.push( this.targetSphere.position.clone() );
@@ -32690,6 +32693,95 @@ THREE.DirectionalLightHelper.prototype.update = function () {
 
 }
 
+/**
+ * @author alteredq / http://alteredqualia.com/
+ *
+ *	- shows point light color, intensity, and position
+ */
+
+THREE.PointLightHelper = function ( light, sphereSize ) {
+
+	THREE.Object3D.call( this );
+
+	this.light = light;
+
+	this.position = light.position;
+
+	this.properties.isGizmo = true;
+
+	this.color = light.color.clone();
+
+	this.color.r *= light.intensity;
+	this.color.g *= light.intensity;
+	this.color.b *= light.intensity;
+
+	var hexColor = this.color.getHex();
+
+	var lightGeo = new THREE.SphereGeometry( sphereSize, 16, 8 );
+	var lightMaterial = new THREE.MeshBasicMaterial( { color: hexColor, fog: false } );
+
+	this.lightSphere = new THREE.Mesh( lightGeo, lightMaterial );
+
+	this.add( this.lightSphere );
+
+	this.lightSphere.properties.isGizmo = true;
+	this.lightSphere.properties.gizmoSubject = light;
+	this.lightSphere.properties.gizmoRoot = this;
+
+	var lineMaterial = new THREE.LineBasicMaterial( { color: hexColor, fog: false } );
+	var lineGeometry = new THREE.Geometry();
+
+	var sd = sphereSize * 1.25;
+	var ed = sphereSize * 2.25;
+
+	var sd2 = 0.707 * sd;
+	var ed2 = 0.707 * ed;
+
+	var rays = [ [ sd, 0, 0 ], [ ed, 0, 0 ], [ -sd, 0, 0 ], [ -ed, 0, 0 ],
+				 [ 0, sd, 0 ], [ 0, ed, 0 ], [ 0, -sd, 0 ], [ 0, -ed, 0 ],
+				 [ 0, 0, sd ], [ 0, 0, ed ], [ 0, 0, -sd ], [ 0, 0, -ed ],
+				 [ sd2, sd2, 0 ], [ ed2, ed2, 0 ], [ -sd2, -sd2, 0 ], [ -ed2, -ed2, 0 ],
+				 [ sd2, -sd2, 0 ], [ ed2, -ed2, 0 ], [ -sd2, sd2, 0 ], [ -ed2, ed2, 0 ],
+				 [ sd2, 0, sd2 ], [ ed2, 0, ed2 ], [ -sd2, 0, -sd2 ], [ -ed2, 0, -ed2 ],
+				 [ sd2, 0, -sd2 ], [ ed2, 0, -ed2 ], [ -sd2, 0, sd2 ], [ -ed2, 0, ed2 ],
+				 [ 0, sd2, sd2 ], [ 0, ed2, ed2 ], [ 0, -sd2, -sd2 ], [ 0, -ed2, -ed2 ],
+				 [ 0, sd2, -sd2 ], [ 0, ed2, -ed2 ], [ 0, -sd2, sd2 ], [ 0, -ed2, ed2 ]
+	];
+
+	for ( var i = 0, il = rays.length; i < il; i ++ ) {
+
+		var x = rays[ i ][ 0 ];
+		var y = rays[ i ][ 1 ];
+		var z = rays[ i ][ 2 ];
+
+		lineGeometry.vertices.push( new THREE.Vector3( x, y, z ) );
+
+	}
+
+	this.lightLine = new THREE.Line( lineGeometry, lineMaterial, THREE.LinePieces );
+
+	this.add( this.lightLine );
+
+}
+
+THREE.PointLightHelper.prototype = Object.create( THREE.Object3D.prototype );
+
+THREE.PointLightHelper.prototype.update = function () {
+
+	// set sphere color to light color * light intensity
+
+	this.color.copy( this.light.color );
+
+	var intensity = THREE.Math.clamp( this.light.intensity, 0, 1 );
+	this.color.r *= intensity;
+	this.color.g *= intensity;
+	this.color.b *= intensity;
+
+	this.lightSphere.material.color.copy( this.color );
+	this.lightLine.material.color.copy( this.color );
+
+}
+
 /*
  *	@author zz85 / http://twitter.com/blurspline / http://www.lab4games.net/zz85/blog 
  * 

build/three.min.js

@@ -694,12 +694,17 @@ THREE.CameraHelper=function(a){function b(a,b,d){c(a,d);c(b,d)}function c(a,b){d
 "cf2",3355443);b("cf3","cf4",3355443);this.camera=a;this.update(a)};THREE.CameraHelper.prototype=Object.create(THREE.Line.prototype);
 THREE.CameraHelper.prototype.update=function(){function a(a,d,e,f){THREE.CameraHelper.__v.set(d,e,f);THREE.CameraHelper.__projector.unprojectVector(THREE.CameraHelper.__v,THREE.CameraHelper.__c);a=b.pointMap[a];if(a!==void 0){d=0;for(e=a.length;d<e;d++)b.geometry.vertices[a[d]].copy(THREE.CameraHelper.__v)}}var b=this;THREE.CameraHelper.__c.projectionMatrix.copy(this.camera.projectionMatrix);a("c",0,0,-1);a("t",0,0,1);a("n1",-1,-1,-1);a("n2",1,-1,-1);a("n3",-1,1,-1);a("n4",1,1,-1);a("f1",-1,-1,1);
 a("f2",1,-1,1);a("f3",-1,1,1);a("f4",1,1,1);a("u1",0.7,1.1,-1);a("u2",-0.7,1.1,-1);a("u3",0,2,-1);a("cf1",-1,0,1);a("cf2",1,0,1);a("cf3",0,-1,1);a("cf4",0,1,1);a("cn1",-1,0,-1);a("cn2",1,0,-1);a("cn3",0,-1,-1);a("cn4",0,1,-1);this.geometry.verticesNeedUpdate=true};THREE.CameraHelper.__projector=new THREE.Projector;THREE.CameraHelper.__v=new THREE.Vector3;THREE.CameraHelper.__c=new THREE.Camera;
-THREE.DirectionalLightHelper=function(a,b){THREE.Object3D.call(this);this.light=a;this.position=a.position;this.properties.isGizmo=true;this.color=a.color.clone();this.color.r=this.color.r*a.intensity;this.color.g=this.color.g*a.intensity;this.color.b=this.color.b*a.intensity;var c=this.color.getHex();this.direction=new THREE.Vector3;this.direction.sub(a.target.position,a.position);var d=new THREE.SphereGeometry(5,8,4),e=new THREE.SphereGeometry(5,16,8),f=new THREE.MeshBasicMaterial({color:c});this.lightArrow=
-new THREE.ArrowHelper(this.direction,null,b,c);this.lightSphere=new THREE.Mesh(e,f);this.add(this.lightArrow);this.add(this.lightSphere);this.targetSphere=null;if(a.target.properties.targetInverse){e=new THREE.MeshBasicMaterial({color:c,wireframe:true});this.targetSphere=new THREE.Mesh(d,e);this.targetSphere.position=a.target.position;this.targetSphere.properties.isGizmo=true;this.targetSphere.properties.gizmoSubject=a.target;this.targetSphere.properties.gizmoRoot=this.targetSphere;c=new THREE.LineDashedMaterial({color:c,
-dashSize:4,gapSize:4,opacity:0.75,transparent:true});d=new THREE.Geometry;d.vertices.push(this.position.clone());d.vertices.push(this.targetSphere.position.clone());d.computeLineDistances();this.targetLine=new THREE.Line(d,c);this.targetLine.properties.isGizmo=true}this.lightSphere.properties.isGizmo=true;this.lightSphere.properties.gizmoSubject=a;this.lightSphere.properties.gizmoRoot=this};THREE.DirectionalLightHelper.prototype=Object.create(THREE.Object3D.prototype);
+THREE.DirectionalLightHelper=function(a,b,c){THREE.Object3D.call(this);this.light=a;this.position=a.position;this.properties.isGizmo=true;this.color=a.color.clone();this.color.r=this.color.r*a.intensity;this.color.g=this.color.g*a.intensity;this.color.b=this.color.b*a.intensity;var d=this.color.getHex();this.direction=new THREE.Vector3;this.direction.sub(a.target.position,a.position);var e=new THREE.SphereGeometry(b,8,4),b=new THREE.SphereGeometry(b,16,8),f=new THREE.MeshBasicMaterial({color:d,fog:false});
+this.lightArrow=new THREE.ArrowHelper(this.direction,null,c,d);this.lightSphere=new THREE.Mesh(b,f);this.lightArrow.cone.material.fog=false;this.lightArrow.line.material.fog=false;this.add(this.lightArrow);this.add(this.lightSphere);this.targetSphere=null;if(a.target.properties.targetInverse){c=new THREE.MeshBasicMaterial({color:d,wireframe:true,fog:false});this.targetSphere=new THREE.Mesh(e,c);this.targetSphere.position=a.target.position;this.targetSphere.properties.isGizmo=true;this.targetSphere.properties.gizmoSubject=
+a.target;this.targetSphere.properties.gizmoRoot=this.targetSphere;d=new THREE.LineDashedMaterial({color:d,dashSize:4,gapSize:4,opacity:0.75,transparent:true,fog:false});e=new THREE.Geometry;e.vertices.push(this.position.clone());e.vertices.push(this.targetSphere.position.clone());e.computeLineDistances();this.targetLine=new THREE.Line(e,d);this.targetLine.properties.isGizmo=true}this.lightSphere.properties.isGizmo=true;this.lightSphere.properties.gizmoSubject=a;this.lightSphere.properties.gizmoRoot=
+this};THREE.DirectionalLightHelper.prototype=Object.create(THREE.Object3D.prototype);
 THREE.DirectionalLightHelper.prototype.update=function(){this.direction.sub(this.light.target.position,this.light.position);this.lightArrow.setDirection(this.direction);this.color.copy(this.light.color);var a=THREE.Math.clamp(this.light.intensity,0,1);this.color.r=this.color.r*a;this.color.g=this.color.g*a;this.color.b=this.color.b*a;this.lightArrow.setColor(this.color.getHex());this.lightSphere.material.color.copy(this.color);this.targetSphere.material.color.copy(this.color);this.targetLine.material.color.copy(this.color);
-this.targetLine.geometry.vertices[0].copy(this.light.position);this.targetLine.geometry.vertices[1].copy(this.light.target.position);this.targetLine.geometry.computeLineDistances();this.targetLine.geometry.verticesNeedUpdate=true};THREE.SubdivisionModifier=function(a){this.subdivisions=a===void 0?1:a;this.useOldVertexColors=false;this.supportUVs=true;this.debug=false};THREE.SubdivisionModifier.prototype.modify=function(a){for(var b=this.subdivisions;b-- >0;)this.smooth(a)};
-THREE.GeometryUtils.orderedKey=function(a,b){return Math.min(a,b)+"_"+Math.max(a,b)};THREE.GeometryUtils.computeEdgeFaces=function(a){function b(a,b){g[a]===void 0&&(g[a]=[]);g[a].push(b)}var c,d,e,f,g={},h=THREE.GeometryUtils.orderedKey;c=0;for(d=a.faces.length;c<d;c++){e=a.faces[c];if(e instanceof THREE.Face3){f=h(e.a,e.b);b(f,c);f=h(e.b,e.c);b(f,c);f=h(e.c,e.a);b(f,c)}else if(e instanceof THREE.Face4){f=h(e.a,e.b);b(f,c);f=h(e.b,e.c);b(f,c);f=h(e.c,e.d);b(f,c);f=h(e.d,e.a);b(f,c)}}return g};
+this.targetLine.geometry.vertices[0].copy(this.light.position);this.targetLine.geometry.vertices[1].copy(this.light.target.position);this.targetLine.geometry.computeLineDistances();this.targetLine.geometry.verticesNeedUpdate=true};
+THREE.PointLightHelper=function(a,b){THREE.Object3D.call(this);this.light=a;this.position=a.position;this.properties.isGizmo=true;this.color=a.color.clone();this.color.r=this.color.r*a.intensity;this.color.g=this.color.g*a.intensity;this.color.b=this.color.b*a.intensity;var c=this.color.getHex(),d=new THREE.SphereGeometry(b,16,8),e=new THREE.MeshBasicMaterial({color:c,fog:false});this.lightSphere=new THREE.Mesh(d,e);this.add(this.lightSphere);this.lightSphere.properties.isGizmo=true;this.lightSphere.properties.gizmoSubject=
+a;this.lightSphere.properties.gizmoRoot=this;for(var c=new THREE.LineBasicMaterial({color:c,fog:false}),d=new THREE.Geometry,e=b*1.25,f=b*2.25,g=0.707*e,h=0.707*f,e=[[e,0,0],[f,0,0],[-e,0,0],[-f,0,0],[0,e,0],[0,f,0],[0,-e,0],[0,-f,0],[0,0,e],[0,0,f],[0,0,-e],[0,0,-f],[g,g,0],[h,h,0],[-g,-g,0],[-h,-h,0],[g,-g,0],[h,-h,0],[-g,g,0],[-h,h,0],[g,0,g],[h,0,h],[-g,0,-g],[-h,0,-h],[g,0,-g],[h,0,-h],[-g,0,g],[-h,0,h],[0,g,g],[0,h,h],[0,-g,-g],[0,-h,-h],[0,g,-g],[0,h,-h],[0,-g,g],[0,-h,h]],f=0,g=e.length;f<
+g;f++)d.vertices.push(new THREE.Vector3(e[f][0],e[f][1],e[f][2]));this.lightLine=new THREE.Line(d,c,THREE.LinePieces);this.add(this.lightLine)};THREE.PointLightHelper.prototype=Object.create(THREE.Object3D.prototype);THREE.PointLightHelper.prototype.update=function(){this.color.copy(this.light.color);var a=THREE.Math.clamp(this.light.intensity,0,1);this.color.r=this.color.r*a;this.color.g=this.color.g*a;this.color.b=this.color.b*a;this.lightSphere.material.color.copy(this.color);this.lightLine.material.color.copy(this.color)};
+THREE.SubdivisionModifier=function(a){this.subdivisions=a===void 0?1:a;this.useOldVertexColors=false;this.supportUVs=true;this.debug=false};THREE.SubdivisionModifier.prototype.modify=function(a){for(var b=this.subdivisions;b-- >0;)this.smooth(a)};THREE.GeometryUtils.orderedKey=function(a,b){return Math.min(a,b)+"_"+Math.max(a,b)};
+THREE.GeometryUtils.computeEdgeFaces=function(a){function b(a,b){g[a]===void 0&&(g[a]=[]);g[a].push(b)}var c,d,e,f,g={},h=THREE.GeometryUtils.orderedKey;c=0;for(d=a.faces.length;c<d;c++){e=a.faces[c];if(e instanceof THREE.Face3){f=h(e.a,e.b);b(f,c);f=h(e.b,e.c);b(f,c);f=h(e.c,e.a);b(f,c)}else if(e instanceof THREE.Face4){f=h(e.a,e.b);b(f,c);f=h(e.b,e.c);b(f,c);f=h(e.c,e.d);b(f,c);f=h(e.d,e.a);b(f,c)}}return g};
 THREE.SubdivisionModifier.prototype.smooth=function(a){function b(){m.debug&&(console&&console.assert)&&console.assert.apply(console,arguments)}function c(){m.debug&&console.log.apply(console,arguments)}function d(){console&&console.log.apply(console,arguments)}function e(a,b,d,e,g,h,l){var n=new THREE.Face4(a,b,d,e,null,g.color,g.materialIndex);if(m.useOldVertexColors){n.vertexColors=[];for(var o,p,q,s=0;s<4;s++){q=h[s];o=new THREE.Color;o.setRGB(0,0,0);for(var r=0;r<q.length;r++){p=g.vertexColors[q[r]-
 1];o.r=o.r+p.r;o.g=o.g+p.g;o.b=o.b+p.b}o.r=o.r/q.length;o.g=o.g/q.length;o.b=o.b/q.length;n.vertexColors[s]=o}}i.push(n);if(m.supportUVs){g=[f(a,""),f(b,l),f(d,l),f(e,l)];g[0]?g[1]?g[2]?g[3]?j.push(g):c("d :( ",e+":"+l):c("c :( ",d+":"+l):c("b :( ",b+":"+l):c("a :( ",a+":"+l)}}function f(a,b){var e=a+":"+b,f=u[e];if(!f){a>=q&&a<q+o.length?c("face pt"):c("edge pt");d("warning, UV not found for",e);return null}return f}function g(a,b,c){var e=a+":"+b;e in u?d("dup vertexNo",a,"oldFaceNo",b,"value",
 c,"key",e,u[e]):u[e]=c}var h=[],i=[],j=[],m=this,n=THREE.GeometryUtils.orderedKey,l=THREE.GeometryUtils.computeEdgeFaces,p=a.vertices,o=a.faces,q=p.length,h=p.concat(),s=[],r={},A={},u={},t,F,z,w,v,C=a.faceVertexUvs[0],D;c("originalFaces, uvs, originalVerticesLength",o.length,C.length,q);if(m.supportUVs){t=0;for(F=C.length;t<F;t++){z=0;for(w=C[t].length;z<w;z++){D=o[t]["abcd".charAt(z)];g(D,t,C[t][z])}}}if(C.length==0)m.supportUVs=false;t=0;for(var I in u)t++;if(!t){m.supportUVs=false;c("no uvs")}t=

editor/js/ui/Viewport.js

@@ -35,7 +35,7 @@ var Viewport = function ( signals ) {
 	var grid = new THREE.Line( geometry, material, THREE.LinePieces );
 	sceneHelpers.add( grid );
 
-	var selectionBox = new THREE.Mesh( new THREE.CubeGeometry( 1, 1, 1 ), new THREE.MeshBasicMaterial( { color: 0xffff00, wireframe: true } ) );
+	var selectionBox = new THREE.Mesh( new THREE.CubeGeometry( 1, 1, 1 ), new THREE.MeshBasicMaterial( { color: 0xffff00, wireframe: true, fog: false } ) );
 	selectionBox.matrixAutoUpdate = false;
 	selectionBox.visible = false;
 	sceneHelpers.add( selectionBox );
@@ -65,6 +65,9 @@ var Viewport = function ( signals ) {
 	light1.target.properties.targetInverse = light1;
 	light2.target.properties.targetInverse = light2;
 
+	var light3 = new THREE.PointLight( 0xffaa00, 0.75 );
+	light3.position.set( 0, -200, 0 );
+
 	// fog
 
 	var oldFogType = "None";
@@ -83,6 +86,8 @@ var Viewport = function ( signals ) {
 	light2.name = "Light 2";
 	light2.target.name = "Light 2 Target";
 
+	light3.name = "Light 3";
+
 	// active objects
 
 	camera.properties.active = true;
@@ -308,7 +313,10 @@ var Viewport = function ( signals ) {
 
 		if ( object instanceof THREE.DirectionalLight ) {
 
-			var lightGizmo = new THREE.DirectionalLightHelper( object, 30 );
+			var sphereSize = 5;
+			var arrowLength = 30;
+
+			var lightGizmo = new THREE.DirectionalLightHelper( object, sphereSize, arrowLength );
 			sceneHelpers.add( lightGizmo );
 			sceneHelpers.add( lightGizmo.targetSphere );
 			sceneHelpers.add( lightGizmo.targetLine );
@@ -322,8 +330,27 @@ var Viewport = function ( signals ) {
 			objects.push( lightGizmo.targetLine );
 
 		} else if ( object instanceof THREE.PointLight ) {
+
+			var sphereSize = 5;
+
+			var lightGizmo = new THREE.PointLightHelper( object, sphereSize );
+			sceneHelpers.add( lightGizmo );
+
+			object.properties.helper = lightGizmo;
+			object.properties.pickingProxy = lightGizmo.lightSphere;
+
+			objects.push( lightGizmo.lightSphere );
+
 		} else if ( object instanceof THREE.SpotLight ) {
+
+			//var lightGizmo = new THREE.SpotLightHelper( object );
+			//sceneHelpers.add( lightGizmo );
+
 		} else if ( object instanceof THREE.HemisphereLight ) {
+
+			//var lightGizmo = new THREE.HemisphereLightHelper( object );
+			//sceneHelpers.add( lightGizmo );
+
 		}
 
 	};
@@ -353,6 +380,9 @@ var Viewport = function ( signals ) {
 			object.properties.helper.update();
 
 		} else if ( object instanceof THREE.PointLight ) {
+
+			object.properties.helper.update();
+
 		} else if ( object instanceof THREE.SpotLight ) {
 		} else if ( object instanceof THREE.HemisphereLight ) {
 		} else if ( object.properties.targetInverse ) {
@@ -720,8 +750,10 @@ var Viewport = function ( signals ) {
 	// must come after listeners are registered
 
 	signals.sceneChanged.dispatch( scene );
+
 	signals.objectAdded.dispatch( light1 );
 	signals.objectAdded.dispatch( light2 );
+	signals.objectAdded.dispatch( light3 );
 
 	//
 

src/extras/helpers/DirectionalLightHelper.js

@@ -4,7 +4,7 @@
  *	- shows directional light color, intensity, position, orientation and target
  */
 
-THREE.DirectionalLightHelper = function ( light, arrowLength ) {
+THREE.DirectionalLightHelper = function ( light, sphereSize, arrowLength ) {
 
 	THREE.Object3D.call( this );
 
@@ -25,13 +25,16 @@ THREE.DirectionalLightHelper = function ( light, arrowLength ) {
 	this.direction = new THREE.Vector3();
 	this.direction.sub( light.target.position, light.position );
 
-	var targetGeo = new THREE.SphereGeometry( 5, 8, 4 );
-	var lightGeo = new THREE.SphereGeometry( 5, 16, 8 );
-	var lightMaterial = new THREE.MeshBasicMaterial( { color: hexColor } );
+	var targetGeo = new THREE.SphereGeometry( sphereSize, 8, 4 );
+	var lightGeo = new THREE.SphereGeometry( sphereSize, 16, 8 );
+	var lightMaterial = new THREE.MeshBasicMaterial( { color: hexColor, fog: false } );
 
 	this.lightArrow = new THREE.ArrowHelper( this.direction, null, arrowLength, hexColor );
 	this.lightSphere = new THREE.Mesh( lightGeo, lightMaterial );
 
+	this.lightArrow.cone.material.fog = false;
+	this.lightArrow.line.material.fog = false;
+
 	this.add( this.lightArrow );
 	this.add( this.lightSphere );
 
@@ -39,7 +42,7 @@ THREE.DirectionalLightHelper = function ( light, arrowLength ) {
 
 	if ( light.target.properties.targetInverse ) {
 
-		var targetMaterial = new THREE.MeshBasicMaterial( { color: hexColor, wireframe: true } );
+		var targetMaterial = new THREE.MeshBasicMaterial( { color: hexColor, wireframe: true, fog: false } );
 
 		this.targetSphere = new THREE.Mesh( targetGeo, targetMaterial );
 		this.targetSphere.position = light.target.position;
@@ -48,7 +51,7 @@ THREE.DirectionalLightHelper = function ( light, arrowLength ) {
 		this.targetSphere.properties.gizmoSubject = light.target;
 		this.targetSphere.properties.gizmoRoot = this.targetSphere;
 
-		var lineMaterial = new THREE.LineDashedMaterial( { color: hexColor, dashSize: 4, gapSize: 4, opacity: 0.75, transparent: true } );
+		var lineMaterial = new THREE.LineDashedMaterial( { color: hexColor, dashSize: 4, gapSize: 4, opacity: 0.75, transparent: true, fog: false } );
 		var lineGeometry = new THREE.Geometry();
 		lineGeometry.vertices.push( this.position.clone() );
 		lineGeometry.vertices.push( this.targetSphere.position.clone() );

src/extras/helpers/PointLightHelper.js

@@ -0,0 +1,89 @@
+/**
+ * @author alteredq / http://alteredqualia.com/
+ *
+ *	- shows point light color, intensity, and position
+ */
+
+THREE.PointLightHelper = function ( light, sphereSize ) {
+
+	THREE.Object3D.call( this );
+
+	this.light = light;
+
+	this.position = light.position;
+
+	this.properties.isGizmo = true;
+
+	this.color = light.color.clone();
+
+	this.color.r *= light.intensity;
+	this.color.g *= light.intensity;
+	this.color.b *= light.intensity;
+
+	var hexColor = this.color.getHex();
+
+	var lightGeo = new THREE.SphereGeometry( sphereSize, 16, 8 );
+	var lightMaterial = new THREE.MeshBasicMaterial( { color: hexColor, fog: false } );
+
+	this.lightSphere = new THREE.Mesh( lightGeo, lightMaterial );
+
+	this.add( this.lightSphere );
+
+	this.lightSphere.properties.isGizmo = true;
+	this.lightSphere.properties.gizmoSubject = light;
+	this.lightSphere.properties.gizmoRoot = this;
+
+	var lineMaterial = new THREE.LineBasicMaterial( { color: hexColor, fog: false } );
+	var lineGeometry = new THREE.Geometry();
+
+	var sd = sphereSize * 1.25;
+	var ed = sphereSize * 2.25;
+
+	var sd2 = 0.707 * sd;
+	var ed2 = 0.707 * ed;
+
+	var rays = [ [ sd, 0, 0 ], [ ed, 0, 0 ], [ -sd, 0, 0 ], [ -ed, 0, 0 ],
+				 [ 0, sd, 0 ], [ 0, ed, 0 ], [ 0, -sd, 0 ], [ 0, -ed, 0 ],
+				 [ 0, 0, sd ], [ 0, 0, ed ], [ 0, 0, -sd ], [ 0, 0, -ed ],
+				 [ sd2, sd2, 0 ], [ ed2, ed2, 0 ], [ -sd2, -sd2, 0 ], [ -ed2, -ed2, 0 ],
+				 [ sd2, -sd2, 0 ], [ ed2, -ed2, 0 ], [ -sd2, sd2, 0 ], [ -ed2, ed2, 0 ],
+				 [ sd2, 0, sd2 ], [ ed2, 0, ed2 ], [ -sd2, 0, -sd2 ], [ -ed2, 0, -ed2 ],
+				 [ sd2, 0, -sd2 ], [ ed2, 0, -ed2 ], [ -sd2, 0, sd2 ], [ -ed2, 0, ed2 ],
+				 [ 0, sd2, sd2 ], [ 0, ed2, ed2 ], [ 0, -sd2, -sd2 ], [ 0, -ed2, -ed2 ],
+				 [ 0, sd2, -sd2 ], [ 0, ed2, -ed2 ], [ 0, -sd2, sd2 ], [ 0, -ed2, ed2 ]
+	];
+
+	for ( var i = 0, il = rays.length; i < il; i ++ ) {
+
+		var x = rays[ i ][ 0 ];
+		var y = rays[ i ][ 1 ];
+		var z = rays[ i ][ 2 ];
+
+		lineGeometry.vertices.push( new THREE.Vector3( x, y, z ) );
+
+	}
+
+	this.lightLine = new THREE.Line( lineGeometry, lineMaterial, THREE.LinePieces );
+
+	this.add( this.lightLine );
+
+}
+
+THREE.PointLightHelper.prototype = Object.create( THREE.Object3D.prototype );
+
+THREE.PointLightHelper.prototype.update = function () {
+
+	// set sphere color to light color * light intensity
+
+	this.color.copy( this.light.color );
+
+	var intensity = THREE.Math.clamp( this.light.intensity, 0, 1 );
+	this.color.r *= intensity;
+	this.color.g *= intensity;
+	this.color.b *= intensity;
+
+	this.lightSphere.material.color.copy( this.color );
+	this.lightLine.material.color.copy( this.color );
+
+}
+

utils/includes/extras.json

@@ -37,6 +37,7 @@
 	"../src/extras/helpers/ArrowHelper.js",
 	"../src/extras/helpers/CameraHelper.js",
 	"../src/extras/helpers/DirectionalLightHelper.js",
+	"../src/extras/helpers/PointLightHelper.js",
 	"../src/extras/modifiers/SubdivisionModifier.js",
 	"../src/extras/objects/ImmediateRenderObject.js",
 	"../src/extras/objects/LensFlare.js",

utils/includes/webgl.json

@@ -78,6 +78,7 @@
 	"../src/extras/core/Gyroscope.js",
 	"../src/extras/helpers/CameraHelper.js",
 	"../src/extras/helpers/DirectionalLightHelper.js",
+	"../src/extras/helpers/PointLightHelper.js",
 	"../src/extras/objects/LensFlare.js",
 	"../src/extras/objects/ImmediateRenderObject.js",
 	"../src/extras/renderers/plugins/LensFlarePlugin.js",