/*------------------------------------------------------------------------------
	jquery、prototype共存対応
------------------------------------------------------------------------------*/
//jQuery.noConflict();
//var j$ = jQuery;

/*------------------------------------------------------------------------------
	プロパティ宣言
------------------------------------------------------------------------------*/

var Ccomment = "";				// コメントキャッシュ
var COMMENT_BUTTON = 10; 		// コメント切り替えボタンの数
var date = new Date();
var timestamp = date.getTime();

var json_url = "http://webvote.asahi.com/newsvote/json2";

/*------------------------------------------------------------------------------
	windowのloadイベント処理
------------------------------------------------------------------------------*/
if( window.addEventListener ) {

	/* W3C準拠ブラウザ用 */
	window.addEventListener('load', function() {
		Init();
	}, false);

} else if( window.attachEvent ) {

	/* Internet Explorer用 */
	window.attachEvent('onload', function() {
		Init();
	});
}

/*------------------------------------------------------------------------------
	初期処理
------------------------------------------------------------------------------*/
function Init() {

	/* 投票結果ファイル読み込み */
	ResultRead();

	/* コメントファイル読み込み */
	CommentRead();
}

/*------------------------------------------------------------------------------
	投票結果ファイル読み込み
	(scriptタグを生成するとJSONファイルを読み込みResultObject関数を実行)
------------------------------------------------------------------------------*/
function ResultRead() {

	/* エレメントの作成 */
	var script = document.createElement('script');

	/* 文字コード設定 */
	script.charset = "euc-jp";

	/* 投票結果ファイルURL */
	var result_display = document.getElementById("result_display");
	if( result_display == null ){ return false; }
	var id = result_display.getAttribute("value");

	script.src = json_url + "/result/result_" + id + ".json?time=" + timestamp;

	/* </body>直前に<script>要素を追加 */
	document.body.appendChild(script);
}

/*------------------------------------------------------------------------------
	投票結果を表示
------------------------------------------------------------------------------*/
function ResultObject( result_obj ) {

	/* 投票結果ファイルがなければ終了 */
	if( result_obj == null ) { return false; }

	var result_display = document.getElementById("result_display");
	var all_result;

	all_result = "<div id=\"vertical_container\">";
	all_result += "<div class=\"CommentAccordion\">";
	all_result += "<h2 class=\"result_toggle\"><span>結果を見る</span></h2>";
	all_result += "<div class=\"result_content\">";
	all_result += "<table class=\"result-graph\" summary=\"Web投票の結果\">";
	all_result += "<tbody>";

	/* 投票結果成型 */
	for( var i=0; i<result_obj["data"].length; i++ ) {

		all_result += "<tr>";
		all_result += "<th scope=\"row\">" + result_obj["data"][i]["sel"] + "</th>";
		all_result += "<td class=\"graph-wrap\">";
		all_result += "<span style=\"width: " + result_obj["data"][i]["percent"] + "%;\" class=\"graph-bar\">";
		all_result += "</span>";
		all_result += "<strong>" + result_obj["data"][i]["percent"] + "% (" + result_obj["data"][i]["cnt"] +"人)</strong>";
		all_result += "</td>";
		all_result += "</tr>";
	}

	all_result += "</tbody>";
	all_result += "</table>";
	all_result += "</div><!--/result_content -->";
	all_result += "</div><!--/CommentAccordion -->";
	all_result += "</div><!--/vertical_container -->";

	/* 投票結果表示 */
	result_display.innerHTML = all_result;

	jQuery(".CommentAccordion div").hide();
	jQuery(".CommentAccordion h2").click(function(){
		jQuery(this).next("div").slideToggle("normal")
		jQuery(this).toggleClass("active");
	});
}
/*------------------------------------------------------------------------------
	コメントファイル読み込み
	(scriptタグを生成するとJSONファイルを読み込みCommentObject関数が実行する)
------------------------------------------------------------------------------*/
function CommentRead() {

	/* エレメントの作成 */
	var script = document.createElement('script');

	/* 文字コード設定 */
	script.charset = "euc-jp";

	/* コメントファイルURL */
	var comment_display = document.getElementById("comment_display");
	if( comment_display == null ){ return false; }
	var id = comment_display.getAttribute("value");

	script.src = json_url + "/comment/comment_" + id + ".json?time=" + timestamp;

	/* </body>直前に<script>要素を追加 */
	document.body.appendChild(script);
}

