function getId() {
	var parts = location.href.split("/");
	return parts[parts.length - 1];
}
function toggleCode() {
	var showButton = document.getElementById("show-button");
	if (showButton.innerHTML == "Show code") {
		loadCode();
		document.getElementById("view-code").style.display = "block";
		showButton.innerHTML = "Hide code";
	} else {
		document.getElementById("view-code").style.display = "none";
		showButton.innerHTML = "Show code";
	}
}
function initShowCode() {
	var showButton = document.getElementById("show-button");
	showButton.addEventListener("click", toggleCode, false);
	showButton.style.display = "inline";

}
function initEditCode() {
	var controlPanel = document.getElementById("control-panel");
	var userIdStart = document.cookie.indexOf("user_id");
	if (userIdStart > -1) {
		var userId = document.cookie.substring(userIdStart + 8, document.cookie.indexOf(";", userIdStart));
		var styleUserId = document.getElementById("user-id").innerHTML;
		if (userId == styleUserId) {
			controlPanel.style.display = "block";
		}
	}
}
function initContextAds() {
	var stylishInstallIE = document.getElementById("stylish-not-installed-ie");
	if (stylishInstallIE && navigator.userAgent.indexOf("MSIE") > -1) {
		document.getElementById("stylish-not-installed").style.display = "none";
		stylishInstallIE.style.display = "list-item";
	}
}
function init() {
	initContextAds();
	initShowCode();
	initEditCode();
}

if (window.addEventListener)
	window.addEventListener("DOMContentLoaded", init, false);
else
	window.onload = init;

function loadCode(callback) {
	var codeElement = document.getElementById('stylish-code');
	if (codeElement.loaded) {
		if (callback) {
			callback();
		}
		return;
	}
	var xhr = new XMLHttpRequest();
	xhr.open('GET', '/styles/' + getId() + '.css', true);
	xhr.onreadystatechange = function(event) {
		if (xhr.readyState == 4) {
			if (xhr.status == 200) {
				codeElement.textContent = xhr.responseText;
				codeElement.loaded = true;
				if (callback)
					callback();
			} else {
				alert('Sorry, an error occurred loading the code.');
			}
			document.body.style.cursor = "";
		}
	}
	document.body.style.cursor = "wait";
	xhr.send(null);
}

//we fire these to tell stylish what to do
function stylishInstall(event) {
	loadCode(stylishInstall2);
}
function stylishInstall2() {
	var stylishEvent = document.createEvent("Events");
	stylishEvent.initEvent("stylishInstall", false, false, window, null);
	//event.target.dispatchEvent(stylishEvent);
	document.dispatchEvent(stylishEvent);
}
function stylishUpdate() {
	loadCode(stylishUpdate2);
}
function stylishUpdate2() {
	var stylishEvent = document.createEvent("Events");
	stylishEvent.initEvent("stylishUpdate", false, false, window, null);
	//event.target.dispatchEvent(stylishEvent);
	document.dispatchEvent(stylishEvent);
}

//stylish will fire this after the user installs or updates
function styleInstalled() {
	document.getElementById("stylish-install").innerHTML = "Style installed in Stylish.";
	document.getElementById("stylish-update").innerHTML = "Style updated in Stylish.";
}

//stylish will fire these on load
function styleCanBeInstalled() {
	document.getElementById("stylish-not-installed").style.display = "none";
	document.getElementById("stylish-install").style.display = "list-item";
}
function styleAlreadyInstalled() {
	document.getElementById("stylish-not-installed").style.display = "none";
	document.getElementById("stylish-update").style.display = "none";
	document.getElementById("stylish-install").style.display = "list-item";
	document.getElementById("stylish-install").innerHTML = "Style already installed in Stylish.";	
}
function styleCanBeUpdated() {
	document.getElementById("stylish-not-installed").style.display = "none";
	document.getElementById("stylish-update").style.display = "list-item";
	document.getElementById("stylish-install").style.display = "none";
}

if (document.addEventListener) {
	document.addEventListener("styleInstalled", styleInstalled, false);
	document.addEventListener("styleAlreadyInstalled", styleAlreadyInstalled, false);
	document.addEventListener("styleCanBeInstalled", styleCanBeInstalled, false);
	document.addEventListener("styleCanBeUpdated", styleCanBeUpdated, false);
	document.addEventListener("styleLoadCode", function(){loadCode(codeLoaded)}, false);
}

function codeLoaded() {
	var stylishEvent = document.createEvent("Events");
	stylishEvent.initEvent("stylishCodeLoaded", false, false, window, null);
	document.dispatchEvent(stylishEvent);
}