huliu
/
v3_yyz


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164
							<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8" />
  <link rel="icon" href="./public/favicon.ico" />
  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
  <script src="/js/leaderline.js"></script>
  <script src="/config.js"></script>
  <link type="text/css" rel="stylesheet" href="./player.css" />
  <script src="./ueapp.js"></script>
  <script src="./webRtcPlayer.js"></script>
  <title>智慧教室IOC三维系统</title>
  <style>
    * {
      margin: 0;
    }
  </style>
</head>

<body style="width: 100%; height: 100%" onload="load()">
  <div id="overlay" class="overlay text-light bg-dark" style="display: none">
    <div>
      <div id="qualityStatus" class="greyStatus"></div>
      <div id="overlayButton">+</div>
    </div>
    <div id="overlaySettings">
      <div id="kickOthers">
        <div class="settings-text">Kick all other players</div>
        <label class="btn-overlay">
          <input type="button" id="kick-other-players-button" class="overlay-button btn-flat" value="Kick" />
        </label>
      </div>
      <div id="fillWindow">
        <div class="settings-text">Enlarge Display to Fill Window</div>
        <label class="tgl-switch">
          <input type="checkbox" id="enlarge-display-to-fill-window-tgl" class="tgl tgl-flat" />
          <div class="tgl-slider"></div>
        </label>
      </div>
      <div id="qualityControlOwnership">
        <div class="settings-text">Quality control ownership</div>
        <label class="tgl-switch">
          <input type="checkbox" id="quality-control-ownership-tgl" class="tgl tgl-flat" />
          <div class="tgl-slider"></div>
        </label>
      </div>
      <br />

      <section id="encoderSettings">
        <div class="settings-text">Encoder Settings</div>
        <div id="encoderParamsContainer" class="collapse">
          <div class="form-group">
            <label for="encoder-rate-control" class="settings-text">Rate Control</label>
            <select id="encoder-rate-control">
              <option value="CBR" selected>CBR</option>
              <option value="VBR">VBR</option>
              <option value="ConstQP">ConstQP</option>
            </select>
            <label for="encoder-target-bitrate-text">Target Bitrate (kbps)</label>
            <input
              type="number"
              class="form-control"
              id="encoder-target-bitrate-text"
              value="0"
              min="0"
              max="100000" />
            <label for="encoder-max-bitrate-text">Max Bitrate (kbps)</label>
            <input type="number" class="form-control" id="encoder-max-bitrate-text" value="0" min="0" max="100000" />
            <label for="encoder-min-qp-text">Min QP</label>
            <input type="number" class="form-control" id="encoder-min-qp-text" value="0" min="0" max="999" />
            <label for="encoder-max-qp-text">Max QP</label>
            <input type="number" class="form-control" id="encoder-max-qp-text" value="0" min="0" max="999" />
            <label for="encoder-multipass" class="settings-text">Multipass</label>
            <select id="encoder-multipass">
              <option value="DISABLED" selected>DISABLED</option>
              <option value="QUARTER">QUARTER</option>
              <option value="FULL">FULL</option>
            </select>
            <div class="settings-text">Filler Data</div>
            <label class="tgl-switch">
              <input type="checkbox" id="encoder-filler-data-tgl" class="tgl tgl-flat" />
              <div class="tgl-slider"></div>
            </label>
          </div>
          <input id="encoder-params-submit" class="btn btn-primary btn-lg mt-3" type="button" value="Apply" />
        </div>
        <br />
      </section>

      <section id="webRTCSettings">
        <div class="settings-text">WebRTC Settings</div>
        <div id="webrtcParamsContainer" class="collapse">
          <div class="form-group">
            <label for="webrtc-degradation-pref">Degradation Pref</label>
            <select id="webrtc-degradation-pref">
              <option value="BALANCED">BALANCED</option>
              <option value="MAINTAIN_FRAMERATE">MAINTAIN_FRAMERATE</option>
              <option value="MAINTAIN_RESOLUTION">MAINTAIN_RESOLUTION</option>
            </select>
            <label for="webrtc-max-fps-text">Max FPS</label>
            <input type="number" class="form-control" id="webrtc-max-fps-text" value="1" min="1" max="999" />
            <label for="webrtc-min-bitrate-text">Min Bitrate (kbps)</label>
            <input type="number" class="form-control" id="webrtc-min-bitrate-text" value="0" min="0" max="100000" />
            <label for="webrtc-max-bitrate-text">Max Bitrate (kbps)</label>
            <input type="number" class="form-control" id="webrtc-max-bitrate-text" value="0" min="0" max="100000" />
            <label for="webrtc-low-qp-text">Low QP Threshold</label>
            <input type="number" class="form-control" id="webrtc-low-qp-text" value="0" min="0" max="999" />
            <label for="webrtc-high-qp-text">High QP Threshold</label>
            <input type="number" class="form-control" id="webrtc-high-qp-text" value="0" min="0" max="999" />
          </div>
          <input id="webrtc-params-submit" class="btn btn-primary btn-lg mt-3" type="button" value="Apply" />
        </div>
      </section>
      <br />

      <div id="showFPS">
        <div class="settings-text">Show FPS</div>
        <label class="btn-overlay">
          <input type="button" id="show-fps-button" class="overlay-button btn-flat" value="Toggle" />
        </label>
      </div>
      <div id="matchViewportResolution">
        <div class="settings-text">Match Viewport Resolution</div>
        <label class="tgl-switch">
          <input type="checkbox" id="match-viewport-res-tgl" class="tgl tgl-flat" />
          <div class="tgl-slider"></div>
        </label>
      </div>

      <div id="statsPanel">
        <div class="settings-text">Show Stats</div>
        <label class="tgl-switch">
          <input type="checkbox" id="show-stats-tgl" class="tgl tgl-flat" checked />
          <div class="tgl-slider"></div>
        </label>
        <div id="statsContainer" class="statsContainer">
          <div id="stats" class="stats"></div>
        </div>
        <br />
      </div>

      <div id="latencyTest">
        <div class="settings-text">Latency Stats</div>
        <label class="btn-overlay">
          <input type="button" id="test-latency-button" class="overlay-button btn-flat" value="Test Latency" />
        </label>
        <div id="latencyStatsContainer" class="statsContainer">
          <div id="LatencyStats" class="stats">No stats yet...</div>
        </div>
      </div>
    </div>
  </div>
  <div id="app" style="width: 100%; height: 100vh; overflow: hidden"></div>
  <script type="module" src="/src/main.js"></script>
</body>
<style>
  *{
    padding: 0;
    margin: 0;
  }
</style>

</html>