/* WORKS LIST CONTROL */

/* トランジション時間(ms) */
var WORKS_FX_TIME = 1000;

/* トランジション用不透明度の開始、終了値 */
var WORKS_OPACITY_MAX = 0.999; /* 何故か 1 では不具合あり(MacのFireFoxで文字が一瞬太くなる) */
var WORKS_OPACITY_MIN = 0.001; /* 何故か 0 では不具合あり */

/* ワークスリストオブジェクト */
var WorksList = {

	/* startファンクション */
	start: function(){

		/* トランジション用オブジェクト配列初期化 */
		var WorksFX = [];

		/* WORKSのリスト数を取得 */
		var figure = document.getElements('.works_figure');

		/* 　WORKSのリスト数でループ */
		for (var i=0 ; i<figure.length ; i++) {
		
			/* 図のID名を変数にセット(ID名は任意の名前でOK、ただしworks_figure内の構造を変更した場合はココも変更が必要) */
			var divname = figure[i].getChildren()[1].getChildren().getProperty('id').toString();

			/* 図のID名からトランジション用オブジェクト作成         */
			/* また、図のindexに配列の添え字を格納(イベント内で使用) */
			WorksFX[i] = new Fx.Styles(divname, {wait: false, duration: WORKS_FX_TIME,transition: Fx.Transitions.Quart.easeOut});
			$(divname).name = i; // イベント内で配列を特定するための添え字を保存(普段はindexを使用しているがAnchorには無いのでnameを使用)

			/* とりあえず図はフェードアウトしておく */
			$(divname).effect('opacity', {duration: WORKS_FX_TIME, transition:Fx.Transitions.linear}).start(WORKS_OPACITY_MIN);

			/* マウスオーバーイベントハンドラ設定 */
			$(divname).addEvent('mouseover', function() {
				
				/* マウスポインタを「指」に変更 */
				this.setStyle("cursor","pointer");

				/* 図フェードイン */
				WorksFX[this.name].stop();
				WorksFX[this.name].start({ 'opacity': WORKS_OPACITY_MAX });
			});

			/* マウスアウトイベントハンドラ設定 */
			$(divname).addEvent('mouseout', function() {

				/* マウスポインタを元に戻す */
				this.setStyle("cursor","default");

				/* 図フェードアウト */
				WorksFX[this.name].stop();
				WorksFX[this.name].start({ 'opacity': WORKS_OPACITY_MIN });
			});


		}
	}
}

/* ワークスオブジェクトのstartファンクションをページのロードイベントに追加 */
window.addEvent('domready', WorksList.start);