Is it possible to hide progress bar on Chromecast receiver side on live streams?

1k Views Asked by At

I would like to remove progress bar from CAF receiver while playing live stream

2

There are 2 best solutions below

0
On

A bit late but for the ones still facing the issue:

cast-media-player is a custom element, thus, including a shadow DOM you won't change directly. All full-screen controls seem included in the sub custom element tv-overlay

So you can either access/change this element with:

document.querySelector("cast-media-player").shadowRoot.querySelector("tv-overlay").style.display = 'none';

You can potentially attach a new style sheet element to cast-media-player from your main page:

var style = document.createElement('style')
style.innerHTML = 'tv-overlay { display:none; }';
document.querySelector('cast-media-player').shadowRoot.appendChild(style)

Eventually, to debug your DOM/css receiver, you can access your receiver page with on Google Chrome though the URL chrome://inspect/#devices, and then click inspect on your device.

Screenshot of the Chrome device tab

2
On

https://developers.google.com/cast/docs/caf_receiver/customize_ui

try setting the progress color to a transparent value

cast-media-player {
  --progress-color: rgba(0, 0, 0, 0.0);
}

also, use the inspector and check the DOM - this one should be

.player .controls-progress {
  display: none;
}