var tabSwitcher = new Class({
	initialize: function(containerId,defaultPane) {
		this.myGrid = $(containerId).getElements('.menuGrid li');
		this.myTabs = $(containerId).getElements('.tabs li a');
		this.ajaxContainer = $(containerId).getElement('#completeBio');
		
		this.myTabs.each(function(tabItem) {
			if (tabItem.hasClass(defaultPane)) {
				tabItem.addClass('on');
				this.showTab(tabItem);
			}
			tabItem.addEvent("click", function(event) {
				this.showTab(tabItem);
				return false;	
			}.bind(this));
		}.bind(this));	
		// for each item in the grid
		this.myGrid.each(function(gridItem) {
			this.gridClick(gridItem);
		}.bind(this));	
	},
	getData: function(profileId) {	
		this.articleData = new Ajax('profilesBio.action?riderProfileId='+profileId, {
			method: 'get',
			evalScripts: true,
			update: this.ajaxContainer,
			onSuccess: function(data) {
				this.ajaxContainer.removeClass('preload');
			}.bind(this),
			onRequest: function(data) {
				this.ajaxContainer.addClass('preload');
			}.bind(this),
			onFailure: function(data) {
				this.ajaxContainer.removeClass('preload');
			}.bind(this)
		});
		this.articleData.request();
	},
	
	showTab: function(tabTarget) {
		// clear tabs of style
		this.myTabs.each(function(tabItem) {
			tabItem.removeClass('on');
		}.bind(this));
		// clear grid items of style
		this.myGrid.each(function(gridItem) {
			//gridItem.removeClass('on');
		}.bind(this));
		// look at all the items in the grid and turn off the respective ones
		this.myGrid.each(function(gridItem) {
			if (!gridItem.hasClass(tabTarget.className)) {
				gridItem.addClass('off');
			} else {
				gridItem.removeClass('off');
			}
		}.bind(this));
		tabTarget.addClass('on');
	},
	showGridItem: function(gridItemTarget) {
		this.myGrid.each(function(gridItem) {
			gridItem.removeClass('on');
		}.bind(this));
		this.myGrid.each(function(gridItem) {
			if (gridItem.hasClass(gridItemTarget.className)) {
				gridItem.addClass('on');
			} else {
				gridItem.removeClass('on');	
			}
		}.bind(this));
		gridItemTarget.addClass('on');
	},
	showClickedGridItem: function(gridItemTarget) {
		this.myGrid.each(function(gridItem) {
			gridItem.removeClass('on');
		}.bind(this));
		
		gridItemTarget.addClass('on');
	},
	gridClick: function(gridItem) {
		var gridLink = gridItem.getElement('a');
		gridLink.addEvent("click", function(event) {
			new Event(event).stop();
			this.showClickedGridItem(gridItem);
			this.getData(gridItem.id);
		}.bind(this));
	}	
});


function setProfile(profileName,headerImg) {
	$('profileName').setHTML(profileName);
	$('header').setStyle('background-image','url('+headerImg+')');
}