/*------------------------------------------------------------------------------
	コメントを表示
------------------------------------------------------------------------------*/
function CommentObject( comment_obj ) {

	/* コメントファイルがなければ終了 */
	if( comment_obj == null ) { return false; }

	/* コメントオブジェクトをキャッシュする */
	Ccomment = comment_obj;

	var comment_display = document.getElementById("comment_display");
	var id = comment_display.getAttribute("value");
	var all_comment = "";

	all_comment += "<a id=\"top_mark\" href=\"#\"></a>\n"
	all_comment += "<div id=\"post_area\">\n"
	all_comment += "<h2 class=\"topi\">\n"
	all_comment += "<span class=\"icon-heading_r\">\n"
	all_comment += "<a href=\"#post-form\" title=\"投稿フォームへ\">\n"
	all_comment += "<img src=\"/images/comment_b_submit.gif\" alt=\"投稿はこちらから\" width=\"145\" height=\"26\"></a></span>\n"
	all_comment += "<img src=\"/images/comment_y_balloons.gif\" alt=\"\">\n"
	all_comment += "<span class=\"icon-heading\">みんなのコメント</span></h2>\n"

	var button = "";
	/* ボタン成型 */
	if( Ccomment["link"] >= 2 ) {
		button += "<div id=\"kosien-posts\">\n";
		button += "<div class=\"anotherP\"><!--ページめくり-->\n";
		button += "<ol>\n";

		/* リンク表示部分の成型 */
		for( var i=1; i<=Ccomment["link"]; i++ ){
			if( i == 1 ) { 
				/* リンク無し */
				button += "<li class=\"Pages\">１</li>\n";
			} else if ( i > COMMENT_BUTTON ) {
				break;
			} else {
				/* リンク付き */
				if( i <= 9 ){
					var I = h2z_num(""+i);
					button += "<li class=\"Pages2\"><a href=\"javascript:void(0)\" onclick=\"ChangeComment(" + i + ")\">" + I + "</a></li>\n";
				}else if( i >=10 ){
					button += "<li class=\"Pages2\"><a href=\"javascript:void(0)\" onclick=\"ChangeComment(" + i + ")\">" + i + "</a></li>\n";
				}
			}
		}
		/* 次へリンク */
		button += "</ol>\n";
		button += "<p class=\"NextPage\"><a href=\"javascript:void(0)\" onclick=\"ChangeComment(" + 2 + ")\"><img src=\"/koshien/css/images/Nextbottun.gif\" alt=\"次へ\" width=\"20\" height=\"20\"/></a></p><p>次へ</p>\n";
		button += "</div><!--/ページめくり-->\n";
	}
	all_comment += button;

	/* コメント成型 */
	for( var i=0; i<Ccomment[1].length; i++ ) {

		all_comment += "<div>\n";
		all_comment += "<h3 class=\"post-title2\">\n";
		all_comment += "<span class=\"datetime\">" + Ccomment[1][i]["uptime"] + "</span>\n";
		all_comment += "<span class=\"nickname\">" + Ccomment[1][i]["nickname"] + "</span>さんの投稿</h3>\n";
		all_comment += "<p>" + Ccomment[1][i]["comment"] + "</p>\n";
		all_comment += "</div>\n";
	}
	all_comment += "<!-- /post_area -->\n";
	all_comment += button;

	/* コメント表示 */
	comment_display.innerHTML = all_comment;
}

