var pagingSwitcher = new Class({
	initialize: function(containerId,defaultPane) {
		this.myPages = $(containerId).getElements('.paging');
		this.myPages.each(function(pagingItem) {
			if (pagingItem.hasClass(defaultPane)) {
				pagingItem.addClass('on');
			}
			pagingItem.addEvent("click", function(event) {
				this.showPage(pagingItem);
				return false;	
			}.bind(this));
		}.bind(this));	
	},
	showPage: function(pagingTarget) {
		this.myPages.each(function(tabItem) {
			tabItem.removeClass('on');
		}.bind(this));
		

		//tabTarget.addClass('on');
	}
});

// filters news pane on right side against game scope (all, OGSkate, Skate2 or skateIT)
var paneFilter = new Class({
	initialize: function(containerId) {
		this.myPane = $(containerId).getElement('.pane');
		this.myFilters = $(containerId).getElements('.scopeFilter');
		this.myFilters.each(function(filterItem) {
			filterItem.addEvent("change", function(event) {
				var filter = filterItem.value;
				var scope = filterItem.name;
				var temp = new Array();
				scope = scope.split('-')[0]; //extract feed name from select name
				
				this.newsItems = this.myPane.getElements('.item');
				this.newsItems.each(function(newsItem) {
					if (filter == "all") {
						newsItem.setStyle('display','block')
					} else {
						if (newsItem.hasClass(filter)) {
							newsItem.setStyle('display','block')		
						} else {
							newsItem.setStyle('display','none')
						}	
					}
				});							
			}.bind(this));
		}.bind(this));	
	}
});

var contentLoader = new Class({
	initialize: function(listId,targetId,itemTree,conduit) {
		this.feedConduit = conduit;
		this.myList = $(listId);
		this.myTarget = $(targetId);
		this.myItems = this.myList.getElements(itemTree);
		this.myItems.each(function(item) {
			item.addEvent("click", function(event) {
				var param = item.href.split('?')[1];
				this.loadContent(param);
				event = new Event(event).stop();
			}.bind(this));
		}.bind(this));
	},
	loadContent: function(param) {	
		var myAjax = new Ajax(this.feedConduit+'?'+ param, {
			method: 'get',
			evalScripts: true,
			update: this.myTarget,
			onRequest: function(data) {
				this.myTarget.setHTML('<p class="error">Loading...</p>');
			}.bind(this),
			onFailure: function(data) {
				this.myTarget.setHTML('<p class="error">Could not load asset.</p>');
			}.bind(this)
		}).request();
	}
});

var scopeSwicther = new Class({
	initialize: function(listId,targetId,swictherId,conduit) {
		this.feedConduit = conduit;
		this.myList = $(listId);
		this.myTarget = $(targetId);
		this.mySwicther = $(swictherId);
		this.mySwicther.addEvent("change", function(event) {
			var filter = "";
			if (this.mySwicther.value != "all") filter = "titleRelevance=" + this.mySwicther.value; 
			this.loadContent(filter);
			event = new Event(event).stop();
		}.bind(this));
	},
	loadContent: function(param) {	
		var myAjax = new Ajax(this.feedConduit+'?'+ param, {
			method: 'get',
			evalScripts: true,
			update: this.myTarget,
			onRequest: function(data) {
				this.myTarget.setHTML('<p class="error">Loading...</p>');
			}.bind(this),
			onFailure: function(data) {
				this.myTarget.setHTML('<p class="error">Could not load asset.</p>');
			}.bind(this)
		}).request();
	}
});

window.addEvent('domready', function() {
	 var myPagingSwitcher = new pagingSwitcher('contentBlock','first');
	 var myTooltipEngine = new tooltipEngine('content', '.scope a');
	 var myTooltipEngine = new tooltipEngine('articleList', 'div.scope a');
	 var myPaneFilter = new paneFilter('articleTarget');
});