45 lines
1.8 KiB
HTML
45 lines
1.8 KiB
HTML
{% extends 'base.html' %}
|
|
{% block content %}
|
|
<div class="page-head">
|
|
<h1>Streamer-panel — {{ stream.name }}</h1>
|
|
<span class="badge {{ 'live' if stream.is_live else 'off' }}">{{ 'LIVE' if stream.is_live else 'OFFLINE' }}</span>
|
|
</div>
|
|
<div class="grid streamer-layout">
|
|
<div class="card">
|
|
<h2>Server preview</h2>
|
|
<video id="preview" class="video" controls autoplay muted playsinline></video>
|
|
<div class="stats-grid">
|
|
<div><strong>Video</strong><br>{{ stats.video_codec or '-' }}</div>
|
|
<div><strong>Opløsning</strong><br>{{ stats.width or '-' }}x{{ stats.height or '-' }}</div>
|
|
<div><strong>FPS</strong><br>{{ stats.fps or '-' }}</div>
|
|
<div><strong>Bitrate</strong><br>{% if stats.bitrate %}{{ (stats.bitrate/1000)|round(1) }} kbps{% else %}-{% endif %}</div>
|
|
<div><strong>Lyd</strong><br>{{ stats.audio_codec or '-' }}</div>
|
|
<div><strong>Kanaler</strong><br>{% if stats.audio_channels == 1 %}<span class="warn">MONO ⚠️</span>{% elif stats.audio_channels %}{{ stats.audio_channels }} ch{% else %}-{% endif %}</div>
|
|
</div>
|
|
<div class="codebox">
|
|
<div><strong>RTMP URL</strong><br><code>{{ ingest }}</code></div>
|
|
<div><strong>HLS preview</strong><br><code>{{ public_hls }}</code></div>
|
|
</div>
|
|
</div>
|
|
<div class="card">
|
|
<h2>Chat</h2>
|
|
{% if stream.chat_url %}
|
|
<iframe class="chatframe tall" src="{{ stream.chat_url }}"></iframe>
|
|
{% else %}
|
|
<p>Ingen chat sat op.</p>
|
|
{% endif %}
|
|
</div>
|
|
</div>
|
|
<script>
|
|
const video = document.getElementById('preview');
|
|
const src = {{ public_hls|tojson }};
|
|
if (Hls.isSupported()) {
|
|
const hls = new Hls({ lowLatencyMode: true, backBufferLength: 90 });
|
|
hls.loadSource(src);
|
|
hls.attachMedia(video);
|
|
} else if (video.canPlayType('application/vnd.apple.mpegurl')) {
|
|
video.src = src;
|
|
}
|
|
</script>
|
|
{% endblock %}
|