References

A lot of demos of three.js

https://github.com/stemkoski/stemkoski.github.com/raw/master/Three.js/js/jquery-1.9.1.js
https://github.com/stemkoski/stemkoski.github.com/tree/master/Three.js

Make rain

https://aerotwist.com/tutorials/creating-particles-with-three-js/

Note: Due to the version issues, this line :particle = new THREE.Vertex(new THREE.Vector3(pX, pY, pZ)); Change to particle = new THREE.Vector3(pX, pY, pZ);
For this line, I directly add particle velocity to particle position.addSelf()does not work in my project.

particle.position.addSelf(
      particle.velocity);
  }

http://danni-three.blogspot.com/2013/09/threejs-particle-engine.html?showComment=1456265994236#c986744027506486296

Note: I have tried to apply this but failed, did not figure out the problem. But it is a useful resource.

Sky box

http://learningthreejs.com/blog/2011/08/15/lets-do-a-sky/

Note: The thing that useful to my project is in the comments:skyboxMesh.doubleSided = true;

Sky texture

http://www.3d66.com/tietu_1_348.html

Add audio

https://sites.google.com/site/threejstuts/home/sound

Free 3D models

http://tf3dm.com/3d-models/blender-gun
https://www.cgtrader.com/3d-models?keywords=abandoned

Load models to three js

http://blog.romanliutikov.com/post/58690562825/external-models-in-threejs

Note: I use ColladaLoader.js to load the .dae model which is more convenient. Because the ColladaLoader.js is from the original game project itself, it can avoid incompatible problems caused by versions. My three.js and JSONloader.js that I downloaded from other place version(not latest) do not match the model.json format version. It threw old format(It's actually too new, it's the latest).

https://quaintproject.wordpress.com/2014/01/25/exporting-from-blender-to-web-gl-using-collada-and-three-js-part-2/

Note: Use blender to export .dae. Pay attention to the settings in this link.

problems and solutions

https://github.com/mrdoob/three.js/issues/902

Note: transparent material.

http://webroxtar.com/2011/10/solution-jquery-click-event-gets-called-twice-fires-twice/

Note: Click once, run once. My problem is I put the click function inside the animation loop, when I click once, the lines inside it will keep on looping. This is also the reason why sometimes the toggle button does not work, click ones means keep on clicking thousand of times.

http://stackoverflow.com/questions/8733179/what-is-the-equivalent-of-javas-system-out-println-in-javascript

Note: Use to debug.

https://github.com/mrdoob/three.js/issues/1586

Note: Change texture in render loop:

 sphere.material.map = THREE.ImageUtils.loadTexture('texture0.png',{},function(){
           //add callback here if you want
        });