1115590 - The video from youku.com cannot fill out full screen device width when played in landscape.

Status: RESOLVED FIXED

(Web Compatibility :: Site Reports, defect)

Description

[xshen]

Attachment: Screenshot

Precondition:
Enable rotate feature.

1)Hold the phone in portrait mode, open Fennec and go to youku.com, click on a video.(or 
http://v.youku.com/v_show/id_XODU2MDQwMTc2_ev_1.html?x&from=y11.3-idx-grid-1519-9909.86807.1-1)

2)Wait for the advertise ends if any , click on the video screen to launch full screen option(located in the right bottom of the video window,See picture 1 in the screenshot.). Click on full screen. 

3)The video is played in the center of the screen, then rotate the phone to landscape manually.

4)The video is played in only small space of the screen.Please see picture 2 in the screenshot. 


Fennec version:
v35.0 beta (release date: 12/20/2014)

Comment 1

[Aaron Train [:aaronmt]]

Attachment: screenshot.png

I'm not able to reproduce this (Nexus 6, Nightly 01/07), ignore the inverted video there's a bug on file.

WFM.

Comment 2

[xshen]

(In reply to Aaron Train [:aaronmt] from comment #1)
> Created attachment 8545429 [details]
> screenshot.png
> 
> I'm not able to reproduce this (Nexus 6, Nightly 01/07), ignore the inverted
> video there's a bug on file.
> 
> WFM.

I am able to reproduce this(Samsung Galaxy S4), Nightly from 
ftp://ftp.mozilla.org/pub/mobile/nightly/2015-01-07-03-02-17-mozilla-central-android-api-11/en-US/

youku.com is a very popular video site in China. 

The steps are:

1)Hold the mobile in portrait mode, open Fennec and go to any video (see picture 1 in screenshot)
e.g: http://v.youku.com/v_show/id_XODU2MDQwMTc2_ev_1.html?x&from=y11.3-idx-grid-1519-9909.86807.1-1 

2)Click on the full screen mode, keep the mobile in portrait.(see picture 2 in screenshot)
If you hold the mobile in landscape then click on the full mode, the issue is not observed. 


3)Rotate the mobile to landscape (see picture 3 in screenshot)

Comment 3

[xshen]

Attachment: steps123-screenshot

Comment 4

[Aaron Train [:aaronmt]]

Mike in mobile triage we think this might be a player issue on fullscreen on this site, can you take a look?

Comment 5

[Mike Taylor [:miketaylr]]

I can reproduce the steps in Comment 2. Let me take a closer look.

Comment 6

[Mike Taylor [:miketaylr]]

This basically boils down to the assumption that all browsers support window.orientation and orientationchange.

In ph.js (http://static.youku.com/v1.0.1016/x/js/ph.js):

OnSwitchFullScreen() is called when the user touches the fullscreen button. That adjusts the player width, adds a "fullscreen" class to the body element (which hides everything else) and sets the width for the body and ".yk-m" containers. That all works for us the first time it happens.

The problem is that when you change orientations, we never fall into any of the code paths that resize everything (the video is resized appropriately--but the body and ".yk-m" wrappers aren't and they have overflow:hidden.

onPlayerReadyH5 sets up a listener for window.addEventListener("orientationchange", autoFullscreen, !1), which would eventually land back into OnSwitchFullScreen. Since we don't support that (or window.orientation which is used all over), we never get the other elements resized.

The simplest workaround for this would be to suggest that they also put in the code that resizes the body and ".yk-m" elements inside of their resize handler--which is how the player gets resized appropriately for us, also in ph.js:

window.addEventListener("resize", function() {
    playerWidth();
    setTimeout("playerWidth();", 800);
}, !1);

Comment 7

[Mike Taylor [:miketaylr]]

I set this as a blocker to 920734, but I still think we should try to do evangelism.

Comment 8

[Mark Finkle (:mfinkle) (use needinfo?)]

xshen - Looks like this is a situation where we should try to get the website to change their code.

Comment 9

[xshen]

We are contacting youku.com and wait for their response.

Comment 10

[Mike Taylor [:miketaylr]]

This works correctly now (w/ window.orientation support).