If you don't find an answer, please click here to post your question.
Reply
Highlighted
Occasional Advisor
Posts: 13
Registered: ‎04-09-2015
Accepted Solution

Ooyala v4 player volume UI breaks on certain width viewports (.oo-xsmall)

Hey again,


We have just ran into an issue where the volume slider, isn't able to selected as per normal, and visually looks quite cluttered, at certain viewport resolutions. Screenshots / elaboration below.

 

Replication steps:

  1. Using the embed example from https://help.ooyala.com/video-platform/reference/pbv4_web_examples.html
    1. Attach inline style on body to remove any margin (to get the width the volume issue appears at)
      1. <body style="margin: 0;">
    2. Replace YOUR_PLAYER_ID with a valid Ooyala V4 player ID
    3. Remove the style tag from #container (issue is with a responsively sized player)
    4. Replace YOUR_ASSET_ID with a valid media ID
  2. Decrease the width of the viewport until it is 560px wide (the player at this point also takes 560px in width)
    1. Should look somewhat like this
        1. (ignoring my slightly modified HTML underneath)
  3. Decrease down to a width of 559px
  4. It should now look like this
  5. In this state the volume slider doesn't visually indicate changes in volume via click events
  6. It also looks a bit 'wrong' - but the lack of functionality/visual of functionality is the real problem
  7. Looking at the DOM, I can see this happens when the class .oo-xsmall pops in and out
  8. We could modify our own version of skin.json to redefine these breakpoints
    1. But, we'd prefer you guys host it, so we don't have to worry about syncing it whenever a change is pushed
    2. And this isn't really solving the 'root' cause, it seems like a bandaid fix

Very keen to hear back.

Thanks for your time :)

 

Cheers.


Accepted Solutions
Occasional Advisor
Posts: 13
Registered: ‎04-09-2015

Re: Ooyala v4 player volume UI breaks on certain width viewports (.oo-xsmall)

Support responded.

There is a page in backlot tucked away:

1. Log into Backlot.
2. Go to Publish > Player Branding.
3. Select the player that you are using.
4. In the "Player" tab, select "Latest" option in "Release Version" dropdown list, rather than production.

I couldn't find any support articles explaining that this can be done, nor that this bug exists.

Closest I got was this: http://help.ooyala.com/video-platform/tasks/player_create.html

Just posting in case anyone else runs into this..

View solution in original post


All Replies
Ooyalan
Posts: 26
Registered: ‎01-03-2017

Re: Ooyala v4 player volume UI breaks on certain width viewports (.oo-xsmall)

Hi 

 

 

 

 

Occasional Advisor
Posts: 13
Registered: ‎04-09-2015

Re: Ooyala v4 player volume UI breaks on certain width viewports (.oo-xsmall)

Thank you for the quick response.
I will create a case with your technical team.

For any travellers that may have the same issue though, I will just add that:

Our V4 player ID brings down 'releaseVersion' 4.14.9 (not the suggested 4.20.7).

There isn't any obvious way to "upgrade" this.
Our player ID hasn't changed in backlot and there doesn't seem to an obvious pathway to update this.
Occasional Advisor
Posts: 13
Registered: ‎04-09-2015

Re: Ooyala v4 player volume UI breaks on certain width viewports (.oo-xsmall)

Support responded.

There is a page in backlot tucked away:

1. Log into Backlot.
2. Go to Publish > Player Branding.
3. Select the player that you are using.
4. In the "Player" tab, select "Latest" option in "Release Version" dropdown list, rather than production.

I couldn't find any support articles explaining that this can be done, nor that this bug exists.

Closest I got was this: http://help.ooyala.com/video-platform/tasks/player_create.html

Just posting in case anyone else runs into this..