/* - portletmanager.js - */

/* - portletmanager.js - */

if (typeof DdUX == "undefined"){var DdUX = {};}

document.observe("dom:loaded", function(){
	PortletManager.initialize();
	DdUX.Layout.initialize();
});

Object.extend(window,{
	getWidth: function(){
		return (self.innerWidth || document.documentElement.clientWidth || document.body.clientWidth || 0);
	},
	
	getHeight: function(){
		return (self.innerHeight || document.documentElement.clientHeight || document.body.clientHeight || 0);
	}
});

DdUX.Layout = {
	modes : [
		[1016,"large"],
		[614,"medium"],
		[0,"small"]
	],
	activeMode : null,
	initialize : function(){
		this.body = $(document.body);
		Event.observe(window,"resize",this.setLayoutMode.bind(this));
		this.setLayoutMode();
	},
	
	setLayoutMode : function(){
		var windowWidth = window.getWidth();
		if (this.activeMode){
			this.body.removeClassName(this.activeMode);
		}
		this.activeMode = this.modes.find(function(mode,i){
			return (windowWidth>mode[0]);
		})[1];
		this.body.addClassName(this.activeMode);
		//console.log(this.activeMode);
	}	
}


Portlet = Class.create();
Portlet.prototype = {
	initialize : function(element){
		this.element = $(element);
		if(!this.element.hasClassName("closed")) this.element.addClassName("open");
		this.header = this.element.down("dt");
		this.contentItems = $A(this.element.getElementsByTagName("DD"));
		this.header.addClassName("handle");
		
		if(this.element.hasClassName("closed")){
			this.contentItems.each(function(item){
				item.hide();
			});
		}
		this._addButton("toggle",this.toggle.bindAsEventListener(this));
	},
	
	_addButton : function(btnName,fn){
		var btn = $(document.createElement("SPAN"));
		btn.addClassName(btnName);
		this.header.insertBefore(btn,this.header.firstChild);
		if (fn) btn.observe("click",fn);
	},
	
	toggle : function(evt){
		if (this.element.hasClassName("closed")){
			this.contentItems.each(function(item,i){
				if (Effect){
					Effect.Appear(item,{duration:0.5});
				} else {
					item.show();
				}
			});
			this.element.removeClassName("closed");
			this.element.addClassName("open");
		} else {
			this.contentItems.reverse().each(function(item,i){
				if (Effect){
					Effect.Fade(item,{duration:0.5});
				} else {
					item.hide();
				}
			});
			this.element.removeClassName("open");
			this.element.addClassName("closed");
		}
		if (evt){
			Event.element(evt).blur();
			Event.stop(evt);
		}
	}
}

PortletManager = {
	initialize : function(){
		this.container = $('portlet-columns');
		this.portlets = this.container.select(".portlet");
		this.setPortletCollapsedState();
		
		// initialize portlets
		this.portlets.each(function(portlet){
			new Portlet(portlet);
		});
		
		// save collapsed state on unload
		Event.observe(window,"unload",this.processCollapseChange.bind(this));
	},
	
	processCollapseChange : function() {
		var cookie = readCookie('dduxPortletCollapsedInfo') || "";
		var portletData = $H(cookie.toQueryParams());
		this.portlets.each(function(portlet){
			portletData[portlet.id] = portlet.hasClassName('closed') ? "closed" : "open";
		});
		createCookie('dduxPortletCollapsedInfo', portletData.toQueryString(), 999);
	},
	
	setPortletCollapsedState : function() {
		var cookie = readCookie('dduxPortletCollapsedInfo');
		if (!cookie || cookie=='') {
			return
		}
		var portletData = $H(cookie.toQueryParams());
		this.portlets.each(function(portlet){
			var state = portletData[portlet.id] || "open";
			portlet.addClassName(state);
		});
	}
}