dvlden / ultrawideo-v2

Upscale or stretch any video on the web, to make it look great on UltraWide screens.
MIT License
133 stars 20 forks source link

Bottom of video cut off on channel4.com (UK) - with work-around #50

Closed jrawle closed 3 years ago

jrawle commented 3 years ago

Excellent extension, seems to work great in general. However, it does not work correctly for me for videos on channel4.com. It cuts the bottom off the video when the extension is enabled, even in "normal" mode. Pausing the extension restores the full video.

channel4.com always looks strange in fullscreen to me. Instead of centring the video vertically, it is always displayed at the top at the screen, with horizontal black bar only at the bottom. I suspect this is due to my having a 16:10 monitor, and the video player wrongly assuming everyone's screen is 16:9, but I can't test that.

I already had a CSS hack for that, but I have just spent some time altering it, and I now have a solution that enables ultrawideo to work correctly for channel4.com. (It still fixes the centring issue without the extension enabled, too.)

In userChrome.css I have:

@-moz-document domain(www.channel4.com) {
    .full_screen .player__video__app { height: 100vh!important }
    .full_screen .player__video__container { height: 100vh!important }
}

I'm not sure whether this can be incorporated into the extension.

channel4.com is free to view, but I'm not sure if it's available outside the UK.

Tested in Firefox 86.0 on Linux x86_64. The bug is also present in Chrome.

dvlden commented 3 years ago

Hello,

Thank you for opening up this issue. Some platforms do require a couple of CSS workarounds, fortunately it's just simple CSS, usually a line or two.

I registered on the platform and yes, it appears to be UK only. I will attempt to run it through free TunnelBear and see how it goes.

If you exclude that Mozilla media rule, does it solve the bug in Chrome as well?

jrawle commented 3 years ago

I have tested it with Chrome and the "User CSS" extension (I don't normally use Chrome, and there doesn't seem to be a native way to add CSS, is that right?) It works fine.

jrawle commented 3 years ago

I have to say that this isn't really a bug with your extension, but rather with the Channel 4 site. It looks much better with this CSS even with your extension disabled. However, I'm not sure I have the patience to try and contact them to report this issue, as in my experience most companies assume everyone has zero technical knowledge and simply copy and paste a script of how to fix an unrelated, simple problem.

dvlden commented 3 years ago

I have 34" UltraWide screen (21:9 AR) and this Channel4 platform is working fine. The only problem that I noticed is that the controls (seek, play/pause, time) is not present while in full-screen, due to their JS calculations that sets an inline-style height property to a huge size.

Checked provided CSS block and it does solve that issue for me. I trust that it solved another problem as well for a different aspect ratio screens, so I'll be adding this to the extension immediately, as it requires no additional research and implementation is just CSS.

dvlden commented 3 years ago

Thank you @jrawle for the issue and the solution. I tested it locally and it works. Also added width: 100vw as I saw that they alter that too, so better safe than sorry. Hope it won't affect the issue that you're having negatively.