Monorepo for Aesthetic.Computer
aesthetic.computer
1<!DOCTYPE html>
2<html>
3<head>
4 <meta charset="UTF-8" />
5 <title>HLS Stream</title>
6 <style>
7 html, body {
8 margin: 0;
9 padding: 0;
10 overflow: hidden;
11 background: black;
12 height: 100%;
13 width: 100%;
14 }
15 video {
16 width: 100%;
17 height: 100%;
18 object-fit: contain;
19 display: block;
20 }
21 </style>
22</head>
23<body>
24 <video id="video" controls autoplay muted></video>
25 <script src="https://cdn.jsdelivr.net/npm/hls.js@latest"></script>
26 <script>
27 const video = document.getElementById('video');
28 const src = '/hls/stream.m3u8';
29
30 if (Hls.isSupported()) {
31 const hls = new Hls();
32 hls.loadSource(src);
33 hls.attachMedia(video);
34 } else if (video.canPlayType('application/vnd.apple.mpegurl')) {
35 video.src = src;
36 }
37 </script>
38</body>
39</html>