Indigo Domotics

So I have a few Fibaro controllers, and would like to build a Control Page with a single icon that reflects the colors of the LED's. I don't see any RGBW icons, but was able to make up all four colors using the Red Dot and Greed Dot images. But I'm still suck with 4 icons.

I was able to stack them on top of each other on the Control Page, but the top "off" state icon hides whatever is underneath.

I messed around and got the "off" state icons to be clear (not grey), so the stacking method kind of works as long as there is only one color on, as which ever "on" color is uppermost hides the ones below. Not bad, but still not what I'm after. And there is no variation of brightness either.... icons are either On or Off, with nothing in-between.

Is there a way to create a Control Page icon that actually reflects the real value of the RGBW channels and hence be a closer representation of the colors of the LEDs? And yes, I understand that it is impossible to create the exact color in HTML, but a closer approximation would be nice.

I'm guessing this would involve converting the RGBW values to HTML colors, and using that to "color" a Control Page icon, but beyond the basic concept, I'm stuck at zero. Perhaps there is a plugin already for this that I missed? Of course, RGB controllers and Hue Lights would both benefit from this abilty as well.

There's no built-in way to do what you're looking to do.

Also, Indigo Touch doesn't render control pages as HTML so there isn't an HTML trick that you could try that would work in IT.

Kind of what I figured...

Not so much interested in Touch, as just plain old web pages... but I'm not surprised..

Just stumbled across this post. One way to handle this would be to use a short Python script to generate the colored image. This script reads the red, green, blue, and brightness levels of the source device and creates a 50x50 pixel square (using image transparency to simulate brightness). Run the script when the source device changes and the image will update to the new settings.

Here's a rudimentary example:

Code: Select all

from PIL import Image, ImageDraw

dev = indigo.devices[511044982]

# rgba
r = int(dev.states['redLevel'] / 100 * 255)
g = int(dev.states['greenLevel'] / 100 * 255)
b = int(dev.states['blueLevel'] / 100 * 255)
a = int(dev.brightness / 100 * 255)

im = Image.new('RGBA', (50, 50), (0, 0, 0, 1))
draw = ImageDraw.Draw(im)
draw.rectangle((0, 0, 50, 50), fill=(r, g, b))
im.putalpha(a)
im.save(f"{indigo.server.getInstallFolderPath()}/Web Assets/images/controls/static/foo.png")