function Map(selector)
{
	this.stats = new Stats();

	// Align top-left
	this.stats.domElement.style.position = 'fixed';
	this.stats.domElement.style.left = '0';
	this.stats.domElement.style.top = '0';
	this.stats.domElement.style.zIndex = '10000';

	document.body.appendChild( this.stats.domElement );
	
	this.container = $(selector);
	
	this.container.width(this.container.parent().width());
	this.container.height(this.container.parent().parent().height() - 61);
	
	this.windowHalfX = this.container.width() / 2;
	this.windowHalfY = this.container.height() / 2;
	
	this.mouseX = this.windowHalfX;
	this.mouseY = this.windowHalfY;
	
	this.generateScene();
	this.generatePlane();
	this.generateBuildings();
	this.generateLights();
	this.addToDOM();
	
	this.animate();
	
	var t = this;
	
	this.container.click(function(e)
	{
		//t.click(e);
	});
	
	this.container.mousemove(function(e)
	{
		t.mouseMove(e);
	});
	
	this.container.mousedown(function(e)
	{
		t.mouseDown(e);
	});
	
	this.container.mouseup(function(e)
	{
		t.mouseUp(e);
	});
}

Map.prototype.generateScene = function()
{
	this.projector = new THREE.Projector();
	
	this.scene = new THREE.Scene();
	this.scene2 = new THREE.Scene();
	
	this.camera = new THREE.PerspectiveCamera(75, this.container.innerWidth() / this.container.innerHeight(), 1, 10000);
	this.camera.position.x = -500;
	this.camera.position.y = 100;
	this.camera.position.z = 300;
	
	this.camera.lookAt({x: -300, y: 0, z: 0});
	
	this.scene2.add(this.camera);
}

Map.prototype.generatePlane = function()
{	
	var img = new THREE.MeshBasicMaterial({
		color: 0xCCCCCC,
		map: THREE.ImageUtils.loadTexture('images/map.jpg'),
		overdraw: true
	});
	
	img.map.needsUpdate = true;
	
	this.plane = new THREE.Mesh(new THREE.PlaneGeometry(2048, 2048, 16, 16), img);
	
	this.scene.add(this.plane);
}

Map.prototype.generateBuildings = function()
{
	//this._addCube(10, 10, 10, 0, 0, 0);
}

Map.prototype._addCube = function(w, h, d, x, y, z)
{
	var geometry = new THREE.CubeGeometry(w, h, d);
	var material = new THREE.MeshLambertMaterial({
		color: 0xffffff,
		shading: THREE.FlatShading,
		overdraw: true
	});
	
	var cube = new THREE.Mesh(geometry, material);
	
	cube.position.x = x;
	cube.position.y = y + (h / 2);
	cube.position.z = z;
	
	this.scene2.add(cube);
}

Map.prototype.generateLights = function()
{
	var ambientLight = new THREE.AmbientLight(Math.random() * 0x10);
	
	this.scene2.add(ambientLight);
	
	var directionalLight = new THREE.DirectionalLight(Math.random() * 0xffffff);
	directionalLight.position.x = Math.random() - 0.5;
	directionalLight.position.y = Math.random() - 0.5;
	directionalLight.position.z = Math.random() - 0.5;
	directionalLight.position.normalize();
	
	this.scene2.add(directionalLight);
	
	var directionalLight = new THREE.DirectionalLight(Math.random() * 0xffffff);
	directionalLight.position.x = Math.random() - 0.5;
	directionalLight.position.y = Math.random() - 0.5;
	directionalLight.position.z = Math.random() - 0.5;
	directionalLight.position.normalize();
	
	this.scene2.add(directionalLight);
}

Map.prototype.addToDOM = function(selector)
{
	//this.renderer = new THREE.WebGLRenderer();
	this.renderer = new THREE.CanvasRenderer();
	this.renderer.setSize(this.container.innerWidth(), this.container.innerHeight());
	
	this.renderer.autoClear = false;
	
	this.container.append(this.renderer.domElement);
}

Map.prototype.getMousePosition = function(event)
{
	var parentOffset = this.container.offset();
	var clickX = event.pageX - parentOffset.left;
	var clickY = event.pageY - parentOffset.top;
	
	var vector = new THREE.Vector3((clickX / this.container.innerWidth()) * 2 - 1, - (clickY / this.container.innerHeight()) * 2 + 1, 1);
	this.projector.unprojectVector(vector, this.camera);
	
	var ray = new THREE.Ray(this.camera.position, vector.subSelf(this.camera.position).normalize());
	
	var intersect = ray.intersectObject(this.plane);
	
	return intersect[0].point;
}

Map.prototype.mouseDown = function(event)
{
	this.mouseStartPosition = this.getMousePosition(event);
}

Map.prototype.mouseUp = function(event)
{
	var pos = this.getMousePosition(event);
	
	var width = Math.abs(this.mouseStartPosition.x - pos.x);
	var depth = Math.abs(this.mouseStartPosition.z - pos.z);
	
	var middleX = (pos.x + this.mouseStartPosition.x) / 2;
	var middleZ = (pos.z + this.mouseStartPosition.z) / 2;
	
	this._addCube(width, 10, depth, middleX, 0, middleZ);
}

Map.prototype.mouseMove = function(event)
{
	var parentOffset = this.container.offset();
	
	var clickX = event.pageX - parentOffset.left;
	var clickY = event.pageY - parentOffset.top;
	
	this.mouseX = clickX - this.windowHalfX;
	this.mouseY = clickY - this.windowHalfY;
}

Map.prototype.animate = function()
{
	this.stats.begin();
	this.render();
	this.stats.end();
}

Map.prototype.render = function()
{
	this.camera.position.x += (this.mouseX - this.camera.position.x) * 0.05;
	this.camera.position.y += ((-this.mouseY - this.camera.position.y) * 0.05);
	
	this.camera.lookAt(this.scene.position);
	
	this.renderer.clear();
	
	this.renderer.render(this.scene, this.camera);
	this.renderer.render(this.scene2, this.camera);
}