Solar System Model

gistfile1.txt

var container, stats;
var camera, scene, projector, renderer;
var renderer2;

var PI2 = Math.PI * 2;

var mesh = [];

var programFill = function(context) {

    context.beginPath();
    context.arc(0, 0, 1, 0, PI2, true);
    context.closePath();
    context.fill();

}
    
var programFill = function(context) {

    context.beginPath();
    context.arc(0, 0, 1, 0, PI2, true);
    context.closePath();
    context.fill();

}

var programStroke = function(context) {

    context.lineWidth = 0.05;
    context.beginPath();
    context.arc(0, 0, 1, 0, PI2, true);
    context.closePath();
    context.stroke();

}

init();
animate();

function init() {
    container = document.createElement('div');
    document.body.appendChild(container);
    
    camera = new THREE.PerspectiveCamera(70, window.innerWidth / window.innerHeight, 1, 10000);
    camera.position.x = 400;
    camera.position.y = 1200;
    camera.position.z = 1500;
    
    scene = new THREE.Scene();

    //upped total stars to 400 so we can have smaller stars
    for (var i = 0; i < 400; i++) {

        var particle = new THREE.Particle(new THREE.ParticleCanvasMaterial({
            color: 0xffffff,
            //white outline to reflect starlight on black background
            program: programStroke,
            program: programFill //fills 'stars' with white to make them stand out even when small
        }));
        particle.position.x = Math.random() * 1000 - 500;
        particle.position.y = Math.random() * 1000 - 500;
        particle.position.z = Math.random() * 1000 - 500;
        //star randomized into earth on a reload ~ Way to detect collision?
        particle.scale.x = particle.scale.y = (i % 10) * .3;
        //Lowered star size since there are more and they're filled now
        scene.add(particle);

    }
    
 
    var pointLight = new THREE.PointLight( 0xffffff, 2000, 20000 );
                pointLight.position.x = 0;
                pointLight.position.y = 0;
                pointLight.position.z = 0.5;
                scene.add( pointLight );
    
    // light representation
    var sphere = new THREE.SphereGeometry( 150, 16, 16 );
    var lightMesh = new THREE.Mesh( sphere, new THREE.MeshBasicMaterial( { color: 0xffce3c, map: THREE.ImageUtils.loadTexture( 'http://orca.st.usm.edu/~jwilkes/Lava.jpg' ) } ) );
    lightMesh.scale.x = lightMesh.scale.y = lightMesh.scale.z = 1;
    lightMesh.position = pointLight.position;
    lightMesh.overdraw = true;
    lightMesh.updateMatrix();
    scene.add( lightMesh );
    
    //To make the planets take in light realistically the mesh type had to be lambert not basic
    
    var geometry = new THREE.SphereGeometry( 20, 16, 16 );
    var material = new THREE.MeshLambertMaterial( { color: 0xff4c10, map: THREE.ImageUtils.loadTexture( 'http://i.imgur.com/tWY94.jpg' )} );

    mesh[0] = new THREE.Mesh( geometry, material );
    mesh[0].position.set(200, 0, 20);
    scene.add(mesh[0]);
    
    var geometry = new THREE.SphereGeometry( 30, 16, 16 );
    var material = new THREE.MeshLambertMaterial( { color: 0xbeae00, map: THREE.ImageUtils.loadTexture( 'http://www.oera.net/How2/PlanetTexs/VenusMap_2500x1250.jpg' ) } );

    mesh[1] = new THREE.Mesh( geometry, material );
    //mesh[1].position.set(25, 0, 350);
    mesh[1].position.x = 25;
    mesh[1].position.y = 0;
    mesh[1].position.z = 350;
    scene.add(mesh[1]);
    
    var geometry = new THREE.SphereGeometry( 45, 16, 16 );
    var material = new THREE.MeshLambertMaterial( { color: 0x1024ff, map: THREE.ImageUtils.loadTexture( 'http://www.oera.net/How2/PlanetTexs/EarthMap_2500x1250.jpg' ) } );

    mesh[2] = new THREE.Mesh( geometry, material );
    mesh[2].position.set(-350, 0, -500);
    scene.add(mesh[2]);
    
   
    projector = new THREE.Projector();

    renderer = new THREE.CanvasRenderer();
    renderer.setSize(window.innerWidth, window.innerHeight);
    container.appendChild(renderer.domElement);
    
}

function animate() {

    requestAnimationFrame(animate);
    render();
}

var radius = 600;
var theta = 0;

function render() {

    // rotate camera
    /*theta += 0.7;
        
    var zoom = 0.88;
    //Zoom sets how close the camera is to the sun. 0.1 is IN the sun, 2.0 is FAR out, and 0.85 seems to be the sweet spot
    camera.position.x = radius * Math.sin(theta * Math.PI / 360) * zoom;
    camera.position.y = radius * Math.sin(theta * Math.PI / 360) * zoom;
    camera.position.z = radius * Math.cos(theta * Math.PI / 360) * zoom;
    
    camera.update();*/
    
    //mesh[1].position.x -= Math.sin(theta) * 0.3;
    //mesh[1].position.y -= Math.cos(theta) * 0.3;
    //mesh[1].updateMatrix();
    
    renderer.render(scene, camera);
    
    for (var u = 0; u < mesh.length; u++) {
        mesh[u].rotation.y -= 0.05;
        mesh[u].updateMatrix();
    }
    
}