'use strict' var app = {} app.status = { currentTime: 0, path: null, subtitles: {} } app.render = function() { var html = '' //html += 'Current Time: ' + app.status.currentTime + '
' // var showNext = 0 var update = false if (app.status.subtitles[app.status.current]) { app.status.subtitles[app.status.current].forEach(function(sub) { if (app.status.currentTime >= sub['in'] && app.status.currentTime < sub.out) { //html += '

' + sub['in'] + ' ' + sub.out + ': ' + sub.value + '' html += '

' + sub.value.replace('\n', '
\n') + '
' showNext = 8 update = true } else if (showNext) { //html += '

' + sub['in'] + ' ' + sub.out + ': ' + sub.value html += '

' + sub.value.replace('\n', '
\n') showNext -= 1 } }) } if (app.status.subtitles[app.status.next]) { if (showNext) { html += '

' + app.status.next.slice(0, 1).toUpperCase() + '' showNext -= 1 } app.status.subtitles[app.status.next].forEach(function(sub) { if (showNext) { //html += '

' + sub['in'] + ' ' + sub.out + ': ' + sub.value html += '

' + sub.value.replace('\n', '
\n') showNext -= 1 } }) } if (update) { document.body.innerHTML = html } } app.connectWS = function() { app.ws = new WebSocket('ws://' + document.location.host + '/ws/') app.ws.onopen = function() { //console.log('open') } app.ws.onerror = function(event) { //console.log('error') ws.close() } app.ws.onclose = function(event) { //console.log('closed') setTimeout(app.connectWS, 1000) } app.ws.onmessage = function(event) { var request try { request = JSON.parse(event.data) } catch(e) { request = { 'error': {}, 'debug': event.data } } //console.log('message', request) app.status.currentTime = request.currentTime if (request.current) { app.status.current = request.current } if (request.next) { app.status.next = request.next } if (request.subtitles) { Object.keys(request.subtitles).forEach(function(name) { app.status.subtitles[name] = request.subtitles[name] }) } app.render() } } app.connectWS() window.addEventListener('load', app.render, false)