var container, stats;

var camera, scene, renderer, particles, geometry, materials = [], parameters, i, h, color;

var mouseX = 0, mouseY = 0;

​

var windowHalfX = window.innerWidth / 2;

var windowHalfY = window.innerHeight / 2;

​

init();

animate();

​

function init() {

​

  container = document.createElement( 'div' );

  document.body.appendChild( container );

​

  camera = new THREE.PerspectiveCamera( 75, window.innerWidth / window.innerHeight, 1, 3000 );

  camera.position.z = 1000;

​

  scene = new THREE.Scene();

  scene.fog = new THREE.FogExp2( 0x220018, 0.0007 );

​

  geometry = new THREE.Geometry();

​

  for ( i = 0; i < 50000; i ++ ) {

    var vertex = new THREE.Vector3();

    vertex.x = Math.random() * 200 - 100;

    vertex.y = Math.random() * 2000 - 1000;

    vertex.z = Math.random() * 200 - 100;

​

    geometry.vertices.push( vertex );

  }

​

  parameters = [

    [ [1, 1, 0.5], 1 ],

    [ [0.5, 1, 0.5], 1 ],

    [ [0.90, 1, 0.5], 1 ],

    [ [0.85, 1, 0.5], 1 ],

    [ [0.80, 1, 0.5], 1 ],

    [ [1, 1, 0.5], 1 ],

    [ [0.5, 1, 0.5], 1 ],

    [ [0.90, 1, 0.5], 1 ],

    [ [0.85, 1, 0.5], 1 ]

  ];

​

  for ( i = 0; i < parameters.length; i ++ ) {

    size  = parameters[i][1];

​

    materials[i] = new THREE.PointCloudMaterial( { size: size } );

​

    particles = new THREE.PointCloud( geometry, materials[i]);

​

    particles.rotation.x = Math.random() * 5

    particles.rotation.y = Math.random() * 5;

    particles.rotation.z = Math.random() * 5;

​

    scene.add( particles );

  }

​

  renderer = new THREE.WebGLRenderer();

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

  container.appendChild( renderer.domElement );

​

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

  document.addEventListener( 'touchstart', onDocumentTouchStart, false );

  document.addEventListener( 'touchmove', onDocumentTouchMove, false );

​

  //

​

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

​

}

​

function onWindowResize() {

​

  windowHalfX = window.innerWidth / 2;

  windowHalfY = window.innerHeight / 2;

​

  camera.aspect = window.innerWidth / window.innerHeight;

  camera.updateProjectionMatrix();

​

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

​

}

​

function onDocumentMouseMove( event ) {

​

  mouseX = event.clientX - windowHalfX;

  mouseY = event.clientY - windowHalfY;

​

}

​

function onDocumentTouchStart( event ) {

​

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

​

    event.preventDefault();

​

    mouseX = event.touches[ 0 ].pageX - windowHalfX;

    mouseY = event.touches[ 0 ].pageY - windowHalfY;

​

  }

​

}

​

function onDocumentTouchMove( event ) {

​

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

​

    event.preventDefault();

​

    mouseX = event.touches[ 0 ].pageX - windowHalfX;

    mouseY = event.touches[ 0 ].pageY - windowHalfY;

​

  }

​

}

​

//

​

function animate() {

​

  requestAnimationFrame( animate );

​

  render();

}

​

function render() {

  camera.position.z -= 2;

  camera.position.x += ( mouseX - camera.position.x ) * 1;

  camera.position.z += ( - mouseY - camera.position.y ) * 0.05;

​

​

  if(camera.position.z > 2500){

    camera.position.z = 2500;

  }

​

  if(camera.position.z < -2500){

    camera.position.z = -2500;

  }

​

  camera.lookAt( scene.position );

​

  renderer.render( scene, camera );

}

​