google-youtube icon indicating copy to clipboard operation
google-youtube copied to clipboard

Fullscreen mode

Open BLamy opened this issue 9 years ago • 3 comments

I'd like to see a requestFullScreen method added to google-youtube so I can full screen my videos using my own chrome.

BLamy avatar Mar 14 '16 15:03 BLamy

This is trivial to do without a fullscreen property:

<html>
<head>
<base href="https://polygit2.appspot.com/">  
<script src="webcomponentsjs/webcomponents-lite.min.js"></script>
<link rel="import" href="components/google-youtube/google-youtube.html">
</head>
<body>

<google-youtube
  video-id="mN7IAaRdi_k"
  height="270px"
  width="480px"
  rel="0"
  start="5"
  autoplay="1">
</google-youtube>

  <button onclick="playFullscreen()">fullscreen</button>

<script>
function playFullscreen () {
  var video = document.querySelector('google-youtube');
  var requestFullScreen = video.requestFullScreen || video.mozRequestFullScreen || video.webkitRequestFullScreen;
  if (requestFullScreen) {
    requestFullScreen.bind(video)();
  }
}  
</script>
</body>
</html>

ebidel avatar Mar 14 '16 18:03 ebidel

That's actually exactly what I was talking about, however, I was suggesting that the cross-browser code be abstracted behind this web component.

fullScreen: function() {
  var requestFullScreen = this.requestFullScreen || this.mozRequestFullScreen || this.webkitRequestFullScreen;
  if (requestFullScreen) {
    requestFullScreen.bind(this)();
  }
}

Personally, I think a fullscreen method kind of just 'fits' next to all of the convenience methods like play/pause: https://github.com/GoogleWebComponents/google-youtube/blob/master/google-youtube.html#L459

BLamy avatar Mar 14 '16 19:03 BLamy

Yea, I agree. It would be useful to just have this work. Want to submit a PR? Getting the sizing of the internal iframe right will be the tricky part. The FS API also needs to be triggered by a user-action, so calling it won't do much unless it's tied to custom UI (button click etc.)

ebidel avatar Mar 14 '16 19:03 ebidel