callback functions and sub display

main
km0 2 years ago
parent 38c588aea2
commit f3a38e8260

Binary file not shown.

@ -16,10 +16,10 @@
<li>if there is a call back (define syntax) call the callback</li>
</ul>
<div id="sub">Hello</div>
<audio src="jeetee.mp3" id="player" controls>
</body>
</html>

@ -1,11 +1,34 @@
// 1. Import dependencies, select DOM elements, define global var
import srtParser2 from 'https://cdn.skypack.dev/srt-parser-2';
const player = document.querySelector('#player')
const sub = document.querySelector('#sub')
const srtFunctions = {
1: () => testFunction(),
2: () => testFunction(),
3: () => test2()
}
const printText = (text) => {
sub.innerHTML = text
}
const testFunction = () => {
console.log('test function eheh')
}
const test2 = () => {
console.log('test 2')
}
// 3. Parse .srt file and setup audio player callback
const readSRT = (srt) => {
let parser = new srtParser2();
let srt_array = parser.fromSrt(srt)
console.log(srt_array)
let currentId = 0
player.addEventListener('timeupdate', (e)=>{
let current = srt_array.find(
@ -15,10 +38,13 @@ const readSRT = (srt) => {
)
if (current != undefined && currentId != parseInt(current.id)){
currentId = parseInt(current.id)
console.log(current.text)
printText(current.text)
if(srtFunctions.hasOwnProperty(current.id))
srtFunctions[current.id]()
}
})
}
// 2. Open .srt file and trigger readSRT() function
fetch('jeetee.srt').then(res=>res.text()).then(data=>readSRT(data))

Loading…
Cancel
Save