/*------------------------------------------------------------------------------
	コメントの表示部分の切り替え
------------------------------------------------------------------------------*/
function ChangeComment( num ) {

	var comment_display = document.getElementById("comment_display");
	var id = comment_display.getAttribute("value");
	var all_comment = "";

	all_comment += "<a id=\"top_mark\" href=\"#\"></a>\n"
	all_comment += "<div id=\"post_area\">\n"
	all_comment += "<h2 class=\"topi\">\n"
	all_comment += "<span class=\"icon-heading_r\">\n"
	all_comment += "<a href=\"#post-form\" title=\"投稿フォームへ\">\n"
	all_comment += "<img src=\"/images/comment_b_submit.gif\" alt=\"投稿はこちらから\" width=\"145\" height=\"26\"></a></span>\n"
	all_comment += "<img src=\"/images/comment_y_balloons.gif\" alt=\"\">\n"
	all_comment += "<span class=\"icon-heading\">みんなのコメント</span></h2>\n"

	var button = "";
	/* ボタン成型 */
	button += "<div id=\"kosien-posts\">\n";
	button += "<div class=\"anotherP\"><!--ページめくり-->\n";

	var page_head = Math.floor((num-1)/COMMENT_BUTTON) * COMMENT_BUTTON + 1;
	
	/* リンク表示部分の成型 */
	for( var i=page_head; i<=Ccomment["link"]; i++ ){

		if( i == page_head && num != 1 ){
			/* 前へリンク */
			var prev = num - 1;
			button += "<p>前へ</p><p class=\"MaePage\"><a href=\"javascript:void(0)\" onclick=\"ChangeComment(" + prev + ")\"><img src=\"/koshien/css/images/Maebottun.gif\" alt=\"前へ\" width=\"20\" height=\"20\"/></a></p>\n";
			button += "<ol>\n";
		}else if( i == page_head ) {
			button += "<ol>\n";
		}

		if( i == num ) {
			/* リンク無し */
			if( i <= 9 ){
				var I = h2z_num(""+i);
				button += "<li class=\"Pages\">" + I + "</li>\n";
			}else if( i >=10 ){
				button += "<li class=\"Pages\">" + i + "</li>\n";
			}
		} else if ( i == page_head + COMMENT_BUTTON ) {
			break;
		} else {
			/* リンク付き */
			if( i <= 9 ){
				var I = h2z_num(""+i);
				button += "<li class=\"Pages2\"><a href=\"javascript:void(0)\" onclick=\"ChangeComment(" + i + ")\">" + I + "</a></li>\n";
			}else if( i >=10 ){
				button += "<li class=\"Pages2\"><a href=\"javascript:void(0)\" onclick=\"ChangeComment(" + i + ")\">" + i + "</a></li>\n";
			}
		}
	}
	if ( num != Ccomment["link"] ) {
		var next = num + 1;
		/* 次へリンク */
		button += "</ol>\n";
		button += "<p class=\"NextPage\"><a href=\"javascript:void(0)\" onclick=\"ChangeComment(" + next + ")\"><img src=\"/koshien/css/images/Nextbottun.gif\" alt=\"次へ\" width=\"20\" height=\"20\"/></a></p><p>次へ</p>\n";
	}else{
		button += "</ol>\n";
	}
	button += "</div><!--/ページめくり-->\n";
	all_comment += button;
	all_comment += "</div><!--/kosien-posts-->\n";

	/* コメント成型 */
	for( var i=0; i<Ccomment[num].length; i++ ) {

		all_comment += "<div>\n";
		all_comment += "<h3 class=\"post-title2\">\n";
		all_comment += "<span class=\"datetime\">" + Ccomment[num][i]["uptime"] + "</span>\n";
		all_comment += "<span class=\"nickname\">" + Ccomment[num][i]["nickname"] + "</span>さんの投稿</h3>\n";
		all_comment += "<p>" + Ccomment[num][i]["comment"] + "</p>\n";
		all_comment += "</div>\n";
	}
	all_comment += button;

	/* コメント表示 */
	comment_display.innerHTML = all_comment;

	/* コメント一覧TOPにフォーカスする */
	var top_mark = document.getElementById("top_mark");
	try{
		top_mark.focus();
	}catch(e){
		//alert("エラーです。"+e);
	}
}

/*------------------------------------------------------------------------------
	半角数字を全角数字に変換
------------------------------------------------------------------------------*/
function h2z_num(str){
	return str.replace(/(\d)/g,function($0){return String.fromCharCode($0.charCodeAt(0)+65248);});
}

/*------------------------------------------------------------------------------
	コメント文字数チェック
------------------------------------------------------------------------------*/
function checkLength() {
	var intMaxLength = 660;
	if (eval(document.postForm.comment.value.length) > intMaxLength) {
		alert("200字以内を目安に投稿してください。");
		return false;
	}
}