Skip to content

Instantly share code, notes, and snippets.

@vgrafe
Created April 5, 2017 20:36
Show Gist options
  • Select an option

  • Save vgrafe/d4abc450d94d3757e897de068c023b1d to your computer and use it in GitHub Desktop.

Select an option

Save vgrafe/d4abc450d94d3757e897de068c023b1d to your computer and use it in GitHub Desktop.

Revisions

  1. vgrafe created this gist Apr 5, 2017.
    50 changes: 50 additions & 0 deletions index.html
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,50 @@
    <!DOCTYPE html>
    <html>
    <head>
    <title>Basic MediaPlayer</title>

    <!-- the fopllowing files can be found here https://github.com/Microsoft/TVHelpers/tree/master/tvjs/src -->
    <link href="../../../src/MediaPlayer/mediaplayer-1.0.0.0.css" rel="stylesheet" />
    <script src="../../../src/DirectionalNavigation/directionalnavigation-1.0.0.0.js"></script>
    <script src="../../../src/MediaPlayer/mediaplayer-1.0.0.0.js"></script>

    <style>

    body {
    overflow: hidden;
    background-color: rgb(16, 16, 16);
    }

    section {
    height: 100vh;
    width: 100vw;
    }

    </style>

    </head>
    <body>
    <section>
    <div id="mediaPlayer">
    <video
    autoplay='autoplay'
    preload='auto'
    src="https://your-lengthy-m3u8-comes-here"
    autoplay="autoplay"></video>
    </div>
    </section>

    <script>

    var mediaPlayer = new TVJS.MediaPlayer(document.getElementById("mediaPlayer"));

    // removes safe-zone padding on xbox
    if(window.Windows && window.Windows.UI && window.Windows.UI.ViewManagement){
    var applicationView = Windows.UI.ViewManagement.ApplicationView.getForCurrentView();
    applicationView.setDesiredBoundsMode(Windows.UI.ViewManagement.ApplicationViewBoundsMode.useCoreWindow);
    }


    </script>
    </body>
    </html>