creations/srsViewer
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

first commit
Some checks failed
Code quality checks / biome (push) Failing after 13s
Details

Browse source
This commit is contained in:
creations 2025-06-08 17:17:18 -04:00
commit ae3224c18b
Signed by: creations
GPG key ID: 8F553AA4320FC711
30 changed files with 2455 additions and 0 deletions
Download patch file Download diff file Expand all files Collapse all files

129
public/watch.html Normal file
View file

@ -0,0 +1,129 @@
<!DOCTYPE html>
<html lang="en" data-theme="dark">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Watch Stream</title>
<script src="/public/js/flv.min.js"></script>
<script type="module" src="/public/js/watch.js" defer></script>
<link rel="stylesheet" href="/public/css/style.css">
<link rel="stylesheet" href="/public/css/watch.css">
<meta name="color-scheme" content="dark">
</head>
<body>
<div class="watch-container">
<header class="watch-header">
<div class="header-content">
<a href="/" class="back-btn">
<svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
<path d="m15 18-6-6 6-6" />
</svg>
Back to Dashboard
</a>
<h1 id="streamTitle">Loading Stream...</h1>
</div>
</header>
<div class="video-container">
<div id="loadingState" class="loading-overlay">
<div class="spinner"></div>
<p>Loading stream...</p>
</div>
<div id="errorState" class="error-overlay" style="display: none;">
<div class="error-content">
<svg width="48" height="48" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
<circle cx="12" cy="12" r="10"></circle>
<line x1="15" y1="9" x2="9" y2="15"></line>
<line x1="9" y1="9" x2="15" y2="15"></line>
</svg>
<h3>Stream Unavailable</h3>
<p id="errorMessage">The stream is currently offline or unavailable.</p>
<button id="retryBtn" class="retry-btn">Try Again</button>
</div>
</div>
<video id="videoPlayer" class="video-player" controls autoplay muted style="display: none;">
Your browser does not support the video tag.
</video>
</div>
<div class="stream-status-container">
<div class="stream-stats" id="streamStats" style="display: none;">
<div class="stat">
<span class="stat-label">Viewers</span>
<span class="stat-value" id="viewerCount">0</span>
</div>
<div class="stat">
<span class="stat-label">Bitrate</span>
<span class="stat-value" id="bitrate">0 kbps</span>
</div>
<div class="stat">
<span class="stat-label">Quality</span>
<span class="stat-value" id="quality">Unknown</span>
</div>
</div>
</div>
<div class="stream-info-panel">
<div class="info-section">
<h3>Stream Information</h3>
<div class="info-grid">
<div class="info-item">
<span class="info-label">Stream ID:</span>
<span class="info-value" id="streamId">-</span>
</div>
<div class="info-item">
<span class="info-label">Application:</span>
<span class="info-value" id="streamApp">-</span>
</div>
<div class="info-item">
<span class="info-label">Duration:</span>
<span class="info-value" id="streamDuration">-</span>
</div>
<div class="info-item">
<span class="info-label">Video Codec:</span>
<span class="info-value" id="videoCodec">-</span>
</div>
<div class="info-item">
<span class="info-label">Audio Codec:</span>
<span class="info-value" id="audioCodec">-</span>
</div>
<div class="info-item">
<span class="info-label">Resolution:</span>
<span class="info-value" id="resolution">-</span>
</div>
</div>
</div>
<div class="info-section">
<h3>Stream URLs</h3>
<div class="url-list">
<div class="url-item">
<span class="url-label">RTMP:</span>
<div class="url-value" id="rtmpUrl" title="Click to copy">-</div>
</div>
<div class="url-item">
<span class="url-label">HLS:</span>
<div class="url-value" id="hlsUrl" title="Click to copy">-</div>
</div>
<div class="url-item">
<span class="url-label">HTTP-FLV:</span>
<div class="url-value" id="flvUrl" title="Click to copy">-</div>
</div>
<div class="url-item">
<span class="url-label">WebRTC:</span>
<div class="url-value" id="webrtcUrl" title="Click to copy">-</div>
</div>
</div>
</div>
</div>
</div>
</body>
</html>