/*
 * 画面出力部分です。 HTML 側と連動して設定します。
 */

// ホットのspice画像の場所
var SPICE_IMG			= "images/spice.gif";
// 新着ニュースの文字の長さ(Byte)
var WHATSNEW_STR_LEN	= 50;
// ランキングページまでのパス
var RANK_PATH = "/ranking/";
// 新着もっと見るのリンク
var WHATS_PATH = "/news/";
// ランキングページの文字数(Byte)
var RANKING_STR_LEN	= 74;
// トップページ(ランキング)の文字数(Byte)
var TOP_RANKING_STR_LEN	= 50;

// 画面描写処理 部分
top.View =
{
	// オリジナル テンプレートHTML 保存用配列
	formHTMLStack: {},

	// ホット
	dispHot: function(id, arrayData) {
		
		if (arrayData != null 
			&& arrayData.hot_list[0] != null 
			& arrayData.hot_list[0].hot != null) 
		{
			var hotArea_01 = document.getElementById(id);
			hotArea_01.style.display = "none";
			hotArea_01.innerHTML = "";
			
			// ulの作成
			var ul = document.createElement("ul");
			ul.className = "list";
			
			// hot_listのhot数分表示
			for (var i=0;i<arrayData.hot_list[0].hot.size();i++) {
				// Itemの取得
				var hot = arrayData.hot_list[0].hot[i];
				// liの作成
				var li = document.createElement("li");
				
				if (hot.link_www != null && hot.link_www != '') {
					var link_www = String(hot.link_www);
					// url,target,text,onclick
					var a = DOMCreater.createA(
								link_www.unescapeHTML(), 
								hot.target , 
								hot.title, 
								null);
					li.appendChild(a);
				} else {
					li.appendChild(document.createTextNode(hot.title));
				}
				
				// spiceマーク追加
				if (hot.evaluate != null && hot.evaluate != '') {
					//<img src="images/spice.gif">
					var spices = parseInt(hot.evaluate, 10)
					for (var n=0;n<spices;n++) {
						// imgSrc,width,height,alt,border
						//▽▽▽ IE8対応 画像表示修正 2009.04.23 ▽▽▽
						var tmp = document.createElement('tmp'); 
						tmp.innerHTML = top.View.MakeImg(SPICE_IMG, null, null, null, null);
						var img = tmp.firstChild;
//						var img = DOMCreater.createImg(
//									SPICE_IMG, 
//									null, 
//									null, 
//									null, 
//									null);
						//△△△ IE8対応 画像表示修正 2009.04.23 △△△
						li.appendChild(img);
					}
				}
				
				ul.appendChild(li);
			}
			
			hotArea_01.appendChild(ul);
			hotArea_01.innerHTML = hotArea_01.innerHTML;
			hotArea_01.style.display = "";
			
		}
		
	},
	
	// 広告バナー
	dispBigBanner: function (id, arrayData) {
		
		if (arrayData != null 
			&& arrayData.big_banner[0] != null 
			& arrayData.big_banner[0].banner != null) 
		{
			var adArea = document.getElementById(id);
			
			adArea.style.display = "none";
			adArea.innerHTML = "";
			
			// バナーは1件固定
			var banner = arrayData.big_banner[0].banner[0];
			
			if (banner.link_www != null && banner.link_www != '') {
				var link_www = String(banner.link_www);
				// url,target,text,onclick
				var a = DOMCreater.createA(
								link_www.unescapeHTML(), 
								banner.target , 
								null, 
								null);
				
				if (banner.img_url[0] != null 
					&& banner.img_url[0] != '') 
				{
					// imgSrc,width,height,alt,border
					//▽▽▽ IE8対応 画像表示修正 2009.04.23 ▽▽▽
					var tmp = document.createElement('tmp'); 
					tmp.innerHTML = top.View.MakeImg(banner.img_url[0]["#text"], 200, 200, banner.img_url[0].alt, 0);
					var img = tmp.firstChild;
//					var img = DOMCreater.createImg(
//									banner.img_url[0]["#text"], 
//									200, 
//									200, 
//									banner.img_url[0].alt, 
//									0);
					//△△△ IE8対応 画像表示修正 2009.04.23 △△△
					a.appendChild(img);
				}
				adArea.appendChild(a);
			}
			
			adArea.innerHTML = adArea.innerHTML;
			adArea.style.display = "";
			
		}
	},
	
	// 新着ニュース
	dispWhatsNew: function (id, arrayData) {
		
		if (arrayData != null 
			&& arrayData.whatsnew_list[0] != null 
			& arrayData.whatsnew_list[0].whatsnew != null) 
		{
			var newsArea = document.getElementById(id);
			newsArea.style.display = "none";
			newsArea.innerHTML = "";
			
			// <h3><span>新着ニュース</span></h3>
			var h3   = document.createElement("h3");
			var span = document.createElement("span");
			span.appendChild(document.createTextNode("新着ニュース"));
			h3.appendChild(span);
			
			var ul = document.createElement("ul");
			
			// 2008/09/25 追加　画像設定用変数群
			var img_stock  = '';
			var img_length = 2;
			var set_img    = 0;
			
			// whatsnew_listのwhatsnew数分表示
			for (var i=0;i<arrayData.whatsnew_list[0].whatsnew.size();i++) {
				
				// Itemの取得
				var whatsnew = arrayData.whatsnew_list[0].whatsnew[i];
				var link_www = String(whatsnew.link_www);
				
				// 新着テキスト
				if (whatsnew.title != null && whatsnew.title != '') {
					var li = document.createElement("li");
					
					// タイトルは50Byte以内でCut
					var title = String(whatsnew.title);
					title = top.View.CountLength(title, WHATSNEW_STR_LEN);
					
					if (whatsnew.link_www != null && whatsnew.link_www != '') {
						// url,target,text,onclick
						var a = DOMCreater.createA(
										link_www.unescapeHTML(), 
										whatsnew.target , 
										title, 
										null);
						li.appendChild(a);
					} else {
						li.appendChild(document.createTextNode(title));
					}
					ul.appendChild(li);
				
				// 新着画像
				} else if (whatsnew.thumbnail_url != null 
						&& whatsnew.thumbnail_url != '' 
						&& whatsnew.thumbnail_url[0]["#text"] != null 
						&& whatsnew.thumbnail_url[0]["#text"] != '') 
				{
					// 1枚目の画像が入ったら、<div class="photo">を生成
					if(set_img == 0){
						var photo = document.createElement("div");
						photo.className = "photo";
					}
					// 画像数を加算
					set_img++;
					
					var a   = DOMCreater.createA(
									link_www.unescapeHTML(), 
									whatsnew.target , 
									null, 
									null);
					
					//▽▽▽ IE8対応 画像表示修正 2009.04.23 ▽▽▽
					var tmp = document.createElement('tmp'); 
					tmp.innerHTML = top.View.MakeImg(whatsnew.thumbnail_url[0]["#text"], 135, 80, whatsnew.thumbnail_url[0].alt, 0);
					var img = tmp.firstChild;
//					var img = DOMCreater.createImg(
//									whatsnew.thumbnail_url[0]["#text"], 
//									135, 
//									80, 
//									whatsnew.thumbnail_url[0].alt, 
//									0);
					//△△△ IE8対応 画像表示修正 2009.04.23 △△△
					a.appendChild(img);
					
					// 2枚目の画像が入ったら、<div class="photo">内にデータを設定
					if(set_img == img_length){
						// 1枚目の画像情報を設定
						photo.appendChild(img_stock);
						// 2枚目の画像情報を設定
						photo.appendChild(a);
						// <div class="photo">をinnerHTMLに設定
						newsArea.appendChild(photo);
					// 1枚目の画像情報をデータストック用変数に格納
					}else{
						img_stock = a;
					}
				}
				// 最後まで2枚入らずに1枚だけ入っている場合
				if(i == arrayData.whatsnew_list[0].whatsnew.size()-1
					&& set_img != img_length
					&& set_img != 0){
					// 1枚目の画像情報を設定
					photo.appendChild(img_stock);
					// <div class="photo">をinnerHTMLに設定
					newsArea.appendChild(photo);
				}
			}
			newsArea.appendChild(ul);
			
			//<p><a href="#">もっとみる</a></p>
			var p = document.createElement("P");
			var a2 = DOMCreater.createA(WHATS_PATH ,"_self", "もっとみる", null);
			p.appendChild(a2);
			newsArea.appendChild(p);
			
			newsArea.innerHTML = newsArea.innerHTML;
			newsArea.style.display = "";
			
		}
	},
	
	// オススメ上段
	dispMovie01: function (id, arrayData) {
		
		if (arrayData != null 
			&& arrayData.recommendation_list[0] != null 
			& arrayData.recommendation_list[0].recommendation != null) 
		{
			var movieArea_01 = document.getElementById(id);
			movieArea_01.style.display = "none";
			movieArea_01.innerHTML = "";
			
			var ul = document.createElement("ul");
			
			// recommendation_listのrecommendation_list数分表示
			for (var i=0;i<arrayData.recommendation_list[0].recommendation.size();i++) {
				// Itemの取得
				var recommendation = arrayData.recommendation_list[0].recommendation[i];
				// liの作成
				var li = document.createElement("li");
				
				// 3個目はスペース要らない。
				if (i<2) li.className = "space10px";
				
				var link_www = String(recommendation.link_www);
				
				var a   = DOMCreater.createA(
								link_www.unescapeHTML(), 
								recommendation.target , 
								null, 
								null);
				
				//▽▽▽ IE8対応 画像表示修正 2009.04.23 ▽▽▽
				var tmp = document.createElement('tmp'); 
				tmp.innerHTML = top.View.MakeImg(recommendation.thumbnail_url[0]["#text"], 210, 158, recommendation.thumbnail_url[0].alt, 0);
				var img = tmp.firstChild;
//				var img = DOMCreater.createImg(
//								recommendation.thumbnail_url[0]["#text"], 
//								210, 
//								158, 
//								recommendation.thumbnail_url[0].alt, 
//								0);
				//△△△ IE8対応 画像表示修正 2009.04.23 △△△
				a.appendChild(img);
				li.appendChild(a);
				
				// ジャンルアイコン
				//▽▽▽ IE8対応 画像表示修正 2009.04.23 ▽▽▽
				tmp.innerHTML = top.View.MakeImg(recommendation.genreiconurl, null, null, null, null);
				var genre = tmp.firstChild;
//				var genre = DOMCreater.createImg(
//								recommendation.genreiconurl, 
//								null, 
//								null, 
//								null, 
//								null);
				//△△△ IE8対応 画像表示修正 2009.04.23 △△△
				li.appendChild(genre);
				
				// h4タグ
				var h4 = document.createElement("h4");
				var title = String(recommendation.title);
				title = (title.unescapeHTML()).stripTags();
				var a2   = DOMCreater.createA(
								link_www.unescapeHTML(), 
								recommendation.target , 
								title, 
								null);
				
				
				h4.appendChild(a2);
				li.appendChild(h4);
				
				// Pタグ
				var p = document.createElement("P");
				var description = String(recommendation.description);
				description = (description.unescapeHTML()).stripTags();
				p.appendChild(document.createTextNode(recommendation.description));
				li.appendChild(p);
				
				// ulに追加
				ul.appendChild(li);
			}
			
			movieArea_01.appendChild(ul);
			movieArea_01.innerHTML = movieArea_01.innerHTML;
			movieArea_01.style.display = "";
			
		}
	},
// オススメ下段
	dispMovie02: function (id, arrayData) {
		if (arrayData != null 
			&& arrayData.recommendation_list[0] != null 
			& arrayData.recommendation_list[0].recommendation != null) 
		{
			var movieArea_02 = document.getElementById(id);
			movieArea_02.style.display = "none";
			movieArea_02.innerHTML = "";
			
			var ul = document.createElement("ul");
			var li = document.createElement("li");
			
			// recommendation_listのrecommendation_list数分表示
			for (var i=0;i<arrayData.recommendation_list[0].recommendation.size();i++) {
				// Itemの取得
				var recommendation = arrayData.recommendation_list[0].recommendation[i];
				var genre_num = parseInt(recommendation.genre, 10);
				
				// liの作成
				if (i%2 == 0) {
					if (i>0) {
						ul.appendChild(li);
						li = document.createElement("li");
					}
					var cName = recommendation.genreimgurl;
					
					if(i!=4) li.className = cName + " space10px";
					if(i==4) li.className = cName;
					
					// <h4>作成
					var h4 = document.createElement("h4");
					var cat_Name = "";
					
					if (genre_num == 1) cat_Name = "ドラマ/映画";
					else if (genre_num == 2) cat_Name = "ニュース";
					else if (genre_num == 3) cat_Name = "スポーツ";
					else if (genre_num == 4) cat_Name = "バラエティ";
					else if (genre_num == 5) cat_Name = "情報番組";
					else if (genre_num == 6) cat_Name = "音楽";
					else cat_Name = "特別企画";
					h4.appendChild(document.createTextNode(cat_Name));
					li.appendChild(h4);
					
				}
				
				var link_www = String(recommendation.link_www);
				var div = document.createElement("DIV");
				div.className="category_img";
				var a   = DOMCreater.createA(
								link_www.unescapeHTML(), 
								recommendation.target , 
								null, 
								null);
				
				//▽▽▽ IE8対応 画像表示修正 2009.04.23 ▽▽▽
				var tmp = document.createElement('tmp'); 
				tmp.innerHTML = top.View.MakeImg(recommendation.thumbnail_url[0]["#text"], 80, 60, recommendation.thumbnail_url[0].alt, 0);
				var img = tmp.firstChild;
//				var img = DOMCreater.createImg(
//								recommendation.thumbnail_url[0]["#text"], 
//								80, 
//								60, 
//								recommendation.thumbnail_url[0].alt, 
//								0);
				//△△△ IE8対応 画像表示修正 2009.04.23 △△△
				a.appendChild(img);
				
				div.appendChild(a);
				
				var p = document.createElement("P");
				p.appendChild(document.createTextNode(recommendation.description));
				div.appendChild(p);
				li.appendChild(div);
				
				if (i%2 != 0) {
					// <div class="more"><a href="#"><span>もっとみる</span></a></div>
					var more = document.createElement("DIV");
					more.className = "more";
					
					var cat_Link = "./";
					if (genre_num == 1)			cat_Link = "./drama/";
					else if (genre_num == 2)	cat_Link = WHATS_PATH;
					else if (genre_num == 3)	cat_Link = "./sports/";
					else if (genre_num == 4)	cat_Link = "./variety/";
					else if (genre_num == 5)	cat_Link = "./infotainment/";
					else if (genre_num == 6)	cat_Link = "./music";
					else						cat_Link = "./special/";
					
					var a2   = DOMCreater.createA(
									cat_Link, 
									"_self", 
									null, 
									null);
					more.appendChild(a2);
					li.appendChild(more);
				}
			}
			
			ul.appendChild(li);
			movieArea_02.appendChild(ul);
			movieArea_02.innerHTML = movieArea_02.innerHTML;
			movieArea_02.style.display = "";
			
		}	
	
	},

// 特集上段
	dispSpecial01: function (id, arrayData) {
		if (arrayData != null 
			&& arrayData.specialbanner_list[0] != null 
			& arrayData.specialbanner_list[0].specialbanner != null) 
		{
			var featureArea_01 = document.getElementById(id);
			featureArea_01.style.display = "none";
			
			// 表示パターン番号 + 画像数
			var pattern;
			if(arrayData.specialbanner_list[0].pattern != undefined && arrayData.specialbanner_list[0].pattern != ''){
				pattern = parseInt(arrayData.specialbanner_list[0].pattern[0], 10);
			}
			var img_no  = arrayData.specialbanner_list[0].specialbanner.length;
			// パターン別使用画像数
			var use_img = new Array(4, 1, 2, 2, 3, 3, 3, 3);
			// パターン別使用画像数よりデータ内画像数が少ない場合、使用画像数をデータ内画像数に変更
			if(use_img[pattern-1] > img_no){ use_img[pattern-1] = img_no };
			
			// specialbanner_listのspecialbanner数分表示
			var str = '';
			str += '<table width="650" cellspacing="0" cellpadding="0">';
			str += '<tbody>';
			
			for (var i=0;i<use_img[pattern-1];i++) {
				// specialbannerの取得
				var banner = arrayData.specialbanner_list[0].specialbanner[i];
				if(i==0){
					str += '<tr>';
				}else if(i==1 && (pattern == 3 || pattern == 7)){
					str += '<tr>';
				}else if(i==2 && (pattern == 1 || pattern == 5 || pattern == 6 || pattern == 8)){
					str += '<tr>';
				}
				// バナー設定
				if(banner != undefined && banner != ''){
					str += top.View.SetBannerClass(banner, (i+1), pattern);
				}
				
				if(i==use_img[pattern-1]-1){
					str += '</tr>';
				}else if(i==0 && (pattern == 3 || pattern == 7)){
					str += '</tr>';
				}else if(i==1 && (pattern == 1 || pattern == 5 || pattern == 6 || pattern == 8)){
					str += '</tr>';
				}
			}
			str += '</tbody>';
			str += '</table>';
			featureArea_01.innerHTML = str;
			featureArea_01.style.display = "";
		}
	},
	
	// 特集下段
	dispSpecial02: function (id, arrayData) {
		if (arrayData != null 
			&& arrayData.special_list[0] != null 
			& arrayData.special_list[0].special != null) 
		{
			var featureArea_02 = document.getElementById(id);
			featureArea_02.style.display = "none";
			featureArea_02.innerHTML = "";
			
			var ul = document.createElement("ul");
			
			// special_listのspecial数分表示
			for (var i=0;i<arrayData.special_list[0].special.size();i++) {
				// specialの取得
				var special = arrayData.special_list[0].special[i];
				
				// liの作成
				var li = document.createElement("li");
				
				// 4個目はスペース要らない。
				if (i<3) li.className = "space10px";
				var link_www = String(special.link_www);

				var a   = DOMCreater.createA(
								link_www.unescapeHTML(), 
								special.target , 
								null, 
								null);
				
				//▽▽▽ IE8対応 画像表示修正 2009.04.23 ▽▽▽
				var tmp = document.createElement('tmp'); 
				tmp.innerHTML = top.View.MakeImg(special.thumbnail_url[0]["#text"], 155, 116, special.thumbnail_url[0].alt, 0);
				var img = tmp.firstChild;
//				var img = DOMCreater.createImg(
//								special.thumbnail_url[0]["#text"], 
//								155, 
//								116, 
//								special.thumbnail_url[0].alt, 
//								0);
				//△△△ IE8対応 画像表示修正 2009.04.23 △△△
				a.appendChild(img);
				li.appendChild(a);
				
				// ジャンルアイコン
				//▽▽▽ IE8対応 画像表示修正 2009.04.23 ▽▽▽
				tmp.innerHTML = top.View.MakeImg(special.genreiconurl, 73, 19, "情報番組", null);
				var genre = tmp.firstChild;
//				var genre = DOMCreater.createImg(
//								special.genreiconurl,
//								73, 
//								19, 
//								"情報番組", 
//								null);
				//△△△ IE8対応 画像表示修正 2009.04.23 △△△
				li.appendChild(genre);
				
				// h4タグ
				var h4 = document.createElement("h4");
				var a2   = DOMCreater.createA(
								link_www.unescapeHTML(), 
								special.target , 
								special.title, 
								null);
//				h4.appendChild(document.createTextNode(special.title));
				h4.appendChild(a2);
				li.appendChild(h4);
				
				// Pタグ
				var p = document.createElement("P");
				p.appendChild(document.createTextNode(special.description));
				li.appendChild(p);
				
				// ulに追加
				ul.appendChild(li);
				
			}
			featureArea_02.appendChild(ul);
			featureArea_02.innerHTML = featureArea_02.innerHTML;
			featureArea_02.style.display = "";
		}
	},
	
	// 第２上段
	dispReport01: function (id, arrayData) {
		if (arrayData != null 
			&& arrayData.dai2_list[0] != null 
			& arrayData.dai2_list[0].dai2 != null) 
		{
			var reportArea_01 = document.getElementById(id);
			reportArea_01.style.display = "none";
			reportArea_01.innerHTML = "";
			
			var ul = document.createElement("ul");
			
			// ranking_listのitem数分表示
			for (var i=0;i<2;i++) {
				
				// Itemの取得
				var dai2 = arrayData.dai2_list[0].dai2[i];
				// liの作成
				var li = document.createElement("li");
				// 2個目はスペース要らない。
				if (i<1) li.className = "space10px";
				
				var a   = DOMCreater.createA(
								dai2.link_www, 
								dai2.target , 
								null, 
								null);
				
				//▽▽▽ IE8対応 画像表示修正 2009.04.23 ▽▽▽
				var tmp = document.createElement('tmp'); 
				tmp.innerHTML = top.View.MakeImg(dai2.thumbnail_url[0]["#text"], 120, 90, dai2.thumbnail_url[0].alt, 0);
				var img = tmp.firstChild;
//				var img = DOMCreater.createImg(
//								dai2.thumbnail_url[0]["#text"], 
//								120, 
//								90, 
//								dai2.thumbnail_url[0].alt, 
//								0);
				//△△△ IE8対応 画像表示修正 2009.04.23 △△△
				a.appendChild(img);
				li.appendChild(a);
				
				var p = document.createElement("P");
				p.appendChild(document.createTextNode(dai2.description));
				li.appendChild(p);
				
				var h4 = document.createElement("h4");
				h4.appendChild(document.createTextNode(dai2.title));
				li.appendChild(h4);
				
				ul.appendChild(li);
			}
			reportArea_01.appendChild(ul);
			reportArea_01.innerHTML = reportArea_01.innerHTML;
			reportArea_01.style.display = "";
		}
	},
	
	
	// 第２下段
	dispReport02: function (id, arrayData) {
		if (arrayData != null 
			&& arrayData.dai2_list[0] != null 
			& arrayData.dai2_list[0].dai2 != null) 
		{
			var reportArea_02 = document.getElementById(id);
			reportArea_02.style.display = "none";
			reportArea_02.innerHTML = "";
			
			var ul = document.createElement("ul");
			
			// ranking_listのitem数分表示
			if (arrayData.dai2_list[0].dai2.size < 2) return;
			for (var i=2;i<arrayData.dai2_list[0].dai2.size();i++) {
				
				// Itemの取得
				var dai2 = arrayData.dai2_list[0].dai2[i];
				// liの作成
				var li = document.createElement("li");
				// 3個目はスペース要らない。
				if (i<4) li.className = "space10px";
				
				var a   = DOMCreater.createA(
								dai2.link_www, 
								dai2.target , 
								null, 
								null);
				//▽▽▽ IE8対応 画像表示修正 2009.04.23 ▽▽▽
				var tmp = document.createElement('tmp'); 
				tmp.innerHTML = top.View.MakeImg(dai2.thumbnail_url[0]["#text"], 210, 60, dai2.thumbnail_url[0].alt, 0);
				var img = tmp.firstChild;
//				var img = DOMCreater.createImg(
//								dai2.thumbnail_url[0]["#text"], 
//								210, 
//								60, 
//								dai2.thumbnail_url[0].alt, 
//								0);
				//△△△ IE8対応 画像表示修正 2009.04.23 △△△
				a.appendChild(img);
				li.appendChild(a);
				
				var h4 = document.createElement("h4");
				h4.appendChild(document.createTextNode(dai2.title));
				li.appendChild(h4);
				
				var p = document.createElement("p");
				p.appendChild(document.createTextNode(dai2.description));
				
				li.appendChild(p);
				ul.appendChild(li);
			}
			reportArea_02.appendChild(ul);
			reportArea_02.innerHTML = reportArea_02.innerHTML;
			reportArea_02.style.display = "";
		}
	},
	
	// ランキング表示
	dispRanking: function (id, arrayData) {
		if (arrayData != null 
			&& arrayData.ranking_list[0] != null 
			& arrayData.ranking_list[0] != null) 
		{
			var rankingArea = document.getElementById(id);
			rankingArea.style.display = "none";
			rankingArea.innerHTML = "";
			
			var str = '';
			// ヘッダ
			str += '<h3><span>動画ランキング</span></h3>\n'
				+  '<ol>\n';
			
			// ranking_listのitem数分表示
			for (var i=0;i<arrayData.ranking_list[0].item.size();i++) {
				// Itemの取得
				var item = arrayData.ranking_list[0].item[i];
				var rank = parseInt(item.rank, 10);
				var title = String(item.title);
				
				// 11位以上は処理をスルー
				if (rank >= 11) continue;
				
				var link_www = String(item.link_www);
				
				str += '<li>\n';
				// 3位まで
				if (rank <= 3) {
					// 順位別div作成
					var ranking = "number_0" + (rank);
					var rank_str = '<div id="best_3">\n';
					// タイトル＋順位アイコン
					rank_str += '<div class="' + ranking + '">\n'
							 +  '<div class="title">\n'
							 +  '<a target="' + item.target + '" href="' + link_www.unescapeHTML() + '">'
							 +  top.View.CountLength(title, TOP_RANKING_STR_LEN) + '</a>\n'
							 +  '</div>\n'
							 +  '</div>\n';
					
					// サムネイル
					rank_str += '<div style="float: right;" class="img">\n'
							 +  '<a target="' + item.target + '" href="' + link_www.unescapeHTML() + '">'
							 +  top.View.MakeImg(item.thumbnail_url, 120, 90, null, 0)
							 +  '</a>\n'
							 +  '</div>\n';
					
					// 本文
					var description = String(item.description);
					rank_str += '<p>' + top.View.CountLength(description, 54) + '</p>\n';
					
					rank_str += '</div>\n';
					str += rank_str;
				}
				// 4位～9位 10位はclass処理が別
				if (rank > 3 && rank <= 10) {
					// 順位別div作成
					var ranking = "number_0" + (rank);
					if (rank == 10) ranking = "number_10";
					
					var rank_str = '';
					rank_str += '<div class="' + ranking + '">\n'
							 +  '<h4>'
							 +  '<a target="' + item.target + '" href="' + link_www.unescapeHTML() + '">'
							 +  title + '</a>'
							 +  '</h4>\n'
							 +  '</div>\n';
					str += rank_str;
				}
				str += '</li>\n';
			}
			// フッタ
			str += '</ol>\n'
				+  '<div id="ranking_table"><a target="" href="' + RANK_PATH + '">ランキング一覧</a></div>\n';
			
			rankingArea.innerHTML = str;
			rankingArea.style.display = "";
		}
	},
	
	// ランキング表示
	dispRankingPage: function (id, arrayData) {
	var str = '';
		
	for (var count=0;count<3;count++) {
		if (arrayData != null 
			&& arrayData.ranking_list[0] != null ) 
		{
			var rankingArea;
			var items;
			str = '';
			
			// 日間
			if (arrayData.ranking_list[0].daily != null && count == 0) 
			{
				rankingArea = document.getElementById("ranking_left");
				items = arrayData.ranking_list[0].daily[0].item;
				str += '<div class="title"><span>日間</span></div>\n';
			}
			
			// 週間
			if (arrayData.ranking_list[0].weekly != null && count == 1) 
			{
				rankingArea = document.getElementById("ranking_center");
				items = arrayData.ranking_list[0].weekly[0].item;
				str += '<div class="title"><span>週間</span></div>\n';
			}
			
			// 月間
			if (arrayData.ranking_list[0].monthly != null && count == 2) {
				rankingArea = document.getElementById("ranking_right");
				items = arrayData.ranking_list[0].monthly[0].item;
				str += '<div class="title"><span>月間</span></div>\n';
			}
			rankingArea.style.display = "none";
			rankingArea.innerHTML = "";
			
			str += '<ol>\n';
			
			// ranking_listのitem数分表示
			var rankCount = 10;
			if(items.size() < 10) rankCount = items.size();
			
			for (var i=0;i<rankCount;i++) {
				// Itemの取得
				var item = items[i];
				var link_www = String(item.link_www);
				var rank = parseInt(item.rank, 10);
				
				str += '<li>\n'
					+  '<div class="img">\n'
					+  '<a target="' + item.target + '" href="' + link_www.unescapeHTML() + '">\n'
					+  top.View.MakeImg(item.thumbnail_url, 100, 75, null, null)
					+  '</a>\n'
					+  '</div>\n';
				
				// div
				var ranking = "rank_title rank_0" + (rank);
				if (rank == 10) ranking = "rank_title rank_10";
				
				var title = String(item.title);
				
				str += '<div class="' + ranking + '">\n'
					+  '<div class="icon">'
					+  top.View.MakeImg(item.genreiconurl, null, null, null, null)
					+  '</div>\n'
					+  '<a target="' + item.target + '" href="' + link_www.unescapeHTML() + '">'
					+  top.View.CutStr(title) + '</a>\n'
					+  '</div>\n';
				
				var description = String(item.description);
				if (description == null || description == "") description = "　";
				
				description = top.View.CountLength(description, RANKING_STR_LEN);
				
				str += '<p>' + description + '</p>\n'
					+  '</li>\n';

			}
			str += '</ol>\n';
			str += '<img style="display: block;" src="../images/ranking_foot.gif" height="20" width="290">\n';
			
			rankingArea.innerHTML = str;
			rankingArea.style.display = "";
		}
	}
	},	
	
	dispCategory: function(id, arrayData) {
		if (arrayData != null 
			&& arrayData.output[0] != null 
			& arrayData.output[0].item != null) 
		{
			var str = '';
			var cat_Name;
			if (id == "drama") cat_Name = "ドラマ/映画";
			else if (id == "news") cat_Name = "ニュース";
			else if (id == "sports") cat_Name = "スポーツ";
			else if (id == "variety") cat_Name = "バラエティ";
			else if (id == "infotainment") cat_Name = "情報番組";
			else if (id == "music") cat_Name = "音楽";
			else cat_Name = "特別企画";
			
			var newMovieArea = document.getElementById("newMovieArea");
			newMovieArea.style.display = "none";
			newMovieArea.innerHTML = "";
			newMovieArea.className = "newMovieArea";
			
			// ヘッダ
			str += '<h2>' + cat_Name + '</h2>\n'
				+  '<h3>新着動画</h3>\n'
				+  '<ul>\n';
			
			var cnt = 6;
			if (arrayData.output[0].item.size() < 6) cnt = arrayData.output[0].item.size();
			
			for (var i=0;i<cnt;i++) {
				var item = arrayData.output[0].item[i];
				var link_www = String(item.link_www);
				
				str += '<li>\n'
					+  '<div class="photo">\n'
					+  '<a target="' + item.target + '" href="' + link_www.unescapeHTML() + '">\n'
					+  top.View.MakeImg(item.thumbnail_url, 120, 90, null, 0)
					+  '</a>\n'
					+  '</div>\n';
				
				var program_name = top.View.CountLength(String(item.program_name), 26);
				var date = String(item.date);
				date = parseInt(date.substr(5,2), 10) + "/" +  parseInt(date.substr(8,2), 10) + "　更新";
				var title = top.View.CountLength(String(item.title), 24);
				var desc = String(item.description);
				desc = top.View.CountLength(desc, 54);
				
				str += '<div class="text">\n'
					+  '<h4>' + program_name + '</h4>\n'
					+  '<p class="date">' + date + '</p>\n'
					+  '<h5>\n'
					+  '<a target="' + item.target + '" href="' + link_www.unescapeHTML() + '">' + title + '</a>\n'
					+  '</h5>\n'
					+  '<p>' + desc + '</p>\n'
					+  '</div>\n'
					+  '</li>\n';
			}
			str += '</ul>\n';
			str += '<img style="display: block; clear: both;" src="../images/genre_foot.gif" class="572" name="572" id="572" height="29" width="690">\n';
			
			newMovieArea.innerHTML = str;
			newMovieArea.style.display = "";
		}
	},
	
	dispShop: function(id, arrayData) {
		if (arrayData != null 
			&& arrayData.output[0] != null 
			& arrayData.output[0].item != null) 
		{
			var str = '';
			
			var recommendArea = document.getElementById("recommendArea");
			recommendArea.style.display = "none";
			recommendArea.innerHTML = "";
			recommendArea.className = "recommendArea";

			var title_len = 64;

			var target = [null, '_blank', '_blank'];
			
			str += '<h3>このジャンルの番組一覧</h3>\n'
				+  '<div class="list_ul">\n';
			
			for (var i=0;i<arrayData.output[0].item.size();i++) {
				var item = arrayData.output[0].item[i];
				
				if (item.title != undefined && item.title != '') {
					var title = top.View.CountLength(item.title[0], title_len); 
				}
				
				str += '<div class="list_li">\n';
				
				// corner
				str += '<div class="corner">\n<h4>';
				if (item.link_url_list != undefined && title != undefined &&
					item.link_url_list != ''        && title != '') {
					str += '<a href="' + item.link_url_list[0].unescapeHTML() + '">' + title + '</a>';
				} else if(item.title != undefined && item.title != '') {
					str += title;
				}
				str += '</h4>\n</div>\n';
				
				// photo
				str += '<div class="photo">\n';
				if (item.link_url_list != undefined && item.image_url != undefined &&
					item.link_url_list != ''        && item.image_url != '') {
					str += '<a href="' + item.link_url_list[0].unescapeHTML() + '">\n'
						+  top.View.MakeImg(item.image_url[0].unescapeHTML(), 140, 80, title != undefined && title != '' ? title : '', 0)
						+  '</a>\n';
				} else if (item.image_url != undefined && item.image_url != '') {
					str +=  top.View.MakeImg(item.image_url[0].unescapeHTML(), 140, 80, title != undefined && title != '' ? title : '', 0)
				}
				str += '</div>\n';
				
				// btn_list
				if (item.link_url_list != undefined &&  item.link_url_list != '') {
					str += '<div class="btn_list">'
						+  '<a href="' + item.link_url_list[0].unescapeHTML() + '">動画はコチラ</a>'
						+  '</div>\n';
				}
				
				//p
				if (item.description != undefined && item.description != '') {
					str += '<p>' + item.description[0] + '</p>\n';
				}
				
				//btn_xxx
				var btn_xxx_class = ['btn_dai2', 'btn_ntv', 'btn_sp'];
				if (item.link_url_top != undefined && item.link_flg != undefined &&
					item.link_url_top != ''        && item.link_flg != '') {
					str += '<div class="' + btn_xxx_class[item.link_flg[0]] + '">'
						+  '<a href="' + item.link_url_top[0].unescapeHTML() + '" ';
					// targetがnullでない場合のみ設定
					if(target[item.link_flg[0]] != null){
						str += 'target="' + target[item.link_flg[0]] + '"';
					}
					str += '>番組ホームページ</a></div>\n';
				}
				str += '</div>\n';
			}
			str += '</div>\n';
			
			recommendArea.innerHTML = str;
			recommendArea.style.display = "";
		}
	},
	
	/**
	 * 指定したByte数までで文字をカットし最後に"…"をつける関数
	 */
	SetBannerClass: function(data, position, pattern) {
		var returnCode = "";
		
		switch(pattern){
			case 1:
				returnCode += '<td class="xs' + position + '">';
				returnCode += top.View.MakeBanner(data, 323, 60);
				break;
			case 2:
				returnCode += '<td>';
				returnCode += top.View.MakeBanner(data, 650, 124);
				break;
			case 3:
				returnCode += '<td class="m'  + position + '">';
				returnCode += top.View.MakeBanner(data, 650, 60);
				break;
			case 4:
				returnCode += '<td class="s'  + position + '">';
				returnCode += top.View.MakeBanner(data, 323, 124);
				break;
			case 5:
				if(position == 1){
					returnCode += '<td rowspan="2" class="s1">';
					returnCode += top.View.MakeBanner(data, 323, 124);
				}else if(position == 2){
					returnCode += '<td class="xs2">';
					returnCode += top.View.MakeBanner(data, 323, 60);
				}else if(position == 3){
					returnCode += '<td class="xs4">';
					returnCode += top.View.MakeBanner(data, 323, 60);
				}
				break;
			case 6:
				if(position == 1){
					returnCode += '<td class="xs1">';
					returnCode += top.View.MakeBanner(data, 323, 60);
				}else if(position == 2){
					returnCode += '<td rowspan="2" class="s2">';
					returnCode += top.View.MakeBanner(data, 323, 124);
				}else if(position == 3){
					returnCode += '<td class="xs3">';
					returnCode += top.View.MakeBanner(data, 323, 60);
				}
				break;
			case 7:
				if(position == 1){
					returnCode += '<td colspan="2" class="m1">';
					returnCode += top.View.MakeBanner(data, 650, 60);
				}else if(position == 2){
					returnCode += '<td class="xs3">';
					returnCode += top.View.MakeBanner(data, 323, 60);
				}else if(position == 3){
					returnCode += '<td class="xs4">';
					returnCode += top.View.MakeBanner(data, 323, 60);
				}
				break;
			case 8:
				if(position == 1){
					returnCode += '<td class="xs1">';
					returnCode += top.View.MakeBanner(data, 323, 60);
				}else if(position == 2){
					returnCode += '<td class="xs2">';
					returnCode += top.View.MakeBanner(data, 323, 60);
				}else if(position == 3){
					returnCode += '<td colspan="2" class="m2">';
					returnCode += top.View.MakeBanner(data, 650, 60);
				}
				break;
			default:
				break;
		}
		returnCode += '</td>';
		return returnCode;
	},
	
	/**
	 * 指定したByte数までで文字をカットし最後に"…"をつける関数
	 */
	MakeBanner: function(data, width, height) {
		var returnCode = "";
		if(data.link_www != undefined && data.link_www != ''){
			// リンク先
			returnCode += '<a href="' + data.link_www + '" ';
			// target属性
			if(data.target != undefined && data.target != ''){
				returnCode += 'target="' + data.target + '" ';
			}
			returnCode += '>';
			
			if(data.thumbnail_url != undefined && data.thumbnail_url != ''){
				if(data.thumbnail_url[0]["#text"] != undefined && data.thumbnail_url[0]["#text"] != ''){
					returnCode += '<img border="0" ';
					returnCode += 'width="' + width + '" height="' + height + '" ';
					// 代替テキスト
					if(data.thumbnail_url[0].alt != undefined && data.thumbnail_url[0].alt != ''){
						returnCode += 'alt="' + data.thumbnail_url[0].alt + '" ';
					}
					// 画像ファイル
					returnCode += 'src="' + data.thumbnail_url[0]["#text"] + '" ';
					returnCode += 'style="background-image: url(images/spinner.gif); background-position: 50%; background-repeat: no-repeat"/>';
				}
			}
			returnCode += '</a>';
		}else{
			if(data.thumbnail_url != undefined && data.thumbnail_url != ''){
				if(data.thumbnail_url[0]["#text"] != undefined && data.thumbnail_url[0]["#text"] != ''){
					returnCode += '<img border="0" ';
					returnCode += 'width="' + width + '" height="' + height + '" ';
					// 代替テキスト
					if(data.thumbnail_url[0].alt != undefined && data.thumbnail_url[0].alt != ''){
						returnCode += 'alt="' + data.thumbnail_url[0].alt + '" ';
					}
					// 画像ファイル
					returnCode += 'src="' + data.thumbnail_url[0]["#text"] + '" ';
					returnCode += 'style="background-image: url(images/spinner.gif); background-position: 50%; background-repeat: no-repeat;"/>';
				}
			}
		}
		return returnCode;
	},
	
	/**
	 * 指定したByte数までで文字をカットし最後に"…"をつける関数
	 */
	CountLength: function(str, Byte) {
		if (str.length == null ) return;
		
		// 不要文字列カット
		var br_txt = '<br />';
		var len = (Byte - br_txt.length)/2;
		if(str.length >= len){
			var str1 = str.substring(0, len);
			var str2 = str.substring(len, str.length);
			str2 = str2.replace(br_txt, "", "g");
			str = str1 + str2;
		}
		
		var returnCode = "";
		var r = 0;
		
		for (var i = 0; i < str.length; i++) {
			var c = str.charCodeAt(i);
			// Shift_JIS: 0x0 ～ 0x80, 0xa0 , 0xa1 ～ 0xdf , 0xfd ～ 0xff
			// Unicode : 0x0 ～ 0x80, 0xf8f0, 0xff61 ～ 0xff9f, 0xf8f1 ～ 0xf8f3
			if ( (c >= 0x0 && c < 0x81) 
				|| (c == 0xf8f0) 
				|| (c >= 0xff61 && c < 0xffa0) 
				|| (c >= 0xf8f1 && c < 0xf8f4)) 
			{
				r += 1;
			} else {
				r += 2;
			}
			if (r >= Byte) {
				return returnCode + "…";
			}
			returnCode += str.substring(i, i+1);
		}
		return returnCode;
	},
	
	/*
	 * 文字数のByte数を数える関数
	 */
	CountStr: function(val) {
		var r = 0;
		for (var i = 0; i < val.length; i++) {
			var c = val.charCodeAt(i);
			// Shift_JIS: 0x0 ～ 0x80, 0xa0 , 0xa1 ～ 0xdf , 0xfd ～ 0xff
			// Unicode : 0x0 ～ 0x80, 0xf8f0, 0xff61 ～ 0xff9f, 0xf8f1 ～ 0xf8f3
			if ( (c >= 0x0 && c < 0x81) 
				|| (c == 0xf8f0) 
				|| (c >= 0xff61 && c < 0xffa0) 
				|| (c >= 0xf8f1 && c < 0xf8f4)) 
			{
				r += 1;
			} else {
				r += 2;
			}
		}
		return r;
	},
	
	CutStr: function(str) {
		if (str==null || str==undefined || str=='') return;
		var retVal = "";
		var data  = str.split("<br />", 3);
		var cnt   = 0;
		var brCnt = 0;
		
		strLen = top.View.CountStr(data[0]);
		brCnt = Math.ceil(strLen/20);

		// dataCount
		if(brCnt >= 4) return top.View.CountLength(data[0], 60);
		if(brCnt == 3) return data[0];
		if(brCnt <= 2) {
			retVal = data[0] + "<br />";
			cnt += brCnt;
		}

		if (data[1]!=undefined) {
			strLen = top.View.CountStr(data[1]);
			brCnt = Math.ceil(strLen/20);
			brCnt += cnt;
			
			if (brCnt >= 4) return retVal + top.View.CountLength(data[1], (60 - (cnt*20)));
			if (brCnt == 3) return (retVal + data[1] + "<br />");
			if (brCnt <= 2) {
				retVal += data[1] + "<br />";
				cnt = brCnt;
			}
		}

		if (data[2]!=undefined) {
			strLen = top.View.CountStr(data[2]);
			brCnt = Math.ceil(strLen/20);
			brCnt += cnt;
			
			if (brCnt >= 4) return retVal + top.View.CountLength(data[2], (60 - (cnt*20)));
			if (brCnt == 3) return (retVal + data[2]);
		}
		
		return retVal;
	},
	
	MakeImg: function(src,width,height,alt,border) {
		var str = '';
		var num = Math.ceil(Math.random()*1000);
		str += '<img '
			+  'class="' + num + '" '
			+  'name="'  + num + '" '
			+  'id="'    + num + '" ';
			
		if(src!=null){
			str += 'src="' + src + '" ';
		}
		if(width!=null){
			str += 'width="' + width + '" ';
		}
		if(height!=null){
			str += 'height="' + height + '" ';
		}
		if(alt!=null){
			str += 'alt="' + alt + '" ';
		}
		if(border!=null){
			str += 'border="' + border + '" ';
		}
		str += ' />';
		return str;
	},
	
	/*
	 * statusバーの消去
	 */
	statusClear: function() {
		window.status='';
	}
	
};

