-
Notifications
You must be signed in to change notification settings - Fork 0
/
video.js
52 lines (39 loc) · 1.16 KB
/
video.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
function findVideos() {
let videos = document.querySelectorAll('.video');
for (let i = 0; i < videos.length; i++) {
setupVideo(videos[i]);
}
}
function setupVideo(video) {
let link = video.querySelector('.video__link');
let media = video.querySelector('.video__media');
let button = video.querySelector('.video__button');
let id = parseMediaURL(media);
video.addEventListener('click', () => {
let iframe = createIframe(id);
link.remove();
button.remove();
video.appendChild(iframe);
});
link.removeAttribute('href');
video.classList.add('video--enabled');
}
function parseMediaURL(media) {
let regexp = /https:\/\/i\.ytimg\.com\/vi\/([a-zA-Z0-9_-]+)\/maxresdefault\.jpg/i;
let url = media.src;
let match = url.match(regexp);
return match[1];
}
function createIframe(id) {
let iframe = document.createElement('iframe');
iframe.setAttribute('allowfullscreen', '');
iframe.setAttribute('allow', 'autoplay');
iframe.setAttribute('src', generateURL(id));
iframe.classList.add('video__media');
return iframe;
}
function generateURL(id) {
let query = '?rel=0&showinfo=0&autoplay=1';
return 'https://www.youtube.com/embed/' + id + query;
}
findVideos();