Critical Commons video embed full screen & Firefox issue

swelland commented 6 years ago

I remember that we explored this a while ago, but I just noticed that the full screen button on the Critical Commons video embed isn't working correctly (e.g. The Goddess clip). It pops out and then back to the item page. The video doesn't show at all in Safari.

Here's the message the Critical Commons developer sent back then, but I've made sure the embed code matches his workaround suggestion and it still doesn't work. Any thoughts of what else to try?

Hi, All-

Here is the response from my developer (in Athens), explaining a workaround. Thanks for your patience!

-Steve

When you visit a video and select the share option, you get an 'embed' code to paste on your site, eg

If you visit any video now you get the code that correctly uses fullscreen. Unfortunately this wasn't true until the last week, so all video embeds did not contain the "allowfullscreen" tag, thus they didn't resize to fullscreen on the site they have been embedded. We cannot fix this for all the sites that embed videos from criticalcommons.org, because this is actually code stored on their sites (eg on the HTML, database etc). We can point them to correct them, by adding the "allowfullscreen" tag on the embed code, but we can't do anything else. Of course if one gets the code to embed a video now, this will allow resize (the code is generated dynamically on criticalcommons.org).

So all we can suggest to them is if they can edit the embed videos and add the allowfullscreen on the end of the embed code, just as the above video. Hope this makes sense!

zploskey commented 6 years ago

You'll need to not be logged in to the admin site and on the http (not https) version of the site for the video to show up in any browser. There may be an additional workaround required for Safari/Webkit browsers, but I can't easily test it myself since I don't have a mac. Safari has some quirks when it comes to support for fullscreen with nested elements like this.

A couple of references on this issue: https://caniuse.com/#search=fullscreen https://developer.mozilla.org/en-US/docs/Web/API/Fullscreen_API

swelland commented 6 years ago

You are right about it working in Safari in the http version of the site. The fullscreen now works in Safari but not Firefox.

zploskey commented 6 years ago

I'm having a hard time understanding what is causing this, but I am pretty confident that the problem is not on our end. This simple html document that just embeds the iframe shows the same behavior of momentarily going full screen then popping back out in Firefox.

<!doctype html>
<html>
  <head>
    <meta charset="utf-8">
    <title>CC iframe test</title>
  </head>
  <body>
    <iframe
      src="http://www.criticalcommons.org/Members/swelland/clips/the-goddess-exploited-woman-city-of-exploitation-1/embed_view"
      width="630"
      height="460"
      frameborder="0"
      allowfullscreen>
    </iframe>
  </body>
</html>

zploskey commented 6 years ago

This seems to be the same issue: https://github.com/mediaelement/mediaelement/issues/1484

Critical Commons seems to be using 2.14.2 which is an older version. I suspect this may be fixed in a newer version of mediaelement.

zploskey commented 6 years ago

As this is a CC problem, I advise taking it up with them.

zploskey / ExperimentalBeijing

Critical Commons video embed full screen & Firefox issue #43