HeNy007 · January 1, 2023 23:29
diff --git a/index.html b/index.html
 <div class="container">
 	<video controls crossorigin playsinline poster="https://ia800603.us.archive.org/30/items/Tears-of-Steel/tos-poster.jpg"></video>
 </div>
 <!-- Plyr resources and browser polyfills are specified in the pen settings -->
 <script src="https://cdnjs.cloudflare.com/ajax/libs/shaka-player/2.4.0/shaka-player.compiled.js">
diff --git a/script.babel b/script.babel
 document.addEventListener('DOMContentLoaded', () => {
 	const source = 'https://demo.unified-streaming.com/video/tears-of-steel/tears-of-steel-en.ism/.mpd';
 	const video = document.querySelector('video');
 	// For options (second argument) see: https://github.com/sampotts/plyr/#options
 	const player = new Plyr(video);
 	
 	// Expose player so it can be used from the console
 	window.player = player;
 	
 	// Install built-in polyfills
 	shaka.polyfill.installAll();

 	// For more Shaka Player options, see: https://github.com/google/shaka-player
 	if (shaka.Player.isBrowserSupported()) {
 		const shakaInstance = new shaka.Player(video);
 		shakaInstance.load(source);
 	} else {
 		console.warn('Browser is not supported!');
 	}
 });
diff --git a/scripts b/scripts
 <script src="https://cdn.polyfill.io/v2/polyfill.min.js?features=es6,Array.prototype.includes,CustomEvent,Object.entries,Object.values,URL"></script>
 <script src="https://cdn.jsdelivr.net/npm/plyr@3"></script>
diff --git a/style.css b/style.css
 .container {
 	margin: 20px auto;
 	width: 600px;
 	height: 268px;
 }
diff --git a/styles b/styles
 <link href="https://cdn.jsdelivr.net/npm/plyr@3/dist/plyr.css" rel="stylesheet" />
diff --git a/wayvjq.markdown b/wayvjq.markdown
	<div class="container">
	<video controls crossorigin playsinline poster="https://ia800603.us.archive.org/30/items/Tears-of-Steel/tos-poster.jpg"></video>
	</div>
	<!-- Plyr resources and browser polyfills are specified in the pen settings -->
	<script src="https://cdnjs.cloudflare.com/ajax/libs/shaka-player/2.4.0/shaka-player.compiled.js">
	document.addEventListener('DOMContentLoaded', () => {
	const source = 'https://demo.unified-streaming.com/video/tears-of-steel/tears-of-steel-en.ism/.mpd';
	const video = document.querySelector('video');
	// For options (second argument) see: https://github.com/sampotts/plyr/#options
	const player = new Plyr(video);

	// Expose player so it can be used from the console
	window.player = player;

	// Install built-in polyfills
	shaka.polyfill.installAll();

	// For more Shaka Player options, see: https://github.com/google/shaka-player
	if (shaka.Player.isBrowserSupported()) {
	const shakaInstance = new shaka.Player(video);
	shakaInstance.load(source);
	} else {
	console.warn('Browser is not supported!');
	}
	});
	<script src="https://cdn.polyfill.io/v2/polyfill.min.js?features=es6,Array.prototype.includes,CustomEvent,Object.entries,Object.values,URL"></script>
	<script src="https://cdn.jsdelivr.net/npm/plyr@3"></script>