Base Three.js fiddle

Starting point for making fiddles with Three.js

by John Grden

HTML

<script src="http://threejs.org/build/three.min.js"></script>
<script src="http://www.rockonflash.com/webGL/three/neo.js"></script>
<script src="http://www.rockonflash.com/webGL/three/MouseHandler.js"></script>
<script src="http://www.rockonflash.com/webGL/three/RotationCamera.js"></script>

CSS

html, canvas, body {
    width: 100%;
    height: 100%;
    padding: 0;
    margin: 0;
    background-color: #212121;
    overflow: hidden;
}

JavaScript

var camera, scene, renderer;

Neo.JackIntoThree();

camera = new THREE.PerspectiveCamera(60, window.innerWidth / window.innerHeight, 1, 1000);
camera.position.set(0, 0, 20);
camera.lookAt(new THREE.Vector3(0, 0, 0));		        

scene = new THREE.Scene();

var ambientLight = new THREE.AmbientLight(0x222222);
scene.add(ambientLight);

var light = new THREE.DirectionalLight(0xffffff, 1);
light.position.set(-10, 10, 10);
scene.add(light);
    
var geo = new THREE.TorusGeometry(1, .4, 8, 16);
var mat = new THREE.MeshPhongMaterial({
    color: 0xcccccc,
    shading: THREE.SmoothShading
});
var obj = new THREE.Mesh(geo, mat);
obj.DrawAllAxis(3);
scene.add(obj);

renderer = new THREE.WebGLRenderer();
renderer.setSize(window.innerWidth, window.innerHeight);
document.body.appendChild(renderer.domElement);
    
var mouseHandler = new Neo.MouseHandler(renderer.domElement);
mouseHandler.addEventListener("wheel", handleWheelEvent);
mouseHandler.addEventListener("move", handleMoveEvent);

var controller = new Neo.RotationCamera(Neo.Vector3Zero.clone(), scene, camera);
controller.yMaxLimit = 90*Neo.toRADIANS;
controller.yMinLimit = -90*Neo.toRADIANS;
controller.minDistance = 5;

animate();

function handleWheelEvent(evt)
{    
    controller.WheelDelta = evt.wheelDelta;
}

function handleMoveEvent(evt)
{
    if( mouseHandler.mouseDragOn )
    {
        controller.Delta = new THREE.Vector2(evt.deltaX, evt.deltaY);
    }
}

function animate() {
    requestAnimationFrame(animate);
    controller.update(mouseHandler.mouseDragOn);
    renderer.render(scene, camera);
}