var componentMap = {
	SessionManager : {
		icon : "/gfx/statusIcons/SessionManager.png",
		friendlyName : "Sessionshanterare",
		message : {
			connected : "Ansluten till sessionshanteraren",
			authenticated : "Autentiserad mot sessionshanteraren"
		}
	},
	SessionAgent : {
		icon : "/gfx/statusIcons/SessionAgent.png",
		friendlyName : "Sessionsagent",
		message : {
			connected: "Ansluten till sessionsagenten",
			authenticated: "Autentiserad mot sessionsagenten"
		}
	},
	SessionClientCommandTunnel : {
		icon : "/gfx/statusIcons/SessionClientCommandTunnel.png",
		friendlyName : "Klientens kommandotunnel",
		message : {
			established: "Klientens kommandotunnel upprättad"
		}
	},
	SessionHostCommandTunnel : {
		icon : "/gfx/statusIcons/SessionHostCommandTunnel.png",
		friendlyName : "Värdens kommandotunnel",
		message : {
			established: "Värdens kommandotunnel upprättad"
		}
	},
	SessionHostService : {
		icon : "/gfx/statusIcons/SessionHostService.png",
		friendlyName : "Värdtjänst",
		message : {
			connected: "Värdtjänsten ansluten"
		}
	},
	SessionClientService : {
		icon : "/gfx/statusIcons/SessionClientService.png",
		friendlyName : "Klienttjänst",
		message : {
			published: "Klienttjänsten publicerad"
		}
	},
	SessionHost : {
		icon : "/gfx/statusIcons/SessionHost.png",
		friendlyName : "Sessionsvärd",
		message : {
			connected: "Sessionsvärden ansluten"
		}
	},
	ClientTasks : {
		icon : "/gfx/statusIcons/ClientTasks.png",
		friendlyName : "Klientuppgifter",
		message : {
			recieved: "Klientinstruktioner mottagna",
			initiated: "Klientinstruktioner inlästa",
			running : "Klientinstruktioner utförs"
		}
	}
}

function getFullscreenFromResolutionString(string){
	return string == "auto";
}

function getResolutionFromResolutionString(string){
	if(string != "auto")
		return string;
	return screen.width+'x'+screen.height;
}

function cover(element, margin){
	this.coverElement = document.createElement("div");
	this.coverElement.id = "cover";
	this.coverElement.className = "cover";
	this.coverElement.style.position = "absolute";
	this.coverElement.style.top = (element.offsetTop + margin) + "px";
	this.coverElement.style.left = (element.offsetLeft + margin) + "px";
	this.coverElement.style.width = (element.offsetWidth - margin * 2) + "px";
	this.coverElement.style.height = (element.offsetHeight - margin * 2) + "px";
	document.getElementsByTagName("body")[0].appendChild(this.coverElement);
}

function componentStatusBar(){
	this.table = document.createElement("table");
	this.table.className = "statusBar";
	this.statusRow = this.table.appendChild(document.createElement("tr"));
	
	this.messageRow = this.table.appendChild(document.createElement("tr"));
	this.messageCell = this.messageRow.appendChild(document.createElement("td"));
	this.messageCell._colspan = 1;
	this.messageCell.id = "message";
	this.messageCell.message = this.messageCell.appendChild(document.createElement("div"));
	this.messageCell.message.className = "message";
	
	this.errorRow = this.table.appendChild(document.createElement("tr"));
	this.errorCell = this.errorRow.appendChild(document.createElement("td"));
	this.errorCell.style.display = "none";
	this.errorCell._colspan = 1;
	this.errorCell.id = "error";
	this.errorCell.message = this.errorCell.appendChild(document.createElement("div"));
	this.errorCell.message.className = "message";
	this.errorCell.button = this.errorCell.appendChild(document.createElement("button"));
	this.errorCell.button.innerHTML = "OK";
	this.errorCell.button.onclick = function(){
		window.location.reload();
	}
	
	this.componentCount = 0;
	this.addComponentStatusField = function(componentStatusField){
		this.componentCount++;
		componentStatusField.componentStatusBar = this;
		this.statusRow.appendChild(componentStatusField.mainTag);
		this.messageCell.setAttribute("colspan", this.componentCount+1);
		this.errorCell.setAttribute("colspan", this.componentCount+1);
		return componentStatusField;
	}

	this.showMessage = function(message){
		this.messageCell.message.innerHTML = message;
	}
	
	this.showError = function(error){
		this.errorCell.message.innerHTML = error;
		this.errorCell.style.display = "";
	}
	
	this.render = function(parentElement){
		parentElement.appendChild(this.table);
	}
	
}

function componentStatusField(component){
	this.component = component;
	this.mainTag = document.createElement("td");
	this.iconTag = this.mainTag.appendChild(document.createElement("img"));
	this.iconTag.src = this.component.icon;
	this.descriptionTag = this.mainTag.appendChild(document.createElement("div"));
	this.descriptionTag.className = "description";
	this.descriptionTag.appendChild(document.createTextNode(this.component.friendlyName));
	this.statusTag = this.mainTag.appendChild(document.createElement("div"));
	this.statusTag.className = "status";
	this.progressTag = this.mainTag.appendChild(document.createElement("div"));
	this.progressTag.className = "progress";
	
	this.setStatus = function(status){
		this.componentStatusBar.showMessage(this.component.message[status]);
//		this.statusTag.innerHTML = status;
	}
	this.setProgress = function(progress){
		this.progressTag.innerHTML = progress + "%";
	}
	this.setProgress("0");
}

function clearCover(){
	var coverObj = document.getElementById("cover");
	coverObj.parentNode.removeChild(coverObj);
}

function login(form) {

	var coverObj = new cover(form, 8);
	var statusBar = new componentStatusBar();
	for(var component in componentMap)
		componentMap[component].componentStatusField = statusBar.addComponentStatusField(new componentStatusField(componentMap[component]));
	statusBar.render(coverObj.coverElement);

	window.setTimeout("clearCover()", 30000);
	
	var loginApplet = new LoginApplet();
	
	loginApplet.setOnClientStatus(
			function(component, status, progress) {
				componentMap[component].componentStatusField.setStatus(status);
				componentMap[component].componentStatusField.setProgress(progress);
			}
		);
	loginApplet.setOnClientError(
			function(errorMessage) {
				statusBar.showError(errorMessage);
			}
		);
	loginApplet.setOnClientOut(
			function(outMessage) {
//				statusBar.showMessage(outMessage);
			}
		);
	loginApplet.setOnClientExit(
			function(exitCode) {
				alert("exit");
			}
		);
	loginApplet.setUsername(form.username.value);
	loginApplet.setPassword(form.password.value);
	loginApplet.setJpegQuality(form.jpeqQuailty.value);
	loginApplet.setResolution(getResolutionFromResolutionString(form.resolution.value));
	loginApplet.setFullscreen(getFullscreenFromResolutionString(form.resolution.value));

	loginApplet.login();
	form.reset();
}