// JavaScript Document


$(document).ready(function(e)
{
	
		
	/* 3D */

	var camera, scene, renderer, geometry, material, mesh, objects, objects_amount;
	
	init();
	animate();

	
	function init()
	{
	
		camera = new THREE.Camera( 75, 5000 / 1000, 1, 5000 );
		camera.position.z = 1000;
		
		scene = new THREE.Scene();				
		
		material = new THREE.MeshBasicMaterial( { map: THREE.ImageUtils.loadTexture( 'img/leaf.png') });
		geometry = new THREE.PlaneGeometry( 64, 32, 1, 1 );
		
		objects = [];
		objects_amount = 15;
		
		
		for(var i = 0; i <objects_amount; i++)
		{
			
			mesh = new THREE.Mesh( geometry, material );
			mesh.doubleSided = true;
			mesh.position.x = -5000-(Math.random()*10000);
			mesh.position.y = -500+(Math.random()*1500);
			mesh.position.z = -500+(Math.random()*1200);
			
			
			mesh.rotation.x = Math.random()*10;
			mesh.rotation.y = Math.random()*10;
			
			mesh.gy = -1;
			mesh.rotationx = Math.random()*0.1;
			mesh.rotationy = Math.random()*0.1;
			
			scene.addObject( mesh );
			objects.push(mesh);
		}
				
		renderer = new THREE.CanvasRenderer();
		renderer.setSize( 5000, 1000 );	
			
		$('#viewport').append( renderer.domElement );		
		
	
	}
	
	function animate()
	{
	
		// Include examples/js/RequestAnimationFrame.js for cross-browser compatibility.
		requestAnimationFrame( animate );
		render();
	
	}
	
	function render()
	{
		
		for(var i = 0; i <objects_amount; i++)
		{
			objects[i].rotation.x += objects[i].rotationx;
			objects[i].rotation.y += objects[i].rotationy;
			objects[i].position.x += 10;
			objects[i].position.y += objects[i].gy;
			
			if(objects[i].position.x >= 10000 )
			{
				objects[i].position.x = -5000-(Math.random()*10000);
			}
			
			if(objects[i].position.y <= -400 )
			{
				objects[i].gy = 1;
			}
			else if(objects[i].position.y >= 400 )
			{
				objects[i].gy = -1;
			}
			
						
		}
		
		renderer.render( scene, camera );
		
	
	}
	
	
	
	/* CONTENT */
	
	var resize_this, window_w, window_h;

	resize_this = function()
	{
		window_w = $(window).width();
		window_h = $(window).height();
		
		$('#viewport').css({'left':((window_w/2)-2500)+'px', 'top':((window_h/2)-500)+'px'});
		$('#container').css({'left':((window_w/2)-400)+'px', 'top':((window_h/2)-225)+'px'});
	
	}
	
	$(window).resize(function()
	{
		
		resize_this();
		
	});
	
	resize_this();
	

});
