abc.html

<!DOCTYPE html>
<html>

<head>
  <link rel="stylesheet" type="text/css" href="abc.css">
  <script src="//gstatic.com/cv/js/sender/v1/cast_sender.js"></script>
  <title>ABCDE (Another Basic Cast Dev Example).</title>
</head>

<body>
  <div id="right">
    <h2>ABCDE &mdash; A Basic Cast Dev Example</h2>
    <div id="session_control">
      <button onclick="launchApp()">Launch App</button>
      <button onclick="stopApp()">Stop App</button>
      <button id="joinsessionbyid" onclick="joinSessionBySessionId()">
        Join by Session ID
      </button>
    </div>
    <div id="media_selection">
      <span>URL:</span>
      <input id="media_url" name="media_url" size="70" type="text" value="">
      <br>
      <span>MIME Type:</span>
      <input id="mime_type" name="mime_type" size="30" type="text" value="">
    </div>
    <div id="playback_control">
      <button onclick="loadMedia()">Load Media</button>
      <button id="playpauseresume" onclick="playMedia()">Play</button>
      <button onclick="stopMedia()">Stop Media</button>
      <button id="muteunmute" onclick="muteMedia();">Mute Media</button>
      <button id="getstatus" onclick="getMediaStatus();">Get Status</button>
      <br>
      <span>Volume control:</span>
      <input max="1" min="0" step="0.01" type="range"
             onmouseup="setReceiverVolume(this.value, false);">
      <span>Progress:</span>
      <input id="progress" max="100" min="0" step="1" type="range" value="0"
             onmouseup="seekMedia(this.value);">
    </div>
    <div id="status">
      <span id="duration"></span>
      <div id="progress_tick"></div>
      <span>State:</span>
      <span id="playerstate">IDLE</span>
      <img id="casticon" src="img/cast_icon_idle.png" width="30">
    </div>
    <span>This example has been forked from </span>
    <a href="https://github.com/googlecast/CastHelloVideo-chrome">
      CastHelloVideo-chrome
    </a>
  </div>
  <div id="left">
    <textarea id="console" cols=80 rows=60 readonly></textarea>
  </div>
  <script src="abc.js"></script>
</body>

</html>