v1.0.1 commit.

This is the first commit.

README.md

@@ -1,4 +1,22 @@
 HexGL
-=====
+=========
 
-Source code of HexGL, the futuristic HTML5 racing game by Thibaut Despoulain (me)
+Source code of [HexGL](http://hexgl.bkcore.com), the futuristic HTML5 racing game by [Thibaut Despoulain](http://bkcore.com)
+
+## License
+
+Unless specified in the file, HexGL's code and resources are licensed under the *Creative Commons Attribution-NonCommercial 3.0 Unported License*. 
+
+To view a copy of this license, visit http://creativecommons.org/licenses/by-nc/3.0/.
+
+If you feel like you deserve another license for a special case, [drop me a note](http://bkcore.com/contact.html), and we'll talk about it.
+
+## Regarding the code
+
+As of now the code is pretty much undocumented. I'll be commenting it someday, but that won't be until I've finished the next content update and code refactoring sorry!
+
+## Note
+
+After much thinking, I've decided to release HexGL's source code under CC 3.0 BY-NC until further notice. This is not a definite choice, and the game may end up under the MIT license someday.
+
+Feel free to post issues, patch or anything to make the game better.

bkcore/ImageData.js

@@ -0,0 +1,149 @@
+/*!
+ * @class bkcore.ImageData
+ *
+ * Loads an image and gives access to pixel data.
+ * 
+ * @author Thibaut 'BKcore' Despoulain <http://bkcore.com>
+ */
+
+/*!
+ * @package bkcore
+ */
+var bkcore = bkcore || {};
+
+/*!
+ * Creates a new ImageData object
+ * 
+ * @param path String The path of the image
+ * @param callback Function A callback function to be called once th eimage is loaded
+ */
+bkcore.ImageData = function(path, callback)
+{
+	var self = this;
+
+	this.image = new Image();
+	this.pixels = null;
+	this.canvas = null;
+	this.loaded = false;
+
+	this.image.onload = function() {
+	    self.canvas = document.createElement('canvas');
+	    self.canvas.width = self.image.width;
+	    self.canvas.height = self.image.height;
+
+	    var context = self.canvas.getContext('2d');
+	    context.drawImage(self.image, 0, 0);
+
+	    self.pixels = context.getImageData(0, 0, self.canvas.width, self.canvas.height);
+
+	    self.loaded = true;
+
+	    context = null;
+	    self.canvas = null;
+	    self.image = null;
+
+	    if(callback) callback.call(self);	    
+	};
+	this.image.crossOrigin = "anonymous";
+	this.image.src = path;
+};
+
+/*!
+ * Gets pixel RGBA data at given index
+ * 
+ * @param x int In pixels
+ * @param y int In pixels
+ * @return Object{r,g,b,a}
+ */
+bkcore.ImageData.prototype.getPixel = function(x, y)
+{
+	if(this.pixels == null
+		|| x < 0
+		|| y < 0
+		|| x >= this.pixels.width
+		|| y >= this.pixels.height)
+		return {r: 0, g: 0, b: 0, a:0};
+
+	var index = (y*this.pixels.width + x) * 4;
+
+    return {
+    	r: this.pixels.data[index],
+    	g: this.pixels.data[index + 1],
+    	b: this.pixels.data[index + 2],
+    	a: this.pixels.data[index + 3]
+    };
+};
+
+/*!
+ * Gets pixel RGBA data at given float index using bilinear interpolation
+ * 
+ * @param x float In subpixels
+ * @param y float In subpixels
+ * @return Object{r,g,b,a}
+ */
+bkcore.ImageData.prototype.getPixelBilinear = function(fx, fy)
+{
+	var x = Math.floor(fx);
+	var y = Math.floor(fy);
+	var rx = fx - x - .5;
+	var ry = fy - y - .5;
+	var ax = Math.abs(rx);
+	var ay = Math.abs(ry);
+	var c, cxy, cx, cy, cf1, cf2;
+	var dx = rx < 0 ?  -1 : 1;
+	var dy = ry < 0 ? -1 : 1;
+	
+	c = this.getPixel(x, y);
+	cx = this.getPixel(x+dx, y);
+	cy = this.getPixel(x, y+dy);
+	cxy = this.getPixel(x+dx, y+dy);
+
+	cf1 = [
+		(1-ax) * c.r + ax * cx.r,
+		(1-ax) * c.g + ax * cx.g,
+		(1-ax) * c.b + ax * cx.b,
+		(1-ax) * c.a + ax * cx.a
+	];
+
+	cf2 = [
+		(1-ax) * cy.r + ax * cxy.r,
+		(1-ax) * cy.g + ax * cxy.g,
+		(1-ax) * cy.b + ax * cxy.b,
+		(1-ax) * cy.a + ax * cxy.a
+	];
+	
+	return {
+		r: (1-ay) * cf1[0] + ay * cf2[0],
+		g: (1-ay) * cf1[1] + ay * cf2[1],
+		b: (1-ay) * cf1[2] + ay * cf2[2],
+		a: (1-ay) * cf1[3] + ay * cf2[3]
+	};
+}
+
+/*!
+ * Gets pixel data at given index 
+ * as 3-bytes integer (for floating-point textures erzats, from RGB values)
+ * 
+ * @param x int In pixels
+ * @param y int In pixels
+ * @return int (R + G*255 + B*255*255)
+ */
+bkcore.ImageData.prototype.getPixelF = function(x, y)  
+{ 
+	var color = this.getPixel(x, y);
+	return color.r + color.g * 255 + color.b * 255 * 255; 
+};
+
+/*!
+ * Gets pixel data at given float index using bilinear interpolationas
+ * as 3-bytes integer (for floating-point textures erzats, from RGB values)
+ * 
+ * @param x float In subpixels
+ * @param y float In subpixels
+ * @return Object{r,g,b,a}
+ */
+bkcore.ImageData.prototype.getPixelFBilinear = function(fx, fy)
+{
+	var color = this.getPixelBilinear(fx, fy);
+	return color.r + color.g * 255.0 + color.b * 255.0 * 255.0; 
+}

bkcore/Timer.js

@@ -0,0 +1,123 @@
+/*!
+ * @class bkcore.Timer
+ *
+ * new Date().getTime() wrapper to use as timers.
+ * 
+ * @author Thibaut 'BKcore' Despoulain <http://bkcore.com>
+ */
+
+/*!
+ * @package bkcore
+ */
+var bkcore = bkcore || {};
+
+/*!
+ * Creates a new timer, inactive by default.
+ * Call Timer.start() to activate.
+ */
+bkcore.Timer = function()
+{
+	this.time = {
+		start: 0,
+		current: 0,
+		previous: 0,
+		elapsed: 0,
+		delta: 0
+	}
+
+	this.active = false;
+}
+
+/*!
+ * Starts/restarts the timer.
+ */
+bkcore.Timer.prototype.start = function()
+{
+	var now = new Date().getTime();
+
+	this.time.start = now;
+	this.time.current = now;
+	this.time.previous = now;
+	this.time.elapsed = 0;
+	this.time.delta = 0;
+
+	this.active = true;
+}
+
+/*!
+ * Pauses(true)/Unpauses(false) the timer.
+ *
+ * @param bool Do pause
+ */
+bkcore.Timer.prototype.pause = function(bool)
+{
+	this.active = !bool;
+}
+
+/*!
+ * Update method to be called inside a RAF loop
+ */
+bkcore.Timer.prototype.update = function()
+{
+	if(!this.active) return;
+
+	var now = new Date().getTime();
+
+	this.time.current = now;
+	this.time.elapsed = this.time.current - this.time.start;
+	this.time.delta = now - this.time.previous;
+	this.time.previous = now;
+}
+
+/*!
+ * Returns a formatted version of the current elapsed time using msToTime().
+ *
+ * 
+ */
+bkcore.Timer.prototype.getElapsedTime = function()
+{
+	return bkcore.Timer.msToTime(this.time.elapsed);
+}
+
+/*!
+ * Formats a millisecond integer into a h/m/s/ms object
+ * 
+ * @param x int In milliseconds
+ * @return Object{h,m,s,ms}
+ */
+bkcore.Timer.msToTime = function(t)
+{
+	var ms, s, m, h;
+	
+	ms = t%1000;
+
+	s = Math.floor((t/1000)%60);
+
+	m = Math.floor((t/60000)%60);
+	h = Math.floor((t/3600000));
+
+	return {h:h, m:m, s:s, ms:ms};
+}
+
+/*!
+ * Formats a millisecond integer into a h/m/s/ms object with prefix zeros
+ * 
+ * @param x int In milliseconds
+ * @return Object<string>{h,m,s,ms}
+ */
+bkcore.Timer.msToTimeString = function(t)
+{
+	var ms, s, m, h;
+	
+	ms = t%1000;
+	if(ms < 10) ms = "00"+ms;
+	else if(ms < 100) ms = "0"+ms;
+
+	s = Math.floor((t/1000)%60);
+	if(s < 10) s = "0"+s;
+
+	m = Math.floor((t/60000)%60);
+	h = Math.floor((t/3600000));
+
+	return {h:h, m:m, s:s, ms:ms};
+}

bkcore/Utils.js

@@ -0,0 +1,197 @@
+/*!
+ * @class bkcore.Timer
+ *
+ * new Date().getTime() wrapper to use as timers.
+ * 
+ * @author Thibaut 'BKcore' Despoulain <http://bkcore.com>
+ */
+
+/*!
+ * @package bkcore
+ */
+var bkcore = bkcore || {};
+
+bkcore.Utils = {};
+
+/**
+ * Creates a bkcore.threejs.Shaders[ "normalV" | "normal" ] material with given parameters
+ */
+bkcore.Utils.createNormalMaterial = function(opts)
+{
+	var shader = bkcore.threejs.Shaders[ opts.perPixel==false ? "normalV" : "normal" ];
+
+	var uniforms = THREE.UniformsUtils.clone( shader.uniforms );
+
+	uniforms[ "enableDiffuse" ].value = true;
+	uniforms[ "enableSpecular" ].value = true;
+	uniforms[ "enableReflection" ].value = (opts.cube != undefined);
+
+	uniforms[ "tNormal" ].texture = opts.normal;
+	uniforms[ "tDiffuse" ].texture = opts.diffuse;
+	uniforms[ "tSpecular" ].texture = opts.specular;
+
+	uniforms[ "uAmbientColor" ].value.setHex(opts.ambient == undefined ? 0x444444 : opts.ambient);
+	uniforms[ "uAmbientColor" ].value.convertGammaToLinear();
+
+	uniforms[ "uNormalScale" ].value = opts.normalScale == undefined ? 1.0 : opts.normalScale;
+
+	if(opts.cube != undefined)
+	{
+		uniforms[ "tCube" ].texture = opts.cube;
+		uniforms[ "uReflectivity" ].value = opts.reflectivity == undefined ? 0.9 : opts.reflectivity;
+	}
+
+	uniforms[ "uShininess" ].value = opts.shininess == undefined ? 42 : opts.shininess;
+
+
+	var parameters = { fragmentShader: shader.fragmentShader, vertexShader: shader.vertexShader, uniforms: uniforms, lights: true, fog: false };
+
+	var material = new THREE.ShaderMaterial( parameters );
+	material.perPixel = true;
+	material.metal = opts.metal == undefined ? false : opts.metal;
+
+	return material;
+}
+
+/**
+ * Projects an object origin vector to screen using given camera
+ * @param  THREE.Object3D object The object which origin you want to project
+ * @param  THREE.Camera camera The camera of the projection
+ * @return THEE.Vector3 Projected verctor
+ */
+bkcore.Utils.projectOnScreen = function(object, camera)
+{
+	var mat = new THREE.Matrix4();
+	mat.multiply( camera.matrixWorldInverse, object.matrixWorld);
+	mat.multiply( camera.projectionMatrix , mat);
+
+	var c = mat.n44;
+	var lPos = new THREE.Vector3(mat.n14/c, mat.n24/c, mat.n34/c);
+	lPos.multiplyScalar(0.5);
+	lPos.addScalar(0.5);
+	return lPos;
+}
+
+bkcore.Utils.URLParameters = null;
+
+/**
+ * Get an url parameter
+ * @param  String name Parameter slug
+ * @return Mixed
+ */
+bkcore.Utils.getURLParameter = function(name)
+{
+	if(bkcore.Utils.URLParameters == null)
+	{
+	    var vars = {};
+	    var parts = window.location.href.replace(/[?&]+([^=&]+)=([^&]*)/gi, 
+	    	function(m,key,value) {
+	        	vars[key] = value;
+	    	}
+	    );
+	    bkcore.Utils.URLParameters = vars;
+	}
+
+	return bkcore.Utils.URLParameters[name];
+}
+
+bkcore.Utils.getOffsetTop = function(obj)
+{
+	var curtop = 0;
+	if (obj.offsetParent) {
+		do {
+			curtop += obj.offsetTop;
+		} while (obj = obj.offsetParent);
+	}
+	else
+	{
+		curtop = obj.offsetTop;
+	}
+	return [curtop];
+}
+
+/**
+ * Scrolls page to given element id
+ * @param  string id The ID of the element
+ */
+bkcore.Utils.scrollTo = function(id)
+{
+	window.scroll(
+		0,
+		bkcore.Utils.getOffsetTop(
+			document.getElementById(id)
+		)
+	);
+}
+
+/**
+ * Add or remove a class from an element
+ * @param  string id       [description]
+ * @param  string cssclass [description]
+ * @param  bool active   [description]
+ */
+bkcore.Utils.updateClass = function(id, cssclass, active)
+{
+	var element = document.getElementById(id);
+	if(active)
+		element.classList.add(cssclass);
+	else
+		element.classList.remove(cssclass);
+}
+
+/**
+ * PErforms an XMLHttpRequest
+ * @param  string   url      [description]
+ * @param  bool   postData true = POST, false = GET
+ * @param  {Function} callback [description]
+ * @param  {Object}   data     [description]
+ */
+bkcore.Utils.request = function(url, postData, callback, data)
+{
+	var XMLHttpFactories = [
+		function () {return new XMLHttpRequest()},
+		function () {return new ActiveXObject("Msxml2.XMLHTTP")},
+		function () {return new ActiveXObject("Msxml3.XMLHTTP")},
+		function () {return new ActiveXObject("Microsoft.XMLHTTP")}
+	];
+
+	function createXMLHTTPObject() {
+		var xmlhttp = false;
+		for (var i=0;i<XMLHttpFactories.length;i++) {
+			try {
+				xmlhttp = XMLHttpFactories[i]();
+			}
+			catch (e) {
+				continue;
+			}
+			break;
+		}
+		return xmlhttp;
+	}
+
+	var req = createXMLHTTPObject();
+	if (!req) return;
+	var method = (postData) ? "POST" : "GET";
+
+	var qdata = "o=bk";
+	if(data != undefined) for(var i in data)
+	{
+		qdata += "&"+i+"="+data[i];
+		if(!postData) url += "?"+qdata;
+	}
+
+	req.open(method,url,true);
+
+	if(postData)
+		req.setRequestHeader('Content-type','application/x-www-form-urlencoded');
+
+	req.onreadystatechange = function () {
+		if (req.readyState != 4) return;
+		if (req.status != 200 && req.status != 304) {
+			return;
+		}
+		callback(req);
+	}
+
+	req.send(qdata);
+}

bkcore/hexgl/CameraChase.js

@@ -0,0 +1,50 @@
+ /*
+ * HexGL
+ * @author Thibaut 'BKcore' Despoulain <http://bkcore.com>
+ * @license This work is licensed under the Creative Commons Attribution-NonCommercial 3.0 Unported License. 
+ *          To view a copy of this license, visit http://creativecommons.org/licenses/by-nc/3.0/.
+ */
+
+var bkcore = bkcore || {};
+bkcore.hexgl = bkcore.hexgl || {};
+
+bkcore.hexgl.CameraChase = function(opts)
+{
+	this.dir = new THREE.Vector3(0,0,1);
+	this.up = new THREE.Vector3(0,1,0);
+	this.target = new THREE.Vector3();
+	this.speedOffset = 0;
+	this.speedOffsetMax = 10;
+	this.speedOffsetStep = 0.05;
+
+	this.camera = opts.camera;
+	this.targetObject = opts.target;
+	this.cameraCube = opts.cameraCube == undefined ? null : opts.cameraCube;
+
+	this.yoffset = opts.yoffest == undefined ? 8.0 : opts.yoffest;
+	this.zoffset = opts.zoffset == undefined ? 10.0 : opts.zoffset;
+	this.viewOffset = opts.viewOffset == undefined ? 10.0 : opts.viewOffset;
+	this.lerp = opts.lerp == undefined ? 0.5 : opts.lerp;
+}
+
+bkcore.hexgl.CameraChase.prototype.update = function(dt, ratio)
+{
+	this.dir.set(0,0,1);
+	this.up.set(0,1,0);
+
+	this.targetObject.matrix.rotateAxis(this.up);
+	this.targetObject.matrix.rotateAxis(this.dir);
+
+	this.speedOffset += (this.speedOffsetMax*ratio - this.speedOffset) * Math.min(1, 0.3*dt);
+
+	this.target.copy(this.targetObject.position);
+	this.target.subSelf(this.dir.multiplyScalar(this.zoffset + this.speedOffset));
+	this.target.addSelf(this.up.multiplyScalar(this.yoffset));
+	this.target.y += -this.up.y + this.yoffset;
+	this.camera.position.copy(this.target, this.lerp);
+	
+	this.camera.lookAt(this.dir.normalize().multiplyScalar(this.viewOffset).addSelf(this.targetObject.position));
+
+	if(this.cameraCube != null)
+		this.cameraCube.rotation.copy(this.camera.rotation);
+}

bkcore/hexgl/Gameplay.js

@@ -0,0 +1,190 @@
+ /*
+ * HexGL
+ * @author Thibaut 'BKcore' Despoulain <http://bkcore.com>
+ * @license This work is licensed under the Creative Commons Attribution-NonCommercial 3.0 Unported License. 
+ *          To view a copy of this license, visit http://creativecommons.org/licenses/by-nc/3.0/.
+ */
+
+var bkcore = bkcore || {};
+bkcore.hexgl = bkcore.hexgl || {};
+
+bkcore.hexgl.Gameplay = function(opts)
+{
+	var self = this;
+
+	this.startDelay = 1000;
+	this.countDownDelay = 1500;
+
+	this.active = false;
+	this.timer = new bkcore.Timer();
+	this.modes = {
+		'timeattack':null,
+		'survival':null,
+		'replay':null
+	};
+	this.mode = opts.mode == undefined || !(opts.mode in this.modes) ? "timeattack" : opts.mode;
+	this.step = 0;
+
+	this.hud = opts.hud;
+	this.shipControls = opts.shipControls;
+	this.track = opts.track;
+	this.analyser = opts.analyser;
+	this.pixelRatio = opts.pixelRatio;
+
+	this.previousCheckPoint = -1;
+
+	this.results = {
+		FINISH: 1,
+		DESTROYED: 2,
+		WRONGWAY: 3,
+		NONE: -1
+	};
+	this.result = this.results.NONE;
+
+	this.lap = 1;
+	this.lapTimes = [];
+	this.lapTimeElapsed = 0;
+	this.maxLaps = 3;
+	this.score = null;
+	this.finishTime = null;
+	this.onFinish = opts.onFinish == undefined ? function(){console.log("FINISH");} : opts.onFinish;
+
+	this.modes.timeattack = function()
+	{
+		self.hud.updateTime(self.timer.getElapsedTime());
+		var cp = self.checkPoint();
+
+		if(cp == self.track.checkpoints.start && self.previousCheckPoint == self.track.checkpoints.last)
+		{
+			self.previousCheckPoint = cp;
+			var t = self.timer.time.elapsed;
+			self.lapTimes.push(t - self.lapTimeElapsed);
+			self.lapTimeElapsed = t;
+
+			if(self.lap == this.maxLaps)
+			{
+				self.end(self.results.FINISH);
+			}
+			else
+			{
+				self.lap++;
+				self.hud.updateLap(self.lap, self.maxLaps);
+
+				if(self.lap == self.maxLaps)
+					self.hud.display("Final lap", 0.5);
+			}
+		}
+		else if(cp != -1 && cp != self.previousCheckPoint)
+		{
+			self.previousCheckPoint = cp;
+			//self.hud.display("Checkpoint", 0.5);
+		}
+
+		if(self.shipControls.destroyed == true)
+		{
+			self.end(self.results.DESTROYED);
+		}
+	}
+}
+
+bkcore.hexgl.Gameplay.prototype.simu = function()
+{
+	this.lapTimes = [92300, 91250, 90365];
+	this.finishTime = this.lapTimes[0]+this.lapTimes[1]+this.lapTimes[2];
+	this.hud.display("Finish");
+	this.step = 100;
+	this.result = this.results.FINISH;
+	this.shipControls.active = false;
+}
+
+bkcore.hexgl.Gameplay.prototype.start = function()
+{
+	this.finishTime = null;
+	this.score = null;
+	this.lap = 1;
+
+	this.shipControls.reset(this.track.spawn, this.track.spawnRotation);
+	this.shipControls.active = false;
+
+	this.previousCheckPoint = this.track.checkpoints.start;
+
+	this.active = true;
+	this.step = 0;
+	this.timer.start();
+	this.hud.resetTime();
+	this.hud.display("Get ready", 1);
+	this.hud.updateLap(this.lap, this.maxLaps);
+}
+
+bkcore.hexgl.Gameplay.prototype.end = function(result)
+{
+	this.score = this.timer.getElapsedTime();
+	this.finishTime = this.timer.time.elapsed;
+	this.timer.start();
+	this.result = result;
+
+	this.shipControls.active = false;
+
+	if(result == this.results.FINISH)
+	{
+		this.hud.display("Finish");
+		this.step = 100;
+	}
+	else if(result == this.results.DESTROYED)
+	{
+		this.hud.display("Destroyed");
+		this.step = 100;
+	}
+}
+
+bkcore.hexgl.Gameplay.prototype.update = function()
+{
+	if(!this.active) return;
+
+	this.timer.update();
+	
+	if(this.step == 0 && this.timer.time.elapsed >= this.countDownDelay+this.startDelay)
+	{
+		this.hud.display("3");
+		this.step = 1;
+	}
+	else if(this.step == 1 && this.timer.time.elapsed >= 2*this.countDownDelay+this.startDelay)
+	{
+		this.hud.display("2");
+		this.step = 2;
+	}
+	else if(this.step == 2 && this.timer.time.elapsed >= 3*this.countDownDelay+this.startDelay)
+	{
+		this.hud.display("1");
+		this.step = 3;
+	}
+	else if(this.step == 3 && this.timer.time.elapsed >= 4*this.countDownDelay+this.startDelay)
+	{
+		this.hud.display("Go", 0.5);
+		this.step = 4;
+		this.timer.start();
+		this.shipControls.active = true;
+	}
+	else if(this.step == 4)
+	{
+		this.modes[this.mode].call(this);
+	}
+	else if(this.step == 100 && this.timer.time.elapsed >= 2000)
+	{
+		this.active = false;
+		this.onFinish.call(this);
+	}
+}
+
+bkcore.hexgl.Gameplay.prototype.checkPoint = function()
+{
+	var x = Math.round(this.analyser.pixels.width/2 + this.shipControls.dummy.position.x * this.pixelRatio);
+	var z = Math.round(this.analyser.pixels.height/2 + this.shipControls.dummy.position.z * this.pixelRatio);
+
+	var color = this.analyser.getPixel(x, z);
+
+	if(color.r == 255 && color.g == 255 && color.b < 250)
+		return color.b;
+	else
+		return -1;
+}

bkcore/hexgl/HUD.js

@@ -0,0 +1,260 @@
+ /*
+ * HexGL
+ * @author Thibaut 'BKcore' Despoulain <http://bkcore.com>
+ * @license This work is licensed under the Creative Commons Attribution-NonCommercial 3.0 Unported License. 
+ *          To view a copy of this license, visit http://creativecommons.org/licenses/by-nc/3.0/.
+ */
+
+var bkcore = bkcore || {};
+bkcore.hexgl = bkcore.hexgl || {};
+
+bkcore.hexgl.HUD = function(opts)
+{
+	var self = this;
+
+	this.width = opts.width;
+	this.height = opts.height;
+
+	this.canvas = document.createElement('canvas');
+	this.canvas.width = this.width;
+	this.canvas.height = this.height;
+
+	this.ctx = this.canvas.getContext('2d');
+	this.ctx.textAlign = "center";
+
+	this.bg = opts.bg;//"textures/hud/hud-bg.png";
+
+	this.fgspeed = opts.speed;//"textures/hud/hud-fg-speed.png";
+
+	this.fgshield = opts.shield;//"textures/hud/hud-fg-shield.png";
+
+	this.speedFontRatio = 24;
+	this.speedBarRatio = 2.91;
+	this.shieldFontRatio = 64;
+	this.shieldBarYRatio = 34;
+	this.shieldBarWRatio = 18.3;
+	this.shieldBarHRatio = 14.3;
+	this.timeMarginRatio = 18;
+	this.timeFontRatio = 19.2;
+
+	this.font = opts.font || "Arial";
+
+	this.time = "";
+
+	this.message = "";
+	this.previousMessage = "";
+	this.messageTiming = 0;
+	this.messagePos = 0.0;
+	this.messagePosTarget = 0.0;
+	this.messagePosTargetRatio = 12;
+	this.messageA = 1.0;
+	this.messageAS = 1.0;
+	this.messageDuration = 2*60;
+	this.messageDurationD = 2*60;
+	this.messageDurationS = 30;
+	this.messageYRatio = 34;
+	this.messageFontRatio = 10;
+	this.messageFontRatioStart = 6;
+	this.messageFontRatioEnd = 10;
+	this.messageFontLerp = 0.4;
+	this.messageLerp = 0.4;
+	this.messageFontAlpha = 0.8;
+
+	this.lapMarginRatio = 14;
+	this.lap = "";
+	this.lapSeparator = "/";
+
+	this.timeSeparators = ["","'", "''",""];
+
+	this.step = 0;
+	this.maxStep = 2;
+};
+
+bkcore.hexgl.HUD.prototype.resize = function(w, h)
+{
+	this.width = w;
+	this.height = h;
+	this.canvas.width = w;
+	this.canvas.height = h;
+}
+
+bkcore.hexgl.HUD.prototype.display = function(msg, duration)
+{
+	this.messageTiming = 0;
+
+	if(this.message != "")
+	{
+		this.messageA = this.messageFontAlpha;
+		this.messagePos = 0.0;
+		this.messagePosTarget = this.width/this.messagePosTargetRatio;
+		this.previousMessage = this.message;
+	}
+
+	this.messageFontRatio = this.messageFontRatioStart;
+	this.messageAS = 0.0;
+	this.message = msg;
+	this.messageDuration = duration == undefined ? this.messageDurationD : duration*60;
+}
+
+bkcore.hexgl.HUD.prototype.updateLap = function(current, total)
+{
+	this.lap = current + this.lapSeparator + total;
+}
+
+bkcore.hexgl.HUD.prototype.resetLap = function()
+{
+	this.lap = "";
+}
+
+bkcore.hexgl.HUD.prototype.updateTime = function(time)
+{
+	this.time = this.timeSeparators[0] + time.m + this.timeSeparators[1] + time.s + this.timeSeparators[2] + time.ms + this.timeSeparators[3];
+}
+
+bkcore.hexgl.HUD.prototype.resetTime = function()
+{
+	this.time = "";
+}
+
+bkcore.hexgl.HUD.prototype.update = function(speed, speedRatio, shield, shieldRatio)
+{
+	var SCREEN_WIDTH = this.width;
+	var SCREEN_HEIGHT = this.height;
+
+	var SCREEN_HW = SCREEN_WIDTH / 2;
+	var SCREEN_HH = SCREEN_HEIGHT / 2;
+
+	//this.ctx.clearRect(0 , 0 , SCREEN_WIDTH , SCREEN_HEIGHT);
+
+	var w = this.bg.width;
+	var h = this.bg.height;
+	var r = h/w;
+	var nw = SCREEN_WIDTH;
+	var nh = nw*r;
+	var oh = SCREEN_HEIGHT - nh;
+	var o = 0;
+	//speedbar
+	var ba = nh;
+	var bl = SCREEN_WIDTH/this.speedBarRatio;
+	var bw = bl * speedRatio;
+	//shieldbar
+	var sw = SCREEN_WIDTH/this.shieldBarWRatio;
+	var sho = SCREEN_WIDTH/this.shieldBarHRatio;
+	var sh = sho*shieldRatio;
+	var sy = (SCREEN_WIDTH/this.shieldBarYRatio)+sho-sh;
+	
+
+	if(this.step == 0)
+	{
+		this.ctx.clearRect(0 , oh , SCREEN_WIDTH , nh);
+
+	    this.ctx.drawImage(this.bg, o, oh, nw, nh);
+
+	    this.ctx.save();
+		this.ctx.beginPath();
+		this.ctx.moveTo(bw+ba+SCREEN_HW, oh);
+		this.ctx.lineTo(-(bw+ba)+SCREEN_HW, oh);
+		this.ctx.lineTo(-bw+SCREEN_HW, SCREEN_HEIGHT);
+		this.ctx.lineTo(bw+SCREEN_HW, SCREEN_HEIGHT);
+		this.ctx.lineTo(bw+ba+SCREEN_HW, oh);
+		this.ctx.clip();
+	    this.ctx.drawImage(this.fgspeed, o, oh, nw, nh);
+		this.ctx.restore();
+
+	    this.ctx.save();
+		this.ctx.beginPath();
+		this.ctx.moveTo(-sw+SCREEN_HW, oh+sy);
+		this.ctx.lineTo(sw+SCREEN_HW, oh+sy);
+		this.ctx.lineTo(sw+SCREEN_HW, oh+sh+sy);
+		this.ctx.lineTo(-sw+SCREEN_HW, oh+sh+sy);
+		this.ctx.lineTo(-sw+SCREEN_HW, oh+sh);
+		this.ctx.clip();
+	    this.ctx.drawImage(this.fgshield, o, oh, nw, nh);
+		this.ctx.restore();
+
+		// SPEED
+		this.ctx.font = (SCREEN_WIDTH/this.speedFontRatio)+"px "+this.font;
+	    this.ctx.fillStyle = "rgba(255, 255, 255, 0.8)";
+	    this.ctx.fillText(speed, SCREEN_HW, SCREEN_HEIGHT - nh*0.57);
+
+	    // SHIELD
+		this.ctx.font = (SCREEN_WIDTH/this.shieldFontRatio)+"px "+this.font;
+	    this.ctx.fillStyle = "rgba(255, 255, 255, 0.4)";
+	    this.ctx.fillText(shield, SCREEN_HW, SCREEN_HEIGHT - nh*0.44);
+	}
+	else if(this.step == 1)
+	{
+		this.ctx.clearRect(0 , 0 , SCREEN_WIDTH , oh);
+
+		// TIME
+	    if(this.time != "")
+	    {
+			this.ctx.font = (SCREEN_WIDTH/this.timeFontRatio)+"px "+this.font;
+		    this.ctx.fillStyle = "rgba(255, 255, 255, 0.8)";
+		    this.ctx.fillText(this.time, SCREEN_HW, SCREEN_WIDTH/this.timeMarginRatio);
+		}
+
+		// LAPS
+		if(this.lap != "")
+		{
+			this.ctx.font = (SCREEN_WIDTH/this.timeFontRatio)+"px "+this.font;
+		    this.ctx.fillStyle = "rgba(255, 255, 255, 0.8)";
+		    this.ctx.fillText(this.lap, SCREEN_WIDTH-SCREEN_WIDTH/this.lapMarginRatio, SCREEN_WIDTH/this.timeMarginRatio);
+		}
+
+	    // MESSAGE
+	    var my = SCREEN_HH-SCREEN_WIDTH/this.messageYRatio;
+
+	    if(this.messageTiming > this.messageDuration+2000)
+		{
+			this.previousMessage = "";
+			this.message = "";
+			this.messageA = 0.0;
+		}
+		else if(this.messageTiming > this.messageDuration && this.message != "")
+		{
+			this.previousMessage = this.message;
+			this.message = "";
+			this.messagePos = 0.0;
+			this.messagePosTarget = SCREEN_WIDTH/this.messagePosTargetRatio;
+			this.messageA = this.messageFontAlpha;
+		}
+
+		if(this.previousMessage != "")
+		{
+			if(this.messageA < 0.001)
+				this.messageA = 0.0;
+			else
+				this.messageA += (0.0 - this.messageA) * this.messageLerp;
+
+			this.messagePos += (this.messagePosTarget - this.messagePos) * this.messageLerp;
+
+			this.ctx.font = (SCREEN_WIDTH/this.messageFontRatioEnd)+"px "+this.font;
+		    this.ctx.fillStyle = "rgba(255, 255, 255, "+this.messageA+")";
+		    this.ctx.fillText(this.previousMessage, SCREEN_HW, my+this.messagePos);
+		}
+
+		if(this.message != "")
+		{
+			if(this.messageTiming < this.messageDurationS)
+			{
+				this.messageAS += (this.messageFontAlpha - this.messageAS) * this.messageFontLerp;
+				this.messageFontRatio += (this.messageFontRatioEnd - this.messageFontRatio) * this.messageFontLerp;
+			}
+			else
+			{
+				this.messageAS = this.messageFontAlpha;
+				this.messageFontRatio = this.messageFontRatioEnd;
+			}
+
+			this.ctx.font = (SCREEN_WIDTH/this.messageFontRatio)+"px "+this.font;
+		    this.ctx.fillStyle = "rgba(255, 255, 255, "+this.messageAS+")";
+		    this.ctx.fillText(this.message, SCREEN_HW, my);
+		}
+	}
+	
+	this.messageTiming++;
+
+	this.step++;
+	if(this.step == this.maxStep) this.step = 0;
+}

bkcore/hexgl/HexGL.js

@@ -0,0 +1,392 @@
+ /*
+ * HexGL
+ * @author Thibaut 'BKcore' Despoulain <http://bkcore.com>
+ * @license This work is licensed under the Creative Commons Attribution-NonCommercial 3.0 Unported License. 
+ *          To view a copy of this license, visit http://creativecommons.org/licenses/by-nc/3.0/.
+ */
+
+'use strict';
+'v1.0.1';
+
+var bkcore = bkcore || {};
+bkcore.hexgl = bkcore.hexgl || {};
+
+bkcore.hexgl.HexGL = function(opts)
+{
+	var self = this;
+
+	this.document = opts.document || document;
+
+	this.a = window.location.href;
+
+	this.active = true;
+
+	this.width = opts.width == undefined ? window.innerWidth : opts.width;
+	this.height = opts.height == undefined ? window.innerHeight : opts.height;
+
+	this.quality = opts.quality == undefined ? 2 : opts.quality;
+	this.difficulty = opts.difficulty == undefined ? 0 : opts.difficulty;
+	this.player = opts.player == undefined ? "Anonym" : opts.player;
+
+	this.half = opts.half == undefined ? false : opts.half;
+
+	this.track = bkcore.hexgl.tracks[ opts.track == undefined ? 'Cityscape' : opts.track ];
+
+	if(this.half)
+	{
+		this.width /= 2;
+		this.height /=2;
+	}
+
+	this.settings = null;
+	this.renderer = null;
+	this.manager = null;
+	this.lib = null;
+	this.materials = {};
+	this.components = {};
+	this.extras = {
+		vignetteColor: new THREE.Color(0x458ab1),
+		bloom: null,
+		fxaa: null
+	};
+
+	this.containers = {};
+	this.containers.main = opts.container == undefined ? document.body : opts.container;
+	this.containers.overlay = opts.overlay == undefined ? document.body : opts.overlay;
+
+	this.hud = null;
+
+	this.gameplay = null;
+
+	this.composers = {
+		game: null
+	};
+
+	this.initRenderer();
+
+	function onKeyPress(event) 
+	{
+		if(event.keyCode == 27/*escape*/) 
+		{
+			self.reset();
+		}
+	}
+
+	this.document.addEventListener('keydown', onKeyPress, false);
+}
+
+bkcore.hexgl.HexGL.prototype.start = function()
+{
+
+	this.manager.setCurrent("game");
+
+	var self = this;
+
+	function raf()
+	{
+		requestAnimationFrame( raf );
+		self.update();
+	}
+
+	//if(this.a[15] == "o")
+		raf();
+
+	this.initGameplay();
+}
+
+bkcore.hexgl.HexGL.prototype.reset = function()
+{
+	this.manager.get('game').objects.lowFPS = 0;
+	this.gameplay.start();
+}
+
+bkcore.hexgl.HexGL.prototype.restart = function()
+{
+	this.document.getElementById('finish').style.display = 'none';
+	this.reset();
+}
+
+bkcore.hexgl.HexGL.prototype.update = function()
+{
+	if(!this.active) return;
+
+	if(this.gameplay != null)
+		this.gameplay.update();
+
+	this.manager.renderCurrent();
+}
+
+bkcore.hexgl.HexGL.prototype.init = function()
+{
+	this.initHUD();
+
+	this.track.buildMaterials(this.quality);
+
+	this.track.buildScenes(this, this.quality);
+
+	this.initGameComposer();
+}
+
+bkcore.hexgl.HexGL.prototype.load = function(opts)
+{
+	this.track.load(opts, this.quality);
+}
+
+bkcore.hexgl.HexGL.prototype.initGameplay = function()
+{
+	var self = this;
+
+	this.gameplay = new bkcore.hexgl.Gameplay({
+		mode: "timeattack",
+		hud: this.hud,
+		shipControls: this.components.shipControls,
+		analyser: this.track.analyser,
+		pixelRatio: this.track.pixelRatio,
+		track: {
+			checkpoints: this.track.checkpoints,
+			spawn: this.track.spawn,
+			spawnRotation: this.track.spawnRotation
+		},
+		onFinish: function() {
+			self.displayScore(this.finishTime, this.lapTimes);
+		}
+	});
+
+	this.gameplay.start();
+}
+
+bkcore.hexgl.HexGL.prototype.displayScore = function(f, l)
+{
+	var t = 'cityscape';
+	var dc = this.document.getElementById("finish");
+	var ds = this.document.getElementById("finish-state");
+	var dh = this.document.getElementById("finish-hallmsg");
+	var dr = this.document.getElementById("finish-msg");
+	var dt = this.document.getElementById("finish-result");
+	var dl1 = this.document.getElementById("finish-lap1");
+	var dl2 = this.document.getElementById("finish-lap2");
+	var dl3 = this.document.getElementById("finish-lap3");
+	var dd = this.document.getElementById("finish-diff")
+	var st = this.document.getElementById("finish-twitter");
+	var sf = this.document.getElementById("finish-fb");
+	var sl = this.document.getElementById("lowfps-msg");
+	var d = this.difficulty == 0 ? 'casual' : 'hard';
+	var ts = this.hud.timeSeparators;
+	var tf = bkcore.Timer.msToTimeString(f);
+	var tl = [
+		bkcore.Timer.msToTimeString(l[0]),
+		bkcore.Timer.msToTimeString(l[1]),
+		bkcore.Timer.msToTimeString(l[2])
+	];
+
+	if(this.gameplay.result == this.gameplay.results.FINISH)
+	{
+		ds != undefined && (ds.innerHTML = "Finished!");
+		// local record
+		if(typeof(Storage)!=="undefined")
+		{
+			if(localStorage['score-'+t+'-'+d] == undefined || localStorage['score-'+t+'-'+d] > f)
+			{
+				dr != undefined && (dr.innerHTML = "New local record!");
+				localStorage['score-'+t+'-'+d] = f;
+			}
+			else
+			{
+				dr != undefined && (dr.innerHTML = "Well done!");
+			}
+		}
+		// ladder record
+		var p = bkcore.hexgl.Ladder.global[t][d][bkcore.hexgl.Ladder.global[t][d].length-2];
+		if(p != undefined && p['score'] > f)
+		{
+			dh != undefined && (dh.innerHTML = "You made it to the HOF!");
+		}
+		else
+		{
+			dh != undefined && (dh.innerHTML = "Hall Of Fame");
+		}
+
+		dt != undefined && (dt.innerHTML = tf.m + ts[1] + tf.s + ts[2] + tf.ms);
+		dl1 != undefined && (dl1.innerHTML = tl[0]["m"] != undefined ? tl[0].m + ts[1] + tl[0].s + ts[2] + tl[0].ms : "-");
+		dl2 != undefined && (dl2.innerHTML = tl[1]["m"] != undefined ? tl[1].m + ts[1] + tl[1].s + ts[2] + tl[1].ms : "-");
+		dl3 != undefined && (dl3.innerHTML = tl[2]["m"] != undefined ? tl[2].m + ts[1] + tl[2].s + ts[2] + tl[2].ms : "-");
+
+		// Ladder save
+		// Undisclosed
+	}
+	else
+	{
+		ds != undefined && (ds.innerHTML = "Destroyed!");
+		dr != undefined && (dr.innerHTML = "Maybe next time!");
+		dh != undefined && (dh.innerHTML = "Hall Of Fame");
+		dt != undefined && (dt.innerHTML = "None");
+		dl1 != undefined && (dl1.innerHTML = "None");
+		dl2 != undefined && (dl2.innerHTML = "None");
+		dl3 != undefined && (dl3.innerHTML = "None");
+	}
+
+	dd != undefined && (dd.innerHTML = d);
+	st != undefined && (st.href='http://twitter.com/share?text='+encodeURIComponent('I just scored '+dt.innerHTML+' in '+'Cityscape ('+d+') on #HexGL! Come try it and beat my record on '));
+	sf != undefined && (sf.href='http://www.facebook.com/sharer.php?s=100'
+		+'&p[title]='+encodeURIComponent('I just scored '+dt.innerHTML+' in '+'Cityscape ('+d+') on HexGL!')
+		+'&p[summary]='+encodeURIComponent('HexGL is a futuristic racing game built by Thibaut Despoulain (BKcore) using HTML5, Javascript and WebGL. Come challenge your friends on this fast-paced 3D game!')
+		+'&p[url]='+encodeURIComponent('http://hexgl.bkcore.com')
+		+'&p[images][0]='+encodeURIComponent('http://hexgl.bkcore.com/image.png'));
+
+	bkcore.hexgl.Ladder.displayLadder('finish-ladder', t, d, 8);
+
+	if(this.manager.get('game').objects.lowFPS >= 999)
+		sl != undefined && (sl.innerHTML = 'Note: Your framerate was pretty low, you should try a lesser graphic setting!');
+	else
+		sl != undefined && (sl.innerHTML = '');
+
+	dc.style.display = 'block';
+}
+
+bkcore.hexgl.HexGL.prototype.initRenderer = function()
+{
+	var renderer = new THREE.WebGLRenderer({
+		antialias: false,
+		clearColor: 0x000000
+	});
+
+	renderer.physicallyBasedShading = true;
+	renderer.gammaInput = true;
+	renderer.gammaOutput = true;
+
+	renderer.shadowMapEnabled = true;
+	renderer.shadowMapSoft = true;
+
+	renderer.autoClear = false;
+	renderer.sortObjects = false;
+	renderer.setSize( this.width, this.height );
+	renderer.domElement.style.position = "relative";
+
+	this.containers.main.appendChild( renderer.domElement );	
+	this.renderer = renderer;
+	this.manager = new bkcore.threejs.RenderManager(renderer);
+}
+
+bkcore.hexgl.HexGL.prototype.initHUD = function()
+{
+	this.hud = new bkcore.hexgl.HUD({
+		width: this.width,
+		height: this.height,
+		font: "BebasNeueRegular",
+		bg: this.track.lib.get("images", "hud.bg"),
+		speed: this.track.lib.get("images", "hud.speed"),
+		shield: this.track.lib.get("images", "hud.shield")
+	});	
+	this.containers.overlay.appendChild(this.hud.canvas);
+}
+
+bkcore.hexgl.HexGL.prototype.initGameComposer = function()
+{
+	var renderTargetParameters = { minFilter: THREE.LinearFilter, magFilter: THREE.LinearFilter, format: THREE.RGBFormat, stencilBuffer: false };
+	var renderTarget = new THREE.WebGLRenderTarget( this.width, this.height, renderTargetParameters );
+
+	// GAME COMPOSER	
+	var renderSky = new THREE.RenderPass( this.manager.get("sky").scene, this.manager.get("sky").camera );
+
+	var renderModel = new THREE.RenderPass( this.manager.get("game").scene, this.manager.get("game").camera );
+	renderModel.clear = false;
+
+	this.composers.game = new THREE.EffectComposer( this.renderer, renderTarget );
+
+	var effectScreen = new THREE.ShaderPass( THREE.ShaderExtras[ "screen" ] );				
+	var effectVignette = new THREE.ShaderPass( THREE.ShaderExtras[ "vignette" ] );
+
+	var effectHex = new THREE.ShaderPass( bkcore.threejs.Shaders[ "hexvignette" ] );
+	effectHex.uniforms[ 'size' ].value = 512.0 * (this.width/1633);
+	effectHex.uniforms[ 'rx' ].value = this.width;
+	effectHex.uniforms[ 'ry' ].value = this.height;
+	effectHex.uniforms[ 'tHex' ].texture = this.track.lib.get("textures", "hex");
+	effectHex.uniforms[ 'color' ].value = this.extras.vignetteColor;
+
+	effectHex.renderToScreen = true;
+
+	this.composers.game.addPass( renderSky );
+	this.composers.game.addPass( renderModel );
+
+	if(this.quality > 0)
+	{
+		var effectFXAA = new THREE.ShaderPass( THREE.ShaderExtras[ "fxaa" ] );
+		effectFXAA.uniforms[ 'resolution' ].value.set( 1 / this.width, 1 / this.height );
+
+		this.composers.game.addPass( effectFXAA );
+		
+		this.extras.fxaa = effectFXAA;
+	}
+	if(this.quality > 1)
+	{	
+		var effectBloom = new THREE.BloomPass( 0.8, 25, 4 , 256);
+
+		this.composers.game.addPass( effectBloom );
+
+		this.extras.bloom = effectBloom;
+	}
+
+	this.composers.game.addPass( effectHex );
+
+	
+}
+
+bkcore.hexgl.HexGL.prototype.createMesh = function(parent, geometry, x, y, z, mat) 
+{
+	geometry.computeTangents();
+
+	var mesh = new THREE.Mesh( geometry, mat );
+	mesh.position.set( x, y, z );
+	parent.add(mesh);
+
+	if(this.quality > 0)
+	{
+		mesh.castShadow = true;
+		mesh.receiveShadow = true;
+	}
+
+	return mesh;
+}
+
+bkcore.hexgl.HexGL.prototype.tweakShipControls = function()
+{
+	var c = this.components.shipControls;
+	if(this.difficulty == 1)
+	{
+		c.airResist = 0.035;
+		c.airDrift = 0.07;
+		c.thrust = 0.035;
+		c.airBrake = 0.04;
+		c.maxSpeed = 9.6;
+		c.boosterSpeed = c.maxSpeed * 0.35;
+		c.boosterDecay = 0.007;
+		c.angularSpeed = 0.0140;
+		c.airAngularSpeed = 0.0165;
+		c.rollAngle = 0.6;
+		c.shieldDamage = 0.03;
+		c.collisionSpeedDecrease = 0.8;
+		c.collisionSpeedDecreaseCoef = 0.5;
+		c.rollLerp = 0.1;
+		c.driftLerp = 0.4;
+		c.angularLerp = 0.4;
+	}
+	else if(this.difficulty == 0)
+	{
+		c.airResist = 0.02;
+		c.airDrift = 0.06;
+		c.thrust = 0.02;
+		c.airBrake = 0.025;
+		c.maxSpeed = 7.0;
+		c.boosterSpeed = c.maxSpeed * 0.5;
+		c.boosterDecay = 0.007;
+		c.angularSpeed = 0.0125;
+		c.airAngularSpeed = 0.0135;
+		c.rollAngle = 0.6;
+		c.shieldDamage = 0.06;
+		c.collisionSpeedDecrease = 0.8;
+		c.collisionSpeedDecreaseCoef = 0.5;
+		c.rollLerp = 0.07;
+		c.driftLerp = 0.3;
+		c.angularLerp = 0.4;
+	}
+}

bkcore/hexgl/Ladder.js

@@ -0,0 +1,52 @@
+ /*
+ * HexGL
+ * @author Thibaut 'BKcore' Despoulain <http://bkcore.com>
+ * @license This work is licensed under the Creative Commons Attribution-NonCommercial 3.0 Unported License. 
+ *          To view a copy of this license, visit http://creativecommons.org/licenses/by-nc/3.0/.
+ */
+
+var bkcore = bkcore || {};
+bkcore.hexgl = bkcore.hexgl || {};
+
+bkcore.hexgl.Ladder = {};
+bkcore.hexgl.Ladder.global = {};
+
+bkcore.hexgl.Ladder.load = function(callback)
+{
+	var s = encodeURIComponent(window.location.href);
+	bkcore.Utils.request("nothing", false, function(req)
+	{
+		try {
+			bkcore.Ladder.global = JSON.parse(req.responseText);
+			if(callback) callback.call(window);
+		}
+		catch(e)
+		{
+			console.warn('Unable to load ladder. '+e);
+		}
+	},
+	{
+		u: s
+	});
+}
+
+bkcore.hexgl.Ladder.displayLadder = function(id, track, mode, num)
+{
+	var d = document.getElementById(id);
+	if(d == undefined || bkcore.Ladder.global[track] == undefined || !bkcore.Ladder.global[track][mode] == undefined)
+	{
+		console.warn('Undefined ladder.');
+		return;
+	}
+
+	var l = bkcore.Ladder.global[track][mode];
+	var h = '';
+	var m = Math.min((num == undefined ? 10 : num), l.length-1);
+	for(var i = 0; i < l.length-1; i++)
+	{
+		var t = bkcore.Timer.msToTime(l[i]['score']);
+		h += '<span class="ladder-row"><b>'+(i+1)+'. '+l[i]['name']+'</b><i>'+t.m+'\''+t.s+'\'\''+t.ms+'</i></span>';
+	}
+
+	d.innerHTML = h;
+}

bkcore/hexgl/ShipControls.js

@@ -0,0 +1,535 @@
+ /*
+ * HexGL
+ * @author Thibaut 'BKcore' Despoulain <http://bkcore.com>
+ * @license This work is licensed under the Creative Commons Attribution-NonCommercial 3.0 Unported License. 
+ *          To view a copy of this license, visit http://creativecommons.org/licenses/by-nc/3.0/.
+ */
+
+var bkcore = bkcore || {};
+bkcore.hexgl = bkcore.hexgl || {};
+
+bkcore.hexgl.ShipControls = function(domElement)
+{
+	var self = this;
+
+	this.active = true;
+	this.destroyed = false;
+
+	this.dom = domElement;
+	this.mesh = null;
+
+	this.epsilon = 0.00000001;
+	this.zero = new THREE.Vector3(0,0,0);
+	this.airResist = 0.02;
+	this.airDrift = 0.1;
+	this.thrust = 0.02;
+	this.airBrake = 0.02;
+	this.maxSpeed = 7.0;
+	this.boosterSpeed = this.maxSpeed * 0.4;
+	this.boosterDecay = 0.01;
+	this.angularSpeed = 0.005;
+	this.airAngularSpeed = 0.0065;
+	this.repulsionRatio = 0.5;
+	this.repulsionCap = 2.5;
+	this.repulsionLerp = 0.1;
+	this.collisionSpeedDecrease = 0.8;
+	this.collisionSpeedDecreaseCoef = 0.8;
+	this.maxShield = 1.0;
+	this.shieldDelay = 60;
+	this.shieldTiming = 0;
+	this.shieldDamage = 0.25;
+	this.driftLerp = 0.35;
+	this.angularLerp = 0.35;
+
+	this.movement = new THREE.Vector3(0,0,0);
+	this.rotation = new THREE.Vector3(0,0,0);
+	this.roll = 0.0;
+	this.rollAxis = new THREE.Vector3();
+	this.drift = 0.0;
+	this.speed = 0.0;
+	this.speedRatio = 0.0;
+	this.boost = 0.0;
+	this.shield = 1.0;
+	this.angular = 0.0;
+
+	this.currentVelocity = new THREE.Vector3();
+
+	this.quaternion = new THREE.Quaternion();
+
+	this.dummy = new THREE.Object3D();
+	this.dummy.useQuaternion = true;
+
+	this.collisionMap = null;
+	this.collisionPixelRatio = 1.0;
+	this.collisionDetection = false;
+	this.collisionPreviousPosition = new THREE.Vector3();
+
+	this.heightMap = null;
+	this.heightPixelRatio = 1.0;
+	this.heightBias = 0.0;
+	this.heightLerp = 0.4;
+	this.heightScale = 1.0;
+
+	this.rollAngle = 0.6;
+	this.rollLerp = 0.08;
+	this.rollDirection = new THREE.Vector3(0,0,1);
+	
+	this.gradient = 0.0;
+	this.gradientTarget = 0.0;
+	this.gradientLerp = 0.05;
+	this.gradientScale = 4.0;
+	this.gradientVector = new THREE.Vector3(0,0,5);
+	this.gradientAxis = new THREE.Vector3(1,0,0);
+
+	this.tilt = 0.0;
+	this.tiltTarget = 0.0;
+	this.tiltLerp = 0.05;
+	this.tiltScale = 4.0;
+	this.tiltVector = new THREE.Vector3(5,0,0);
+	this.tiltAxis = new THREE.Vector3(0,0,1);
+
+	this.repulsionVLeft = new THREE.Vector3(1,0,0);
+	this.repulsionVRight = new THREE.Vector3(-1,0,0);
+	this.repulsionVFront = new THREE.Vector3(0,0,1);
+	this.repulsionVScale = 4.0;
+	this.repulsionAmount = 0.0;
+	this.repulsionForce = new THREE.Vector3();
+
+	this.resetPos = null;
+	this.resetRot = null;
+
+	this.key = {
+		forward: false,
+		backward: false,
+		left: false,
+		right: false,
+		ltrigger: false,
+		rtrigger: false,
+		use: false
+	};
+
+	this.collision = {
+		front: false,
+		left: false,
+		right: false
+	};
+
+	function onKeyDown(event) 
+	{
+		switch(event.keyCode) 
+		{
+			case 38: /*up*/	self.key.forward = true; break;
+
+			case 40: /*down*/self.key.backward = true; break;
+
+			case 37: /*left*/self.key.left = true; break;
+
+			case 39: /*right*/self.key.right = true; break;
+
+			case 81: /*Q*/self.key.ltrigger = true; break;
+			case 65: /*A*/self.key.ltrigger = true; break;
+
+			case 68: /*D*/self.key.rtrigger = true; break;
+			case 69: /*E*/self.key.rtrigger = true; break;
+		}
+	};
+
+	function onKeyUp(event) 
+	{
+		switch(event.keyCode) 
+		{
+			case 38: /*up*/	self.key.forward = false; break;
+
+			case 40: /*down*/self.key.backward = false; break;
+
+			case 37: /*left*/self.key.left = false; break;
+
+			case 39: /*right*/self.key.right = false; break;
+
+			case 81: /*Q*/self.key.ltrigger = false; break;
+			case 65: /*A*/self.key.ltrigger = false; break;
+
+			case 68: /*D*/self.key.rtrigger = false; break;
+			case 69: /*E*/self.key.rtrigger = false; break;
+		}
+	};
+
+	domElement.addEventListener('keydown', onKeyDown, false);
+	domElement.addEventListener('keyup', onKeyUp, false);
+};
+
+bkcore.hexgl.ShipControls.prototype.control = function(threeMesh)
+{
+	this.mesh = threeMesh;
+	this.mesh.martixAutoUpdate = false;
+	this.dummy.position = this.mesh.position;
+};
+
+bkcore.hexgl.ShipControls.prototype.reset = function(position, rotation)
+{
+	this.resetPos = position;
+	this.resetRot = rotation;
+	this.movement.set(0,0,0);
+	this.rotation.copy(rotation);
+	this.roll = 0.0;
+	this.drift = 0.0;
+	this.speed = 0.0;
+	this.speedRatio = 0.0;
+	this.boost = 0.0;
+	this.shield = this.maxShield;
+	this.destroyed = false;
+
+	this.dummy.position.copy(position);
+	this.quaternion.set(rotation.x, rotation.y, rotation.z, 1).normalize();
+	this.dummy.quaternion.set(0,0,0,1);
+	this.dummy.quaternion.multiplySelf(this.quaternion);
+
+	this.dummy.matrix.setPosition(this.dummy.position);
+	this.dummy.matrix.setRotationFromQuaternion(this.dummy.quaternion);
+	
+	this.mesh.matrix.identity();
+	this.mesh.applyMatrix(this.dummy.matrix);
+}
+
+bkcore.hexgl.ShipControls.prototype.destroy = function()
+{
+	this.active = false;
+	this.destroyed = true;
+	this.collision.front = false;
+	this.collision.left = false;
+	this.collision.right = false;
+}
+
+bkcore.hexgl.ShipControls.prototype.update = function(dt)
+{
+	if(!this.active) return;
+
+	this.rotation.y = 0;
+	this.movement.set(0,0,0);
+	this.drift += (0.0 - this.drift) * this.driftLerp;
+	this.angular += (0.0 - this.angular) * this.angularLerp * 0.5;
+
+	var rollAmount = 0.0;
+	var angularAmount = 0.0;
+
+	if(this.key.forward)
+		this.speed += this.thrust * dt;
+	else
+		this.speed -= this.airResist * dt;
+	if(this.key.left)
+	{
+		angularAmount += this.angularSpeed * dt;
+		rollAmount -= this.rollAngle;
+	}
+	if(this.key.right)
+	{
+		angularAmount -= this.angularSpeed * dt;
+		rollAmount += this.rollAngle;
+	}
+	if(this.key.ltrigger)
+	{
+		if(this.key.left)
+			angularAmount += this.airAngularSpeed * dt;
+		else
+			angularAmount += this.airAngularSpeed * 0.5 * dt;
+		this.speed -= this.airBrake * dt;
+		this.drift += (this.airDrift - this.drift) * this.driftLerp;
+		this.movement.x += this.speed * this.drift * dt;
+		if(this.drift > 0.0)
+			this.movement.z -= this.speed * this.drift * dt;
+		rollAmount -= this.rollAngle * 0.7;
+	}
+	if(this.key.rtrigger)
+	{
+		if(this.key.right)
+			angularAmount -= this.airAngularSpeed * dt;
+		else
+			angularAmount -= this.airAngularSpeed * 0.5 * dt;
+		this.speed -= this.airBrake * dt;
+		this.drift += (-this.airDrift - this.drift) * this.driftLerp;
+		this.movement.x += this.speed * this.drift * dt;
+		if(this.drift < 0.0)
+			this.movement.z += this.speed * this.drift * dt;
+		rollAmount += this.rollAngle * 0.7;
+	}
+
+	this.angular += (angularAmount - this.angular) * this.angularLerp;
+	this.rotation.y = this.angular;
+
+	this.speed = Math.max(0.0, Math.min(this.speed, this.maxSpeed));
+	this.speedRatio = this.speed / this.maxSpeed;
+	this.movement.z += this.speed * dt;
+
+	if(this.repulsionForce.isZero())
+	{
+		this.repulsionForce.set(0,0,0);
+	}
+	else
+	{
+		if(this.repulsionForce.z != 0.0) this.movement.z = 0;
+		this.movement.addSelf(this.repulsionForce);
+		this.repulsionForce.lerpSelf(this.zero, dt > 1.5 ? this.repulsionLerp*2 : this.repulsionLerp);
+	}
+
+	this.collisionPreviousPosition.copy(this.dummy.position);
+
+	this.boosterCheck(dt);
+
+	//this.movement.multiplyScalar(dt);
+	//this.rotation.multiplyScalar(dt);
+
+	this.dummy.translateX(this.movement.x);
+	this.dummy.translateZ(this.movement.z);
+
+
+	this.heightCheck(dt);
+	this.dummy.translateY(this.movement.y);
+
+	this.currentVelocity.copy(this.dummy.position).subSelf(this.collisionPreviousPosition);
+
+	this.collisionCheck(dt);
+
+	this.quaternion.set(this.rotation.x, this.rotation.y, this.rotation.z, 1).normalize();
+	this.dummy.quaternion.multiplySelf(this.quaternion);
+
+	this.dummy.matrix.setPosition(this.dummy.position);
+	this.dummy.matrix.setRotationFromQuaternion(this.dummy.quaternion);
+
+	if(this.shield <= 0.0)
+	{
+		this.shield = 0.0;
+		this.destroy();
+	}
+
+	if(this.mesh != null)
+	{
+		this.mesh.matrix.identity();
+
+		// Gradient (Mesh only, no dummy physics impact)
+		var gradientDelta = (this.gradientTarget - this.gradient) * this.gradientLerp;
+		if(Math.abs(gradientDelta) > this.epsilon) this.gradient += gradientDelta;
+		if(Math.abs(this.gradient) > this.epsilon)
+		{
+			this.gradientAxis.set(1,0,0);
+			this.mesh.matrix.rotateByAxis(this.gradientAxis, this.gradient);
+		}
+
+		// Tilting (Idem)
+		var tiltDelta = (this.tiltTarget - this.tilt) * this.tiltLerp;
+		if(Math.abs(tiltDelta) > this.epsilon) this.tilt += tiltDelta;
+		if(Math.abs(this.tilt) > this.epsilon)
+		{
+			this.tiltAxis.set(0,0,1);
+			this.mesh.matrix.rotateByAxis(this.tiltAxis, this.tilt);
+		}
+
+		// Rolling (Idem)
+		var rollDelta = (rollAmount - this.roll) * this.rollLerp;
+		if(Math.abs(rollDelta) > this.epsilon) this.roll += rollDelta;
+		if(Math.abs(this.roll) > this.epsilon)
+		{
+			this.rollAxis.copy(this.rollDirection);
+			this.mesh.matrix.rotateByAxis(this.rollAxis, this.roll);
+		}
+
+		this.mesh.applyMatrix(this.dummy.matrix);
+		this.mesh.updateMatrixWorld(true);
+	}
+};
+
+bkcore.hexgl.ShipControls.prototype.boosterCheck = function(dt)
+{
+	if(!this.collisionMap || !this.collisionMap.loaded)
+		return false;
+
+	this.boost -= this.boosterDecay * dt;
+	if(this.boost < 0)
+		this.boost = 0.0;
+
+	var x = Math.round(this.collisionMap.pixels.width/2 + this.dummy.position.x * this.collisionPixelRatio);
+	var z = Math.round(this.collisionMap.pixels.height/2 + this.dummy.position.z * this.collisionPixelRatio);
+	var pos = new THREE.Vector3(x, 0, z);
+
+	var color = this.collisionMap.getPixel(x, z);
+
+	if(color.r == 255 && color.g < 127 && color.b < 127)
+		this.boost = this.boosterSpeed;
+
+	this.movement.z += this.boost * dt;
+}
+
+bkcore.hexgl.ShipControls.prototype.collisionCheck = function(dt)
+{
+	if(!this.collisionDetection || !this.collisionMap || !this.collisionMap.loaded)
+		return false;
+
+	if(this.shieldDelay > 0)
+		this.shieldDelay -= dt;
+
+	this.collision.left = false;
+	this.collision.right = false;
+	this.collision.front = false;
+
+	var x = Math.round(this.collisionMap.pixels.width/2 + this.dummy.position.x * this.collisionPixelRatio);
+	var z = Math.round(this.collisionMap.pixels.height/2 + this.dummy.position.z * this.collisionPixelRatio);
+	var pos = new THREE.Vector3(x, 0, z);
+
+	//console.log({c: this.collisionMap.getPixel(414, 670), d: this.dummy.position, x: x, y: y, p: this.collisionMap.getPixel(x, y)})
+
+	var collision = this.collisionMap.getPixelBilinear(x, z);
+
+	if(collision.r < 255)
+	{
+		// Shield
+		var sr = (this.getRealSpeed() / this.maxSpeed);
+		this.shield -= sr * sr * 0.8 * this.shieldDamage;
+
+		// Repulsion
+		this.repulsionVLeft.set(1,0,0);
+		this.repulsionVRight.set(-1,0,0);
+		this.dummy.matrix.rotateAxis(this.repulsionVLeft);
+		this.dummy.matrix.rotateAxis(this.repulsionVRight);
+		this.repulsionVLeft.multiplyScalar(this.repulsionVScale);
+		this.repulsionVRight.multiplyScalar(this.repulsionVScale);
+
+		var lPos = this.repulsionVLeft.addSelf(pos);
+		var rPos = this.repulsionVRight.addSelf(pos);
+		var lCol = this.collisionMap.getPixel(Math.round(lPos.x), Math.round(lPos.z)).r;
+		var rCol = this.collisionMap.getPixel(Math.round(rPos.x), Math.round(rPos.z)).r;
+		
+		this.repulsionAmount = Math.max(0.8, 
+			Math.min(this.repulsionCap, 
+				this.speed * this.repulsionRatio
+				)
+			);
+
+		if(rCol > lCol)
+		{// Repulse right
+			this.repulsionForce.x += -this.repulsionAmount;
+			this.collision.left = true;
+		}
+		else if(rCol < lCol)
+		{// Repulse left
+			this.repulsionForce.x += this.repulsionAmount;
+			this.collision.right = true;
+		}
+		else
+		{
+			//console.log(collision.r+"  --  "+fCol+"  @  "+lCol+"  /  "+rCol);
+			this.repulsionForce.z += -this.repulsionAmount*4;
+			this.collision.front = true;
+			this.speed = 0;
+		}
+
+		this.speed *= this.collisionSpeedDecrease;
+		this.speed *= (1-this.collisionSpeedDecreaseCoef*(1-collision.r/255));
+		this.boost = 0;
+
+		return true;
+	}
+	else
+	{
+		return false;
+	}
+}
+
+bkcore.hexgl.ShipControls.prototype.heightCheck = function(dt)
+{
+	if(!this.heightMap || !this.heightMap.loaded)
+		return false;
+
+	var x = this.heightMap.pixels.width/2 + this.dummy.position.x * this.heightPixelRatio;
+	var z = this.heightMap.pixels.height/2 + this.dummy.position.z * this.heightPixelRatio;
+	var height = this.heightMap.getPixelFBilinear(x, z) / this.heightScale + this.heightBias;
+
+	var color = this.heightMap.getPixel(x, z);
+
+	if(height < 16777)
+	{
+		var delta = (height - this.dummy.position.y);
+
+		if(delta > 0)
+		{
+			this.movement.y += delta;
+		}
+		else
+		{
+			this.movement.y += delta * this.heightLerp;
+		}
+	}
+
+	// gradient
+	this.gradientVector.set(0,0,5);
+	this.dummy.matrix.rotateAxis(this.gradientVector);
+	this.gradientVector.addSelf(this.dummy.position);
+
+	x = this.heightMap.pixels.width/2 + this.gradientVector.x * this.heightPixelRatio;
+	z = this.heightMap.pixels.height/2 + this.gradientVector.z * this.heightPixelRatio;
+
+	var nheight = this.heightMap.getPixelFBilinear(x, z) / this.heightScale + this.heightBias;
+
+	if(nheight < 16777)
+		this.gradientTarget = -Math.atan2(nheight-height, 5.0)*this.gradientScale;
+
+	// tilt
+	this.tiltVector.set(5,0,0);
+	this.dummy.matrix.rotateAxis(this.tiltVector);
+	this.tiltVector.addSelf(this.dummy.position);
+
+	x = this.heightMap.pixels.width/2 + this.tiltVector.x * this.heightPixelRatio;
+	z = this.heightMap.pixels.height/2 + this.tiltVector.z * this.heightPixelRatio;
+
+	nheight = this.heightMap.getPixelFBilinear(x, z) / this.heightScale + this.heightBias;
+
+	if(nheight >= 16777) // If right project out of bounds, try left projection
+	{
+		this.tiltVector.subSelf(this.dummy.position).multiplyScalar(-1).addSelf(this.dummy.position);
+
+		x = this.heightMap.pixels.width/2 + this.tiltVector.x * this.heightPixelRatio;
+		z = this.heightMap.pixels.height/2 + this.tiltVector.z * this.heightPixelRatio;
+
+		nheight = this.heightMap.getPixelFBilinear(x, z) / this.heightScale + this.heightBias;		
+	}
+
+	if(nheight < 16777)
+		this.tiltTarget = Math.atan2(nheight-height, 5.0)*this.tiltScale;
+};
+
+bkcore.hexgl.ShipControls.prototype.getRealSpeed = function(scale)
+{
+	return Math.round(
+		(this.speed+this.boost)
+		* (scale == undefined ? 1 : scale)
+	);
+};
+
+bkcore.hexgl.ShipControls.prototype.getRealSpeedRatio = function()
+{
+	return Math.min(
+		this.maxSpeed, 
+		this.speed+this.boost
+	) / this.maxSpeed;
+};
+
+bkcore.hexgl.ShipControls.prototype.getSpeedRatio = function()
+{
+	return (this.speed+this.boost)/ this.maxSpeed;
+};
+
+bkcore.hexgl.ShipControls.prototype.getBoostRatio = function()
+{
+	return this.boost / this.boosterSpeed;
+};
+
+bkcore.hexgl.ShipControls.prototype.getShieldRatio = function()
+{
+	return this.shield / this.maxShield;
+};
+
+bkcore.hexgl.ShipControls.prototype.getShield = function(scale)
+{
+	return Math.round(
+		this.shield
+		* (scale == undefined ? 1 : scale)
+	);
+};

bkcore/hexgl/ShipEffects.js

@@ -0,0 +1,186 @@
+ /*
+ * HexGL
+ * @author Thibaut 'BKcore' Despoulain <http://bkcore.com>
+ * @license This work is licensed under the Creative Commons Attribution-NonCommercial 3.0 Unported License. 
+ *          To view a copy of this license, visit http://creativecommons.org/licenses/by-nc/3.0/.
+ */
+
+var bkcore = bkcore || {};
+bkcore.hexgl = bkcore.hexgl || {};
+
+bkcore.hexgl.ShipEffects = function(opts)
+{
+	this.scene = opts.scene;
+	this.shipControls = opts.shipControls;
+
+	this.booster = opts.booster;
+	this.boosterLight = opts.boosterLight;
+	this.boosterSprite = opts.boosterSprite;
+
+	this.useParticles = opts.useParticles;
+
+	if(this.useParticles)
+	{
+		this.pVel = new THREE.Vector3(0.5,0,0);
+		this.pOffset = new THREE.Vector3(-3,-0.3,0);
+		this.pRad = new THREE.Vector3(0,0,1.5);
+
+		this.shipVelocity = new THREE.Vector3();
+
+		this.pVelS = this.pVel.length();
+		this.pOffsetS = this.pOffset.length();
+		this.pRadS = this.pRad.length();
+
+		this.pVel.normalize();
+		this.pOffset.normalize();
+		this.pRad.normalize();
+
+		this.particles = {
+
+			leftSparks: new bkcore.threejs.Particles(
+			{
+				randomness: new THREE.Vector3(0.4,0.4,0.4),
+				tint: 0xffffff,
+				color: 0xffc000,
+				color2: 0xffffff,
+				texture: opts.textureSpark,
+				size: 2,
+				life: 60,
+				max: 500
+			}),
+
+			leftClouds: new bkcore.threejs.Particles(
+			{
+				opacity: 0.8,
+				tint: 0xffffff,
+				color: 0x666666,
+				color2: 0xa4f1ff,
+				texture: opts.textureCloud,
+				size: 6,
+				blending: THREE.NormalBlending,
+				life: 60,
+				max: 500,
+				spawn: new THREE.Vector3(3,-0.3,0),
+				spawnRadius: new THREE.Vector3(1,1,2),
+				velocity: new THREE.Vector3(0,0,-0.4),
+				randomness: new THREE.Vector3(0.05,0.05,0.1)
+			}),
+
+			rightSparks: new bkcore.threejs.Particles(
+			{
+				randomness: new THREE.Vector3(0.4,0.4,0.4),
+				tint: 0xffffff,
+				color: 0xffc000,
+				color2: 0xffffff,
+				texture: opts.textureSpark,
+				size: 2,
+				life: 60,
+				max: 500
+			}),
+
+			rightClouds: new bkcore.threejs.Particles(
+			{
+				opacity: 0.8,
+				tint: 0xffffff,
+				color: 0x666666,
+				color2: 0xa4f1ff,
+				texture: opts.textureCloud,
+				size: 6,
+				blending: THREE.NormalBlending,
+				life: 60,
+				max: 500,
+				spawn: new THREE.Vector3(-3,-0.3,0),
+				spawnRadius: new THREE.Vector3(1,1,2),
+				velocity: new THREE.Vector3(0,0,-0.4),
+				randomness: new THREE.Vector3(0.05,0.05,0.1)
+			})
+		};
+
+		this.shipControls.mesh.add(this.particles.leftClouds.system);
+		this.shipControls.mesh.add(this.particles.rightClouds.system);
+		this.scene.add(this.particles.leftSparks.system);
+		this.scene.add(this.particles.rightSparks.system);
+	}
+}
+
+bkcore.hexgl.ShipEffects.prototype.update = function(dt)
+{
+	var boostRatio, opacity, scale, intensity, random; 
+
+	if(this.shipControls.destroyed)
+	{
+		opacity = 0;
+		scale = 0;
+		intensity = 0;
+		random = 0;
+	}
+	else
+	{
+		boostRatio = this.shipControls.getBoostRatio();
+		opacity = this.shipControls.key.forward ? 0.8 : 0.3 + boostRatio * 0.4;
+		scale = (this.shipControls.key.forward ? 1.0 : 0.8) + boostRatio * 0.5;
+		intensity = this.shipControls.key.forward ? 4.0 : 2.0;
+		random = Math.random()*0.2;
+	}
+
+	if(this.booster)
+	{
+		this.booster.rotation.z += 1;
+		this.booster.scale.set(scale, scale, scale);
+		this.booster.material.opacity = random+opacity;
+		this.boosterSprite.opacity = random+opacity;
+		this.boosterLight.intensity = intensity*(random+0.8);
+	}
+
+	// PARTICLES
+	if(this.useParticles)
+	{
+		this.shipVelocity.copy(this.shipControls.currentVelocity).multiplyScalar(0.7);
+
+		this.particles.rightSparks.velocity.copy(this.pVel);
+		this.particles.rightSparks.spawnRadius.copy(this.pRad);
+		this.particles.rightSparks.spawn.copy(this.pOffset);
+
+		this.particles.leftSparks.velocity.copy(this.pVel).x *= -1;
+		this.particles.leftSparks.spawn.copy(this.pOffset).x *= -1;
+
+		if(this.shipControls.mesh) 
+		{ 
+			// RIGHT
+			this.shipControls.mesh.matrix.rotateAxis(this.particles.rightSparks.spawn);
+			this.particles.rightSparks.spawn.multiplyScalar(this.pOffsetS).addSelf(this.shipControls.dummy.position);
+
+			this.shipControls.mesh.matrix.rotateAxis(this.particles.rightSparks.velocity);
+			this.particles.rightSparks.velocity.multiplyScalar(this.pVelS).addSelf(this.shipVelocity);
+
+			this.shipControls.mesh.matrix.rotateAxis(this.particles.rightSparks.spawnRadius);
+			this.particles.rightSparks.spawnRadius.multiplyScalar(this.pRadS);
+
+			// LEFT
+			this.shipControls.mesh.matrix.rotateAxis(this.particles.leftSparks.spawn);
+			this.particles.leftSparks.spawn.multiplyScalar(this.pOffsetS).addSelf(this.shipControls.dummy.position);
+
+			this.shipControls.mesh.matrix.rotateAxis(this.particles.leftSparks.velocity);
+			this.particles.leftSparks.velocity.multiplyScalar(this.pVelS).addSelf(this.shipVelocity);
+
+			this.particles.leftSparks.spawnRadius.copy(this.particles.rightSparks.spawnRadius);
+		}
+
+		if(this.shipControls.collision.right)
+		{
+			this.particles.rightSparks.emit(Math.round(30*dt));
+			this.particles.rightClouds.emit(Math.round(10*dt));
+		}
+
+		if(this.shipControls.collision.left)
+		{
+			this.particles.leftSparks.emit(Math.round(30*dt));
+			this.particles.leftClouds.emit(Math.round(10*dt));
+		}
+
+		this.particles.rightSparks.update(dt);
+		this.particles.rightClouds.update(dt);
+		this.particles.leftSparks.update(dt);
+		this.particles.leftClouds.update(dt);
+	}
+}

bkcore/hexgl/tracks/Cityscape.js

@@ -0,0 +1,445 @@
+ /*
+ * HexGL
+ * @author Thibaut 'BKcore' Despoulain <http://bkcore.com>
+ * @license This work is licensed under the Creative Commons Attribution-NonCommercial 3.0 Unported License. 
+ *          To view a copy of this license, visit http://creativecommons.org/licenses/by-nc/3.0/.
+ */
+
+var bkcore = bkcore || {};
+bkcore.hexgl = bkcore.hexgl || {};
+bkcore.hexgl.tracks = bkcore.hexgl.tracks || {};
+
+bkcore.hexgl.tracks.Cityscape = {
+
+	lib: null,
+	materials: {},
+
+	checkpoints: {
+		list: [0,1,2],
+		start: 0,
+		last: 2
+	},
+
+	spawn: {
+		x: -1134*2, 
+		y: 387, 
+		z: -443*2
+	},
+
+	spawnRotation: {
+		x: 0,
+		y: 0,
+		z: 0
+	},
+
+	analyser: null,
+	pixelRatio: 2048.0 / 6000.0,
+
+	load: function(opts, quality)
+	{
+		this.lib = new bkcore.threejs.Loader(opts);
+
+		if(quality < 1) // LOW
+		{
+			this.lib.load({
+				textures: {
+					'hex'								: "textures/hud/hex.jpg",
+					'ship.feisar.diffuse'				: "textures/ships/feisar/diffuse.jpg",
+					'booster.diffuse'					: "textures/ships/feisar/booster/booster.png",
+					'booster.sprite'					: "textures/ships/feisar/booster/boostersprite.jpg",
+					'track.cityscape.diffuse'			: "textures/tracks/cityscape/diffuse.jpg",
+					'track.cityscape.scrapers1.diffuse'	: "textures/tracks/cityscape/scrapers1/diffuse.jpg",
+					'track.cityscape.scrapers2.diffuse'	: "textures/tracks/cityscape/scrapers2/diffuse.jpg",
+					'track.cityscape.start.diffuse'		: "textures/tracks/cityscape/start/diffuse.jpg",
+					'track.cityscape.start.banner'		: "textures/tracks/cityscape/start/start.jpg",
+					'bonus.base.diffuse'				: "textures/bonus/base/diffuse.jpg"
+				},
+				texturesCube: {
+					'skybox.dawnclouds'					: "textures/skybox/dawnclouds/%1.jpg"
+				},
+				geometries: {
+					'bonus.base'						: "geometries/bonus/base/base.js",
+					'booster'							: "geometries/booster/booster.js",
+					'ship.feisar'						: "geometries/ships/feisar/feisar.js",
+					'track.cityscape'					: "geometries/tracks/cityscape/track.js",
+					'track.cityscape.scrapers1'			: "geometries/tracks/cityscape/scrapers1.js",
+					'track.cityscape.scrapers2'			: "geometries/tracks/cityscape/scrapers2.js",
+					'track.cityscape.start'				: "geometries/tracks/cityscape/start.js",
+					'track.cityscape.start.banner'		: "geometries/tracks/cityscape/startbanner.js",
+					'track.cityscape.bonus.speed'		: "geometries/tracks/cityscape/bonus/speed.js"
+				},
+				analysers: {
+					'track.cityscape.collision'			: "textures/tracks/cityscape/collision.png",
+					'track.cityscape.height'			: "textures/tracks/cityscape/height.png"
+				},
+				images: {
+					'hud.bg'							: "textures/hud/hud-bg.png",
+					'hud.speed'							: "textures/hud/hud-fg-speed.png",
+					'hud.shield'						: "textures/hud/hud-fg-shield.png"
+				}
+			});
+		}
+		else // HIGH
+		{
+			this.lib.load({
+				textures: {
+					'hex'								: "textures/hud/hex.jpg",
+					'spark'								: "textures/particles/spark.png",
+					'cloud'								: "textures/particles/cloud.png",
+					'ship.feisar.diffuse'				: "textures/ships/feisar/diffuse.jpg",
+					'ship.feisar.specular'				: "textures/ships/feisar/specular.jpg",
+					'ship.feisar.normal'				: "textures/ships/feisar/normal.jpg",
+					'booster.diffuse'					: "textures/ships/feisar/booster/booster.png",
+					'booster.sprite'					: "textures/ships/feisar/booster/boostersprite.jpg",
+					'track.cityscape.diffuse'			: "textures/tracks/cityscape/diffuse.jpg",
+					'track.cityscape.specular'			: "textures/tracks/cityscape/specular.jpg",
+					'track.cityscape.normal'			: "textures/tracks/cityscape/normal.jpg",
+					'track.cityscape.scrapers1.diffuse'	: "textures/tracks/cityscape/scrapers1/diffuse.jpg",
+					'track.cityscape.scrapers1.specular': "textures/tracks/cityscape/scrapers1/specular.jpg",
+					'track.cityscape.scrapers1.normal'	: "textures/tracks/cityscape/scrapers1/normal.jpg",
+					'track.cityscape.scrapers2.diffuse'	: "textures/tracks/cityscape/scrapers2/diffuse.jpg",
+					'track.cityscape.scrapers2.specular': "textures/tracks/cityscape/scrapers2/specular.jpg",
+					'track.cityscape.scrapers2.normal'	: "textures/tracks/cityscape/scrapers2/normal.jpg",
+					'track.cityscape.start.diffuse'		: "textures/tracks/cityscape/start/diffuse.jpg",
+					'track.cityscape.start.specular'	: "textures/tracks/cityscape/start/specular.jpg",
+					'track.cityscape.start.normal'		: "textures/tracks/cityscape/start/normal.jpg",
+					'track.cityscape.start.banner'		: "textures/tracks/cityscape/start/start.jpg",
+					'bonus.base.diffuse'				: "textures/bonus/base/diffuse.jpg",
+					'bonus.base.normal'					: "textures/bonus/base/normal.jpg",
+					'bonus.base.specular'				: "textures/bonus/base/specular.jpg"
+				},
+				texturesCube: {
+					'skybox.dawnclouds'					: "textures/skybox/dawnclouds/%1.jpg"
+				},
+				geometries: {
+					'bonus.base'						: "geometries/bonus/base/base.js",
+					'booster'							: "geometries/booster/booster.js",
+					'ship.feisar'						: "geometries/ships/feisar/feisar.js",
+					'track.cityscape'					: "geometries/tracks/cityscape/track.js",
+					'track.cityscape.scrapers1'			: "geometries/tracks/cityscape/scrapers1.js",
+					'track.cityscape.scrapers2'			: "geometries/tracks/cityscape/scrapers2.js",
+					'track.cityscape.start'				: "geometries/tracks/cityscape/start.js",
+					'track.cityscape.start.banner'		: "geometries/tracks/cityscape/startbanner.js",
+					'track.cityscape.bonus.speed'		: "geometries/tracks/cityscape/bonus/speed.js"
+				},
+				analysers: {
+					'track.cityscape.collision'			: "textures/tracks/cityscape/collision.png",
+					'track.cityscape.height'			: "textures/tracks/cityscape/height.png"
+				},
+				images: {
+					'hud.bg'							: "textures/hud/hud-bg.png",
+					'hud.speed'							: "textures/hud/hud-fg-speed.png",
+					'hud.shield'						: "textures/hud/hud-fg-shield.png"
+				}
+			});
+		}
+	},
+
+	buildMaterials: function(quality)
+	{
+		if(this.quality < 1) // LOW
+		{
+			this.materials.track = new THREE.MeshBasicMaterial({
+				map: this.lib.get("textures", "track.cityscape.diffuse"),
+				ambient: 0xcccccc
+			});
+
+			this.materials.bonusBase = new THREE.MeshBasicMaterial({
+				map: this.lib.get("textures", "bonus.base.diffuse"),
+				ambient: 0xcccccc
+			});
+
+			this.materials.bonusSpeed = new THREE.MeshBasicMaterial({
+				color: 0x0096ff
+			});
+
+			this.materials.ship = new THREE.MeshBasicMaterial({
+				map: this.lib.get("textures", "ship.feisar.diffuse"),
+				ambient: 0xaaaaaa
+			});
+
+			this.materials.booster = new THREE.MeshBasicMaterial({
+				map: this.lib.get("textures", "booster.diffuse"), 
+				transparent: true
+			});
+
+			this.materials.scrapers1 = new THREE.MeshBasicMaterial({
+				map: this.lib.get("textures", "track.cityscape.scrapers1.diffuse"),
+				ambient: 0xcccccc
+			});
+
+			this.materials.scrapers2 = new THREE.MeshBasicMaterial({
+				map: this.lib.get("textures", "track.cityscape.scrapers2.diffuse"),
+				ambient: 0xcccccc
+			});
+
+			this.materials.start = new THREE.MeshBasicMaterial({
+				map: this.lib.get("textures", "track.cityscape.start.diffuse"),
+				ambient: 0xcccccc	
+			});
+
+			this.materials.startBanner = new THREE.MeshBasicMaterial({
+				map: this.lib.get("textures", "track.cityscape.start.banner"), 
+				transparent: false
+			});
+		}
+		else // HIGH
+		{
+			this.materials.track = bkcore.Utils.createNormalMaterial({
+				diffuse: this.lib.get("textures", "track.cityscape.diffuse"),
+				specular: this.lib.get("textures", "track.cityscape.specular"),
+				normal: this.lib.get("textures", "track.cityscape.normal"),
+				ambient: 0xffffff,
+				shininess: 42,
+				metal: true,
+				perPixel: true
+			});
+
+			this.materials.bonusBase = bkcore.Utils.createNormalMaterial({
+				diffuse: this.lib.get("textures", "bonus.base.diffuse"),
+				specular: this.lib.get("textures", "bonus.base.specular"),
+				normal: this.lib.get("textures", "bonus.base.normal"),
+				normalScale: 3.0,
+				ambient: 0x444444,
+				shininess: 42,
+				metal: false,
+				perPixel: false
+			});
+
+			this.materials.bonusSpeed = new THREE.MeshBasicMaterial({
+				color: 0x0096ff
+			});
+
+			this.materials.ship = bkcore.Utils.createNormalMaterial({
+				diffuse: this.lib.get("textures", "ship.feisar.diffuse"),
+				specular: this.lib.get("textures", "ship.feisar.specular"),
+				normal: this.lib.get("textures", "ship.feisar.normal"),
+				ambient: 0x444444,
+				shininess: 42,
+				metal: true,
+				perPixel: false
+			});
+
+			this.materials.booster = new THREE.MeshBasicMaterial({
+				map: this.lib.get("textures", "booster.diffuse"), 
+				transparent: true
+			});
+
+			this.materials.scrapers1 = bkcore.Utils.createNormalMaterial({
+				diffuse: this.lib.get("textures", "track.cityscape.scrapers1.diffuse"),
+				specular: this.lib.get("textures", "track.cityscape.scrapers1.specular"),
+				normal: this.lib.get("textures", "track.cityscape.scrapers1.normal"),
+				cube: this.lib.get("texturesCube", "skybox.dawnclouds"),
+				reflectivity: 0.8,
+				ambient: 0x444444,
+				shininess: 42,
+				metal: false,
+				perPixel: false
+			});
+
+			this.materials.scrapers2 = bkcore.Utils.createNormalMaterial({
+				diffuse: this.lib.get("textures", "track.cityscape.scrapers2.diffuse"),
+				specular: this.lib.get("textures", "track.cityscape.scrapers2.specular"),
+				normal: this.lib.get("textures", "track.cityscape.scrapers2.normal"),
+				cube: this.lib.get("texturesCube", "skybox.dawnclouds"),
+				reflectivity: 0.8,
+				ambient: 0x000000,
+				shininess: 42,
+				metal: false,
+				perPixel: false
+			});
+
+			this.materials.start = bkcore.Utils.createNormalMaterial({
+				diffuse: this.lib.get("textures", "track.cityscape.start.diffuse"),
+				specular: this.lib.get("textures", "track.cityscape.start.specular"),
+				normal: this.lib.get("textures", "track.cityscape.start.normal"),
+				ambient: 0xaaaaaa,
+				shininess: 42,
+				metal: false,
+				perPixel: false
+			});
+
+			this.materials.startBanner = new THREE.MeshBasicMaterial({
+				map: this.lib.get("textures", "track.cityscape.start.banner"), 
+				transparent: false
+			});
+		}
+	},
+
+	buildScenes: function(ctx, quality)
+	{
+		// IMPORTANT
+		this.analyser = this.lib.get("analysers", "track.cityscape.collision");
+
+		// SKYBOX
+		var sceneCube = new THREE.Scene();
+
+		var cameraCube = new THREE.PerspectiveCamera( 70, ctx.width / ctx.height, 1, 6000 );
+		sceneCube.add( cameraCube );
+
+		var skyshader = THREE.ShaderUtils.lib[ "cube" ];
+		skyshader.uniforms[ "tCube" ].texture = this.lib.get("texturesCube", "skybox.dawnclouds");
+
+		var skymaterial = new THREE.ShaderMaterial(
+		{
+			fragmentShader: skyshader.fragmentShader,
+			vertexShader: skyshader.vertexShader,
+			uniforms: skyshader.uniforms,
+			depthWrite: false
+		});
+
+		var mesh = new THREE.Mesh( new THREE.CubeGeometry( 100, 100, 100 ), skymaterial );
+		mesh.flipSided = true;
+
+		sceneCube.add(mesh);
+
+		ctx.manager.add("sky", sceneCube, cameraCube);
+
+		var ambient = 0xbbbbbb, diffuse = 0xffffff, specular = 0xffffff, shininess = 42, scale = 23;
+
+		// MAIN SCENE		
+		var camera = new THREE.PerspectiveCamera( 70, ctx.width / ctx.height, 1, 60000 );
+		
+		var scene = new THREE.Scene();
+		scene.add( camera );
+		scene.add( new THREE.AmbientLight( ambient ) );
+
+		// SUN
+		var sun = new THREE.DirectionalLight( diffuse, 1.5, 30000 );
+		sun.position.set( -4000, 1200, 1800 );
+		sun.lookAt(new THREE.Vector3());
+
+		if(quality > 0)
+		{
+			sun.castShadow = true;
+			sun.shadowCameraNear = 50;
+			sun.shadowCameraFar = camera.far*2;
+			sun.shadowCameraRight     =  3000;
+			sun.shadowCameraLeft      = -3000;
+			sun.shadowCameraTop       =  3000;
+			sun.shadowCameraBottom    = -3000;
+			//sun.shadowCameraVisible = true;
+			sun.shadowBias = 0.0001;
+			sun.shadowDarkness = 0.7;
+			sun.shadowMapWidth = 2048;
+			sun.shadowMapHeight = 2048;
+		}
+		scene.add( sun );
+
+		// SHIP
+		var ship = ctx.createMesh(scene, this.lib.get("geometries", "ship.feisar"), -1134*2, 10, -443*2, this.materials.ship);
+		
+		var booster = ctx.createMesh(ship, this.lib.get("geometries", "booster"), 0, 0.665, -3.8, this.materials.booster);
+		booster.depthWrite = false;
+
+		var boosterSprite = new THREE.Sprite({ 
+			map: this.lib.get("textures", "booster.sprite"), 
+			blending: THREE.AdditiveBlending,  
+			useScreenCoordinates: false, 
+			color: 0xffffff 
+		});
+		boosterSprite.scale.set(0.02, 0.02, 0.02);
+		boosterSprite.mergeWith3D = false;
+		booster.add(boosterSprite);
+
+		var boosterLight = new THREE.PointLight(0x00a2ff, 4.0, 60);
+		boosterLight.position.set(0, 0.665, -4);
+		if(quality > 0)
+			ship.add(boosterLight);
+
+		// SHIP CONTROLS
+		var shipControls = new bkcore.hexgl.ShipControls(ctx.document);
+		shipControls.collisionMap = this.lib.get("analysers", "track.cityscape.collision");
+		shipControls.collisionPixelRatio = 2048.0 / 6000.0;
+		shipControls.collisionDetection = true;
+		shipControls.heightMap = this.lib.get("analysers", "track.cityscape.height");;
+		shipControls.heightPixelRatio = 2048.0 / 6000.0;
+		shipControls.heightBias = 4.0;
+		shipControls.heightScale = 10.0;
+		shipControls.control(ship);
+		ctx.components.shipControls = shipControls;
+		ctx.tweakShipControls();
+
+		// SHIP EFFECTS AND PARTICLES
+		var fxParams = {
+			scene: scene,
+			shipControls: shipControls,
+			booster: booster,
+			boosterSprite: boosterSprite,
+			boosterLight: boosterLight,
+			useParticles: false
+		};
+		if(quality > 0)
+		{
+			fxParams.textureCloud = this.lib.get("textures", "cloud");
+			fxParams.textureSpark = this.lib.get("textures", "spark");
+			fxParams.useParticles = true;
+		}
+		ctx.components.shipEffects = new bkcore.hexgl.ShipEffects(fxParams);
+
+		// TRACK
+		var track = ctx.createMesh(scene, this.lib.get("geometries", "track.cityscape"), 0, -5, 0, this.materials.track);
+		var bonusBase = ctx.createMesh(scene, this.lib.get("geometries", "bonus.base"), 0, -5, 0, this.materials.bonusBase);
+		var bonusSpeed = ctx.createMesh(scene, this.lib.get("geometries", "track.cityscape.bonus.speed"), 0, -5, 0, this.materials.bonusSpeed);
+		bonusSpeed.receiveShadow = false;
+		var scrapers1 = ctx.createMesh(scene, this.lib.get("geometries", "track.cityscape.scrapers1"), 0, 0, 0, this.materials.scrapers1);
+		var scrapers2 = ctx.createMesh(scene, this.lib.get("geometries", "track.cityscape.scrapers2"), 0, 0, 0, this.materials.scrapers2);
+		var start = ctx.createMesh(scene, this.lib.get("geometries", "track.cityscape.start"), 0, -5, 0, this.materials.start);
+		var startbanner = ctx.createMesh(scene, this.lib.get("geometries", "track.cityscape.start.banner"), 0, -5, 0, this.materials.startBanner);
+		startbanner.doubleSided = true;
+
+		// CAMERA
+		ctx.components.cameraChase = new bkcore.hexgl.CameraChase({
+			target: ship,
+			camera: camera,
+			cameraCube: ctx.manager.get("sky").camera,
+			lerp: 0.5,
+			yoffset: 8.0,
+			zoffset: 10.0,
+			viewOffset: 10.0
+		});
+
+		ctx.manager.add("game", scene, camera, function(delta, renderer)
+		{
+			if(delta > 25 && this.objects.lowFPS < 1000) this.objects.lowFPS++;
+
+			var dt = delta/16.6;
+
+			this.objects.components.shipControls.update(dt);
+			
+			this.objects.components.shipEffects.update(dt);
+
+			this.objects.components.cameraChase.update(dt, this.objects.components.shipControls.getSpeedRatio());
+			/*this.objects.time += 0.002;
+			var c = this.objects.components.cameraChase.camera;
+			c.position.set(
+				Math.cos(this.objects.time)*15+this.objects.components.shipControls.dummy.position.x,
+				10+this.objects.components.shipControls.dummy.position.y,
+				Math.sin(this.objects.time)*15+this.objects.components.shipControls.dummy.position.z
+			);
+			c.lookAt(this.objects.components.shipControls.dummy.position);
+			this.objects.components.cameraChase.cameraCube.rotation.copy(c.rotation);*/
+
+			this.objects.composers.game.render(dt);
+			this.objects.hud.update(
+				this.objects.components.shipControls.getRealSpeed(100), 
+				this.objects.components.shipControls.getRealSpeedRatio(), 
+				this.objects.components.shipControls.getShield(100), 
+				this.objects.components.shipControls.getShieldRatio()
+			);
+			if(this.objects.components.shipControls.getShieldRatio() < 0.2)
+				this.objects.extras.vignetteColor.setHex(0x992020);
+			else
+				this.objects.extras.vignetteColor.setHex(0x458ab1);
+		},
+		{
+			components: ctx.components,
+			composers: ctx.composers,
+			extras: ctx.extras,
+			quality: quality,
+			hud: ctx.hud,
+			time: 0.0,
+			lowFPS: 0
+		});
+	}
+}

bkcore/threejs/Loader.js

@@ -0,0 +1,231 @@
+/*!
+ * @class bkcore.threejs.Loader
+ *
+ * Loads multiple recources, get progress, callback friendly.
+ * Supports textures, texturesCube, geometries, analysers, images.
+ * 
+ * @author Thibaut 'BKcore' Despoulain <http://bkcore.com>
+ */
+
+/*!
+ * @package bkcore.threejs
+ */
+var bkcore = bkcore || {};
+bkcore.threejs = bkcore.threejs || {};
+
+bkcore.NONE = undefined;
+
+/**
+ * Creates a new loader
+ * @param {Object{onLoad, onError, onProgress}} opts Callbacks
+ */
+bkcore.threejs.Loader = function(opts)
+{
+	var self = this;
+
+	this.jsonLoader = new THREE.JSONLoader();
+
+	this.errorCallback = opts.onError == undefined ? function(s){ console.warn("Error while loading %s.".replace("%s", s)) } : opts.onError;
+	this.loadCallback = opts.onLoad == undefined ? function(){ console.log("Loaded.") } : opts.onLoad;
+	this.progressCallback = opts.onProgress == undefined ? function(progress, type, name){ /**/ } : opts.onProgress;
+
+	this.types = {
+		textures: null,
+		texturesCube: null,
+		geometries: null,
+		analysers: null,
+		images: null,
+		sounds: null
+	};
+
+	this.states = {};
+	this.data = {};
+
+	for(var t in this.types)
+	{
+		this.data[t] = {};
+		this.states[t] = {};
+	}
+
+	this.progress = {
+		total: 0,
+		remaining: 0,
+		loaded: 0,
+		finished: false
+	};
+}
+
+/**
+ * Load the given list of resources
+ * @param  {textures, texturesCube, geometries, analysers, images} data 
+ */
+bkcore.threejs.Loader.prototype.load = function(data)
+{
+	var self = this;
+
+	for(var k in this.types)
+	{
+		if(k in data)
+		{
+			var size = 0;
+			for(var j in data[k])
+				size++;
+			this.progress.total += size;
+			this.progress.remaining += size;
+		}
+	}
+
+	for(var t in data.textures)
+		this.loadTexture(t, data.textures[t]);
+
+	for(var c in data.texturesCube)
+		this.loadTextureCube(c, data.texturesCube[c]);
+
+	for(var g in data.geometries)
+		this.loadGeometry(g, data.geometries[g]);
+
+	for(var a in data.analysers)
+		this.loadAnalyser(a, data.analysers[a]);
+
+	for(var i in data.images)
+		this.loadImage(i, data.images[i]);
+
+	this.progressCallback.call(this, this.progress);
+}
+
+bkcore.threejs.Loader.prototype.updateState = function(type, name, state)
+{
+	if(!(type in this.types))
+	{
+		console.warn("Unkown loader type.");
+		return;
+	}
+
+	if(state == true)
+	{
+		this.progress.remaining--;
+		this.progress.loaded++;
+		this.progressCallback.call(this, this.progress, type, name);
+	}
+
+	this.states[type][name] = state;
+
+
+	if(this.progress.loaded == this.progress.total)
+	{
+		this.loadCallback.call(this);
+	}
+}
+
+/**
+ * Get loaded resource
+ * @param  string type [textures, texturesCube, geometries, analysers, images]
+ * @param  string name 
+ * @return Mixed
+ */
+bkcore.threejs.Loader.prototype.get = function(type, name)
+{
+	if(!(type in this.types))
+	{
+		console.warn("Unkown loader type.");
+		return null;
+	}
+	if(!(name in this.data[type]))
+	{
+		console.warn("Unkown file.");
+		return null;
+	}
+
+	return this.data[type][name];
+}
+
+bkcore.threejs.Loader.prototype.loaded = function(type, name)
+{
+	if(!(type in this.types))
+	{
+		console.warn("Unkown loader type.");
+		return null;
+	}
+	if(!(name in this.states[type]))
+	{
+		console.warn("Unkown file.");
+		return null;
+	}
+
+	return this.states[type][name];
+}
+
+bkcore.threejs.Loader.prototype.loadTexture = function(name, url)
+{
+	var self = this;
+	this.updateState("textures", name, false);
+	this.data.textures[name] = THREE.ImageUtils.loadTexture(
+		url, 
+		bkcore.NONE, 
+		function(){ 
+			self.updateState("textures", name, true); 
+		}, 
+		function(){ 
+			self.errorCallback.call(self, name); 
+		}
+	);
+}
+
+bkcore.threejs.Loader.prototype.loadTextureCube = function(name, url)
+{
+	var self = this;
+
+	var urls = [
+		url.replace("%1", "px"), url.replace("%1", "nx"),
+		url.replace("%1", "py"), url.replace("%1", "ny"),
+		url.replace("%1", "pz"), url.replace("%1", "nz")
+	];
+
+	this.updateState("texturesCube", name, false);
+	this.data.texturesCube[name] = THREE.ImageUtils.loadTextureCube( 
+		urls, 
+		new THREE.CubeRefractionMapping(), 
+		function(){ 
+			self.updateState("texturesCube", name, true); 
+		} 
+	);
+}
+
+bkcore.threejs.Loader.prototype.loadGeometry = function(name, url)
+{
+	var self = this;
+	this.data.geometries[name] = null;
+	this.updateState("geometries", name, false);
+	this.jsonLoader.load(
+		url, 
+		function(a){ 
+			self.data.geometries[name] = a;
+			self.updateState("geometries", name, true); 
+		}
+	);
+}
+
+bkcore.threejs.Loader.prototype.loadAnalyser = function(name, url)
+{
+	var self = this;
+	this.updateState("analysers", name, false);
+	this.data.analysers[name] = new bkcore.ImageData(
+		url, 
+		function(){ 
+			self.updateState("analysers", name, true);
+		}
+	);
+}
+
+bkcore.threejs.Loader.prototype.loadImage = function(name, url)
+{
+	var self = this;
+	this.updateState("images", name, false);
+	var e = new Image();
+	e.onload = function() { 
+		self.updateState("images", name, true) ;
+	};
+	e.crossOrigin = "anonymous";
+	e.src = url;
+	this.data.images[name] = e;
+}

bkcore/threejs/Particles.js

@@ -0,0 +1,191 @@
+/*!
+ * @class bkcore.threejs.Particles
+ *
+ * Particle system wrapper/helper
+ * 
+ * @author Thibaut 'BKcore' Despoulain <http://bkcore.com>
+ */
+
+/*!
+ * @package bkcore.threejs
+ */ 
+var bkcore = bkcore || {};
+bkcore.threejs = bkcore.threejs || {};
+
+/**
+ * Creates a new particle system using given parameters
+ * @param {Object{max, spawnRate, spawn, velocity, randomness, force, spawnRadius, life, friction, color, color2, tint, texture, size, blending, depthTest, transparent, opacity}} opts 
+ */
+bkcore.threejs.Particles = function(opts)
+{
+	this.black = new THREE.Color(0x000000);
+	this.white = new THREE.Color(0xffffff);
+
+	this.material = new THREE.ParticleBasicMaterial({
+		color: opts.tint == undefined ? 0xffffff : opts.tint,
+		map: opts.texture == undefined ? null : opts.texture,
+		size: opts.size == undefined ? 4 : opts.size,
+		blending: opts.blending == undefined ? THREE.AdditiveBlending : opts.blending,
+		depthTest: opts.depthTest == undefined ? false : opts.depthTest,
+		transparent: opts.transparent == undefined ? true : opts.transparent,
+		vertexColors: true,
+		opacity: opts.opacity == undefined ? 1.0 : opts.opacity,
+		sizeAttenuation: true
+	});
+
+	this.max = opts.max == undefined ? 1000 : opts.max;
+	this.spawnRate = opts.spawnRate == undefined ? 0 : opts.spawnRate;
+
+	this.spawn = opts.spawn == undefined ? new THREE.Vector3() : opts.spawn;
+	this.velocity = opts.velocity == undefined ? new THREE.Vector3() : opts.velocity;
+	this.randomness = opts.randomness == undefined ? new THREE.Vector3() : opts.randomness;
+	this.force = opts.force == undefined ? new THREE.Vector3() : opts.force;
+	this.spawnRadius = opts.spawnRadius == undefined ? new THREE.Vector3() : opts.spawnRadius;
+	this.life = opts.life == undefined ? 60 : opts.life;
+	this.ageing = 1 / this.life;
+	this.friction = opts.friction == undefined ? 1.0 : opts.friction;
+	this.color = new THREE.Color(opts.color == undefined ? 0xffffff : opts.color);
+	this.color2 = opts.color2 == undefined ? null : new THREE.Color(opts.color2);
+
+	this.position = opts.position == undefined ? new THREE.Vector3() : opts.position;
+	this.rotation = opts.rotation == undefined ? new THREE.Vector3() : opts.rotation;
+	this.sort = opts.sort == undefined ? false : opts.sort;
+
+	this.pool = [];
+	this.buffer = [];
+	this.geometry = null;
+	this.system = null;
+
+	this.build();
+}
+
+bkcore.threejs.Particles.prototype.build = function()
+{
+	this.geometry = new THREE.Geometry();
+	this.geometry.dynamic = true;
+
+	this.pool = [];
+	this.buffer = [];
+
+	for(var i = 0; i < this.max; ++i)
+	{
+		var p = new bkcore.threejs.Particle();
+		this.pool.push(p);
+		this.buffer.push(p);
+		this.geometry.vertices.push(p.position);
+		this.geometry.colors.push(p.color);
+	}
+
+	this.system = new THREE.ParticleSystem(this.geometry, this.material);
+	this.system.position = this.position;
+	this.system.rotation = this.rotation;
+	this.system.sort = this.sort;
+}
+
+/**
+ * Emits given number of particles
+ * @param  int count
+ */
+bkcore.threejs.Particles.prototype.emit = function(count)
+{
+	var emitable = Math.min(count, this.pool.length);
+	for(var i = 0; i < emitable; ++i)
+	{
+		var p = this.pool.pop();
+		p.available = false;
+		p.position.copy(this.spawn)
+			.addSelf(
+				this.randomVector()
+				.multiplySelf(this.spawnRadius)
+			);
+		p.velocity.copy(this.velocity)
+			.addSelf(
+				this.randomVector()
+				.multiplySelf(this.randomness)
+			);
+		p.force.copy(this.force);
+		p.basecolor.copy(this.color);
+		if(this.color2 != undefined) p.basecolor.lerpSelf(this.color2, Math.random());
+		p.life = 1.0;
+	}
+}
+
+bkcore.threejs.Particles.prototype.randomVector = function()
+{
+	return new THREE.Vector3(
+			Math.random()*2-1,
+			Math.random()*2-1,
+			Math.random()*2-1
+		);
+}
+
+/**
+ * Updates particles (should be call in a RAF loop)
+ * @param  float dt time delta ~1.0
+ */
+bkcore.threejs.Particles.prototype.update = function(dt)
+{
+	var p, l;
+	var df = new THREE.Vector3();
+	var dv = new THREE.Vector3();
+	for(var i = 0; i < this.buffer.length; ++i)
+	{
+
+		p = this.buffer[i];
+
+		if(p.available) continue;
+
+		p.life -= this.ageing;
+
+		if(p.life <= 0 && !p.available)
+		{
+			p.reset();
+			this.pool.push(p);
+			continue;
+		}
+
+		l = p.life > 0.5 ? 1.0 : p.life + 0.5;
+		p.color.setRGB(
+			l * p.basecolor.r, 
+			l * p.basecolor.g, 
+			l * p.basecolor.b
+		);
+
+		if(this.friction != 1.0)
+			p.velocity.multiplyScalar(this.friction);
+
+		df.copy(p.force).multiplyScalar(dt);
+		p.velocity.addSelf(df);
+
+		dv.copy(p.velocity).multiplyScalar(dt);
+		p.position.addSelf(dv);
+	}
+
+	if(this.spawnRate > 0)
+		this.emit(this.spawnRate);
+
+	this.geometry.verticesNeedUpdate = true;
+	this.geometry.colorsNeedUpdate = true;
+}
+
+bkcore.threejs.Particle = function()
+{
+	this.position = new THREE.Vector3(-10000,-10000,-10000);
+	this.velocity = new THREE.Vector3();
+	this.force = new THREE.Vector3();
+	this.color = new THREE.Color(0x000000);
+	this.basecolor = new THREE.Color(0x000000);
+	this.life = 0.0;
+	this.available = true;
+}
+
+bkcore.threejs.Particle.prototype.reset = function()
+{
+	this.position.set(0,-100000,0);
+	this.velocity.set(0,0,0);
+	this.force.set(0,0,0);
+	this.color.setRGB(0,0,0);
+	this.basecolor.setRGB(0,0,0);
+	this.life = 0.0;
+	this.available = true;
+}

bkcore/threejs/Preloader.js

@@ -0,0 +1,151 @@
+/*!
+ * @class bkcore.threejs.Preloader
+ *
+ * Displays a small 3D preloader scene
+ * 
+ * @author Thibaut 'BKcore' Despoulain <http://bkcore.com>
+ */
+
+/*!
+ * @package bkcore.threejs
+ */
+var bkcore = bkcore || {};
+bkcore.threejs = bkcore.threejs || {};
+
+/**
+ * Creates a new preloader scene.
+ * You have to update Preloader.ratio with the % loaded info (float 0.0-1.0) 
+ * @param {Object{width, height, scale, line}} opts
+ */
+bkcore.threejs.Preloader = function(opts)
+{
+	this.document = opts.document || document;
+
+	this.end = false;
+
+	this.time = 0.0;
+	this.y = 0.3;
+	this.ratio = 0.0;
+
+	this.height = opts.height;
+	this.width = opts.width;
+
+	this.scale = opts.scale == undefined ? 10 : opts.scale
+	this.line = opts.line == undefined ? 3 : opts.line;
+
+	this.container = opts.container;
+
+	this.renderer = new THREE.CanvasRenderer({
+		clearColor: 0xffffff
+	});
+	this.renderer.setSize( opts.width, opts.height );
+
+	this.container.appendChild( this.renderer.domElement );
+
+	this.ctx = this.renderer.domElement.getContext('2d');
+	this.ctx.textAlign = "center";
+
+	this.scene = new THREE.Scene();
+
+	this.camera = new THREE.PerspectiveCamera( 70, opts.width / opts.height, 1, 1000 );
+	this.camera.position.z = 100;
+	this.scene.add( this.camera );
+
+	this.stage = new THREE.Object3D();
+	this.stage.position.set(0,10,0);
+	this.scene.add(this.stage);
+
+	this.cube = new THREE.Mesh( new THREE.CubeGeometry( this.scale, this.scale, this.scale, 1, 1, 1 ), 
+		new THREE.MeshBasicMaterial( { color: 0x999999 } ) );
+	
+	this.cube.scale.set(0.0,0.0,0.0);
+	this.stage.add(this.cube);
+
+	this.cubew = new THREE.Mesh( new THREE.CubeGeometry( this.scale, this.scale, this.scale, 1, 1, 1 ), 
+		new THREE.MeshBasicMaterial( { 
+			wireframe: true, 
+			wireframeLinewidth: this.line, 
+			//wireframeLinecap: 'square',
+			//wireframeLinejoin: 'square',
+			color: 0xffffff
+		} ) );
+	this.cube.add(this.cubew);
+
+	this.outercube = new THREE.Mesh( new THREE.CubeGeometry( this.scale, this.scale, this.scale, 1, 1, 1 ), 
+		new THREE.MeshBasicMaterial( { 
+			wireframe: true, 
+			wireframeLinewidth: this.line, 
+			//wireframeLinecap: 'square',
+			//wireframeLinejoin: 'square',
+			color: 0x0093d8 
+		} ) );
+	this.stage.add(this.outercube);
+
+	var self = this;
+
+	function raf()
+	{
+		if(!self.end) 
+		{
+			requestAnimationFrame( raf );
+			self.render();
+		}
+	}
+	raf();
+
+	function mm(e){
+		self.mouseMove.call(self, e);
+	}
+
+	this.mmsave = mm;
+
+	this.document.addEventListener( 'mousemove', mm, false );
+}
+
+/**
+ * Render method to be called from a RAF loop
+ */
+bkcore.threejs.Preloader.prototype.render = function()
+{
+	this.time += 0.02;
+
+	this.ctx.clearRect(0 , 0 , this.width , this.height);
+
+	var s = (this.ratio - this.cube.scale.x) * 0.3;
+
+	this.cube.scale.addScalar(s);
+	this.cube.rotation.y = this.time;
+	this.outercube.rotation.y = this.time;
+
+	this.stage.rotation.x += (this.y - this.stage.rotation.x)*0.3;
+
+	this.renderer.render( this.scene, this.camera );
+
+	this.ctx.save();
+	this.ctx.font = "40px Arial";
+    this.ctx.fillStyle = "rgb(200, 200, 200)";
+    this.ctx.fillText(Math.round(this.ratio*100), this.width/2, this.height/2+30);
+    this.ctx.restore();
+}
+
+bkcore.threejs.Preloader.prototype.mouseMove = function(event) 
+{
+	var h2 = this.height/2;
+	this.y = -(event.clientY - h2)/h2+0.3;
+}
+
+/**
+ * Deletes the Preloader
+ */
+bkcore.threejs.Preloader.prototype.remove = function()
+{
+	this.document.removeEventListener( 'mousemove', this.mm, false );
+	this.end = true;
+	this.renderer = null;
+	this.scene = null;
+	this.stage = null;
+	this.cube = null;
+	this.cubew = null;
+	this.innercube = null;
+	this.container.innerHTML = "";
+}

bkcore/threejs/RenderManager.js

@@ -0,0 +1,132 @@
+/*!
+ * bkcore.threejs.RenderManager helps handling multiple scenes, cameras and render loops.
+ * 
+ * @author Thibaut 'BKcore' Despoulain <http://bkcore.com>
+ * @license MIT
+ * 
+ * Initialize the a RenderManager by passing a Renderer object:
+ * 		var renderManager = new bkcore.threejs.RenderManager(new THREE.WebGLRenderer());
+ * 
+ * A render setup structure :
+ * 		{
+ * 			id 		<String>		: render setup ID,
+ * 			scene 	<THREE.Scene>	: main scene, 
+ * 			camera 	<THREE.Camera>	: main camera, 
+ * 			render 	<Function>		: render loop called when render setup is active (current), 
+ * 			objects <Dic>			: object references accessible in the render loop via this.objects
+ * 		}
+ * 	
+ * The render method's context will be the render setup's object, so in your render loop:
+ * 		function(delta, renderer)
+ * 		{
+ * 			this.scene;
+ * 			this.camera;
+ * 			this.id;
+ * 			this.objects;
+ * 			renderer.render(...);
+ * 		}
+ * 		
+ * Use the "objects" attribute to store useful references and variables like time, geometries, materials, etc.
+ * Example:
+ * 		renderManager.add('mySetup', scene, camera, function(delta, renderer)
+ *		{
+ *			this.objects.timer += delta;
+ *			this.objects.torus.rotation.z = Math.PI * Math.cos(this.objects.timer);
+ *			renderer.render(this.scene, this.camera);
+ *		},
+ *		{
+ *			timer: 0,
+ *			torus: torusMesh
+ *		});
+ */
+
+var bkcore = bkcore || {};
+bkcore.threejs = bkcore.threejs || {};
+
+(function(w){
+	var perfNow;
+	var perfNowNames = ['now', 'webkitNow', 'msNow', 'mozNow'];
+	if(!!w['performance']) for(var i = 0; i < perfNowNames.length; ++i)
+	{
+		var n = perfNowNames[i];
+		if(!!w['performance'][n])
+		{
+			perfNow = function(){return w['performance'][n]()};
+			break;
+		}
+	}
+	if(!perfNow)
+	{
+		perfNow = Date.now;
+	}
+	w.perfNow = perfNow;
+})(window);
+
+bkcore.threejs.RenderManager = function(renderer)
+{
+	this.renderer = renderer;
+	this.time = window.perfNow();
+
+	this.renders = {};
+	this.current = {};
+	this.size = 0;
+
+	this.defaultRenderMethod = function(delta, renderer)
+	{
+		renderer.render(this.scene, this.camera);
+	};
+};
+
+bkcore.threejs.RenderManager.prototype.add = function(id, scene, camera, render, objects)
+{
+	render = render || this.defaultRenderMethod;
+	objects = objects || {};
+
+	this.renders[id] = {
+		id: id,
+		scene: scene, 
+		camera: camera, 
+		render: render, 
+		objects: objects
+	};
+
+	if(this.size == 0) this.current = this.renders[id];
+
+	this.size++;
+};
+
+bkcore.threejs.RenderManager.prototype.get = function(id)
+{
+	return this.renders[id];
+};
+
+bkcore.threejs.RenderManager.prototype.remove = function(id)
+{
+	if(id in this.renders)
+	{
+		delete this.renders[id];
+		this.size--;
+	}
+};
+
+bkcore.threejs.RenderManager.prototype.renderCurrent = function()
+{
+	if(this.current && this.current.render)
+	{
+		var now = window.perfNow();
+		var delta = now - this.time;
+		this.time = now;
+
+		this.current.render.call(this.current, delta, this.renderer);
+	}
+	else console.warn('RenderManager: No current render defined.');
+};
+
+bkcore.threejs.RenderManager.prototype.setCurrent = function(id)
+{
+	if(id in this.renders)
+	{
+		this.current = this.renders[id];
+	}
+	else console.warn('RenderManager: Render "'+id+'" not found.');
+};

bkcore/threejs/Shaders.js

@@ -0,0 +1,950 @@
+/**
+ * @author Thibaut Despoulain / http://bkcore.com
+ * @author alteredq / http://alteredqualia.com/
+ * @author mr.doob / http://mrdoob.com/
+ */
+var bkcore = bkcore || {};
+bkcore.threejs = bkcore.threejs || {};
+
+bkcore.threejs.Shaders = 
+{
+	'additive' : {
+		uniforms: {
+			tDiffuse: { type: "t", value: 0, texture: null },
+			tAdd: { type: "t", value: 1, texture: null },
+			fCoeff: { type: "f", value: 1.0 }
+		},
+
+		vertexShader: [
+			"varying vec2 vUv;",
+
+			"void main() {",
+
+				"vUv = uv;",
+				"gl_Position = projectionMatrix * modelViewMatrix * vec4( position, 1.0 );",
+
+			"}"
+		].join("\n"),
+
+		fragmentShader: [
+			"uniform sampler2D tDiffuse;",
+			"uniform sampler2D tAdd;",
+			"uniform float fCoeff;",
+
+			"varying vec2 vUv;",
+
+			"void main() {",
+
+				"vec4 texel = texture2D( tDiffuse, vUv );",
+				"vec4 add = texture2D( tAdd, vUv );",
+				"gl_FragColor = texel + add * fCoeff * add.a;",
+
+			"}"
+		].join("\n")
+	},
+
+	/* ------------------------------------------------------------------------------------------------
+	//	Hexagonal Vignette shader
+	//  by BKcore.com
+	 ------------------------------------------------------------------------------------------------ */
+
+	'hexvignette': {
+
+		uniforms: {
+
+			tDiffuse: { type: "t", value: 0, texture: null },
+			tHex: {type: "t", value: 1, texture: null},
+			size: {type: "f", value: 512.0},
+			rx: {type: "f", value: 1024.0},
+			ry: {type: "f", value: 768.0},
+			color: {type: "c", value: new THREE.Color(0x458ab1)}
+
+		},
+
+		vertexShader: [
+
+			"varying vec2 vUv;",
+
+			"void main() {",
+
+				"vUv = uv;",
+				"gl_Position = projectionMatrix * modelViewMatrix * vec4( position, 1.0 );",
+
+			"}"
+
+		].join("\n"),
+
+		fragmentShader: [
+
+			"uniform float size;",
+			"uniform float rx;",
+			"uniform float ry;",
+
+			"uniform vec3 color;",
+
+			"uniform sampler2D tDiffuse;",
+			"uniform sampler2D tHex;",
+
+			"varying vec2 vUv;",
+
+			"void main() {",
+
+				"vec4 vcolor = vec4(color,1.0);",
+
+				"vec2 hexuv;",
+				"hexuv.x = mod(vUv.x * rx, size) / size;",
+				"hexuv.y = mod(vUv.y * ry, size) / size;",
+				"vec4 hex = texture2D( tHex, hexuv );",
+
+				"float tolerance = 0.2;",
+       			"float vignette_size = 0.6;",
+        		"vec2 powers = pow(abs(vec2(vUv.x - 0.5,vUv.y - 0.5)),vec2(2.0));",
+        		"float radiusSqrd = vignette_size*vignette_size;",
+        		"float gradient = smoothstep(radiusSqrd-tolerance, radiusSqrd+tolerance, powers.x+powers.y);",
+
+				"vec2 uv = ( vUv - vec2( 0.5 ) );",
+
+				"vec2 sample = uv * gradient * 0.5 * (1.0-hex.r);",
+
+				"vec4 texel = texture2D( tDiffuse, vUv-sample );",
+				"gl_FragColor = (((1.0-hex.r)*vcolor) * 0.5 * gradient) + vec4( mix( texel.rgb, vcolor.xyz*0.7, dot( uv, uv ) ), texel.a );",
+
+			"}"
+
+		].join("\n")
+
+	},
+
+	/* -------------------------------------------------------------------------
+	//	Normal map shader (perpixel)
+	//		- Blinn-Phong
+	//		- normal + diffuse + specular + AO + displacement + reflection + shadow maps
+	//		- PER-PIXEL point and directional lights (use with "lights: true" material option)
+	//		- modified by BKcore
+	 ------------------------------------------------------------------------- */
+
+	'normal' : {
+
+		uniforms: THREE.UniformsUtils.merge( [
+
+			THREE.UniformsLib[ "fog" ],
+			THREE.UniformsLib[ "lights" ],
+			THREE.UniformsLib[ "shadowmap" ],
+
+			{
+
+			"enableAO"		  : { type: "i", value: 0 },
+			"enableDiffuse"	  : { type: "i", value: 0 },
+			"enableSpecular"  : { type: "i", value: 0 },
+			"enableReflection": { type: "i", value: 0 },
+
+			"tDiffuse"	   : { type: "t", value: 0, texture: null },
+			"tCube"		   : { type: "t", value: 1, texture: null },
+			"tNormal"	   : { type: "t", value: 2, texture: null },
+			"tSpecular"	   : { type: "t", value: 3, texture: null },
+			"tAO"		   : { type: "t", value: 4, texture: null },
+			"tDisplacement": { type: "t", value: 5, texture: null },
+
+			"uNormalScale": { type: "f", value: 1.0 },
+
+			"uDisplacementBias": { type: "f", value: 0.0 },
+			"uDisplacementScale": { type: "f", value: 1.0 },
+
+			"uDiffuseColor": { type: "c", value: new THREE.Color( 0xffffff ) },
+			"uSpecularColor": { type: "c", value: new THREE.Color( 0x111111 ) },
+			"uAmbientColor": { type: "c", value: new THREE.Color( 0xffffff ) },
+			"uShininess": { type: "f", value: 30 },
+			"uOpacity": { type: "f", value: 1 },
+
+			"uReflectivity": { type: "f", value: 0.5 },
+
+			"uOffset" : { type: "v2", value: new THREE.Vector2( 0, 0 ) },
+			"uRepeat" : { type: "v2", value: new THREE.Vector2( 1, 1 ) },
+
+			"wrapRGB"  : { type: "v3", value: new THREE.Vector3( 1, 1, 1 ) }
+
+			}
+
+		] ),
+
+		fragmentShader: [
+
+			"uniform vec3 uAmbientColor;",
+			"uniform vec3 uDiffuseColor;",
+			"uniform vec3 uSpecularColor;",
+			"uniform float uShininess;",
+			"uniform float uOpacity;",
+
+			"uniform bool enableDiffuse;",
+			"uniform bool enableSpecular;",
+			"uniform bool enableAO;",
+			"uniform bool enableReflection;",
+
+			"uniform sampler2D tDiffuse;",
+			"uniform sampler2D tNormal;",
+			"uniform sampler2D tSpecular;",
+			"uniform sampler2D tAO;",
+
+			"uniform samplerCube tCube;",
+
+			"uniform float uNormalScale;",
+			"uniform float uReflectivity;",
+
+			"varying vec3 vTangent;",
+			"varying vec3 vBinormal;",
+			"varying vec3 vNormal;",
+			"varying vec2 vUv;",
+
+			"uniform vec3 ambientLightColor;",
+
+			"#if MAX_DIR_LIGHTS > 0",
+				"uniform vec3 directionalLightColor[ MAX_DIR_LIGHTS ];",
+				"uniform vec3 directionalLightDirection[ MAX_DIR_LIGHTS ];",
+			"#endif",
+
+			"#if MAX_POINT_LIGHTS > 0",
+				"uniform vec3 pointLightColor[ MAX_POINT_LIGHTS ];",
+				"uniform vec3 pointLightPosition[ MAX_POINT_LIGHTS ];",
+				"uniform float pointLightDistance[ MAX_POINT_LIGHTS ];",
+			"#endif",
+
+			"#ifdef WRAP_AROUND",
+				"uniform vec3 wrapRGB;",
+			"#endif",
+
+			"varying vec3 vViewPosition;",
+
+			THREE.ShaderChunk[ "shadowmap_pars_fragment" ],
+			THREE.ShaderChunk[ "fog_pars_fragment" ],
+
+			"void main() {",
+
+				"gl_FragColor = vec4( vec3( 1.0 ), uOpacity );",
+
+				"vec3 specularTex = vec3( 1.0 );",
+
+				"vec3 normalTex = texture2D( tNormal, vUv ).xyz * 2.0 - 1.0;",
+				"normalTex.xy *= uNormalScale;",
+				"normalTex = normalize( normalTex );",
+
+				"if( enableDiffuse ) {",
+
+					"#ifdef GAMMA_INPUT",
+
+						"vec4 texelColor = texture2D( tDiffuse, vUv );",
+						"texelColor.xyz *= texelColor.xyz;",
+
+						"gl_FragColor = gl_FragColor * texelColor;",
+
+					"#else",
+
+						"gl_FragColor = gl_FragColor * texture2D( tDiffuse, vUv );",
+
+					"#endif",
+
+				"}",
+
+				"if( enableAO ) {",
+
+					"#ifdef GAMMA_INPUT",
+
+						"vec4 aoColor = texture2D( tAO, vUv );",
+						"aoColor.xyz *= aoColor.xyz;",
+
+						"gl_FragColor.xyz = gl_FragColor.xyz * aoColor.xyz;",
+
+					"#else",
+
+						"gl_FragColor.xyz = gl_FragColor.xyz * texture2D( tAO, vUv ).xyz;",
+
+					"#endif",
+
+				"}",
+
+				"if( enableSpecular )",
+					"specularTex = texture2D( tSpecular, vUv ).xyz;",
+
+				"mat3 tsb = mat3( normalize( vTangent ), normalize( vBinormal ), normalize( vNormal ) );",
+				"vec3 finalNormal = tsb * normalTex;",
+
+				"vec3 normal = normalize( finalNormal );",
+				"vec3 viewPosition = normalize( vViewPosition );",
+
+				"#ifdef DOUBLE_SIDED",
+
+					"normal = normal * ( -1.0 + 2.0 * float( gl_FrontFacing ) );",
+
+				"#endif",
+
+				// point lights
+
+				"#if MAX_POINT_LIGHTS > 0",
+
+					"vec3 pointDiffuse = vec3( 0.0 );",
+					"vec3 pointSpecular = vec3( 0.0 );",
+
+					"for ( int i = 0; i < MAX_POINT_LIGHTS; i ++ ) {",
+
+						"vec4 lPosition = viewMatrix * vec4( pointLightPosition[ i ], 1.0 );",
+						"vec3 pointVector = lPosition.xyz + vViewPosition.xyz;",
+
+						"float pointDistance = 1.0;",
+						"if ( pointLightDistance[ i ] > 0.0 )",
+							"pointDistance = 1.0 - min( ( length( pointVector ) / pointLightDistance[ i ] ), 1.0 );",
+
+						"pointVector = normalize( pointVector );",
+
+						// diffuse
+
+						"#ifdef WRAP_AROUND",
+
+							"float pointDiffuseWeightFull = max( dot( normal, pointVector ), 0.0 );",
+							"float pointDiffuseWeightHalf = max( 0.5 * dot( normal, pointVector ) + 0.5, 0.0 );",
+
+							"vec3 pointDiffuseWeight = mix( vec3 ( pointDiffuseWeightFull ), vec3( pointDiffuseWeightHalf ), wrapRGB );",
+
+						"#else",
+
+							"float pointDiffuseWeight = max( dot( normal, pointVector ), 0.0 );",
+
+						"#endif",
+
+						"pointDiffuse += pointDistance * pointLightColor[ i ] * uDiffuseColor * pointDiffuseWeight;",
+
+						// specular
+
+						"vec3 pointHalfVector = normalize( pointVector + viewPosition );",
+						"float pointDotNormalHalf = max( dot( normal, pointHalfVector ), 0.0 );",
+						"float pointSpecularWeight = specularTex.r * max( pow( pointDotNormalHalf, uShininess ), 0.0 );",
+
+						"#ifdef PHYSICALLY_BASED_SHADING",
+
+							// 2.0 => 2.0001 is hack to work around ANGLE bug
+
+							"float specularNormalization = ( uShininess + 2.0001 ) / 8.0;",
+
+							"vec3 schlick = specularTex + vec3( 1.0 - specularTex ) * pow( 1.0 - dot( pointVector, pointHalfVector ), 5.0 );",
+							"pointSpecular += schlick * pointLightColor[ i ] * pointSpecularWeight * pointDiffuseWeight * pointDistance * specularNormalization;",
+
+						"#else",
+
+							"pointSpecular += pointDistance * pointLightColor[ i ] * specularTex * pointSpecularWeight * pointDiffuseWeight;",
+
+						"#endif",
+
+					"}",
+
+				"#endif",
+
+				// directional lights
+
+				"#if MAX_DIR_LIGHTS > 0",
+
+					"vec3 dirDiffuse = vec3( 0.0 );",
+					"vec3 dirSpecular = vec3( 0.0 );",
+
+					"for( int i = 0; i < MAX_DIR_LIGHTS; i++ ) {",
+
+						"vec4 lDirection = viewMatrix * vec4( directionalLightDirection[ i ], 0.0 );",
+						"vec3 dirVector = normalize( lDirection.xyz );",
+
+						// diffuse
+
+						"#ifdef WRAP_AROUND",
+
+							"float directionalLightWeightingFull = max( dot( normal, dirVector ), 0.0 );",
+							"float directionalLightWeightingHalf = max( 0.5 * dot( normal, dirVector ) + 0.5, 0.0 );",
+
+							"vec3 dirDiffuseWeight = mix( vec3( directionalLightWeightingFull ), vec3( directionalLightWeightingHalf ), wrapRGB );",
+
+						"#else",
+
+							"float dirDiffuseWeight = max( dot( normal, dirVector ), 0.0 );",
+
+						"#endif",
+
+						"dirDiffuse += directionalLightColor[ i ] * uDiffuseColor * dirDiffuseWeight;",
+
+						// specular
+
+						"vec3 dirHalfVector = normalize( dirVector + viewPosition );",
+						"float dirDotNormalHalf = max( dot( normal, dirHalfVector ), 0.0 );",
+						"float dirSpecularWeight = specularTex.r * max( pow( dirDotNormalHalf, uShininess ), 0.0 );",
+
+						"#ifdef PHYSICALLY_BASED_SHADING",
+
+							// 2.0 => 2.0001 is hack to work around ANGLE bug
+
+							"float specularNormalization = ( uShininess + 2.0001 ) / 8.0;",
+
+							"vec3 schlick = specularTex + vec3( 1.0 - specularTex ) * pow( 1.0 - dot( dirVector, dirHalfVector ), 5.0 );",
+							"dirSpecular += schlick * directionalLightColor[ i ] * dirSpecularWeight * dirDiffuseWeight * specularNormalization;",
+
+						"#else",
+
+							"dirSpecular += directionalLightColor[ i ] * specularTex * dirSpecularWeight * dirDiffuseWeight;",
+
+						"#endif",
+
+					"}",
+
+				"#endif",
+
+				// all lights contribution summation
+
+				"vec3 totalDiffuse = vec3( 0.0 );",
+				"vec3 totalSpecular = vec3( 0.0 );",
+
+				"#if MAX_DIR_LIGHTS > 0",
+
+					"totalDiffuse += dirDiffuse;",
+					"totalSpecular += dirSpecular;",
+
+				"#endif",
+
+				"#if MAX_POINT_LIGHTS > 0",
+
+					"totalDiffuse += pointDiffuse;",
+					"totalSpecular += pointSpecular;",
+
+				"#endif",
+
+				"gl_FragColor.xyz = gl_FragColor.xyz * ( totalDiffuse + ambientLightColor * uAmbientColor) + totalSpecular;",
+
+				"if ( enableReflection ) {",
+
+					"#ifdef DOUBLE_SIDED",
+
+						"float flipNormal = ( -1.0 + 2.0 * float( gl_FrontFacing ) );",
+						
+					"#else",
+
+						"float flipNormal = 1.0;",
+
+					"#endif",
+
+					"vec3 wPos = cameraPosition - vViewPosition;",
+					"vec3 vReflect = reflect( normalize( wPos ), normal );",
+
+					"vec4 cubeColor = textureCube( tCube, flipNormal*vec3( -vReflect.x, vReflect.yz ) );",
+
+					"#ifdef GAMMA_INPUT",
+
+						"cubeColor.xyz *= cubeColor.xyz;",
+
+					"#endif",
+
+					"gl_FragColor.xyz = mix( gl_FragColor.xyz, cubeColor.xyz, specularTex.r * uReflectivity );",
+
+				"}",
+
+				THREE.ShaderChunk[ "shadowmap_fragment" ],
+				THREE.ShaderChunk[ "linear_to_gamma_fragment" ],
+				THREE.ShaderChunk[ "fog_fragment" ],
+
+			"}"
+
+		].join("\n"),
+
+		vertexShader: [
+
+			"attribute vec4 tangent;",
+
+			"uniform vec2 uOffset;",
+			"uniform vec2 uRepeat;",
+
+			"#ifdef VERTEX_TEXTURES",
+
+				"uniform sampler2D tDisplacement;",
+				"uniform float uDisplacementScale;",
+				"uniform float uDisplacementBias;",
+
+			"#endif",
+
+			"varying vec3 vTangent;",
+			"varying vec3 vBinormal;",
+			"varying vec3 vNormal;",
+			"varying vec2 vUv;",
+
+			"varying vec3 vViewPosition;",
+
+			THREE.ShaderChunk[ "shadowmap_pars_vertex" ],
+
+			"void main() {",
+
+				"vec4 mvPosition = modelViewMatrix * vec4( position, 1.0 );",
+
+				"vViewPosition = -mvPosition.xyz;",
+
+				// normal, tangent and binormal vectors
+
+				"vNormal = normalMatrix * normal;",
+				"vTangent = normalMatrix * tangent.xyz;",
+				"vBinormal = cross( vNormal, vTangent ) * tangent.w;",
+
+				"vUv = uv * uRepeat + uOffset;",
+
+				// displacement mapping
+
+				"#ifdef VERTEX_TEXTURES",
+
+					"vec3 dv = texture2D( tDisplacement, uv ).xyz;",
+					"float df = uDisplacementScale * dv.x + uDisplacementBias;",
+					"vec4 displacedPosition = vec4( normalize( vNormal.xyz ) * df, 0.0 ) + mvPosition;",
+					"gl_Position = projectionMatrix * displacedPosition;",
+
+				"#else",
+
+					"gl_Position = projectionMatrix * mvPosition;",
+
+				"#endif",
+
+				THREE.ShaderChunk[ "shadowmap_vertex" ],
+
+			"}"
+
+		].join("\n")
+
+	},
+
+	/* -------------------------------------------------------------------------
+		//	Normal map shader
+		//		- Blinn-Phong
+		//		- normal + diffuse + specular + AO + displacement + reflection + shadow maps
+		//		- PER-VERTEX point and directional lights (use with "lights: true" material option)
+		 ------------------------------------------------------------------------- */
+
+		'normalV' : {
+
+			uniforms: THREE.UniformsUtils.merge( [
+
+				THREE.UniformsLib[ "fog" ],
+				THREE.UniformsLib[ "lights" ],
+				THREE.UniformsLib[ "shadowmap" ],
+
+				{
+
+				"enableAO"		  : { type: "i", value: 0 },
+				"enableDiffuse"	  : { type: "i", value: 0 },
+				"enableSpecular"  : { type: "i", value: 0 },
+				"enableReflection": { type: "i", value: 0 },
+
+				"tDiffuse"	   : { type: "t", value: 0, texture: null },
+				"tCube"		   : { type: "t", value: 1, texture: null },
+				"tNormal"	   : { type: "t", value: 2, texture: null },
+				"tSpecular"	   : { type: "t", value: 3, texture: null },
+				"tAO"		   : { type: "t", value: 4, texture: null },
+				"tDisplacement": { type: "t", value: 5, texture: null },
+
+				"uNormalScale": { type: "f", value: 1.0 },
+
+				"uDisplacementBias": { type: "f", value: 0.0 },
+				"uDisplacementScale": { type: "f", value: 1.0 },
+
+				"uDiffuseColor": { type: "c", value: new THREE.Color( 0xffffff ) },
+				"uSpecularColor": { type: "c", value: new THREE.Color( 0x111111 ) },
+				"uAmbientColor": { type: "c", value: new THREE.Color( 0xffffff ) },
+				"uShininess": { type: "f", value: 30 },
+				"uOpacity": { type: "f", value: 1 },
+
+				"uReflectivity": { type: "f", value: 0.5 },
+
+				"uOffset" : { type: "v2", value: new THREE.Vector2( 0, 0 ) },
+				"uRepeat" : { type: "v2", value: new THREE.Vector2( 1, 1 ) },
+
+				"wrapRGB"  : { type: "v3", value: new THREE.Vector3( 1, 1, 1 ) }
+
+				}
+
+			] ),
+
+			fragmentShader: [
+
+				"uniform vec3 uAmbientColor;",
+				"uniform vec3 uDiffuseColor;",
+				"uniform vec3 uSpecularColor;",
+				"uniform float uShininess;",
+				"uniform float uOpacity;",
+
+				"uniform bool enableDiffuse;",
+				"uniform bool enableSpecular;",
+				"uniform bool enableAO;",
+				"uniform bool enableReflection;",
+
+				"uniform sampler2D tDiffuse;",
+				"uniform sampler2D tNormal;",
+				"uniform sampler2D tSpecular;",
+				"uniform sampler2D tAO;",
+
+				"uniform samplerCube tCube;",
+
+				"uniform float uNormalScale;",
+				"uniform float uReflectivity;",
+
+				"varying vec3 vTangent;",
+				"varying vec3 vBinormal;",
+				"varying vec3 vNormal;",
+				"varying vec2 vUv;",
+
+				"uniform vec3 ambientLightColor;",
+
+				"#if MAX_DIR_LIGHTS > 0",
+					"uniform vec3 directionalLightColor[ MAX_DIR_LIGHTS ];",
+					"uniform vec3 directionalLightDirection[ MAX_DIR_LIGHTS ];",
+				"#endif",
+
+				"#if MAX_POINT_LIGHTS > 0",
+					"uniform vec3 pointLightColor[ MAX_POINT_LIGHTS ];",
+					"varying vec4 vPointLight[ MAX_POINT_LIGHTS ];",
+				"#endif",
+
+				"#ifdef WRAP_AROUND",
+					"uniform vec3 wrapRGB;",
+				"#endif",
+
+				"varying vec3 vViewPosition;",
+
+				THREE.ShaderChunk[ "shadowmap_pars_fragment" ],
+				THREE.ShaderChunk[ "fog_pars_fragment" ],
+
+				"void main() {",
+
+					"gl_FragColor = vec4( vec3( 1.0 ), uOpacity );",
+
+					"vec3 specularTex = vec3( 1.0 );",
+
+					"vec3 normalTex = texture2D( tNormal, vUv ).xyz * 2.0 - 1.0;",
+					"normalTex.xy *= uNormalScale;",
+					"normalTex = normalize( normalTex );",
+
+					"if( enableDiffuse ) {",
+
+						"#ifdef GAMMA_INPUT",
+
+							"vec4 texelColor = texture2D( tDiffuse, vUv );",
+							"texelColor.xyz *= texelColor.xyz;",
+
+							"gl_FragColor = gl_FragColor * texelColor;",
+
+						"#else",
+
+							"gl_FragColor = gl_FragColor * texture2D( tDiffuse, vUv );",
+
+						"#endif",
+
+					"}",
+
+					"if( enableAO ) {",
+
+						"#ifdef GAMMA_INPUT",
+
+							"vec4 aoColor = texture2D( tAO, vUv );",
+							"aoColor.xyz *= aoColor.xyz;",
+
+							"gl_FragColor.xyz = gl_FragColor.xyz * aoColor.xyz;",
+
+						"#else",
+
+							"gl_FragColor.xyz = gl_FragColor.xyz * texture2D( tAO, vUv ).xyz;",
+
+						"#endif",
+
+					"}",
+
+					"if( enableSpecular )",
+						"specularTex = texture2D( tSpecular, vUv ).xyz;",
+
+					"mat3 tsb = mat3( normalize( vTangent ), normalize( vBinormal ), normalize( vNormal ) );",
+					"vec3 finalNormal = tsb * normalTex;",
+
+					"vec3 normal = normalize( finalNormal );",
+					"vec3 viewPosition = normalize( vViewPosition );",
+
+					// point lights
+
+					"#if MAX_POINT_LIGHTS > 0",
+
+						"vec3 pointDiffuse = vec3( 0.0 );",
+						"vec3 pointSpecular = vec3( 0.0 );",
+
+						"for ( int i = 0; i < MAX_POINT_LIGHTS; i ++ ) {",
+
+							"vec3 pointVector = normalize( vPointLight[ i ].xyz );",
+							"float pointDistance = vPointLight[ i ].w;",
+
+							// diffuse
+
+							"#ifdef WRAP_AROUND",
+
+								"float pointDiffuseWeightFull = max( dot( normal, pointVector ), 0.0 );",
+								"float pointDiffuseWeightHalf = max( 0.5 * dot( normal, pointVector ) + 0.5, 0.0 );",
+
+								"vec3 pointDiffuseWeight = mix( vec3 ( pointDiffuseWeightFull ), vec3( pointDiffuseWeightHalf ), wrapRGB );",
+
+							"#else",
+
+								"float pointDiffuseWeight = max( dot( normal, pointVector ), 0.0 );",
+
+							"#endif",
+
+							"pointDiffuse += pointDistance * pointLightColor[ i ] * uDiffuseColor * pointDiffuseWeight;",
+
+							// specular
+
+							"vec3 pointHalfVector = normalize( pointVector + viewPosition );",
+							"float pointDotNormalHalf = max( dot( normal, pointHalfVector ), 0.0 );",
+							"float pointSpecularWeight = specularTex.r * max( pow( pointDotNormalHalf, uShininess ), 0.0 );",
+
+							"#ifdef PHYSICALLY_BASED_SHADING",
+
+								// 2.0 => 2.0001 is hack to work around ANGLE bug
+
+								"float specularNormalization = ( uShininess + 2.0001 ) / 8.0;",
+
+								"vec3 schlick = uSpecularColor + vec3( 1.0 - uSpecularColor ) * pow( 1.0 - dot( pointVector, pointHalfVector ), 5.0 );",
+								"pointSpecular += schlick * pointLightColor[ i ] * pointSpecularWeight * pointDiffuseWeight * pointDistance * specularNormalization;",
+
+							"#else",
+
+								"pointSpecular += pointDistance * pointLightColor[ i ] * uSpecularColor * pointSpecularWeight * pointDiffuseWeight;",
+
+							"#endif",
+
+						"}",
+
+					"#endif",
+
+					// directional lights
+
+					"#if MAX_DIR_LIGHTS > 0",
+
+						"vec3 dirDiffuse = vec3( 0.0 );",
+						"vec3 dirSpecular = vec3( 0.0 );",
+
+						"for( int i = 0; i < MAX_DIR_LIGHTS; i++ ) {",
+
+							"vec4 lDirection = viewMatrix * vec4( directionalLightDirection[ i ], 0.0 );",
+							"vec3 dirVector = normalize( lDirection.xyz );",
+
+							// diffuse
+
+							"#ifdef WRAP_AROUND",
+
+								"float directionalLightWeightingFull = max( dot( normal, dirVector ), 0.0 );",
+								"float directionalLightWeightingHalf = max( 0.5 * dot( normal, dirVector ) + 0.5, 0.0 );",
+
+								"vec3 dirDiffuseWeight = mix( vec3( directionalLightWeightingFull ), vec3( directionalLightWeightingHalf ), wrapRGB );",
+
+							"#else",
+
+								"float dirDiffuseWeight = max( dot( normal, dirVector ), 0.0 );",
+
+							"#endif",
+
+							"dirDiffuse += directionalLightColor[ i ] * uDiffuseColor * dirDiffuseWeight;",
+
+							// specular
+
+							"vec3 dirHalfVector = normalize( dirVector + viewPosition );",
+							"float dirDotNormalHalf = max( dot( normal, dirHalfVector ), 0.0 );",
+							"float dirSpecularWeight = specularTex.r * max( pow( dirDotNormalHalf, uShininess ), 0.0 );",
+
+							"#ifdef PHYSICALLY_BASED_SHADING",
+
+								// 2.0 => 2.0001 is hack to work around ANGLE bug
+
+								"float specularNormalization = ( uShininess + 2.0001 ) / 8.0;",
+
+								"vec3 schlick = uSpecularColor + vec3( 1.0 - uSpecularColor ) * pow( 1.0 - dot( dirVector, dirHalfVector ), 5.0 );",
+								"dirSpecular += schlick * directionalLightColor[ i ] * dirSpecularWeight * dirDiffuseWeight * specularNormalization;",
+
+							"#else",
+
+								"dirSpecular += directionalLightColor[ i ] * uSpecularColor * dirSpecularWeight * dirDiffuseWeight;",
+
+							"#endif",
+
+						"}",
+
+					"#endif",
+
+					// all lights contribution summation
+
+					"vec3 totalDiffuse = vec3( 0.0 );",
+					"vec3 totalSpecular = vec3( 0.0 );",
+
+					"#if MAX_DIR_LIGHTS > 0",
+
+						"totalDiffuse += dirDiffuse;",
+						"totalSpecular += dirSpecular;",
+
+					"#endif",
+
+					"#if MAX_POINT_LIGHTS > 0",
+
+						"totalDiffuse += pointDiffuse;",
+						"totalSpecular += pointSpecular;",
+
+					"#endif",
+
+					"gl_FragColor.xyz = gl_FragColor.xyz * ( totalDiffuse + ambientLightColor * uAmbientColor) + totalSpecular;",
+
+					"if ( enableReflection ) {",
+
+						"vec3 wPos = cameraPosition - vViewPosition;",
+						"vec3 vReflect = reflect( normalize( wPos ), normal );",
+
+						"vec4 cubeColor = textureCube( tCube, vec3( -vReflect.x, vReflect.yz ) );",
+
+						"#ifdef GAMMA_INPUT",
+
+							"cubeColor.xyz *= cubeColor.xyz;",
+
+						"#endif",
+
+						"gl_FragColor.xyz = mix( gl_FragColor.xyz, cubeColor.xyz, specularTex.r * uReflectivity );",
+
+					"}",
+
+					THREE.ShaderChunk[ "shadowmap_fragment" ],
+					THREE.ShaderChunk[ "linear_to_gamma_fragment" ],
+					THREE.ShaderChunk[ "fog_fragment" ],
+
+				"}"
+
+			].join("\n"),
+
+			vertexShader: [
+
+				"attribute vec4 tangent;",
+
+				"uniform vec2 uOffset;",
+				"uniform vec2 uRepeat;",
+
+				"#ifdef VERTEX_TEXTURES",
+
+					"uniform sampler2D tDisplacement;",
+					"uniform float uDisplacementScale;",
+					"uniform float uDisplacementBias;",
+
+				"#endif",
+
+				"varying vec3 vTangent;",
+				"varying vec3 vBinormal;",
+				"varying vec3 vNormal;",
+				"varying vec2 vUv;",
+
+				"#if MAX_POINT_LIGHTS > 0",
+
+					"uniform vec3 pointLightPosition[ MAX_POINT_LIGHTS ];",
+					"uniform float pointLightDistance[ MAX_POINT_LIGHTS ];",
+
+					"varying vec4 vPointLight[ MAX_POINT_LIGHTS ];",
+
+				"#endif",
+
+				"varying vec3 vViewPosition;",
+
+				THREE.ShaderChunk[ "shadowmap_pars_vertex" ],
+
+				"void main() {",
+
+					"vec4 mvPosition = modelViewMatrix * vec4( position, 1.0 );",
+
+					"vViewPosition = -mvPosition.xyz;",
+
+					// normal, tangent and binormal vectors
+
+					"vNormal = normalMatrix * normal;",
+					"vTangent = normalMatrix * tangent.xyz;",
+					"vBinormal = cross( vNormal, vTangent ) * tangent.w;",
+
+					"vUv = uv * uRepeat + uOffset;",
+
+					// point lights
+
+					"#if MAX_POINT_LIGHTS > 0",
+
+						"for( int i = 0; i < MAX_POINT_LIGHTS; i++ ) {",
+
+							"vec4 lPosition = viewMatrix * vec4( pointLightPosition[ i ], 1.0 );",
+							"vec3 lVector = lPosition.xyz - mvPosition.xyz;",
+
+							"float lDistance = 1.0;",
+							"if ( pointLightDistance[ i ] > 0.0 )",
+								"lDistance = 1.0 - min( ( length( lVector ) / pointLightDistance[ i ] ), 1.0 );",
+
+							"lVector = normalize( lVector );",
+
+							"vPointLight[ i ] = vec4( lVector, lDistance );",
+
+						"}",
+
+					"#endif",
+
+					// displacement mapping
+
+					"#ifdef VERTEX_TEXTURES",
+
+						"vec3 dv = texture2D( tDisplacement, uv ).xyz;",
+						"float df = uDisplacementScale * dv.x + uDisplacementBias;",
+						"vec4 displacedPosition = vec4( normalize( vNormal.xyz ) * df, 0.0 ) + mvPosition;",
+						"gl_Position = projectionMatrix * displacedPosition;",
+
+					"#else",
+
+						"gl_Position = projectionMatrix * mvPosition;",
+
+					"#endif",
+
+					THREE.ShaderChunk[ "shadowmap_vertex" ],
+
+				"}"
+
+			].join("\n")
+
+		},
+
+	/* -------------------------------------------------------------------------
+	//	Cube map shader
+	 ------------------------------------------------------------------------- */
+
+	'cube': {
+
+		uniforms: { "tCube": { type: "t", value: 1, texture: null },
+					"tFlip": { type: "f", value: -1 } },
+
+		vertexShader: [
+
+			"varying vec3 vViewPosition;",
+
+			"void main() {",
+
+				"vec4 mPosition = objectMatrix * vec4( position, 1.0 );",
+				"vViewPosition = cameraPosition - mPosition.xyz;",
+
+				"gl_Position = projectionMatrix * modelViewMatrix * vec4( position, 1.0 );",
+
+			"}"
+
+		].join("\n"),
+
+		fragmentShader: [
+
+			"uniform samplerCube tCube;",
+			"uniform float tFlip;",
+
+			"varying vec3 vViewPosition;",
+
+			"void main() {",
+
+				"vec3 wPos = cameraPosition - vViewPosition;",
+				"gl_FragColor = textureCube( tCube, vec3( tFlip * wPos.x, wPos.yz ) );",
+
+			"}"
+
+		].join("\n")
+
+	}
+
+};

css/BebasNeue-webfont.svg

@@ -0,0 +1,245 @@
+<?xml version="1.0" standalone="no"?>
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd" >
+<svg xmlns="http://www.w3.org/2000/svg">
+<metadata>
+This is a custom SVG webfont generated by Font Squirrel.
+Copyright   : Copyright c 2010 by Ryoichi Tsunekawa All rights reserved
+Designer    : Ryoichi Tsunekawa
+Foundry     : Ryoichi Tsunekawa
+</metadata>
+<defs>
+<font id="BebasNeueRegular" horiz-adv-x="811" >
+<font-face units-per-em="2048" ascent="1638" descent="-410" />
+<missing-glyph horiz-adv-x="317" />
+<glyph unicode=" "  horiz-adv-x="317" />
+<glyph unicode="&#x09;" horiz-adv-x="317" />
+<glyph unicode="&#xa0;" horiz-adv-x="317" />
+<glyph unicode="!" horiz-adv-x="389" d="M82 836v598h225v-598l-28 -519h-168zM86 0v217h217v-217h-217z" />
+<glyph unicode="&#x22;" horiz-adv-x="665" d="M82 1434h217l-33 -422h-153zM367 1434h217l-33 -422h-154z" />
+<glyph unicode="#" horiz-adv-x="839" d="M31 410l16 159h100l39 375h-102l16 160h103l35 330h184l-35 -330h133l35 330h184l-34 -330h104l-16 -160h-105l-39 -375h105l-17 -159h-104l-43 -410h-184l43 410h-134l-43 -410h-184l43 410h-100zM332 569h133l39 375h-133z" />
+<glyph unicode="$" d="M70 365v98h213v-113q0 -139 116.5 -139t116.5 139q0 68 -32.5 127.5t-82 99t-105.5 89.5l-106 100q-49 49 -81.5 128t-32.5 175q0 297 237 350v107h185v-107q242 -49 241 -350v-45h-213v59q0 141 -112 141h-1q-112 0 -112 -141q0 -80 45 -146.5t110 -117.5l130 -108 q65 -56 110 -145t45 -201q0 -147 -62.5 -237.5t-180.5 -115.5v-104h-185v104q-244 49 -243 353z" />
+<glyph unicode="%" horiz-adv-x="1284" d="M70 743v471q0 111 55 170.5t161.5 59.5t162 -59.5t55.5 -170.5v-471q0 -111 -55.5 -170t-162 -59t-161.5 59t-55 170zM213 733q0 -90 73.5 -90t73.5 90v492q0 90 -73.5 90t-73.5 -90v-492zM287 0l565 1434h133l-565 -1434h-133zM780 219v471q0 111 55.5 170.5t162 59.5 t161.5 -59.5t55 -170.5v-471q0 -111 -55 -170t-161.5 -59t-162 59t-55.5 170zM924 209q0 -90 73.5 -90t73.5 90v491q0 90 -73.5 90t-73.5 -90v-491z" />
+<glyph unicode="&#x26;" horiz-adv-x="847" d="M84 311v146q0 231 156 301q-156 66 -156 295v26q0 354 336 355h258v-205h-254q-115 0 -115 -139v-89q0 -82 34 -116.5t101 -34.5h99v160h225v-160h59v-205h-59v-471q0 -117 25 -174h-230q-16 45 -20 113q-59 -129 -209 -129q-250 0 -250 327zM309 330q0 -141 117 -142 q111 0 117 125v332h-86q-78 0 -113 -42t-35 -140v-133z" />
+<glyph unicode="'" horiz-adv-x="368" d="M76 1434h217l-33 -422h-154z" />
+<glyph unicode="(" horiz-adv-x="514" d="M96 313v807q0 170 73 242t243 72h69v-185h-55q-55 0 -79.5 -27.5t-24.5 -101.5v-807q0 -74 24.5 -101.5t79.5 -27.5h55v-184h-69q-170 0 -243 71.5t-73 241.5z" />
+<glyph unicode=")" horiz-adv-x="514" d="M33 0v184h55q55 0 80 28t25 101v807q0 74 -25 101.5t-80 27.5h-55v185h69q170 0 243 -72t73 -242v-807q0 -170 -73 -241.5t-243 -71.5h-69z" />
+<glyph unicode="*" d="M4 1075l57 174l306 -153l-54 338h185l-54 -338l306 153l57 -174l-336 -57l240 -240l-148 -108l-157 303l-158 -303l-148 108l240 240z" />
+<glyph unicode="+" d="M51 637v160h275v276h159v-276h275v-160h-275v-281h-159v281h-275z" />
+<glyph unicode="," horiz-adv-x="380" d="M82 0v217h217v-194l-98 -228h-92l59 205h-86z" />
+<glyph unicode="-" horiz-adv-x="552" d="M72 614v205h409v-205h-409z" />
+<glyph unicode="." horiz-adv-x="380" d="M82 0v217h217v-217h-217z" />
+<glyph unicode="/" horiz-adv-x="780" d="M10 0l565 1434h195l-565 -1434h-195z" />
+<glyph unicode="0" d="M63 344v746q0 172 88.5 266t254 94t254 -94t88.5 -266v-746q0 -172 -88.5 -266t-254 -94t-254 94t-88.5 266zM289 330q0 -141 117 -142q116 0 116 142v774q0 141 -116.5 141t-116.5 -141v-774z" />
+<glyph unicode="1" d="M221 1094v159q82 0 134.5 28t71.5 60.5t42 92.5h152v-1434h-226v1094h-174z" />
+<glyph unicode="2" d="M82 0v176q0 117 46 214t111 170l131 144q66 70 112 166t46 211q0 92 -29.5 128t-86.5 36q-117 0 -117 -141v-154h-213v140q0 174 86 267t250 93t250 -93t86 -267q0 -131 -50.5 -247t-120 -198t-137 -153.5t-109.5 -144.5q-33 -57 -33 -111q0 -16 3 -31h426v-205h-651z " />
+<glyph unicode="3" d="M70 344v119h213v-133q0 -141 116 -142q57 0 87 36t30 126v113q0 98 -35 140t-112 42h-76v205h88q68 0 101.5 34.5t33.5 116.5v80q0 92 -29.5 128t-87.5 36q-117 0 -116 -141v-92h-213v78q0 174 86 267t249.5 93t249.5 -93t86 -267v-37q0 -229 -157 -295q158 -70 157 -301 v-113q0 -174 -86 -267t-249.5 -93t-249.5 93t-86 267z" />
+<glyph unicode="4" d="M29 260v205l409 969h246v-969h107v-205h-107v-260h-225v260h-430zM236 465h223v530z" />
+<glyph unicode="5" d="M72 344v119h213v-133q0 -139 117 -140q116 0 116 140v315q0 141 -116.5 141t-116.5 -141v-43h-213l41 832h594v-205h-392l-18 -342q63 104 197 104q250 0 249 -327v-320q0 -174 -86 -267t-249.5 -93t-249.5 93t-86 267z" />
+<glyph unicode="6" d="M68 344v733q0 373 344 373q164 0 250 -93t86 -267v-37h-213v51q0 141 -117 141q-63 0 -94 -39t-31 -137v-262q59 127 209 127q250 0 250 -328v-262q0 -172 -88.5 -266t-254 -94t-253.5 94t-88 266zM293 330q0 -139 117 -140q116 0 116 140v258q0 141 -116.5 141 t-116.5 -141v-258z" />
+<glyph unicode="7" d="M68 1229v205h675v-197l-331 -1237h-226l330 1229h-448z" />
+<glyph unicode="8" d="M53 1044v46q0 172 91.5 266t261 94t261 -94t91.5 -266v-46q0 -211 -140 -288q139 -78 140 -299v-113q0 -172 -91.5 -266t-261 -94t-261 94t-91.5 266v113q0 221 140 299q-139 76 -140 288zM279 350q0 -162 127 -162q125 0 126 162v133q0 162 -126.5 162t-126.5 -162v-133 zM279 1001q0 -152 126 -152l1 1q126 0 126 151v80q0 164 -126.5 164t-126.5 -164v-80z" />
+<glyph unicode="9" d="M59 827v263q0 172 88.5 266t254 94t253.5 -94t88 -266v-734q0 -372 -342 -372h-2q-164 0 -250 93t-86 267v37h213v-51q0 -141 117 -142q63 0 94 39t31 138v262q-59 -127 -209 -127q-250 0 -250 327zM285 846q0 -141 116.5 -141t116.5 141v258q0 139 -116.5 139 t-116.5 -139v-258z" />
+<glyph unicode=":" horiz-adv-x="380" d="M82 0v217h217v-217h-217zM82 780v217h217v-217h-217z" />
+<glyph unicode=";" horiz-adv-x="380" d="M82 0v217h217v-194l-98 -228h-92l59 205h-86zM82 780v217h217v-217h-217z" />
+<glyph unicode="&#x3c;" d="M61 637v160l668 245v-161l-459 -164l459 -164v-162z" />
+<glyph unicode="=" d="M72 471v160h667v-160h-667zM72 803v160h667v-160h-667z" />
+<glyph unicode="&#x3e;" d="M82 391v162l459 164l-459 164v161l668 -245v-160z" />
+<glyph unicode="?" horiz-adv-x="737" d="M41 948v142q0 174 84 267t248 93t248 -93t84 -267q0 -125 -42 -228.5t-91.5 -160t-91.5 -137.5t-42 -167q0 -45 8 -80h-200q-12 37 -13 89q0 104 39 191t84 141.5t84 150.5t39 215q0 141 -112.5 141t-112.5 -141v-156h-213zM236 0v217h217v-217h-217z" />
+<glyph unicode="@" horiz-adv-x="1411" d="M49 594q0 193 48 358.5t139.5 291.5t238 199t330.5 73q303 0 436 -164t133 -439q0 -178 -39 -312t-102.5 -204.5t-127.5 -103.5t-130 -33q-168 0 -180 135q-60 -123 -187 -123h-12q-188 5 -188 239q0 36 4 77l22 207q16 152 80 229q61 74 160 74h10q127 -2 168 -127 l12 119h197l-62 -592q-1 -6 -1 -11q0 -40 42 -41q80 0 122 142.5t42 320.5q0 201 -100 316.5t-307 115.5q-270 0 -412.5 -200.5t-142.5 -556.5q0 -254 119.5 -394.5t357.5 -140.5q244 0 424 139l-17 -196q-172 -115 -419 -115q-334 0 -496 191.5t-162 525.5zM610 598 q-2 -16 -2 -30q0 -101 90 -105h6q43 0 71 29q30 32 38 100l21 194q1 11 1 21q0 42 -20 65q-24 29 -70 29h-6q-45 0 -73 -29q-29 -30 -37 -100z" />
+<glyph unicode="A" horiz-adv-x="833" d="M23 0l229 1434h330l229 -1434h-227l-39 260h-277l-39 -260h-206zM297 455h217l-108 725z" />
+<glyph unicode="B" horiz-adv-x="831" d="M82 0v1434h340q174 0 254 -81t80 -249v-51q0 -221 -146 -289q168 -66 168 -307v-117q0 -166 -87 -253t-255 -87h-354zM307 205h129q59 0 88 31.5t29 109.5v125q0 98 -33.5 136t-111.5 38h-101v-440zM307 850h88q68 0 101.5 35t33.5 116v80q1 148 -114 148h-109v-379z" />
+<glyph unicode="C" horiz-adv-x="790" d="M63 344v746q0 174 86.5 267t250 93t249.5 -93t86 -267v-140h-213v154q0 141 -116.5 141t-116.5 -141v-774q1 -140 117 -140q117 0 116 140v205h213v-191q0 -174 -86 -267t-249.5 -93t-250 93t-86.5 267z" />
+<glyph unicode="D" horiz-adv-x="835" d="M82 0v1434h356q336 0 336 -355v-725q0 -354 -336 -354h-356zM307 205h127q115 0 115 139v746q0 139 -115 139h-127v-1024z" />
+<glyph unicode="E" horiz-adv-x="753" d="M82 0v1434h614v-205h-389v-400h309v-204h-309v-420h389v-205h-614z" />
+<glyph unicode="F" horiz-adv-x="704" d="M82 0v1434h596v-205h-371v-432h291v-205h-291v-592h-225z" />
+<glyph unicode="G" horiz-adv-x="798" d="M63 344v746q0 174 86.5 267t250 93t249.5 -93t86 -267v-140h-213v154q0 141 -116.5 141t-116.5 -141v-774q0 -139 117 -140q116 0 116 140v264h-102v205h315v-455q0 -174 -86 -267t-249.5 -93t-250 93t-86.5 267z" />
+<glyph unicode="H" horiz-adv-x="874" d="M82 0v1434h225v-615h256v615h230v-1434h-230v614h-256v-614h-225z" />
+<glyph unicode="I" horiz-adv-x="389" d="M82 0v1434h225v-1434h-225z" />
+<glyph unicode="J" horiz-adv-x="524" d="M20 0v205q25 -2 78 -2q129 0 129 137v1094h226v-1078q0 -360 -324 -360q-72 0 -109 4z" />
+<glyph unicode="K" horiz-adv-x="847" d="M82 0v1434h225v-625l295 625h225l-313 -639l313 -795h-231l-219 571l-70 -131v-440h-225z" />
+<glyph unicode="L" horiz-adv-x="694" d="M82 0v1434h225v-1229h371v-205h-596z" />
+<glyph unicode="M" horiz-adv-x="1107" d="M80 0v1434h313l166 -1018l154 1018h313v-1434h-213v1028l-156 -1028h-213l-168 1014v-1014h-196z" />
+<glyph unicode="N" horiz-adv-x="874" d="M80 0v1434h282l232 -859v859h201v-1434h-232l-280 1038v-1038h-203z" />
+<glyph unicode="O" d="M63 344v746q0 172 88.5 266t254 94t254 -94t88.5 -266v-746q0 -172 -88.5 -266t-254 -94t-254 94t-88.5 266zM289 330q1 -141 117 -142q117 0 116 142v774q0 141 -116.5 141t-116.5 -141v-774z" />
+<glyph unicode="P" horiz-adv-x="772" d="M82 0v1434h332q336 0 336 -355v-186q0 -354 -336 -354h-107v-539h-225zM307 743h107q55 0 82.5 31t27.5 105v215q0 74 -27.5 104.5t-82.5 30.5h-107v-486z" />
+<glyph unicode="Q" d="M63 1090q0 172 88.5 266t254 94t254 -94t88.5 -266v-746q0 -121 -43 -201q12 -30 60 -30h3h20v-201h-30q-145 0 -195 98q-71 -26 -151 -26h-6q-166 0 -254.5 94t-88.5 266v746zM289 330q0 -141 116 -142h1q116 0 116 142v774q0 141 -116.5 141t-116.5 -141v-774z" />
+<glyph unicode="R" horiz-adv-x="823" d="M82 0v1434h340q174 0 254 -81t80 -249v-113q0 -221 -148 -291q150 -63 150 -305v-221v-9q0 -110 24 -165h-229q-20 61 -21 176v225q0 98 -34.5 140.5t-112.5 42.5h-78v-584h-225zM307 788h88q68 0 101.5 35t33.5 117v141q1 148 -114 148h-109v-441z" />
+<glyph unicode="S" horiz-adv-x="765" d="M47 344v88h213v-102q0 -140 117 -140h1q116 0 116 140q0 80 -46 150t-110 128l-130 120q-66 63 -110.5 156t-44.5 206q0 174 84 267t248 93t248 -93t84 -267v-46h-213v60q0 141 -112.5 141t-112.5 -141q0 -59 24.5 -112.5t63.5 -96.5t86 -85t93 -88t85 -98.5t63.5 -124 t24.5 -155.5q0 -174 -86 -267t-250 -93t-250 93t-86 267z" />
+<glyph unicode="T" horiz-adv-x="729" d="M16 1229v205h697v-205h-236v-1229h-225v1229h-236z" />
+<glyph unicode="U" horiz-adv-x="815" d="M72 342v1092h225v-1106q1 -140 117 -140q117 0 116 140v1106h213v-1092q0 -174 -86 -267t-249.5 -93t-249.5 93t-86 267z" />
+<glyph unicode="V" horiz-adv-x="823" d="M23 1434h227l172 -1170l172 1170h207l-221 -1434h-336z" />
+<glyph unicode="W" horiz-adv-x="1153" d="M31 1434h219l121 -1131l108 1131h217l113 -1139l117 1139h196l-159 -1434h-299l-82 764l-82 -764h-310z" />
+<glyph unicode="X" horiz-adv-x="880" d="M31 0l252 737l-236 697h234l170 -529l174 529h209l-236 -697l252 -737h-238l-184 567l-186 -567h-211z" />
+<glyph unicode="Y" d="M8 1434h236l172 -654l172 654h215l-285 -959v-475h-225v475z" />
+<glyph unicode="Z" horiz-adv-x="757" d="M47 0v201l428 1028h-407v205h639v-201l-428 -1028h428v-205h-660z" />
+<glyph unicode="[" horiz-adv-x="514" d="M96 0v1434h373v-185h-147v-1065h147v-184h-373z" />
+<glyph unicode="\" horiz-adv-x="780" d="M10 1434h195l565 -1434h-195z" />
+<glyph unicode="]" horiz-adv-x="514" d="M45 0v184h148v1065h-148v185h373v-1434h-373z" />
+<glyph unicode="^" d="M41 799l285 635h159l285 -635h-180l-184 430l-185 -430h-180z" />
+<glyph unicode="_" horiz-adv-x="1024" d="M0 -20h1024v-164h-1024v164z" />
+<glyph unicode="`" horiz-adv-x="512" d="M90 1737h232l139 -228h-162z" />
+<glyph unicode="a" horiz-adv-x="833" d="M23 0l229 1434h330l229 -1434h-227l-39 260h-277l-39 -260h-206zM297 455h217l-108 725z" />
+<glyph unicode="b" horiz-adv-x="831" d="M82 0v1434h340q174 0 254 -81t80 -249v-51q0 -221 -146 -289q168 -66 168 -307v-117q0 -166 -87 -253t-255 -87h-354zM307 205h129q59 0 88 31.5t29 109.5v125q0 98 -33.5 136t-111.5 38h-101v-440zM307 850h88q68 0 101.5 35t33.5 116v80q1 148 -114 148h-109v-379z" />
+<glyph unicode="c" horiz-adv-x="790" d="M63 344v746q0 174 86.5 267t250 93t249.5 -93t86 -267v-140h-213v154q0 141 -116.5 141t-116.5 -141v-774q1 -140 117 -140q117 0 116 140v205h213v-191q0 -174 -86 -267t-249.5 -93t-250 93t-86.5 267z" />
+<glyph unicode="d" horiz-adv-x="835" d="M82 0v1434h356q336 0 336 -355v-725q0 -354 -336 -354h-356zM307 205h127q115 0 115 139v746q0 139 -115 139h-127v-1024z" />
+<glyph unicode="e" horiz-adv-x="753" d="M82 0v1434h614v-205h-389v-400h309v-204h-309v-420h389v-205h-614z" />
+<glyph unicode="f" horiz-adv-x="704" d="M82 0v1434h596v-205h-371v-432h291v-205h-291v-592h-225z" />
+<glyph unicode="g" horiz-adv-x="798" d="M63 344v746q0 174 86.5 267t250 93t249.5 -93t86 -267v-140h-213v154q0 141 -116.5 141t-116.5 -141v-774q0 -139 117 -140q116 0 116 140v264h-102v205h315v-455q0 -174 -86 -267t-249.5 -93t-250 93t-86.5 267z" />
+<glyph unicode="h" horiz-adv-x="874" d="M82 0v1434h225v-615h256v615h230v-1434h-230v614h-256v-614h-225z" />
+<glyph unicode="i" horiz-adv-x="389" d="M82 0v1434h225v-1434h-225z" />
+<glyph unicode="j" horiz-adv-x="524" d="M20 0v205q25 -2 78 -2q129 0 129 137v1094h226v-1078q0 -360 -324 -360q-72 0 -109 4z" />
+<glyph unicode="k" horiz-adv-x="847" d="M82 0v1434h225v-625l295 625h225l-313 -639l313 -795h-231l-219 571l-70 -131v-440h-225z" />
+<glyph unicode="l" horiz-adv-x="694" d="M82 0v1434h225v-1229h371v-205h-596z" />
+<glyph unicode="m" horiz-adv-x="1107" d="M80 0v1434h313l166 -1018l154 1018h313v-1434h-213v1028l-156 -1028h-213l-168 1014v-1014h-196z" />
+<glyph unicode="n" horiz-adv-x="874" d="M80 0v1434h282l232 -859v859h201v-1434h-232l-280 1038v-1038h-203z" />
+<glyph unicode="o" d="M63 344v746q0 172 88.5 266t254 94t254 -94t88.5 -266v-746q0 -172 -88.5 -266t-254 -94t-254 94t-88.5 266zM289 330q1 -141 117 -142q117 0 116 142v774q0 141 -116.5 141t-116.5 -141v-774z" />
+<glyph unicode="p" horiz-adv-x="772" d="M82 0v1434h332q336 0 336 -355v-186q0 -354 -336 -354h-107v-539h-225zM307 743h107q55 0 82.5 31t27.5 105v215q0 74 -27.5 104.5t-82.5 30.5h-107v-486z" />
+<glyph unicode="q" d="M63 1090q0 172 88.5 266t254 94t254 -94t88.5 -266v-746q0 -121 -43 -201q12 -30 60 -30h3h20v-201h-30q-145 0 -195 98q-71 -26 -151 -26h-6q-166 0 -254.5 94t-88.5 266v746zM289 330q0 -141 116 -142h1q116 0 116 142v774q0 141 -116.5 141t-116.5 -141v-774z" />
+<glyph unicode="r" horiz-adv-x="823" d="M82 0v1434h340q174 0 254 -81t80 -249v-113q0 -221 -148 -291q150 -63 150 -305v-221v-9q0 -110 24 -165h-229q-20 61 -21 176v225q0 98 -34.5 140.5t-112.5 42.5h-78v-584h-225zM307 788h88q68 0 101.5 35t33.5 117v141q1 148 -114 148h-109v-441z" />
+<glyph unicode="s" horiz-adv-x="765" d="M47 344v88h213v-102q0 -140 117 -140h1q116 0 116 140q0 80 -46 150t-110 128l-130 120q-66 63 -110.5 156t-44.5 206q0 174 84 267t248 93t248 -93t84 -267v-46h-213v60q0 141 -112.5 141t-112.5 -141q0 -59 24.5 -112.5t63.5 -96.5t86 -85t93 -88t85 -98.5t63.5 -124 t24.5 -155.5q0 -174 -86 -267t-250 -93t-250 93t-86 267z" />
+<glyph unicode="t" horiz-adv-x="729" d="M16 1229v205h697v-205h-236v-1229h-225v1229h-236z" />
+<glyph unicode="u" horiz-adv-x="815" d="M72 342v1092h225v-1106q1 -140 117 -140q117 0 116 140v1106h213v-1092q0 -174 -86 -267t-249.5 -93t-249.5 93t-86 267z" />
+<glyph unicode="v" horiz-adv-x="823" d="M23 1434h227l172 -1170l172 1170h207l-221 -1434h-336z" />
+<glyph unicode="w" horiz-adv-x="1153" d="M31 1434h219l121 -1131l108 1131h217l113 -1139l117 1139h196l-159 -1434h-299l-82 764l-82 -764h-310z" />
+<glyph unicode="x" horiz-adv-x="880" d="M31 0l252 737l-236 697h234l170 -529l174 529h209l-236 -697l252 -737h-238l-184 567l-186 -567h-211z" />
+<glyph unicode="y" d="M8 1434h236l172 -654l172 654h215l-285 -959v-475h-225v475z" />
+<glyph unicode="z" horiz-adv-x="757" d="M47 0v201l428 1028h-407v205h639v-201l-428 -1028h428v-205h-660z" />
+<glyph unicode="{" horiz-adv-x="526" d="M23 625v184q63 0 85.5 25.5t26.5 97.5l17 274q8 113 68.5 170.5t158.5 57.5h115v-185h-33q-55 0 -80 -31.5t-29 -113.5l-10 -205q-8 -149 -133 -182q125 -33 133 -182l10 -205q4 -82 29 -114t80 -32h33v-184h-115q-98 0 -158.5 57.5t-68.5 169.5l-17 275 q-4 72 -26.5 97.5t-85.5 25.5z" />
+<glyph unicode="|" horiz-adv-x="1024" d="M430 -133v1700h184v-1700h-184z" />
+<glyph unicode="}" horiz-adv-x="526" d="M33 1249v185h114q98 0 159 -57.5t69 -170.5l16 -274q4 -72 26.5 -97.5t86.5 -25.5v-184q-63 0 -86 -26t-27 -97l-16 -275q-8 -113 -68.5 -170t-159.5 -57h-114v184h33q55 0 79.5 32t28.5 114l10 205q8 149 133 182q-125 33 -133 182l-10 205q-4 82 -28.5 113.5 t-79.5 31.5h-33z" />
+<glyph unicode="~" d="M16 680q70 104 126.5 144t117.5 40q59 0 155.5 -62.5t137.5 -62.5q33 0 58.5 23.5t76.5 93.5l107 -111q-70 -102 -125.5 -139t-118.5 -37q-59 0 -155.5 62.5t-137.5 62.5q-35 0 -60.5 -23t-74.5 -93z" />
+<glyph unicode="&#xa1;" horiz-adv-x="389" d="M82 0v598l29 518h168l28 -518v-598h-225zM86 1217v217h217v-217h-217z" />
+<glyph unicode="&#xa2;" d="M74 426v582q0 297 239 350v106h185v-104q248 -49 247 -352v-99h-213v113q0 141 -116.5 141t-116.5 -141v-610q0 -139 117 -140q116 0 116 140v163h213v-149q0 -305 -247 -352v-105h-185v107q-240 49 -239 350z" />
+<glyph unicode="&#xa3;" d="M61 0v197q82 0 137.5 62.5t57.5 170.5h-166v174h137q-14 39 -56 123t-65.5 167t-23.5 196q0 174 84 267t248 93t247.5 -93t83.5 -267v-142h-213v156q0 141 -112.5 141t-112.5 -141q0 -113 24.5 -200t62.5 -167t50 -133h248v-174h-233q-14 -145 -115 -225h387v-205h-670z " />
+<glyph unicode="&#xa5;" d="M14 1434h236l166 -633l166 633h215l-262 -879h170v-113h-187v-92h187v-112h-187v-238h-225v238h-187v112h187v92h-187v113h168z" />
+<glyph unicode="&#xa6;" horiz-adv-x="1024" d="M430 -133v727h184v-727h-184zM430 840v727h184v-727h-184z" />
+<glyph unicode="&#xa7;" d="M72 643q0 170 141 250q-141 92 -141 266q0 129 86 210t245.5 81t245.5 -76t86 -203v-73h-213v43q0 55 -29.5 89t-82.5 34q-113 0 -113 -115q0 -45 45 -79t109.5 -61.5t130 -64.5t110.5 -109.5t45 -177.5q0 -170 -143 -251q143 -88 143 -265q0 -129 -86 -210t-245.5 -81 t-245.5 76t-86 203v102h213v-71q0 -55 29.5 -89t82.5 -34q113 0 113 115q0 45 -45 78.5t-110.5 61t-130 64.5t-109.5 110t-45 177zM287 651q0 -57 31.5 -92t93.5 -65q49 8 79.5 52t30.5 103q0 94 -127 156q-49 -8 -78.5 -51.5t-29.5 -102.5z" />
+<glyph unicode="&#xa8;" horiz-adv-x="512" d="M2 1509v197h197v-197h-197zM313 1509v197h197v-197h-197z" />
+<glyph unicode="&#xa9;" horiz-adv-x="1507" d="M41 716.5q0 317.5 204 525.5t509 208t508.5 -208t203.5 -525.5t-203.5 -525t-508.5 -207.5t-509 207.5t-204 525zM188 717q0 -256 161 -423t404.5 -167t404.5 167t161 423t-161 423t-404.5 167t-404.5 -167t-161 -423zM514 516v397q0 254 231.5 254t231.5 -254v-73h-148 v86q0 98 -79.5 98t-79.5 -98v-418q0 -96 79.5 -96t79.5 96v123h148v-115q0 -250 -231.5 -250t-231.5 250z" />
+<glyph unicode="&#xaa;" horiz-adv-x="569" d="M61 446v142h435v-142h-435zM61 879v8q0 137 76 194.5t215 61.5v94q0 76 -57 76q-70 0 -70 -88v-47h-135v39q0 227 211 227q195 0 195 -227v-535h-121l-8 98q-35 -108 -144 -108h-2q-160 0 -160 207zM205 909v-18q0 -88 74 -88q68 0 73 74v159q-147 -6 -147 -127z" />
+<glyph unicode="&#xab;" horiz-adv-x="727" d="M33 719l127 526h202l-124 -526l124 -559h-202zM365 719l127 526h202l-125 -526l125 -559h-202z" />
+<glyph unicode="&#xac;" d="M51 637v160h709v-441h-160v281h-549z" />
+<glyph unicode="&#xad;" horiz-adv-x="552" d="M72 614v205h409v-205h-409z" />
+<glyph unicode="&#xae;" horiz-adv-x="1507" d="M41 716.5q0 317.5 204 525.5t509 208t508.5 -208t203.5 -525.5t-203.5 -525t-508.5 -207.5t-509 207.5t-204 525zM188 717q0 -256 161 -423t404.5 -167t404.5 167t161 423t-161 423t-404.5 167t-404.5 -167t-161 -423zM528 279v876h238q231 0 231 -229v-19 q0 -156 -106 -202q106 -43 106 -211v-95q1 -79 19 -120h-160q-14 37 -14 122v95q0 70 -24.5 98.5t-80.5 28.5h-53v-344h-156zM684 766h64q94 0 94 104v37q0 105 -84 105h-74v-246z" />
+<glyph unicode="&#xaf;" horiz-adv-x="512" d="M20 1518v159h472v-159h-472z" />
+<glyph unicode="&#xb0;" horiz-adv-x="466" d="M31 1247q0 84 59.5 143.5t143 59.5t143 -59.5t59.5 -143.5t-59.5 -143.5t-143 -59.5t-143 59.5t-59.5 143.5zM133 1247q0 -41 30 -70.5t70.5 -29.5t70.5 29.5t30 70.5t-30 71t-70.5 30t-70.5 -30t-30 -71z" />
+<glyph unicode="&#xb1;" d="M72 356v160h254v164h-254v160h254v233h159v-233h254v-160h-254v-164h254v-160h-667z" />
+<glyph unicode="&#xb2;" horiz-adv-x="573" d="M86 719v110q0 74 28.5 136.5t70.5 108.5l84 92q42 46 71 108.5t29 134.5q0 102 -74 102t-74 -90v-96h-135v88q0 227 213 227t213 -227q0 -100 -48 -191.5t-104.5 -144.5t-98.5 -115q-34 -49 -34 -93q0 -11 2 -21h271v-129h-414z" />
+<glyph unicode="&#xb3;" horiz-adv-x="573" d="M74 1362v47q0 229 213 229t213 -229v-23q0 -145 -101 -186q100 -43 101 -190v-72q0 -229 -213 -229t-213 229v74h135v-84q0 -90 73.5 -90t73.5 104v70q0 63 -21.5 88.5t-70.5 25.5h-49v129h55q86 0 86 99v51q0 104 -73.5 104t-73.5 -90v-57h-135z" />
+<glyph unicode="&#xb4;" horiz-adv-x="512" d="M55 1509l140 228h221l-209 -228h-152z" />
+<glyph unicode="&#xb6;" d="M29 893v186q0 354 336 355h364v-1567h-164v1403h-110v-1403h-164l4 676q-127 0 -196.5 96t-69.5 254z" />
+<glyph unicode="&#xb7;" horiz-adv-x="380" d="M82 608v217h217v-217h-217z" />
+<glyph unicode="&#xb8;" horiz-adv-x="512" d="M53 -162h152v-16q0 -41 45 -41q51 0 51 49q0 53 -74 53h-20v146h98v-109q78 0 115 -21.5t37 -74.5q0 -76 -51.5 -100.5t-155.5 -24.5q-197 0 -197 119v20z" />
+<glyph unicode="&#xb9;" horiz-adv-x="409" d="M51 1413v100q74 0 105.5 29t54.5 86h94v-909h-143v694h-111z" />
+<glyph unicode="&#xba;" horiz-adv-x="573" d="M70 446v142h434v-142h-434zM70 899v318q0 109 56 168t160.5 59t161 -59.5t56.5 -167.5v-318q0 -109 -56.5 -168t-161 -59t-160.5 59t-56 168zM213 891q0 -88 73.5 -88t73.5 88v334q0 88 -73.5 88t-73.5 -88v-334z" />
+<glyph unicode="&#xbb;" horiz-adv-x="727" d="M33 160l125 559l-125 526h203l126 -526l-126 -559h-203zM365 160l124 559l-124 526h202l127 -526l-127 -559h-202z" />
+<glyph unicode="&#xbc;" horiz-adv-x="1284" d="M133 1219v100q74 0 105.5 28.5t54.5 86.5h94v-910h-143v695h-111zM328 0l565 1434h133l-565 -1434h-133zM760 164v131l260 614h156v-614h67v-131h-67v-164h-142v164h-274zM889 295h145v336z" />
+<glyph unicode="&#xbd;" horiz-adv-x="1284" d="M133 1219v100q74 0 105.5 28.5t54.5 86.5h94v-910h-143v695h-111zM266 0l565 1434h134l-566 -1434h-133zM797 606v88q0 227 213 228h1q212 0 212 -228q0 -100 -48.5 -191t-104.5 -144.5t-98 -114.5q-34 -50 -34 -94q0 -11 2 -21h270v-129h-413v111q0 74 28.5 136 t70.5 108l84 93q42 46 70.5 108t28.5 134q0 102 -74 103q-73 0 -73 -91v-96h-135z" />
+<glyph unicode="&#xbe;" horiz-adv-x="1284" d="M74 1167v47q0 229 213 230h1q212 0 212 -230v-22q0 -145 -101 -186q100 -43 101 -191v-72q0 -229 -213 -229t-213 229v74h135v-84q0 -90 73 -90v1q74 0 74 104v69q0 63 -21.5 89t-70.5 26h-49v129h55q86 0 86 98v51q0 104 -74 105q-73 0 -73 -90v-58h-135zM348 0 l565 1434h134l-566 -1434h-133zM760 164v131l260 614h156v-614h67v-131h-67v-164h-142v164h-274zM889 295h145v336z" />
+<glyph unicode="&#xbf;" horiz-adv-x="737" d="M33 344q0 125 42 228.5t91 159.5t91 137t42 167q0 45 -8 80h201q12 -37 12 -88q0 -104 -39 -191t-84 -141.5t-84 -150.5t-39 -215q0 -141 112 -142h1q112 0 112 142v155h213v-141q0 -174 -84 -267t-247.5 -93t-247.5 93t-84 267zM285 1217v217h217v-217h-217z" />
+<glyph unicode="&#xc0;" horiz-adv-x="833" d="M23 0l229 1434h330l229 -1434h-227l-39 260h-277l-39 -260h-206zM170 1737h231l140 -228h-162zM297 455h217l-108 725z" />
+<glyph unicode="&#xc1;" horiz-adv-x="833" d="M23 0l229 1434h330l229 -1434h-227l-39 260h-277l-39 -260h-206zM297 455h217l-108 725zM297 1509l139 228h221l-208 -228h-152z" />
+<glyph unicode="&#xc2;" horiz-adv-x="833" d="M23 0l229 1434h330l229 -1434h-227l-39 260h-277l-39 -260h-206zM133 1509l182 228h203l182 -228h-192l-92 113l-90 -113h-193zM297 455h217l-108 725z" />
+<glyph unicode="&#xc3;" horiz-adv-x="833" d="M23 0l229 1434h330l229 -1434h-227l-39 260h-277l-39 -260h-206zM139 1577q51 139 174 139q47 0 102.5 -25.5t82.5 -25.5q59 0 88 59l108 -75q-51 -139 -174 -140q-45 0 -100 26t-84 26q-59 0 -88 -60zM297 455h217l-108 725z" />
+<glyph unicode="&#xc4;" horiz-adv-x="833" d="M23 0l229 1434h330l229 -1434h-227l-39 260h-277l-39 -260h-206zM162 1509v197h196v-197h-196zM297 455h217l-108 725zM473 1509v197h197v-197h-197z" />
+<glyph unicode="&#xc5;" horiz-adv-x="833" d="M23 0l229 1434h330l229 -1434h-227l-39 260h-277l-39 -260h-206zM252 1667q0 70 47 117t116.5 47t117 -47t47.5 -117t-47.5 -117t-117 -47t-116.5 47t-47 117zM297 455h217l-108 725zM354 1667q0 -27 17.5 -44t44 -17t44 17t17.5 44t-17.5 44.5t-44 17.5t-44 -17.5 t-17.5 -44.5z" />
+<glyph unicode="&#xc6;" horiz-adv-x="1187" d="M8 0l383 1434h739v-205h-389v-400h310v-204h-310v-420h389v-205h-614v260h-227l-66 -260h-215zM340 455h176v690z" />
+<glyph unicode="&#xc7;" horiz-adv-x="790" d="M63 344v746q0 174 86.5 267t250 93t249.5 -93t86 -267v-140h-213v154q0 141 -116.5 141t-116.5 -141v-774q0 -139 117 -140q116 0 116 140v205h213v-191q0 -160 -74.5 -253t-216.5 -105v-66q78 0 115 -21.5t37 -74.5q0 -76 -51 -100.5t-156 -24.5q-197 0 -196 119v20h151 v-16q0 -41 45 -41q51 0 51 49q0 53 -73 53h-21v105q-283 29 -283 356z" />
+<glyph unicode="&#xc8;" horiz-adv-x="753" d="M82 0v1434h614v-205h-389v-400h309v-204h-309v-420h389v-205h-614zM139 1737h232l139 -228h-162z" />
+<glyph unicode="&#xc9;" horiz-adv-x="753" d="M82 0v1434h614v-205h-389v-400h309v-204h-309v-420h389v-205h-614zM268 1509l140 228h221l-209 -228h-152z" />
+<glyph unicode="&#xca;" horiz-adv-x="753" d="M82 0v1434h614v-205h-389v-400h309v-204h-309v-420h389v-205h-614zM102 1509l183 228h202l183 -228h-193l-92 113l-90 -113h-193z" />
+<glyph unicode="&#xcb;" horiz-adv-x="753" d="M82 0v1434h614v-205h-389v-400h309v-204h-309v-420h389v-205h-614zM133 1509v197h197v-197h-197zM444 1509v197h197v-197h-197z" />
+<glyph unicode="&#xcc;" horiz-adv-x="389" d="M-51 1737h231l139 -228h-161zM82 0v1434h225v-1434h-225z" />
+<glyph unicode="&#xcd;" horiz-adv-x="389" d="M76 1509l139 228h221l-209 -228h-151zM82 0v1434h225v-1434h-225z" />
+<glyph unicode="&#xce;" horiz-adv-x="389" d="M-88 1509l182 228h203l182 -228h-192l-92 113l-91 -113h-192zM82 0v1434h225v-1434h-225z" />
+<glyph unicode="&#xcf;" horiz-adv-x="389" d="M-59 1509v197h196v-197h-196zM82 0v1434h225v-1434h-225zM252 1509v197h197v-197h-197z" />
+<glyph unicode="&#xd0;" horiz-adv-x="835" d="M8 625v184h74v625h356q336 0 336 -355v-725q0 -354 -336 -354h-356v625h-74zM307 205h127q115 0 115 139v746q0 139 -115 139h-127v-420h139v-184h-139v-420z" />
+<glyph unicode="&#xd1;" horiz-adv-x="874" d="M80 0v1434h282l232 -859v859h201v-1434h-232l-280 1038v-1038h-203zM160 1577q51 139 174 139q47 0 102 -25.5t82 -25.5q59 0 88 59l109 -75q-51 -139 -174 -140q-45 0 -100.5 26t-84.5 26q-59 0 -88 -60z" />
+<glyph unicode="&#xd2;" d="M63 344v746q0 172 88.5 266t254 94t254 -94t88.5 -266v-746q0 -172 -88.5 -266t-254 -94t-254 94t-88.5 266zM158 1737h231l139 -228h-161zM289 330q0 -141 117 -142q116 0 116 142v774q0 141 -116.5 141t-116.5 -141v-774z" />
+<glyph unicode="&#xd3;" d="M63 344v746q0 172 88.5 266t254 94t254 -94t88.5 -266v-746q0 -172 -88.5 -266t-254 -94t-254 94t-88.5 266zM287 1509l139 228h221l-209 -228h-151zM289 330q0 -141 117 -142q116 0 116 142v774q0 141 -116.5 141t-116.5 -141v-774z" />
+<glyph unicode="&#xd4;" d="M63 344v746q0 172 88.5 266t254 94t254 -94t88.5 -266v-746q0 -172 -88.5 -266t-254 -94t-254 94t-88.5 266zM121 1509l182 228h203l182 -228h-192l-93 113l-90 -113h-192zM289 330q0 -141 117 -142q116 0 116 142v774q0 141 -116.5 141t-116.5 -141v-774z" />
+<glyph unicode="&#xd5;" d="M63 344v746q0 172 88.5 266t254 94t254 -94t88.5 -266v-746q0 -172 -88.5 -266t-254 -94t-254 94t-88.5 266zM129 1577q51 139 174 139q45 0 100 -25.5t84 -25.5q59 0 88 59l109 -75q-51 -139 -174 -140q-47 0 -102.5 26t-81.5 26q-59 0 -88 -60zM289 330 q0 -141 117 -142q116 0 116 142v774q0 141 -116.5 141t-116.5 -141v-774z" />
+<glyph unicode="&#xd6;" d="M63 344v746q0 172 88.5 266t254 94t254 -94t88.5 -266v-746q0 -172 -88.5 -266t-254 -94t-254 94t-88.5 266zM152 1509v197h196v-197h-196zM289 330q0 -141 117 -142q116 0 116 142v774q0 141 -116.5 141t-116.5 -141v-774zM463 1509v197h196v-197h-196z" />
+<glyph unicode="&#xd7;" d="M78 500l217 217l-215 215l108 108l218 -215l217 217l108 -108l-217 -217l217 -217l-108 -109l-217 217l-220 -217z" />
+<glyph unicode="&#xd8;" d="M63 344v746q0 172 88.5 266t254.5 94q123 0 204 -53l41 112l76 -26l-53 -146q74 -88 74 -247v-746q0 -172 -88.5 -266t-253.5 -94q-127 0 -205 51l-41 -111l-76 27l51 143q-72 94 -72 250zM289 514l229 633q-14 98 -112 98q-117 0 -117 -141v-590zM291 287 q17 -99 115 -99q117 0 116 142v590z" />
+<glyph unicode="&#xd9;" horiz-adv-x="815" d="M72 342v1092h225v-1106q0 -139 117 -140q116 0 116 140v1106h213v-1092q0 -174 -86 -267t-249.5 -93t-249.5 93t-86 267zM162 1737h231l139 -228h-161z" />
+<glyph unicode="&#xda;" horiz-adv-x="815" d="M72 342v1092h225v-1106q0 -139 117 -140q116 0 116 140v1106h213v-1092q0 -174 -86 -267t-249.5 -93t-249.5 93t-86 267zM291 1509l139 228h221l-209 -228h-151z" />
+<glyph unicode="&#xdb;" horiz-adv-x="815" d="M72 342v1092h225v-1106q0 -139 117 -140q116 0 116 140v1106h213v-1092q0 -174 -86 -267t-249.5 -93t-249.5 93t-86 267zM127 1509l182 228h203l182 -228h-192l-92 113l-91 -113h-192z" />
+<glyph unicode="&#xdc;" horiz-adv-x="815" d="M72 342v1092h225v-1106q0 -139 117 -140q116 0 116 140v1106h213v-1092q0 -174 -86 -267t-249.5 -93t-249.5 93t-86 267zM158 1509v197h196v-197h-196zM469 1509v197h197v-197h-197z" />
+<glyph unicode="&#xdd;" d="M8 1434h236l172 -654l172 654h215l-285 -959v-475h-225v475zM295 1509l139 228h221l-209 -228h-151z" />
+<glyph unicode="&#xde;" horiz-adv-x="772" d="M82 0v1434h225v-164h107q336 0 336 -355v-186q0 -354 -336 -354h-107v-375h-225zM307 580h107q55 0 82.5 30.5t27.5 104.5v215q0 74 -27.5 104.5t-82.5 30.5h-107v-485z" />
+<glyph unicode="&#xdf;" horiz-adv-x="1531" d="M47 344v88h213v-102q0 -139 117 -140h1q116 0 116 140q0 80 -45.5 150.5t-110.5 127.5l-130 120q-65 63 -110 156t-45 206q0 174 84 267t248 93t248 -93t84 -267v-46h-213v60q0 141 -112.5 141t-112.5 -141q0 -59 24.5 -112.5t63.5 -96.5t86 -85t93 -88t85 -98.5 t63.5 -124t24.5 -155.5q0 -174 -86 -267t-250 -93t-250 93t-86 267zM813 344v88h213v-102q0 -139 117 -139q0 -1 1 -1q116 0 116 140q0 80 -45.5 150.5t-110.5 128.5l-130 120q-65 62 -110 155t-45 206q0 174 84 267t248 93t248 -93t84 -267v-46h-213v60q0 141 -113 141 t-113 -141q0 -59 25 -112.5t63.5 -96.5t86 -85t93.5 -88t85 -98.5t63.5 -124t24.5 -155.5q0 -174 -86 -267t-250 -93t-250 93t-86 267z" />
+<glyph unicode="&#xe0;" horiz-adv-x="833" d="M23 0l229 1434h330l229 -1434h-227l-39 260h-277l-39 -260h-206zM170 1737h231l140 -228h-162zM297 455h217l-108 725z" />
+<glyph unicode="&#xe1;" horiz-adv-x="833" d="M23 0l229 1434h330l229 -1434h-227l-39 260h-277l-39 -260h-206zM297 455h217l-108 725zM297 1509l139 228h221l-208 -228h-152z" />
+<glyph unicode="&#xe2;" horiz-adv-x="833" d="M23 0l229 1434h330l229 -1434h-227l-39 260h-277l-39 -260h-206zM133 1509l182 228h203l182 -228h-192l-92 113l-90 -113h-193zM297 455h217l-108 725z" />
+<glyph unicode="&#xe3;" horiz-adv-x="833" d="M23 0l229 1434h330l229 -1434h-227l-39 260h-277l-39 -260h-206zM139 1577q51 139 174 139q47 0 102.5 -25.5t82.5 -25.5q59 0 88 59l108 -75q-51 -139 -174 -140q-45 0 -100 26t-84 26q-59 0 -88 -60zM297 455h217l-108 725z" />
+<glyph unicode="&#xe4;" horiz-adv-x="833" d="M23 0l229 1434h330l229 -1434h-227l-39 260h-277l-39 -260h-206zM162 1509v197h196v-197h-196zM297 455h217l-108 725zM473 1509v197h197v-197h-197z" />
+<glyph unicode="&#xe5;" horiz-adv-x="833" d="M23 0l229 1434h330l229 -1434h-227l-39 260h-277l-39 -260h-206zM252 1667q0 70 47 117t116.5 47t117 -47t47.5 -117t-47.5 -117t-117 -47t-116.5 47t-47 117zM297 455h217l-108 725zM354 1667q0 -27 17.5 -44t44 -17t44 17t17.5 44t-17.5 44.5t-44 17.5t-44 -17.5 t-17.5 -44.5z" />
+<glyph unicode="&#xe6;" horiz-adv-x="1187" d="M8 0l383 1434h739v-205h-389v-400h310v-204h-310v-420h389v-205h-614v260h-227l-66 -260h-215zM340 455h176v690z" />
+<glyph unicode="&#xe7;" horiz-adv-x="790" d="M63 344v746q0 174 86.5 267t250 93t249.5 -93t86 -267v-140h-213v154q0 141 -116.5 141t-116.5 -141v-774q0 -139 117 -140q116 0 116 140v205h213v-191q0 -160 -74.5 -253t-216.5 -105v-66q78 0 115 -21.5t37 -74.5q0 -76 -51 -100.5t-156 -24.5q-197 0 -196 119v20h151 v-16q0 -41 45 -41q51 0 51 49q0 53 -73 53h-21v105q-283 29 -283 356z" />
+<glyph unicode="&#xe8;" horiz-adv-x="753" d="M82 0v1434h614v-205h-389v-400h309v-204h-309v-420h389v-205h-614zM139 1737h232l139 -228h-162z" />
+<glyph unicode="&#xe9;" horiz-adv-x="753" d="M82 0v1434h614v-205h-389v-400h309v-204h-309v-420h389v-205h-614zM268 1509l140 228h221l-209 -228h-152z" />
+<glyph unicode="&#xea;" horiz-adv-x="753" d="M82 0v1434h614v-205h-389v-400h309v-204h-309v-420h389v-205h-614zM102 1509l183 228h202l183 -228h-193l-92 113l-90 -113h-193z" />
+<glyph unicode="&#xeb;" horiz-adv-x="753" d="M82 0v1434h614v-205h-389v-400h309v-204h-309v-420h389v-205h-614zM133 1509v197h197v-197h-197zM444 1509v197h197v-197h-197z" />
+<glyph unicode="&#xec;" horiz-adv-x="389" d="M-51 1737h231l139 -228h-161zM82 0v1434h225v-1434h-225z" />
+<glyph unicode="&#xed;" horiz-adv-x="389" d="M76 1509l139 228h221l-209 -228h-151zM82 0v1434h225v-1434h-225z" />
+<glyph unicode="&#xee;" horiz-adv-x="389" d="M-88 1509l182 228h203l182 -228h-192l-92 113l-91 -113h-192zM82 0v1434h225v-1434h-225z" />
+<glyph unicode="&#xef;" horiz-adv-x="389" d="M-59 1509v197h196v-197h-196zM82 0v1434h225v-1434h-225zM252 1509v197h197v-197h-197z" />
+<glyph unicode="&#xf0;" horiz-adv-x="835" d="M8 625v184h74v625h356q336 0 336 -355v-725q0 -354 -336 -354h-356v625h-74zM307 205h127q115 0 115 139v746q0 139 -115 139h-127v-420h139v-184h-139v-420z" />
+<glyph unicode="&#xf1;" horiz-adv-x="874" d="M80 0v1434h282l232 -859v859h201v-1434h-232l-280 1038v-1038h-203zM160 1577q51 139 174 139q47 0 102 -25.5t82 -25.5q59 0 88 59l109 -75q-51 -139 -174 -140q-45 0 -100.5 26t-84.5 26q-59 0 -88 -60z" />
+<glyph unicode="&#xf2;" d="M63 344v746q0 172 88.5 266t254 94t254 -94t88.5 -266v-746q0 -172 -88.5 -266t-254 -94t-254 94t-88.5 266zM158 1737h231l139 -228h-161zM289 330q0 -141 117 -142q116 0 116 142v774q0 141 -116.5 141t-116.5 -141v-774z" />
+<glyph unicode="&#xf3;" d="M63 344v746q0 172 88.5 266t254 94t254 -94t88.5 -266v-746q0 -172 -88.5 -266t-254 -94t-254 94t-88.5 266zM287 1509l139 228h221l-209 -228h-151zM289 330q0 -141 117 -142q116 0 116 142v774q0 141 -116.5 141t-116.5 -141v-774z" />
+<glyph unicode="&#xf4;" d="M63 344v746q0 172 88.5 266t254 94t254 -94t88.5 -266v-746q0 -172 -88.5 -266t-254 -94t-254 94t-88.5 266zM121 1509l182 228h203l182 -228h-192l-93 113l-90 -113h-192zM289 330q0 -141 117 -142q116 0 116 142v774q0 141 -116.5 141t-116.5 -141v-774z" />
+<glyph unicode="&#xf5;" d="M63 344v746q0 172 88.5 266t254 94t254 -94t88.5 -266v-746q0 -172 -88.5 -266t-254 -94t-254 94t-88.5 266zM129 1577q51 139 174 139q45 0 100 -25.5t84 -25.5q59 0 88 59l109 -75q-51 -139 -174 -140q-47 0 -102.5 26t-81.5 26q-59 0 -88 -60zM289 330 q0 -141 117 -142q116 0 116 142v774q0 141 -116.5 141t-116.5 -141v-774z" />
+<glyph unicode="&#xf6;" d="M63 344v746q0 172 88.5 266t254 94t254 -94t88.5 -266v-746q0 -172 -88.5 -266t-254 -94t-254 94t-88.5 266zM152 1509v197h196v-197h-196zM289 330q0 -141 117 -142q116 0 116 142v774q0 141 -116.5 141t-116.5 -141v-774zM463 1509v197h196v-197h-196z" />
+<glyph unicode="&#xf7;" d="M51 637v160h709v-160h-709zM297 295v217h217v-217h-217zM297 920v217h217v-217h-217z" />
+<glyph unicode="&#xf8;" d="M63 344v746q0 172 88.5 266t254.5 94q123 0 204 -53l41 112l76 -26l-53 -146q74 -88 74 -247v-746q0 -172 -88.5 -266t-253.5 -94q-127 0 -205 51l-41 -111l-76 27l51 143q-72 94 -72 250zM289 514l229 633q-14 98 -112 98q-117 0 -117 -141v-590zM291 287 q17 -99 115 -99q117 0 116 142v590z" />
+<glyph unicode="&#xf9;" horiz-adv-x="815" d="M72 342v1092h225v-1106q0 -139 117 -140q116 0 116 140v1106h213v-1092q0 -174 -86 -267t-249.5 -93t-249.5 93t-86 267zM162 1737h231l139 -228h-161z" />
+<glyph unicode="&#xfa;" horiz-adv-x="815" d="M72 342v1092h225v-1106q0 -139 117 -140q116 0 116 140v1106h213v-1092q0 -174 -86 -267t-249.5 -93t-249.5 93t-86 267zM291 1509l139 228h221l-209 -228h-151z" />
+<glyph unicode="&#xfb;" horiz-adv-x="815" d="M72 342v1092h225v-1106q0 -139 117 -140q116 0 116 140v1106h213v-1092q0 -174 -86 -267t-249.5 -93t-249.5 93t-86 267zM127 1509l182 228h203l182 -228h-192l-92 113l-91 -113h-192z" />
+<glyph unicode="&#xfc;" horiz-adv-x="815" d="M72 342v1092h225v-1106q0 -139 117 -140q116 0 116 140v1106h213v-1092q0 -174 -86 -267t-249.5 -93t-249.5 93t-86 267zM158 1509v197h196v-197h-196zM469 1509v197h197v-197h-197z" />
+<glyph unicode="&#xfd;" d="M8 1434h236l172 -654l172 654h215l-285 -959v-475h-225v475zM295 1509l139 228h221l-209 -228h-151z" />
+<glyph unicode="&#xfe;" horiz-adv-x="772" d="M82 0v1434h225v-164h107q336 0 336 -355v-186q0 -354 -336 -354h-107v-375h-225zM307 580h107q55 0 82.5 30.5t27.5 104.5v215q0 74 -27.5 104.5t-82.5 30.5h-107v-485z" />
+<glyph unicode="&#xff;" d="M8 1434h236l172 -654l172 654h215l-285 -959v-475h-225v475zM160 1509v197h196v-197h-196zM471 1509v197h197v-197h-197z" />
+<glyph unicode="&#x152;" horiz-adv-x="1200" d="M61 354v725q0 354 336 355h746v-205h-389v-400h309v-204h-309v-420h389v-205h-746q-336 0 -336 354zM287 344q0 -139 114 -139h127v1024h-127q-115 0 -114 -139v-746z" />
+<glyph unicode="&#x153;" horiz-adv-x="1200" d="M61 354v725q0 354 336 355h746v-205h-389v-400h309v-204h-309v-420h389v-205h-746q-336 0 -336 354zM287 344q0 -139 114 -139h127v1024h-127q-115 0 -114 -139v-746z" />
+<glyph unicode="&#x178;" d="M8 1434h236l172 -654l172 654h215l-285 -959v-475h-225v475zM160 1509v197h196v-197h-196zM471 1509v197h197v-197h-197z" />
+<glyph unicode="&#x2c6;" horiz-adv-x="512" d="M-27 1509l183 228h202l183 -228h-193l-92 113l-90 -113h-193z" />
+<glyph unicode="&#x2dc;" horiz-adv-x="512" d="M-20 1577q51 139 174 139q47 0 102 -25.5t82 -25.5q59 0 88 59l109 -75q-51 -139 -175 -140q-45 0 -100 26t-84 26q-59 0 -88 -60z" />
+<glyph unicode="&#x2000;" horiz-adv-x="915" />
+<glyph unicode="&#x2001;" horiz-adv-x="1831" />
+<glyph unicode="&#x2002;" horiz-adv-x="915" />
+<glyph unicode="&#x2003;" horiz-adv-x="1831" />
+<glyph unicode="&#x2004;" horiz-adv-x="610" />
+<glyph unicode="&#x2005;" horiz-adv-x="457" />
+<glyph unicode="&#x2006;" horiz-adv-x="305" />
+<glyph unicode="&#x2007;" horiz-adv-x="305" />
+<glyph unicode="&#x2008;" horiz-adv-x="228" />
+<glyph unicode="&#x2009;" horiz-adv-x="366" />
+<glyph unicode="&#x200a;" horiz-adv-x="101" />
+<glyph unicode="&#x2010;" horiz-adv-x="552" d="M72 614v205h409v-205h-409z" />
+<glyph unicode="&#x2011;" horiz-adv-x="552" d="M72 614v205h409v-205h-409z" />
+<glyph unicode="&#x2012;" horiz-adv-x="552" d="M72 614v205h409v-205h-409z" />
+<glyph unicode="&#x2013;" horiz-adv-x="1024" d="M0 625v184h1024v-184h-1024z" />
+<glyph unicode="&#x2014;" horiz-adv-x="2048" d="M0 625v184h2048v-184h-2048z" />
+<glyph unicode="&#x2018;" horiz-adv-x="380" d="M82 1012v194l98 228h92l-59 -205h86v-217h-217z" />
+<glyph unicode="&#x2019;" horiz-adv-x="380" d="M82 1217v217h217v-195l-98 -227h-92l59 205h-86z" />
+<glyph unicode="&#x201a;" horiz-adv-x="380" d="M82 0v217h217v-194l-98 -228h-92l59 205h-86z" />
+<glyph unicode="&#x201c;" horiz-adv-x="679" d="M82 1012v194l98 228h92l-59 -205h86v-217h-217zM381 1012v194l98 228h92l-59 -205h86v-217h-217z" />
+<glyph unicode="&#x201d;" horiz-adv-x="679" d="M82 1217v217h217v-195l-98 -227h-92l59 205h-86zM381 1217v217h217v-195l-98 -227h-92l59 205h-86z" />
+<glyph unicode="&#x201e;" horiz-adv-x="679" d="M82 0v217h217v-194l-98 -228h-92l59 205h-86zM381 0v217h217v-194l-98 -228h-92l59 205h-86z" />
+<glyph unicode="&#x2022;" d="M121 717q0 119 83 201.5t201.5 82.5t201.5 -82.5t83 -201.5t-83 -202t-201.5 -83t-201.5 83t-83 202z" />
+<glyph unicode="&#x2026;" horiz-adv-x="978" d="M82 0v217h217v-217h-217zM381 0v217h217v-217h-217zM680 0v217h217v-217h-217z" />
+<glyph unicode="&#x202f;" horiz-adv-x="366" />
+<glyph unicode="&#x2039;" horiz-adv-x="401" d="M33 719l123 545h213l-121 -545l121 -578h-213z" />
+<glyph unicode="&#x203a;" horiz-adv-x="401" d="M33 141l121 578l-121 545h213l123 -545l-123 -578h-213z" />
+<glyph unicode="&#x205f;" horiz-adv-x="457" />
+<glyph unicode="&#x20ac;" d="M39 553v113h57v112h-57v113h57v199q0 174 83 267t247 93t247 -93t83 -267v-105h-213v119q0 141 -110.5 141t-110.5 -141v-213h315v-113h-315v-112h315v-113h-315v-223q0 -139 110 -140h1q110 0 110 140v129h213v-115q0 -174 -83 -267t-247 -93t-247 93t-83 267v209h-57z " />
+<glyph unicode="&#x2122;" horiz-adv-x="1200" d="M20 1303v131h443v-131h-150v-598h-143v598h-150zM549 705v729h199l106 -512l96 512h199v-729h-135v518l-96 -518h-136l-108 514v-514h-125z" />
+<glyph unicode="&#xe000;" horiz-adv-x="1435" d="M0 1435h1435v-1435h-1435v1435z" />
+<glyph unicode="&#xfb01;" horiz-adv-x="1093" d="M82 0v1434h596v-205h-371v-432h291v-205h-291v-592h-225zM786 0v1434h225v-1434h-225z" />
+<glyph unicode="&#xfb02;" horiz-adv-x="1398" d="M82 0v1434h596v-205h-371v-432h291v-205h-291v-592h-225zM786 0v1434h225v-1229h371v-205h-596z" />
+<glyph unicode="&#xfb03;" horiz-adv-x="1797" d="M82 0v1434h596v-205h-371v-432h291v-205h-291v-592h-225zM786 0v1434h596v-205h-371v-432h291v-205h-291v-592h-225zM1490 0v1434h225v-1434h-225z" />
+<glyph unicode="&#xfb04;" horiz-adv-x="2102" d="M82 0v1434h596v-205h-371v-432h291v-205h-291v-592h-225zM786 0v1434h596v-205h-371v-432h291v-205h-291v-592h-225zM1490 0v1434h225v-1229h371v-205h-596z" />
+</font>
+</defs></svg> 

css/fonts.css

@@ -0,0 +1,16 @@
+/* Generated by Font Squirrel (http://www.fontsquirrel.com) on July 28, 2012 03:24:04 PM America/New_York */
+
+
+
+@font-face {
+    font-family: 'BebasNeueRegular';
+    src: url('BebasNeue-webfont.eot');
+    src: url('BebasNeue-webfont.eot?#iefix') format('embedded-opentype'),
+         url('BebasNeue-webfont.woff') format('woff'),
+         url('BebasNeue-webfont.ttf') format('truetype'),
+         url('BebasNeue-webfont.svg#BebasNeueRegular') format('svg');
+    font-weight: normal;
+    font-style: normal;
+
+}
+

geometries/booster/booster.js

@@ -0,0 +1,45 @@
+{
+
+    "metadata" :
+    {
+        "formatVersion" : 3.1,
+        "sourceFile"    : "booster.obj",
+        "generatedBy"   : "OBJConverter",
+        "vertices"      : 48,
+        "faces"         : 72,
+        "normals"       : 48,
+        "colors"        : 0,
+        "uvs"           : 52,
+        "materials"     : 1
+    },
+
+    "scale" : 1.000000,
+
+    "materials": [	{
+	"DbgColor" : 15658734,
+	"DbgIndex" : 0,
+	"DbgName" : "02___Default",
+	"colorAmbient" : [0.588235, 0.588235, 0.588235],
+	"colorDiffuse" : [0.588235, 0.588235, 0.588235],
+	"colorSpecular" : [0.0, 0.0, 0.0],
+	"illumination" : 2,
+	"opticalDensity" : 1.5,
+	"specularCoef" : 9.999999,
+	"transparency" : 0.0
+	}],
+
+    "vertices": [0.177146,0.211115,-0.000000,0.258970,0.094257,0.000000,0.369958,0.134654,-0.121302,0.253066,0.301592,-0.121302,0.271404,-0.047856,0.000000,0.387720,-0.068365,-0.121302,0.211115,-0.177146,0.000000,0.301592,-0.253066,-0.121302,0.094257,-0.258970,0.000000,0.134654,-0.369958,-0.121302,-0.047856,-0.271404,0.000000,-0.068365,-0.387720,-0.121302,-0.177146,-0.211115,0.000000,-0.253066,-0.301592,-0.121302,-0.258970,-0.094258,-0.000000,-0.369958,-0.134654,-0.121302,-0.271404,0.047856,-0.000000,-0.387720,0.068365,-0.121302,-0.211115,0.177146,-0.000000,-0.301592,0.253066,-0.121302,-0.094258,0.258970,-0.000000,-0.134654,0.369958,-0.121302,0.047856,0.271404,-0.000000,0.068365,0.387720,-0.121302,0.480945,0.175050,-0.659920,0.328986,0.392070,-0.659920,0.504035,-0.088875,-0.659920,0.392070,-0.328986,-0.659920,0.175050,-0.480945,-0.659920,-0.088875,-0.504035,-0.659920,-0.328986,-0.392070,-0.659920,-0.480945,-0.175050,-0.659920,-0.504035,0.088875,-0.659920,-0.392070,0.328985,-0.659920,-0.175050,0.480945,-0.659920,0.088875,0.504035,-0.659920,0.266370,0.096951,-2.900593,0.182208,0.217146,-2.900593,0.279158,-0.049223,-2.900593,0.217146,-0.182208,-2.900593,0.096951,-0.266370,-2.900593,-0.049223,-0.279158,-2.900593,-0.182207,-0.217146,-2.900593,-0.266369,-0.096951,-2.900593,-0.279158,0.049223,-2.900593,-0.217146,0.182207,-2.900593,-0.096951,0.266369,-2.900593,0.049223,0.279158,-2.900593],
+
+    "morphTargets": [],
+
+    "morphColors": [],
+
+    "normals": [0.46054,0.54885,0.69762,0.67326,0.24505,0.69762,0.83624,0.30436,0.45615,0.57202,0.68171,0.45615,0.70559,-0.12441,0.69762,0.87638,-0.15453,0.45615,0.54885,-0.46054,0.69762,0.68171,-0.57202,0.45615,0.24505,-0.67326,0.69762,0.30436,-0.83624,0.45615,-0.12441,-0.70559,0.69762,-0.15453,-0.87638,0.45615,-0.46054,-0.54885,0.69762,-0.57202,-0.68171,0.45615,-0.67326,-0.24505,0.69762,-0.83624,-0.30436,0.45615,-0.70559,0.12441,0.69762,-0.87638,0.15453,0.45615,-0.54885,0.46054,0.69762,-0.68171,0.57202,0.45615,-0.24505,0.67326,0.69762,-0.30436,0.83624,0.45615,0.12441,0.70559,0.69762,0.15453,0.87638,0.45615,0.93823,0.34149,0.055692,0.64179,0.76486,0.055692,0.98328,-0.17338,0.055692,0.76486,-0.64179,0.055692,0.34149,-0.93823,0.055692,-0.17338,-0.98328,0.055692,-0.64179,-0.76486,0.055692,-0.93823,-0.34149,0.055692,-0.98328,0.17338,0.055692,-0.76486,0.64179,0.055692,-0.34149,0.93823,0.055692,0.17338,0.98328,0.055692,0.93485,0.34026,-0.10139,0.63948,0.7621,-0.10139,0.97973,-0.17275,-0.10139,0.7621,-0.63948,-0.10139,0.34026,-0.93485,-0.10139,-0.17275,-0.97973,-0.10139,-0.63948,-0.7621,-0.10139,-0.93485,-0.34026,-0.10139,-0.97973,0.17275,-0.10139,-0.7621,0.63948,-0.10139,-0.34026,0.93485,-0.10139,0.17275,0.97973,-0.10139],
+
+    "colors": [],
+
+    "uvs": [[0.58311,1.0001,0.49977,1.0001,0.49977,0.9583,0.58311,0.9583,0.41644,1.0001,0.41644,0.9583,0.33311,1.0001,0.33311,0.9583,0.24977,1.0001,0.24977,0.9583,0.16644,1.0001,0.16644,0.9583,0.083106,1.0001,0.083106,0.9583,-0.000227,1.0001,-0.000227,0.9583,0.99977,1.0001,0.91644,1.0001,0.91644,0.9583,0.99977,0.9583,0.83311,1.0001,0.83311,0.9583,0.74977,1.0001,0.74977,0.9583,0.66644,1.0001,0.66644,0.9583,0.49977,0.77261,0.58311,0.77261,0.41644,0.77261,0.33311,0.77261,0.24977,0.77261,0.16644,0.77261,0.083106,0.77261,-0.000227,0.77261,0.91644,0.77261,0.99977,0.77261,0.83311,0.77261,0.74977,0.77261,0.66644,0.77261,0.49977,0.000123,0.58311,0.000123,0.41644,0.000123,0.33311,0.000123,0.24977,0.000123,0.16644,0.000123,0.083106,0.000123,-0.000227,0.000123,0.91644,0.000123,0.99977,0.000123,0.83311,0.000123,0.74977,0.000123,0.66644,0.000123]],
+
+    "faces": [42,0,1,2,0,0,1,2,0,1,2,42,2,3,0,0,2,3,0,2,3,0,42,1,4,5,0,1,4,5,1,4,5,42,5,2,1,0,5,2,1,5,2,1,42,4,6,7,0,4,6,7,4,6,7,42,7,5,4,0,7,5,4,7,5,4,42,6,8,9,0,6,8,9,6,8,9,42,9,7,6,0,9,7,6,9,7,6,42,8,10,11,0,8,10,11,8,10,11,42,11,9,8,0,11,9,8,11,9,8,42,10,12,13,0,10,12,13,10,12,13,42,13,11,10,0,13,11,10,13,11,10,42,12,14,15,0,12,14,15,12,14,15,42,15,13,12,0,15,13,12,15,13,12,42,14,16,17,0,16,17,18,14,16,17,42,17,15,14,0,18,19,16,17,15,14,42,16,18,19,0,17,20,21,16,18,19,42,19,17,16,0,21,18,17,19,17,16,42,18,20,21,0,20,22,23,18,20,21,42,21,19,18,0,23,21,20,21,19,18,42,20,22,23,0,22,24,25,20,22,23,42,23,21,20,0,25,23,22,23,21,20,42,22,0,3,0,24,0,3,22,0,3,42,3,23,22,0,3,25,24,3,23,22,42,3,2,24,0,3,2,26,3,2,24,42,24,25,3,0,26,27,3,24,25,3,42,2,5,26,0,2,5,28,2,5,26,42,26,24,2,0,28,26,2,26,24,2,42,5,7,27,0,5,7,29,5,7,27,42,27,26,5,0,29,28,5,27,26,5,42,7,9,28,0,7,9,30,7,9,28,42,28,27,7,0,30,29,7,28,27,7,42,9,11,29,0,9,11,31,9,11,29,42,29,28,9,0,31,30,9,29,28,9,42,11,13,30,0,11,13,32,11,13,30,42,30,29,11,0,32,31,11,30,29,11,42,13,15,31,0,13,15,33,13,15,31,42,31,30,13,0,33,32,13,31,30,13,42,15,17,32,0,19,18,34,15,17,32,42,32,31,15,0,34,35,19,32,31,15,42,17,19,33,0,18,21,36,17,19,33,42,33,32,17,0,36,34,18,33,32,17,42,19,21,34,0,21,23,37,19,21,34,42,34,33,19,0,37,36,21,34,33,19,42,21,23,35,0,23,25,38,21,23,35,42,35,34,21,0,38,37,23,35,34,21,42,23,3,25,0,25,3,27,23,3,25,42,25,35,23,0,27,38,25,25,35,23,42,25,24,36,0,27,26,39,25,24,36,42,36,37,25,0,39,40,27,36,37,25,42,24,26,38,0,26,28,41,24,26,38,42,38,36,24,0,41,39,26,38,36,24,42,26,27,39,0,28,29,42,26,27,39,42,39,38,26,0,42,41,28,39,38,26,42,27,28,40,0,29,30,43,27,28,40,42,40,39,27,0,43,42,29,40,39,27,42,28,29,41,0,30,31,44,28,29,41,42,41,40,28,0,44,43,30,41,40,28,42,29,30,42,0,31,32,45,29,30,42,42,42,41,29,0,45,44,31,42,41,29,42,30,31,43,0,32,33,46,30,31,43,42,43,42,30,0,46,45,32,43,42,30,42,31,32,44,0,35,34,47,31,32,44,42,44,43,31,0,47,48,35,44,43,31,42,32,33,45,0,34,36,49,32,33,45,42,45,44,32,0,49,47,34,45,44,32,42,33,34,46,0,36,37,50,33,34,46,42,46,45,33,0,50,49,36,46,45,33,42,34,35,47,0,37,38,51,34,35,47,42,47,46,34,0,51,50,37,47,46,34,42,35,25,37,0,38,27,40,35,25,37,42,37,47,35,0,40,51,38,37,47,35]
+
+}

geometries/tracks/cityscape/start.js

@@ -0,0 +1,45 @@
+{
+
+    "metadata" :
+    {
+        "formatVersion" : 3.1,
+        "sourceFile"    : "start.obj",
+        "generatedBy"   : "OBJConverter",
+        "vertices"      : 88,
+        "faces"         : 160,
+        "normals"       : 107,
+        "colors"        : 0,
+        "uvs"           : 34,
+        "materials"     : 1
+    },
+
+    "scale" : 1.000000,
+
+    "materials": [	{
+	"DbgColor" : 15658734,
+	"DbgIndex" : 0,
+	"DbgName" : "Material__1",
+	"colorAmbient" : [0.588, 0.588, 0.588],
+	"colorDiffuse" : [0.588, 0.588, 0.588],
+	"colorSpecular" : [0.0, 0.0, 0.0],
+	"illumination" : 2,
+	"opticalDensity" : 1.5,
+	"specularCoef" : 10.0,
+	"transparency" : 0.0
+	}],
+
+    "vertices": [-2221.137695,382.633392,-632.025696,-2221.977539,382.633392,-633.480591,-2221.137695,382.633392,-634.935486,-2219.457520,382.633392,-634.935486,-2218.617676,382.633392,-633.480591,-2219.457520,382.633392,-632.025696,-2219.634766,391.436584,-634.628723,-2218.971924,391.436584,-633.480591,-2220.960449,391.436584,-634.628723,-2221.623291,391.436584,-633.480591,-2220.960449,391.436584,-632.332458,-2219.634766,391.436584,-632.332458,-2219.751465,399.634979,-634.426697,-2219.205078,399.634979,-633.480591,-2220.843994,399.634979,-634.426697,-2221.390137,399.634979,-633.480591,-2220.843994,399.634979,-632.534485,-2219.751465,399.634979,-632.534485,-2219.833496,407.631775,-634.284546,-2219.369385,407.631775,-633.480591,-2220.761719,407.631775,-634.284546,-2221.226074,407.631775,-633.480591,-2220.761719,407.631775,-632.676636,-2219.833496,407.631775,-632.676636,-2219.906982,415.830200,-634.157349,-2219.516113,415.830200,-633.480591,-2220.688232,415.830170,-634.157349,-2221.079102,415.830200,-633.480591,-2220.688232,415.830200,-632.803833,-2219.906982,415.830200,-632.803833,-2219.997559,424.633392,-634.000183,-2219.697510,424.633392,-633.480591,-2220.597656,424.633392,-634.000183,-2220.897705,424.633392,-633.480591,-2220.597656,424.633392,-632.960999,-2219.997559,424.633392,-632.960999,-2227.909668,431.478424,-633.860657,-2220.838623,419.354065,-640.931702,-2213.767578,419.354065,-633.860657,-2220.838623,431.478424,-626.789612,-2227.603516,431.653442,-634.166870,-2220.532471,431.653442,-627.095764,-2213.461426,419.529083,-634.166870,-2220.532471,419.529083,-641.237915,-2306.849854,382.633392,-633.101013,-2308.304688,382.633392,-632.261047,-2309.759521,382.633392,-633.101013,-2309.759521,382.633392,-634.781067,-2308.304688,382.633392,-635.621033,-2306.849854,382.633392,-634.781067,-2309.452881,391.436584,-634.603882,-2308.304688,391.436584,-635.266785,-2309.452881,391.436584,-633.278137,-2308.304688,391.436584,-632.615234,-2307.156494,391.436584,-633.278137,-2307.156494,391.436584,-634.603882,-2309.250732,399.634979,-634.487244,-2308.304688,399.634979,-635.033508,-2309.250732,399.634979,-633.394775,-2308.304688,399.634979,-632.848511,-2307.358643,399.634979,-633.394775,-2307.358643,399.634979,-634.487244,-2309.108643,407.631775,-634.405151,-2308.304688,407.631775,-634.869324,-2309.108643,407.631775,-633.476868,-2308.304688,407.631775,-633.012695,-2307.500732,407.631775,-633.476868,-2307.500732,407.631775,-634.405151,-2308.981445,415.830200,-634.331726,-2308.304688,415.830200,-634.722473,-2308.981445,415.830170,-633.550293,-2308.304688,415.830200,-633.159607,-2307.627930,415.830200,-633.550293,-2307.627930,415.830200,-634.331726,-2308.824219,424.633392,-634.241028,-2308.304688,424.633392,-634.541016,-2308.824219,424.633392,-633.641052,-2308.304688,424.633392,-633.341064,-2307.785156,424.633392,-633.641052,-2307.785156,424.633392,-634.241028,-2308.684814,431.478424,-626.328979,-2315.755859,419.354065,-633.400024,-2308.684814,419.354065,-640.471069,-2301.613770,431.478424,-633.400024,-2308.990967,431.653442,-626.635132,-2301.919922,431.653442,-633.706238,-2308.990967,419.529083,-640.777283,-2316.062012,419.529083,-633.706238],
+
+    "morphTargets": [],
+
+    "morphColors": [],
+
+    "normals": [0,-1,-0,0.9996,0.028159,-0,0.4998,0.028158,-0.86568,0.49985,0.024068,-0.86577,0.99971,0.024069,0,-0.4998,0.028156,-0.86568,-0.49985,0.024067,-0.86577,-0.9996,0.028155,-0,-0.99971,0.024066,0,-0.4998,0.028155,0.86568,-0.49985,0.024066,0.86577,0.4998,0.028157,0.86568,0.49985,0.024068,0.86577,0.49993,0.017157,-0.8659,0.99985,0.017157,0,-0.49993,0.017156,-0.8659,-0.99985,0.017156,0,-0.49993,0.017156,0.8659,0.49993,0.017157,0.8659,0.49995,0.013458,-0.86595,0.99991,0.013458,0,-0.49995,0.013458,-0.86595,-0.99991,0.013459,0,-0.49995,0.013458,0.86595,0.49995,0.013458,0.86595,0.49995,0.013478,-0.86595,0.99991,0.013478,0,-0.49995,0.013479,-0.86595,-0.99991,0.01348,0,-0.49995,0.01348,0.86595,0.49995,0.013479,0.86595,0.49995,0.014425,-0.86593,0.9999,0.014424,1e-06,-0.49995,0.014427,-0.86594,-0.9999,0.014428,2e-06,-0.49994,0.014427,0.86594,0.49995,0.014425,0.86594,-4e-06,1,-5e-06,-6e-06,1,-4e-06,-7e-06,1,-6e-06,-1.3e-05,1,-7e-06,-5e-06,1,-6e-06,0,1,-0,-0.61237,-0.5,0.61237,0.61237,0.5,-0.61237,-0.35355,0.86603,0.35355,-0.35355,0.86603,0.35355,0.70711,-0,0.70711,0.70711,0,0.70711,0.35355,-0.86603,-0.35355,0.35355,-0.86603,-0.35355,-0.70711,0,-0.70711,-0.70711,0,-0.70711,0,-1,-0,-0,0.028159,-0.9996,-0.86568,0.028158,-0.4998,-0.86577,0.024068,-0.49985,-0,0.024069,-0.99971,-0.86568,0.028156,0.4998,-0.86577,0.024067,0.49985,-0,0.028155,0.9996,0,0.024066,0.99971,0.86568,0.028155,0.4998,0.86577,0.024066,0.49985,0.86568,0.028157,-0.4998,0.86577,0.024068,-0.49985,-0.8659,0.017157,-0.49993,0,0.017157,-0.99985,-0.8659,0.017156,0.49993,0,0.017156,0.99985,0.8659,0.017156,0.49993,0.8659,0.017157,-0.49993,-0.86595,0.013458,-0.49995,0,0.013458,-0.99991,-0.86595,0.013458,0.49995,0,0.013459,0.99991,0.86595,0.013458,0.49995,0.86595,0.013458,-0.49995,-0.86595,0.013478,-0.49995,0,0.013478,-0.99991,-0.86595,0.013479,0.49995,0,0.01348,0.99991,0.86595,0.01348,0.49995,0.86595,0.013479,-0.49995,-0.86593,0.014425,-0.49995,1e-06,0.014424,-0.9999,-0.86594,0.014427,0.49995,2e-06,0.014428,0.9999,0.86594,0.014427,0.49994,0.86594,0.014425,-0.49995,-5e-06,1,4e-06,-4e-06,1,6e-06,-6e-06,1,7e-06,-7e-06,1,1.3e-05,-6e-06,1,5e-06,0,1,-0,0.61237,-0.5,0.61237,-0.61237,0.5,-0.61237,0.35355,0.86603,0.35355,0.35355,0.86603,0.35355,0.35355,0.86603,0.35355,0.70711,-0,-0.70711,0.70711,0,-0.70711,-0.35355,-0.86603,-0.35355,-0.35355,-0.86603,-0.35355,-0.70711,0,0.70711,-0.70711,0,0.70711],
+
+    "colors": [],
+
+    "uvs": [[0.67171,0.014781,0.67391,0.016977,0.6731,0.019977,0.6701,0.020781,0.66791,0.018585,0.66871,0.015585,0.68,0,1,0,1,1,0.68,1,0,-0,0.66034,-0,0.66034,1,0,1,0,0.99,0.66,0.99,0.66,1,0.67171,0.014781,0.67391,0.016977,0.6731,0.019977,0.6701,0.020781,0.66791,0.018585,0.66871,0.015585,0.68,0,1,0,1,1,0.68,1,0,-0,0.66034,-0,0.66034,1,0,1,0,0.99,0.66,0.99,0.66,1]],
+
+    "faces": [42,0,1,2,0,0,1,2,0,0,0,42,2,3,4,0,2,3,4,0,0,0,42,0,2,4,0,0,2,4,0,0,0,42,5,0,4,0,5,0,4,0,0,0,42,4,3,6,0,6,7,8,1,2,3,42,6,7,4,0,8,9,6,3,4,1,42,3,2,8,0,6,7,8,2,5,6,42,8,6,3,0,8,9,6,6,3,2,42,2,1,9,0,6,7,8,5,7,8,42,9,8,2,0,8,9,6,8,6,5,42,1,0,10,0,6,7,8,7,9,10,42,10,9,1,0,8,9,6,10,8,7,42,0,5,11,0,6,7,8,9,11,12,42,11,10,0,0,8,9,6,12,10,9,42,5,4,7,0,6,7,8,11,1,4,42,7,11,5,0,8,9,6,4,12,11,42,7,6,12,0,6,7,8,4,3,13,42,12,13,7,0,8,9,6,13,14,4,42,6,8,14,0,6,7,8,3,6,15,42,14,12,6,0,8,9,6,15,13,3,42,8,9,15,0,6,7,8,6,8,16,42,15,14,8,0,8,9,6,16,15,6,42,9,10,16,0,6,7,8,8,10,17,42,16,15,9,0,8,9,6,17,16,8,42,10,11,17,0,6,7,8,10,12,18,42,17,16,10,0,8,9,6,18,17,10,42,11,7,13,0,6,7,8,12,4,14,42,13,17,11,0,8,9,6,14,18,12,42,13,12,18,0,6,7,8,14,13,19,42,18,19,13,0,8,9,6,19,20,14,42,12,14,20,0,6,7,8,13,15,21,42,20,18,12,0,8,9,6,21,19,13,42,14,15,21,0,6,7,8,15,16,22,42,21,20,14,0,8,9,6,22,21,15,42,15,16,22,0,6,7,8,16,17,23,42,22,21,15,0,8,9,6,23,22,16,42,16,17,23,0,6,7,8,17,18,24,42,23,22,16,0,8,9,6,24,23,17,42,17,13,19,0,6,7,8,18,14,20,42,19,23,17,0,8,9,6,20,24,18,42,19,18,24,0,6,7,8,20,19,25,42,24,25,19,0,8,9,6,25,26,20,42,18,20,26,0,6,7,8,19,21,27,42,26,24,18,0,8,9,6,27,25,19,42,20,21,27,0,6,7,8,21,22,28,42,27,26,20,0,8,9,6,28,27,21,42,21,22,28,0,6,7,8,22,23,29,42,28,27,21,0,8,9,6,29,28,22,42,22,23,29,0,6,7,8,23,24,30,42,29,28,22,0,8,9,6,30,29,23,42,23,19,25,0,6,7,8,24,20,26,42,25,29,23,0,8,9,6,26,30,24,42,25,24,30,0,6,7,8,26,25,31,42,30,31,25,0,8,9,6,31,32,26,42,24,26,32,0,6,7,8,25,27,33,42,32,30,24,0,8,9,6,33,31,25,42,26,27,33,0,6,7,8,27,28,34,42,33,32,26,0,8,9,6,34,33,27,42,27,28,34,0,6,7,8,28,29,35,42,34,33,27,0,8,9,6,35,34,28,42,28,29,35,0,6,7,8,29,30,36,42,35,34,28,0,8,9,6,36,35,29,42,29,25,31,0,6,7,8,30,26,32,42,31,35,29,0,8,9,6,32,36,30,42,31,30,32,0,0,1,2,37,38,39,42,32,33,34,0,2,3,4,39,40,41,42,31,32,34,0,0,2,4,37,39,41,42,35,31,34,0,5,0,4,42,37,41,42,36,37,38,0,10,11,12,43,43,43,42,38,39,36,0,12,13,10,43,43,43,42,40,41,42,0,10,11,12,44,44,44,42,42,43,40,0,12,13,10,44,44,44,42,36,39,41,0,14,15,16,45,46,46,42,41,40,36,0,16,13,14,46,45,45,42,39,38,42,0,14,15,16,47,48,48,42,42,41,39,0,16,13,14,48,47,47,42,38,37,43,0,14,15,16,49,50,50,42,43,42,38,0,16,13,14,50,49,49,42,37,36,40,0,14,15,16,51,52,52,42,40,43,37,0,16,13,14,52,51,51,42,44,45,46,0,17,18,19,53,53,53,42,46,47,48,0,19,20,21,53,53,53,42,44,46,48,0,17,19,21,53,53,53,42,49,44,48,0,22,17,21,53,53,53,42,48,47,50,0,23,24,25,54,55,56,42,50,51,48,0,25,26,23,56,57,54,42,47,46,52,0,23,24,25,55,58,59,42,52,50,47,0,25,26,23,59,56,55,42,46,45,53,0,23,24,25,58,60,61,42,53,52,46,0,25,26,23,61,59,58,42,45,44,54,0,23,24,25,60,62,63,42,54,53,45,0,25,26,23,63,61,60,42,44,49,55,0,23,24,25,62,64,65,42,55,54,44,0,25,26,23,65,63,62,42,49,48,51,0,23,24,25,64,54,57,42,51,55,49,0,25,26,23,57,65,64,42,51,50,56,0,23,24,25,57,56,66,42,56,57,51,0,25,26,23,66,67,57,42,50,52,58,0,23,24,25,56,59,68,42,58,56,50,0,25,26,23,68,66,56,42,52,53,59,0,23,24,25,59,61,69,42,59,58,52,0,25,26,23,69,68,59,42,53,54,60,0,23,24,25,61,63,70,42,60,59,53,0,25,26,23,70,69,61,42,54,55,61,0,23,24,25,63,65,71,42,61,60,54,0,25,26,23,71,70,63,42,55,51,57,0,23,24,25,65,57,67,42,57,61,55,0,25,26,23,67,71,65,42,57,56,62,0,23,24,25,67,66,72,42,62,63,57,0,25,26,23,72,73,67,42,56,58,64,0,23,24,25,66,68,74,42,64,62,56,0,25,26,23,74,72,66,42,58,59,65,0,23,24,25,68,69,75,42,65,64,58,0,25,26,23,75,74,68,42,59,60,66,0,23,24,25,69,70,76,42,66,65,59,0,25,26,23,76,75,69,42,60,61,67,0,23,24,25,70,71,77,42,67,66,60,0,25,26,23,77,76,70,42,61,57,63,0,23,24,25,71,67,73,42,63,67,61,0,25,26,23,73,77,71,42,63,62,68,0,23,24,25,73,72,78,42,68,69,63,0,25,26,23,78,79,73,42,62,64,70,0,23,24,25,72,74,80,42,70,68,62,0,25,26,23,80,78,72,42,64,65,71,0,23,24,25,74,75,81,42,71,70,64,0,25,26,23,81,80,74,42,65,66,72,0,23,24,25,75,76,82,42,72,71,65,0,25,26,23,82,81,75,42,66,67,73,0,23,24,25,76,77,83,42,73,72,66,0,25,26,23,83,82,76,42,67,63,69,0,23,24,25,77,73,79,42,69,73,67,0,25,26,23,79,83,77,42,69,68,74,0,23,24,25,79,78,84,42,74,75,69,0,25,26,23,84,85,79,42,68,70,76,0,23,24,25,78,80,86,42,76,74,68,0,25,26,23,86,84,78,42,70,71,77,0,23,24,25,80,81,87,42,77,76,70,0,25,26,23,87,86,80,42,71,72,78,0,23,24,25,81,82,88,42,78,77,71,0,25,26,23,88,87,81,42,72,73,79,0,23,24,25,82,83,89,42,79,78,72,0,25,26,23,89,88,82,42,73,69,75,0,23,24,25,83,79,85,42,75,79,73,0,25,26,23,85,89,83,42,75,74,76,0,17,18,19,90,91,92,42,76,77,78,0,19,20,21,92,93,94,42,75,76,78,0,17,19,21,90,92,94,42,79,75,78,0,22,17,21,95,90,94,42,80,81,82,0,27,28,29,96,96,96,42,82,83,80,0,29,30,27,96,96,96,42,84,85,86,0,27,28,29,97,97,97,42,86,87,84,0,29,30,27,97,97,97,42,80,83,85,0,31,32,33,98,99,100,42,85,84,80,0,33,30,31,100,98,98,42,83,82,86,0,31,32,33,101,102,102,42,86,85,83,0,33,30,31,102,101,101,42,82,81,87,0,31,32,33,103,104,104,42,87,86,82,0,33,30,31,104,103,103,42,81,80,84,0,31,32,33,105,106,106,42,84,87,81,0,33,30,31,106,105,105]
+
+}

geometries/tracks/cityscape/startbanner.js

@@ -0,0 +1,45 @@
+{
+
+    "metadata" :
+    {
+        "formatVersion" : 3.1,
+        "sourceFile"    : "startbanner.obj",
+        "generatedBy"   : "OBJConverter",
+        "vertices"      : 12,
+        "faces"         : 10,
+        "normals"       : 6,
+        "colors"        : 0,
+        "uvs"           : 12,
+        "materials"     : 1
+    },
+
+    "scale" : 1.000000,
+
+    "materials": [	{
+	"DbgColor" : 15658734,
+	"DbgIndex" : 0,
+	"DbgName" : "13___Default",
+	"colorAmbient" : [0.588235, 0.588235, 0.588235],
+	"colorDiffuse" : [0.588235, 0.588235, 0.588235],
+	"colorSpecular" : [0.0, 0.0, 0.0],
+	"illumination" : 2,
+	"opticalDensity" : 1.5,
+	"specularCoef" : 9.999999,
+	"transparency" : 0.0
+	}],
+
+    "vertices": [-2308.439453,424.299988,-633.529297,-2290.839355,424.299988,-625.660400,-2290.839355,407.919983,-625.660400,-2308.439453,407.919983,-633.529297,-2273.239502,424.299988,-621.725891,-2273.239502,407.919983,-621.725891,-2255.639404,424.299988,-621.725891,-2255.639404,407.919983,-621.725891,-2238.039551,424.299988,-625.660400,-2238.039551,407.919983,-625.660400,-2220.439453,424.299988,-633.529297,-2220.439453,407.919983,-633.529297],
+
+    "morphTargets": [],
+
+    "morphColors": [],
+
+    "normals": [0.40816,-0,-0.91291,0.31474,-0,-0.94918,0.10974,-0,-0.99396,-0.10974,-0,-0.99396,-0.31474,-0,-0.94918,-0.40816,-0,-0.91291],
+
+    "colors": [],
+
+    "uvs": [[1,1,0.8,1,0.8,0,1,0,0.6,1,0.6,0,0.4,1,0.4,0,0.2,1,0.2,0,0,1,0,0]],
+
+    "faces": [42,0,1,2,0,0,1,2,0,1,1,42,2,3,0,0,2,3,0,1,0,0,42,1,4,5,0,1,4,5,1,2,2,42,5,2,1,0,5,2,1,2,1,1,42,4,6,7,0,4,6,7,2,3,3,42,7,5,4,0,7,5,4,3,2,2,42,6,8,9,0,6,8,9,3,4,4,42,9,7,6,0,9,7,6,4,3,3,42,8,10,11,0,8,10,11,4,5,5,42,11,9,8,0,11,9,8,5,4,4]
+
+}

index.html

@@ -0,0 +1,111 @@
+<!doctype html>
+<html lang="en">
+	<head>
+		<title>Tron disk, selective glow, particles, icosahedrons (Three.js) - Thibaut Despoulain</title>
+		<meta charset="utf-8">
+		<meta name="viewport" content="width=device-width, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0">
+		<link rel="stylesheet" href="css/fonts.css" type="text/css" charset="utf-8">
+		<style>
+			body {
+				background:#ccc;
+				padding:0;
+				margin:0;
+				overflow:hidden;
+				font-family:georgia;
+				text-align:center;
+				color: #666;
+			}
+			h1 {color: #666	; }
+			a { color:skyblue }
+			canvas { pointer-events:none; }
+			#overlay{
+				position: absolute;
+				z-index: 9999;
+				top: 0;
+				left: 0;
+				width: 100%;
+			}
+		</style>
+	</head>
+
+	<body>
+		<div id="overlay"></div>
+		<div id="main"></div>
+
+		<script src="js/Three.dev.js"></script>
+		<script src="js/ShaderExtras.js"></script>
+		<script src="js/postprocessing/EffectComposer.js"></script>
+		<script src="js/postprocessing/RenderPass.js"></script>
+		<script src="js/postprocessing/BloomPass.js"></script>
+		<script src="js/postprocessing/ShaderPass.js"></script>
+		<script src="js/postprocessing/MaskPass.js"></script>
+		<script src="js/Detector.js"></script>
+		<script src="js/Stats.js"></script>
+		<script src="js/DAT.GUI.min.js"></script>
+
+		<script src="bkcore/Timer.js"></script>
+		<script src="bkcore/ImageData.js"></script>
+		<script src="bkcore/Utils.js"></script>
+
+		<script src="bkcore/threejs/RenderManager.js"></script>
+		<script src="bkcore/threejs/Shaders.js"></script>
+		<script src="bkcore/threejs/Particles.js"></script>
+		<script src="bkcore/threejs/Loader.js"></script>
+
+		<script src="bkcore/hexgl/HUD.js"></script>
+		<script src="bkcore/hexgl/ShipControls.js"></script>
+		<script src="bkcore/hexgl/ShipEffects.js"></script>
+		<script src="bkcore/hexgl/CameraChase.js"></script>
+		<script src="bkcore/hexgl/Gameplay.js"></script>
+
+		<script src="bkcore/hexgl/tracks/Cityscape.js"></script>
+
+		<script src="bkcore/hexgl/HexGL.js"></script>
+
+		<script>
+
+			var SCREEN_WIDTH = window.innerWidth;
+			var SCREEN_HEIGHT = window.innerHeight;
+
+			var container, hudcontainer;
+
+			var hexGL;
+
+			function init() {
+				hudcontainer = document.getElementById("overlay");
+				container = document.getElementById("main");
+
+				hexGL = new bkcore.hexgl.HexGL({
+					document: document,
+					width: SCREEN_WIDTH,
+					height: SCREEN_HEIGHT,
+					container: container,
+					overlay: overlay,
+					quality: bkcore.Utils.getURLParameter('quality'),
+					difficulty: bkcore.Utils.getURLParameter('difficulty'),
+					half: bkcore.Utils.getURLParameter('half'),
+					track: 'Cityscape'
+				});
+
+				hexGL.load({
+					onLoad: function(){
+						console.log("ALL LOADED.");
+						hexGL.init();
+						hexGL.start();
+					},
+					onError: function(s){
+						console.log("ERROR ON "+s+".");
+					},
+					onProgress: function(p, t, n)
+					{
+						console.log("LOADED "+t+" : "+n+" ( "+p.loaded+" / "+p.total+" ).");
+					}
+				});
+			}
+			
+			init();
+
+		</script>
+
+	</body>
+</html>

js/DAT.GUI.min.js

@@ -0,0 +1,53 @@
+/**
+ * dat.gui Javascript Controller Library
+ * http://dataarts.github.com/dat.gui
+ *
+ * Copyright 2011 Data Arts Team, Google Creative Lab
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ */
+var DAT=DAT||{};
+DAT.GUI=function(a){a==void 0&&(a={});var b=!1;a.height==void 0?a.height=300:b=!0;var d=[],c=[],i=!0,f,h,j=this,g=!0,e=280;if(a.width!=void 0)e=a.width;var q=!1,k,p,n=0,r;this.domElement=document.createElement("div");this.domElement.setAttribute("class","guidat");this.domElement.style.width=e+"px";var l=a.height,m=document.createElement("div");m.setAttribute("class","guidat-controllers");m.style.height=l+"px";m.addEventListener("DOMMouseScroll",function(a){var b=this.scrollTop;a.wheelDelta?b+=a.wheelDelta:
+a.detail&&(b+=a.detail);a.preventDefault&&a.preventDefault();a.returnValue=!1;m.scrollTop=b},!1);var o=document.createElement("a");o.setAttribute("class","guidat-toggle");o.setAttribute("href","#");o.innerHTML=g?"Close Controls":"Open Controls";var t=!1,C=0,x=0,u=!1,v,y,w,z,D=function(a){y=v;z=w;v=a.pageY;w=a.pageX;a=v-y;if(!g)if(a>0)g=!0,l=k=1,o.innerHTML=p||"Close Controls";else return;var b=z-w;if(a>0&&l>h){var d=DAT.GUI.map(l,h,h+100,1,0);a*=d}t=!0;C+=a;k+=a;l+=a;m.style.height=k+"px";x+=b;e+=
+b;e=DAT.GUI.constrain(e,240,500);j.domElement.style.width=e+"px";A()};o.addEventListener("mousedown",function(a){y=v=a.pageY;z=w=a.pageX;u=!0;a.preventDefault();C=x=0;document.addEventListener("mousemove",D,!1);return!1},!1);o.addEventListener("click",function(a){a.preventDefault();return!1},!1);document.addEventListener("mouseup",function(a){u&&!t&&j.toggle();if(u&&t)if(x==0&&B(),k>h)clearTimeout(r),k=n=h,s();else if(m.children.length>=1){var b=m.children[0].offsetHeight;clearTimeout(r);n=Math.round(l/
+b)*b-1;n<=0?(j.close(),k=b*2):(k=n,s())}document.removeEventListener("mousemove",D,!1);a.preventDefault();return u=t=!1},!1);this.domElement.appendChild(m);this.domElement.appendChild(o);if(a.domElement)a.domElement.appendChild(this.domElement);else if(DAT.GUI.autoPlace){if(DAT.GUI.autoPlaceContainer==null)DAT.GUI.autoPlaceContainer=document.createElement("div"),DAT.GUI.autoPlaceContainer.setAttribute("id","guidat"),document.body.appendChild(DAT.GUI.autoPlaceContainer);DAT.GUI.autoPlaceContainer.appendChild(this.domElement)}this.autoListenIntervalTime=
+1E3/60;var E=function(){f=setInterval(function(){j.listen()},this.autoListenIntervalTime)};this.__defineSetter__("autoListen",function(a){(i=a)?c.length>0&&E():clearInterval(f)});this.__defineGetter__("autoListen",function(){return i});this.listenTo=function(a){c.length==0&&E();c.push(a)};this.unlistenTo=function(a){for(var b=0;b<c.length;b++)c[b]==a&&c.splice(b,1);c.length<=0&&clearInterval(f)};this.listen=function(a){var a=a||c,b;for(b in a)a[b].updateDisplay()};this.listenAll=function(){this.listen(d)};
+this.autoListen=!0;var F=function(a,b){function d(){return a.apply(this,b)}d.prototype=a.prototype;return new d};this.add=function(){if(arguments.length==1){var a=[],c;for(c in arguments[0])a.push(j.add(arguments[0],c));return a}a=arguments[0];c=arguments[1];a:for(var e in d)if(d[e].object==a&&d[e].propertyName==c)break a;e=a[c];e==void 0&&a.get&&(e=a.get(c));if(e==void 0)DAT.GUI.error(a+" either has no property '"+c+"', or the property is inaccessible.");else if(a=typeof e,e=G[a],e==void 0)DAT.GUI.error("Cannot create controller for data type '"+
+a+"'");else{for(var f=[this],g=0;g<arguments.length;g++)f.push(arguments[g]);if(e=F(e,f)){m.appendChild(e.domElement);d.push(e);DAT.GUI.allControllers.push(e);a!="function"&&DAT.GUI.saveIndex<DAT.GUI.savedValues.length&&(e.setValue(DAT.GUI.savedValues[DAT.GUI.saveIndex]),DAT.GUI.saveIndex++);A();q||(k=h);if(!b)try{if(arguments.callee.caller==window.onload)l=n=k=h,m.style.height=l+"px"}catch(i){}return e}else DAT.GUI.error("Error creating controller for '"+c+"'.")}};var A=function(){h=0;for(var a in d)h+=
+d[a].domElement.offsetHeight;m.style.overflowY=h-1>k?"auto":"hidden"},G={number:DAT.GUI.ControllerNumber,string:DAT.GUI.ControllerString,"boolean":DAT.GUI.ControllerBoolean,"function":DAT.GUI.ControllerFunction};this.reset=function(){for(var a=0,b=DAT.GUI.allControllers.length;a<b;a++)DAT.GUI.allControllers[a].reset()};this.toggle=function(){g?this.close():this.open()};this.open=function(){o.innerHTML=p||"Close Controls";n=k;clearTimeout(r);s();B();g=!0};this.close=function(){o.innerHTML=p||"Open Controls";
+n=0;clearTimeout(r);s();B();g=!1};this.name=function(a){p=a;o.innerHTML=a};this.appearanceVars=function(){return[g,e,k,m.scrollTop]};var s=function(){l=m.offsetHeight;l+=(n-l)*0.6;Math.abs(l-n)<1?l=n:r=setTimeout(s,1E3/30);m.style.height=Math.round(l)+"px";A()},B=function(){j.domElement.style.width=e-1+"px";setTimeout(function(){j.domElement.style.width=e+"px"},1)};if(DAT.GUI.guiIndex<DAT.GUI.savedAppearanceVars.length){e=parseInt(DAT.GUI.savedAppearanceVars[DAT.GUI.guiIndex][1]);j.domElement.style.width=
+e+"px";k=parseInt(DAT.GUI.savedAppearanceVars[DAT.GUI.guiIndex][2]);q=!0;if(eval(DAT.GUI.savedAppearanceVars[DAT.GUI.guiIndex][0])==!0){var l=k,H=DAT.GUI.savedAppearanceVars[DAT.GUI.guiIndex][3];setTimeout(function(){m.scrollTop=H},0);if(DAT.GUI.scrollTop>-1)document.body.scrollTop=DAT.GUI.scrollTop;n=k;this.open()}DAT.GUI.guiIndex++}DAT.GUI.allGuis.push(this);if(DAT.GUI.allGuis.length==1&&(window.addEventListener("keyup",function(a){!DAT.GUI.supressHotKeys&&a.keyCode==72&&DAT.GUI.toggleHide()},!1),
+DAT.GUI.inlineCSS))a=document.createElement("style"),a.setAttribute("type","text/css"),a.innerHTML=DAT.GUI.inlineCSS,document.head.insertBefore(a,document.head.firstChild)};DAT.GUI.hidden=!1;DAT.GUI.autoPlace=!0;DAT.GUI.autoPlaceContainer=null;DAT.GUI.allControllers=[];DAT.GUI.allGuis=[];DAT.GUI.supressHotKeys=!1;DAT.GUI.toggleHide=function(){DAT.GUI.hidden?DAT.GUI.open():DAT.GUI.close()};
+DAT.GUI.open=function(){DAT.GUI.hidden=!1;for(var a in DAT.GUI.allGuis)DAT.GUI.allGuis[a].domElement.style.display="block"};DAT.GUI.close=function(){DAT.GUI.hidden=!0;for(var a in DAT.GUI.allGuis)DAT.GUI.allGuis[a].domElement.style.display="none"};DAT.GUI.saveURL=function(){var a=DAT.GUI.replaceGetVar("saveString",DAT.GUI.getSaveString());window.location=a};DAT.GUI.scrollTop=-1;
+DAT.GUI.load=function(a){var a=a.split(","),b=parseInt(a[0]);DAT.GUI.scrollTop=parseInt(a[1]);for(var d=0;d<b;d++){var c=a.splice(2,4);DAT.GUI.savedAppearanceVars.push(c)}DAT.GUI.savedValues=a.splice(2,a.length)};DAT.GUI.savedValues=[];DAT.GUI.savedAppearanceVars=[];
+DAT.GUI.getSaveString=function(){var a=[],b;a.push(DAT.GUI.allGuis.length);a.push(document.body.scrollTop);for(b in DAT.GUI.allGuis)for(var d=DAT.GUI.allGuis[b].appearanceVars(),c=0;c<d.length;c++)a.push(d[c]);for(b in DAT.GUI.allControllers)DAT.GUI.allControllers[b].type!="function"&&(d=DAT.GUI.allControllers[b].getValue(),DAT.GUI.allControllers[b].type=="number"&&(d=DAT.GUI.roundToDecimal(d,4)),a.push(d));return a.join(",")};
+DAT.GUI.getVarFromURL=function(a){for(var b,d=window.location.href.slice(window.location.href.indexOf("?")+1).split("&"),c=0;c<d.length;c++)if(b=d[c].split("="),b!=void 0&&b[0]==a)return b[1];return null};
+DAT.GUI.replaceGetVar=function(a,b){for(var d,c=window.location.href,i=window.location.href.slice(window.location.href.indexOf("?")+1).split("&"),f=0;f<i.length;f++)if(d=i[f].split("="),d!=void 0&&d[0]==a)return c.replace(d[1],b);return window.location.href.indexOf("?")!=-1?c+"&"+a+"="+b:c+"?"+a+"="+b};DAT.GUI.saveIndex=0;DAT.GUI.guiIndex=0;DAT.GUI.showSaveString=function(){alert(DAT.GUI.getSaveString())};
+DAT.GUI.makeUnselectable=function(a){if(!(a==void 0||a.style==void 0)){a.onselectstart=function(){return!1};a.style.MozUserSelect="none";a.style.KhtmlUserSelect="none";a.unselectable="on";for(var a=a.childNodes,b=0;b<a.length;b++)DAT.GUI.makeUnselectable(a[b])}};DAT.GUI.makeSelectable=function(a){if(!(a==void 0||a.style==void 0)){a.onselectstart=function(){};a.style.MozUserSelect="auto";a.style.KhtmlUserSelect="auto";a.unselectable="off";for(var a=a.childNodes,b=0;b<a.length;b++)DAT.GUI.makeSelectable(a[b])}};
+DAT.GUI.map=function(a,b,d,c,i){return c+(i-c)*((a-b)/(d-b))};DAT.GUI.constrain=function(a,b,d){a<b?a=b:a>d&&(a=d);return a};DAT.GUI.error=function(a){typeof console.error=="function"&&console.error("[DAT.GUI ERROR] "+a)};DAT.GUI.roundToDecimal=function(a,b){var d=Math.pow(10,b);return Math.round(a*d)/d};DAT.GUI.extendController=function(a){a.prototype=new DAT.GUI.Controller;a.prototype.constructor=a};DAT.GUI.addClass=function(a,b){DAT.GUI.hasClass(a,b)||(a.className+=" "+b)};
+DAT.GUI.hasClass=function(a,b){return a.className.indexOf(b)!=-1};DAT.GUI.removeClass=function(a,b){a.className=a.className.replace(RegExp(" "+b,"g"),"")};DAT.GUI.getVarFromURL("saveString")!=null&&DAT.GUI.load(DAT.GUI.getVarFromURL("saveString"));
+DAT.GUI.Controller=function(){this.parent=arguments[0];this.object=arguments[1];this.propertyName=arguments[2];if(arguments.length>0)this.initialValue=this.object[this.propertyName];this.domElement=document.createElement("div");this.domElement.setAttribute("class","guidat-controller "+this.type);this.propertyNameElement=document.createElement("span");this.propertyNameElement.setAttribute("class","guidat-propertyname");this.name(this.propertyName);this.domElement.appendChild(this.propertyNameElement);
+DAT.GUI.makeUnselectable(this.domElement)};DAT.GUI.Controller.prototype.changeFunction=null;DAT.GUI.Controller.prototype.finishChangeFunction=null;DAT.GUI.Controller.prototype.name=function(a){this.propertyNameElement.innerHTML=a;return this};DAT.GUI.Controller.prototype.reset=function(){this.setValue(this.initialValue);return this};DAT.GUI.Controller.prototype.listen=function(){this.parent.listenTo(this);return this};DAT.GUI.Controller.prototype.unlisten=function(){this.parent.unlistenTo(this);return this};
+DAT.GUI.Controller.prototype.setValue=function(a){if(this.object[this.propertyName]!=void 0)this.object[this.propertyName]=a;else{var b={};b[this.propertyName]=a;this.object.set(b)}this.changeFunction!=null&&this.changeFunction.call(this,a);this.updateDisplay();return this};DAT.GUI.Controller.prototype.getValue=function(){var a=this.object[this.propertyName];a==void 0&&(a=this.object.get(this.propertyName));return a};DAT.GUI.Controller.prototype.updateDisplay=function(){};
+DAT.GUI.Controller.prototype.onChange=function(a){this.changeFunction=a;return this};DAT.GUI.Controller.prototype.onFinishChange=function(a){this.finishChangeFunction=a;return this};
+DAT.GUI.Controller.prototype.options=function(){var a=this,b=document.createElement("select");if(arguments.length==1){var d=arguments[0],c;for(c in d){var i=document.createElement("option");i.innerHTML=c;i.setAttribute("value",d[c]);if(arguments[c]==this.getValue())i.selected=!0;b.appendChild(i)}}else for(c=0;c<arguments.length;c++){i=document.createElement("option");i.innerHTML=arguments[c];i.setAttribute("value",arguments[c]);if(arguments[c]==this.getValue())i.selected=!0;b.appendChild(i)}b.addEventListener("change",
+function(){a.setValue(this.value);a.finishChangeFunction!=null&&a.finishChangeFunction.call(this,a.getValue())},!1);a.domElement.appendChild(b);return this};
+DAT.GUI.ControllerBoolean=function(){this.type="boolean";DAT.GUI.Controller.apply(this,arguments);var a=this,b=document.createElement("input");b.setAttribute("type","checkbox");b.checked=this.getValue();this.setValue(this.getValue());this.domElement.addEventListener("click",function(d){b.checked=!b.checked;d.preventDefault();a.setValue(b.checked)},!1);b.addEventListener("mouseup",function(){b.checked=!b.checked},!1);this.domElement.style.cursor="pointer";this.propertyNameElement.style.cursor="pointer";
+this.domElement.appendChild(b);this.updateDisplay=function(){b.checked=a.getValue()};this.setValue=function(a){if(typeof a!="boolean")try{a=eval(a)}catch(b){}return DAT.GUI.Controller.prototype.setValue.call(this,a)}};DAT.GUI.extendController(DAT.GUI.ControllerBoolean);
+DAT.GUI.ControllerFunction=function(){this.type="function";var a=this;DAT.GUI.Controller.apply(this,arguments);this.domElement.addEventListener("click",function(){a.fire()},!1);this.domElement.style.cursor="pointer";this.propertyNameElement.style.cursor="pointer";var b=null;this.onFire=function(a){b=a;return this};this.fire=function(){b!=null&&b.call(this);a.object[a.propertyName].call(a.object)}};DAT.GUI.extendController(DAT.GUI.ControllerFunction);
+DAT.GUI.ControllerNumber=function(){this.type="number";DAT.GUI.Controller.apply(this,arguments);var a=this,b=!1,d=!1,c=0,i=0,f=arguments[3],h=arguments[4],j=arguments[5];this.min=function(){var b=!1;f==void 0&&h!=void 0&&(b=!0);if(arguments.length==0)return f;else f=arguments[0];b&&(q(),j==void 0&&(j=(h-f)*0.01));return a};this.max=function(){var b=!1;f!=void 0&&h==void 0&&(b=!0);if(arguments.length==0)return h;else h=arguments[0];b&&(q(),j==void 0&&(j=(h-f)*0.01));return a};this.step=function(){if(arguments.length==
+0)return j;else j=arguments[0];return a};this.getMin=function(){return f};this.getMax=function(){return h};this.getStep=function(){return j==void 0?h!=void 0&&f!=void 0?(h-f)/100:1:j};var g=document.createElement("input");g.setAttribute("id",this.propertyName);g.setAttribute("type","text");g.setAttribute("value",this.getValue());j&&g.setAttribute("step",j);this.domElement.appendChild(g);var e,q=function(){e=new DAT.GUI.ControllerNumberSlider(a,f,h,j,a.getValue());a.domElement.appendChild(e.domElement)};
+f!=void 0&&h!=void 0&&q();g.addEventListener("blur",function(){var b=parseFloat(this.value);e&&DAT.GUI.removeClass(a.domElement,"active");isNaN(b)||a.setValue(b)},!1);g.addEventListener("mousewheel",function(b){b.preventDefault();a.setValue(a.getValue()+Math.abs(b.wheelDeltaY)/b.wheelDeltaY*a.getStep());return!1},!1);g.addEventListener("mousedown",function(a){i=c=a.pageY;DAT.GUI.makeSelectable(g);document.addEventListener("mousemove",p,!1);document.addEventListener("mouseup",k,!1)},!1);g.addEventListener("keydown",
+function(b){switch(b.keyCode){case 13:b=parseFloat(this.value);a.setValue(b);break;case 38:b=a.getValue()+a.getStep();a.setValue(b);break;case 40:b=a.getValue()-a.getStep(),a.setValue(b)}},!1);var k=function(){document.removeEventListener("mousemove",p,!1);DAT.GUI.makeSelectable(g);a.finishChangeFunction!=null&&a.finishChangeFunction.call(this,a.getValue());d=b=!1;document.removeEventListener("mouseup",k,!1)},p=function(e){i=c;c=e.pageY;var f=i-c;!b&&!d&&(f==0?b=!0:d=!0);if(b)return!0;DAT.GUI.addClass(a.domElement,
+"active");DAT.GUI.makeUnselectable(a.parent.domElement);DAT.GUI.makeUnselectable(g);e.preventDefault();e=a.getValue()+f*a.getStep();a.setValue(e);return!1};this.options=function(){a.noSlider();a.domElement.removeChild(g);return DAT.GUI.Controller.prototype.options.apply(this,arguments)};this.noSlider=function(){e&&a.domElement.removeChild(e.domElement);return this};this.setValue=function(a){a=parseFloat(a);f!=void 0&&a<=f?a=f:h!=void 0&&a>=h&&(a=h);return DAT.GUI.Controller.prototype.setValue.call(this,
+a)};this.updateDisplay=function(){g.value=DAT.GUI.roundToDecimal(a.getValue(),4);if(e)e.value=a.getValue()}};DAT.GUI.extendController(DAT.GUI.ControllerNumber);
+DAT.GUI.ControllerNumberSlider=function(a,b,d,c,i){var f=!1,h=this;this.domElement=document.createElement("div");this.domElement.setAttribute("class","guidat-slider-bg");this.fg=document.createElement("div");this.fg.setAttribute("class","guidat-slider-fg");this.domElement.appendChild(this.fg);var j=function(b){if(f){var c;c=h.domElement;var d=0,g=0;if(c.offsetParent){do d+=c.offsetLeft,g+=c.offsetTop;while(c=c.offsetParent);c=[d,g]}else c=void 0;b=DAT.GUI.map(b.pageX,c[0],c[0]+h.domElement.offsetWidth,
+a.getMin(),a.getMax());b=Math.round(b/a.getStep())*a.getStep();a.setValue(b)}};this.domElement.addEventListener("mousedown",function(b){f=!0;DAT.GUI.addClass(a.domElement,"active");j(b);document.addEventListener("mouseup",g,!1)},!1);var g=function(){DAT.GUI.removeClass(a.domElement,"active");f=!1;a.finishChangeFunction!=null&&a.finishChangeFunction.call(this,a.getValue());document.removeEventListener("mouseup",g,!1)};this.__defineSetter__("value",function(b){this.fg.style.width=DAT.GUI.map(b,a.getMin(),
+a.getMax(),0,100)+"%"});document.addEventListener("mousemove",j,!1);this.value=i};
+DAT.GUI.ControllerString=function(){this.type="string";var a=this;DAT.GUI.Controller.apply(this,arguments);var b=document.createElement("input"),d=this.getValue();b.setAttribute("value",d);b.setAttribute("spellcheck","false");this.domElement.addEventListener("mouseup",function(){b.focus();b.select()},!1);b.addEventListener("keyup",function(c){c.keyCode==13&&a.finishChangeFunction!=null&&(a.finishChangeFunction.call(this,a.getValue()),b.blur());a.setValue(b.value)},!1);b.addEventListener("mousedown",
+function(){DAT.GUI.makeSelectable(b)},!1);b.addEventListener("blur",function(){DAT.GUI.supressHotKeys=!1;a.finishChangeFunction!=null&&a.finishChangeFunction.call(this,a.getValue())},!1);b.addEventListener("focus",function(){DAT.GUI.supressHotKeys=!0},!1);this.updateDisplay=function(){b.value=a.getValue()};this.options=function(){a.domElement.removeChild(b);return DAT.GUI.Controller.prototype.options.apply(this,arguments)};this.domElement.appendChild(b)};DAT.GUI.extendController(DAT.GUI.ControllerString);
+DAT.GUI.inlineCSS="#guidat { position: fixed; top: 0; right: 0; width: auto; z-index: 1001; text-align: right; } .guidat { color: #fff; opacity: 0.97; text-align: left; float: right; margin-right: 20px; margin-bottom: 20px; background-color: #fff; } .guidat, .guidat input { font: 9.5px Lucida Grande, sans-serif; } .guidat-controllers { height: 300px; overflow-y: auto; overflow-x: hidden; background-color: rgba(0, 0, 0, 0.1); } a.guidat-toggle:link, a.guidat-toggle:visited, a.guidat-toggle:active { text-decoration: none; cursor: pointer; color: #fff; background-color: #222; text-align: center; display: block; padding: 5px; } a.guidat-toggle:hover { background-color: #000; } .guidat-controller { padding: 3px; height: 25px; clear: left; border-bottom: 1px solid #222; background-color: #111; } .guidat-controller, .guidat-controller input, .guidat-slider-bg, .guidat-slider-fg { -moz-transition: background-color 0.15s linear; -webkit-transition: background-color 0.15s linear; transition: background-color 0.15s linear; } .guidat-controller.boolean:hover, .guidat-controller.function:hover { background-color: #000; } .guidat-controller input { float: right; outline: none; border: 0; padding: 4px; margin-top: 2px; background-color: #222; } .guidat-controller select { margin-top: 4px; float: right; } .guidat-controller input:hover { background-color: #444; } .guidat-controller input:focus, .guidat-controller.active input { background-color: #555; color: #fff; } .guidat-controller.number { border-left: 5px solid #00aeff; } .guidat-controller.string { border-left: 5px solid #1ed36f; } .guidat-controller.string input { border: 0; color: #1ed36f; margin-right: 2px; width: 148px; } .guidat-controller.boolean { border-left: 5px solid #54396e; } .guidat-controller.function { border-left: 5px solid #e61d5f; } .guidat-controller.number input[type=text] { width: 35px; margin-left: 5px; margin-right: 2px; color: #00aeff; } .guidat .guidat-controller.boolean input { margin-top: 6px; margin-right: 2px; font-size: 20px; } .guidat-controller:last-child { border-bottom: none; -webkit-box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.5); -moz-box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.5); box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.5); } .guidat-propertyname { padding: 5px; padding-top: 7px; cursor: default; display: inline-block; } .guidat-controller .guidat-slider-bg:hover, .guidat-controller.active .guidat-slider-bg { background-color: #444; } .guidat-controller .guidat-slider-bg .guidat-slider-fg:hover, .guidat-controller.active .guidat-slider-bg .guidat-slider-fg { background-color: #52c8ff; } .guidat-slider-bg { background-color: #222; cursor: ew-resize; width: 40%; margin-top: 2px; float: right; height: 21px; } .guidat-slider-fg { cursor: ew-resize; background-color: #00aeff; height: 21px; } ";

js/Detector.js

@@ -0,0 +1,59 @@
+/**
+ * @author alteredq / http://alteredqualia.com/
+ * @author mr.doob / http://mrdoob.com/
+ */
+
+var Detector = {
+
+	canvas: !! window.CanvasRenderingContext2D,
+	webgl: ( function () { try { return !! window.WebGLRenderingContext && !! document.createElement( 'canvas' ).getContext( 'experimental-webgl' ); } catch( e ) { return false; } } )(),
+	workers: !! window.Worker,
+	fileapi: window.File && window.FileReader && window.FileList && window.Blob,
+
+	getWebGLErrorMessage: function () {
+
+		var element = document.createElement( 'div' );
+		element.id = 'webgl-error-message';
+		element.style.fontFamily = 'monospace';
+		element.style.fontSize = '13px';
+		element.style.fontWeight = 'normal';
+		element.style.textAlign = 'center';
+		element.style.background = '#fff';
+		element.style.color = '#000';
+		element.style.padding = '1.5em';
+		element.style.width = '400px';
+		element.style.margin = '5em auto 0';
+
+		if ( ! this.webgl ) {
+
+			element.innerHTML = window.WebGLRenderingContext ? [
+				'Your graphics card does not seem to support <a href="http://khronos.org/webgl/wiki/Getting_a_WebGL_Implementation" style="color:#000">WebGL</a>.<br />',
+				'Find out how to get it <a href="http://get.webgl.org/" style="color:#000">here</a>.'
+			].join( '\n' ) : [
+				'Your browser does not seem to support <a href="http://khronos.org/webgl/wiki/Getting_a_WebGL_Implementation" style="color:#000">WebGL</a>.<br/>',
+				'Find out how to get it <a href="http://get.webgl.org/" style="color:#000">here</a>.'
+			].join( '\n' );
+
+		}
+
+		return element;
+
+	},
+
+	addGetWebGLMessage: function ( parameters ) {
+
+		var parent, id, element;
+
+		parameters = parameters || {};
+
+		parent = parameters.parent !== undefined ? parameters.parent : document.body;
+		id = parameters.id !== undefined ? parameters.id : 'oldie';
+
+		element = Detector.getWebGLErrorMessage();
+		element.id = id;
+
+		parent.appendChild( element );
+
+	}
+
+};

js/Stats.js

@@ -0,0 +1,6 @@
+// stats.js r10 - http://github.com/mrdoob/stats.js
+var Stats=function(){var l=Date.now(),m=l,g=0,n=1E3,o=0,h=0,p=1E3,q=0,r=0,s=0,f=document.createElement("div");f.id="stats";f.addEventListener("mousedown",function(b){b.preventDefault();t(++s%2)},!1);f.style.cssText="width:80px;opacity:0.9;cursor:pointer";var a=document.createElement("div");a.id="fps";a.style.cssText="padding:0 0 3px 3px;text-align:left;background-color:#002";f.appendChild(a);var i=document.createElement("div");i.id="fpsText";i.style.cssText="color:#0ff;font-family:Helvetica,Arial,sans-serif;font-size:9px;font-weight:bold;line-height:15px";
+i.innerHTML="FPS";a.appendChild(i);var c=document.createElement("div");c.id="fpsGraph";c.style.cssText="position:relative;width:74px;height:30px;background-color:#0ff";for(a.appendChild(c);74>c.children.length;){var j=document.createElement("span");j.style.cssText="width:1px;height:30px;float:left;background-color:#113";c.appendChild(j)}var d=document.createElement("div");d.id="ms";d.style.cssText="padding:0 0 3px 3px;text-align:left;background-color:#020;display:none";f.appendChild(d);var k=document.createElement("div");
+k.id="msText";k.style.cssText="color:#0f0;font-family:Helvetica,Arial,sans-serif;font-size:9px;font-weight:bold;line-height:15px";k.innerHTML="MS";d.appendChild(k);var e=document.createElement("div");e.id="msGraph";e.style.cssText="position:relative;width:74px;height:30px;background-color:#0f0";for(d.appendChild(e);74>e.children.length;)j=document.createElement("span"),j.style.cssText="width:1px;height:30px;float:left;background-color:#131",e.appendChild(j);var t=function(b){s=b;switch(s){case 0:a.style.display=
+"block";d.style.display="none";break;case 1:a.style.display="none",d.style.display="block"}};return{domElement:f,setMode:t,begin:function(){l=Date.now()},end:function(){var b=Date.now();g=b-l;n=Math.min(n,g);o=Math.max(o,g);k.textContent=g+" MS ("+n+"-"+o+")";var a=Math.min(30,30-30*(g/200));e.appendChild(e.firstChild).style.height=a+"px";r++;b>m+1E3&&(h=Math.round(1E3*r/(b-m)),p=Math.min(p,h),q=Math.max(q,h),i.textContent=h+" FPS ("+p+"-"+q+")",a=Math.min(30,30-30*(h/100)),c.appendChild(c.firstChild).style.height=
+a+"px",m=b,r=0);return b},update:function(){l=this.end()}}};

js/postprocessing/BloomPass.js

@@ -0,0 +1,100 @@
+/**
+ * @author alteredq / http://alteredqualia.com/
+ */
+
+THREE.BloomPass = function ( strength, kernelSize, sigma, resolution ) {
+
+	strength = ( strength !== undefined ) ? strength : 1;
+	kernelSize = ( kernelSize !== undefined ) ? kernelSize : 25;
+	sigma = ( sigma !== undefined ) ? sigma : 4.0;
+	resolution = ( resolution !== undefined ) ? resolution : 256;
+
+	// render targets
+
+	var pars = { minFilter: THREE.LinearFilter, magFilter: THREE.LinearFilter, format: THREE.RGBFormat };
+
+	this.renderTargetX = new THREE.WebGLRenderTarget( resolution, resolution, pars );
+	this.renderTargetY = new THREE.WebGLRenderTarget( resolution, resolution, pars );
+
+	// screen material
+
+	var screenShader = THREE.ShaderExtras[ "screen" ];
+
+	this.screenUniforms = THREE.UniformsUtils.clone( screenShader.uniforms );
+
+	this.screenUniforms[ "opacity" ].value = strength;
+
+	this.materialScreen = new THREE.ShaderMaterial( {
+
+		uniforms: this.screenUniforms,
+		vertexShader: screenShader.vertexShader,
+		fragmentShader: screenShader.fragmentShader,
+		blending: THREE.AdditiveBlending,
+		transparent: true
+
+	} );
+
+	// convolution material
+
+	var convolutionShader = THREE.ShaderExtras[ "convolution" ];
+
+	this.convolutionUniforms = THREE.UniformsUtils.clone( convolutionShader.uniforms );
+
+	this.convolutionUniforms[ "uImageIncrement" ].value = THREE.BloomPass.blurx;
+	this.convolutionUniforms[ "cKernel" ].value = THREE.ShaderExtras.buildKernel( sigma );
+
+	this.materialConvolution = new THREE.ShaderMaterial( {
+
+		uniforms: this.convolutionUniforms,
+		vertexShader:   "#define KERNEL_SIZE " + kernelSize + ".0\n" + convolutionShader.vertexShader,
+		fragmentShader: "#define KERNEL_SIZE " + kernelSize + "\n"   + convolutionShader.fragmentShader
+
+	} );
+
+	this.enabled = true;
+	this.needsSwap = false;
+	this.clear = false;
+
+};
+
+THREE.BloomPass.prototype = {
+
+	render: function ( renderer, writeBuffer, readBuffer, delta, maskActive ) {
+
+		if ( maskActive ) renderer.context.disable( renderer.context.STENCIL_TEST );
+
+		// Render quad with blured scene into texture (convolution pass 1)
+
+		THREE.EffectComposer.quad.material = this.materialConvolution;
+
+		this.convolutionUniforms[ "tDiffuse" ].texture = readBuffer;
+		this.convolutionUniforms[ "uImageIncrement" ].value = THREE.BloomPass.blurX;
+
+		renderer.render( THREE.EffectComposer.scene, THREE.EffectComposer.camera, this.renderTargetX, true );
+
+
+		// Render quad with blured scene into texture (convolution pass 2)
+
+		this.convolutionUniforms[ "tDiffuse" ].texture = this.renderTargetX;
+		this.convolutionUniforms[ "uImageIncrement" ].value = THREE.BloomPass.blurY;
+
+		renderer.render( THREE.EffectComposer.scene, THREE.EffectComposer.camera, this.renderTargetY, true );
+
+		// Render original scene with superimposed blur to texture
+
+		THREE.EffectComposer.quad.material = this.materialScreen;
+
+		this.screenUniforms[ "tDiffuse" ].texture = this.renderTargetY;
+
+		if ( maskActive ) renderer.context.enable( renderer.context.STENCIL_TEST );
+
+		renderer.render( THREE.EffectComposer.scene, THREE.EffectComposer.camera, readBuffer, this.clear );
+
+	}
+
+};
+
+THREE.BloomPass.blurX = new THREE.Vector2( 0.001953125, 0.0 );
+THREE.BloomPass.blurY = new THREE.Vector2( 0.0, 0.001953125 );
+
+

js/postprocessing/DotScreenPass.js

@@ -0,0 +1,52 @@
+/**
+ * @author alteredq / http://alteredqualia.com/
+ */
+
+THREE.DotScreenPass = function ( center, angle, scale ) {
+
+	var shader = THREE.ShaderExtras[ "dotscreen" ];
+
+	this.uniforms = THREE.UniformsUtils.clone( shader.uniforms );
+
+	if ( center !== undefined )
+		this.uniforms[ "center" ].value.copy( center );
+
+	if ( angle !== undefined )	this.uniforms[ "angle"].value = angle;
+	if ( scale !== undefined )	this.uniforms[ "scale"].value = scale;
+
+	this.material = new THREE.ShaderMaterial( {
+
+		uniforms: this.uniforms,
+		vertexShader: shader.vertexShader,
+		fragmentShader: shader.fragmentShader
+
+	} );
+
+	this.enabled = true;
+	this.renderToScreen = false;
+	this.needsSwap = true;
+
+};
+
+THREE.DotScreenPass.prototype = {
+
+	render: function ( renderer, writeBuffer, readBuffer, delta ) {
+
+		this.uniforms[ "tDiffuse" ].texture = readBuffer;
+		this.uniforms[ "tSize" ].value.set( readBuffer.width, readBuffer.height );
+
+		THREE.EffectComposer.quad.material = this.material;
+
+		if ( this.renderToScreen ) {
+
+			renderer.render( THREE.EffectComposer.scene, THREE.EffectComposer.camera );
+
+		} else {
+
+			renderer.render( THREE.EffectComposer.scene, THREE.EffectComposer.camera, writeBuffer, false );
+
+		}
+
+	}
+
+};

js/postprocessing/EffectComposer.js

@@ -0,0 +1,143 @@
+/**
+ * @author alteredq / http://alteredqualia.com/
+ */
+
+THREE.EffectComposer = function ( renderer, renderTarget ) {
+
+	this.renderer = renderer;
+
+	this.renderTarget1 = renderTarget;
+
+	if ( this.renderTarget1 === undefined ) {
+
+		var width = window.innerWidth || 1;
+		var height = window.innerHeight || 1;
+
+		this.renderTargetParameters = { minFilter: THREE.LinearFilter, magFilter: THREE.LinearFilter, format: THREE.RGBFormat, stencilBuffer: false };
+		this.renderTarget1 = new THREE.WebGLRenderTarget( width, height, this.renderTargetParameters );
+
+	}
+
+	this.renderTarget2 = this.renderTarget1.clone();
+
+	this.writeBuffer = this.renderTarget1;
+	this.readBuffer = this.renderTarget2;
+
+	this.passes = [];
+
+	this.copyPass = new THREE.ShaderPass( THREE.ShaderExtras[ "screen" ] );
+
+};
+
+THREE.EffectComposer.prototype = {
+
+	swapBuffers: function() {
+
+		var tmp = this.readBuffer;
+		this.readBuffer = this.writeBuffer;
+		this.writeBuffer = tmp;
+
+	},
+
+	addPass: function ( pass ) {
+
+		this.passes.push( pass );
+
+	},
+
+	render: function ( delta ) {
+
+		this.writeBuffer = this.renderTarget1;
+		this.readBuffer = this.renderTarget2;
+
+		var maskActive = false;
+
+		var pass, i, il = this.passes.length;
+
+		for ( i = 0; i < il; i ++ ) {
+
+			pass = this.passes[ i ];
+
+			if ( !pass.enabled ) continue;
+
+			pass.render( this.renderer, this.writeBuffer, this.readBuffer, delta, maskActive );
+
+			if ( pass.needsSwap ) {
+
+				if ( maskActive ) {
+
+					var context = this.renderer.context;
+
+					context.stencilFunc( context.NOTEQUAL, 1, 0xffffffff );
+
+					this.copyPass.render( this.renderer, this.writeBuffer, this.readBuffer, delta );
+
+					context.stencilFunc( context.EQUAL, 1, 0xffffffff );
+
+				}
+
+				this.swapBuffers();
+
+			}
+
+			if ( pass instanceof THREE.MaskPass ) {
+
+				maskActive = true;
+
+			} else if ( pass instanceof THREE.ClearMaskPass ) {
+
+				maskActive = false;
+
+			}
+
+		}
+
+	},
+
+	reset: function ( renderTarget ) {
+
+		this.renderTarget1 = renderTarget;
+
+		if ( this.renderTarget1 === undefined ) {
+
+			this.renderTarget1 = new THREE.WebGLRenderTarget( window.innerWidth, window.innerHeight, this.renderTargetParameters );
+
+		}
+
+		this.renderTarget2 = this.renderTarget1.clone();
+
+		this.writeBuffer = this.renderTarget1;
+		this.readBuffer = this.renderTarget2;
+
+		THREE.EffectComposer.quad.scale.set( window.innerWidth, window.innerHeight, 1 );
+
+		THREE.EffectComposer.camera.left = window.innerWidth / - 2;
+		THREE.EffectComposer.camera.right = window.innerWidth / 2;
+		THREE.EffectComposer.camera.top = window.innerHeight / 2;
+		THREE.EffectComposer.camera.bottom = window.innerHeight / - 2;
+
+		THREE.EffectComposer.camera.updateProjectionMatrix();
+
+	}
+
+};
+
+// shared ortho camera
+
+THREE.EffectComposer.initWidth = window.innerWidth || 1;
+THREE.EffectComposer.initHeight = window.innerHeight || 1;
+
+THREE.EffectComposer.camera = new THREE.OrthographicCamera( THREE.EffectComposer.initWidth / - 2, THREE.EffectComposer.initWidth / 2, THREE.EffectComposer.initHeight / 2, THREE.EffectComposer.initHeight / - 2, -10000, 10000 );
+
+// shared fullscreen quad scene
+
+THREE.EffectComposer.geometry = new THREE.PlaneGeometry( 1, 1 );
+THREE.EffectComposer.geometry.applyMatrix( new THREE.Matrix4().makeRotationX( Math.PI / 2 ) );
+
+THREE.EffectComposer.quad = new THREE.Mesh( THREE.EffectComposer.geometry, null );
+THREE.EffectComposer.quad.position.z = -100;
+THREE.EffectComposer.quad.scale.set( THREE.EffectComposer.initWidth, THREE.EffectComposer.initHeight, 1 );
+
+THREE.EffectComposer.scene = new THREE.Scene();
+THREE.EffectComposer.scene.add( THREE.EffectComposer.quad );
+THREE.EffectComposer.scene.add( THREE.EffectComposer.camera );

js/postprocessing/FilmPass.js

@@ -0,0 +1,51 @@
+/**
+ * @author alteredq / http://alteredqualia.com/
+ */
+
+THREE.FilmPass = function ( noiseIntensity, scanlinesIntensity, scanlinesCount, grayscale ) {
+
+	var shader = THREE.ShaderExtras[ "film" ];
+
+	this.uniforms = THREE.UniformsUtils.clone( shader.uniforms );
+
+	this.material = new THREE.ShaderMaterial( {
+
+		uniforms: this.uniforms,
+		vertexShader: shader.vertexShader,
+		fragmentShader: shader.fragmentShader
+
+	} );
+
+	if ( grayscale !== undefined )	this.uniforms.grayscale.value = grayscale;
+	if ( noiseIntensity !== undefined ) this.uniforms.nIntensity.value = noiseIntensity;
+	if ( scanlinesIntensity !== undefined ) this.uniforms.sIntensity.value = scanlinesIntensity;
+	if ( scanlinesCount !== undefined ) this.uniforms.sCount.value = scanlinesCount;
+
+	this.enabled = true;
+	this.renderToScreen = false;
+	this.needsSwap = true;
+
+};
+
+THREE.FilmPass.prototype = {
+
+	render: function ( renderer, writeBuffer, readBuffer, delta ) {
+
+		this.uniforms[ "tDiffuse" ].texture = readBuffer;
+		this.uniforms[ "time" ].value += delta;
+
+		THREE.EffectComposer.quad.material = this.material;
+
+		if ( this.renderToScreen ) {
+
+			renderer.render( THREE.EffectComposer.scene, THREE.EffectComposer.camera );
+
+		} else {
+
+			renderer.render( THREE.EffectComposer.scene, THREE.EffectComposer.camera, writeBuffer, false );
+
+		}
+
+	}
+
+};

js/postprocessing/MaskPass.js

@@ -0,0 +1,86 @@
+/**
+ * @author alteredq / http://alteredqualia.com/
+ */
+
+THREE.MaskPass = function ( scene, camera ) {
+
+	this.scene = scene;
+	this.camera = camera;
+
+	this.enabled = true;
+	this.clear = true;
+	this.needsSwap = false;
+
+	this.inverse = false;
+
+};
+
+THREE.MaskPass.prototype = {
+
+	render: function ( renderer, writeBuffer, readBuffer, delta ) {
+
+		var context = renderer.context;
+
+		// don't update color or depth
+
+		context.colorMask( false, false, false, false );
+		context.depthMask( false );
+
+		// set up stencil
+
+		var writeValue, clearValue;
+
+		if ( this.inverse ) {
+
+			writeValue = 0;
+			clearValue = 1;
+
+		} else {
+
+			writeValue = 1;
+			clearValue = 0;
+
+		}
+
+		context.enable( context.STENCIL_TEST );
+		context.stencilOp( context.REPLACE, context.REPLACE, context.REPLACE );
+		context.stencilFunc( context.ALWAYS, writeValue, 0xffffffff );
+		context.clearStencil( clearValue );
+
+		// draw into the stencil buffer
+
+		renderer.render( this.scene, this.camera, readBuffer, this.clear );
+		renderer.render( this.scene, this.camera, writeBuffer, this.clear );
+
+		// re-enable update of color and depth
+
+		context.colorMask( true, true, true, true );
+		context.depthMask( true );
+
+		// only render where stencil is set to 1
+
+		context.stencilFunc( context.EQUAL, 1, 0xffffffff );  // draw if == 1
+		context.stencilOp( context.KEEP, context.KEEP, context.KEEP );
+
+	}
+
+};
+
+
+THREE.ClearMaskPass = function () {
+
+	this.enabled = true;
+
+};
+
+THREE.ClearMaskPass.prototype = {
+
+	render: function ( renderer, writeBuffer, readBuffer, delta ) {
+
+		var context = renderer.context;
+
+		context.disable( context.STENCIL_TEST );
+
+	}
+
+};

js/postprocessing/RenderPass.js

@@ -0,0 +1,63 @@
+/**
+ * @author alteredq / http://alteredqualia.com/
+ */
+
+THREE.RenderPass = function ( scene, camera, overrideMaterial, clearColor, clearAlpha ) {
+
+	this.scene = scene;
+	this.camera = camera;
+
+	this.overrideMaterial = overrideMaterial;
+
+	this.clearColor = clearColor;
+	this.clearAlpha = ( clearAlpha !== undefined ) ? clearAlpha : 1;
+
+	this.oldClearColor = new THREE.Color();
+	this.oldClearAlpha = 1;
+
+	this.enabled = true;
+	this.clear = true;
+	this.needsSwap = false;
+
+	this.prePass = null;
+	this.postPass = null;
+};
+
+THREE.RenderPass.prototype = {
+
+	render: function ( renderer, writeBuffer, readBuffer, delta ) {
+
+		if( this.prePass )
+		{
+			this.prePass.call(this, renderer);
+		}
+
+		this.scene.overrideMaterial = this.overrideMaterial;
+
+		if ( this.clearColor ) {
+
+			this.oldClearColor.copy( renderer.getClearColor() );
+			this.oldClearAlpha = renderer.getClearAlpha();
+
+			renderer.setClearColor( this.clearColor, this.clearAlpha );
+
+		}
+
+		renderer.render( this.scene, this.camera, readBuffer, this.clear );
+
+		if ( this.clearColor ) {
+
+			renderer.setClearColor( this.oldClearColor, this.oldClearAlpha );
+
+		}
+
+		this.scene.overrideMaterial = null;
+
+		if( this.postPass )
+		{
+			this.postPass.call(this, renderer);
+		}
+
+	}
+
+};

js/postprocessing/SavePass.js

@@ -0,0 +1,52 @@
+/**
+ * @author alteredq / http://alteredqualia.com/
+ */
+
+THREE.SavePass = function ( renderTarget ) {
+
+	var shader = THREE.ShaderExtras[ "screen" ];
+
+	this.textureID = "tDiffuse";
+
+	this.uniforms = THREE.UniformsUtils.clone( shader.uniforms );
+
+	this.material = new THREE.ShaderMaterial( {
+
+		uniforms: this.uniforms,
+		vertexShader: shader.vertexShader,
+		fragmentShader: shader.fragmentShader
+
+	} );
+
+	this.renderTarget = renderTarget;
+
+	if ( this.renderTarget === undefined ) {
+
+		this.renderTargetParameters = { minFilter: THREE.LinearFilter, magFilter: THREE.LinearFilter, format: THREE.RGBFormat, stencilBuffer: false };
+		this.renderTarget = new THREE.WebGLRenderTarget( window.innerWidth, window.innerHeight, this.renderTargetParameters );
+
+	}
+
+	this.enabled = true;
+	this.needsSwap = false;
+	this.clear = false;
+
+};
+
+THREE.SavePass.prototype = {
+
+	render: function ( renderer, writeBuffer, readBuffer, delta ) {
+
+		if ( this.uniforms[ this.textureID ] ) {
+
+			this.uniforms[ this.textureID ].texture = readBuffer;
+
+		}
+
+		THREE.EffectComposer.quad.material = this.material;
+
+		renderer.render( THREE.EffectComposer.scene, THREE.EffectComposer.camera, this.renderTarget, this.clear );
+
+	}
+
+};

js/postprocessing/ShaderPass.js

@@ -0,0 +1,51 @@
+/**
+ * @author alteredq / http://alteredqualia.com/
+ */
+
+THREE.ShaderPass = function ( shader, textureID ) {
+
+	this.textureID = ( textureID !== undefined ) ? textureID : "tDiffuse";
+
+	this.uniforms = THREE.UniformsUtils.clone( shader.uniforms );
+
+	this.material = new THREE.ShaderMaterial( {
+
+		uniforms: this.uniforms,
+		vertexShader: shader.vertexShader,
+		fragmentShader: shader.fragmentShader
+
+	} );
+
+	this.renderToScreen = false;
+
+	this.enabled = true;
+	this.needsSwap = true;
+	this.clear = false;
+
+};
+
+THREE.ShaderPass.prototype = {
+
+	render: function ( renderer, writeBuffer, readBuffer, delta ) {
+
+		if ( this.uniforms[ this.textureID ] ) {
+
+			this.uniforms[ this.textureID ].texture = readBuffer;
+
+		}
+
+		THREE.EffectComposer.quad.material = this.material;
+
+		if ( this.renderToScreen ) {
+
+			renderer.render( THREE.EffectComposer.scene, THREE.EffectComposer.camera );
+
+		} else {
+
+			renderer.render( THREE.EffectComposer.scene, THREE.EffectComposer.camera, writeBuffer, this.clear );
+
+		}
+
+	}
+
+};

js/postprocessing/TexturePass.js

@@ -0,0 +1,37 @@
+/**
+ * @author alteredq / http://alteredqualia.com/
+ */
+
+THREE.TexturePass = function ( texture, opacity ) {
+
+	var shader = THREE.ShaderExtras[ "screen" ];
+
+	this.uniforms = THREE.UniformsUtils.clone( shader.uniforms );
+
+	this.uniforms[ "opacity" ].value = ( opacity !== undefined ) ? opacity : 1.0;
+	this.uniforms[ "tDiffuse" ].texture = texture;
+
+	this.material = new THREE.ShaderMaterial( {
+
+		uniforms: this.uniforms,
+		vertexShader: shader.vertexShader,
+		fragmentShader: shader.fragmentShader
+
+	} );
+
+	this.enabled = true;
+	this.needsSwap = false;
+
+};
+
+THREE.TexturePass.prototype = {
+
+	render: function ( renderer, writeBuffer, readBuffer, delta ) {
+
+		THREE.EffectComposer.quad.material = this.material;
+
+		renderer.render( THREE.EffectComposer.scene, THREE.EffectComposer.camera, readBuffer );
+
+	}
+
+};