﻿/*------------------------------------------------------------------------------------
 * CookieTab JavaScript (jQuery version)
 *
 * Creative Commons License - Attribution
 * http://www.skyld.net
 *
 * ver0.1 2010.03.06
 * ver0.0 2009.08.29
 *------------------------------------------------------------------------------------
 
 [使用方法]
 
	(1)HTMLコードの例 (各ID変更の際は下記変数も変更すること)
	
		<ul id="tabhead">
			<li id="head-tab0" class="on"><a id="anchor-tab0" href="#">foo_a</a></li>
			<li id="head-tab1"><a id="anchor-tab1" href="#">foo_b</a></li>
			<li id="head-tab2"><a id="anchor-tab2" href="#">foo_c</a></li>
		</ul>
		<div id="tabbody">
			<div id="body-tab0" class="current">
				<h2>foo_a</h2>
				<ul>
					<li></li>
				</ul>
			</div>
			<div id="body-tab1">
				<h2>foo_b</h2>
				<ul>
					<li></li>
				</ul>
			</div>
			<div id="body-tab2">
				<h2>foo_c</h2>
				<ul>
					<li></li>
				</ul>
			</div>
		</div>

	(2)cookieは、select=tab0の形で書き込み
	(3)アクティブなタブにはclass="on",class="current"が適用される
	
------------------------------------------------------------------------------------*/

/*------------------------------------------------------------------------------------

変数設定(CookieTabモジュールを使用)

------------------------------------------------------------------------------------*/
var CookieTab = {
	cookieName: 'jselect', //cookieに書き込むプロパティ名
	cookieExpires: 0, //cookieの有効期限（単位：日）
	tabHeadId: 'tabhead', //タブheadのID名
	tabBodyId: 'tabbody', //タブbodyのID名
	tabHdPrefix: 'head-', //タブheadリストのID接頭語
	tabBdPrefix: 'body-', //タブbodyリストのID接頭語
	tabAnPrefix: 'anchor-' //タブheadアンカーのID接頭語
};


/*------------------------------------------------------------------------------------

タブ＋クッキーのメイン処理

------------------------------------------------------------------------------------*/

//DOM読込完了後、tab制御開始
$(document).ready(function(){
	CookieTab.setting();
});

//tabの初期制御
CookieTab.setting = function() {	
	this.tabValue = $.cookie(this.cookieName);
	if(!this.tabValue || this.tabValue==undefined){
		this.tabValue = 'tab0';
	}
	this.tabControl();
}

//tabの初期設定
CookieTab.tabControl = function() {
	this.tabDisplay();
	$('#' + this.tabHeadId + ' li a').each(function(value){
		$(this).click(function(){//tabクリック時の動作設定
			value+='';//数値型→文字列型変換
			//Cookieを発行するドメイン名を明示的に指定。（CookieをIEからFirefoxへインポートする際、ドメイン名の解釈の違いでcookieが複数生成されるバグ対策）
			$.cookie(CookieTab.cookieName, 'tab' + value, { expires: (CookieTab.cookieExpires), domain: (location.hostname) });  
			CookieTab.tabValue = $.cookie(CookieTab.cookieName);
			CookieTab.tabDisplay();
			return false;
		});
	});
}

//tabの表示制御
CookieTab.tabDisplay = function() {
	$('#' + this.tabHeadId + ' li').each(function(){
		$(this).removeClass('on');
	});
	$('#' + this.tabBodyId + ' div').each(function(){
		$(this).removeClass('current');
	});
	$('#' + this.tabHdPrefix + CookieTab.tabValue).addClass('on');
	$('#' + this.tabBdPrefix + CookieTab.tabValue).addClass('current');
}

