153 lines
		
	
	
	
		
			4.3 KiB
		
	
	
	
		
			HTML
		
	
	
	
	
	
			
		
		
	
	
			153 lines
		
	
	
	
		
			4.3 KiB
		
	
	
	
		
			HTML
		
	
	
	
	
	
<html>
 | 
						|
  <head>
 | 
						|
    <title>Embed test</title>
 | 
						|
    
 | 
						|
    <!--
 | 
						|
      include script for paid players
 | 
						|
      - jwplayer
 | 
						|
      - theoplayer
 | 
						|
    -->
 | 
						|
    
 | 
						|
    <!--<script type='text/javascript' src='//cdn.theoplayer.com/latest/41718edc-cc2d-40d0-83d4-67c50c60f68f/theoplayer.loader.js'></script>-->
 | 
						|
    <!--<script src=players/jwplayer.js></script>
 | 
						|
    <script>jwplayer.key="2z0zTRsxD2HkL6m/LgDqvtUy2EThVn+gk1gN1Q==";</script>-->
 | 
						|
    
 | 
						|
    <script>
 | 
						|
      // global options can be set here
 | 
						|
      var mistoptions = {
 | 
						|
        host: 'http://cattop:8080'
 | 
						|
      };
 | 
						|
    </script>
 | 
						|
    
 | 
						|
    <script src=core.js></script>
 | 
						|
    <script src=wrappers/theoplayer.js></script>
 | 
						|
    <script src=wrappers/jwplayer.js></script>
 | 
						|
    <script src=wrappers/html5.js></script>
 | 
						|
    <script src=wrappers/dashjs.js></script>
 | 
						|
    <script src=wrappers/flash_strobe.js></script>
 | 
						|
    <script src=wrappers/silverlight.js></script>
 | 
						|
    <script src=wrappers/polytrope.js></script>
 | 
						|
    
 | 
						|
    <script src=players/dash.js></script>
 | 
						|
 | 
						|
    <link rel=stylesheet href=mist.css id=mist_player_css>
 | 
						|
    <style>
 | 
						|
      /* the website can override the css at will */
 | 
						|
      
 | 
						|
      body {
 | 
						|
        padding: 0;
 | 
						|
        margin: 0;
 | 
						|
        max-width: 100vw;
 | 
						|
        max-height: 100vh;
 | 
						|
      }
 | 
						|
      .mistvideo {
 | 
						|
        margin: 1px;
 | 
						|
      }
 | 
						|
      
 | 
						|
    </style>
 | 
						|
    
 | 
						|
    
 | 
						|
    
 | 
						|
    <script>
 | 
						|
    
 | 
						|
    
 | 
						|
      function mistinit(){
 | 
						|
        document.addEventListener('error',function(e){
 | 
						|
          console.log('[Error] '+e.message,e.target);
 | 
						|
        },true);
 | 
						|
        document.addEventListener('log',function(e){
 | 
						|
          console.log('[log] '+e.message)
 | 
						|
          var msg = document.createTextNode('['+(new Date()).toTimeString().split(' ')[0]+'] '+e.message);
 | 
						|
          var div = document.createElement('div');
 | 
						|
          div.appendChild(msg);
 | 
						|
          document.body.appendChild(div);
 | 
						|
        },true);
 | 
						|
        
 | 
						|
        //tryplayers = Object.keys(mistplayers);
 | 
						|
        tryplayers = [];
 | 
						|
        tryplayers.push('html5');
 | 
						|
        //tryplayers.push('dashjs');
 | 
						|
        //tryplayers.push('flash_strobe');
 | 
						|
        //tryplayers.push('silverlight');
 | 
						|
        
 | 
						|
        for (var i in tryplayers) {
 | 
						|
          var c = document.createElement('div');
 | 
						|
          c.className = 'mistvideo';
 | 
						|
          c.title = tryplayers[i];
 | 
						|
          document.body.appendChild(c);
 | 
						|
          //mistPlay('live',{
 | 
						|
          //mistPlay('vids+mist.mp4',{
 | 
						|
          //mistPlay('lama',{
 | 
						|
          mistPlay('bunny',{
 | 
						|
            target: c,
 | 
						|
            forcePlayer: tryplayers[i],
 | 
						|
            loop: true
 | 
						|
          });
 | 
						|
        }
 | 
						|
        
 | 
						|
        
 | 
						|
      };
 | 
						|
      
 | 
						|
      /*
 | 
						|
      thumbnailing :')
 | 
						|
      document.addEventListener('initialized',function(e){
 | 
						|
        var canvas = document.createElement('canvas');
 | 
						|
        canvas.width = 180;
 | 
						|
        document.body.appendChild(canvas);
 | 
						|
        var context = canvas.getContext('2d');
 | 
						|
        var embedded;
 | 
						|
        for (var i in mistvideo) {
 | 
						|
          embedded = mistvideo[i].embedded[0];
 | 
						|
          break;
 | 
						|
        }
 | 
						|
        var video = embedded.player.element;
 | 
						|
        var f = video.width / canvas.width;
 | 
						|
        canvas.height = video.height / f;
 | 
						|
        video.addEventListener('canplay',function(){
 | 
						|
          context.drawImage(video,0,0,canvas.width,canvas.height);
 | 
						|
          var img = canvas.toDataURL('image/jpeg');
 | 
						|
          document.write('<img src="'+img+'">');
 | 
						|
        });
 | 
						|
      });
 | 
						|
      */
 | 
						|
    </script>
 | 
						|
    
 | 
						|
  </head>
 | 
						|
  <body onload=mistinit()>
 | 
						|
  <h1>Sup</h1>
 | 
						|
  <!--
 | 
						|
    <div class='mistvideo' id='bunny_84yt98eh9g8ht'>
 | 
						|
      <noscript>
 | 
						|
        <video controls autoplay>
 | 
						|
          <source src='http://localhost:8080/bunny.mp4' type='video/mp4'>
 | 
						|
          <a href='http://localhost:8080/bunny.html' target='_blank'>
 | 
						|
            Click here to play video
 | 
						|
          </a>
 | 
						|
        </video>
 | 
						|
      </noscript>
 | 
						|
      <script>
 | 
						|
        (function(){
 | 
						|
          var play = function(){
 | 
						|
            mistPlay('vids+subtel.mp4',{
 | 
						|
            //mistPlay('bunny',{
 | 
						|
              target: document.getElementById('bunny_84yt98eh9g8ht'),
 | 
						|
              //forcePlayer: 'dashjs'
 | 
						|
            });
 | 
						|
          }
 | 
						|
          if (!window.mistplayers) { //import shit
 | 
						|
            var p = document.createElement('script');
 | 
						|
            p.src = 'http://localhost:8080/player.js';
 | 
						|
            document.head.appendChild(p);
 | 
						|
            p.onload = function(){
 | 
						|
              play();
 | 
						|
            }
 | 
						|
          }
 | 
						|
          else {
 | 
						|
            play();
 | 
						|
          }
 | 
						|
        })();
 | 
						|
      </script>
 | 
						|
    </div>-->
 | 
						|
    
 | 
						|
  </body>
 | 
						|
</html>
 |