%PDF- %PDF-
Mini Shell

Mini Shell

Direktori : /www/varak.net/video.varak.net/videos/Other/
Upload File :
Create Path :
Current File : /www/varak.net/video.varak.net/videos/Other/dash.html

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="utf-8"/>
  <title>DASH.js JW Player Provider</title>

  <script src="http://demo.jwplayer.com/dash-js/dash/dash.all.js"></script>
  <script src="http://demo.jwplayer.com/dash-js/jwplayer/jwplayer.js"></script>
  <script src="http://demo.jwplayer.com/dash-js/providers/html5.provider.dash.js"></script>

  <style>
      body { 
        margin: 10px auto;
        width: 640px;
        font: 14px/20px Helvetica, sans-serif;
      }
      #container {
        line-height: 40px; 
        color: #CCC;
        text-align: center;
        background: #000;
        display: block;
        height: 320px;
        box-shadow: 0 0 5px rgba(0,0,0,0.5);
      }
      #container a {
        color: #128DEB;
        border-bottom: 1px dotted #128DEB;
        text-decoration: none;
      }
      #container a:hover {
        color: #FFF;
        border-bottom: 1px dotted #FFF;
      }
      form { 
        margin: 10px 0 0 0;
        position: relative;
        padding: 0;
      }
      select, input, button { 
        border: 0; 
        border-radius: 3px; 
        display: inline-block;
        margin: 0;
        line-height: 14px;
        background: #EEE;
        color: #CCC;
      }
      select { 
        width: 140px; 
        position: absolute; 
        left: 5px; 
        top: 5px;
        padding: 0;
        background: #128DEB;
      }
      input {
        width: 406px;
        padding: 5px 5px 5px 150px; 
        color: #333;
        border: 1px solid #CCC;
      }
      button { 
        width: 72px; 
        background: #128DEB;
        padding: 6px;
        cursor: pointer;
      }
      button:hover {
        color: #FFF;
      }
      input:focus, button:focus,select:focus { 
        outline: none;
      }
  </style>
  <script>
	(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
	(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
	m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
	})(window,document,'script','//www.google-analytics.com/analytics.js','ga');
	ga('create', 'UA-42148455-1', 'jwplayer.com');
	ga('send', 'pageview');
	</script>
</head>
<body>


<div id='container'>
  You need a <a href="http://www.jwplayer.com/html5/mediasource/">browser with Media Source Extensions</a> for this demo.
</div>
<form>
  <select>
    <option value="">Load MPD...</option>
    <option value="http://samplescdn.origin.mediaservices.windows.net/e0e820ec-f6a2-4ea2-afe3-1eed4e06ab2c/AzureMediaServices_Overview.ism/manifest(format=mpd-time-csf)">Azure VOD</option>
    <option value="http://dash.edgesuite.net/envivio/dashpr/clear/Manifest.mpd">Akamai VOD</option>
    <!-- <option value="http://demo.unified-streaming.com/video/oceans/oceans.ism/oceans.mpd">USP VOD</option> -->
    <option value="http://wowzaec2demo.streamlock.net/vod/smil:bigbuckbunny.smil/manifest.mpd">Wowza VOD</option>
    <option value="http://54.201.151.65/livesim/tfdt_32/testpic_2s/Manifest.mpd">EBU Live</option>
    <!-- <option value="http://live.unified-streaming.com/loop/loop.isml/loop.mpd">USP Live</option> -->
    <!-- <option value="http://wowza.jwplayer.com:1935/live/jelly.stream/manifest.mpd">Wowza Live</option> -->
  </select>
  <input type="text" value="https://video.varak.net/videos/Other/dash/manifest.mpd">
  <button type="submit">Go</button>
</form>

<script>
  jwplayer.key = 'LJu3LqXr6x1yi4MI'
  function loadMPD(a) {
    var o = {
      file: 'dummy.mpd',
      autostart: a,
      fallback: false,
      width: 640,
      height: 320
    }
    var f = document.querySelector("input").value;
    if(f) o.file = f;
    jwplayer('container').setup(o);
  };

  document.querySelector("select").addEventListener("change",function(e){
    if(this.value) {
      document.querySelector("input").value = this.value;
      loadMPD(true);
      this.value = "";
    }
  },false);
  document.querySelector("form").addEventListener("submit",function(e){
    e.preventDefault();
    loadMPD(true);
  },false);

  loadMPD(false);
</script>

<script>
var hasPlayed = false;

jwplayer().onBeforePlay(function(event) {
	if(hasPlayed == false){
		ga('send', 'event', 'Video', 'Play');
		hasPlayed = true;
	}
});
</script>

</body>
</html>

Zerion Mini Shell 1.0