100 lines
3.3 KiB
HTML
100 lines
3.3 KiB
HTML
{{define "index.html"}}
|
|
<!DOCTYPE html>
|
|
<html>
|
|
<head>
|
|
<title>{{.ApplicationName}}</title>
|
|
<style>
|
|
body {
|
|
background-color: black;
|
|
}
|
|
.error {
|
|
color: red;
|
|
}
|
|
.player-container .player {
|
|
object-fit: cover;
|
|
width: 100vw;
|
|
height: 100vh;
|
|
position: fixed;
|
|
top: 0;
|
|
left: 0;
|
|
}
|
|
</style>
|
|
<script type="text/javascript">
|
|
var player
|
|
var generation = 0
|
|
var current_track = -1
|
|
var total_tracks = -1
|
|
var track_list = []
|
|
var last_known_time = -1
|
|
options = {
|
|
timeout: 5000
|
|
}
|
|
function load() {
|
|
fetch("video/index.json", {timeout: 5000})
|
|
.then(response => response.json())
|
|
.then(data => {
|
|
if (!data.success) {
|
|
console.log("failed to fetch index.json")
|
|
return false
|
|
}
|
|
if (typeof data.generation =="number") {
|
|
if (generation == 0) {
|
|
generation = data.generation
|
|
}
|
|
if (data.generation > generation) {
|
|
location.reload()
|
|
}
|
|
}
|
|
total_tracks = data.count
|
|
track_list = data.videos
|
|
if (current_track == -1) {
|
|
current_track = 0
|
|
player.src = "video/" + track_list[current_track].name
|
|
}
|
|
})
|
|
return true
|
|
}
|
|
function videoEnd(){
|
|
if (total_tracks == -1) {
|
|
return
|
|
}
|
|
if (player.ended) {
|
|
nextVideo()
|
|
}
|
|
|
|
}
|
|
function nextVideo(){
|
|
current_track++
|
|
if (current_track > total_tracks-1) {
|
|
current_track = 0
|
|
}
|
|
player.src = "video/" + track_list[current_track].name
|
|
}
|
|
function checkStall(){
|
|
if (last_known_time == -1) {
|
|
last_known_time = player.currentTime
|
|
return
|
|
}
|
|
if (last_known_time == player.currentTime) {
|
|
nextVideo()
|
|
}
|
|
}
|
|
window.onload = function() {
|
|
player = document.getElementById("player")
|
|
player.autoplay = true
|
|
player.controls = true
|
|
load()
|
|
setInterval(videoEnd, 1000)
|
|
setInterval(load, 60000)
|
|
setInterval(checkStall, 30000)
|
|
}
|
|
</script>
|
|
</head>
|
|
<body>
|
|
<noscript><h1 class="error">JavaScript is required for this page but not available</h1></noscript>
|
|
<div id="player-container" class="player-container">
|
|
<video id="player" class="player"></video>
|
|
</div>
|
|
</body>
|
|
</html>
|
|
{{end}} |