var Wizard = Class.create({
	initialize: function(id) {
		this.w = 650;
		this.id = id;
		this.title = "Wizard";
		this.content = "Wizard";
	},
	
	show: function() {
		//display overlay
		overlay();
		
		wizard_win = document.createElement("div");
		wizard_win.id = this.id;
		wizard_win.className = "wizard";
		
		with(wizard_win.style) {
			display = "block";
			position = "absolute";
			top = eval(100 + document.viewport.getScrollOffsets().top) + "px";
			left = eval(Math.round(((document.viewport.getWidth() - this.w) / 2) + document.viewport.getScrollOffsets().left)) + "px";
			width = this.w + "px";
			zIndex = get_highest_zindex() + 1;
		}
		
		wizard_content = document.createElement("div");
		wizard_content.id = "wizard_content";
		wizard_content.className = "section";
		wizard_title = document.createElement("h1");
		wizard_title.id = "wizard_title";
		wizard_title.className = "wizard_title";
		wizard_title_txt = document.createTextNode(this.title);
		wizard_title.appendChild(wizard_title_txt);
		wizard_body = document.createElement("div");
		wizard_body.id = "wizard_body";
		wizard_body.className = "wizard_body";
		wizard_body.innerHTML = this.content;
		
		wizard_content.appendChild(wizard_title);
		wizard_content.appendChild(wizard_body);
		wizard_win.appendChild(wizard_content);
		
		$("content").appendChild(wizard_win);
	}
});

function close_wizard(id) {
	var wizard = $(id);
	var overlay = $("overlay");
	
	$("content").removeChild(wizard);
	$("html_body").removeChild(overlay);
}