mirror of
https://github.com/owncast/owncast.git
synced 2024-10-10 19:16:02 +00:00
WIP player debug/test page. #1408
This commit is contained in:
parent
0319651fe8
commit
fc5b69c031
@ -35,7 +35,7 @@ type MetadataPage struct {
|
||||
// IndexHandler handles the default index route.
|
||||
func IndexHandler(w http.ResponseWriter, r *http.Request) {
|
||||
middleware.EnableCors(w)
|
||||
isIndexRequest := r.URL.Path == "/" || filepath.Base(r.URL.Path) == "index.html" || filepath.Base(r.URL.Path) == ""
|
||||
isIndexRequest := r.URL.Path == "/" || r.URL.Path == "/test/" || filepath.Base(r.URL.Path) == "index.html" || filepath.Base(r.URL.Path) == ""
|
||||
|
||||
// For search engine bots and social scrapers return a special
|
||||
// server-rendered page.
|
||||
@ -65,8 +65,10 @@ func IndexHandler(w http.ResponseWriter, r *http.Request) {
|
||||
// Set a cache control max-age header
|
||||
middleware.SetCachingHeaders(w, r)
|
||||
|
||||
// Set our global HTTP headers
|
||||
// Set our global HTTP headers except on our test page
|
||||
if r.URL.Path != "/test/" {
|
||||
middleware.SetHeaders(w)
|
||||
}
|
||||
|
||||
http.ServeFile(w, r, path.Join(config.WebRoot, r.URL.Path))
|
||||
}
|
||||
|
||||
@ -7,4 +7,5 @@ import (
|
||||
// EnableCors enables the CORS header on the responses.
|
||||
func EnableCors(w http.ResponseWriter) {
|
||||
w.Header().Set("Access-Control-Allow-Origin", "*")
|
||||
w.Header().Set("Access-Control-Allow-Headers", "Range")
|
||||
}
|
||||
|
||||
1000
webroot/test/README.md
Normal file
1000
webroot/test/README.md
Normal file
File diff suppressed because it is too large
Load Diff
322
webroot/test/index.html
Normal file
322
webroot/test/index.html
Normal file
@ -0,0 +1,322 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
|
||||
<head>
|
||||
<meta charset="utf-8" />
|
||||
<title>Owncast Player Test</title>
|
||||
<link rel="icon" href="/logo" />
|
||||
<!-- <link href="node_modules/bootstrap/dist/css/bootstrap.css" rel="stylesheet" /> -->
|
||||
<link href="/js/web_modules/tailwindcss/dist/tailwind.min.css" rel="stylesheet" />
|
||||
<link href="/js/web_modules/videojs/video-js.min.css" rel="stylesheet" />
|
||||
<style>
|
||||
.form-check {
|
||||
background-color: hsl(0, 0%, 90%);
|
||||
margin-block: 0.5rem;
|
||||
padding: 0.25em 0.25em 0.25em 1.75em;
|
||||
width: 700px;
|
||||
width: fit-content;
|
||||
}
|
||||
|
||||
#player-fixture {
|
||||
min-height: 250px;
|
||||
}
|
||||
|
||||
#segment-metadata {
|
||||
list-style: none;
|
||||
}
|
||||
|
||||
#segment-metadata pre {
|
||||
overflow: scroll;
|
||||
}
|
||||
</style>
|
||||
<script type="text/javascript" src="https://cdn.jsdelivr.net/npm/clappr@latest/dist/clappr.min.js"></script>
|
||||
<script src="https://cdn.jsdelivr.net/npm/shaka-player@3.2.0/dist/shaka-player.compiled.min.js"></script>
|
||||
<script src="https://cdn.jsdelivr.net/npm/mux.js@5.13.0/dist/mux.min.js"></script>
|
||||
<script defer src="https://vjs.zencdn.net/7.15.4/video.min.js"></script>
|
||||
<script defer src="https://cdn.jsdelivr.net/npm/@videojs/http-streaming@2.10.3/dist/videojs-http-streaming.min.js"></script>
|
||||
</head>
|
||||
|
||||
<body class="m-4">
|
||||
<script>
|
||||
// if we're on IE, load up the load index page
|
||||
var result = /MSIE\s(\d+)\.\d/.exec(navigator.userAgent);
|
||||
var version = result && parseFloat(result[1]);
|
||||
|
||||
if (
|
||||
!version &&
|
||||
/Trident\/7.0/i.test(navigator.userAgent) &&
|
||||
/rv:11.0/.test(navigator.userAgent)
|
||||
) {
|
||||
// IE 11 has a different user agent string than other IE versions
|
||||
version = 11.0;
|
||||
}
|
||||
|
||||
if (version) {
|
||||
window.location.href = './old-index.html';
|
||||
}
|
||||
</script>
|
||||
|
||||
<nav class="flex items-center justify-between flex-wrap bg-purple-700 p-6">
|
||||
<div class="flex items-center flex-shrink-0 text-white mr-6">
|
||||
<img class="fill-current h-8 w-8 mr-2" width="54" height="54" src="/logo">
|
||||
<span class="font-semibold text-xl tracking-tight">Owncast Player Test</span>
|
||||
</div>
|
||||
<div class="block lg:hidden">
|
||||
<button
|
||||
class="flex items-center px-3 py-2 border rounded text-teal-200 border-teal-400 hover:text-white hover:border-white">
|
||||
<svg class="fill-current h-3 w-3" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg">
|
||||
<title>Menu</title>
|
||||
<path d="M0 3h20v2H0V3zm0 6h20v2H0V9zm0 6h20v2H0v-2z" />
|
||||
</svg>
|
||||
</button>
|
||||
</div>
|
||||
<div class="w-full block flex-grow lg:flex lg:items-center lg:w-auto">
|
||||
<div class="text-sm lg:flex-grow">
|
||||
<a href="https://owncast.onlline/docs"
|
||||
class="block mt-4 lg:inline-block lg:mt-0 text-teal-200 hover:text-white mr-4">
|
||||
Docs
|
||||
</a>
|
||||
</div>
|
||||
<div id="clock">
|
||||
</div>
|
||||
|
||||
<div>
|
||||
Displayed segment latency: <span id="displayedSegmentLatency"></span>s
|
||||
<div>
|
||||
</nav>
|
||||
|
||||
<div class="flex flex-wrap -mx-1 overflow-hidden">
|
||||
<div class="my-1 px-1 w-1/3 overflow-hidden">
|
||||
<div id="player-fixture" style="aspect-ratio: 16/9; min-height: initial;"></div>
|
||||
VideoJS (VHS)
|
||||
</div>
|
||||
|
||||
<div class="my-1 px-1 w-1/3 overflow-hidden">
|
||||
<video id="shaka-player" muted autoplay poster="//shaka-player-demo.appspot.com/assets/poster.jpg"
|
||||
controls></video>
|
||||
Shaka (mux.js)
|
||||
</div>
|
||||
|
||||
<div class="my-1 px-1 w-1/3 overflow-hidden">
|
||||
<div id="clappr-player" style="width: 100%; height: 90%;"></div>
|
||||
<script>
|
||||
window.clapprPlayer = new Clappr.Player({
|
||||
source: window.currentSrc,
|
||||
parentId: '#clappr-player',
|
||||
mute: true,
|
||||
autoPlay: true,
|
||||
width: '100%',
|
||||
height: '100%'
|
||||
});
|
||||
</script>
|
||||
Clappr Player (hls.js)
|
||||
</div>
|
||||
|
||||
<div class="my-1 px-1 w-1/3 overflow-hidden">
|
||||
<video id="native-player" muted autoplay controls></video>
|
||||
Native HTML5 (Safari/iOS/Mac only)
|
||||
</div>
|
||||
|
||||
<div class="my-1 px-1 w-1/3 overflow-hidden">
|
||||
<!-- Column Content -->
|
||||
</div>
|
||||
|
||||
<div class="my-1 px-1 w-1/3 overflow-hidden">
|
||||
<!-- Column Content -->
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<div class="flex flex-wrap -mx-1 overflow-hidden">
|
||||
<div class="my-1 px-1 w-1/3 overflow-hidden">
|
||||
<div class="input-group mb-2">
|
||||
<span class="input-group-text"><label for="load-source">Test streams</label></span>
|
||||
<select id="load-source" class="form-select">
|
||||
<optgroup label="hls"></optgroup>
|
||||
<optgroup label="live"></optgroup>
|
||||
</select>
|
||||
</div>
|
||||
|
||||
<label for="url" class="form-label">Source URL</label>
|
||||
<div class="input-group">
|
||||
<span class="input-group-text"><label for="url">Url</label></span>
|
||||
<input id="url" type="url" class="form-control" />
|
||||
</div>
|
||||
|
||||
<label for="type" class="form-label">Source Type</label>
|
||||
<div class="input-group">
|
||||
<span class="input-group-text"><label for="type">Type</label></span>
|
||||
<input id="type" type="text" class="form-control" />
|
||||
</div>
|
||||
|
||||
<select id="representations" class="form-select"></select>
|
||||
|
||||
<button id="load-url" type="button" class="btn btn-primary my-2">
|
||||
Load
|
||||
</button>
|
||||
</div>
|
||||
<div class="my-1 px-1 w-1/3 overflow-hidden">
|
||||
Current Segment
|
||||
<ul id="segment-metadata" class="col-8"></ul>
|
||||
</div>
|
||||
<div class="my-1 px-1 w-1/3 overflow-hidden">
|
||||
<div class="player-stats">
|
||||
<dl>
|
||||
<dt>Current Time:</dt>
|
||||
<dd class="current-time-stat">0</dd>
|
||||
<dt>Buffered:</dt>
|
||||
<dd class="buffered-stat">-</dd>
|
||||
<dt>Video Buffered:</dt>
|
||||
<dd class="video-buffered-stat">-</dd>
|
||||
<dt>Audio Buffered:</dt>
|
||||
<dd class="audio-buffered-stat">-</dd>
|
||||
<dt>Seekable:</dt>
|
||||
<dd>
|
||||
<span class="seekable-start-stat">-</span> -
|
||||
<span class="seekable-end-stat">-</span>
|
||||
</dd>
|
||||
<dt>Video Bitrate:</dt>
|
||||
<dd class="video-bitrate-stat">0 kbps</dd>
|
||||
<dt>Measured Bitrate:</dt>
|
||||
<dd class="measured-bitrate-stat">0 kbps</dd>
|
||||
<dt>Video Timestamp Offset</dt>
|
||||
<dd class="video-timestampoffset">0</dd>
|
||||
<dt>Audio Timestamp Offset</dt>
|
||||
<dd class="audio-timestampoffset">0</dd>
|
||||
</dl>
|
||||
</div>
|
||||
</div>
|
||||
<div class="my-1 px-1 w-1/3 overflow-hidden">
|
||||
|
||||
<div class="options">
|
||||
<div class="form-check">
|
||||
<input id="minified" type="checkbox" class="form-check-input" />
|
||||
<label class="form-check-label" for="minified">Minified VHS (reloads player)</label>
|
||||
</div>
|
||||
|
||||
<div class="form-check">
|
||||
<input id="sync-workers" type="checkbox" class="form-check-input" />
|
||||
<label class="form-check-label" for="sync-workers">Synchronous Web Workers (reloads
|
||||
player)</label>
|
||||
</div>
|
||||
|
||||
<div class="form-check">
|
||||
<input id="liveui" type="checkbox" class="form-check-input" checked />
|
||||
<label class="form-check-label" for="liveui">Enable the live UI (reloads player)</label>
|
||||
</div>
|
||||
|
||||
<div class="form-check">
|
||||
<input id="fluid" type="checkbox" class="form-check-input" />
|
||||
<label class="form-check-label" for="fluid">Fluid mode</label>
|
||||
</div>
|
||||
|
||||
<div class="form-check">
|
||||
<input id="debug" type="checkbox" class="form-check-input" />
|
||||
<label class="form-check-label" for="debug">Debug Logging</label>
|
||||
</div>
|
||||
|
||||
<div class="form-check">
|
||||
<input id="muted" type="checkbox" class="form-check-input" />
|
||||
<label class="form-check-label" for="muted">Muted</label>
|
||||
</div>
|
||||
|
||||
<div class="form-check">
|
||||
<input id="autoplay" type="checkbox" class="form-check-input" />
|
||||
<label class="form-check-label" for="autoplay">Autoplay</label>
|
||||
</div>
|
||||
|
||||
<div class="form-check">
|
||||
<input id="llhls" type="checkbox" class="form-check-input" />
|
||||
<label class="form-check-label" for="llhls">[EXPERIMENTAL] Enables support for ll-hls (reloads
|
||||
player)</label>
|
||||
</div>
|
||||
|
||||
<div class="form-check">
|
||||
<input id="buffer-water" type="checkbox" class="form-check-input" />
|
||||
<label class="form-check-label" for="buffer-water">[EXPERIMENTAL] Use Buffer Level for ABR
|
||||
(reloads
|
||||
player)</label>
|
||||
</div>
|
||||
|
||||
<div class="form-check">
|
||||
<input id="exact-manifest-timings" type="checkbox" class="form-check-input" />
|
||||
<label class="form-check-label" for="exact-manifest-timings">[EXPERIMENTAL] Use exact manifest
|
||||
timings for segment choices
|
||||
(reloads player)</label>
|
||||
</div>
|
||||
|
||||
<div class="form-check">
|
||||
<input id="pixel-diff-selector" type="checkbox" class="form-check-input" />
|
||||
<label class="form-check-label" for="pixel-diff-selector">[EXPERIMENTAL] Use the Pixel
|
||||
difference
|
||||
resolution selector
|
||||
(reloads player)</label>
|
||||
</div>
|
||||
|
||||
<div class="form-check">
|
||||
<input id="override-native" type="checkbox" class="form-check-input" checked />
|
||||
<label class="form-check-label" for="override-native">Override Native (reloads player)</label>
|
||||
</div>
|
||||
|
||||
<div class="form-check">
|
||||
<input id="mirror-source" type="checkbox" class="form-check-input" checked />
|
||||
<label class="form-check-label" for="mirror-source">Mirror sources from player.src (reloads
|
||||
player,
|
||||
uses EXPERIMENTAL
|
||||
sourceset option)</label>
|
||||
</div>
|
||||
|
||||
<div class="input-group">
|
||||
<span class="input-group-text"><label for="preload">Preload (reloads player)</label></span>
|
||||
<select id="preload" class="form-select">
|
||||
<option selected>auto</option>
|
||||
<option>none</option>
|
||||
<option>metadata</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script src="scripts/index.js"></script>
|
||||
<script>
|
||||
window.startDemo(function (player) {
|
||||
// do something with setup player
|
||||
});
|
||||
</script>
|
||||
<script>
|
||||
async function setupShaka() {
|
||||
shaka.polyfill.installAll();
|
||||
const video = document.getElementById('shaka-player');
|
||||
const player = new shaka.Player(video);
|
||||
player.configure('manifest.defaultPresentationDelay', 6.0 /* seconds */);
|
||||
player.configure('streaming.rebufferingGoal', 5.0 /* seconds */);
|
||||
|
||||
window.shaka = player;
|
||||
try {
|
||||
await player.load(window.currentSrc);
|
||||
} catch (e) {
|
||||
// onError is executed if the asynchronous load fails.
|
||||
console.error(e);
|
||||
}
|
||||
}
|
||||
|
||||
setupShaka();
|
||||
</script>
|
||||
|
||||
<script type="text/javascript">
|
||||
function setupclock() {
|
||||
var refresh = 1000; // Refresh rate in milli seconds
|
||||
mytime = setTimeout('displayclock()', refresh)
|
||||
}
|
||||
|
||||
function displayclock() {
|
||||
var x = new Date().toLocaleTimeString();
|
||||
document.getElementById('clock').innerHTML = x;
|
||||
setupclock();
|
||||
}
|
||||
setupclock();
|
||||
</script>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
150
webroot/test/old-index.html
Normal file
150
webroot/test/old-index.html
Normal file
@ -0,0 +1,150 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>videojs-http-streaming Demo</title>
|
||||
<link rel="icon" href="logo.svg">
|
||||
<link href="node_modules/video.js/dist/video-js.css" rel="stylesheet">
|
||||
<link href="node_modules/videojs-http-source-selector/dist/videojs-http-source-selector.css" rel="stylesheet">
|
||||
<style>
|
||||
body {
|
||||
font-family: Arial, sans-serif;
|
||||
margin: 20px;
|
||||
}
|
||||
.info {
|
||||
background-color: #eee;
|
||||
border: thin solid #333;
|
||||
border-radius: 3px;
|
||||
padding: 0 5px;
|
||||
margin: 20px 0;
|
||||
}
|
||||
label {
|
||||
display: block;
|
||||
width: 700px;
|
||||
width: fit-content;
|
||||
margin-top: 4px;
|
||||
}
|
||||
.options label {
|
||||
background-color: hsl(0, 0%, 90%);
|
||||
padding: 0.25em;
|
||||
margin: 0.25em;
|
||||
}
|
||||
input[type=url], select {
|
||||
min-width: 600px;
|
||||
}
|
||||
#preload {
|
||||
min-width: auto;
|
||||
}
|
||||
h3 {
|
||||
margin-bottom: 5px;
|
||||
}
|
||||
#keysystems {
|
||||
display: block;
|
||||
}
|
||||
</style>
|
||||
|
||||
</head>
|
||||
<body>
|
||||
<div id="player-fixture">
|
||||
</div>
|
||||
<label>Representations</label>
|
||||
<select id='representations'></select>
|
||||
<h3>Options</h3>
|
||||
|
||||
<div class="options">
|
||||
<label>
|
||||
<input id=minified type="checkbox">
|
||||
Minified VHS (reloads player)
|
||||
</label>
|
||||
<label>
|
||||
<input id=sync-workers type="checkbox">
|
||||
Synchronous Web Workers (reloads player)
|
||||
</label>
|
||||
<label>
|
||||
<input id=liveui type="checkbox">
|
||||
Enable the live UI (reloads player)
|
||||
</label>
|
||||
<label>
|
||||
<input id=debug type="checkbox">
|
||||
Debug Logging
|
||||
</label>
|
||||
<label>
|
||||
<input id=muted type="checkbox">
|
||||
Muted
|
||||
</label>
|
||||
<label>
|
||||
<input id=autoplay type="checkbox">
|
||||
Autoplay
|
||||
</label>
|
||||
<label>
|
||||
<input id=llhls type="checkbox">
|
||||
[EXPERIMENTAL] Enables support for ll-hls (reloads player)
|
||||
</label>
|
||||
<label>
|
||||
<input id=buffer-water type="checkbox">
|
||||
[EXPERIMENTAL] Use Buffer Level for ABR (reloads player)
|
||||
</label>
|
||||
<label>
|
||||
<input id=exact-manifest-timings type="checkbox">
|
||||
[EXPERIMENTAL] Use exact manifest timings for segment choices (reloads player)
|
||||
</label>
|
||||
<label>
|
||||
<input id=pixel-diff-selector type="checkbox">
|
||||
[EXPERIMENTAL] Use the Pixel difference resolution selector (reloads player)
|
||||
</label>
|
||||
<label>
|
||||
<input id=override-native type="checkbox" checked>
|
||||
Override Native (reloads player)
|
||||
</label>
|
||||
<label>
|
||||
<input id=mirror-source type="checkbox" checked>
|
||||
Mirror sources from player.src (reloads player, uses EXPERIMENTAL sourceset option)
|
||||
</label>
|
||||
<label>
|
||||
Preload (reloads player)
|
||||
<select id=preload>
|
||||
<option selected>auto</option>
|
||||
<option>none</option>
|
||||
<option>metadata</option>
|
||||
</select>
|
||||
</label>
|
||||
</div>
|
||||
|
||||
<h3>Load a URL</h3>
|
||||
<label>Url:</label>
|
||||
<input id=url type=url>
|
||||
<label>Type: (uses url extension if blank, usually application/x-mpegURL or application/dash+xml)</label>
|
||||
<input id=type type=text>
|
||||
<label>Optional Keystems JSON:</label>
|
||||
<textarea id=keysystems cols=100 rows=5></textarea>
|
||||
<button id=load-url type=button>Load</button>
|
||||
<h3>Load a Source</h3>
|
||||
<select id=load-source>
|
||||
<optgroup label="hls">
|
||||
</optgroup>
|
||||
<optgroup label="dash">
|
||||
</optgroup>
|
||||
<optgroup label="drm">
|
||||
</optgroup>
|
||||
<optgroup label="live">
|
||||
</optgroup>
|
||||
<optgroup label="low latency live">
|
||||
</optgroup>
|
||||
<optgroup label="json manifest object">
|
||||
</optgroup>
|
||||
</select>
|
||||
<h3>Navigation</h3>
|
||||
<ul>
|
||||
<li><a href="test/debug.html">Run unit tests in browser.</a></li>
|
||||
<li><a href="docs/api/">Read generated docs.</a></li>
|
||||
<li><a href="utils/stats/">Stats</a></li>
|
||||
</ul>
|
||||
|
||||
<script src="scripts/old-index.js"></script>
|
||||
<script>
|
||||
window.startDemo(function(player) {
|
||||
// do something with setup player
|
||||
});
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
3553
webroot/test/scripts/dash-manifest-object.json
Normal file
3553
webroot/test/scripts/dash-manifest-object.json
Normal file
File diff suppressed because it is too large
Load Diff
380
webroot/test/scripts/hls-manifest-object.json
Normal file
380
webroot/test/scripts/hls-manifest-object.json
Normal file
@ -0,0 +1,380 @@
|
||||
{
|
||||
"mediaGroups": {
|
||||
"AUDIO": {
|
||||
"audio": {
|
||||
"default": {
|
||||
"autoselect": true,
|
||||
"default": true,
|
||||
"language": "",
|
||||
"uri": "combined-audio-playlists",
|
||||
"playlists": [
|
||||
{
|
||||
"attributes": {},
|
||||
"segments": [
|
||||
{
|
||||
"duration": 4.011,
|
||||
"uri": "a-eng-0128k-aac-2c-s1.mp4",
|
||||
"timeline": 0,
|
||||
"map": {
|
||||
"uri": "a-eng-0128k-aac-2c-init.mp4",
|
||||
"resolvedUri": "https://storage.googleapis.com/shaka-demo-assets/angel-one-hls/a-eng-0128k-aac-2c-init.mp4"
|
||||
},
|
||||
"resolvedUri": "https://storage.googleapis.com/shaka-demo-assets/angel-one-hls/a-eng-0128k-aac-2c-s1.mp4",
|
||||
"number": 0
|
||||
},
|
||||
{
|
||||
"duration": 3.989,
|
||||
"uri": "a-eng-0128k-aac-2c-s2.mp4",
|
||||
"timeline": 0,
|
||||
"map": {
|
||||
"uri": "a-eng-0128k-aac-2c-init.mp4",
|
||||
"resolvedUri": "https://storage.googleapis.com/shaka-demo-assets/angel-one-hls/a-eng-0128k-aac-2c-init.mp4"
|
||||
},
|
||||
"resolvedUri": "https://storage.googleapis.com/shaka-demo-assets/angel-one-hls/a-eng-0128k-aac-2c-s2.mp4",
|
||||
"number": 1
|
||||
},
|
||||
{
|
||||
"duration": 4.011,
|
||||
"uri": "a-eng-0128k-aac-2c-s3.mp4",
|
||||
"timeline": 0,
|
||||
"map": {
|
||||
"uri": "a-eng-0128k-aac-2c-init.mp4",
|
||||
"resolvedUri": "https://storage.googleapis.com/shaka-demo-assets/angel-one-hls/a-eng-0128k-aac-2c-init.mp4"
|
||||
},
|
||||
"resolvedUri": "https://storage.googleapis.com/shaka-demo-assets/angel-one-hls/a-eng-0128k-aac-2c-s3.mp4",
|
||||
"number": 2
|
||||
},
|
||||
{
|
||||
"duration": 3.989,
|
||||
"uri": "a-eng-0128k-aac-2c-s4.mp4",
|
||||
"timeline": 0,
|
||||
"map": {
|
||||
"uri": "a-eng-0128k-aac-2c-init.mp4",
|
||||
"resolvedUri": "https://storage.googleapis.com/shaka-demo-assets/angel-one-hls/a-eng-0128k-aac-2c-init.mp4"
|
||||
},
|
||||
"resolvedUri": "https://storage.googleapis.com/shaka-demo-assets/angel-one-hls/a-eng-0128k-aac-2c-s4.mp4",
|
||||
"number": 3
|
||||
},
|
||||
{
|
||||
"duration": 4.011,
|
||||
"uri": "a-eng-0128k-aac-2c-s5.mp4",
|
||||
"timeline": 0,
|
||||
"map": {
|
||||
"uri": "a-eng-0128k-aac-2c-init.mp4",
|
||||
"resolvedUri": "https://storage.googleapis.com/shaka-demo-assets/angel-one-hls/a-eng-0128k-aac-2c-init.mp4"
|
||||
},
|
||||
"resolvedUri": "https://storage.googleapis.com/shaka-demo-assets/angel-one-hls/a-eng-0128k-aac-2c-s5.mp4",
|
||||
"number": 4
|
||||
},
|
||||
{
|
||||
"duration": 3.989,
|
||||
"uri": "a-eng-0128k-aac-2c-s6.mp4",
|
||||
"timeline": 0,
|
||||
"map": {
|
||||
"uri": "a-eng-0128k-aac-2c-init.mp4",
|
||||
"resolvedUri": "https://storage.googleapis.com/shaka-demo-assets/angel-one-hls/a-eng-0128k-aac-2c-init.mp4"
|
||||
},
|
||||
"resolvedUri": "https://storage.googleapis.com/shaka-demo-assets/angel-one-hls/a-eng-0128k-aac-2c-s6.mp4",
|
||||
"number": 5
|
||||
},
|
||||
{
|
||||
"duration": 4.011,
|
||||
"uri": "a-eng-0128k-aac-2c-s7.mp4",
|
||||
"timeline": 0,
|
||||
"map": {
|
||||
"uri": "a-eng-0128k-aac-2c-init.mp4",
|
||||
"resolvedUri": "https://storage.googleapis.com/shaka-demo-assets/angel-one-hls/a-eng-0128k-aac-2c-init.mp4"
|
||||
},
|
||||
"resolvedUri": "https://storage.googleapis.com/shaka-demo-assets/angel-one-hls/a-eng-0128k-aac-2c-s7.mp4",
|
||||
"number": 6
|
||||
},
|
||||
{
|
||||
"duration": 3.989,
|
||||
"uri": "a-eng-0128k-aac-2c-s8.mp4",
|
||||
"timeline": 0,
|
||||
"map": {
|
||||
"uri": "a-eng-0128k-aac-2c-init.mp4",
|
||||
"resolvedUri": "https://storage.googleapis.com/shaka-demo-assets/angel-one-hls/a-eng-0128k-aac-2c-init.mp4"
|
||||
},
|
||||
"resolvedUri": "https://storage.googleapis.com/shaka-demo-assets/angel-one-hls/a-eng-0128k-aac-2c-s8.mp4",
|
||||
"number": 7
|
||||
},
|
||||
{
|
||||
"duration": 4.011,
|
||||
"uri": "a-eng-0128k-aac-2c-s9.mp4",
|
||||
"timeline": 0,
|
||||
"map": {
|
||||
"uri": "a-eng-0128k-aac-2c-init.mp4",
|
||||
"resolvedUri": "https://storage.googleapis.com/shaka-demo-assets/angel-one-hls/a-eng-0128k-aac-2c-init.mp4"
|
||||
},
|
||||
"resolvedUri": "https://storage.googleapis.com/shaka-demo-assets/angel-one-hls/a-eng-0128k-aac-2c-s9.mp4",
|
||||
"number": 8
|
||||
},
|
||||
{
|
||||
"duration": 3.989,
|
||||
"uri": "a-eng-0128k-aac-2c-s10.mp4",
|
||||
"timeline": 0,
|
||||
"map": {
|
||||
"uri": "a-eng-0128k-aac-2c-init.mp4",
|
||||
"resolvedUri": "https://storage.googleapis.com/shaka-demo-assets/angel-one-hls/a-eng-0128k-aac-2c-init.mp4"
|
||||
},
|
||||
"resolvedUri": "https://storage.googleapis.com/shaka-demo-assets/angel-one-hls/a-eng-0128k-aac-2c-s10.mp4",
|
||||
"number": 9
|
||||
},
|
||||
{
|
||||
"duration": 4.011,
|
||||
"uri": "a-eng-0128k-aac-2c-s11.mp4",
|
||||
"timeline": 0,
|
||||
"map": {
|
||||
"uri": "a-eng-0128k-aac-2c-init.mp4",
|
||||
"resolvedUri": "https://storage.googleapis.com/shaka-demo-assets/angel-one-hls/a-eng-0128k-aac-2c-init.mp4"
|
||||
},
|
||||
"resolvedUri": "https://storage.googleapis.com/shaka-demo-assets/angel-one-hls/a-eng-0128k-aac-2c-s11.mp4",
|
||||
"number": 10
|
||||
},
|
||||
{
|
||||
"duration": 3.989,
|
||||
"uri": "a-eng-0128k-aac-2c-s12.mp4",
|
||||
"timeline": 0,
|
||||
"map": {
|
||||
"uri": "a-eng-0128k-aac-2c-init.mp4",
|
||||
"resolvedUri": "https://storage.googleapis.com/shaka-demo-assets/angel-one-hls/a-eng-0128k-aac-2c-init.mp4"
|
||||
},
|
||||
"resolvedUri": "https://storage.googleapis.com/shaka-demo-assets/angel-one-hls/a-eng-0128k-aac-2c-s12.mp4",
|
||||
"number": 11
|
||||
},
|
||||
{
|
||||
"duration": 4.011,
|
||||
"uri": "a-eng-0128k-aac-2c-s13.mp4",
|
||||
"timeline": 0,
|
||||
"map": {
|
||||
"uri": "a-eng-0128k-aac-2c-init.mp4",
|
||||
"resolvedUri": "https://storage.googleapis.com/shaka-demo-assets/angel-one-hls/a-eng-0128k-aac-2c-init.mp4"
|
||||
},
|
||||
"resolvedUri": "https://storage.googleapis.com/shaka-demo-assets/angel-one-hls/a-eng-0128k-aac-2c-s13.mp4",
|
||||
"number": 12
|
||||
},
|
||||
{
|
||||
"duration": 3.989,
|
||||
"uri": "a-eng-0128k-aac-2c-s14.mp4",
|
||||
"timeline": 0,
|
||||
"map": {
|
||||
"uri": "a-eng-0128k-aac-2c-init.mp4",
|
||||
"resolvedUri": "https://storage.googleapis.com/shaka-demo-assets/angel-one-hls/a-eng-0128k-aac-2c-init.mp4"
|
||||
},
|
||||
"resolvedUri": "https://storage.googleapis.com/shaka-demo-assets/angel-one-hls/a-eng-0128k-aac-2c-s14.mp4",
|
||||
"number": 13
|
||||
},
|
||||
{
|
||||
"duration": 4,
|
||||
"uri": "a-eng-0128k-aac-2c-s15.mp4",
|
||||
"timeline": 0,
|
||||
"map": {
|
||||
"uri": "a-eng-0128k-aac-2c-init.mp4",
|
||||
"resolvedUri": "https://storage.googleapis.com/shaka-demo-assets/angel-one-hls/a-eng-0128k-aac-2c-init.mp4"
|
||||
},
|
||||
"resolvedUri": "https://storage.googleapis.com/shaka-demo-assets/angel-one-hls/a-eng-0128k-aac-2c-s15.mp4",
|
||||
"number": 14
|
||||
}
|
||||
],
|
||||
"uri": "combined-playlist-audio",
|
||||
"resolvedUri": "combined-playlist-audio",
|
||||
"playlistType": "VOD",
|
||||
"endList": true,
|
||||
"mediaSequence": 0,
|
||||
"discontinuitySequence": 0,
|
||||
"discontinuityStarts": []
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
},
|
||||
"VIDEO": {},
|
||||
"CLOSED-CAPTIONS": {},
|
||||
"SUBTITLES": {}
|
||||
},
|
||||
"uri": "http://localhost:10000/",
|
||||
"playlists": [
|
||||
{
|
||||
"attributes": {
|
||||
"BANDWIDTH": 8062646,
|
||||
"CODECS": "avc1.4d401f,mp4a.40.2",
|
||||
"AUDIO": "audio"
|
||||
},
|
||||
"segments": [
|
||||
{
|
||||
"duration": 4,
|
||||
"uri": "v-0576p-1400k-libx264-s1.mp4",
|
||||
"timeline": 0,
|
||||
"map": {
|
||||
"uri": "v-0576p-1400k-libx264-init.mp4",
|
||||
"resolvedUri": "https://storage.googleapis.com/shaka-demo-assets/angel-one-hls/v-0576p-1400k-libx264-init.mp4"
|
||||
},
|
||||
"resolvedUri": "https://storage.googleapis.com/shaka-demo-assets/angel-one-hls/v-0576p-1400k-libx264-s1.mp4",
|
||||
"number": 0
|
||||
},
|
||||
{
|
||||
"duration": 4,
|
||||
"uri": "v-0576p-1400k-libx264-s2.mp4",
|
||||
"timeline": 0,
|
||||
"map": {
|
||||
"uri": "v-0576p-1400k-libx264-init.mp4",
|
||||
"resolvedUri": "https://storage.googleapis.com/shaka-demo-assets/angel-one-hls/v-0576p-1400k-libx264-init.mp4"
|
||||
},
|
||||
"resolvedUri": "https://storage.googleapis.com/shaka-demo-assets/angel-one-hls/v-0576p-1400k-libx264-s2.mp4",
|
||||
"number": 1
|
||||
},
|
||||
{
|
||||
"duration": 4,
|
||||
"uri": "v-0576p-1400k-libx264-s3.mp4",
|
||||
"timeline": 0,
|
||||
"map": {
|
||||
"uri": "v-0576p-1400k-libx264-init.mp4",
|
||||
"resolvedUri": "https://storage.googleapis.com/shaka-demo-assets/angel-one-hls/v-0576p-1400k-libx264-init.mp4"
|
||||
},
|
||||
"resolvedUri": "https://storage.googleapis.com/shaka-demo-assets/angel-one-hls/v-0576p-1400k-libx264-s3.mp4",
|
||||
"number": 2
|
||||
},
|
||||
{
|
||||
"duration": 4,
|
||||
"uri": "v-0576p-1400k-libx264-s4.mp4",
|
||||
"timeline": 0,
|
||||
"map": {
|
||||
"uri": "v-0576p-1400k-libx264-init.mp4",
|
||||
"resolvedUri": "https://storage.googleapis.com/shaka-demo-assets/angel-one-hls/v-0576p-1400k-libx264-init.mp4"
|
||||
},
|
||||
"resolvedUri": "https://storage.googleapis.com/shaka-demo-assets/angel-one-hls/v-0576p-1400k-libx264-s4.mp4",
|
||||
"number": 3
|
||||
},
|
||||
{
|
||||
"duration": 4,
|
||||
"uri": "v-0576p-1400k-libx264-s5.mp4",
|
||||
"timeline": 0,
|
||||
"map": {
|
||||
"uri": "v-0576p-1400k-libx264-init.mp4",
|
||||
"resolvedUri": "https://storage.googleapis.com/shaka-demo-assets/angel-one-hls/v-0576p-1400k-libx264-init.mp4"
|
||||
},
|
||||
"resolvedUri": "https://storage.googleapis.com/shaka-demo-assets/angel-one-hls/v-0576p-1400k-libx264-s5.mp4",
|
||||
"number": 4
|
||||
},
|
||||
{
|
||||
"duration": 4,
|
||||
"uri": "v-0576p-1400k-libx264-s6.mp4",
|
||||
"timeline": 0,
|
||||
"map": {
|
||||
"uri": "v-0576p-1400k-libx264-init.mp4",
|
||||
"resolvedUri": "https://storage.googleapis.com/shaka-demo-assets/angel-one-hls/v-0576p-1400k-libx264-init.mp4"
|
||||
},
|
||||
"resolvedUri": "https://storage.googleapis.com/shaka-demo-assets/angel-one-hls/v-0576p-1400k-libx264-s6.mp4",
|
||||
"number": 5
|
||||
},
|
||||
{
|
||||
"duration": 4,
|
||||
"uri": "v-0576p-1400k-libx264-s7.mp4",
|
||||
"timeline": 0,
|
||||
"map": {
|
||||
"uri": "v-0576p-1400k-libx264-init.mp4",
|
||||
"resolvedUri": "https://storage.googleapis.com/shaka-demo-assets/angel-one-hls/v-0576p-1400k-libx264-init.mp4"
|
||||
},
|
||||
"resolvedUri": "https://storage.googleapis.com/shaka-demo-assets/angel-one-hls/v-0576p-1400k-libx264-s7.mp4",
|
||||
"number": 6
|
||||
},
|
||||
{
|
||||
"duration": 4,
|
||||
"uri": "v-0576p-1400k-libx264-s8.mp4",
|
||||
"timeline": 0,
|
||||
"map": {
|
||||
"uri": "v-0576p-1400k-libx264-init.mp4",
|
||||
"resolvedUri": "https://storage.googleapis.com/shaka-demo-assets/angel-one-hls/v-0576p-1400k-libx264-init.mp4"
|
||||
},
|
||||
"resolvedUri": "https://storage.googleapis.com/shaka-demo-assets/angel-one-hls/v-0576p-1400k-libx264-s8.mp4",
|
||||
"number": 7
|
||||
},
|
||||
{
|
||||
"duration": 4,
|
||||
"uri": "v-0576p-1400k-libx264-s9.mp4",
|
||||
"timeline": 0,
|
||||
"map": {
|
||||
"uri": "v-0576p-1400k-libx264-init.mp4",
|
||||
"resolvedUri": "https://storage.googleapis.com/shaka-demo-assets/angel-one-hls/v-0576p-1400k-libx264-init.mp4"
|
||||
},
|
||||
"resolvedUri": "https://storage.googleapis.com/shaka-demo-assets/angel-one-hls/v-0576p-1400k-libx264-s9.mp4",
|
||||
"number": 8
|
||||
},
|
||||
{
|
||||
"duration": 4,
|
||||
"uri": "v-0576p-1400k-libx264-s10.mp4",
|
||||
"timeline": 0,
|
||||
"map": {
|
||||
"uri": "v-0576p-1400k-libx264-init.mp4",
|
||||
"resolvedUri": "https://storage.googleapis.com/shaka-demo-assets/angel-one-hls/v-0576p-1400k-libx264-init.mp4"
|
||||
},
|
||||
"resolvedUri": "https://storage.googleapis.com/shaka-demo-assets/angel-one-hls/v-0576p-1400k-libx264-s10.mp4",
|
||||
"number": 9
|
||||
},
|
||||
{
|
||||
"duration": 4,
|
||||
"uri": "v-0576p-1400k-libx264-s11.mp4",
|
||||
"timeline": 0,
|
||||
"map": {
|
||||
"uri": "v-0576p-1400k-libx264-init.mp4",
|
||||
"resolvedUri": "https://storage.googleapis.com/shaka-demo-assets/angel-one-hls/v-0576p-1400k-libx264-init.mp4"
|
||||
},
|
||||
"resolvedUri": "https://storage.googleapis.com/shaka-demo-assets/angel-one-hls/v-0576p-1400k-libx264-s11.mp4",
|
||||
"number": 10
|
||||
},
|
||||
{
|
||||
"duration": 4,
|
||||
"uri": "v-0576p-1400k-libx264-s12.mp4",
|
||||
"timeline": 0,
|
||||
"map": {
|
||||
"uri": "v-0576p-1400k-libx264-init.mp4",
|
||||
"resolvedUri": "https://storage.googleapis.com/shaka-demo-assets/angel-one-hls/v-0576p-1400k-libx264-init.mp4"
|
||||
},
|
||||
"resolvedUri": "https://storage.googleapis.com/shaka-demo-assets/angel-one-hls/v-0576p-1400k-libx264-s12.mp4",
|
||||
"number": 11
|
||||
},
|
||||
{
|
||||
"duration": 4,
|
||||
"uri": "v-0576p-1400k-libx264-s13.mp4",
|
||||
"timeline": 0,
|
||||
"map": {
|
||||
"uri": "v-0576p-1400k-libx264-init.mp4",
|
||||
"resolvedUri": "https://storage.googleapis.com/shaka-demo-assets/angel-one-hls/v-0576p-1400k-libx264-init.mp4"
|
||||
},
|
||||
"resolvedUri": "https://storage.googleapis.com/shaka-demo-assets/angel-one-hls/v-0576p-1400k-libx264-s13.mp4",
|
||||
"number": 12
|
||||
},
|
||||
{
|
||||
"duration": 4,
|
||||
"uri": "v-0576p-1400k-libx264-s14.mp4",
|
||||
"timeline": 0,
|
||||
"map": {
|
||||
"uri": "v-0576p-1400k-libx264-init.mp4",
|
||||
"resolvedUri": "https://storage.googleapis.com/shaka-demo-assets/angel-one-hls/v-0576p-1400k-libx264-init.mp4"
|
||||
},
|
||||
"resolvedUri": "https://storage.googleapis.com/shaka-demo-assets/angel-one-hls/v-0576p-1400k-libx264-s14.mp4",
|
||||
"number": 13
|
||||
},
|
||||
{
|
||||
"duration": 4,
|
||||
"uri": "v-0576p-1400k-libx264-s15.mp4",
|
||||
"timeline": 0,
|
||||
"map": {
|
||||
"uri": "v-0576p-1400k-libx264-init.mp4",
|
||||
"resolvedUri": "https://storage.googleapis.com/shaka-demo-assets/angel-one-hls/v-0576p-1400k-libx264-init.mp4"
|
||||
},
|
||||
"resolvedUri": "https://storage.googleapis.com/shaka-demo-assets/angel-one-hls/v-0576p-1400k-libx264-s15.mp4",
|
||||
"number": 14
|
||||
}
|
||||
],
|
||||
"uri": "combined-playlist",
|
||||
"resolvedUri": "combined-playlist",
|
||||
"playlistType": "VOD",
|
||||
"endList": true,
|
||||
"mediaSequence": 0,
|
||||
"discontinuitySequence": 0,
|
||||
"discontinuityStarts": []
|
||||
}
|
||||
]
|
||||
}
|
||||
768
webroot/test/scripts/index.js
Normal file
768
webroot/test/scripts/index.js
Normal file
@ -0,0 +1,768 @@
|
||||
/* global window document */
|
||||
/* eslint-disable vars-on-top, no-var, object-shorthand, no-console */
|
||||
(function (window) {
|
||||
var representationsEl = document.getElementById('representations');
|
||||
|
||||
representationsEl.addEventListener('change', function () {
|
||||
var selectedIndex = representationsEl.selectedIndex;
|
||||
|
||||
if (!selectedIndex || selectedIndex < 1 || !window.vhs) {
|
||||
return;
|
||||
}
|
||||
var selectedOption =
|
||||
representationsEl.options[representationsEl.selectedIndex];
|
||||
|
||||
if (!selectedOption) {
|
||||
return;
|
||||
}
|
||||
|
||||
var id = selectedOption.value;
|
||||
|
||||
window.vhs.representations().forEach(function (rep) {
|
||||
rep.playlist.disabled = rep.id !== id;
|
||||
});
|
||||
|
||||
window.mpc.fastQualityChange_();
|
||||
});
|
||||
var isManifestObjectType = function (url) {
|
||||
return /application\/vnd\.videojs\.vhs\+json/.test(url);
|
||||
};
|
||||
var hlsOptGroup = document.querySelector('[label="hls"]');
|
||||
var dashOptGroup = document.querySelector('[label="dash"]');
|
||||
var drmOptGroup = document.querySelector('[label="drm"]');
|
||||
var liveOptGroup = document.querySelector('[label="live"]');
|
||||
var llliveOptGroup = document.querySelector('[label="low latency live"]');
|
||||
var manifestOptGroup = document.querySelector(
|
||||
'[label="json manifest object"]'
|
||||
);
|
||||
|
||||
var sourceList;
|
||||
var hlsDataManifest;
|
||||
var dashDataManifest;
|
||||
|
||||
var addSourcesToDom = function () {
|
||||
if (!sourceList || !hlsDataManifest || !dashDataManifest) {
|
||||
return;
|
||||
}
|
||||
|
||||
sourceList.forEach(function (source) {
|
||||
var option = document.createElement('option');
|
||||
|
||||
option.innerText = source.name;
|
||||
option.value = source.uri;
|
||||
|
||||
if (source.keySystems) {
|
||||
option.setAttribute(
|
||||
'data-key-systems',
|
||||
JSON.stringify(source.keySystems, null, 2)
|
||||
);
|
||||
}
|
||||
|
||||
if (source.mimetype) {
|
||||
option.setAttribute('data-mimetype', source.mimetype);
|
||||
}
|
||||
|
||||
if (source.features.indexOf('live') !== -1) {
|
||||
liveOptGroup.appendChild(option);
|
||||
} else if (source.mimetype === 'application/x-mpegurl') {
|
||||
hlsOptGroup.appendChild(option);
|
||||
}
|
||||
});
|
||||
|
||||
var hlsOption = document.createElement('option');
|
||||
var dashOption = document.createElement('option');
|
||||
|
||||
dashOption.innerText =
|
||||
'Dash Manifest Object Test, does not survive page reload';
|
||||
dashOption.value = `data:application/vnd.videojs.vhs+json,${dashDataManifest}`;
|
||||
hlsOption.innerText =
|
||||
'HLS Manifest Object Test, does not survive page reload';
|
||||
hlsOption.value = `data:application/vnd.videojs.vhs+json,${hlsDataManifest}`;
|
||||
|
||||
// manifestOptGroup.appendChild(hlsOption);
|
||||
// manifestOptGroup.appendChild(dashOption);
|
||||
};
|
||||
|
||||
var sourcesXhr = new window.XMLHttpRequest();
|
||||
|
||||
sourcesXhr.addEventListener('load', function () {
|
||||
sourceList = JSON.parse(sourcesXhr.responseText);
|
||||
addSourcesToDom();
|
||||
});
|
||||
sourcesXhr.open('GET', './scripts/sources.json');
|
||||
sourcesXhr.send();
|
||||
|
||||
var hlsManifestXhr = new window.XMLHttpRequest();
|
||||
|
||||
hlsManifestXhr.addEventListener('load', function () {
|
||||
hlsDataManifest = hlsManifestXhr.responseText;
|
||||
addSourcesToDom();
|
||||
});
|
||||
hlsManifestXhr.open('GET', './scripts/hls-manifest-object.json');
|
||||
hlsManifestXhr.send();
|
||||
|
||||
var dashManifestXhr = new window.XMLHttpRequest();
|
||||
|
||||
dashManifestXhr.addEventListener('load', function () {
|
||||
dashDataManifest = dashManifestXhr.responseText;
|
||||
addSourcesToDom();
|
||||
});
|
||||
dashManifestXhr.open('GET', './scripts/dash-manifest-object.json');
|
||||
dashManifestXhr.send();
|
||||
|
||||
// all relevant elements
|
||||
var urlButton = document.getElementById('load-url');
|
||||
var sources = document.getElementById('load-source');
|
||||
var stateEls = {};
|
||||
|
||||
var getInputValue = function (el) {
|
||||
if (
|
||||
el.type === 'url' ||
|
||||
el.type === 'text' ||
|
||||
el.nodeName.toLowerCase() === 'textarea'
|
||||
) {
|
||||
if (isManifestObjectType(el.value)) {
|
||||
return '';
|
||||
}
|
||||
return encodeURIComponent(el.value);
|
||||
} else if (el.type === 'select-one') {
|
||||
return el.options[el.selectedIndex].value;
|
||||
} else if (el.type === 'checkbox') {
|
||||
return el.checked;
|
||||
}
|
||||
|
||||
console.warn('unhandled input type ' + el.type);
|
||||
return '';
|
||||
};
|
||||
|
||||
var setInputValue = function (el, value) {
|
||||
if (
|
||||
el.type === 'url' ||
|
||||
el.type === 'text' ||
|
||||
el.nodeName.toLowerCase() === 'textarea'
|
||||
) {
|
||||
el.value = decodeURIComponent(value);
|
||||
} else if (el.type === 'select-one') {
|
||||
for (var i = 0; i < el.options.length; i++) {
|
||||
if (el.options[i].value === value) {
|
||||
el.options[i].selected = true;
|
||||
}
|
||||
}
|
||||
} else {
|
||||
// get the `value` into a Boolean.
|
||||
el.checked = JSON.parse(value);
|
||||
}
|
||||
};
|
||||
|
||||
var newEvent = function (name) {
|
||||
var event;
|
||||
|
||||
if (typeof window.Event === 'function') {
|
||||
event = new window.Event(name);
|
||||
} else {
|
||||
event = document.createEvent('Event');
|
||||
event.initEvent(name, true, true);
|
||||
}
|
||||
|
||||
return event;
|
||||
};
|
||||
|
||||
// taken from video.js
|
||||
var getFileExtension = function (path) {
|
||||
var splitPathRe;
|
||||
var pathParts;
|
||||
|
||||
if (typeof path === 'string') {
|
||||
splitPathRe =
|
||||
/^(\/?)([\s\S]*?)((?:\.{1,2}|[^\/]*?)(\.([^\.\/\?]+)))(?:[\/]*|[\?].*)$/i;
|
||||
pathParts = splitPathRe.exec(path);
|
||||
|
||||
if (pathParts) {
|
||||
return pathParts.pop().toLowerCase();
|
||||
}
|
||||
}
|
||||
|
||||
return '';
|
||||
};
|
||||
|
||||
var saveState = function () {
|
||||
var query = '';
|
||||
|
||||
if (!window.history.replaceState) {
|
||||
return;
|
||||
}
|
||||
|
||||
Object.keys(stateEls).forEach(function (elName) {
|
||||
var symbol = query.length ? '&' : '?';
|
||||
|
||||
query += symbol + elName + '=' + getInputValue(stateEls[elName]);
|
||||
});
|
||||
|
||||
window.history.replaceState({}, 'vhs demo', query);
|
||||
};
|
||||
|
||||
window.URLSearchParams =
|
||||
window.URLSearchParams ||
|
||||
function (locationSearch) {
|
||||
this.get = function (name) {
|
||||
var results = new RegExp('[?&]' + name + '=([^&#]*)').exec(
|
||||
locationSearch
|
||||
);
|
||||
|
||||
return results ? decodeURIComponent(results[1]) : null;
|
||||
};
|
||||
};
|
||||
|
||||
// eslint-disable-next-line
|
||||
var loadState = function () {
|
||||
var params = new window.URLSearchParams(window.location.search);
|
||||
|
||||
return Object.keys(stateEls).reduce(function (acc, elName) {
|
||||
acc[elName] =
|
||||
typeof params.get(elName) !== 'object'
|
||||
? params.get(elName)
|
||||
: getInputValue(stateEls[elName]);
|
||||
return acc;
|
||||
}, {});
|
||||
};
|
||||
|
||||
// eslint-disable-next-line
|
||||
var reloadScripts = function (urls, cb) {
|
||||
console.log('blah')
|
||||
var el = document.getElementById('reload-scripts');
|
||||
|
||||
if (!el) {
|
||||
el = document.createElement('div');
|
||||
el.id = 'reload-scripts';
|
||||
document.body.appendChild(el);
|
||||
}
|
||||
|
||||
while (el.firstChild) {
|
||||
el.removeChild(el.firstChild);
|
||||
}
|
||||
|
||||
var loaded = [];
|
||||
|
||||
var checkDone = function () {
|
||||
if (loaded.length === urls.length) {
|
||||
cb();
|
||||
}
|
||||
};
|
||||
|
||||
urls.forEach(function (url) {
|
||||
console.log(url)
|
||||
var script = document.createElement('script');
|
||||
|
||||
// scripts marked as defer will be loaded asynchronously but will be executed in the order they are in the DOM
|
||||
script.defer = true;
|
||||
// dynamically created scripts are async by default unless otherwise specified
|
||||
// async scripts are loaded asynchronously but also executed as soon as they are loaded
|
||||
// we want to load them in the order they are added therefore we want to turn off async
|
||||
script.async = false;
|
||||
script.src = url;
|
||||
script.onload = function () {
|
||||
loaded.push(url);
|
||||
checkDone();
|
||||
};
|
||||
el.appendChild(script);
|
||||
});
|
||||
|
||||
};
|
||||
|
||||
var regenerateRepresentations = function () {
|
||||
while (representationsEl.firstChild) {
|
||||
representationsEl.removeChild(representationsEl.firstChild);
|
||||
}
|
||||
|
||||
var selectedIndex;
|
||||
|
||||
window.vhs.representations().forEach(function (rep, i) {
|
||||
var option = document.createElement('option');
|
||||
|
||||
option.value = rep.id;
|
||||
option.innerText = JSON.stringify({
|
||||
id: rep.id,
|
||||
videoCodec: rep.codecs.video,
|
||||
audioCodec: rep.codecs.audio,
|
||||
bandwidth: rep.bandwidth,
|
||||
heigth: rep.heigth,
|
||||
width: rep.width,
|
||||
});
|
||||
|
||||
if (window.mpc.media().id === rep.id) {
|
||||
selectedIndex = i;
|
||||
}
|
||||
|
||||
representationsEl.appendChild(option);
|
||||
});
|
||||
|
||||
representationsEl.selectedIndex = selectedIndex;
|
||||
};
|
||||
|
||||
function getBuffered(buffered) {
|
||||
var bufferedText = '';
|
||||
|
||||
if (!buffered) {
|
||||
return bufferedText;
|
||||
}
|
||||
|
||||
if (buffered.length) {
|
||||
bufferedText += buffered.start(0) + ' - ' + buffered.end(0);
|
||||
}
|
||||
for (var i = 1; i < buffered.length; i++) {
|
||||
bufferedText += ', ' + buffered.start(i) + ' - ' + buffered.end(i);
|
||||
}
|
||||
return bufferedText;
|
||||
}
|
||||
|
||||
var setupSegmentMetadata = function (player) {
|
||||
// setup segment metadata
|
||||
var segmentMetadata = document.querySelector('#segment-metadata');
|
||||
|
||||
player.one('loadedmetadata', function () {
|
||||
var tracks = player.textTracks();
|
||||
var segmentMetadataTrack;
|
||||
|
||||
for (var i = 0; i < tracks.length; i++) {
|
||||
if (tracks[i].label === 'segment-metadata') {
|
||||
segmentMetadataTrack = tracks[i];
|
||||
}
|
||||
}
|
||||
|
||||
while (segmentMetadata.children.length) {
|
||||
segmentMetadata.removeChild(segmentMetadata.firstChild);
|
||||
}
|
||||
|
||||
if (segmentMetadataTrack) {
|
||||
segmentMetadataTrack.addEventListener('cuechange', function () {
|
||||
var cues = segmentMetadataTrack.activeCues || [];
|
||||
|
||||
let activeCue = segmentMetadataTrack.activeCues[0].value;
|
||||
|
||||
try {
|
||||
const latency =
|
||||
(new Date().getTime() - activeCue.dateTimeObject.getTime()) /
|
||||
1000;
|
||||
document.getElementById('displayedSegmentLatency').innerHTML =
|
||||
latency;
|
||||
} catch (err) {
|
||||
console.error(err);
|
||||
}
|
||||
|
||||
while (segmentMetadata.children.length) {
|
||||
segmentMetadata.removeChild(segmentMetadata.firstChild);
|
||||
}
|
||||
|
||||
for (var j = 0; j < cues.length; j++) {
|
||||
var text = JSON.stringify(JSON.parse(cues[j].text), null, 2);
|
||||
var li = document.createElement('li');
|
||||
var pre = document.createElement('pre');
|
||||
|
||||
pre.classList.add('border', 'rounded', 'p-2');
|
||||
pre.textContent = text;
|
||||
li.appendChild(pre);
|
||||
segmentMetadata.appendChild(li);
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
var setupPlayerStats = function (player) {
|
||||
player.on('dispose', () => {
|
||||
if (window.statsTimer) {
|
||||
window.clearInterval(window.statsTimer);
|
||||
window.statsTimer = null;
|
||||
}
|
||||
});
|
||||
var currentTimeStat = document.querySelector('.current-time-stat');
|
||||
var bufferedStat = document.querySelector('.buffered-stat');
|
||||
var videoBufferedStat = document.querySelector('.video-buffered-stat');
|
||||
var audioBufferedStat = document.querySelector('.audio-buffered-stat');
|
||||
var seekableStartStat = document.querySelector('.seekable-start-stat');
|
||||
var seekableEndStat = document.querySelector('.seekable-end-stat');
|
||||
var videoBitrateState = document.querySelector('.video-bitrate-stat');
|
||||
var measuredBitrateStat = document.querySelector('.measured-bitrate-stat');
|
||||
var videoTimestampOffset = document.querySelector('.video-timestampoffset');
|
||||
var audioTimestampOffset = document.querySelector('.audio-timestampoffset');
|
||||
|
||||
player.on('timeupdate', function () {
|
||||
currentTimeStat.textContent = player.currentTime().toFixed(1);
|
||||
});
|
||||
|
||||
window.statsTimer = window.setInterval(function () {
|
||||
var oldStart;
|
||||
var oldEnd;
|
||||
var seekable = player.seekable();
|
||||
|
||||
if (seekable && seekable.length) {
|
||||
oldStart = seekableStartStat.textContent;
|
||||
if (seekable.start(0).toFixed(1) !== oldStart) {
|
||||
seekableStartStat.textContent = seekable.start(0).toFixed(1);
|
||||
}
|
||||
oldEnd = seekableEndStat.textContent;
|
||||
if (seekable.end(0).toFixed(1) !== oldEnd) {
|
||||
seekableEndStat.textContent = seekable.end(0).toFixed(1);
|
||||
}
|
||||
}
|
||||
|
||||
// buffered
|
||||
bufferedStat.textContent = getBuffered(player.buffered());
|
||||
|
||||
// exit early if no VHS
|
||||
if (!player.tech(true).vhs) {
|
||||
videoBufferedStat.textContent = '';
|
||||
audioBufferedStat.textContent = '';
|
||||
videoBitrateState.textContent = '';
|
||||
measuredBitrateStat.textContent = '';
|
||||
videoTimestampOffset.textContent = '';
|
||||
audioTimestampOffset.textContent = '';
|
||||
return;
|
||||
}
|
||||
|
||||
videoBufferedStat.textContent = getBuffered(
|
||||
player.tech(true).vhs.masterPlaylistController_.mainSegmentLoader_
|
||||
.sourceUpdater_.videoBuffer &&
|
||||
player.tech(true).vhs.masterPlaylistController_.mainSegmentLoader_
|
||||
.sourceUpdater_.videoBuffer.buffered
|
||||
);
|
||||
|
||||
// demuxed audio
|
||||
var audioBuffer = getBuffered(
|
||||
player.tech(true).vhs.masterPlaylistController_.audioSegmentLoader_
|
||||
.sourceUpdater_.audioBuffer &&
|
||||
player.tech(true).vhs.masterPlaylistController_.audioSegmentLoader_
|
||||
.sourceUpdater_.audioBuffer.buffered
|
||||
);
|
||||
|
||||
// muxed audio
|
||||
if (!audioBuffer) {
|
||||
audioBuffer = getBuffered(
|
||||
player.tech(true).vhs.masterPlaylistController_.mainSegmentLoader_
|
||||
.sourceUpdater_.audioBuffer &&
|
||||
player.tech(true).vhs.masterPlaylistController_.mainSegmentLoader_
|
||||
.sourceUpdater_.audioBuffer.buffered
|
||||
);
|
||||
}
|
||||
audioBufferedStat.textContent = audioBuffer;
|
||||
|
||||
if (
|
||||
player.tech(true).vhs.masterPlaylistController_.audioSegmentLoader_
|
||||
.sourceUpdater_.audioBuffer
|
||||
) {
|
||||
audioTimestampOffset.textContent =
|
||||
player.tech(
|
||||
true
|
||||
).vhs.masterPlaylistController_.audioSegmentLoader_.sourceUpdater_.audioBuffer.timestampOffset;
|
||||
} else if (
|
||||
player.tech(true).vhs.masterPlaylistController_.mainSegmentLoader_
|
||||
.sourceUpdater_.audioBuffer
|
||||
) {
|
||||
audioTimestampOffset.textContent =
|
||||
player.tech(
|
||||
true
|
||||
).vhs.masterPlaylistController_.mainSegmentLoader_.sourceUpdater_.audioBuffer.timestampOffset;
|
||||
}
|
||||
|
||||
if (
|
||||
player.tech(true).vhs.masterPlaylistController_.mainSegmentLoader_
|
||||
.sourceUpdater_.videoBuffer
|
||||
) {
|
||||
videoTimestampOffset.textContent =
|
||||
player.tech(
|
||||
true
|
||||
).vhs.masterPlaylistController_.mainSegmentLoader_.sourceUpdater_.videoBuffer.timestampOffset;
|
||||
}
|
||||
|
||||
// bitrates
|
||||
var playlist = player.tech_.vhs.playlists.media();
|
||||
|
||||
if (playlist && playlist.attributes && playlist.attributes.BANDWIDTH) {
|
||||
videoBitrateState.textContent =
|
||||
(playlist.attributes.BANDWIDTH / 1024).toLocaleString(undefined, {
|
||||
maximumFractionDigits: 1,
|
||||
}) + ' kbps';
|
||||
}
|
||||
if (player.tech_.vhs.bandwidth) {
|
||||
measuredBitrateStat.textContent =
|
||||
(player.tech_.vhs.bandwidth / 1024).toLocaleString(undefined, {
|
||||
maximumFractionDigits: 1,
|
||||
}) + ' kbps';
|
||||
}
|
||||
}, 100);
|
||||
};
|
||||
|
||||
[
|
||||
'debug',
|
||||
'autoplay',
|
||||
'muted',
|
||||
'fluid',
|
||||
'minified',
|
||||
'sync-workers',
|
||||
'liveui',
|
||||
'llhls',
|
||||
'url',
|
||||
'type',
|
||||
'buffer-water',
|
||||
'exact-manifest-timings',
|
||||
'pixel-diff-selector',
|
||||
'override-native',
|
||||
'preload',
|
||||
'mirror-source',
|
||||
].forEach(function (name) {
|
||||
stateEls[name] = document.getElementById(name);
|
||||
});
|
||||
|
||||
window.startDemo = function (cb) {
|
||||
var state = loadState();
|
||||
|
||||
Object.keys(state).forEach(function (elName) {
|
||||
setInputValue(stateEls[elName], state[elName]);
|
||||
});
|
||||
|
||||
Array.prototype.forEach.call(sources.options, function (s, i) {
|
||||
if (s.value === state.url) {
|
||||
sources.selectedIndex = i;
|
||||
}
|
||||
});
|
||||
|
||||
// stateEls that reload the player and scripts
|
||||
[
|
||||
'mirror-source',
|
||||
'sync-workers',
|
||||
'preload',
|
||||
'llhls',
|
||||
'buffer-water',
|
||||
'override-native',
|
||||
'liveui',
|
||||
'pixel-diff-selector',
|
||||
'exact-manifest-timings',
|
||||
].forEach(function (name) {
|
||||
stateEls[name].addEventListener('change', function (event) {
|
||||
saveState();
|
||||
|
||||
stateEls.minified.dispatchEvent(newEvent('change'));
|
||||
});
|
||||
});
|
||||
|
||||
stateEls.debug.addEventListener('change', function (event) {
|
||||
saveState();
|
||||
window.videojs.log.level(event.target.checked ? 'debug' : 'info');
|
||||
});
|
||||
|
||||
stateEls.minified.addEventListener('change', function (event) {
|
||||
// let urls = [];
|
||||
var urls = [].map(function (url) {
|
||||
return url + (event.target.checked ? '.min' : '') + '.js';
|
||||
});
|
||||
|
||||
// if (stateEls['sync-workers'].checked) {
|
||||
// urls.push('dist/videojs-http-streaming-sync-workers.js');
|
||||
// } else {
|
||||
urls.push(
|
||||
'https://vjs.zencdn.net/7.15.4/video.min.js',
|
||||
'https://cdn.jsdelivr.net/npm/@videojs/http-streaming@2.10.3/dist/videojs-http-streaming.min.js'
|
||||
);
|
||||
// }
|
||||
|
||||
saveState();
|
||||
|
||||
if (window.player) {
|
||||
window.player.dispose();
|
||||
delete window.player;
|
||||
}
|
||||
if (window.videojs) {
|
||||
delete window.videojs;
|
||||
}
|
||||
|
||||
reloadScripts(urls, function () {
|
||||
console.log('reloadScripts')
|
||||
var player;
|
||||
var fixture = document.getElementById('player-fixture');
|
||||
var videoEl = document.createElement('video-js');
|
||||
|
||||
videoEl.setAttribute('controls', '');
|
||||
videoEl.setAttribute('preload', 'auto');
|
||||
videoEl.setAttribute('autoplay', '');
|
||||
videoEl.setAttribute('muted', '');
|
||||
videoEl.setAttribute('fluid', 'true');
|
||||
|
||||
videoEl.className = 'vjs-default-skin';
|
||||
fixture.appendChild(videoEl);
|
||||
|
||||
player = window.player = window.videojs(videoEl, {
|
||||
html5: {
|
||||
vhs: {
|
||||
overrideNative: true,
|
||||
experimentalBufferBasedABR: getInputValue(
|
||||
stateEls['buffer-water']
|
||||
),
|
||||
experimentalExactManifestTimings: getInputValue(
|
||||
stateEls['exact-manifest-timings']
|
||||
),
|
||||
experimentalLeastPixelDiffSelector: getInputValue(
|
||||
stateEls['pixel-diff-selector']
|
||||
),
|
||||
},
|
||||
},
|
||||
});
|
||||
|
||||
window.player = player;
|
||||
|
||||
setupPlayerStats(player);
|
||||
setupSegmentMetadata(player);
|
||||
|
||||
// save player muted state interation
|
||||
player.on('volumechange', function () {
|
||||
if (stateEls.muted.checked !== player.muted()) {
|
||||
stateEls.muted.checked = player.muted();
|
||||
saveState();
|
||||
}
|
||||
});
|
||||
|
||||
player.on('sourceset', function () {
|
||||
var source = player.currentSource();
|
||||
|
||||
if (source.keySystems) {
|
||||
var copy = JSON.parse(JSON.stringify(source.keySystems));
|
||||
|
||||
// have to delete pssh as it will often make keySystems too big
|
||||
// for a uri
|
||||
Object.keys(copy).forEach(function (key) {
|
||||
if (copy[key].hasOwnProperty('pssh')) {
|
||||
delete copy[key].pssh;
|
||||
}
|
||||
});
|
||||
|
||||
stateEls.keysystems.value = JSON.stringify(copy, null, 2);
|
||||
}
|
||||
|
||||
if (source.src) {
|
||||
stateEls.url.value = encodeURI(source.src);
|
||||
}
|
||||
|
||||
if (source.type) {
|
||||
stateEls.type.value = source.type;
|
||||
}
|
||||
|
||||
saveState();
|
||||
});
|
||||
|
||||
player.width(640);
|
||||
player.height(264);
|
||||
|
||||
stateEls.debug.dispatchEvent(newEvent('change'));
|
||||
stateEls.muted.dispatchEvent(newEvent('change'));
|
||||
stateEls.fluid.dispatchEvent(newEvent('change'));
|
||||
stateEls.autoplay.dispatchEvent(newEvent('change'));
|
||||
|
||||
// run the load url handler for the intial source
|
||||
if (stateEls.url.value) {
|
||||
urlButton.dispatchEvent(newEvent('click'));
|
||||
} else {
|
||||
sources.dispatchEvent(newEvent('change'));
|
||||
}
|
||||
player.on('loadedmetadata', function () {
|
||||
if (player.tech_.vhs) {
|
||||
window.vhs = player.tech_.vhs;
|
||||
window.mpc = player.tech_.vhs.masterPlaylistController_;
|
||||
window.mpc.masterPlaylistLoader_.on(
|
||||
'mediachange',
|
||||
regenerateRepresentations
|
||||
);
|
||||
regenerateRepresentations();
|
||||
} else {
|
||||
window.vhs = null;
|
||||
window.mpc = null;
|
||||
}
|
||||
});
|
||||
cb(player);
|
||||
});
|
||||
});
|
||||
|
||||
var urlButtonClick = function (event) {
|
||||
var ext;
|
||||
var type = stateEls.type.value;
|
||||
|
||||
// reset type if it's a manifest object's type
|
||||
if (type === 'application/vnd.videojs.vhs+json') {
|
||||
type = '';
|
||||
}
|
||||
|
||||
if (isManifestObjectType(stateEls.url.value)) {
|
||||
type = 'application/vnd.videojs.vhs+json';
|
||||
}
|
||||
|
||||
if (!type.trim()) {
|
||||
ext = getFileExtension(stateEls.url.value);
|
||||
|
||||
if (ext === 'mpd') {
|
||||
type = 'application/dash+xml';
|
||||
} else if (ext === 'm3u8') {
|
||||
type = 'application/x-mpegURL';
|
||||
}
|
||||
}
|
||||
|
||||
saveState();
|
||||
|
||||
var source = {
|
||||
src: stateEls.url.value,
|
||||
type: type,
|
||||
};
|
||||
|
||||
sources.selectedIndex = -1;
|
||||
|
||||
Array.prototype.forEach.call(sources.options, function (s, i) {
|
||||
if (s.value === stateEls.url.value) {
|
||||
sources.selectedIndex = i;
|
||||
}
|
||||
});
|
||||
|
||||
window.player.src(source);
|
||||
const src = source.src;
|
||||
window.currentSrc = src;
|
||||
|
||||
window.shaka.load(src);
|
||||
window.clapprPlayer.load(src);
|
||||
const nativePlayer = document.getElementById('native-player');
|
||||
nativePlayer.setAttribute('src', src);
|
||||
};
|
||||
|
||||
urlButton.addEventListener('click', urlButtonClick);
|
||||
urlButton.addEventListener('tap', urlButtonClick);
|
||||
|
||||
sources.addEventListener('change', function (event) {
|
||||
var selectedOption = sources.options[sources.selectedIndex];
|
||||
|
||||
if (!selectedOption) {
|
||||
return;
|
||||
}
|
||||
var src = selectedOption.value;
|
||||
|
||||
stateEls.url.value = src;
|
||||
stateEls.type.value = selectedOption.getAttribute('data-mimetype');
|
||||
// stateEls.keysystems.value = selectedOption.getAttribute('data-key-systems');
|
||||
|
||||
urlButton.dispatchEvent(newEvent('click'));
|
||||
});
|
||||
|
||||
stateEls.url.addEventListener('keyup', function (event) {
|
||||
if (event.key === 'Enter') {
|
||||
urlButton.click();
|
||||
}
|
||||
});
|
||||
stateEls.url.addEventListener('input', function (event) {
|
||||
if (stateEls.type.value.length) {
|
||||
stateEls.type.value = '';
|
||||
}
|
||||
});
|
||||
stateEls.type.addEventListener('keyup', function (event) {
|
||||
if (event.key === 'Enter') {
|
||||
urlButton.click();
|
||||
}
|
||||
});
|
||||
|
||||
// run the change handler for the first time
|
||||
stateEls.minified.dispatchEvent(newEvent('change'));
|
||||
};
|
||||
})(window);
|
||||
76
webroot/test/scripts/sources.json
Normal file
76
webroot/test/scripts/sources.json
Normal file
@ -0,0 +1,76 @@
|
||||
[
|
||||
{
|
||||
"name": "This Owncast instance",
|
||||
"uri": "/hls/stream.m3u8",
|
||||
"mimetype": "application/x-mpegurl",
|
||||
"features": ["live"]
|
||||
},
|
||||
{
|
||||
"name": "Owncast Demo Server",
|
||||
"uri": "https://watch.owncast.online/hls/stream.m3u8",
|
||||
"mimetype": "application/x-mpegurl",
|
||||
"features": ["live"]
|
||||
},
|
||||
{
|
||||
"name": "Big Buck Bunny - Adaptive",
|
||||
"uri": "https://test-streams.mux.dev/x36xhzz/x36xhzz.m3u8",
|
||||
"mimetype": "application/x-mpegurl",
|
||||
"features": []
|
||||
},
|
||||
{
|
||||
"name": "Bipbop - Muxed TS with 1 alt Audio, 5 captions",
|
||||
"uri": "https://d2zihajmogu5jn.cloudfront.net/bipbop-advanced/bipbop_16x9_variant.m3u8",
|
||||
"mimetype": "application/x-mpegurl",
|
||||
"features": []
|
||||
},
|
||||
{
|
||||
"name": "Coit Tower drone footage - 4 8 second segment",
|
||||
"uri": "https://d2zihajmogu5jn.cloudfront.net/CoitTower/master_ts_segtimes.m3u8",
|
||||
"mimetype": "application/x-mpegurl",
|
||||
"features": []
|
||||
},
|
||||
{
|
||||
"name": "Boat Video Only",
|
||||
"uri": "https://d2zihajmogu5jn.cloudfront.net/video-only/out.m3u8",
|
||||
"mimetype": "application/x-mpegurl",
|
||||
"features": []
|
||||
},
|
||||
{
|
||||
"name": "Boat Misaligned - 3, 5, 7, second segment playlists",
|
||||
"uri": "https://d2zihajmogu5jn.cloudfront.net/misaligned-playlists/master.m3u8",
|
||||
"mimetype": "application/x-mpegurl",
|
||||
"features": []
|
||||
},
|
||||
{
|
||||
"name": "BBB-CMIF: Big Buck Bunny Dark Truths - demuxed, fmp4",
|
||||
"uri": "https://storage.googleapis.com/shaka-demo-assets/bbb-dark-truths-hls/hls.m3u8",
|
||||
"mimetype": "application/x-mpegurl",
|
||||
"features": []
|
||||
},
|
||||
{
|
||||
"name": "Pseudo-Live PDT test source",
|
||||
"uri": "https://d2zihajmogu5jn.cloudfront.net/pdt-test-source/no-endlist.m3u8",
|
||||
"mimetype": "application/x-mpegurl",
|
||||
"features": [
|
||||
"live"
|
||||
]
|
||||
},
|
||||
{
|
||||
"name": "PDT test source",
|
||||
"uri": "https://d2zihajmogu5jn.cloudfront.net/pdt-test-source/endlist.m3u8",
|
||||
"mimetype": "application/x-mpegurl",
|
||||
"features": []
|
||||
},
|
||||
{
|
||||
"name": "audio only dash, two groups",
|
||||
"uri": "https://d2zihajmogu5jn.cloudfront.net/audio-only-dash/dash.mpd",
|
||||
"mimetype": "application/dash+xml",
|
||||
"features": []
|
||||
},
|
||||
{
|
||||
"name": "video only dash, two renditions",
|
||||
"uri": "https://d2zihajmogu5jn.cloudfront.net/video-only-dash/dash.mpd",
|
||||
"mimetype": "application/dash+xml",
|
||||
"features": []
|
||||
}
|
||||
]
|
||||
Loading…
x
Reference in New Issue
Block a user