/**
 * 不動産ソリューション サービスインデックスメニュー用JS
 * require jquery.js
 *
 * フィルタ解除タブ：#service_tab内の<a rel='filter_release'>
 * フィルタ実行タブ：#service_tab内の<a rel='filter_*******'>
 *                   relの値を対象のクラス名とする
 *                   アクティブ時には、class="filter_tab_active"が追加される（CSSでの処理可能）
 *
 * 各アイテム：#service_contents内の<a>
 *             タブのrelで指定されるクラス名を持つものがフィルタで残る
 *             不可時には、class="filter_item_disable"が追加される（CSSでの処理可能）
 *
 * 背景処理：フィルタ実行時に#service_indexに対して、
 *           タブのrelで指定されるクラス名が付与される（CSSでの処理可能）
 *
 * 各画像：通常時 = *.gif
 *         アクティブ = *_o.gif
 *         ロールオーバー = *_o.gif
 *         フィルタ = *_filter.gif
 *         フィルタロールオーバー = *_filter_o.gif
 *         フィルタ不可 = *_filter_disable.gif
 */
(function($){
	$(function(){
		//フィルタ解除タブ
		var filterRelease = $("#service_tab a[rel='filter_release']");
		//フィルタ実行タブ
		var filterTabs = $("#service_tab a[rel^='filter_'][rel!='filter_release']");
		//フィルタ対象アイテム
		var filterItems = $("#service_contents a");

		//背景を操作するエレメント
		var bgArea = $("#service_index");

		//アクティブタブに追加されるクラス
		var filterTabActiveClass = "filter_tab_active";
		//不可タブに追加されるクラス（解除タブのみに利用）
		var filterTabDisableClass = "filter_tab_disable";
		//不可表示アイテムに追加されるクラス
		var filterItemDisableClass = "filter_item_disable";

		//画像のアクティブ時のサフィックス
		var srcSuffixActive = "_o";
		//画像のロールーオーバー時のサフィックス
		var srcSuffixRollOver = "_o";
		//画像のフィルタ時のサフィックス
		var srcSuffixFilter = "_filter";
		//画像のフィルタロールオーバー時のサフィックス
		var srcSuffixFilterRollOver = "_filter_o";
		//画像のフィルタ不可表示時のサフィックス
		var srcSuffixFilterDisable = "_filter_disable";

		//対象となるクラス名群
		var targetClasses = new Array();
		filterTabs.each(function(index){
			targetClasses.push($(this).attr("rel"));
		});

		//フィルタ解除タブにフィルタ解除イベント
		filterRelease
			.attr("href", "javascript:void(0)")
			.hover(imgOver, imgOut)
			.click(releaseFilter)
		;

		//フィルタ実行タブにフィルタ実行イベント
		filterTabs
			.attr("href", "javascript:void(0)")
			.hover(imgOver, imgOut)
			.click(setFilter)
		;

		//アイテムにアイテムクリックイベント
		filterItems
			.hover(imgOver, imgOut)
			.click(clickItem)
		;

		//最初にフィルタ解除
		releaseFilter();
		
		//ロールオーバー
		function imgOver (evnt)
		{
			//不可、アクティブ時はそのまま終了
			if($(this).hasClass(filterItemDisableClass) || $(this).hasClass(filterTabActiveClass) || $(this).hasClass(filterTabDisableClass)){
				return false;
			}
			//画像をロールオーバーに変更
			var img = $(this).find("img");
			img.attr("src", img.attr("src").replace(new RegExp("\\."), srcSuffixRollOver + "."));
			return false;
		}
		
		//ロールアウト
		function imgOut (evnt)
		{
			//不可、アクティブ時はそのまま終了
			if($(this).hasClass(filterItemDisableClass) || $(this).hasClass(filterTabActiveClass) || $(this).hasClass(filterTabDisableClass)){
				return false;
			}
			//画像をロールオーバーを戻す
			var img = $(this).find("img");
			img.attr("src", img.attr("src").replace(new RegExp(srcSuffixRollOver + "\\."), "."));
			return false;
		}

		//フィルタ実行
		function setFilter (evnt)
		{
			//最初に解除
			filterRelease.triggerHandler("click");

			//タブをアクティブ表示
			var tabImg = $(this).find("img");
			tabImg.attr("src", tabImg.attr("src").replace(new RegExp("\\."), srcSuffixActive + "."));
			$(this).addClass(filterTabActiveClass);

			//解除タブを通常表示
			var releaseImg = filterRelease.find("img");
			resetImg(releaseImg);
			filterRelease.removeClass(filterTabDisableClass);

			//タブのrelに指定してある対象クラスを取得
			var targetClass = $(this).attr("rel");

			//クラスを持つアイテムをフィルタ画像に変更
			filterItems.filter("." + targetClass).each(function(){
				var img = $(this).find("img");
				img.attr("src", img.attr("src").replace(new RegExp("\\."), srcSuffixFilter + "."));
			});

			//クラスを持たないアイテムをフィルタ不可画像に変更
			filterItems.filter(":not('" + "." + targetClass + "')").each(function(){
				var img = $(this).find("img");
				img.attr("src", img.attr("src").replace(new RegExp("\\."), srcSuffixFilterDisable + "."));
				$(this).addClass(filterItemDisableClass);
			});

			//背景エリアに対象クラス名を追加
			bgArea.addClass(targetClass);
			return false;
		}

		//フィルタ解除
		function releaseFilter (evnt)
		{
			//フィルタ実行タブからアクティブ時のクラスを削除、画像をリセット
			filterTabs
				.removeClass(filterTabActiveClass)
				.each(function(){
					resetImg($(this).find("img"));
				})
			;
			//アイテムから不可時のクラスを削除、画像をリセット
			filterItems
				.removeClass(filterItemDisableClass)
				.each(function(){
					resetImg($(this).find("img"));
				})
			;

			//解除タブを不可表示
			var releaseImg = filterRelease.find("img");
			resetImg(releaseImg);
			releaseImg.attr("src", releaseImg.attr("src").replace(new RegExp("\\."), srcSuffixFilterDisable + "."));
			filterRelease.addClass(filterTabDisableClass);

			//背景エリアから全対象クラス名を削除
			bgArea.removeClass(targetClasses.join(" "));

			return false;
		}

		//アイテムクリック
		function clickItem(evnt)
		{
			//不可クラスがあればそのまま終了=遷移しない
			if($(this).hasClass(filterItemDisableClass))
			{
				return false;
			}
		}

		//画像のリセット
		function resetImg(img)
		{
			//各サフィックスを削除
			img.attr("src", img.attr("src").replace(new RegExp("(" + srcSuffixFilterDisable + "|" + srcSuffixFilterRollOver + "|" + srcSuffixFilter + "|" + srcSuffixRollOver + "|" + srcSuffixActive + ")\\."), "."));
		}
	});
})(jQuery);