Team:Freiburg/js/startIcosahedron.js

From 2014.igem.org

var startIcosahedron = function(){

 var container;
 var camera, scene, renderer;
 var mesh, group, light;
 var tspeed = 1;
 var showColor = false;
 var linewidth = 1.5;
 init();
 animate();
 function init() {
   container = document.getElementById( 'icosahedron' );
   camera = new THREE.PerspectiveCamera( 3.5, 1, 1, 10000 );
   camera.position.z = 1800;
   scene = new THREE.Scene();
   light = new THREE.DirectionalLight( 0xffffff );
   light.position.set( 0, 0, 1 );
   scene.add( light );
   var canvas = document.createElement( 'canvas' );
   canvas.width = container.width;
   canvas.height = container.height;
   var faceIndices = [ 'a', 'b', 'c', 'd' ];
   var color, f, p, n, vertexIndex,
     radius = 50,
     geometry = new THREE.IcosahedronGeometry( radius );
   for ( var i = 0; i < geometry.faces.length; i ++ ) {
     f = geometry.faces[ i ];
     n = ( f instanceof THREE.Face3 ) ? 3 : 4;
     for( var j = 0; j < n; j++ ) {
       vertexIndex = f[ faceIndices[ j ] ];
       p = geometry.vertices[ vertexIndex ];
       color = new THREE.Color( 0xffffff );
       color.setHSL( ( p.y / radius + 1 ) / 2, 1.0, 0.5 );
       f.vertexColors[ j ] = color;
     }
   }
   var materials = [
     new THREE.MeshLambertMaterial( { color: 0xffffff, shading: THREE.FlatShading, vertexColors: THREE.VertexColors } ),
     new THREE.MeshBasicMaterial( { color: 0x000000, shading: THREE.FlatShading, wireframe: true, transparent: true } )
   ];
   var material2 = new THREE.LineBasicMaterial({
     color: 0xffffff,
     linewidth: linewidth,
     overdraw: true
   });
   group2 = new THREE.Object3D();
   geometry3 = new THREE.IcosahedronGeometry( radius + 1 );
   for ( var i = 0; i < geometry3.faces.length; i ++ ) {
     f = geometry3.faces[ i ];
     n = ( f instanceof THREE.Face3 ) ? 3 : 4;
     var line = new THREE.Geometry();
     for( var j = 0; j < n; j++ ) {
       vertexIndex = f[ faceIndices[ j ] ];
       p = geometry3.vertices[ vertexIndex ];
       line.vertices.push(p);
     }
     group2.add( new THREE.Line( line, material2 ) );
   }
   group = THREE.SceneUtils.createMultiMaterialObject( geometry, materials );
   group.position.x = 0;
   group.rotation.x = 0;
   group2.rotation.x = -Math.PI/4.0;
   if (showColor) {
     group2.add(group);
   }
   scene.add( group2 );
   renderer = new THREE.WebGLRenderer( {
     antialias: true,
     canvas: container,
     alpha: true
   } );
   renderer.setSize( canvas.width, canvas.height );
 }
 function animate() {
   requestAnimationFrame( animate );
   // rotate the thingy
   group2.rotation.y += 0.012 * tspeed;
   group2.rotation.x += 0.005 * tspeed;
   render();
 }
 function render() {
   renderer.render( scene, camera );
 }

};