// 初期設定
// type: 1=横型のみ、2=縦型のみ、3=縦横兼用、4=縦横２種
var tickets = [
		{'num':'001', 'type':'4'},
		{'num':'002', 'type':'2'},
		{'num':'003', 'type':'3'},
		{'num':'004', 'type':'1'},
		{'num':'005', 'type':'4'},
		{'num':'006', 'type':'3'},
		{'num':'007', 'type':'1'},
		{'num':'008', 'type':'4'},
		{'num':'009', 'type':'1'},
		{'num':'010', 'type':'3'},
		{'num':'011', 'type':'4'},
		{'num':'012', 'type':'3'},
		{'num':'013', 'type':'3'},
		{'num':'014', 'type':'1'},
		{'num':'015', 'type':'1'},
		{'num':'016', 'type':'4'},
		{'num':'017', 'type':'3'},
		{'num':'018', 'type':'3'},
		{'num':'019', 'type':'1'},
		{'num':'020', 'type':'1'},
		{'num':'021', 'type':'4'},
		{'num':'022', 'type':'3'},
		{'num':'023', 'type':'3'},
		{'num':'024', 'type':'1'},
		{'num':'026', 'type':'3'},
		{'num':'027', 'type':'1'},
		{'num':'028', 'type':'1'},
		{'num':'029', 'type':'1'},
		{'num':'030', 'type':'1'},
		{'num':'031', 'type':'1'},
		{'num':'032', 'type':'1'},
		{'num':'033', 'type':'1'},
		{} //dummy
	];

var types = ['','横型のみ','縦型のみ','縦横兼用','縦横2種'];

var thumbTypeFlag = false;		// 表示サムネイルタイプのフラグ

// 初期イベント登録
Event.observe(window, 'load', init);

// 初期処理
function init() {
	Event.observe('thumbTypeSW', 'click', thumbSW);
	// 入場券リスト表示
	displayList();
}

// 入場券リストを表示する処理
function displayList() {
	var lists = '';
	var myClass = ['ticketThumbL','ticketThumbR'];	// 列の左右でクラス名を切り替えるための、クラス名称を格納した配列
	//
	for (var i = 0; i<tickets.length-1; i++) {
		lists += '<dl class="' + myClass[(i%2)] + '">';
		lists += '<dt class="ticketThumb" style="background-image: url(image/ticket' + tickets[i].num + '_s.png)"><a href="#" onclick="thumbSW(); return false;"></a></dt>';
		lists += '<dd>No.' + tickets[i].num + '</dd>';
		lists += '<dd>' + types[eval(tickets[i].type)] + '</dd>';
		lists += '<dd><a href="data/ticket' + tickets[i].num + '.zip">ダウンロード</a></dd>';
		lists += '</dl>';
	}
	$('ticketList').innerHTML = lists;
	
	// ボタンのテキストを切り替え
	buttonTextChange();
}

function thumbSW() {
	// 最初にフラグ反転
	thumbTypeFlag = !thumbTypeFlag;
	// フラグを見てスタイルを切り替える
	var myStyle = (thumbTypeFlag) ? 'bottom':'top'; 
	$$('.ticketThumb').each(function(ele){
		ele.style.backgroundPosition = myStyle;
	});
	// ボタンのテキストを切り替え
	buttonTextChange();
}

function buttonTextChange() {
	$('thumbTypeSW').innerHTML = (thumbTypeFlag) ? 'デザイン例で表示':'素材絵柄のみ表示';
}