// ============================================================
// ＠＠
// タブの切替え：ソリューション（タブは画像）
// サイトトップ
// 
// %update / 2011.12.22
// 
// %use / indispensableFunc.js
// %use / jquery
// %use / jquery.easing
// %use / main
// ============================================================

// 名前の衝突をふせぐために名前空間を用意する
var CHG_TAB_SW_IMG_SOL;
if( ( CHG_TAB_SW_IMG_SOL && ( (typeof CHG_TAB_SW_IMG_SOL !== 'object') || !('isNamespace' in CHG_TAB_SW_IMG_SOL) ) ) || (CHG_TAB_SW_IMG_SOL === false) || (CHG_TAB_SW_IMG_SOL === 0) ) {
	throw new Error('"CHG_TAB_SW_IMG_SOL" already exists! You cannot define "CHG_TAB_SW_IMG_SOL".');
} else if( CHG_TAB_SW_IMG_SOL && ('isNamespace' in CHG_TAB_SW_IMG_SOL) ) {
	throw new Error('Namespace "CHG_TAB_SW_IMG_SOL" already exists!');
}
CHG_TAB_SW_IMG_SOL = {};  // 名前空間用のオブジェ生成
CHG_TAB_SW_IMG_SOL.toString = function() { return '[object CHG_TAB_SW_IMG_SOL(is Namespace)]'; };
CHG_TAB_SW_IMG_SOL.isNamespace = true;


// ------------------
// 【定数・変数】
// ------------------
CHG_TAB_SW_IMG_SOL.suffixCr = '_cr';  // カレント画像の接尾辞（※『_』を含む）
CHG_TAB_SW_IMG_SOL.suffixOver = '_on';  // ロールオーバー画像の接尾辞（※『_』を含む）
CHG_TAB_SW_IMG_SOL.suffixOff = '_off';  // OFF画像の接尾辞（※『_』を含む）

CHG_TAB_SW_IMG_SOL.clsHide = 'hide';  // 非表示class名
CHG_TAB_SW_IMG_SOL.clsCr = 'current';  // カレントclass名
CHG_TAB_SW_IMG_SOL.clsClone = 'clone';  // クローンclass名
CHG_TAB_SW_IMG_SOL.clsOver = 'over';  // ロールオーバーclass名
CHG_TAB_SW_IMG_SOL.clsOff = 'off';  // OFF画像class名

CHG_TAB_SW_IMG_SOL.idAncestorArea = 'SolutionArea';  // 先祖要素のid
CHG_TAB_SW_IMG_SOL.clsTabUnit = 'tabSwImg01Unit';  // タブ全体class名
CHG_TAB_SW_IMG_SOL.clsTabLeaf = 'tabLeaf';  // タブ自体class名
CHG_TAB_SW_IMG_SOL.clsTabCnttGrp = 'tabCnttGrp';  // タブコンテンツグループclass名
CHG_TAB_SW_IMG_SOL.clsTabCntt = 'tabCntt';  // タブコンテンツclass名
CHG_TAB_SW_IMG_SOL.clsLeafInnr = 'tblfInnr01';  // 直接操作するタブの内側class名
CHG_TAB_SW_IMG_SOL.tabInfo_o = {  // タブ情報
	item_ar : []
		/* ex：
		CHG_TAB_SW_IMG_SOL.tabInfo_o.item_ar[i] = { label : ラベル, elemTabLeaf_jq : タブ自体の要素（jQuery）, elemTabCntt_jq : タブコンテンツの要素（jQuery）, elemLeftInnr_jq : 直接操作するタブの内側（jQuery）, elemTabCnttHeight : タブコンテンツの高さ（:Number） };
		*/
};

CHG_TAB_SW_IMG_SOL.durationSecOpen = 0.5;  // 開く時間（sec）
CHG_TAB_SW_IMG_SOL.durationSecClose = 0.5;  // 閉じる時間（sec）
//CHG_TAB_SW_IMG_SOL.easing = 'linear';  // easing
CHG_TAB_SW_IMG_SOL.easing = 'easeInOutCubic';  // easing



// ------------------
// 【関数】
// ------------------
// なし


