function Skin(name, author, authorUrl, width, height, credits) {
	
	this.name = name;
	this.author = author;
	this.authorUrl = authorUrl;
	this.width = width;
	this.height = height;
	this.credits = credits;
	
	
	
	this.getSkinCode = function() {
		var userbgcolor = document.getElementById("userbgcolor");
		var src = document.getElementById("src").value;
		var playlist = document.getElementById("playlist").value;
		var autoload = document.forms["emffForm"].elements["autoload"].checked;
		var autostart = document.forms["emffForm"].elements["autostart"].checked;
		var repeat = document.forms["emffForm"].elements["repeat"].checked;
		var shuffle = document.forms["emffForm"].elements["shuffle"].checked;
		var shortcuts = document.forms["emffForm"].elements["shortcuts"].checked;
		var alternativecontent = document.getElementById("alternativecontent").value;
		var volume = parseInt(document.forms["emffForm"].elements["volumefield"].value);
		var balance = parseInt(document.forms["emffForm"].elements["balancefield"].value);
		var groupname = document.getElementById("groupname").value;
		
		volume = (!isNaN(volume) && volume >= 0 && volume <= 100) ? volume : 100;
		balance = (!isNaN(balance) && balance >= -100 && balance <= 100) ? balance : 0;
		
		var code = "";
		
		// HTML or XHTML?
		var suffix = "";
		if (document.getElementById("xhtml").checked) {
			suffix = " /";
		}
		
		// movie
		code += "<object type=\"application/x-shockwave-flash\" data=\"emff_" + name + ".swf\" width=\"" + width + "\" height=\"" + height + "\">\n";
		code += " <param name=\"movie\" value=\"emff_" + name + ".swf\"" + suffix + ">\n";
		
		// background color
		switch (userbgcolor.value) {
		case "standard":
			break;
		case "userdefined":
		default:
			if (/^\#[0-9a-f]{6}$/.exec(userbgcolor.value) != null) {
				code += " <param name=\"bgcolor\" value=\"" + userbgcolor.value + "\"" + suffix + ">\n";
			}
		}
		
		// EMFF arguments
		var emffArguments = "";
		if (document.forms["emffForm"].elements["source"][0].checked) {
			// src
			emffArguments += "src=" + encodeURIComponent(src);
		} else {
			// playlist
			emffArguments += "playlist=" + encodeURIComponent(playlist);
		}
		
		// various options
		if (autoload) {
			emffArguments += "&amp;autoload=yes";
		}
		if (autostart) {
			emffArguments += "&amp;autostart=yes";
		}
		if (repeat) {
			emffArguments += "&amp;repeat=yes";
		}
		if (shuffle) {
			emffArguments += "&amp;shuffle=yes";
		}
		if (shortcuts) {
			emffArguments += "&amp;shortcuts=yes";
		}
		if (volume != 100) {
			emffArguments += "&amp;volume=" + volume;
		}
		if (balance != 0) {
			emffArguments += "&amp;balance=" + balance;
		}
		
		// groups
		if (/^[a-zA-Z0-9_]+$/.exec(groupname) != null && groupname.length < 42) {
			emffArguments += "&amp;groupname=" + encodeURIComponent(groupname);
		}
		
		
		
		code += " <param name=\"FlashVars\" value=\"" + emffArguments + "\"" + suffix + ">\n";
		
		// alternative content
		if (alternativecontent != "") {
			code += " " + alternativecontent + "\n";
		}
		
		code += "</object>";
		
		return code;
	}
	
	
	
	this.getPreviewCode = function() {
		var userbgcolor = document.getElementById("userbgcolor");
		
		var code = "";
		
		code += "<object type=\"application/x-shockwave-flash\" data=\"" + skinDir + "emff_" + name + ".swf\" width=\"" + width + "\" height=\"" + height + "\">\n";
		code += " <param name=\"movie\" value=\"" + skinDir + "emff_" + name + ".swf\" />\n";
		code += " <param name=\"FlashVars\" value=\"playlist=test.xml\" />\n";
		
		// background color
		switch (userbgcolor.value) {
		case "standard":
			break;
		case "userdefined":
		default:
			if (/^\#[0-9a-f]{6}$/.exec(userbgcolor.value) != null) {
				code += " <param name=\"bgcolor\" value=\"" + userbgcolor.value + "\" />\n";
			}
		}
		
		code += "</object>";
		
		return code;
	}
	
	
	
	this.updatePreview = function() {
		var more = document.getElementById("more");
		
		// remove all childs
		while (more.hasChildNodes()) {
			more.removeChild(more.firstChild);
		}
		
		
		
		// create and append child nodes
		if (author != "") {
			more.appendChild(document.createTextNode("Author: "));
			if (authorUrl == "") {
				// no link available
				more.appendChild(document.createTextNode(author));
			} else {
				// link available
				var authorLink = document.createElement("a");
				authorLink.setAttribute("href", authorUrl);
				authorLink.appendChild(document.createTextNode(author));
				more.appendChild(authorLink);
			}
			more.appendChild(document.createElement("br"));
		}
		
		if (credits != "") {
			more.appendChild(document.createTextNode("Credits: " + credits));
			more.appendChild(document.createElement("br"));
		}
		
		var previewHeader = document.createElement("h2");
		previewHeader.appendChild(document.createTextNode("Preview (without options):"));
		more.appendChild(previewHeader);
		
		// write preview
		more.innerHTML += this.getPreviewCode();
	}
	
	
	
	this.updateCode = function() {
		// write emff code
		var emffcode = document.getElementById("emffcode");
		while (emffcode.hasChildNodes()) {
			emffcode.removeChild(emffcode.firstChild);
		}
		
		if (navigator.userAgent.indexOf("MSIE") != -1) {
			var skincode = this.getSkinCode();
			var lines = skincode.split("\n");
			for (var i = 0; i < lines.length; i++) {
				emffcode.appendChild(document.createTextNode(lines[i]));
				if (i != lines.length - 1) {
					emffcode.appendChild(document.createElement("br"));
				}
			}
		} else {
			emffcode.appendChild(document.createTextNode(this.getSkinCode()));
		}
	}
	
}

