/*
	varsion: 2008-01-15
	requires: prototyp.js (ver1.6), odekakeBooksData.js
*/
/*
	// 入力データ例
	ODEKAKE_BOOKS_DATA = {
		"info": 
			[
				{
				"img": "/common/images/com_ic006.gif",
				"alt": "東武沿線見聞録 TOBU MARCO",
				"url": "http://www.tobu.co.jp/marco/",
				"target": "1",
				"title": "MARCO",
				"appeal": "東武沿線見聞録",
				"text": "東武線の沿線情報を新しい視点で捉えたハイクオリティ・マガジンです。"
				},
					：
			]
	};

	// HTML出力例
	<div class="type-long">
		<p class="photo">
			<a target="_blank" href="http://www.tobu.co.jp/marco/"><img alt="東武沿線見聞録 TOBU MARCO" src="/magazine/images/index_ph006.jpg"></a>
		</p>
		<dl>
			<dt class="link-container">
				<a target="_blank" class="icon-link" href="http://www.tobu.co.jp/marco/">MARCO</a>
				<img height="12" width="14" class="link-type" alt="" src="/common/images/com_ic006.gif">
			</dt>
			<dd class="topic-body">
				<p class="appeal">東武沿線見聞録</p>
				<p>東武線の沿線情報を新しい視点で捉えたハイクオリティ・マガジンです。</p>
			</dd>
		</dl>
	</div>
		：
*/


/*
  設定
----------------------------------------------------*/

// バナーデータの書き出し先のブロックIDと、対応するデータのオブジェクト名を登録
var ODEKAKE_BOOKS_PARAM = [
	{
		"targetId" : "odekake-books",
		"objName"  : "ODEKAKE_BOOKS_DATA",
		"max"      : 4
	},
];


/*
  テンプレート設定＆書き出し
----------------------------------------------------*/

document.observe("dom:loaded", function() {

	if( !ODEKAKE_BOOKS_PARAM.length ) return;


	ODEKAKE_BOOKS_PARAM.each(function(p){

		if( p && p.max && typeof window[p.objName] != "undefined" ){
			var id = p.targetId;
			var data = window[p.objName];
			var max = p.max;
			if( $(p.targetId) && data.length ){
				// HTMLテンプレート
				var ODEKAKE_BOOKS_TMPL_BODY = new Template(
					'<div class="type-long">'
					+'<p class="photo">'
					+'<a href="#{url}" onclick="#{onclick}"><img src="#{img}" alt="#{alt}"/></a>'
					+'</p>'
					+'<dl>'
					+'<dt class="link-container">'
					+'<a href="#{url}" class="icon-link" onclick="#{onclick}">#{title}</a>'
					+'<img src="/common/images/com_ic006.gif" width="14" height="12" alt="" class="link-type"/>'
					+'</dt>'
					+'<dd class="topic-body">'
					+'<p class="appeal">#{appeal}</p>'
					+'<p>#{text}</p>'
					+'</dd>'
					+'</dl>'
					+'</div>'
				);
				// JSONデータ中の値で、別の値に変換して出力するものをここで処理。case "***"の***部分がJSON中のパラメータ名に対応。
				function setTemplateProperty(data){
					for( var p in data ){
						switch(p){
							case "target":	// 1: 別ウィンドウ || 0: 同ウィンドウ
											data[p] = (data[p] == "1")?
													' target="_blank"' :
													'';
											break;
							default:
											break;
						}
					}
					return data;
				}
				// テンプレートの切り替え＆データのセット
				var htmlStr = "";
				data.each(function(item,i){
					if( i >= max ) throw $break;
						htmlStr += ODEKAKE_BOOKS_TMPL_BODY.evaluate(setTemplateProperty(item));
				});

				// 書き出し
				$(id).innerHTML = htmlStr;
				$(id).style.display = "block";

			}
		}
	});


});



/*
  対象の要素を非表示に設定
  指定した複数のセレクタにまとめてスタイルを適用。
  一つ目のCSSファイル中にルールを追記
----------------------------------------------------*/

(function( selectors ){

	if( selectors && selectors.constructor == Array ){
		var str = '';
		var rule = '{display: none;}';
		var sheet = document.styleSheets[0];
		if( !selectors.length || !sheet || !rule ) return;

		if( Prototype.Browser.WebKit ){
			selectors.each(function(selector){
				str += selector + rule;
			});
			document.write( '<style type="text/css">' + str + '</style>' );
		}
		else if( sheet.insertRule ){
			selectors.each(function(selector){
				sheet.insertRule( selector+rule, sheet.cssRules.length );
			});
		}
		else if( sheet.addRule ){
			selectors.each(function(selector){
				sheet.addRule(selector, rule);
			});
		}
	}

})( [
	"#"+ODEKAKE_BOOKS_PARAM[0].targetId
] );