Why doesn't the light in this scene work?

javascript, three.js

Solution

Regarding your major concern, you need to use `WebGLRenderer` instead of `CanvasRenderer`.

Fiddle: http://jsfiddle.net/6eRzt/10/

EDIT: There are a lot of ways of addressing your first concern. Everyone will have his own opinion.

Here is how I would do it. The closure keeps the variables from polluting the global namespace; there is no need for all of your `this` references.

Fiddle #2: http://jsfiddle.net/6eRzt/11/

Problem

I wrote a game class with coffeescript that displays a plain and a rotating cube. You can see the code here: http://jsfiddle.net/6eRzt/6/ All is dandy, except for two things: 1) I have to do an ugly hack to get the `requestAnimationFrame` callback working: ``` var sh = new App(); sh.start(); function animate() { sh.animate(); requestAnimationFrame(animate); } animate();​ ``` 2) This is my major concern: The SpotLight does not work. I tried to replicate the behavior from another JSFiddle (referenced in this Question), but without success. Maybe it's just a stupid typo, or maybe I'm doing it wrong. Plus: Am I on the wrong track with my App class? All the three.js examples I found so far use plain functions to get stuff running.

Original source