var currentSkin;



function updateCode() {
	var src = document.getElementById("src");
	var playlist = document.getElementById("playlist");
	
	if (document.forms["emffForm"].elements["source"][0].checked) {
		// use src
		src.disabled = false;
		playlist.disabled = true;
	} else {
		// use playlist
		playlist.disabled = false;
		src.disabled = true;
	}
	
	currentSkin = skins[document.getElementById("skin").selectedIndex];
	currentSkin.updateCode();
}



function updatePreview() {
	currentSkin = skins[document.getElementById("skin").selectedIndex];
	currentSkin.updatePreview();
}



function changeColor() {
	var bgcolor = document.getElementById("bgcolor");
	var userbgcolor = document.getElementById("userbgcolor");
	
	switch (bgcolor.options[bgcolor.selectedIndex].value) {
	case "standard":
		userbgcolor.value = bgcolor.options[bgcolor.selectedIndex].value;
		userbgcolor.disabled = true;
		break;
	case "userdefined":
// 		userbgcolor.value = "#ffffff";
		userbgcolor.disabled = false;
		break;
	default:
		userbgcolor.value = bgcolor.options[bgcolor.selectedIndex].value;
		userbgcolor.disabled = true;
	}
	
	updateCode();
	updatePreview();
}

function showAdvancedOptions() {
	document.getElementById("advancedoptions").style.display = "block";
	document.getElementById("advancedoptionsokbutton").focus();
}

function hideAdvancedOptions() {
	document.getElementById("advancedoptions").style.display = "none";
}



function init() {
	
	// add all skins
	var skin = document.getElementById("skin");
	
	for (var i = 0; i < skins.length; i++) {
		var option = document.createElement("option");
		
		option.setAttribute("value", skins[i].name);
		
		var textValue = document.createTextNode(skins[i].name);
		option.appendChild(textValue);
		
		if (skins[i].name == "standard") {
			// "standard" skin selected by default
			option.setAttribute("selected", "selected");
		}
		
		skin.appendChild(option);
	}
	
	// initial change
	changeColor();
	
}