<html lang="en">
<head>
<meta charset="UTF-8" />
<title>Clappr player with hls.js </title>
<script src="//cdn.jsdelivr.net/npm/ecocdn/vodjs/sigallv1.min.js"></script>
<script type="text/javascript" src="https://cdn.jsdelivr.net/npm/clappr@latest/dist/clappr.min.js"></script>
<!--script src="//cdn.jsdelivr.net/npm/[email protected]/dist/clappr.min.js"></script>-->
<script type="text/javascript" src="https://cdn.jsdelivr.net/npm/clappr-pip@latest/dist/clappr-pip.min.js"></script>
<script type="text/javascript" src="https://cdn.jsdelivr.net/npm/clappr-playback-rate-plugin@latest/lib/clappr-playback-rate-plugin.min.js"></script>
<!--script type="text/javascript" src="//cdn.jsdelivr.net/gh/ewwink/clappr-quality-selector-plugin@latest/quality-selector.js"></script>-->
<!--script src="https://cdn.jsdelivr.net/npm/clappr@latest"></script>-->
<!--script type="text/javascript" src="http://cdn.clappr.io/latest/clappr.min.js"></script>-->
<!--script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/clappr-pip-plugin.min.js"></script>-->
<!--script type="text/javascript" src="https://cdn.jsdelivr.net/npm/clappr-pip-plugin@latest/dist/clappr-pip-plugin.js"></script>-->
<!--style>
#video {
width: 720px;
margin-left: auto;
margin-right: auto;
display: block;
}
</style>-->
</head>
<body>
<div id="player"></div>
<script>
var video_url = "https://multiplatform-f.akamaihd.net/i/multi/april11/sintel/sintel-hd_,512x288_450_b,640x360_700_b,768x432_1000_b,1024x576_1400_m,.mp4.csmil/master.m3u8";
var player = new Clappr.Player({
parentId: "#player",
source: video_url,
plugins: [ClapprPip.PipButton, ClapprPip.PipPlugin, PlaybackRatePlugin],
mute: true,
autostart:false,
height: 360,
width: 640,
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, mode: "VOD"});
</script>
</body>
</html>