diff options
Diffstat (limited to 'youtube/templates')
| -rw-r--r-- | youtube/templates/watch.html | 48 |
1 files changed, 45 insertions, 3 deletions
diff --git a/youtube/templates/watch.html b/youtube/templates/watch.html index 9d7a36c..2c85e16 100644 --- a/youtube/templates/watch.html +++ b/youtube/templates/watch.html @@ -55,8 +55,17 @@ </video> </figure> - {% if pair_sources and (not uni_sources or pair_sources[pair_idx][0]['quality'] != uni_sources[uni_idx]['quality']) %} - <script src="/youtube.com/static/js/av-merge.js"></script> + <script src="/youtube.com/static/js/av-merge.js"></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 %} @@ -93,8 +102,41 @@ <div class="external-player-controls"> <input class="speed" id="speed-control" type="text" title="Video speed"> <script src="/youtube.com/static/js/speedyplay.js"></script> + <select id="quality-select"> + {% 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'] }} (integrated)</option> + {% endfor %} + {% for src_pair in pair_sources %} + <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 %} + </select> + <script> + document.getElementById('quality-select').addEventListener( + 'change', function(e) { + var video = document.getElementById('js-video-player'); + var selection = JSON.parse(this.value); + var currentVideoTime = video.currentTime; + var videoPaused = video.paused; + var videoSpeed = video.playbackRate; + var videoSource; + 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); + } + setVideoDimensions(videoSource.height, videoSource.width); + video.currentTime = currentVideoTime; + if (!videoPaused){ + video.play(); + } + video.playbackRate = videoSpeed; + } + ); + </script> </div> - <input class="v-checkbox" name="video_info_list" value="{{ video_info }}" form="playlist-edit" type="checkbox"> <span class="v-direct-link"><a href="https://youtu.be/{{ video_id }}" rel="noopener noreferrer" target="_blank">Direct Link</a></span> |