Avatar image for mookalhoys
#1 Edited by MookalHoys (34 posts) -

Hi @wcarle/@rorie/Engineers,

Regarding GB Infinite:

The Twitch player embedded on the GB site does not allow fullscreen, unless the 'pop out' option is used, thus creating a new browser window. To the best of my knowledge, this is not browser, operating system or platform dependent. Nor are browser extensions, ad-blockers etc, I believe it to be implementation related. Or perhaps a limitation of Twitch itself.

I took a 15 minute peek into the JS iframe implementation and noticed the boolean 'allowfullscreen' flag doesn't appear to be set, or not ="true". I don't know how you have everything setup or how you call the element.requestFullscreen() method, but that stuck out to me. When inspecting the 'pop out' player, the flag is set to allow fullscreen.

I also thought vendor prefixes such as webkit/moz were to be or are deprecated, but don't quote me on that.

Specifically:

<div class="player-wrapper js-player-wrapper">

<iframe id="player-iframe" src="/live/livestreams/3" width="100%" height="100%" frameborder="0" scrolling="no" webkitAllowFullScreen mozallowfullscreen allowFullScreen></iframe>

</div>

--OR

<div class="player-wrapper player-wrapper--twitch">

<iframe id="js-iframe-player-1" data-content="&lt;iframe src=&quot;https://player.twitch.tv/?channel=giantbomb8&amp;autoplay=true&quot; frameborder=&quot;0&quot; scrolling=&quot;no&quot; height=&quot;100%&quot; width=&quot;100%&quot;&gt;&lt;/iframe&gt;" scrolling="no" width="100%" height="100%" frameborder=0 webkitAllowFullScreen mozallowfullscreen allowFullScreen></iframe>

</div>

As per both mozilla.org, and the twitch.tv developers guide:

https://developer.mozilla.org/en-US/docs/Web/HTML/Element/iframe

allowfullscreen

This attribute can be set to true if the frame is allowed to be placed into full screen mode by calling its requestFullscreen() method. If this isn't set, the element can't be placed into full screen mode.

https://dev.twitch.tv/docs/embed/

Embed Parameters:

Option - allowfullscreen

Description - If true, the player can go full screen.

Default: true.

Thought I would bug you all in an effort to improve the community, even if through a relatively minor annoyance with the embedded player. I could be completely wrong with how you have things setup, but thought I'd take 15 minutes to throw this your way.

Thanks for all the work you guys do.

Avatar image for mookalhoys
#2 Edited by MookalHoys (34 posts) -

Looks like you've implemented the change!

Not only by looking at GB Infinite, but through the code base change:

<div class="player-wrapper player-wrapper--twitch">

<iframe id="js-iframe-player-1" data-content="&lt;iframe allowfullscreen=&quot;true&quot; src=&quot;https://player.twitch.tv/?channel=giantbomb8&amp;autoplay=true&quot; frameborder=&quot;0&quot; scrolling=&quot;no&quot; height=&quot;100%&quot; width=&quot;100%&quot;&gt;&lt;/iframe&gt;" scrolling="no" width="100%" height="100%" frameborder=0 webkitAllowFullScreen mozallowfullscreen allowFullScreen></iframe>

</div>

Although I didn't hear back from anyone, I would like to thank the support staff/Engs for keeping all of us full of amazing content. I as well as several other duders appreciate your attention to this.

Keep it real,

Mookal

Avatar image for rorie
#3 Posted by Rorie (5194 posts) -
Staff