let jinja create the transcript <details> element

This commit is contained in:
zrose584 2020-09-12 10:51:01 +02:00
parent 537a8e8ab5
commit 57978485ee
2 changed files with 17 additions and 17 deletions

View File

@ -75,30 +75,17 @@ window.addEventListener('DOMContentLoaded', function() {
let tts = Q("video").textTracks; let tts = Q("video").textTracks;
if (!tts.length) return; if (!tts.length) return;
details_tt = document.createElement("details"); details_tt = Q("details#transcript-box");
details_tt.addEventListener("toggle", () => { details_tt.addEventListener("toggle", () => {
if (details_tt.open) loadCues(); if (details_tt.open) loadCues();
}); });
var s = document.createElement("summary"); select_tt = Q("select#select-tt");
s.appendChild(text("Transcript"));
details_tt.appendChild(s);
var divR = document.createElement("div");
select_tt = document.createElement("select");
for (let tt of tts) {
let option = document.createElement("option");
option.appendChild(text(tt.label));
select_tt.appendChild(option);
}
select_tt.selectedIndex = getDefaultTranscriptTrackIdx(); select_tt.selectedIndex = getDefaultTranscriptTrackIdx();
select_tt.addEventListener("change", loadCues); select_tt.addEventListener("change", loadCues);
divR.appendChild(select_tt);
table_tt = document.createElement("table"); table_tt = Q("table#transcript-table");
table_tt.id = "transcript-table";
table_tt.appendChild(text("loading..")); table_tt.appendChild(text("loading.."));
divR.appendChild(table_tt);
tts.addEventListener("change", (e) => { tts.addEventListener("change", (e) => {
// console.log(e); // console.log(e);
@ -112,6 +99,5 @@ window.addEventListener('DOMContentLoaded', function() {
} }
}) })
details_tt.appendChild(divR);
Q(".side-videos").prepend(details_tt); Q(".side-videos").prepend(details_tt);
}); });

View File

@ -590,6 +590,20 @@ Reload without invidious (for usage of new identity button).</a>
</div> </div>
{% endif %} {% endif %}
{% if subtitle_sources %}
<details id="transcript-box">
<summary>Transcript</summary>
<div>
<select id="select-tt">
{% for source in subtitle_sources %}
<option>{{ source['label'] }}</option>
{% endfor %}
</select>
<table id="transcript-table"></table>
</div>
</details>
{% endif %}
{% if settings.related_videos_mode != 0 %} {% if settings.related_videos_mode != 0 %}
<details class="related-videos-outer" {{'open' if settings.related_videos_mode == 1 else ''}}> <details class="related-videos-outer" {{'open' if settings.related_videos_mode == 1 else ''}}>
<summary>Related Videos</summary> <summary>Related Videos</summary>