/* SCROLL CONTROL */

/* サムネイルサイズ（オリジナル） */
/* ここを変更した場合は、html側の画像サイズも変更すること */
var DOWNLOAD_THUMBNAIL_WIDTH  = 240;
var DOWNLOAD_THUMBNAIL_HEIGHT = 164;

/* マウスオーバー時のサムネイル縮小率とマージン */
var DOWNLOAD_THUMBNAIL_REDUCERATE = 0.5;
var DOWNLOAD_THUMBNAIL_REDUCEMARGIN = 0;

/* 情報画面フェードインマージン(表示開始位置) */
var DOWNLOAD_INFO_FADEINMARGIN = 20;

/* トランジション用不透明度の開始、終了値 */
var OPACITY_MAX = 1;
var OPACITY_MIN = 0.001; /* 何故か 0 では不具合あり */

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

/* ダウンロードコントロールオブジェクト */
var DownloadControl = {

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

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

		/* DOWNLOADのリスト数を取得 */
		var unit = document.getElements('.download_unit');

		/* DOWNLOADのリスト数でループ */
		for (var i=0 ; i<unit.length ; i++) {
				
			/* ID名を変数にセット */
			var divname_img  = "unit_img"  + (i + 1); // サムネイル
			var divname_info = "unit_info" + (i + 1); // 情報（背景)	

			/* ID名からトランジション用オブジェクト作成            */
			/* また、図のindexに配列の添え字を格納(イベント内で使用) */
			imgFX[i]  = new Fx.Styles(divname_img, { wait: false
													, duration: DOWNLOAD_FX_TIME
													, transition: Fx.Transitions.Quart.easeOut});
			infoFX[i] = new Fx.Styles(divname_info, { wait: false
													, duration: DOWNLOAD_FX_TIME
													, transition: Fx.Transitions.Quart.easeOut});
			$(divname_info).index = i; // イベント内で配列を特定するための添え字を保存
	
			/* とりあえず背景はフェードアウトしておく */
			infoFX[i].start({ 'opacity': OPACITY_MIN });
			
			/* マウスオーバーイベントハンドラ設定 */
			$(divname_info).addEvent('mouseover', function() {
				//サムネイル縮小＆情報フェードイン
				imgFX[this.index].stop();
				imgFX[this.index].start({ 'width': DOWNLOAD_THUMBNAIL_WIDTH * DOWNLOAD_THUMBNAIL_REDUCERATE
								  		 ,'height': DOWNLOAD_THUMBNAIL_HEIGHT * DOWNLOAD_THUMBNAIL_REDUCERATE
								  		 ,"margin": DOWNLOAD_THUMBNAIL_REDUCEMARGIN });
				infoFX[this.index].stop();
				infoFX[this.index].start({'margin-left': 0 ,'opacity': OPACITY_MAX });
			});
	
			/* マウスアウトイベントハンドラ設定 */
			$(divname_info).addEvent('mouseout', function() {
				//サムネイル拡大＆情報フェードアウト
				imgFX[this.index].stop();
				imgFX[this.index].start({ 'width': DOWNLOAD_THUMBNAIL_WIDTH
										 ,'height': DOWNLOAD_THUMBNAIL_HEIGHT
										 ,"margin": 0 });
				infoFX[this.index].stop();
				infoFX[this.index].start({ 'margin-left': DOWNLOAD_INFO_FADEINMARGIN ,'opacity': OPACITY_MIN });
			});
			
		}
	}
	
}

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