var portal;
	 var widgets = new Array(); 
	 
	 function toggleDiv(divid){
        if(document.getElementById(divid).style.display == 'none'){
			document.getElementById(divid).style.display = 'block';
        } else {
			document.getElementById(divid).style.display = 'none';
        }
      }
	  function updateWidgetHeight(id) {
	  	widgets[id].updateHeight();
	  }

	function onOverWidget(portal, widget) {
	widget.getElement().insertBefore($('control_buttons'), widget.getElement().firstChild);
		$('control_buttons').show(); 
	} 
	
	function onOutWidget(portal, widget) {
		$('control_buttons').hide();      
	}
	
	function onChange() {
	
	}	 
   
     function removeWidget(element) {
       var widget = $(element).up(".widget").widget;
       if (confirm('Are you sure you want to remove this widget?')) { 
         document.body.appendChild($('control_buttons').hide())
         portal.remove(widget);
		 widgets.splice(widget.getID(),1);
       }
     }
	 
	 function serial() {
	 
	 	alert(portal.serialize_page());
	 
	 } 
	 
     function editWidget(element) {
		var controls = $(element).up(".widget").down(".config");
		var widget = $(element).up(".widget");
		var widgetID = widget.identify().replace("widget_","");
		controls.toggle();
		updateWidgetHeight(widgetID);   
     }
	 
	 function refreshWidget(element) {
		var iframe = $(element).up(".widget").down("iframe");
		iframe.src = iframe.src;
     }
	 
     function updateWidget(id) {
	 
	 	var form = $('widget_attr_' + id);

		var inputs = form.getInputs("text");
		var config_query = "";
	 	inputs.each(function(item) {
				if(item.readAttribute('name') == "title")
					widgets[id].setTitle(item.readAttribute('value'));
				config_query += item.readAttribute('name') + "=" + item.readAttribute('value') + "&";
			});
			
		if(widgets[id].getHeight)
			config_query += "height=" + widgets[id].getHeight() + "&";
			
		config_query += "class=" + widgets[id].getClass() + "&";
		config_query += "ico=" + widgets[id].getICO() + "&";
		config_query += "widgetID=" + id;
		
		var url = $('iframe_' + id).src.split("?");
		
		$('iframe_' + id).src = url[0] + "?" + config_query;
		
		toggleDiv('config_' + id);
		updateWidgetHeight(id);
     }
	 
	 function savePage(pageID) {
		new Ajax.Request( "save_page.php",
			{
				method:'post',
				parameters: {pageID: pageID, page: portal.serialize_page()},
				onSuccess: function(transport) { writeMessage( transport.responseText ) }
			});
	 }
	 
	 function saveNewPage(pageID) {
		document.getElementById('messageContent').innerHTML = "<form name=\"saveNewPage\" action=\"save_page.php\" method=\"POST\"><input type=\"hidden\" name=\"pageID\" value=\"" + pageID + "\"><input type=\"hidden\" name=\"page\" value=\"" + portal.serialize_page() + "\"></form>";
		
		document.saveNewPage.submit();
	 } 
	 
	 function writeMessage(text) {
	 
	 	document.getElementById('messageContent').innerHTML = text;
		document.getElementById('messageMenu').style.display = 'block';
	 }
	 
	 function updateTitle(id, cur) {
		//var reply = prompt("What Would you like to call this tab?", "");
		writeMessage("<h3>Update Page Title:</h3><form method='post'><input type='hidden' name='updateTitle' value='1'><input type='hidden' name='id' value='"+id+"'><input name='changeto' type='text' value='"+cur+"'><input type='submit' value='Change'></form>");
		//$('tab' + id).update("<input type='text' value='"+cur+"'>");
	 }
	 /*
	 function updateTitle2(id) {
		var title = $('changeto').readAttribute('value');
		new Ajax.Request( "js/updatePageID.js",
			{
				method:'post',
				parameters: {id: id, title: title},
				onSuccess: function(transport) { location.href=location.href; }
			});
	 }
	*/
	
	function addWidget(url,config) {
		var attr = config.toQueryParams();
		
		var config_screen = "";
		
		for(var i in attr) {
			if(i != 'height' && i != 'class' && i != 'ico' && i != 'widget_url') {
				config_screen += "<tr><td>" + i + "<input type='text' name='" + i + "' value='" + attr[i] + "'></td></tr>";
			}
		}
		
		
		var widget = new Xilinus.Widget().setICO(attr['ico']).setClass(attr['class']).setID(widgets.length).setTitle(attr['title']).setContent("<a name='widgeta_" +(widgets.length) + "'></a><div id='config_" + (widgets.length) + "' class='config' style='display:none'><form id='widget_attr_" + (widgets.length) + "'><table>" + config_screen + "<tr><td colspan=2><input type='button' onclick='updateWidget(" +(widgets.length) + ")' value='Update' /></td></tr></table></form></div><iframe id='iframe_" + (widgets.length) + "' src='" + url + "?widgetID=" + (widgets.length) + "&" + config + "' frameborder ='0' scrolling='no'>");
		
		if(attr['height'])
			widget.setHeight(parseInt(attr['height']));
		
		widgets.push(widget);
        portal.add(widget, 0);
			
		location.href="#widgeta_" +(widgets.length);
		
		//portal.startDrag('onStart',widget);
	
	}