iro.js to control cold white / warm white led strips

[klaus-liebler]

Hi Devs,

I am about to develop a ESP32-based hardware and a webUI to control cold white / warm white led strips and RGB stips (Details: Hardware: https://github.com/klaus-liebler/sensact/tree/master/pcb/sensactOutdoor Firmware: https://github.com/klaus-liebler/sensact/tree/master/firmware_sensactOutdoor). I would like to embed iro.js in the UI. CW/WW strips need two dimensions: the CW/WW ratio and the general brightness.

I tried

let kelvinPicker = new iro.ColorPicker("#kelvinPicker", {
            width: Math.min(400, width),
            layoutDirection: 'vertical',
            layout: [
              {
                component: iro.ui.Slider,
                options: {
                  sliderType: 'kelvin',
                }
              },
              {
                component: iro.ui.Slider,
                options: {
                  sliderType: 'saturation',
                }
              },
            ]
          });

and then with value instead of saturation. In both cases, the problem is, that moving one slider moves the other as well. I would like to have two completely independend sliders: one for the CW/WW ratio and one for the brightness.

Is this possible with iro.js. If yes, how?

Thank you very much!

Regards,

Klaus

[jaames]

You'd just need to create two separate color pickers; one with the kelvin slider and another with the value slider

[klaus-liebler]

Thank you - it works perfect!