theo-armour/Thrweets

## Thrweets
<!doctype html>
<html lang="en">
<head>
<title>thrweets</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0">
</head>
<body>
<script src="../../js/Detector.js"></script>
<script src="../../js/Stats.js"></script>
<script src="../../build/Three.js"></script>
<script src="../../fonts/helvetiker_bold.typeface.js"></script>
<script>
if ( ! Detector.webgl ) Detector.addGetWebGLMessage();
var renderer, scene, camera, stats, mesh = new THREE.Object3D();;

var WIDTH = window.innerWidth, HEIGHT = window.innerHeight;
var statusHTML = ['thrweets for auradeluxe'];
var text, textCount = 0, textLength;
init();
animate();

function init() {
	document.body.style.font = '12px monospace';
	document.body.style.margin = '0';
	document.body.style.overflow = 'hidden';
	document.body.style.backgroundColor = '#ddd';

	var newScript = document.createElement('script');
	newScript.type = 'text/javascript';
	newScript.src = 'http://twitter.com/statuses/user_timeline/auradeluxe.json?callback=twitterCallback2&count=10';
	document.body.appendChild(newScript);

	scene = new THREE.Scene();
	scene.fog = new THREE.Fog( 0xffffff, 1, 450 );

	camera = new THREE.PerspectiveCamera( 80, WIDTH / HEIGHT, 1, 10000 );
	camera.position.set(50, 20, 100);
	camera.lookAt(scene.position);
	scene.add( camera );

	var light = new THREE.PointLight( 0xff2200 );
	light.position.set( 0, 20, 10 );
	scene.add( light );

	var light = new THREE.DirectionalLight( 0xffffff );
	light.position.set( 0, 1, 1 ).normalize();
	scene.add( light );

	createObjext();

	renderer = new THREE.WebGLRenderer( {  clearColor: 0xffffff, clearAlpha: 1, antialias: true } );
	renderer.setSize( WIDTH, HEIGHT );
	document.body.appendChild( renderer.domElement );

	stats = new Stats();
	stats.domElement.style.position = 'absolute';
	stats.domElement.style.top = '0px';
	document.body.appendChild( stats.domElement );
}

function twitterCallback2(twitters) {
  for (var i=0; i<twitters.length; i++){
	statusHTML.push(twitters[i].text);
  }
}

function createObjext() {
	if (mesh) { scene.remove(mesh); }
	var text3d = new THREE.TextGeometry( statusHTML[textCount], {
		size: 50,
		height: 12,
		curveSegments: 5,
		font: "helvetiker",
		weight: "bold",
		style: "normal",
		bevelThickness: 3,
		bevelSize: 1.5,
		bevelEnabled: true,
		bevelSegments: 3,
		bend: true,
		steps: 1
	});
	text3d.computeBoundingBox();
	textLength = text3d.boundingBox.max.x - text3d.boundingBox.min.x ;
	var material = new THREE.MeshLambertMaterial( { color: 0xffffff * Math.random(), smoothShading: true } );
	mesh = new THREE.Mesh( text3d, material );
	mesh.position.x = 130;
	mesh.rotation.set(0.03 * Math.random() - 0.015, 0.03 * Math.random() - 0.015, 0.02 * Math.random() - 0.05);
	scene.add( mesh );
}

function animate() {
	requestAnimationFrame( animate );
	render();
	stats.update();
}

function render() {
	if (mesh.position.x < -textLength - 650) {
		mesh.position.x = 130;
		textCount++;
		if (textCount >= statusHTML.length) { textCount = 0; }
		createObjext()
	}
	mesh.position.x -= 5;
	renderer.render( scene, camera );
}
</script>
</body>
</html>
	<!doctype html>
	<html lang="en">
	<head>
	<title>thrweets</title>
	<meta charset="utf-8">
	<meta name="viewport" content="width=device-width, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0">
	</head>
	<body>
	<script src="../../js/Detector.js"></script>
	<script src="../../js/Stats.js"></script>
	<script src="../../build/Three.js"></script>
	<script src="../../fonts/helvetiker_bold.typeface.js"></script>
	<script>
	if ( ! Detector.webgl ) Detector.addGetWebGLMessage();
	var renderer, scene, camera, stats, mesh = new THREE.Object3D();;

	var WIDTH = window.innerWidth, HEIGHT = window.innerHeight;
	var statusHTML = ['thrweets for auradeluxe'];
	var text, textCount = 0, textLength;
	init();
	animate();

	function init() {
	document.body.style.font = '12px monospace';
	document.body.style.margin = '0';
	document.body.style.overflow = 'hidden';
	document.body.style.backgroundColor = '#ddd';

	var newScript = document.createElement('script');
	newScript.type = 'text/javascript';
	newScript.src = 'http://twitter.com/statuses/user_timeline/auradeluxe.json?callback=twitterCallback2&count=10';
	document.body.appendChild(newScript);

	scene = new THREE.Scene();
	scene.fog = new THREE.Fog( 0xffffff, 1, 450 );

	camera = new THREE.PerspectiveCamera( 80, WIDTH / HEIGHT, 1, 10000 );
	camera.position.set(50, 20, 100);
	camera.lookAt(scene.position);
	scene.add( camera );

	var light = new THREE.PointLight( 0xff2200 );
	light.position.set( 0, 20, 10 );
	scene.add( light );

	var light = new THREE.DirectionalLight( 0xffffff );
	light.position.set( 0, 1, 1 ).normalize();
	scene.add( light );

	createObjext();

	renderer = new THREE.WebGLRenderer( { clearColor: 0xffffff, clearAlpha: 1, antialias: true } );
	renderer.setSize( WIDTH, HEIGHT );
	document.body.appendChild( renderer.domElement );

	stats = new Stats();
	stats.domElement.style.position = 'absolute';
	stats.domElement.style.top = '0px';
	document.body.appendChild( stats.domElement );
	}

	function twitterCallback2(twitters) {
	for (var i=0; i<twitters.length; i++){
	statusHTML.push(twitters[i].text);
	}
	}

	function createObjext() {
	if (mesh) { scene.remove(mesh); }
	var text3d = new THREE.TextGeometry( statusHTML[textCount], {
	size: 50,
	height: 12,
	curveSegments: 5,
	font: "helvetiker",
	weight: "bold",
	style: "normal",
	bevelThickness: 3,
	bevelSize: 1.5,
	bevelEnabled: true,
	bevelSegments: 3,
	bend: true,
	steps: 1
	});
	text3d.computeBoundingBox();
	textLength = text3d.boundingBox.max.x - text3d.boundingBox.min.x ;
	var material = new THREE.MeshLambertMaterial( { color: 0xffffff * Math.random(), smoothShading: true } );
	mesh = new THREE.Mesh( text3d, material );
	mesh.position.x = 130;
	mesh.rotation.set(0.03 * Math.random() - 0.015, 0.03 * Math.random() - 0.015, 0.02 * Math.random() - 0.05);
	scene.add( mesh );
	}

	function animate() {
	requestAnimationFrame( animate );
	render();
	stats.update();
	}

	function render() {
	if (mesh.position.x < -textLength - 650) {
	mesh.position.x = 130;
	textCount++;
	if (textCount >= statusHTML.length) { textCount = 0; }
	createObjext()
	}
	mesh.position.x -= 5;
	renderer.render( scene, camera );
	}
	</script>
	</body>
	</html>