"use strict";

/* WORK
 * IN
 * PROGRESS
 *
 * Interface:
 *
 * nmsMap.init() - start things up
 * nmsMap.setSwitchColor(switch,color)
 * nmsMap.setSwitchInfo(switch,info)
 */


var nmsMap = nmsMap || {
	stats: {
		earlyDrawAll:0,
		colorChange:0,
		colorSame:0,
		resizeEvents:0,
		switchInfoUpdate:0,
		switchInfoSame:0
	},
	contexts: ["bg","link","blur","switch","text","textInfo","top","input","hidden"],
	_info: {},
	_settings: {
		fontLineFactor: 3,
		textMargin: 3,
		xMargin: 10,
		yMargin: 20
	},
	scale: 1,
	_orig: { width:1920, height:1032 },
	_canvas: {
		get width() { return nmsMap.scale * nmsMap._orig.width; },
		get height() { return nmsMap.scale * nmsMap._orig.height; }
	},

	_color: { },
	_c: {}
}

nmsMap.init = function() {
	this._initContexts();
	this._drawBG();
	nmsData.registerSource("switches","/api/public/switches",function(){nmsMap._drawAllSwitches();});
	window.addEventListener('resize',nmsMap._resizeEvent,true);
	document.addEventListener('load',nmsMap._resizeEvent,true);
	this._drawAllSwitches();
}

nmsMap.setSwitchColor = function(sw, color) {
	if (this._color[sw] != color) {
		this._color[sw] = color;
		this._drawSwitch(sw);
		this.stats.colorChange++;
	} else {
		this.stats.colorSame++;
	}
}

nmsMap.reset = function() {
	for (var sw in this._color) {
		nmsMap.setSwitchColor(sw, undefined);
	}
	for (var sw in this._info) {
		nmsMap.setSwitchInfo(sw, undefined);
	}
}

nmsMap.setSwitchInfo = function(sw,info) {
	if (this._info[sw] != info) {
		this._info[sw] = info;
		this._drawSwitchInfo(sw);
		this.stats.switchInfoUpdate++;
	} else {
		this.stats.switchInfoSame++;
	}
}

nmsMap._initContext = function(name) {
	this._c[name] = {};
	this._c[name].c = document.getElementById(name + "Canvas");
	this._c[name].ctx = this._c[name].c.getContext('2d');
}

nmsMap._initContexts = function() {
	for (var context in this.contexts) {
		this._initContext(this.contexts[context]);
	}
}

nmsMap._resizeEvent = function() {
	var width = window.innerWidth - nmsMap._c.bg.c.offsetLeft;
	var height = window.innerHeight - nmsMap._c.bg.c.offsetTop;

	var xScale = (width / (nmsMap._orig.width + nmsMap._settings.xMargin));
	var yScale = (height / (nmsMap._orig.height + nmsMap._settings.yMargin));
	
	if (xScale > yScale) {
		nmsMap.scale = yScale;	
	} else {
		nmsMap.scale = xScale;
	}
	for (var a in nmsMap._c) {
		/*
		 * Resizing this to a too small size breaks gradients on smaller screens.
		 */
		if (a == 'hidden')
			continue;
		nmsMap._c[a].c.height = nmsMap._canvas.height;
		nmsMap._c[a].c.width = nmsMap._canvas.width;
	}
	nmsMap._drawBG();
	nmsMap._drawAllSwitches();
	nmsMap.stats.resizeEvents++;
}

nmsMap.setNightMode = function(toggle) {
	if (this._nightmode == toggle)
		return;
	this._nightmode = toggle;
	nmsMap._drawBG();
}

nmsMap._drawBG = function() {
	var imageObj = document.getElementById('source');
	this._c.bg.ctx.drawImage(imageObj, 0, 0, nmsMap._canvas.width, nmsMap._canvas.height);
	if(this._nightmode)
		nmsMap._invertBG();
}

nmsMap._invertBG = function() {
	var imageData = this._c.bg.ctx.getImageData(0, 0, nmsMap._canvas.width, nmsMap._canvas.height);
	var data = imageData.data;

	for(var i = 0; i < data.length; i += 4) {
		data[i] = 255 - data[i];
		data[i + 1] = 255 - data[i + 1];
		data[i + 2] = 255 - data[i + 2];
	}
	this._c.bg.ctx.putImageData(imageData, 0, 0);
}

