watch.html: Move loose inline javascript into watch.js
The number of inline code blocks and the dependencies between them became unmanageable. From 9d96c07a3c2e68f1893634574c3be64e41a2c041 Mon Sep 17 00:00:00 2001 From: James Taylor <user234683@users.noreply.github.com>
This commit is contained in:
parent
56b17c634c
commit
309ff40943
@ -19,13 +19,6 @@
|
|||||||
|
|
||||||
// TODO: Call abort to cancel in-progress appends?
|
// TODO: Call abort to cancel in-progress appends?
|
||||||
|
|
||||||
|
|
||||||
var avMerge;
|
|
||||||
|
|
||||||
function avInitialize(...args){
|
|
||||||
avMerge = new AVMerge(...args);
|
|
||||||
}
|
|
||||||
|
|
||||||
function AVMerge(video, srcPair, startTime){
|
function AVMerge(video, srcPair, startTime){
|
||||||
this.videoSource = srcPair[0];
|
this.videoSource = srcPair[0];
|
||||||
this.audioSource = srcPair[1];
|
this.audioSource = srcPair[1];
|
||||||
|
@ -1,13 +0,0 @@
|
|||||||
(function main() {
|
|
||||||
'use strict';
|
|
||||||
const video = document.getElementById('js-video-player');
|
|
||||||
const speedInput = document.getElementById('speed-control');
|
|
||||||
speedInput.addEventListener('keyup', (event) => {
|
|
||||||
if (event.key === 'Enter') {
|
|
||||||
let speed = parseFloat(speedInput.value);
|
|
||||||
if(!isNaN(speed)){
|
|
||||||
video.playbackRate = speed;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
});
|
|
||||||
}());
|
|
201
youtube/static/js/watch.js
Normal file
201
youtube/static/js/watch.js
Normal file
@ -0,0 +1,201 @@
|
|||||||
|
var video = document.getElementById('js-video-player');
|
||||||
|
|
||||||
|
function changeQuality(selection) {
|
||||||
|
var currentVideoTime = video.currentTime;
|
||||||
|
var videoPaused = video.paused;
|
||||||
|
var videoSpeed = video.playbackRate;
|
||||||
|
var videoSource;
|
||||||
|
if (avMerge)
|
||||||
|
avMerge.close();
|
||||||
|
if (selection.type == 'uni'){
|
||||||
|
videoSource = data['uni_sources'][selection.index];
|
||||||
|
video.src = videoSource.url;
|
||||||
|
} else {
|
||||||
|
let srcPair = data['pair_sources'][selection.index];
|
||||||
|
videoSource = srcPair[0];
|
||||||
|
avMerge = new AVMerge(video, srcPair, currentVideoTime);
|
||||||
|
}
|
||||||
|
video.currentTime = currentVideoTime;
|
||||||
|
if (!videoPaused){
|
||||||
|
video.play();
|
||||||
|
}
|
||||||
|
video.playbackRate = videoSpeed;
|
||||||
|
}
|
||||||
|
|
||||||
|
// Initialize av-merge
|
||||||
|
var avMerge;
|
||||||
|
if (data.using_pair_sources) {
|
||||||
|
var srcPair = data['pair_sources'][data['pair_idx']];
|
||||||
|
var videoSource = srcPair[0];
|
||||||
|
// Do it dynamically rather than as the default in jinja
|
||||||
|
// in case javascript is disabled
|
||||||
|
avMerge = new AVMerge(video, srcPair, 0);
|
||||||
|
}
|
||||||
|
|
||||||
|
// Quality selector
|
||||||
|
document.getElementById('quality-select').addEventListener(
|
||||||
|
'change', function(e) {
|
||||||
|
changeQuality(JSON.parse(this.value))
|
||||||
|
}
|
||||||
|
);
|
||||||
|
|
||||||
|
// Set up video start time from &t parameter
|
||||||
|
if (data.time_start != 0 && video)
|
||||||
|
video.currentTime = data.time_start;
|
||||||
|
|
||||||
|
// External video speed control
|
||||||
|
var speedInput = document.getElementById('speed-control');
|
||||||
|
speedInput.addEventListener('keyup', (event) => {
|
||||||
|
if (event.key === 'Enter') {
|
||||||
|
var speed = parseFloat(speedInput.value);
|
||||||
|
if(!isNaN(speed)){
|
||||||
|
video.playbackRate = speed;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
|
||||||
|
// Playlist lazy image loading
|
||||||
|
if (data.playlist && data.playlist['id'] !== null) {
|
||||||
|
// lazy load playlist images
|
||||||
|
// copied almost verbatim from
|
||||||
|
// https://css-tricks.com/tips-for-rolling-your-own-lazy-loading/
|
||||||
|
// IntersectionObserver isn't supported in pre-quantum
|
||||||
|
// firefox versions, but the alternative of making it
|
||||||
|
// manually is a performance drain, so oh well
|
||||||
|
var observer = new IntersectionObserver(lazyLoad, {
|
||||||
|
|
||||||
|
// where in relation to the edge of the viewport, we are observing
|
||||||
|
rootMargin: "100px",
|
||||||
|
|
||||||
|
// how much of the element needs to have intersected
|
||||||
|
// in order to fire our loading function
|
||||||
|
threshold: 1.0
|
||||||
|
|
||||||
|
});
|
||||||
|
|
||||||
|
function lazyLoad(elements) {
|
||||||
|
elements.forEach(item => {
|
||||||
|
if (item.intersectionRatio > 0) {
|
||||||
|
|
||||||
|
// set the src attribute to trigger a load
|
||||||
|
item.target.src = item.target.dataset.src;
|
||||||
|
|
||||||
|
// stop observing this element. Our work here is done!
|
||||||
|
observer.unobserve(item.target);
|
||||||
|
};
|
||||||
|
});
|
||||||
|
};
|
||||||
|
|
||||||
|
// Tell our observer to observe all img elements with a "lazy" class
|
||||||
|
var lazyImages = document.querySelectorAll('img.lazy');
|
||||||
|
lazyImages.forEach(img => {
|
||||||
|
observer.observe(img);
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
// Autoplay
|
||||||
|
if (data.settings.related_videos_mode !== 0 || data.playlist !== null) {
|
||||||
|
let playability_error = !!data.playability_error;
|
||||||
|
let isPlaylist = false;
|
||||||
|
if (data.playlist !== null && data.playlist['current_index'] !== null)
|
||||||
|
isPlaylist = true;
|
||||||
|
|
||||||
|
// read cookies on whether to autoplay
|
||||||
|
// https://developer.mozilla.org/en-US/docs/Web/API/Document/cookie
|
||||||
|
let cookieValue;
|
||||||
|
let playlist_id;
|
||||||
|
if (isPlaylist) {
|
||||||
|
// from https://stackoverflow.com/a/6969486
|
||||||
|
function escapeRegExp(string) {
|
||||||
|
// $& means the whole matched string
|
||||||
|
return string.replace(/[.*+?^${}()|[\]\\]/g, '\\$&');
|
||||||
|
}
|
||||||
|
playlist_id = data.playlist['id'];
|
||||||
|
playlist_id = escapeRegExp(playlist_id);
|
||||||
|
|
||||||
|
cookieValue = document.cookie.replace(new RegExp(
|
||||||
|
'(?:(?:^|.*;\\s*)autoplay_'
|
||||||
|
+ playlist_id + '\\s*\\=\\s*([^;]*).*$)|^.*$'
|
||||||
|
), '$1');
|
||||||
|
} else {
|
||||||
|
cookieValue = document.cookie.replace(new RegExp(
|
||||||
|
'(?:(?:^|.*;\\s*)autoplay\\s*\\=\\s*([^;]*).*$)|^.*$'
|
||||||
|
),'$1');
|
||||||
|
}
|
||||||
|
|
||||||
|
let autoplayEnabled = 0;
|
||||||
|
if(cookieValue.length === 0){
|
||||||
|
autoplayEnabled = 0;
|
||||||
|
} else {
|
||||||
|
autoplayEnabled = Number(cookieValue);
|
||||||
|
}
|
||||||
|
|
||||||
|
// check the checkbox if autoplay is on
|
||||||
|
let checkbox = document.querySelector('.autoplay-toggle');
|
||||||
|
if(autoplayEnabled){
|
||||||
|
checkbox.checked = true;
|
||||||
|
}
|
||||||
|
|
||||||
|
// listen for checkbox to turn autoplay on and off
|
||||||
|
let cookie = 'autoplay'
|
||||||
|
if (isPlaylist)
|
||||||
|
cookie += '_' + playlist_id;
|
||||||
|
|
||||||
|
checkbox.addEventListener( 'change', function() {
|
||||||
|
if(this.checked) {
|
||||||
|
autoplayEnabled = 1;
|
||||||
|
document.cookie = cookie + '=1; SameSite=Strict';
|
||||||
|
} else {
|
||||||
|
autoplayEnabled = 0;
|
||||||
|
document.cookie = cookie + '=0; SameSite=Strict';
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
if(!playability_error){
|
||||||
|
// play the video if autoplay is on
|
||||||
|
if(autoplayEnabled){
|
||||||
|
video.play();
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// determine next video url
|
||||||
|
let nextVideoUrl;
|
||||||
|
if (isPlaylist) {
|
||||||
|
let currentIndex = data.playlist['current_index'];
|
||||||
|
if (data.playlist['current_index']+1 == data.playlist['items'].length)
|
||||||
|
nextVideoUrl = null;
|
||||||
|
else
|
||||||
|
nextVideoUrl = data.playlist['items'][data.playlist['current_index']+1]['url'];
|
||||||
|
|
||||||
|
// scroll playlist to proper position
|
||||||
|
// item height + gap == 100
|
||||||
|
let pl = document.querySelector('.playlist-videos');
|
||||||
|
pl.scrollTop = 100*currentIndex;
|
||||||
|
} else {
|
||||||
|
if (data.related.length === 0)
|
||||||
|
nextVideoUrl = null;
|
||||||
|
else
|
||||||
|
nextVideoUrl = data.related[0]['url'];
|
||||||
|
}
|
||||||
|
let nextVideoDelay = 1000;
|
||||||
|
|
||||||
|
// go to next video when video ends
|
||||||
|
// https://stackoverflow.com/a/2880950
|
||||||
|
if (nextVideoUrl) {
|
||||||
|
if(playability_error){
|
||||||
|
videoEnded();
|
||||||
|
} else {
|
||||||
|
video.addEventListener('ended', videoEnded, false);
|
||||||
|
}
|
||||||
|
function nextVideo(){
|
||||||
|
if(autoplayEnabled){
|
||||||
|
window.location.href = nextVideoUrl;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
function videoEnded(e) {
|
||||||
|
window.setTimeout(nextVideo, nextVideoDelay);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
@ -54,49 +54,6 @@
|
|||||||
{% endfor %}
|
{% endfor %}
|
||||||
</video>
|
</video>
|
||||||
</figure>
|
</figure>
|
||||||
|
|
||||||
<script src="/youtube.com/static/js/av-merge.js"></script>
|
|
||||||
<script>
|
|
||||||
function changeQuality(selection) {
|
|
||||||
var video = document.getElementById('js-video-player');
|
|
||||||
var currentVideoTime = video.currentTime;
|
|
||||||
var videoPaused = video.paused;
|
|
||||||
var videoSpeed = video.playbackRate;
|
|
||||||
var videoSource;
|
|
||||||
if (avMerge)
|
|
||||||
avMerge.close();
|
|
||||||
if (selection.type == 'uni'){
|
|
||||||
videoSource = data['uni_sources'][selection.index];
|
|
||||||
video.src = videoSource.url;
|
|
||||||
} else {
|
|
||||||
let srcPair = data['pair_sources'][selection.index];
|
|
||||||
videoSource = srcPair[0];
|
|
||||||
avInitialize(video, srcPair, currentVideoTime);
|
|
||||||
}
|
|
||||||
video.currentTime = currentVideoTime;
|
|
||||||
if (!videoPaused){
|
|
||||||
video.play();
|
|
||||||
}
|
|
||||||
video.playbackRate = videoSpeed;
|
|
||||||
}
|
|
||||||
</script>
|
|
||||||
{% if using_pair_sources %}
|
|
||||||
<!-- Initialize av-merge -->
|
|
||||||
<script>
|
|
||||||
var srcPair = data['pair_sources'][data['pair_idx']];
|
|
||||||
var video = document.getElementById('js-video-player');
|
|
||||||
var videoSource = srcPair[0];
|
|
||||||
// Do it dynamically rather than as the default in jinja
|
|
||||||
// in case javascript is disabled
|
|
||||||
avInitialize(video, srcPair, 0);
|
|
||||||
</script>
|
|
||||||
{% endif %}
|
|
||||||
|
|
||||||
{% if time_start != 0 %}
|
|
||||||
<script>
|
|
||||||
document.getElementById('js-video-player').currentTime = {{ time_start|tojson }};
|
|
||||||
</script>
|
|
||||||
{% endif %}
|
|
||||||
{% endif %}
|
{% endif %}
|
||||||
|
|
||||||
<div class="sc-info">
|
<div class="sc-info">
|
||||||
@ -125,7 +82,6 @@
|
|||||||
|
|
||||||
<div class="external-player-controls">
|
<div class="external-player-controls">
|
||||||
<input class="speed" id="speed-control" type="text" title="Video speed">
|
<input class="speed" id="speed-control" type="text" title="Video speed">
|
||||||
<script src="/youtube.com/static/js/speedyplay.js"></script>
|
|
||||||
<select id="quality-select" autocomplete="off">
|
<select id="quality-select" autocomplete="off">
|
||||||
{% for src in uni_sources %}
|
{% for src in uni_sources %}
|
||||||
<option value='{"type": "uni", "index": {{ loop.index0 }}}' {{ 'selected' if loop.index0 == uni_idx and not using_pair_sources else '' }} >{{ src['quality_string'] }}</option>
|
<option value='{"type": "uni", "index": {{ loop.index0 }}}' {{ 'selected' if loop.index0 == uni_idx and not using_pair_sources else '' }} >{{ src['quality_string'] }}</option>
|
||||||
@ -134,13 +90,6 @@
|
|||||||
<option value='{"type": "pair", "index": {{ loop.index0}}}' {{ 'selected' if loop.index0 == pair_idx and using_pair_sources else '' }} >{{ src_pair[0]['quality_string'] }}, {{ src_pair[1]['quality_string'] }}</option>
|
<option value='{"type": "pair", "index": {{ loop.index0}}}' {{ 'selected' if loop.index0 == pair_idx and using_pair_sources else '' }} >{{ src_pair[0]['quality_string'] }}, {{ src_pair[1]['quality_string'] }}</option>
|
||||||
{% endfor %}
|
{% endfor %}
|
||||||
</select>
|
</select>
|
||||||
<script>
|
|
||||||
document.getElementById('quality-select').addEventListener(
|
|
||||||
'change', function(e) {
|
|
||||||
changeQuality(JSON.parse(this.value))
|
|
||||||
}
|
|
||||||
);
|
|
||||||
</script>
|
|
||||||
</div>
|
</div>
|
||||||
<input class="v-checkbox" name="video_info_list" value="{{ video_info }}" form="playlist-edit" type="checkbox">
|
<input class="v-checkbox" name="video_info_list" value="{{ video_info }}" form="playlist-edit" type="checkbox">
|
||||||
|
|
||||||
@ -212,7 +161,7 @@
|
|||||||
<div class="playlist-header">
|
<div class="playlist-header">
|
||||||
<a href="{{ playlist['url'] }}" title="{{ playlist['title'] }}"><h3>{{ playlist['title'] }}</h3></a>
|
<a href="{{ playlist['url'] }}" title="{{ playlist['title'] }}"><h3>{{ playlist['title'] }}</h3></a>
|
||||||
<ul class="playlist-metadata">
|
<ul class="playlist-metadata">
|
||||||
<li><label for="playlist-autoplay-toggle">Autoplay: </label><input type="checkbox" id="playlist-autoplay-toggle"></li>
|
<li><label for="playlist-autoplay-toggle">Autoplay: </label><input type="checkbox" class="autoplay-toggle"></li>
|
||||||
{% if playlist['current_index'] is none %}
|
{% if playlist['current_index'] is none %}
|
||||||
<li>[Error!]/{{ playlist['video_count'] }}</li>
|
<li>[Error!]/{{ playlist['video_count'] }}</li>
|
||||||
{% else %}
|
{% else %}
|
||||||
@ -233,173 +182,11 @@
|
|||||||
{% endif %}
|
{% endif %}
|
||||||
{% endfor %}
|
{% endfor %}
|
||||||
</nav>
|
</nav>
|
||||||
{% if playlist['id'] is not none %}
|
|
||||||
<script>
|
|
||||||
// @license magnet:?xt=urn:btih:0b31508aeb0634b347b8270c7bee4d411b5d4109&dn=agpl-3.0.txt AGPL-v3-or-Later
|
|
||||||
// lazy load playlist images
|
|
||||||
// copied almost verbatim from
|
|
||||||
// https://css-tricks.com/tips-for-rolling-your-own-lazy-loading/
|
|
||||||
// IntersectionObserver isn't supported in pre-quantum
|
|
||||||
// firefox versions, but the alternative of making it
|
|
||||||
// manually is a performance drain, so oh well
|
|
||||||
let observer = new IntersectionObserver(lazyLoad, {
|
|
||||||
|
|
||||||
// where in relation to the edge of the viewport, we are observing
|
|
||||||
rootMargin: "100px",
|
|
||||||
// how much of the element needs to have intersected
|
|
||||||
// in order to fire our loading function
|
|
||||||
threshold: 1.0
|
|
||||||
});
|
|
||||||
|
|
||||||
function lazyLoad(elements) {
|
|
||||||
elements.forEach(item => {
|
|
||||||
if (item.intersectionRatio > 0) {
|
|
||||||
// set the src attribute to trigger a load
|
|
||||||
item.target.src = item.target.dataset.src;
|
|
||||||
// stop observing this element. Our work here is done!
|
|
||||||
observer.unobserve(item.target);
|
|
||||||
};
|
|
||||||
});
|
|
||||||
};
|
|
||||||
|
|
||||||
// Tell our observer to observe all img elements with a "lazy" class
|
|
||||||
let lazyImages = document.querySelectorAll('img.lazy');
|
|
||||||
lazyImages.forEach(img => {
|
|
||||||
observer.observe(img);
|
|
||||||
});
|
|
||||||
// @license-end
|
|
||||||
</script>
|
|
||||||
{% endif %}
|
|
||||||
</div>
|
</div>
|
||||||
{% elif settings.related_videos_mode != 0 %}
|
{% elif settings.related_videos_mode != 0 %}
|
||||||
<div class="related-autoplay"><label for="related-autoplay-toggle">Autoplay: </label><input type="checkbox" id="related-autoplay-toggle"></div>
|
<div class="related-autoplay"><label for="related-autoplay-toggle">Autoplay: </label><input type="checkbox" class="autoplay-toggle"></div>
|
||||||
{% endif %}
|
{% endif %}
|
||||||
|
|
||||||
{% if settings.related_videos_mode != 0 or playlist %}
|
|
||||||
<script>
|
|
||||||
// @license magnet:?xt=urn:btih:0b31508aeb0634b347b8270c7bee4d411b5d4109&dn=agpl-3.0.txt AGPL-v3-or-Later
|
|
||||||
let playability_error = {{ 'true' if playability_error else 'false' }};
|
|
||||||
{% if playlist and playlist['current_index'] is not none %}
|
|
||||||
{% set isPlaylist = true %}
|
|
||||||
{% endif %}
|
|
||||||
|
|
||||||
{% if isPlaylist %}
|
|
||||||
// from https://stackoverflow.com/a/6969486
|
|
||||||
function escapeRegExp(string) {
|
|
||||||
return string.replace(/[.*+?^${}()|[\]\\]/g, '\\$&'); // $& means the whole matched string
|
|
||||||
}
|
|
||||||
let playlist_id = {{ playlist['id']|tojson }};
|
|
||||||
playlist_id = escapeRegExp(playlist_id);
|
|
||||||
{% endif %}
|
|
||||||
|
|
||||||
// read cookies on whether to autoplay
|
|
||||||
// pain in the ass:
|
|
||||||
// https://developer.mozilla.org/en-US/docs/Web/API/Document/cookie
|
|
||||||
{% if isPlaylist %}
|
|
||||||
let cookieValue = document.cookie.replace(new RegExp(
|
|
||||||
'(?:(?:^|.*;\\s*)autoplay_' + playlist_id + '\\s*\\=\\s*([^;]*).*$)|^.*$'), '$1');
|
|
||||||
{% else %}
|
|
||||||
let cookieValue = document.cookie.replace(new RegExp(
|
|
||||||
'(?:(?:^|.*;\\s*)autoplay\\s*\\=\\s*([^;]*).*$)|^.*$'), '$1');
|
|
||||||
{% endif %}
|
|
||||||
|
|
||||||
let autoplayEnabled = 0;
|
|
||||||
if(cookieValue.length === 0){
|
|
||||||
autoplayEnabled = 0;
|
|
||||||
} else {
|
|
||||||
autoplayEnabled = Number(cookieValue);
|
|
||||||
}
|
|
||||||
|
|
||||||
// check the autoplay checkbox if autoplay is on
|
|
||||||
{% if isPlaylist %}
|
|
||||||
let PlaylistAutoplayCheck = document.getElementById('playlist-autoplay-toggle');
|
|
||||||
if(autoplayEnabled){
|
|
||||||
PlaylistAutoplayCheck.checked = true;
|
|
||||||
}
|
|
||||||
{% else %}
|
|
||||||
let RelatedAutoplayCheck = document.getElementById('related-autoplay-toggle');
|
|
||||||
if(autoplayEnabled){
|
|
||||||
RelatedAutoplayCheck.checked = true;
|
|
||||||
}
|
|
||||||
{% endif %}
|
|
||||||
|
|
||||||
// listen for checkbox to turn autoplay on and off
|
|
||||||
let cookie = 'autoplay'
|
|
||||||
{% if isPlaylist %}
|
|
||||||
cookie += '_' + playlist_id;
|
|
||||||
PlaylistAutoplayCheck.addEventListener( 'change', function() {
|
|
||||||
if(this.checked) {
|
|
||||||
autoplayEnabled = 1;
|
|
||||||
document.cookie = cookie + '=1; SameSite=Strict';
|
|
||||||
} else {
|
|
||||||
autoplayEnabled = 0;
|
|
||||||
document.cookie = cookie + '=0; SameSite=Strict';
|
|
||||||
}
|
|
||||||
});
|
|
||||||
{% else %}
|
|
||||||
RelatedAutoplayCheck.addEventListener( 'change', function() {
|
|
||||||
if(this.checked) {
|
|
||||||
autoplayEnabled = 1;
|
|
||||||
document.cookie = cookie + '=1; SameSite=Strict';
|
|
||||||
} else {
|
|
||||||
autoplayEnabled = 0;
|
|
||||||
document.cookie = cookie + '=0; SameSite=Strict';
|
|
||||||
}
|
|
||||||
});
|
|
||||||
{% endif %}
|
|
||||||
|
|
||||||
const vid = document.getElementById('js-video-player');
|
|
||||||
if(!playability_error){
|
|
||||||
// play the video if autoplay is on
|
|
||||||
if(autoplayEnabled){
|
|
||||||
vid.play();
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
// determine next video url
|
|
||||||
{% if isPlaylist %}
|
|
||||||
let currentIndex = {{ playlist['current_index']|tojson }};
|
|
||||||
{% if playlist['current_index']+1 == playlist['items']|length %}
|
|
||||||
let nextVideoUrl = null;
|
|
||||||
{% else %}
|
|
||||||
let nextVideoUrl = {{ (playlist['items'][playlist['current_index']+1]['url'])|tojson }};
|
|
||||||
{% endif %}
|
|
||||||
|
|
||||||
// scroll playlist to proper position
|
|
||||||
// item height + gap == 100
|
|
||||||
let pl = document.querySelector('.playlist-videos');
|
|
||||||
pl.scrollTop = 100*currentIndex;
|
|
||||||
{% else %}
|
|
||||||
{% if related|length == 0 %}
|
|
||||||
let nextVideoUrl = null;
|
|
||||||
{% else %}
|
|
||||||
let nextVideoUrl = {{ (related[0]['url'])|tojson }};
|
|
||||||
{% endif %}
|
|
||||||
{% endif %}
|
|
||||||
let nextVideoDelay = 1000;
|
|
||||||
|
|
||||||
// go to next video when video ends
|
|
||||||
// https://stackoverflow.com/a/2880950
|
|
||||||
if (nextVideoUrl) {
|
|
||||||
if(playability_error){
|
|
||||||
videoEnded();
|
|
||||||
} else {
|
|
||||||
vid.addEventListener('ended', videoEnded, false);
|
|
||||||
}
|
|
||||||
function nextVideo(){
|
|
||||||
if(autoplayEnabled){
|
|
||||||
window.location.href = nextVideoUrl;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
function videoEnded(e) {
|
|
||||||
window.setTimeout(nextVideo, nextVideoDelay);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
// @license-end
|
|
||||||
</script>
|
|
||||||
{% endif %}
|
|
||||||
<!-- /playlist -->
|
|
||||||
|
|
||||||
{% if subtitle_sources %}
|
{% if subtitle_sources %}
|
||||||
<details id="transcript-details">
|
<details id="transcript-details">
|
||||||
<summary>Transcript</summary>
|
<summary>Transcript</summary>
|
||||||
@ -448,6 +235,8 @@
|
|||||||
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
<script src="/youtube.com/static/js/av-merge.js"></script>
|
||||||
|
<script src="/youtube.com/static/js/watch.js"></script>
|
||||||
<script src="/youtube.com/static/js/common.js"></script>
|
<script src="/youtube.com/static/js/common.js"></script>
|
||||||
<script src="/youtube.com/static/js/transcript-table.js"></script>
|
<script src="/youtube.com/static/js/transcript-table.js"></script>
|
||||||
{% if settings.use_video_player == 2 %}
|
{% if settings.use_video_player == 2 %}
|
||||||
|
@ -654,7 +654,6 @@ def get_watch_page(video_id=None):
|
|||||||
invidious_reload_button = info['invidious_reload_button'],
|
invidious_reload_button = info['invidious_reload_button'],
|
||||||
video_url = util.URL_ORIGIN + '/watch?v=' + video_id,
|
video_url = util.URL_ORIGIN + '/watch?v=' + video_id,
|
||||||
video_id = video_id,
|
video_id = video_id,
|
||||||
time_start = time_start,
|
|
||||||
|
|
||||||
js_data = {
|
js_data = {
|
||||||
'video_id': info['id'],
|
'video_id': info['id'],
|
||||||
@ -663,6 +662,10 @@ def get_watch_page(video_id=None):
|
|||||||
'has_manual_captions': any(s.get('on') for s in subtitle_sources),
|
'has_manual_captions': any(s.get('on') for s in subtitle_sources),
|
||||||
**source_info,
|
**source_info,
|
||||||
'using_pair_sources': using_pair_sources,
|
'using_pair_sources': using_pair_sources,
|
||||||
|
'time_start': time_start,
|
||||||
|
'playlist': info['playlist'],
|
||||||
|
'related': info['related_videos'],
|
||||||
|
'playability_error': info['playability_error'],
|
||||||
},
|
},
|
||||||
font_family=youtube.font_choices[settings.font],
|
font_family=youtube.font_choices[settings.font],
|
||||||
**source_info,
|
**source_info,
|
||||||
|
Loading…
x
Reference in New Issue
Block a user