var separation = 100, amountx = 50, amounty = 50;
	var container, stats;
	var camera, scene, renderer;

	var particles, particle, count = 0;

	var mousex = 0, mousey = 0;
	var container = document.getelementbyid( 'wave' );
	var windowhalfx = window.innerwidth / 2;
	var windowhalfy = parseint(container.style.height) / 2;

	init();
	animate();
	function init() {

		container = document.getelementbyid( 'wave' );


		//document.body.appendchild( container );

		camera = new three.perspectivecamera( 80, window.innerwidth / parseint(container.style.height),30, 10000 ); //摄像头 距离 频率 视野
		camera.position.y = 500;
		camera.position.z = 1000;


		scene = new three.scene();

		particles = new array();

		var pi2 = math.pi * 2;
		var material = new three.spritecanvasmaterial( {

			color: "#fff",
			opacity:1,
			program: function ( context ) {

				context.beginpath();
				context.arc( 0, 0, 0.3, 0, pi2, true ); 
				context.fill();

			}

		} );

		var i = 0;

		for ( var ix = 0; ix < amountx; ix ++ ) {

			for ( var iy = 0; iy < amounty; iy ++ ) {

				particle = particles[ i ++ ] = new three.sprite( material );
				particle.position.x = ix * separation - ( ( amountx * separation ) / 2 );
				particle.position.z = iy * separation - ( ( amounty * separation ) / 2 );
				scene.add( particle );

			}

		}

		renderer = new three.canvasrenderer({
			alpha:true,
			antialias:true,
			preservedrawingbuffer:true
		})

		renderer.setpixelratio( window.devicepixelratio );
		renderer.setsize( window.innerwidth, parseint(container.style.height) );
		container.appendchild( renderer.domelement );

		
		//stats = new stats();  
		//stats.domelement.style.position = 'absolute';
		//stats.domelement.style.top = '0px';
		//container.appendchild( stats.domelement );

		// container.addeventlistener( 'mousemove', ondocumentmousemove, false );
		// container.addeventlistener( 'touchstart', ondocumenttouchstart, false );
		// container.addeventlistener( 'touchmove', ondocumenttouchmove, false );

		//

		window.addeventlistener( 'resize', onwindowresize, false );

	}

	function onwindowresize() {

		windowhalfx = window.innerwidth / 2;
		windowhalfy = parseint(container.style.height) / 2;
		camera.aspect = window.innerwidth / parseint(container.style.height);
		camera.updateprojectionmatrix();
		renderer.setsize( window.innerwidth, 250 );

	}

	//

	function ondocumentmousemove( event ) {

		mousex = event.clientx - windowhalfx;
		//mousey = event.clienty - windowhalfy;  去掉y轴移动
	}

	function ondocumenttouchstart( event ) {

		if ( event.touches.length === 1 ) {

			event.preventdefault();

			mousex = event.touches[ 0 ].pagex - windowhalfx;
			//mousey = event.touches[ 0 ].pagey - windowhalfy; 去掉y轴移动

		}

	}

	function ondocumenttouchmove( event ) {

		if ( event.touches.length === 1 ) {

			event.preventdefault();

			mousex = event.touches[ 0 ].pagex - windowhalfx;
			//mousey = event.touches[ 0 ].pagey - windowhalfy; 去掉y轴移动

		}

	}

	//

	function animate() {

		requestanimationframe( animate );

		render();
		//stats.update();
		
	}

	function render() {

		camera.position.x += ( mousex - camera.position.x ) * .05;
		camera.position.y += ( - mousey - camera.position.y + 200 ) * .05;
		camera.lookat( scene.position );



		var i = 0;

		for ( var ix = 0; ix < amountx; ix ++ ) {

			for ( var iy = 0; iy < amounty; iy ++ ) {

				particle = particles[ i++ ];
				particle.position.y = ( math.sin( ( ix + count ) * 0.3 ) * 50 ) +
					( math.sin( ( iy + count ) * 0.5 ) * 50 );
				particle.scale.x = particle.scale.y = ( math.sin( ( ix + count ) * 0.3 ) + 1 ) * 4 +
					( math.sin( ( iy + count ) * 0.5 ) + 1 ) * 4;

			}

		}

		renderer.render( scene, camera );

		count += 0.1;

	}



	// window.onscroll = function(e){
	// 	var e =e || window.event;
	// 	var scrolltop=document.documentelement.scrolltop||document.body.scrolltop;
	// 	var height = $('.i-intro').height();
	// 	if(scrolltop>=height){
	// 		amountx=0
			
	// 	}else{
	// 		amountx=50;
	// 	}
	// }