
Ext.namespace("Scalr", "Scalr.mobi");	
	
(function () {

	var listeners = []; 
	
	Scalr.on = function (el, eventName, fn, scope, options) {
		if (Ext.isPPC2002) {
			var id = Ext.id(Ext.get(el));
			return listeners.push([id, eventName, scope ? fn.createDelegate(scope) : fn]);
		} else {
			return Ext.get(el).on(eventName, fn, scope, options);
		} 
	};
		
	Scalr.fire = function (el, eventName) {
		if (el.id) {
			for (var i=0, ln; ln=listeners[i]; i++) {
				if (ln[0] == el.id && ln[1] == eventName) {
					ln[2](); // Call listener
				}
			}
		}
	};
	
})();



/**
 * @config {String/HTMLElement/Ext.Element} el 
 * @config {Function} dataLoader
 */
Scalr.mobi.DisclosureDown = function (config) {
	Ext.apply(this, config);

	this.el = Ext.get(this.el);
	this.discTriggerEl = this.el.child(".disclosure-down");
	
	var linkEl = this.discTriggerEl.child("a");
	this.url = linkEl.dom.href;
	linkEl.dom.href = "javascript://";
	Scalr.on(linkEl, "click", this.toggle, this);
	
	this.addEvents("expand", "collapse");
	this.on("expand", this.loadData, this);
}
Ext.extend(Scalr.mobi.DisclosureDown, Ext.util.Observable, {
	toggle: function () {
		this.isExpanded() ? this.collapse() : this.expand(); 
	},
	
	isExpanded: function () {
		return this.discTriggerEl.hasClass("disclosure-down-expanded");
	},
	
	expand: function () {
		this.fireEvent("beforeexpand", this);
		
		this.place = this.el.prev(".li") ? (this.el.next(".li") ? "middle" : "last") : (this.el.next() ? "first" : "alone");

		var ccEl = this.el.parent(".rc-cc");

		// Shim inactive zone
		if (this.place == "first" || this.place == "middle") {
			ccEl.insertHtml("afterEnd", 
					'<div class="rc-bd-bl"><div class="rc-bd-br"><div class="rc-bc"></div></div></div>' +					
					'<div class="inactive">'+
						'<div class="rc-cc rc-cc-below"></div>'+
						'<div class="rc-bl"><div class="rc-br"><div class="rc-bc"></div></div></div>'+					
					'</div>');
			ccEl.next(".rc-bl").remove();				
		}
		if (this.place == "last" || this.place == "middle") {
			ccEl.insertHtml("beforeBegin", 
					'<div class="inactive">' +
						'<div class="rc-tl"><div class="rc-tr"><div class="rc-tc"></div></div></div>' +
						'<div class="rc-cc rc-cc-above"></div>' +
					'</div>' +
					'<div class="rc-bd-tl"><div class="rc-bd-tr"><div class="rc-tc"></div></div></div>');
			ccEl.prev(".rc-tl").remove();				
		}

		// Replace inactive elements
		if (this.place == "first" || this.place == "middle") {			
			var ccBelowEl = ccEl.next(".inactive").child(".rc-cc");
			for (var tmpEl; tmpEl = this.el.next(); ) {
				ccBelowEl.appendChild(tmpEl);
			}
		}
		if (this.place == "last" || this.place == "middle") {
			var ccAboveEl = ccEl.prev(".inactive").child(".rc-cc");
			for (var tmpEl; tmpEl = this.el.prev(); ) {
				ccAboveEl.insertFirst(tmpEl);
			}
		}

		// Expand details
		this.detailsEl = this.el
			.insertHtml("afterEnd", '<div class="details"></div>', true)
			.setVisibilityMode(Ext.Element.DISPLAY);
		var discEl = this.el
			.child(".disclosure-down")
			.addClass("disclosure-down-expanded");
		this.detailsEl.appendChild(discEl);

		this.fireEvent("expand", this);					
	},
	
	collapse: function () {
		this.fireEvent("beforecollapse", this);
		
		var ccEl = this.el.parent(".rc-cc");

		// Replace elements back		
		if (this.place == "first" || this.place == "middle") {
			var rcCcBelowEl = ccEl.next(".inactive").child(".rc-cc");
			for (var tmpEl; tmpEl = rcCcBelowEl.last(); ) {
				tmpEl.insertAfter(this.el);
			}
		}
		if (this.place == "last" || this.place == "middle") {
			var rcCcAboveEl = ccEl.prev(".inactive").child(".rc-cc");
			for (var tmpEl; tmpEl = rcCcAboveEl.first(); ) {
				tmpEl.insertBefore(this.el);
			}
		}
		
		// Remove shim, restore round corners
		if (this.place == "first" || this.place == "middle") {		
			ccEl.next(".inactive").remove();
			ccEl.next(".rc-bd-bl").remove();
			ccEl.insertHtml("afterEnd", '<div class="rc-bl"><div class="rc-br"><div class="rc-bc"></div></div></div>');
		}
		if (this.place == "last" || this.place == "middle") {
			ccEl.prev(".inactive").remove();
			ccEl.prev(".rc-bd-tl").remove();
			ccEl.insertHtml("beforeBegin", '<div class="rc-tl"><div class="rc-tr"><div class="rc-tc"></div></div></div>');
		}

		// Collapse details
		var discEl = this.detailsEl
			.child(".disclosure-down")
			.removeClass("disclosure-down-expanded");
		this.el.appendChild(discEl);
		this.detailsEl.remove();
		
		this.fireEvent("collapse", this);
	},
	
	loadData: function () {
		if (!this.loaded) {
			var loadingEl = this.detailsEl.insertHtml("afterBegin", 
					'<div class="loading align-center"><img src="../images/s.gif"><span>Loading</span></div>', true);
			// Load details
			Ext.Ajax.request({
				url: this.url,
				method: "GET",
				success: function (xhr, options) {
					this.loaded = true;	
					loadingEl.remove();
					this.detailsHtml = xhr.responseText;
					this.showDetails(this.detailsHtml);
				}.createDelegate(this)
			});
		} else {
			// Show from cache
			this.showDetails(this.detailsHtml);
		}
	},
	
	showDetails: function (detailsHtml) {
		this.detailsEl.insertHtml("afterBegin", detailsHtml);
		this.detailsEl.show();
		this.detailsEl.select(".with-disclosure-right").each(function (discFly) {
			new Scalr.mobi.DisclosureRight({el: Ext.get(discFly.dom)});
		});
	}
});

