feat: support specifying media index in url
All checks were successful
continuous-integration/drone/push Build is passing

This commit is contained in:
Ashhhleyyy 2023-03-03 11:43:21 +00:00
parent 2efde30fc1
commit 4e417e81cc
Signed by: ash
GPG key ID: 83B789081A0878FB

View file

@ -40,24 +40,30 @@ function parseQuery() {
if (window.location.hash.length > 1) { if (window.location.hash.length > 1) {
const qs = window.location.hash.substring(1); const qs = window.location.hash.substring(1);
const query = new URLSearchParams(qs); const query = new URLSearchParams(qs);
const source = query.get('source');
const sourceType = query.get('source_type'); if (query.has('source')) {
const captions = query.getAll('captions'); const source = query.get('source');
const captionLanguages = query.getAll('caption_langs'); const sourceType = query.get('source_type');
const captionLabels = query.getAll('caption_labels'); const captions = query.getAll('captions');
if (!source || !sourceType) { const captionLanguages = query.getAll('caption_langs');
displayError('missing source or sourceType parameter'); const captionLabels = query.getAll('caption_labels');
if (!source || !sourceType) {
displayError('missing source or sourceType parameter');
}
if (captions.length !== captionLanguages.length || captions.length !== captionLabels.length) {
displayError('mismatch between captions, caption_langs and caption_labels length');
}
return {
source, sourceType,
captions, captionLanguages, captionLabels,
}
} else if (query.has('base')) {
return {
base: query.get('base'),
}
} }
if (captions.length !== captionLanguages.length || captions.length !== captionLabels.length) {
displayError('mismatch between captions, caption_langs and caption_labels length');
}
return {
source, sourceType,
captions, captionLanguages, captionLabels,
}
} else {
return null;
} }
return null;
} }
function parseTimestamp(timestamp) { function parseTimestamp(timestamp) {
@ -79,7 +85,7 @@ function formatTimestamp({ hours, mins, secs, frac }) {
const query = parseQuery(); const query = parseQuery();
if (query !== null) { if (query !== null && query.source) {
const { const {
source, sourceType, source, sourceType,
captions, captionLanguages, captionLabels captions, captionLanguages, captionLabels
@ -131,9 +137,16 @@ if (query !== null) {
}); });
}); });
} else { } else {
const BASE = '/videos/'; let base = '/videos/';
if (query !== null && query.base) {
base = query.base;
}
fetch(BASE+'media.json') if (!base.endsWith('/')) {
base = base + '/';
}
fetch(base+'media.json')
.then(res => res.json()) .then(res => res.json())
.then(({ videos }) => { .then(({ videos }) => {
const ul = document.createElement('ul'); const ul = document.createElement('ul');
@ -141,9 +154,9 @@ if (query !== null) {
for (const video of videos) { for (const video of videos) {
//if (!video.filename.includes('telescope')) continue; //if (!video.filename.includes('telescope')) continue;
const query = [ const query = [
['source', BASE+video.filename], ['source', base+video.filename],
['source_type', 'video/mp4'], ['source_type', 'video/mp4'],
...video.subtitles.map(subName => ['captions', BASE+subName]), ...video.subtitles.map(subName => ['captions', base+subName]),
...video.subtitles.map(subName => { ...video.subtitles.map(subName => {
const s = subName.split('.'); const s = subName.split('.');
return ['caption_langs', s[s.length - 2]]; return ['caption_langs', s[s.length - 2]];
@ -158,7 +171,7 @@ if (query !== null) {
durationEle.classList.add('thumbnail-duration'); durationEle.classList.add('thumbnail-duration');
durationEle.innerText = formatTimestamp(duration); durationEle.innerText = formatTimestamp(duration);
const img = document.createElement('img'); const img = document.createElement('img');
img.src = BASE+thumbnail; img.src = base+thumbnail;
img.classList.add('thumbnail'); img.classList.add('thumbnail');
const qs = new URLSearchParams(query).toString(); const qs = new URLSearchParams(query).toString();
const ele = document.createElement('li'); const ele = document.createElement('li');