document.addEventListener("mousemove", onDocumentMouseMove, false );

// set the scene size
var WIDTH = window.innerWidth,
    HEIGHT = window.innerWidth;

// set some camera attributes
var VIEW_ANGLE = 75,
    ASPECT = WIDTH / HEIGHT,
    NEAR = 0.01,
    FAR = 100;

var camera, scene, renderer;

init();
onWindowResize();
animate();

function init()
{
	// create renderer
	renderer = new THREE.WebGLRenderer();
	renderer.setSize(WIDTH, HEIGHT);

	renderer.shadowMapEnabled = true;
	renderer.shadowMapSoft = true;

	// create scene
	scene = new THREE.Scene();
	// create camera
	camera = new THREE.PerspectiveCamera(  VIEW_ANGLE,
	                                ASPECT,
	                                NEAR,
	                                FAR  );
	camera.position.z = 5;
	scene.add(camera);

	// add this stuff in a container
	document.getElementById("container").appendChild(renderer.domElement);

	window.addEventListener( 'resize', onWindowResize, false );
}

function onWindowResize()
{
	WIDTH = window.innerWidth;
	HEIGHT = window.innerHeight;

	camera.aspect = window.innerWidth / window.innerHeight;
	camera.updateProjectionMatrix();

	renderer.setSize( window.innerWidth, window.innerHeight );

	render();
}

function onDocumentMouseMove(event)
{
	mouseX = ( event.clientX - (WIDTH / 2.0) );
	mouseY = ( event.clientY - (HEIGHT / 2.0) );
}

function animate()
{
	requestAnimationFrame(animate);
	render();
	update();
}

function render()
{
	renderer.render(scene, camera);
}

function update()
{

}