/**
Depends on the mootools-1.2.x-core.js library

This was ported so we may use these features on pages that requires the mootools-1.2 libraries
**/

/**
 * This allows the use of the hashchange event. It's the only way you can use the back button to update the page via ajax
 */
Element.Events.hashchange = {
	onAdd: function(){
		var hash = self.location.hash;

		var hashchange = function(){
			if (hash == self.location.hash) return;
			else hash = self.location.hash;

			var value = (hash.indexOf('#') == 0 ? hash.substr(1) : hash);
			window.fireEvent('hashchange', value);
			document.fireEvent('hashchange', value);
		};

		if ("onhashchange" in window){
			window.onhashchange = hashchange;
		} else {
			hashchange.periodical(50);
		}
	}
};

var Tools = { };

/**
generic tabswitching class
 NOTE that we are using tabproperty "tabtitle"
 instead of title beacuse if we use "title" attribute
 of <LI> tag then the title string will showup
 on mouseover. 
**/
Tools.Tabs = new Class({
	Implements: Options,
	options: {
		tabElements:		'ul.mootabs_title li',
		panelElements:		'.mootabs_panel',
		tabProperty:		'tabtitle',
		mouseOverClass:		'over',
		activeClass:		'active',
		activateOnLoad:		'first',
		ajaxUrl: 			'#',
		ajaxOptions: 		{method:'get'},
		ajaxLoadingText: 	'Loading...',
		ajaxOnComplete:		'',
		ajaxOnFailure:		'',
		onComplete:			'',
		useCaching:			true,
		customLinkTaging:	false,
		customLinkProp:		'customTag'
	},
	initialize: function(tabs, panels, options) {
		this.setOptions(options);

		this.tabcontainer = $(tabs);
		this.tabcontainerclass = tabs;

		this.panelcontainer = $(panels);
		this.panelcontainerid = panels;

		this.tabs = $$('.' + this.tabcontainerclass + ' ' + this.options.tabElements);
		this.panels = $$('#' + this.panelcontainerid + ' ' + this.options.panelElements);

		this.panelCached = { };
		
		if(this.options.preloadedClass){
			this.panels.each(function(item) {
				if(item.hasClass(this.options.preloadedClass)){
					this.panelCached[item.getProperty('id')] = true;
				}
			}, this);
		}

		this.tabs.each(function(item) {
			var itemTitle = item.getProperty(this.options.tabProperty);
			this.panelCached[itemTitle] = false;

			item.addEvent('click', function(){
					item.removeClass(this.options.mouseOverClass);
					item.addClass(this.options.activeClass);
					this.activate(item, true);
				}.bind(this)
			);

			item.addEvent('mouseover', function() {
				if(item != this.activeTitle) {
					item.addClass(this.options.mouseOverClass);
				}
			}.bind(this));

			item.addEvent('mouseout', function() {
				if(item != this.activeTitle) {
					item.removeClass(this.options.mouseOverClass);
				}
			}.bind(this));
		}, this);


		if(this.options.activateOnLoad != 'none') {
			if(this.options.activateOnLoad == 'first') {
				this.activate(this.tabs[0]);
			}
			else {
				this.activate(this.options.activateOnLoad);
			}
		}
	},

	activate: function(tabTitle, tagIt){
		var selectedTabs = this.tabs;
		if($type(tabTitle) == 'element') {
			tabTitle = tabTitle.getProperty(this.options.tabProperty);
		}
		if($type(tabTitle) == 'string') {
			selectedTabs = this.tabs.filter(function(item, index) {
				return item.getProperty(this.options.tabProperty) == tabTitle;
			}, this);
		}

		this.panels.removeClass(this.options.activeClass);
		this.activePanel = this.panels.filter('#'+tabTitle)[0];
		this.activePanel.addClass(this.options.activeClass);

		this.tabs.removeClass(this.options.activeClass);
		selectedTabs.addClass(this.options.activeClass);

		this.activeTitle = tabTitle;

		var ajaxUrl = this.options.ajaxUrl[tabTitle];

		if($defined(ajaxUrl)) {
			var ajaxOptions = { };
			if ($defined(this.options.ajaxOnComplete[tabTitle])) {
				ajaxOptions['onComplete'] = function() {
					this.options.ajaxOnComplete[tabTitle]();
					this.panelCached[tabTitle] = true;
				}.bind(this);
			} else {
				ajaxOptions['onComplete'] = function() {
					this.panelCached[tabTitle] = true;
				}.bind(this);
			}
			if ($defined(this.options.ajaxOnFailure[tabTitle])) {
				ajaxOptions['onFailure'] = function() {
					this.options.ajaxOnFailure[tabTitle]();
					this.panelCached[tabTitle] = false;
				}.bind(this);
			} else {
				ajaxOptions['onFailure'] = function() {
					this.panelCached[tabTitle] = false;
				}.bind(this);
			}
			if (!(this.options.useCaching && this.panelCached[tabTitle])) {
				this.ajaxRequest(ajaxUrl, ajaxOptions);
			} else {
				if ($defined(ajaxOptions['onComplete'])) {
					ajaxOptions['onComplete']();
				}
			}
		} else {
			this.panelCached[tabTitle] = true;
			if ($defined(this.options.onComplete[tabTitle])) {
				this.options.onComplete[tabTitle]();
			}
		}
		if(tagIt && this.options.customLinkTaging){
			if(typeof OmnitureCustomLink=='function'){
				OmnitureCustomLink(this.activePanel.getProperty(this.options.customLinkProp));
			}
		}
	},

	ajaxRequest: function(ajaxUrl, ajaxOptions){
		this.activePanel.setHTML(this.options.ajaxLoadingText);
		var newOptions = Object.extend({update: this.activePanel.getProperty('id')}, ajaxOptions || {});
		var options = Object.extend(this.options.ajaxOptions, newOptions || {});
		var tabRequest = new Ajax(this.getUrlWithParameters(ajaxUrl), options);
		tabRequest.request();
	},

	getUrlWithParameters : function (baseUrl, parameters) {
		var newUrl = baseUrl;
		var queryStr = window.top.location.search.substring(1);
		if (!newUrl.contains("?")) {
			newUrl += "?";
		} else {
			newUrl += "&";
		}
		return newUrl + queryStr;
	}
});


