Added feature of changing the color temperature of the screen

[Andoramb]

Feature Addition

Description

Hi, I have added a slider for changing the color temperature of the display.
It acts the same way changing the brightness:

• an overlay is created, that changes it's opacity and warm-cold tints
• there is a reset button, that reverts any color temp change
• a TEMP notification can be called to change it from notification
• this feature works well with node-red (I am changing the color temp based on hour/daylight/other light sources Home Assistant🙂

Changelog

Couple files were modified when adding this, but essentially it's a copy from the brightness slider.
Additionally some css code was modified to fit the temp slider

Requirements

Try to test it, it works for me locally

Additional info

Let me know what do you think of it 🙂

[github-actions]

This pull request has been automatically marked as stale because it has not had
recent activity. It will be closed if no further activity occurs. Thank you
for your contributions.

[KristjanESPERANTO]

@Andoramb Could you solve the merge conflicts?

[Andoramb]

Sure, I'll have a look!

[Andoramb]

Hey :)
While having a look on the brightness-related code, I've got some questions:

1. What is the reason of having the brightness range between [10,200]? remote.html

• Wouldn't it make sense to have it [0,100]? like percentage?

2. From MMM-Remote-Control.js - L217

if (newBrightnessValue > 100) {
...
  this.removeOverlay();

• What would be the purpose of this then?
  This way having brightness=101 or brightness=199 makes no difference 🙂

I changed this locally to have brightness between [0,100]
So this way:

• if brightness=0 the overlay is fully visible + black => turns off the backlight of (my) monitor ✅
• else if brightness=>100 the overlay is not visible, screen is on without dimming ✅

On my branch by default brightness=50 and color_temp=325
color_temp [150,500] adds an extra warm/cold tint to the display, adjustable depending on the environment

Let me know what do you think about the brightness-related update
Thanks 🙂

[KristjanESPERANTO]

@Andoramb Sorry, I didn't close the PR on purpose! But I can't seem to reopen it.

Wouldn't it make sense to have it [0,100]? like percentage?

It's already a percentage. 100% is the default, and anything above is brighter - some parts are dimmed (like the seconds on the clock module), so you will see a difference there if you choose 200.

The brightness-related code could probably be refactored, I think I will do that after we get your "color temperature" into the project.

Are you open to create a new PR? If I could find the time, I could try to cherry pick the commits from this PR and implement the function. What do you think?

[KristjanESPERANTO]

Okay, I cherry picked your changes and just released version 3.1.0 with it. There were some merge conflicts to solve. Would be nice if you check the functionality. For me it seems to work 🙂

Thanks for this improvement! 🚀

[Andoramb]

Oh that's great!
I wanted to go through with a proper rebase and retest...
Seems you beat me to it 🙂
I'll check this once I get in fromt of my pc.
Thanks for picking this up!

[Andoramb]

One more thing here:
remote-control.css
The #remote-control-overlay-temp needs these 2 additional properties to have the color temp in in fullscreen:

  top: 0;
  left: 0;

[KristjanESPERANTO]

Oh, thanks! I just released a new version to fix that! 😃