ghostream/web/template/player.html

52 lines
1.8 KiB
HTML
Raw Normal View History

2020-10-11 08:54:10 +00:00
{{define "player"}}
<div class="container">
<div class="col-video">
<!-- Video -->
2020-10-18 16:25:18 +00:00
<video id="viewer" poster="{{.Cfg.PlayerPoster}}" muted controls autoplay></video>
2020-10-11 08:54:10 +00:00
<!-- Links and settings under video -->
<div class="controls">
<span class="control-quality">
<select id="quality">
<option value="">Source</option>
<option value="@720p">720p</option>
<option value="@480p">480p</option>
<option value="@240p">240p</option>
</select>
</span>
<code class="control-srt-link">srt://{{.Cfg.Hostname}}:{{.Cfg.SRTServerPort}}?streamid={{.Path}}</code>
<span class="control-viewers" id="connected-people">0</span>
<svg class="control-indicator" id="connectionIndicator" fill="#dc3545" width="16" height="16" viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg">
<rect width="4" height="5" x="1" y="10" rx="1"/>
<rect width="4" height="9" x="6" y="6" rx="1"/>
<rect width="4" height="14" x="11" y="1" rx="1"/>
</svg>
{{if .WidgetURL}}<a class="control-chat" id="sideWidgetToggle" href="#" title="Cacher/Afficher le chat">»</a>{{end}}
</div>
</div>
{{if .WidgetURL}}
<!-- Chat -->
<div class="col-chat" id="sideWidget">
<iframe src="{{.WidgetURL}}"
title="Chat" sandbox="allow-scripts allow-forms allow-same-origin"></iframe>
</div>
{{end}}
</div>
2020-10-20 19:45:26 +00:00
<script type="module" src="/static/js/main.js"></script>
2020-10-11 08:54:10 +00:00
<script>
const stunServers = [
{{range $id, $value := .Cfg.STUNServers}}
2020-10-20 19:45:26 +00:00
"{{$value}}",
2020-10-11 08:54:10 +00:00
{{end}}
]
startPeerConnection()
// Wait a bit before pulling viewers counter for the first time
setTimeout(() => {
refreshViewersCounter("{{.Path}}", {{.Cfg.ViewersCounterRefreshPeriod}})
2020-10-11 08:54:10 +00:00
}, 1000)
</script>
2020-10-20 19:45:26 +00:00
{{end}}