Scalr.mobi.DisclosureDownGroup = (function () {
	var groups = {};
	
	function collapse (disc) {
		for (var i=0; d = groups[disc.group][i]; i++) {
			if (d.isExpanded()) {
				d.collapse();
			}
		}
	}
	
	return {
		add: function (group, disclose) {
			if (!groups[group]) {
				groups[group] = [disclose];
			} else {
				groups[group].push(disclose);
			}
			disclose.group = group;
			disclose.on("beforeexpand", collapse);
		}
	}
})();

Scalr.mobi.DisclosureRight = (function () {
	var urls = {}; 
	
	function handler (el) {
		el.parent().select(".with-disclosure-right").removeClass("selected");
		el.addClass("selected");
		(function () { location.href = urls[el.id]; }).defer(50);
	}
	
	return function (config) {
		var el = Ext.get(config.el);
		var fn = handler.createDelegate(this, [el]);
		
		var tickEl = el.child(".disclosure-right a");
		urls[Ext.id(el)] = tickEl.dom.href;
		tickEl.dom.href = "javascript://";
		
		el.on("click", fn);
		tickEl.on("click", fn);
	}
})();


Scalr.mobi.PagingList = (function () {
	var el;
	
	function setupPaging (pagingEl) {
		if (!pagingEl) { 
			return;
		}
		var linkEl = pagingEl.child("a");
		var url = linkEl.dom.href;
		linkEl.dom.href = "javascript://";
		linkEl.on("click", function () {
			pagingEl.child("img").show();
			el.load({url: url});
		});
	}
	
	return function (config) {
		el = Ext.get(config.el);
		setupPaging(el.child(".paging-next"));
		setupPaging(el.child(".paging-prev"));
	}
})();


Scalr.mobi.onReady = (function () {
	var pageName = location.pathname.substring(1);
	pageName = pageName.substring(0, pageName.length-4);
	
	function ppc2002Ready () {
		var viewWidth = document.body.childNodes[0].offsetWidth;
		
		/*
		// TODO: Maybe in future
		Ext.select(".tableview .tableview-row").each(function (rowFly) {
			try {
				var rowEl = Ext.get(rowFly.dom);
				var contentWidth = viewWidth;
				rowEl.select(".tableview-cell").each(function (cellFly) {
					try {
						if (!cellFly.hasClass("tableview-cell-content")) {
							contentWidth -= cellFly.getWidth();
						}
					} catch (e) {
						alert("Caught2: " + e.message);
					}
				});
				alert("contentWidth: " + contentWidth);
				rowEl.child(".tableview-cell-content").setWidth(contentWidth);
			}
			catch (e) {
				alert("Caught3: " + e.message);
			}
		});
		*/
	}
	
	return function () {
		/*
		if (Ext.isPPC2002) {
			try {
				ppc2002Ready();
			} catch (e) {
				alert("Caught: " + e.message);
			}
		}
		*/
		
		// Disclosure right
		Ext.select(".with-disclosure-right").each(function (discFly) {
			new Scalr.mobi.DisclosureRight({el: Ext.get(discFly.dom)});
		});
		
		// Disclosure down
		Ext.select(".rc-cc").each(function (ccFly) {
			var ccEl = Ext.get(ccFly.dom);
			if (ccEl.child(".disclosure-down")) {
				var group = "disc-"+Ext.id(ccEl);
				Ext.select(".with-disclosure").each(function (fly) {
					var disc = new Scalr.mobi.DisclosureDown({el: Ext.get(fly.dom)}); 
					Scalr.mobi.DisclosureDownGroup.add(group, disc);
				});
			}
		});
		
		// Paging list
		//Ext.select(".paging-list").each(function (plEl) {
		//	new Scalr.mobi.PagingList({el: plEl.dom});
		//});
	}
})();


Ext.onReady(Scalr.mobi.onReady);
