Need access to Windows accent color via new system color extension

NEW
Unassigned

Status

()

Core
Widget: Win32
P2
normal
2 months ago
7 days ago

People

(Reporter: mconley, Unassigned)

Tracking

(Blocks: 2 bugs)

unspecified
Points:
---
Dependency tree / graph
Bug Flags:
qe-verify -

Firefox Tracking Flags

(Not tracked)

Details

(Whiteboard: [photon-visual][p1][tpi:+])

We want Photon to look fantastic on Windows 10, which means integrating nicely, and using the Accent Color when applicable. We also need to know when that accent color changes.

We need to add a mechanism, probably usable within CSS (so perhaps a @media selector of some kind?) that can be true if the accent color is being used, and then a color extension[1] to refer to that accent color.

We also need to know when that color changes. Windows 10 (and perhaps lower) has a setting that allows the accent color to change if the background image changes (and there's a slideshow mode for the background, so it can change at any time, arbitrarily).

[1]: Like these https://developer.mozilla.org/en/docs/Web/CSS/color_value#Mozilla_System_Color_Extensions
Blocks: 1344917

Updated

2 months ago
Priority: -- → P3
Whiteboard: tpi:+
I'm looking for someone to own this, because it's blocking Photon.

Hey dao, am I correct in comment 0 that a @media selector for knowing the state of accent colours, and a color extension would be the API you'd want to use here?
Flags: needinfo?(dao+bmo)
(In reply to Mike Conley (:mconley) (High latency until March 31) from comment #1)
> I'm looking for someone to own this, because it's blocking Photon.
> 
> Hey dao, am I correct in comment 0 that a @media selector for knowing the
> state of accent colours, and a color extension would be the API you'd want
> to use here?

That's sounds right, yes.
Flags: needinfo?(dao+bmo)

Updated

a month ago
Blocks: 1196266

Updated

a month ago
No longer blocks: 1325171
(In reply to Mike Conley (:mconley) (Very high latency until April 3rd) from comment #1)
> I'm looking for someone to own this, because it's blocking Photon.
> 
> Hey dao, am I correct in comment 0 that a @media selector for knowing the
> state of accent colours, and a color extension would be the API you'd want
> to use here?

Looking at attachment 8766535 [details], a corresponding color extension for the text color would be handy too. I guess Windows doesn't provide a text color for this, so widget code would have to pick one itself. Could be just black / white based on the accent color, much like this: http://searchfox.org/mozilla-central/rev/72fe012899a1b27d34838ab463ad1ae5b116d76b/toolkit/modules/LightweightThemeConsumer.jsm#114-116

Updated

27 days ago
Priority: P3 → P1
Whiteboard: tpi:+ → [tpi:+][photon]

Updated

19 days ago
Whiteboard: [tpi:+][photon] → [tpi:+][photon-visual]

Updated

18 days ago
Flags: qe-verify-
Priority: P1 → P2

Comment 4

17 days ago
Hey Dao, is there any way we can do what we want to do here using some changes to the Windows8WindowFrameColor.jsm [1] module? The accent colors you're interested in are stored in the same location in the registry.

Alternatively, maybe it's time we move this front-end color extraction code down into widget and add color extensions for the win8 colorization colors as well?

[1] https://dxr.mozilla.org/mozilla-central/source/browser/modules/Windows8WindowFrameColor.jsm
Flags: needinfo?(dao+bmo)

Updated

15 days ago
Whiteboard: [tpi:+][photon-visual] → [photon-visual][p1][tpi:+]
(In reply to Jim Mathies [:jimm] from comment #4)
> Hey Dao, is there any way we can do what we want to do here using some
> changes to the Windows8WindowFrameColor.jsm [1] module? The accent colors
> you're interested in are stored in the same location in the registry.

Hmm, enabling accent colors in title bars and running this code on Windows 10:

new Color(...Cu.import("resource:///modules/Windows8WindowFrameColor.jsm", {}).Windows8WindowFrameColor.get())

Gives me:

Object { r: -7000796454, g: -3478923282, b: -1589137678 }

So something isn't working here.

> Alternatively, maybe it's time we move this front-end color extraction code
> down into widget and add color extensions for the win8 colorization colors
> as well?

I think this would be preferable. Windows8WindowFrameColor.jsm always seemed like a hack. In fact we already have ActiveCaption, CaptionText, InactiveCaption and InactiveCaptionText but they don't currently seem to give us useful values.
Flags: needinfo?(dao+bmo)
(In reply to Dão Gottwald [::dao] from comment #5)
> (In reply to Jim Mathies [:jimm] from comment #4)
> > Hey Dao, is there any way we can do what we want to do here using some
> > changes to the Windows8WindowFrameColor.jsm [1] module? The accent colors
> > you're interested in are stored in the same location in the registry.
> 
> Hmm, enabling accent colors in title bars and running this code on Windows
> 10:
> 
> new Color(...Cu.import("resource:///modules/Windows8WindowFrameColor.jsm",
> {}).Windows8WindowFrameColor.get())
> 
> Gives me:
> 
> Object { r: -7000796454, g: -3478923282, b: -1589137678 }

Different key names for the accent color info, but they are in there.

> So something isn't working here.
> 
> > Alternatively, maybe it's time we move this front-end color extraction code
> > down into widget and add color extensions for the win8 colorization colors
> > as well?
> 
> I think this would be preferable. Windows8WindowFrameColor.jsm always seemed
> like a hack. In fact we already have ActiveCaption, CaptionText,
> InactiveCaption and InactiveCaptionText but they don't currently seem to
> give us useful values.

Sounds good.
You need to log in before you can comment on or make changes to this bug.