Tools.Pagination = new Class({
	Implements: Options,
	itemsPerPage:2,
	page:1,
	lastPage:1,
	totalItems:10,
	sliders:{},
	options: {
		pageBaseId:					'page',
		activeButtonClass:			'active',
		inactiveButtonClass:		'inactive',
		buttonPrevSelector:			'',
		buttonNextSelector:			'',
		pageNavButtonNextSelector:	'',
		pageNavButtonLastSelector:	'',
		firstVisibleItemSelector:	'',
		lastVisibleItemSelector:	''
	},
	initialize: function(itemsPerPage, totalItems, options) {
		this.setOptions(options);
		this.itemsPerPage = itemsPerPage-0;//minus zero forces it to be an int
		this.totalItems = totalItems-0;
		this.page = this.getHashedPage();		
		//minus zero forces it to be an int
		
		var pageNum = 1;
		while($(this.options.pageBaseId+pageNum)!=null){
			this.init_slider(pageNum);
			lastPage = pageNum;
			pageNum = pageNum+1;
		}
		this.updateButtonClasses();
		$$(this.options.buttonFirstSelector).each(function(item){
			item.addEvent('click', function(e){ this.goToPage(1); }.bind(this));
			item.addEvent('selectstart', function(e){return false;});
		},this);
		$$(this.options.buttonPrevSelector).each(function(item){
			item.addEvent('click', function(e){ this.goToPage(this.page-1); }.bind(this));
			item.addEvent('selectstart', function(e){return false;});
		},this);
		$$(this.options.buttonNextSelector).each(function(item){
			item.addEvent('click', function(e){ this.goToPage(this.page+1); }.bind(this));
			item.addEvent('selectstart', function(e){ return false; });
		},this);
		$$(this.options.buttonLastSelector).each(function(item){
			item.addEvent('click', function(e){ this.goToPage(lastPage); }.bind(this));
			item.addEvent('selectstart', function(e){return false;});
		},this);
		this.goToPage(this.page);
		window.addEvent('hashchange', function(){
			var hashedPage = this.getHashedPage();
			if(hashedPage!=this.page){
				this.goToPage(hashedPage);
			}
		}.bind(this) );
	},
	init_slider: function(pageNum){
		if(this.page == pageNum){
			this.showPage(pageNum);
		} else {
			this.hidePage(pageNum);
		}
		if(this.lastPage<pageNum){
			this.lastPage=pageNum;
		}
	},
	showPage: function(pageNum){
		$(this.options.pageBaseId+pageNum).setStyle('display','block');
	},
	hidePage: function(pageNum){
		$(this.options.pageBaseId+pageNum).setStyle('display','none');
	},
	getHashedPage: function(){
		var hash = document.location.hash.substring(1);
		if(hash==null || hash.length==0 || isNaN(hash) || $(this.options.pageBaseId+hash)==null){
			return 1;
		}
		return hash-0;
	},
	goToPage: function(page){
		if($(this.options.pageBaseId+page)!=null){
			this.hidePage(this.page);
			this.showPage(page);
			this.page = page;
		}
		this.updateButtonClasses();
		ajaxUrl = $(this.options.pageBaseId+page);
		if(ajaxUrl){
			ajaxUrl = ajaxUrl.get('url');
		}
		if(ajaxUrl){
			$(this.options.pageBaseId+page).set('url',null);
			var req = new Request.HTML({url:ajaxUrl, 
				onSuccess: function(html) {
					$(this.options.pageBaseId+page).innerHTML = '';
					$(this.options.pageBaseId+page).adopt(html);
					if(this.options.onAjaxLoad){
						this.options.onAjaxLoad(this.options.pageBaseId+page);
					}
				}.bind(this),
				onFailure: function() {
					if(this.options.onAjaxFail){
						this.options.onAjaxFail(this.options.pageBaseId+page);
					}
				}.bind(this)
			}); 
			req.send();
		}
	},
	updateButtonClasses: function(){
		//update the status
		$$(this.options.firstVisibleItemSelector).each(function(item){
			var firstItem = (this.page-1)*this.itemsPerPage+1;
			if(firstItem>this.totalItems){
				firstItem = this.totalItems;
			}
			item.innerHTML = firstItem;
		},this);
		$$(this.options.lastVisibleItemSelector).each(function(item){
			var lastItem = this.page*this.itemsPerPage;
			if(lastItem>this.totalItems){
				lastItem = this.totalItems;
			}
			item.innerHTML = lastItem;
		},this);
		
		//update the button classes
		$$(this.options.buttonPrevSelector+","+this.options.buttonFirstSelector).each(function(item){
			if(this.page==1){
				item.removeClass(this.options.activeButtonClass);
				item.addClass(this.options.inactiveButtonClass);
			} else {
				item.removeClass(this.options.inactiveButtonClass);
				item.addClass(this.options.activeButtonClass);
			}
		},this);
		$$(this.options.buttonNextSelector+","+this.options.buttonLastSelector).each(function(item){
			if(this.page==this.lastPage){
				item.removeClass(this.options.activeButtonClass);
				item.addClass(this.options.inactiveButtonClass);
			} else {
				item.removeClass(this.options.inactiveButtonClass);
				item.addClass(this.options.activeButtonClass);
			}
		},this);
		
		if(document.location.hash.length!=0 || this.page!=1){
			document.location.hash = "#"+this.page;
		}
	}
});