https://www.tuy.co.jp/common/js/zone.js?rnd=2024091202

1/*
2 * 指定時間表示（動画）
3 * 
4 * 指定時間（19時〜21時59分）に放送される番組を表示する。
5 * 
6 * http://rakuraku.bangumi.org/zone?channelIndex=1&broadCastDateFrom=システム日付&broadCastDateTo=システム日付＋7日&timeZoneFrom=1900&timeZoneTo=2159&lowerLimit=10
7 *
8 * APIから取得した番組の中から、動画がある番組のみを抽出。放送時間が近い順に番組を表示する。
9 * 番組が無い場合は、枠自体を非表示。
10 * 動画URL（YoutubeのURL）を埋め込み表示し、サムネイルを表示する。
11 * 動画がクリックされた場合は、動画を再生する。
12 * 画像および放送日時・番組タイトルがクリックされた場合は、当初は” http://sample.rakuraku.bangumi.org/event”の静的ページに遷移する。
13 * 番組表および番組詳細のJS/CSSの実装が完了したら、番組詳細ページへのページ遷移へ切り替える。ただし、以下の場合は除く。
14 * 「関連URL」の「カテゴリID」が「KEYSTATION」の番組は、「関連URL」の「URL」にページ遷移する。
15 */
16(function($) {
17    'use strict';
18
19    // Dom loaded.
20    $(function() {
21        var now = moment();
22
23        $.getJSON('https://rakuraku2.bangumi.org/zone?callback=?', {
24            // パラメータ群
25            channelIndex: 1,
26            broadCastDateFrom: now.format('YYYYMMDD'),
27            broadCastDateTo: now.clone().add(3, 'days').format('YYYYMMDD'),
28            timeZoneFrom: '1900',
29            timeZoneTo: '2500',
30            lowerLimit: 10
31        }, function(response) {
32            // APIから取得した番組の中から、動画がある番組のみを抽出。放送時間が近い順に番組を表示する。
33            // 番組が無い場合は、枠自体を非表示。
34            var programs = [];
35            $.each(response.programs, function(i, program) {
36                if (program.murls.length > 0) {
37                    if (program.e > now.format('YYYYMMDDHHmmss')) {
38                        programs.push(program);
39                        if (programs.length >= 10) {
40                            return false;
41                        }
42                    }
43                }
44            });
45	        if(programs.length==0){
46				let list_element = document.getElementsByClassName("content1");
47				for (let i = list_element.length; i > 0; i--) {
48				  list_element[i-1].remove();
49				}
50				let list_element2 = document.getElementsByClassName("content2");
51				for (let i = list_element2.length; i > 0; i--) {
52				  list_element2[i-1].remove();
53				}
54	        }else{
55	        	if(programs.length==1){
56					let list_element = document.getElementsByClassName("content1");
57					for (let i = list_element.length; i > 0; i--) {
58					  list_element[i-1].remove();
59					}
60		        }else{
61		            // DOM操作を行うHTMLを取得
62					var $count = 0;
63		            // DOM操作で 指定時間表示（動画） の番組を表示する
64		            $.each(programs, function(i, program) {
65		                // YVP の iframe 操作のために最初に append しておく
66		                //$item.find('[data-title]').text(program.title[0].string);
67		                //$item.find('[data-murl]').attr('src', program.murls[0].url);
68		                var existUrl = false;
69		                $.each(program.murls, function() {
70		                    if (this.url) {
71		                        existUrl = true;
72		                        return false;
73		                    }
74		                });
75		                var $html = "";
76		                $.each(program.murls, function() {
77		                    if (this.url) {
78				                $count++;
79				                var urlStr = this.url.split("?");
80			                    var $ID = urlStr[0].replace("//www.youtube.com/embed/","");
81				                var $url = '/weekly/?' + 'p=' + program.pid + '&s=' + program.sid + '&e=' + program.eid + '&ed=' + program.edt;
82				                var s = moment(program.s, 'YYYYMMDDHHmmss');
83				                var e = moment(program.e, 'YYYYMMDDHHmmss');
84
85				                $html = '<a href="' + $url + '">';
86				                $html += '<img src="https://img.youtube.com/vi/' + $ID + '/maxresdefault.jpg" id="' + $ID + '">';
87				                $html += '</a>';
88
89					            var $block = $('.content' + $count);
90					            if($block !== undefined){
91					            	$block.html($html);
92					            }
93					            loadImg($ID);
94			                    return false;

95			                }
96			            });
97			            console.log($count);
98			            if($count >= 6){
99			            	return false;
100			            }
101		            });
102		         }
103	         }
104        });
105    });
106
107    // 画像および放送日時・番組タイトルがクリックされた場合は、当初は” http://sample.rakuraku.bangumi.org/event”の静的ページに遷移する。
108    // 番組表および番組詳細のJS/CSSの実装が完了したら、番組詳細ページへのページ遷移へ切り替える。ただし、以下の場合は除く。
109    // 「関連URL」の「カテゴリID」が「KEYSTATION」の番組は、「関連URL」の「URL」にページ遷移する。
110    var eventUrl = function(program) {
111        if (program.rurls) {
112            for (var i in program.rurls) {
113                var url = program.rurls[i];
114                if (url.cid == 'KEYSTATION') {
115                    return url.url;
116                }
117            }
118        }
119        return '/program/epg?' + 'p=' + program.pid + '&s=' + program.sid + '&e=' + program.eid + '&ed=' + program.edt;
120    }
121})(jQuery);
122
123async function loadImg($ID){
124	if(document.getElementById($ID) != null){
125	  const highQuality = await getYtThumbnail($ID);
126	  document.getElementById($ID).src = highQuality;
127	}
128};
129
130const getYtThumbnail = async (videoId) => {
131  const loadImage = (src) => {
132    return new Promise((resolve, reject) => {
133      const img = new Image();
134      img.onload = (e) => resolve(img);
135      img.src = src;
136    });
137  };
138
139  const THUMB_TYPES = [
140    'maxresdefault.jpg',
141    'sddefault.jpg',
142    'hqdefault.jpg',
143    'mqdefault.jpg',
144    'default.jpg',
145  ];
146  for (let i = 0; i < THUMB_TYPES.length; i++) {
147    const fileName = `https://img.youtube.com/vi/${videoId}/${THUMB_TYPES[i]}`;
148
149    const res = await loadImage(fileName);
150    if (
151      !THUMB_TYPES[i + 1]
152      || (res).width > 120
153    ) {
154      console.log(fileName);
155      return fileName;
156    }
157  }
158};