// ------------------------------------------------------------
// ▼処理
// ------------------------------------------------------------
$(document).ready( function() {

	// ==============================
	// ■タブの切替え
	// ※スムーススクロールを実装している場合はスムーススクロールの定義のときにタブの<a>を除外すること！
	/* HTML ex：
======
======
	*/
	( function() {
		var i = 0;

		// 初期化
		_init();

		for(i=0; i < CHG_TAB_SW_IMG_SOL.tabInfo_o.item_ar.length; i++) {

			// イベント登録

			// タブ
			$('a', CHG_TAB_SW_IMG_SOL.tabInfo_o.item_ar[i].elemLeafInnr_jq).bind( 'click', { indx : i }, function(e) {
				//alert(e.data.indx);  // DBUG

				var url = '#SolutionArea';  // スクロール先

				// タブの切替え
				_chgTab(e.data.indx);

				e.preventDefault();  // デフォルトの動作を停止
			} );  // bind() 'click'


			// 閉じるボタン
			$('.btnClose a', CHG_TAB_SW_IMG_SOL.tabInfo_o.item_ar[i].elemTabCntt_jq).bind( 'click', { indx : i }, function(e) {

				// タブを閉じる
				_closeTab(e.data.indx);

				e.preventDefault();  // デフォルトの動作を停止
			} );  // bind() 'click'

		}
		
		// ------------------
		// 【関数】
		// ------------------

		// ■初期化
		// %param / なし
		// ------
		// %return / なし
		function _init() {
			// タブ情報の登録
			_addTabInfo();

			// プリロード
			_preload();

			// すべてを非表示
			_hideAll();
		}

		// ■タブ情報の登録
		// %param / なし
		// ------
		// %return / なし
		function _addTabInfo() {

			// タブ自体
			$('#' + CHG_TAB_SW_IMG_SOL.idAncestorArea + ' .' + CHG_TAB_SW_IMG_SOL.clsTabUnit + ' .' + CHG_TAB_SW_IMG_SOL.clsTabLeaf).each( function(indx) {
				CHG_TAB_SW_IMG_SOL.tabInfo_o.item_ar[indx] = {};
				CHG_TAB_SW_IMG_SOL.tabInfo_o.item_ar[indx].label = indx;
				CHG_TAB_SW_IMG_SOL.tabInfo_o.item_ar[indx].elemTabLeaf_jq = $(this);
				CHG_TAB_SW_IMG_SOL.tabInfo_o.item_ar[indx].elemLeafInnr_jq = $( '.' + CHG_TAB_SW_IMG_SOL.clsLeafInnr, $(this) );
			} );  // each()

			// タブコンテンツ
			$('#' + CHG_TAB_SW_IMG_SOL.idAncestorArea + ' .' + CHG_TAB_SW_IMG_SOL.clsTabUnit + ' .' + CHG_TAB_SW_IMG_SOL.clsTabCntt).each( function(indx) {
				CHG_TAB_SW_IMG_SOL.tabInfo_o.item_ar[indx].elemTabCntt_jq = $(this);
				CHG_TAB_SW_IMG_SOL.tabInfo_o.item_ar[indx].elemTabCnttHeight = CHG_TAB_SW_IMG_SOL.tabInfo_o.item_ar[indx].elemTabCntt_jq.height();
			} );  // each()

		}

		// ■プリロード
		// %param / なし
		// ------
		// %return / なし
		function _preload() {
			var i = 0;
			var preImg_jq = null;
			var preImg_ar = [];

			for(i=0; i < CHG_TAB_SW_IMG_SOL.tabInfo_o.item_ar.length; i++) {
				preImg_jq = $('img', CHG_TAB_SW_IMG_SOL.tabInfo_o.item_ar[i].elemLeafInnr_jq );
				preImg_ar.push( new Image() );
				preImg_ar[preImg_ar.length -1].src = preImg_jq.attr('src').replace(/\.(jpg|gif|png)$/, CHG_TAB_SW_IMG_SOL.suffixOver + '.$1');
				//alert( preImg_ar[preImg_ar.length -1].src );  // DBUG
				
				preImg_ar.push( new Image() );
				preImg_ar[preImg_ar.length -1].src = preImg_jq.attr('src').replace(/\.(jpg|gif|png)$/, CHG_TAB_SW_IMG_SOL.suffixCr + '.$1');
				//alert( preImg_ar[preImg_ar.length -1].src );  // DBUG
				
				preImg_ar.push( new Image() );
				preImg_ar[preImg_ar.length -1].src = preImg_jq.attr('src').replace(/\.(jpg|gif|png)$/, CHG_TAB_SW_IMG_SOL.suffixOff + '.$1');
				//alert( preImg_ar[preImg_ar.length -1].src );  // DBUG

				preImg_ar.push( new Image() );
				preImg_ar[preImg_ar.length -1].src = preImg_jq.attr('src').replace(/\.(jpg|gif|png)$/, CHG_TAB_SW_IMG_SOL.suffixOff + CHG_TAB_SW_IMG_SOL.suffixOver + '.$1');
				//alert( preImg_ar[preImg_ar.length -1].src );  // DBUG
			}
		}

		// ■タブの切替え
		// %param / indx:Number / 配列のインデックス
		// ------
		// %return / なし
		function _chgTab(indx) {
			var elemTabLeaf_jq = CHG_TAB_SW_IMG_SOL.tabInfo_o.item_ar[indx].elemTabLeaf_jq;
			var elemTabCntt_jq = CHG_TAB_SW_IMG_SOL.tabInfo_o.item_ar[indx].elemTabCntt_jq;
			var elemLeafInnr_jq = CHG_TAB_SW_IMG_SOL.tabInfo_o.item_ar[indx].elemLeafInnr_jq;

			var clone_jq = null;
			var cloneLink_jq = null;
			var cloneImg_jq = null;

			var cnttHeight = CHG_TAB_SW_IMG_SOL.tabInfo_o.item_ar[indx].elemTabCnttHeight;

			// 他を非表示すべてを非表示
			_hideAll();

			elemTabLeaf_jq.removeClass(CHG_TAB_SW_IMG_SOL.clsHide);  // 表示

			// カレントを生成
			clone_jq = CHG_TAB_SW_IMG_SOL.tabInfo_o.item_ar[indx].elemLeafInnr_jq.clone();  // クローン生成（イベントはコピーしない）
			elemLeafInnr_jq.addClass(CHG_TAB_SW_IMG_SOL.clsHide);  // オリジナルを非表示
			clone_jq.addClass(CHG_TAB_SW_IMG_SOL.clsClone);  // クローンclass名を追加
			elemTabLeaf_jq.addClass(CHG_TAB_SW_IMG_SOL.clsCr);  // カレントclass名を追加
			elemLeafInnr_jq.parent().append(clone_jq);  // クローンを挿入

			// クローンの画像を調整
			cloneImg_jq = $('img', clone_jq);
			cloneImg_jq.removeClass(CHG_TAB_SW_IMG_SOL.clsOver);  // ロールオーバーclass名を削除
			cloneImg_jq.attr( { src : cloneImg_jq.attr('src').replace( new RegExp(CHG_TAB_SW_IMG_SOL.suffixOver + '\.'), '.') } );
			cloneImg_jq.attr( { src : cloneImg_jq.attr('src').replace(/\.(jpg|gif|png)$/, CHG_TAB_SW_IMG_SOL.suffixCr + '.$1') } );
			cloneImg_jq.css( { opacity : 1 } );  // 不透明度

			// <a>を<span>に変更
			//alert(clone_jq.attr('class'));
			cloneLink_jq = $('a', clone_jq);
			cloneLink_jq.parent().html('<span>' + cloneLink_jq.html() + '</span>');

			// 他のタブをOFF画像にする
			_offOtherTabImg(indx);

			// コンテンツを開く
			elemTabCntt_jq.css( { visibility: 'hidden' } );
			elemTabCntt_jq.removeClass(CHG_TAB_SW_IMG_SOL.clsHide);
			elemTabCntt_jq.css( { height: 0, visibility: 'visible' } );

			elemTabCntt_jq.stop(true, true).animate(
				{
				height : cnttHeight + 'px'//,
				},  // css
				CHG_TAB_SW_IMG_SOL.durationSecOpen *1000, CHG_TAB_SW_IMG_SOL.easing, function() {
				} );  // animate()

			// タブコンテンツグループを開く
			// ※コンテンツを開くと同時
			$('.' + CHG_TAB_SW_IMG_SOL.clsTabCnttGrp).stop(true, true).animate(
				{
				height : cnttHeight + 'px'//,
				},  // css
				CHG_TAB_SW_IMG_SOL.durationSecClose *1000, CHG_TAB_SW_IMG_SOL.easing, function() {
				} );  // animate()

			// スムースページスクロール
			// ※コンテンツを開くと同時
			_scrollTo();

		}

		// ■タブを閉じる
		// %param / indx:Number / 配列のインデックス
		// ------
		// %return / なし
		function _closeTab(indx) {
			var elemTabLeaf_jq = CHG_TAB_SW_IMG_SOL.tabInfo_o.item_ar[indx].elemTabLeaf_jq;
			var elemTabCntt_jq = CHG_TAB_SW_IMG_SOL.tabInfo_o.item_ar[indx].elemTabCntt_jq;
			var elemLeafInnr_jq = CHG_TAB_SW_IMG_SOL.tabInfo_o.item_ar[indx].elemLeafInnr_jq;

			elemTabLeaf_jq.removeClass(CHG_TAB_SW_IMG_SOL.clsHide);  // 表示

			

			// コンテンツを閉じる
			elemTabCntt_jq.stop(true, true).animate(
				{
					height : '0px'//,
				},  // css
				CHG_TAB_SW_IMG_SOL.durationSecClose *1000, CHG_TAB_SW_IMG_SOL.easing, function() {
					elemTabCntt_jq.addClass(CHG_TAB_SW_IMG_SOL.clsHide);
					
					// すべてを非表示
					_hideAll();
			} );  // animate()

			// タブコンテンツグループを閉じる
			// ※コンテンツを閉じると同時
			$('.' + CHG_TAB_SW_IMG_SOL.clsTabCnttGrp).stop(true, true).animate(
				{
					height : '0px'//,
				},  // css
				CHG_TAB_SW_IMG_SOL.durationSecClose *1000, CHG_TAB_SW_IMG_SOL.easing, function() {
			} );  // animate()

			// スムースページスクロール
			// ※コンテンツを閉じると同時
			_scrollTo();

		}

		// ■他のタブをOFF画像にする
		// %param / indx:Number / 配列のインデックス
		// ------
		// %return / なし
		function _offOtherTabImg(indx) {
			var elemLeafInnrImg_jq = null;

			var i = 0;
			for(i=0; i < CHG_TAB_SW_IMG_SOL.tabInfo_o.item_ar.length; i++) {
				elemLeafInnrImg_jq = $('img', CHG_TAB_SW_IMG_SOL.tabInfo_o.item_ar[i].elemLeafInnr_jq);

				if(i !== indx) {
					// OFF画像に差し替え
					elemLeafInnrImg_jq.addClass(CHG_TAB_SW_IMG_SOL.clsOff);  // OFF画像class名を追加
					elemLeafInnrImg_jq.attr( { src : elemLeafInnrImg_jq.attr('src').replace( new RegExp(CHG_TAB_SW_IMG_SOL.suffixOver + '\.'), '.') } );
					elemLeafInnrImg_jq.attr( { src : elemLeafInnrImg_jq.attr('src').replace(/\.(jpg|gif|png)$/, CHG_TAB_SW_IMG_SOL.suffixOff + '.$1') } );
				}

			}
		}

		// ■すべてを非表示
		// %param / なし
		// ------
		// %return / なし
		function _hideAll() {
			var i = 0;
			for(i=0; i < CHG_TAB_SW_IMG_SOL.tabInfo_o.item_ar.length; i++) {

				// カレントを削除
				CHG_TAB_SW_IMG_SOL.tabInfo_o.item_ar[i].elemTabLeaf_jq.removeClass(CHG_TAB_SW_IMG_SOL.clsCr);
				$('.' + CHG_TAB_SW_IMG_SOL.clsClone, CHG_TAB_SW_IMG_SOL.tabInfo_o.item_ar[i].elemTabLeaf_jq).remove();  // クローンを削除

				// オリジナルを表示
				CHG_TAB_SW_IMG_SOL.tabInfo_o.item_ar[i].elemLeafInnr_jq.removeClass(CHG_TAB_SW_IMG_SOL.clsHide);
				
				// コンテンツを非表示
				CHG_TAB_SW_IMG_SOL.tabInfo_o.item_ar[i].elemTabCntt_jq.addClass(CHG_TAB_SW_IMG_SOL.clsHide);

				// すべてのタブ画像をリセットする
				_resetAllTabImg()
			}
		}

		// ■すべてのタブ画像をリセットする
		// %param / なし
		// ------
		// %return / なし
		function _resetAllTabImg() {
			var elemLeafInnrImg_jq = null;
			
			var i = 0;
			for(i=0; i < CHG_TAB_SW_IMG_SOL.tabInfo_o.item_ar.length; i++) {
				elemLeafInnrImg_jq = $('img', CHG_TAB_SW_IMG_SOL.tabInfo_o.item_ar[i].elemLeafInnr_jq);

				// ノーマル画像に差し替え
				elemLeafInnrImg_jq.attr( { src : elemLeafInnrImg_jq.attr('src').replace( new RegExp(CHG_TAB_SW_IMG_SOL.suffixOver + '\.'), '.') } );
				elemLeafInnrImg_jq.attr( { src : elemLeafInnrImg_jq.attr('src').replace( new RegExp(CHG_TAB_SW_IMG_SOL.suffixOff + '\.'), '.') } );
				elemLeafInnrImg_jq.removeClass(CHG_TAB_SW_IMG_SOL.clsOff);  // OFF画像class名を削除
			}
		}

		// ■スムースページスクロール
		// %param / なし
		// ------
		// %return / なし
		function _scrollTo() {
			var url = '#' + CHG_TAB_SW_IMG_SOL.idAncestorArea;  // スクロール先

			$.scrollTo( url, { speed: MAIN.speedScroll * 1000, axis: MAIN.axisScroll, queue: true, easing: MAIN.easingScroll, onAfter: function() { window.location = url; } } );

		}

	} )();
	// /==============================

} );  // ready()

