UNPKG

@skylineos/clsp-player

Version:

Skyline Technology Solutions' CLSP Video Player. Stream video in near-real-time in modern browsers.

168 lines (163 loc) 4.81 kB
<!doctype html> <html> <head> <meta charset="utf-8"> <title>CLSP Player Advanced Demo ~ SRC ~</title> <link rel="shortcut icon" href="../favicon.ico" > <link rel="stylesheet" href="../../dist/demos/advanced-src.css" > <script type="text/javascript" src="../../dist/demos/advanced-src.js" ></script> </head> <body> <div class="header"> <a href=".."> <img src="../skyline-logo.svg" /> </a> <h1 id="page-title">CLSP Player Advanced Demo <br /> ~ SRC ~</h1> </div> <div class="page-body"> <section class="wall"> <div class="monitor"> <button id="wall-controls-toggle" data-state="shown" >Hide Controls</button> <div id="wallSummary" class="summary" > <span>Total videos playing:</span> <h2 id="wallTotalVideos">N/A</h2> <span>Time Elapsed:</span> <h2 id="wallDuration">N/A</h2> <span>Time Started:</span> <span id="wallStartTime">N/A</span> <span>Heap Size Limit:</span> <span id="wallHeapSizeLimit">N/A</span> <span>Total Heap Size:</span> <span id="wallTotalHeapSize">N/A</span> <span>Used Heap Size:</span> <h2 id="wallUsedHeapSize">N/A</h2> </div> </div> <div class="controls"> <div class="stream-configs"> <div class="stream-config wall-stream-config"> <div class="title"> <span>Urls:</span> </div> <textarea id="wall-streams" rows="25" ></textarea> <div class="stream-options"> <div> <label for="wall-enabled"> <input id="wall-enabled" type="checkbox" /> <span>Enable</span> </label> </div> <div> <span>Times to Replicate</span> <input id="wall-times-to-replicate" value="1" type="number" /> </div> </div> </div> <div class="stream-config tours-stream-config"> <div class="title"> <span>Tour Urls:</span> </div> <textarea id="tour-streams" rows="25" disabled ></textarea> <div class="stream-options"> <div> <label for="tours-enabled"> <input id="tours-enabled" type="checkbox" disabled /> <span>Enable</span> </label> </div> <div> <span>Times to Replicate</span> <input id="tour-times-to-replicate" value="1" type="number" disabled /> </div> <div> <span>Times to Repeat Within Tour</span> <input id="tour-times-to-repeat" value="1" type="number" disabled /> </div> <div> <span>Tour Interval (seconds):</span> <input id="tour-interval" value="10" type="number" disabled /> </div> </div> </div> </div> <div class="options-actions-container"> <div class="options"> </div> <div class="actions"> <button id="wallCreate">Create Video Wall</button> </div> </div> </div> <div id="videowall"></div> </section> </div> <template id="wall-video-template"> <div id="wall-container-null" class="player-container" > <div class="video-stream"> <span class="index"></span> <span class="url"></span> <button class="close">&times;</button> </div> <div class="video-container"> <div class="clsp-player-container"> <video muted playsinline ></video> </div> </div> </div> </template> </body> </html>