tubearchivist
/
tubearchivist
mirror of https://github.com/tubearchivist/tubearchivist.git
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

Fix cast support to handle new video tag format. (#169) 

* Added subtitle support to JS player.

* Move `video-item` id to source tag.

* Move `video-item` id to source tag.

* Fix cast support to handle new video tag format

* Add subtitle support to cast integration, WIP

* Replace `&amp` with `&` in video titles.

* Check if the video is already marked as watched

* Switch to HTML watched check.
This commit is contained in:
Nathan DeTar 2022-02-12 04:08:19 -08:00 committed by GitHub
parent 656a0c7327
commit 385d6bace8
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
4 changed files with 34 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
docker_assets/nginx.conf
View File

@ -16,6 +16,10 @@ server {
location /media/ {
alias /youtube/;
types {
text/vtt vtt;
}
}
location / {

4
tubearchivist/home/templates/home/video.html
View File

@ -4,8 +4,8 @@
{% load humanize %}
<div class="video-main">
<video poster="/cache/{{ video.vid_thumb_url }}" controls preload="false" width="100%" playsinline
id="video-item" ontimeupdate="onVideoProgress('{{ video.youtube_id }}')" onloadedmetadata="setVideoProgress(0)">
<source src="/media/{{ video.media_url }}" type="video/mp4">
ontimeupdate="onVideoProgress('{{ video.youtube_id }}')" onloadedmetadata="setVideoProgress(0)" id="video-item">
<source src="/media/{{ video.media_url }}" type="video/mp4" id="video-source">
{% if video.subtitles %}
{% for subtitle in video.subtitles %}
<track label="{{subtitle.name}}" kind="subtitles" srclang="{{subtitle.lang}}" src="/media/{{subtitle.media_url}}">

27
tubearchivist/static/cast-videos.js
View File

@ -31,21 +31,44 @@ function castStart() {
// Check if there is already media playing on the cast target to prevent recasting on page reload or switching to another video page
if (!castSession.getMediaSession()) {
contentId = document.getElementById("video-item").src; // Get video URL
contentId = document.getElementById("video-source").src; // Get video URL
contentTitle = document.getElementById('video-title').innerHTML; // Get video title
contentImage = document.getElementById("video-item").poster; // Get video thumbnail URL
contentType = 'video/mp4'; // Set content type, only videos right now so it is hard coded
contentCurrentTime = document.getElementById("video-item").currentTime; // Get video's current position
contentActiveSubtitle = [];
// Check if a subtitle is turned on.
for (var i = 0; i < document.getElementById("video-item").textTracks.length; i++) {
if (document.getElementById("video-item").textTracks[i].mode == "showing") {
contentActiveSubtitle =[i + 1];
}
}
contentSubtitles = [];
for (var i = 0; i < document.getElementById("video-item").children.length; i++) {
if (document.getElementById("video-item").children[i].tagName == "TRACK") {
subtitle = new chrome.cast.media.Track(i, chrome.cast.media.TrackType.TEXT);
subtitle.trackContentId = document.getElementById("video-item").children[i].src;
subtitle.trackContentType = 'text/vtt';
subtitle.subtype = chrome.cast.media.TextTrackType.SUBTITLES;
subtitle.name = document.getElementById("video-item").children[i].label;
subtitle.language = document.getElementById("video-item").children[i].srclang;
subtitle.customData = null;
contentSubtitles.push(subtitle);
}
}
mediaInfo = new chrome.cast.media.MediaInfo(contentId, contentType); // Create MediaInfo var that contains url and content type
// mediaInfo.streamType = chrome.cast.media.StreamType.BUFFERED; // Set type of stream, BUFFERED, LIVE, OTHER
mediaInfo.metadata = new chrome.cast.media.GenericMediaMetadata(); // Create metadata var and add it to MediaInfo
mediaInfo.metadata.title = contentTitle; // Set the video title
mediaInfo.metadata.title = contentTitle.replace("&amp;", "&"); // Set the video title
mediaInfo.metadata.images = [new chrome.cast.Image(contentImage)]; // Set the video thumbnail
// mediaInfo.textTrackStyle = new chrome.cast.media.TextTrackStyle();
mediaInfo.tracks = contentSubtitles;
var request = new chrome.cast.media.LoadRequest(mediaInfo); // Create request with the previously set MediaInfo.
// request.queueData = new chrome.cast.media.QueueData(); // See https://developers.google.com/cast/docs/reference/web_sender/chrome.cast.media.QueueData for playlist support.
request.currentTime = shiftCurrentTime(contentCurrentTime); // Set video start position based on the browser video position
request.activeTrackIds = contentActiveSubtitle; // Set active subtitle based on video player
// request.autoplay = false; // Set content to auto play, true by default
castSession.loadMedia(request).then(
function() {

6
tubearchivist/static/script.js
View File

@ -331,7 +331,7 @@ function createPlayer(button) {
}
// Watched indicator
if (videoData.player.is_watched) {
if (videoData.player.watched) {
var playerState = "seen";
var watchedFunction = "Unwatched";
} else {
@ -353,7 +353,7 @@ function createPlayer(button) {
const markup = `
<div class="video-player" data-id="${videoId}">
<video poster="${videoThumbUrl}" ontimeupdate="onVideoProgress('${videoId}')" controls autoplay width="100%" playsinline id="video-item">
<source src="${videoUrl}#t=${videoProgress}" type="video/mp4">
<source src="${videoUrl}#t=${videoProgress}" type="video/mp4" id="video-source">
${subtitles}
</video>
<div class="player-title boxed-content">
@ -388,7 +388,7 @@ function onVideoProgress(videoId) {
if (videoElement != null) {
if ((videoElement.currentTime % 10).toFixed(1) <= 0.2) { // Check progress every 10 seconds or else progress is checked a few times a second
// sendVideoProgress(videoId, videoElement.currentTime); // Groundwork for saving video position
if ((videoElement.currentTime / videoElement.duration) >= 0.90) {
if (((videoElement.currentTime / videoElement.duration) >= 0.90) && document.getElementById(videoId).className == "unseen-icon") {
isWatched(videoId);
}
}