//設備紹介で機械のイメージを変更する
//
//2009年10月09日(金) jQueryで作成しなおした。
//
//現在選択されている画像ID
ID_CurrentPicture=""
//フェードにかける時間
FadeCount=200;

$(function(){
	//最初に選択されている画像
	ID_CurrentPicture="smg1";

	//機械の背景画像を設定
	$("#overimg").css({backgroundImage:"url(img/setsubi/smg1.jpg)",
						backgroundRepeat:"no-repeat",
						backgroundPosition:"center"});
	//マウスオーバー処理を登録
	$("#smg1,#smg2,#smg3,#smr1,#smy1,#smh1,#smk1,#smt1").hover(function(){
		//現在の画像でなければ
		if ($(this).attr("id") != ID_CurrentPicture) {
			//マウスオーバーでＯＮ画像に切替
			$(this).attr("src", $(this).attr("src").replace("_off", "_on"));
		}
		//表の色を変える
		$("."+$(this).attr("id").substring(0,3)+",."+$(this).attr("id"))
			.css({backgroundColor:"#fc8"});
	},function(){
		//現在の画像でなければ
		if ($(this).attr("id") != ID_CurrentPicture) {
			//マウスアウトでＯＦＦ画像に切替
			$(this).attr("src", $(this).attr("src").replace("_on", "_off"));
		}
		//表の色を戻す
		$("."+$(this).attr("id").substring(0,3)+",."+$(this).attr("id"))
			.css({backgroundColor:""});
	});

	//ボタンクリック処理を登録
	$("#smg1,#smg2,#smg3,#smr1,#smy1,#smh1,#smk1,#smt1").click(function(){
		//クリックしたボタンをIDを保存
		ID_CurrentPicture=$(this).attr("id");
		//機械の画像を設定
		$("#overimg").css({backgroundImage: "url("+document.selimage.src+")"});
		document.selimage.src="img/setsubi/"+ID_CurrentPicture+".jpg";
		$("#selimage").fadeTo(0,0);

		$("#selimage").stop().animate({"opacity":1},FadeCount,"easeOutQuad");

		//全ての機種カテゴリ項目をＯＦＦにする
		$("#smg,#smr,#smy,#smh,#smk,#smt").each(function(){
			$(this).attr("src", $(this).attr("src").replace("_on", "_off"));
		});
		//クリックされた機械のカテゴリ項目をＯＮにする
		var $sv = $("#"+ID_CurrentPicture.substring(0,3));
		$sv.attr("src", $sv.attr("src").replace("_off", "_on"));

		//他の機種ボタンを無効
		$("#smg1,#smg2,#smg3,#smr1,#smy1,#smh1,#smk1,#smt1").each(function(){
			$(this).attr("src", $(this).attr("src").replace("_on", "_off"));
		});
		//自分を有効
		$(this).attr("src", $(this).attr("src").replace("_off", "_on"));
	});
});

