feat: support specifying media index in url
All checks were successful
continuous-integration/drone/push Build is passing
All checks were successful
continuous-integration/drone/push Build is passing
This commit is contained in:
parent
2efde30fc1
commit
4e417e81cc
1 changed files with 35 additions and 22 deletions
57
js/main.js
57
js/main.js
|
@ -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');
|
||||||
|
|
Loading…
Reference in a new issue