daball/nm3clol-express-app
1
0
Fork 0
forked from nm3clol/nm3clol-express-app
Code Pull Requests Activity

Added subtitles/captions to video player

Browse Source
This commit is contained in:
David Ball 2024-04-15 05:37:52 -04:00
parent 98008527db
commit 9947355d32
2 changed files with 15 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
app/server.js
View File

@ -104,6 +104,11 @@ glob.globSync('Russell_County/Board_of_Supervisors/YouTube_Archive/**/*.info.jso
matchBase: true, matchBase: true,
follow: true, follow: true,
}).pop(); }).pop();
let subtitleURL = glob.globSync("*.en.vtt", {
cwd: path.join(__dirname, '..', 'public', directory),
matchBase: true,
follow: true,
}).pop();
const route = encodeURI(expressRoutePathFromFilePath(filePath)); const route = encodeURI(expressRoutePathFromFilePath(filePath));
let paths = filePath.substring(0, filePath.lastIndexOf(path.sep) > 0 ? filePath.lastIndexOf(path.sep) : filePath.length-1).split(path.sep); let paths = filePath.substring(0, filePath.lastIndexOf(path.sep) > 0 ? filePath.lastIndexOf(path.sep) : filePath.length-1).split(path.sep);
paths = paths.map((name, idx, aPaths) => { paths = paths.map((name, idx, aPaths) => {
@ -117,7 +122,7 @@ glob.globSync('Russell_County/Board_of_Supervisors/YouTube_Archive/**/*.info.jso
console.log(`Setting route for ${route}`); console.log(`Setting route for ${route}`);
app.get(route, async (req, res) => { app.get(route, async (req, res) => {
let info = require(fullFilePath); let info = require(fullFilePath);
const renderData = { route, filePath, fullFilePath, req, paths, directory, videoURL, info }; const renderData = { route, filePath, fullFilePath, req, paths, directory, videoURL, subtitleURL, info };
res.render("video-player", { h: helpers, ...renderData }); res.render("video-player", { h: helpers, ...renderData });
}); });
}); });

10
views/video-player.ejs
View File

@ -34,7 +34,15 @@
<div class="row p-4 pb-0 pe-lg-0 pt-lg-5 align-items-center rounded-3 border shadow-lg"> <div class="row p-4 pb-0 pe-lg-0 pt-lg-5 align-items-center rounded-3 border shadow-lg">
<div class="col-lg-12 p-3 p-lg-5 pt-lg-3"> <div class="col-lg-12 p-3 p-lg-5 pt-lg-3">
<h1 class="title"><%= (typeof info.title !== 'undefined') ? info.title : "" %> </h1> <h1 class="title"><%= (typeof info.title !== 'undefined') ? info.title : "" %> </h1>
<video class="object-fit-fill ratio ratio-16x9" src="<%-videoURL%>" controls allowfullscreen></video> <video class="object-fit-fill ratio ratio-16x9" controls allowfullscreen>
<source src="<%-videoURL%>">
<track
label="English"
kind="subtitles"
srclang="en"
src="<%-subtitleURL%>"
default />
</video>
</div> </div>
</div> </div>
<% } %> <% } %>