https://darwinsincident.net/assets/js/jquery.ala.js

1/*-----------------------------------------------
2 * YouTube API
3-------------------------------------------------*/
4var tag = document.createElement('script');
5
6tag.src = "https://www.youtube.com/iframe_api";
7var firstScriptTag = document.getElementsByTagName('script')[0];
8firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);
9var player;
10
11var ytID = ['vVILv7PhF0c'];
12var ytNow = 0;
13var ytSize = 'large';
14
15function onYouTubeIframeAPIReady() {
16	player = new YT.Player('js-yt-autoplay', {
17		height: '100%',
18		width: '100%',
19		videoId: ytID[0],
20		events: {
21			'onReady': onPlayerReady,
22			'onStateChange': onPlayerStateChange,
23			'onError': onPlayerError
24		},
25		playerVars: {
26			rel: 0,
27			controls: 0,
28			disablekb: 1,
29			fs: 0,
30			iv_load_policy: 3,
31			showinfo: 0,
32			modestbranding: 1,
33			playsinline: 1,
34		}
35	});
36}
37function onPlayerReady(event) {
38	event.target.mute();
39	event.target.playVideo();
40}
41function onPlayerStateChange(event) {
42	if (event.data == YT.PlayerState.ENDED) {
43		ytNow++;
44		if (ytNow >= ytID.length) {
45			ytNow = 0;
46		}
47		if (ytNow < 0) {
48			ytNow = ytID.length - 1;
49		}
50		player.clearVideo();
51		player.loadVideoById(ytID[ytNow], 0, ytSize);
52		player.playVideo();
53	}
54}
55function stopVideo() {
56	player.stopVideo();
57}
58function onPlayerError(event) {
59	//console.log(event);
60}
61
62// YouTube Iframe 二重再生防止 [movie1つのみ]
63$(".js-youtubePlay").on('click', function () {
64	player.stopVideo();
65	$(".js-modalBox").addClass('js-modalplayClose');
66});
67$(document).on('click', '.js-modalplayClose a.js-modalClose', function () {
68	player.playVideo();
69	$(".modalBox").removeClass('js-modalplayClose');
70});
71$(document).on('click', '.js-modalplayClose .js-oneModalIn', function (e) {
72	player.playVideo();
73	$(".modalBox").removeClass('js-modalplayClose');
74});
75/**
76 * アスペクト比
77 */
78var $aspectWrap = $('.js-aspectWrap');
79var aspect = 16 / 9;
80
81function iframeSize() {
82	$aspectWrap.each(function () {
83		var $aspect = $(this).find('.js-aspect');
84		var videoWrapWidth = window.innerWidth;
85		var videoWrapHeight = window.innerHeight;
86		var videoAspectWrap = videoWrapWidth / videoWrapHeight;
87		// console.log(videoWrapWidth, videoWrapHeight);
88
89		if (aspect <= videoAspectWrap) {
90			$aspect.css({
91				'width': videoWrapWidth + 'px',
92				'height': videoWrapWidth / aspect + 'px'
93			});
94		} else {
95			$aspect.css({
96				'width': videoWrapHeight * aspect + 'px',
97				'height': videoWrapHeight + 'px'
98			});
99		}
100	});
101}
102
103// リサイズ処理
104$(window).on('load resize', function () {
105	iframeSize();
106});
107
108function movie(_ytid) {
109	$('#youtubeModal').fadeIn(500);
110	$('.modalBox').fadeIn(500);
111	var ytURL = 'https://www.youtube.com/embed/' + _ytid + '?autoplay=1&rel=0';
112	setTimeout(function () {
113		$('.js-youtubeIframe').attr('src', ytURL);
114	}, 100);
115	$('body').css({ 'overflow': 'hidden' });
116}