$(function(){
	$.getJSON("http://travel.rakuten.co.jp/present/rank_data/present_rank.jsonp?encode=EUC-JP&callback=?")
})
var jsonCallBack = function(jsonData){
	var VIEW_LENGTH_MOJI = 23;
	var i = 1;
	$("#boxMagazine").append('<p id=\"rankTitle\"><img src=\"http://travel.rakuten.co.jp/share/present/images/title_ranking.gif\" alt=\"昨日の応募数ランキング\"></p>');
	$("#boxMagazine").append('<ol class=\"tr_rank\">');
	$(jsonData.hotels).each(function(){
		var comment = this.f_comment;
		
		$(".tr_rank").append('<li class=\"rankNo' + i + '\"></li>');
		$("li.rankNo" + i).append('<span>（' + this.f_kensu + '応募）</span>');
		$("li.rankNo" + i).append('<a id=\"rankTR' + i + '\" href=\"' + clickURLReturn(i) + '?f_no=' + this.f_no + '&f_flg=PRESENT#' + this.f_present + '"></a>');
		$("#rankTR" + i).append('<img width="50" height="50" src="http://img.travel.rakuten.co.jp/image/imgr_200?no=' + this.f_no + '" alt="' + this.f_name + '">');
		if(comment.length > VIEW_LENGTH_MOJI){
			$("#rankTR" + i).append('<strong>' + comment.slice(0,VIEW_LENGTH_MOJI) + '...</strong>');
		} else {
			$("#rankTR" + i).append('<strong>' + comment + '</strong>');
		}
		$("li.rankNo" + i).append('<p>'+ this.f_name + '</p>');
		i++;
	})
	$("#boxMagazine").append('<div id="powered">Powered by <img src="http://img.travel.rakuten.co.jp/share/present/images/travel_logo.gif"/></div>');
}

var clickURLReturn = function(num) {
	var clickURL = new Object();
	
	clickURL[1] = "http://img.travel.rakuten.co.jp/image/tr/hs/prsnt/QbSMH/";
	clickURL[2] = "http://img.travel.rakuten.co.jp/image/tr/hs/prsnt/YC16n/";
	clickURL[3] = "http://img.travel.rakuten.co.jp/image/tr/hs/prsnt/DqUS6/";
	clickURL[4] = "http://img.travel.rakuten.co.jp/image/tr/hs/prsnt/iwQfw/";
	clickURL[5] = "http://img.travel.rakuten.co.jp/image/tr/hs/prsnt/0eAJD/";
	
	return clickURL[num];
}