Clappr player with EcoCDN P2P WebRTC

Example Code:

<html lang="en">
<head>
	<meta charset="UTF-8" />
	<title>Clappr player with EcoCDN P2P WebRTC</title>
	<script src="//cdn.jsdelivr.net/npm/ecocdn/vodjs/sigallv1.min.js"></script>
	<script src="//cdn.jsdelivr.net/npm/[email protected]"></script>
        <script type="text/javascript" src="https://cdn.jsdelivr.net/npm/[email protected]/dist/clappr-pip.min.js"></script>
        <script type="text/javascript" src="https://cdn.jsdelivr.net/npm/[email protected]/lib/clappr-playback-rate-plugin.min.js"></script>
	<style type="text/css">
		@media (max-width: 849px){
			.page-video .preview-box #preview audio, .page-video .preview-box #preview canvas, .page-video .preview-box #preview progress, .page-video .preview-box #preview video, .page-video .preview-box #preview [data-player] {
				width: 100% !important;
				height: 210px!important;
				display: block;
				margin: 0 auto;
			}
		}
	</style>
</head>
<body>
	<div id="player"></div>
	<script>
		var video_url = "https://wowza.peer5.com/live/smil:bbb_abr.smil/playlist.m3u8";
		var player = new Clappr.Player({
			parentId: "#player",
			source: video_url,
			mute: true,
                        plugins: [ClapprPip.PipButton, ClapprPip.PipPlugin, PlaybackRatePlugin],
                playbackRateConfig: {
    			defaultValue: 1,
    			options: [
                		{value: 5, label: '5x'},
				{value: 3, label: '3x'},
				{value: 2, label: '2x'},
				{value: 1, label: '1x'},
				{value: 0.5, label: '0.5x'},
				{value: 0.25, label: '0.25x'},
    			],
    		// rateSuffix: 'x',
  			},
		});
		window.Tracker.initClappr({player: player, video_url: video_url});
	</script>
</body>
</html>