+5 -36

package-lock.json

··· 19 19 "@tsparticles/updater-opacity": "3.9.1", 20 20 "@tsparticles/updater-size": "3.9.1", 21 21 "base64url": "3.0.1", 22 22 - "hls.js": "1.6.15", 23 23 - "normalize.scss": "0.1.0", 24 24 - "ovenplayer": "0.10.45" 22 22 + "normalize.scss": "0.1.0" 25 23 }, 26 24 "devDependencies": { 27 25 "@parcel/compressor-brotli": "2.16.1", ··· 1163 1161 "integrity": "sha512-tza8oKYaPopGBwroGJKv7BrTg1lxTycS7SANIizxMB9FxDsAkq4vPny5/KHpFBcW3UTCGBvvNAG1oaVzeWF5Pg==", 1164 1162 "dev": true, 1165 1163 "license": "MIT", 1164 1164 + "peer": true, 1166 1165 "dependencies": { 1167 1166 "@mischnic/json-sourcemap": "^0.1.1", 1168 1167 "@parcel/cache": "2.16.1", ··· 3139 3138 "integrity": "sha512-NZyJarBfL7nWwIq+FDL6Zp/yHEhePMNnnJ0y3qfieCrmNvYct8uvtiV41UvlSe6apAfk0fY1FbWx+NwfmpvtTg==", 3140 3139 "dev": true, 3141 3140 "license": "MIT", 3141 3141 + "peer": true, 3142 3142 "bin": { 3143 3143 "acorn": "bin/acorn" 3144 3144 }, ··· 3396 3396 } 3397 3397 ], 3398 3398 "license": "MIT", 3399 3399 + "peer": true, 3399 3400 "dependencies": { 3400 3401 "caniuse-lite": "^1.0.30001716", 3401 3402 "electron-to-chromium": "^1.5.149", ··· 3809 3810 "@babel/types": "^7.6.1" 3810 3811 } 3811 3812 }, 3812 3812 - "node_modules/core-js": { 3813 3813 - "version": "3.38.0", 3814 3814 - "resolved": "https://registry.npmjs.org/core-js/-/core-js-3.38.0.tgz", 3815 3815 - "integrity": "sha512-XPpwqEodRljce9KswjZShh95qJ1URisBeKCjUdq27YdenkslVe7OO0ZJhlYXAChW7OhXaRLl8AAba7IBfoIHug==", 3816 3816 - "hasInstallScript": true, 3817 3817 - "license": "MIT", 3818 3818 - "funding": { 3819 3819 - "type": "opencollective", 3820 3820 - "url": "https://opencollective.com/core-js" 3821 3821 - } 3822 3822 - }, 3823 3813 "node_modules/cross-spawn": { 3824 3814 "version": "7.0.6", 3825 3815 "resolved": "https://registry.npmjs.org/cross-spawn/-/cross-spawn-7.0.6.tgz", ··· 4137 4127 "integrity": "sha512-BhHmn2yNOFA9H9JmmIVKJmd288g9hrVRDkdoIgRCRuSySRUHH7r/DI6aAXW9T1WwUuY3DFgrcaqB+deURBLR5g==", 4138 4128 "dev": true, 4139 4129 "license": "MIT", 4130 4130 + "peer": true, 4140 4131 "dependencies": { 4141 4132 "@eslint-community/eslint-utils": "^4.8.0", 4142 4133 "@eslint-community/regexpp": "^4.12.1", ··· 4810 4801 "node": ">= 0.4" 4811 4802 } 4812 4803 }, 4813 4813 - "node_modules/hls.js": { 4814 4814 - "version": "1.6.15", 4815 4815 - "resolved": "https://registry.npmjs.org/hls.js/-/hls.js-1.6.15.tgz", 4816 4816 - "integrity": "sha512-E3a5VwgXimGHwpRGV+WxRTKeSp2DW5DI5MWv34ulL3t5UNmyJWCQ1KmLEHbYzcfThfXG8amBL+fCYPneGHC4VA==", 4817 4817 - "license": "Apache-2.0" 4818 4818 - }, 4819 4804 "node_modules/http-cache-semantics": { 4820 4805 "version": "4.1.1", 4821 4806 "resolved": "https://registry.npmjs.org/http-cache-semantics/-/http-cache-semantics-4.1.1.tgz", ··· 6145 6130 "integrity": "sha512-5VyHfHY3cd0iza71JepYG50My+YUbrFtGoUz2ooEydPyPM7Aai/JW098juLr+RG6+rDJuzNNTsEQu2DZa1A41A==", 6146 6131 "dev": true, 6147 6132 "license": "MIT" 6148 6148 - }, 6149 6149 - "node_modules/ovenplayer": { 6150 6150 - "version": "0.10.45", 6151 6151 - "resolved": "https://registry.npmjs.org/ovenplayer/-/ovenplayer-0.10.45.tgz", 6152 6152 - "integrity": "sha512-2zG/KpgGHtYD53vxAR33Zsh13Yvtfc/bh0/LBR4C/K0cF898XUCAIab7aeSa/AR2hHP0ZdkcLhRT4Y1w00LcbA==", 6153 6153 - "license": "MIT", 6154 6154 - "dependencies": { 6155 6155 - "core-js": "^3.16.3", 6156 6156 - "whatwg-fetch": "^3.6.2" 6157 6157 - } 6158 6133 }, 6159 6134 "node_modules/p-limit": { 6160 6135 "version": "3.1.0", ··· 7516 7491 "resolved": "https://registry.npmjs.org/weak-lru-cache/-/weak-lru-cache-1.2.2.tgz", 7517 7492 "integrity": "sha512-DEAoo25RfSYMuTGc9vPJzZcZullwIqRDSI9LOy+fkCJPi6hykCnfKaXTuPBDuXAUcqHXyOgFtHNp/kB2FjYHbw==", 7518 7493 "dev": true, 7519 7519 - "license": "MIT" 7520 7520 - }, 7521 7521 - "node_modules/whatwg-fetch": { 7522 7522 - "version": "3.6.20", 7523 7523 - "resolved": "https://registry.npmjs.org/whatwg-fetch/-/whatwg-fetch-3.6.20.tgz", 7524 7524 - "integrity": "sha512-EqhiFU6daOA8kpjOWTL0olhVOF3i7OrFzSYiGsEMB8GcXS+RrzauAERX65xMeNWVqxA6HXH2m69Z9LaKKdisfg==", 7525 7494 "license": "MIT" 7526 7495 }, 7527 7496 "node_modules/which": {

+2 -5

package.json

··· 3 3 "version": "1.0.0", 4 4 "description": "Personal website of Sefa Eyeoglu", 5 5 "source": [ 6 6 - "./src/index.pug", 7 7 - "./src/stream.pug" 6 6 + "./src/index.pug" 8 7 ], 9 8 "browserslist": [ 10 9 "> 0.5%", ··· 29 28 "@tsparticles/updater-opacity": "3.9.1", 30 29 "@tsparticles/updater-size": "3.9.1", 31 30 "base64url": "3.0.1", 32 32 - "hls.js": "1.6.15", 33 33 - "normalize.scss": "0.1.0", 34 34 - "ovenplayer": "0.10.45" 31 31 + "normalize.scss": "0.1.0" 35 32 }, 36 33 "devDependencies": { 37 34 "@parcel/compressor-brotli": "2.16.1",

-103

src/js/stream.js

··· 1 1 - /*! 2 2 - * Personal website of Sefa Eyeoglu 3 3 - * Copyright (C) 2022 Sefa Eyeoglu <contact@scrumplex.net> 4 4 - * 5 5 - * This program is free software: you can redistribute it and/or modify 6 6 - * it under the terms of the GNU Affero General Public License as published by 7 7 - * the Free Software Foundation, either version 3 of the License, or 8 8 - * (at your option) any later version. 9 9 - * 10 10 - * This program is distributed in the hope that it will be useful, 11 11 - * but WITHOUT ANY WARRANTY; without even the implied warranty of 12 12 - * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the 13 13 - * GNU Affero General Public License for more details. 14 14 - * 15 15 - * You should have received a copy of the GNU Affero General Public License 16 16 - * along with this program. If not, see <https://www.gnu.org/licenses/>. 17 17 - */ 18 18 - 19 19 - import Hls from "hls.js"; 20 20 - 21 21 - window.Hls = Hls; 22 22 - 23 23 - import OvenPlayer from "ovenplayer"; 24 24 - import ready from "./_utils"; 25 25 - import base64url from "base64url"; 26 26 - 27 27 - const streamUrlElem = document.getElementById("stream-url"); 28 28 - const maximizeButtonElem = document.getElementById("maximizeButton"); 29 29 - 30 30 - let refreshTimeout; 31 31 - let player; 32 32 - 33 33 - function isWebSocketURL(string) { 34 34 - let url; 35 35 - try { 36 36 - url = new URL(string); 37 37 - } catch { 38 38 - return false; 39 39 - } 40 40 - 41 41 - return url.protocol === "ws:" || url.protocol === "wss:"; 42 42 - } 43 43 - 44 44 - function playStream(streamId) { 45 45 - const webrtcUrl = new URL(streamId, "wss://live.scrumplex.net"); 46 46 - webrtcUrl.protocol = "wss"; 47 47 - 48 48 - const hlsUrl = new URL( 49 49 - streamId + "/llhls.m3u8", 50 50 - "https://live.scrumplex.net", 51 51 - ); 52 52 - hlsUrl.protocol = "https"; 53 53 - 54 54 - const thumbUrl = new URL( 55 55 - streamId + "/thumb.png", 56 56 - "https://live.scrumplex.net", 57 57 - ); 58 58 - thumbUrl.protocol = "https"; 59 59 - 60 60 - location.replace(`#${base64url.encode(streamId)}`); 61 61 - streamUrlElem.value = streamId; 62 62 - let options = { 63 63 - image: thumbUrl, 64 64 - autoFallback: false, 65 65 - sources: [ 66 66 - { 67 67 - label: "Low Latency WebRTC", 68 68 - type: "webrtc", 69 69 - file: webrtcUrl, 70 70 - }, 71 71 - { 72 72 - label: '"Low Latency" HLS', 73 73 - type: "hls", 74 74 - file: hlsUrl, 75 75 - }, 76 76 - ], 77 77 - }; 78 78 - 79 79 - if (!player) { 80 80 - player = OvenPlayer.create("ovenplayer", options); 81 81 - } else { 82 82 - player.load(options); 83 83 - } 84 84 - } 85 85 - 86 86 - streamUrlElem.addEventListener("keyup", () => { 87 87 - clearTimeout(refreshTimeout); 88 88 - refreshTimeout = setTimeout(() => { 89 89 - playStream(streamUrlElem.value); 90 90 - }, 1000); 91 91 - }); 92 92 - 93 93 - maximizeButtonElem.addEventListener("click", () => { 94 94 - document.body.classList.toggle("theater"); 95 95 - }); 96 96 - 97 97 - ready().then(() => { 98 98 - OvenPlayer.debug(true); 99 99 - const hash = document.location.hash.substring(1); 100 100 - const decoded = base64url.decode(hash); 101 101 - if (isWebSocketURL(decoded)) streamUrlElem.value = decoded; 102 102 - playStream(decoded); 103 103 - });

-31

src/stream.pug

··· 1 1 - include include/link 2 2 - doctype html 3 3 - html(lang="en") 4 4 - head 5 5 - meta(charset="utf-8") 6 6 - title Scrumplex &middot; Livestream 7 7 - link(rel="stylesheet", href="scss/application.scss") 8 8 - include include/head 9 9 - meta(name="page-topic" content="Scrumplex") 10 10 - meta(name="robots" content="noindex") 11 11 - body.scroll 12 12 - include include/noscript 13 13 - 14 14 - div.container.wrapper#wrapper 15 15 - div.sheet.sheet-splash.wavy#main 16 16 - div.row: div.col 17 17 - h1 WebRTC Live Stream Player 18 18 - p. 19 19 - Paste a WebSocket URL below, to watch a livestream. 20 20 - If you want to setup your own live stream, then take a look at #[+link(true, false)(href="https://airensoft.gitbook.io/ovenmediaengine/") OvenMediaEngine]. 21 21 - #[br] 22 22 - If you want to share your stream with others, then just share the URL of this page. 23 23 - 24 24 - div.row: div.col.flex.flex-align-center 25 25 - label(for="stream-url") Stream URL 26 26 - input.flex-grow(type="url", id="stream-url", name="stream-url") 27 27 - div.row: div.col 28 28 - div#ovenplayer 29 29 - button.btn.btn-primary#maximizeButton Toggle Theater Mode 30 30 - 31 31 - script(type="module", src="js/stream.js")