var Core = {
	namespace: function() {
		var a=arguments,o=null,i,j,d,rt;
		for(i=0;i<a.length;++i){ d=a[i].split("."); rt=d[0]; eval("if (typeof "+rt+" == \"undefined\"){"+rt+" = {};} o = "+rt+";"); for(j=1; j<d.length; ++j) { o[d[j]]=o[d[j]]||{}; o=o[d[j]] }}
	},
	Class: function(obj) {
		var F = function() {};
		F.prototype = obj;
		return F;
	}
}
Core.namespace("au.com.tramtracker");

au.com.tramtracker.Modal = Core.Class({
	structure: "<div class=\"modalBackground\"></div><table cellspacing=\"0\" cellpadding=\"0\" id=\"[ID]\" class=\"modal\"><tr><td class=\"tl\"></td><td class=\"tm\"><span id=\"ModalTitle\">[title]</span></td><td class=\"tr\"><a rel=\"[ID]\" href=\"javascript:;\" class=\"close\"></a></td></tr><tr><td class=\"l\"></td><td class=\"m\"><div id=\"ModalContent\"></div></td><td class=\"r\"></td></tr><tr><td class=\"bl\"></td><td class=\"bm\" id=\"ModalTabBar\"></td><td class=\"br\"></td></tr></table>",
	setTitle: function(title) {
		this.structure = this.structure.replace("[title]",title);
	},
	init: function(obj) {
		var src = this;
		var id = obj.id?obj.id:"tt_modal";
		this.props = obj;
		this.id = id;
		this.props.animation = obj.animation||null;
		this.structure = this.structure.replace(/\[ID\]/g, id);
		if (obj.title) this.setTitle(obj.title);
		$("body").append(this.structure);
		var background = $(".modalBackground");
		background.css({ opacity: 0.5, filter: 'alpha(opacity=50)', width: $(window).width(), height: $(document).height() });
		var that = this.element = $("#"+id);
		if (obj.width && obj.height) that.find("#ModalContent").css({width: obj.width, height: obj.height});
		that.find(".close").click(function() {
			src.closeClickHandler(src);
		});
		background.click(function() {
			src.closeClickHandler(src);
		});
		that.css({top: ($(window).height()/2-that.height()/2), left: ($(window).width()/2-that.width()/2)});
		if (navigator.userAgent.toLowerCase().indexOf("msie") != -1) that.show();
		else that.fadeIn("normal");
		/* ie6 fix */
		if (navigator.userAgent.toLowerCase().indexOf("msie 6.") != -1) {
			background.append("<iframe></iframe>");
			background.find("iframe").css({width: $(window).width(), height: $(document).height(), zIndex: -1, filter: 'alpha(opacity=10)'});
		}
	},
	closeClickHandler: function() {
		var modal = this.element;
		if (this.props.animation) {
			modal.fadeOut("fast", function() {
				modal.remove();
				$(".modalBackground").remove();
			});
		} else {
			modal.remove();
			$(".modalBackground").remove();
		}
	},
	addButton: function(type, callback) {
		var tabbar = this.element.find("#ModalTabBar");
		var typeTemplate = "<a href=\"javascript:;\" class=\"[TYPE]\">"+type+"</a>";
		var typeClass = "";
		switch (type) {
			case "Previous":
				typeClass = "tabbarPrevious";
				break;
			case "Next":
				typeClass = "tabbarNext";
				break;
		}
		typeTemplate = typeTemplate.replace(/\[TYPE\]/g, typeClass);
		tabbar.append(typeTemplate);
		if (callback) {
			var src = this;
			tabbar.find("."+typeClass).click(function() {
				callback.call(src);
			});
		}
	},
	load: function(obj) {
		var src = this;
		var oldSuccess = obj.success||null;
		obj.success = function(html) {
			
			src.success(src, html);
			if (oldSuccess) oldSuccess(src);
		}
		$.ajax(obj);
	},
	success: function(sender, html) {
		this.element.find(".m").css({background: "#fff"});
		var contentPanel = this.element.find("#ModalContent");
		contentPanel.html(html);
		this.attachBindings(contentPanel);
		this.configurePages();
	},
	attachBindings: function(html) {
		var src = this;
		html.find("a[rel^='modal-goto-']").click(function() {
			var page = this.rel.split("-")[2];
			src.gotoPage(page);
		});
	},
	configurePages: function() {
		var parent = this.element.find(".pageContainer");
		this.props.allPages = parent.find(".page");
		this.props.numPages = this.props.allPages.length;
		this.props.innerWidth = this.props.width.replace("px","") * this.props.numPages;
		this.props.innerWidthpx = this.props.innerWidth+"px";
		this.props.currentPage = 1;
		parent.css({width: this.props.innerWidthpx, height: this.props.height});
		this.props.allPages.css({float: 'left', width: this.props.width, height: this.props.height});
		this.animatePage();
		var tabbar = this.element.find("#ModalTabBar");
		if (this.props.numPages <= 2) tabbar.html('');
		else {
			tabbar.append("<span id=\"ModalPagination\"></span>");
		}
	},
	nextButtonClickHandler: function() {
		if (!this.props.animationInProgress) {
			this.props.currentPage++;
			if (this.props.currentPage>=this.props.numPages) this.props.currentPage = 1;
			this.animatePage();
		}
	},
	prevButtonClickHandler: function() {
		if (!this.props.animationInProgress) {
			this.props.currentPage--;
			if (this.props.currentPage<=0) this.props.currentPage = this.props.numPages-1;
			this.animatePage();
		}
	},
	gotoPage: function(page) {
		this.props.currentPage = page<=0||page>=this.props.numPages?1:page;
		this.animatePage();
	},
	animatePage: function(init) {
		this.props.animationInProgress = true;
		var posTo = this.props.currentPage * this.props.width.replace("px","") * -1;
		var src = this;
		this.element.find(".pageContainer").animate({
			marginLeft: posTo+'px'
		}, (src.props.animation?'normal':0), null, function() { src.animateEnd(src); });
	},
	animateEnd: function() {
		this.props.animationInProgress = false;
		this.element.find("#ModalPagination").html("Page "+this.props.currentPage+" of "+(this.props.numPages - 1));
	}
});