Play icon on pause screen causes OLED burn-in - SOLUTION and request

Server Version#: Last few years of updates through current stable build.
Player Version#: Last few years of updates through current stable build.

TL;DR: The orange play icon in the middle of the screen when paused causes burn-in on OLEDs.

Solution at the bottom if you’re using your own server and not opposed to manipulating CSS.

Hi All,

I need to preface this by saying that I love the Plex web player. I primarily use that to consume my media, and it puts browsing/playing from multi-billion dollar companies’ web interfaces to shame. e.g. Netflix, Hulu, Amazon, and even the horrid YouTube TV’s web UIs/UXs are absolute crap compared to Plex.

Edit: Just to be clear, this post is in regards to the web interface, and I’m using an HTPC (but not the Plex HTPC app) connected to a smart TV, but I never use the TV’s OS for anything. The issue is browser agnostic, and common to FF, Chrome, and Chromium variants.

There is one tiny change that I suppose seems insignificant in the grand scheme of things which I would love to see made: The removal of the play button in the middle of the screen when paused.

It causes hardware damage.

At first, I just thought it was a nuisance. Occasionally I’d like to take a “screen shot” real casually to send in a text or group chat, and the play icon was always in the way. But not a big enough deal to bring it up.

I know there are browser extensions that’ll kill certain HTML elements, and that’s definitely a solution worth pursuing. Unfortunately, I didn’t bother looking into that until it became a major issue, after the damage was done:

That’s a 5 year old Sony XBR-55A1E. It must be a “feature” of that panel, but for whatever reason only the red channel suffered from burn-in. On a full-field green or blue image it looks absolutely smooth.

You can see the image is overall uneven and the red OLEDs suffered generalized burn. However, that’s more recent. I started noticing the play icon about a year ago appearing on any image that contained red (including whites/greys; so pretty much everywhere) before the panel really degraded.

The thing is, I always knew OLEDs are susceptible to burn-in, so I’ve had that PC set with a 1-minute screensaver timeout since day one. The TV also had pixel shift enabled. I guess pause time just adds up.

I replaced that TV this week with the most recent Sony OLED (A95K), and really want to avoid burning that one for as long as possible.

As for a sorta fix:

The button’s CSS classes change when the player controls bar’s position/visibility changes.

Above is an inspector snippet of the relevant containers when the bar is visible at the bottom of the screen. You’ll see the highlighted button element’s classes change.

And that shows the same snippet when the bar is minimized/not visible.

The button element is a container for the actual play icon graphic, which is the svg element (whose child path defines the geometry of the graphic). So the relevant visible portion of these snippets is really just the svg. I don’t want to mess with the button because it may be used to actuate play/pause when clicking arbitrary points on the screen. (Maybe?)

That CSS comes from the “main” stylesheet file here:

/usr/lib/plexmediaserver/Resources/Plug-ins-6d72b0cf6/WebClient.bundle/Contents/Resources/main-179-4311b1e69996afdff1f5-plex-4.87.2.25887-d04a1ad.css

Adding the following should cause the play button to disappear along with the control bar:

.PlayPauseOverlay-hiddenCursor-GpErBJ > svg {
   display: none;
}

The CSS is minified, but I just searched for “GpErBJ” in that file, and added that snippet without any whitespace:

I can’t guarantee that won’t break anything else, but it seems pretty safe?

If you’re attempting this, copy that file somewhere else first as a backup in case things get royally screwed up.

In cursory testing, this seems to work as intended. There appears to be no change to the UI/UX other than the disappearance of the play button when the control bar disappears. But of course I haven’t QA’d the whole thing, so it may have farther reaching consequences.

It would be beyond awesome if that change (or a functionally similar one) were merged into the codebase :grinning: because presumably it’ll be overwritten every time I upgrade my server. And users on app.plex.tv won’t be able to manipulate the CSS anyhow.

Hope this helps someone, and thanks for your time!

-Scott

Is that a TV or a computer monitor?
For a TV screen, there are already Plex apps with 10-foot user interface available, which have a different behaviour when paused.
But since they are made for TVs they cannot be operated using a mouse.

Well, a TV used as a computer monitor. I’m old school using an HTPC with a Gyration remote.

The TV is Android based, and though I like the Plex app, IMO nothing beats the flexibility or information available in the web interface. Besides the overall customizability of an HTPC.

And anyway, OLED monitors are becoming cheaper/more available (and a more popular panel tech in laptops as well), so this change would be a benefit to anyone using the web interface on their regular computer with an OLED.

This topic was automatically closed 90 days after the last reply. New replies are no longer allowed.