Tagging API
parent
6e81bbf629
commit
c53af71e99
@ -0,0 +1,2 @@
|
|||||||
|
@sans-serif: Tahoma, sans-serif;
|
||||||
|
@serif: Georgia, Garamond, serif;
|
@ -0,0 +1,44 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="en">
|
||||||
|
<head>
|
||||||
|
<meta charset="UTF-8">
|
||||||
|
<title>Buscribe -- Professor</title>
|
||||||
|
|
||||||
|
<link href="video.js/dist/video-js.min.css" rel="stylesheet">
|
||||||
|
<link href="videojs-hls-quality-selector/dist/videojs-hls-quality-selector.css" rel="stylesheet">
|
||||||
|
|
||||||
|
<link href="style.css" rel="stylesheet">
|
||||||
|
|
||||||
|
<script src="script.js"></script>
|
||||||
|
|
||||||
|
<!-- <script src="videojs-contrib-quality-levels/dist/videojs-contrib-quality-levels.min.js"></script>-->
|
||||||
|
<!-- <script src="videojs-hls-quality-selector/dist/videojs-hls-quality-selector.min.js"></script>-->
|
||||||
|
|
||||||
|
</head>
|
||||||
|
<body onload="pageReady()">
|
||||||
|
|
||||||
|
<div id="PlayerContainer">
|
||||||
|
<video id="player"
|
||||||
|
class="video-js"
|
||||||
|
controls
|
||||||
|
preload="auto"
|
||||||
|
width="900"
|
||||||
|
height="420"
|
||||||
|
>
|
||||||
|
<p class="vjs-no-js">To view this video please enable JavaScript, and consider upgrading to a web browser that
|
||||||
|
<a href="http://videojs.com/html5-video-support/" target="_blank">supports HTML5 video</a></p>
|
||||||
|
</video>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div id="speakers">
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div id="transcription">
|
||||||
|
<p id="original_transcription"></p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<script src="video.js/dist/video.min.js"></script>
|
||||||
|
|
||||||
|
</body>
|
||||||
|
</html>
|
@ -0,0 +1,34 @@
|
|||||||
|
function pageReady() {
|
||||||
|
|
||||||
|
const params = new URLSearchParams(document.location.search.substring(1));
|
||||||
|
line_id = parseInt(params.get("line"), 10);
|
||||||
|
|
||||||
|
videojs("player", {
|
||||||
|
// src: "test.m3u8",
|
||||||
|
controls: true,
|
||||||
|
autoplay: false,
|
||||||
|
width: 900,
|
||||||
|
height: 420,
|
||||||
|
playbackRates: [0.5, 1, 1.25, 1.5, 2],
|
||||||
|
inactivityTimeout: 0,
|
||||||
|
controlBar: {
|
||||||
|
fullscreenToggle: true,
|
||||||
|
volumePanel: {
|
||||||
|
inline: false,
|
||||||
|
},
|
||||||
|
}
|
||||||
|
},
|
||||||
|
function () {
|
||||||
|
this.src({src: `//localhost:8005/professor/line/${line_id}/playlist.m3u8`});
|
||||||
|
});
|
||||||
|
|
||||||
|
fetch(`//localhost:8005/professor/line/${line_id}`)
|
||||||
|
.then(response => response.json())
|
||||||
|
.then(fillLineInfo)
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
function fillLineInfo(line_json) {
|
||||||
|
document.getElementById("original_transcription").innerText = line_json.line_data.text
|
||||||
|
|
||||||
|
}
|
@ -0,0 +1,6 @@
|
|||||||
|
body {
|
||||||
|
color: aliceblue;
|
||||||
|
background: dimgray;
|
||||||
|
|
||||||
|
max-width: 900px;
|
||||||
|
}
|
Loading…
Reference in New Issue