CODEWITHSUNDEEP
google-castchromecast
Rohit
Rohit

Reputation: 2681

how receiver app receives the url from sender app in chrome-cast

My question is straightforward..

When we select any url for media from sender app, and click on cast icon that video is getting played. As all of us know that chrome-cast supports HTML5 <video> tag which needs any URI to play video. So when we select any URL from sender app, so <video> is getting it as src attribute in it and plays it.

<html>
  <script src="https://www.gstatic.com/cast/js/receiver/1.0/cast_receiver.js">
  </script>
  <script type="text/javascript">

    cast.receiver.logger.setLevelValue(0);

    // Initialize and start the media playing receiver
    var receiver = new cast.receiver.Receiver(
        'YOUR_APP_ID_HERE', 
        [cast.receiver.RemoteMedia.NAMESPACE],
        "",
        5);
    var remoteMedia = new cast.receiver.RemoteMedia();
    remoteMedia.addChannelFactory(
        receiver.createChannelFactory(cast.receiver.RemoteMedia.NAMESPACE));

    receiver.start();

    window.addEventListener('load', function() {
      var elem = document.getElementById('vid');
      remoteMedia.setMediaElement(elem);

      var checkStatus = function() {
        var status = document.getElementById('status');
        var st = remoteMedia.getStatus()['state'];

        if( st == 0 || remoteMedia.getStatus()['current_time'] == 0 ) {
            status.style.display = 'block';
        }
        else {
            if( st == 1 && remoteMedia.getStatus()['current_time'] > 0 ) {
                status.innerHTML = 'Paused...';
                status.style.display = 'block';
            }
            else {
                status.innerHTML = remoteMedia.getStatus()['current_time'];
                status.style.display = 'none';
                elem.style.display = 'block';
            }
        }
      }
      setInterval(checkStatus, 1000);
    });
  </script>
  <title>Media Player App</title>
  <body>
    <video id="vid"
           style="position:absolute;top:0;left:0;height:100%;width:100%">
    <div id="status" style="display:none; font-size:300%; position:absolute;top:40%;left:40%;">
      <img src="/images/chrome_loading.gif" width="60%">
    </div>
  </body>
</html>

So here my question is in receiver.html file, we are not providing any src attribute to <video> So which Receiver API is being called to perform this action??

Upvotes: 0

Views: 1658

Answers (1)

Ali Naddaf
Ali Naddaf

Reputation: 19074

The following lines in your receiver identify and set the "video" element for the library:

var elem = document.getElementById('vid');
remoteMedia.setMediaElement(elem);

and the rest is handled by the javascript library that you include in your receiver (i.e. cast_receiver.js)

Upvotes: 1

Related Questions