nmsMap._getBox = function(sw) {
	var box = nmsData.switches.switches[sw]['placement'];
	box.x = parseInt(box.x);
	box.y = parseInt(box.y);
	box.width = parseInt(box.width);
	box.height = parseInt(box.height);
	return box;
}

nmsMap._drawSwitch = function(sw)
{
	var box = this._getBox(sw);
	var color = nmsMap._color[sw];
	if (color == undefined) {
		color = blue;
	}
	this._c.switch.ctx.fillStyle = color;
	this._drawBox(this._c.switch.ctx, box['x'],box['y'],box['width'],box['height']);
	this._c.switch.ctx.shadowBlur = 0;
	this._drawSidewaysText(this._c.text.ctx, sw,box);
	/*
		if ((box['width'] + 10 )< box['height']) {
			//
		} else {
			//drawRegular(dr.text.ctx,sw,box['x'],box['y'],box['width'],box['height']);
		}
	*/
}

nmsMap._drawSwitchInfo = function(sw) {
	var box = this._getBox(sw);
	if (this._info[sw] == undefined) {
		this._clearBox(this._c.textInfo.ctx, box);
	} else {
		this._drawSidewaysText(this._c.textInfo.ctx, this._info[sw], box, "right");
	}
}

nmsMap._clearBox = function(ctx,box) {
	ctx.save();
	ctx.scale(this.scale,this.scale);
	ctx.clearRect(box['x'], box['y'], box['width'], box['height']);
	ctx.restore();
}

nmsMap._drawSidewaysText = function(ctx, text, box, align) {
	this._clearBox(ctx,box);
	ctx.save();
	ctx.scale(this.scale, this.scale); // FIXME: Do it everywhere?
	ctx.lineWidth = Math.floor(nmsMap._settings.fontLineFactor);
	if (ctx.lineWidth == 0) {
		ctx.lineWidth = Math.round(nms._settings.fontLineFactor);
	}
	ctx.fillStyle = "white";
	ctx.strokeStyle = "black";
	ctx.translate(box.x + box.width - this._settings.textMargin, box.y + box.height - this._settings.textMargin);
	ctx.rotate(Math.PI * 3/2);
	if (align == "right") {
		ctx.textAlign = "right";
		/*
		 * Margin*2 is to compensate for the margin above.
		 */
		ctx.translate(box.height - this._settings.textMargin*2,0);
	}
	ctx.strokeText(text, 0, 0);
	ctx.fillText(text, 0, 0);
	ctx.restore();
}

nmsMap._drawAllSwitches = function() {
	if (nmsData.switches == undefined) {
		this.stats.earlyDrawAll++;
		return;
	}
	for (var sw in nmsData.switches.switches) {
		this._drawSwitch(sw);
	}
}

nmsMap._drawBox = function(ctx, x, y, boxw, boxh) {
	ctx.save();
	ctx.scale(this.scale, this.scale); // FIXME
	ctx.fillRect(x,y, boxw, boxh);
	ctx.lineWidth = 1;
	ctx.strokeStyle = "#000000";
	ctx.strokeRect(x,y, boxw, boxh);
	ctx.restore();

}

nmsMap._connectSwitches = function(sw1, sw2, color1, color2) {
	nmsMap._connectBoxes(this._getBox(sw1), this._getBox(sw2),
			     color1, color2);
}

/*
 * Draw a line between two boxes, with a gradient going from color1 to
 * color2.
 */
nmsMap._connectBoxes = function(box1, box2,color1, color2) {
	var ctx = nmsMap._c.link.ctx;
	if (color1 == undefined)
		color1 = blue;
	if (color2 == undefined)
		color2 = blue;
	var x0 = Math.floor(box1.x + box1.width/2);
	var y0 = Math.floor(box1.y + box1.height/2);
	var x1 = Math.floor(box2.x + box2.width/2);
	var y1 = Math.floor(box2.y + box2.height/2);
	ctx.save();
	ctx.scale(nmsMap.scale, nmsMap.scale);
	var gradient = ctx.createLinearGradient(x1,y1,x0,y0);
	gradient.addColorStop(0, color1);
	gradient.addColorStop(1, color2);
	ctx.strokeStyle = gradient;
	ctx.moveTo(x0,y0);
	ctx.lineTo(x1,y1); 
	ctx.lineWidth = 5;
	ctx.stroke();
	ctx.restore();
}