¿Por qué no funciona la luz en esta escena?

Question

Escribí una clase de juego con coffeescript que muestra un cubo plano y uno rotativo. Se puede ver el código aquí: http://jsfiddle.net/6eRzt/6/

Todo es excelente, excepto por dos cosas:

1) Tengo que hacer un truco feo para conseguir el funcionamiento de requestAnimationFrame de devolución de llamada:

var sh = new App(); 
sh.start(); 

function animate() { 
    sh.animate(); 
    requestAnimationFrame(animate); 
} 

animate();​ 

2) Esta es mi principal preocupación: SpotLight no funciona. Intenté replicar el comportamiento de otro JSFiddle (al que se hace referencia en este Question), pero sin éxito. Tal vez es solo un error tipográfico estúpido, o tal vez lo estoy haciendo mal.

Plus: ¿Estoy en el camino equivocado con mi clase de aplicación? Todos los ejemplos de three.js que encontré hasta ahora usan funciones simples para hacer funcionar cosas.

Answer 1

En relación con su principal preocupación, debe utilizar WebGLRenderer en lugar de CanvasRenderer.

violín: http://jsfiddle.net/6eRzt/10/

EDIT: Hay muchas maneras de hacer frente a su primera preocupación. Todos tendrán su propia opinión.

Así es como lo haría. El cierre evita que las variables contaminen el espacio de nombres global; no hay necesidad de todas sus referencias this.

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