function PageLayoutController(rootPanel) {
	
	this.rootPanel = rootPanel;
	
	this.init = function() {
		rootPanel.addClass("panel-layout");
		refresh();
		jQuery(window).bind( "resize",  function(e) {
			refresh();
		});
		window.setInterval(function() {
			refreshIfSizeWasChanged();
		}, 250);
	};
	
	this.refresh = function() {
		refresh();
	};
	
	var previousWidth = -1;
	var previousHeight = -1;
	var wasRefreshaed = false;
	function refreshIfSizeWasChanged() {
		var rootWidth = rootPanel.width();
		var rootHeight = rootPanel.height();
		if( previousWidth != rootWidth || previousHeight != rootHeight ) {
			refresh();
			previousWidth = rootWidth;
			previousHeight = rootHeight;
		}
	}
	
	function refresh() {
		var rootWidth = rootPanel.width();
		var rootHeight = rootPanel.height();
		
		var headerHeight = refreshHeader(rootWidth);
		var northPanelHeight = refreshNorthPanel(rootWidth, headerHeight);
		var southPanelHeight = refreshSouthPanel(rootWidth, rootHeight);
		var westPanelWidth = refreshWestPanel(rootHeight, headerHeight, northPanelHeight, 
				southPanelHeight);
		var eastPanelWidth = refreshEastPanel(rootWidth, rootHeight, headerHeight, 
				northPanelHeight, southPanelHeight);
		refreshContentPanel(rootWidth, rootHeight, westPanelWidth, eastPanelWidth, 
				headerHeight, northPanelHeight, southPanelHeight);
	}

	function refreshHeader(rootWidth) {
		var header = rootPanel.find("div.header-panel");
		var headerHeight = 0;
		if(jQuery(header).size() == 1 ) {
			header.addClass("panel-layout");
			header.css("left", 0);
			header.css("top", 0);
			header.css("width", rootWidth);
			headerHeight = header.height();
		} else if(jQuery(header).size() > 1) {
			throw "Only one header is allowed";
		}
		return headerHeight;
	}
	
	function refreshNorthPanel(rootWidth, headerHeight) {
		var northPanel = rootPanel.find("div.north-panel");
		var northPanelHeight = 0;
		if(jQuery(northPanel).size() == 1 ) {
			northPanel.addClass("panel-layout");
			northPanel.css("left", 0);
			northPanel.css("top", headerHeight);
			northPanel.css("width", rootWidth);
			northPanelHeight = northPanel.height();
		} else if(jQuery(northPanel).size() > 1) {
			throw "Only one north pannel is allowed";
		}
		return northPanelHeight;
	}
	
	function refreshSouthPanel(rootWidth, rootHeight) {
		var southPanel = rootPanel.find("div.south-panel");
		var southPanelHeight = 0;
		if(jQuery(southPanel).size() == 1 ) {
			southPanel.addClass("panel-layout");
			southPanelHeight = southPanel.height();
			southPanel.css("left", 0);
			southPanel.css("top", rootHeight - southPanelHeight);
			southPanel.css("width", rootWidth);
		} else if(jQuery(southPanel).size() > 1) {
			throw "Only one south panel is allowed";
		}
		return southPanelHeight;
	}
	
	function refreshWestPanel(rootHeight, headerHeight, northPanelHeight, southPanelHeight) {
		var westPanel = rootPanel.find("div.west-panel");
		var westPanelWidth = 0;
		if(jQuery(westPanel).size() == 1 ) {
			westPanel.addClass("panel-layout");
			westPanel.css("left", 0);
			westPanel.css("top", headerHeight + northPanelHeight);
			westPanel.css("height", rootHeight - headerHeight - northPanelHeight - southPanelHeight);
			westPanelWidth = westPanel.width();
		} else if(jQuery(westPanel).size() > 1 ) {
			throw "Only one west panel is allowed";
		}
		return westPanelWidth;
	}
	
	function refreshEastPanel(rootWidth, rootHeight, headerHeight, northPanelHeight, southPanelHeight) {
		var eastPanel = rootPanel.find("div.east-panel");
		var eastPanelWidth = 0;
		if(jQuery(eastPanel).size() == 1 ) {
			eastPanel.addClass("panel-layout");
			eastPanelWidth = eastPanel.width();
			eastPanel.css("left", rootWidth - eastPanelWidth);
			eastPanel.css("top", headerHeight + northPanelHeight);
			eastPanel.css("height", rootHeight - headerHeight - northPanelHeight - southPanelHeight);
		} else if(jQuery(eastPanel).size() > 1 ) {
			throw "Only one east panel is allowed";
		}
		return eastPanelWidth;
	}
	
	function refreshContentPanel(rootWidth, rootHeight, westPanelWidth, eastPanelWidth, headerHeight, northPanelHeight, southPanelHeight) {
		var contentPanel = rootPanel.find("div.content-panel");
		if(jQuery(contentPanel).size() == 1 ) {
			contentPanel.addClass("panel-layout");
			contentPanel.css("left", westPanelWidth);
			contentPanel.css("top", headerHeight + northPanelHeight);
			contentPanel.css("width", rootWidth - westPanelWidth - eastPanelWidth);
			contentPanel.css("height", rootHeight - headerHeight - northPanelHeight - southPanelHeight);
		} else if(jQuery(contentPanel).size() > 1 ) {
			throw "Only one content panel is allowed";
		} else {
			throw "There should be at least one content panel";
		}
	}
	
}

var pagesMap = new Object();

jQuery.fn.initPageLayout = function() {
	var controller = new PageLayoutController(jQuery(this));
	pagesMap[jQuery(this).attr("id")] = controller;
	controller.init();
};

jQuery.fn.refresh = function() {
	var controller = pagesMap[jQuery(this).attr("id")];
	controller.refresh();
};

