// TabNavigation
var TabNavigation = function(tabPrefix, pagePrefix, index){
	this.initialize(tabPrefix, pagePrefix, index);
};

TabNavigation.prototype = {
	tabName    : 'tab',
	pageName   : 'page',
	tabPrefix  : '',
	pagePrefix : '',
	tabElements: '',
	nowTab     : '',
	nowPage    : '',
	index: 1,

	initialize:function(tabPrefix, pagePrefix, index){
		index = index || '';
		if(tabPrefix){
			this.tabPrefix  = tabPrefix;
		}
		if(pagePrefix){
			this.pagePrefix = pagePrefix;
		}
		if(index != ''){
			this.index = index;
		}
		this.tabName     = this.tabPrefix + this.tabName;
		this.pageName    = this.pagePrefix + this.pageName;
		this.tabElements = $('#' + this.tabName + 's .' + this.tabName);
		this.setup();
	},

	setup: function(){
		var root = this;
		var tabs = this.tabElements;

		this.changeTab($('#' + this.tabName + this.index));
		tabs.click(function(){
			root.changeTab($(this));
		});
	},

	changeTab: function(obj){
		var pageElements = $('#' + this.pageName + 's .' + this.pageName);
		var nowTabObj = obj;

		this.index = nowTabObj.attr('id').replace(this.tabName, '');
		var nowPageObj = $('#' + this.pageName + this.index);

		this.tabElements.removeClass('this-tab');
		pageElements.removeClass('this-page').hide();

		nowTabObj.addClass('this-tab');
		nowPageObj.addClass('this-page').show();
	}
};