Simple color slider jumps back to 0

[KristiansBox]

Hi, my color slider jumps after change back to zero (left position). Sometimes it works normal. However, the brightness controller has no problems.

Flow-Code: [{"id":"4e3f645a.dee124","type":"ui_iro-color-picker","z":"b7922887.b35788","group":"4fdd8427.217d34","order":9,"width":0,"height":0,"name":"","label":"","placement":"left","hAlign":"flex-start","vAlign":"flex-start","stateField":"payload","enableField":"enable","layoutDirection":"vertical","widgetIndent":"3","buttonWidth":"2","pickerType":"widget","popupWidth":0,"popupHeight":0,"pickerSize":"100","backgroundDim":"50","backgroundColor":"#000000","backgroundVariable":false,"components":[{"options":{"borderColor":"#000000","borderWidth":1,"sliderType":"hue","minTemperature":3000,"maxTemperature":6000},"componentId":"slider"}],"format":"hex","outFormat":"hue","dynOutput":"input:end","outputConfirmed":false,"outputLimit":"10","passthru":false,"topic":"topic","topicType":"msg","iroColorValue":"#377cc8","x":680,"y":1040,"wires":[["557bbf3e.c10a78"]]},{"id":"4fdd8427.217d34","type":"ui_group","name":"Licht","tab":"de944506.f43d88","order":3,"disp":true,"width":"6","collapse":false},{"id":"de944506.f43d88","type":"ui_tab","name":"K","icon":"mi-king_bed","order":3,"disabled":false,"hidden":false}]

The input is a KNX value and the change of the value with the KNX touchpanel works perfect. But i send the value from the color slider to the knx bus and the response from the knx bus (same value) trigger the error.

Without the wired connection from the input it works normally but i need the input for external changes.

Kristian

[Christian-Me]

Hi,

thank you for your feedback.

in the demo node you only output hue, right? The problem might be that if you are using a hue slider the left and right color is the same (#ff0000) red. Hue 0 and hue 360 is both red. If the slider jumps back to the left if you select the red on the right it is caused by iro.js itself as iro.js works with the RGB model internally. If you feed in hue 0 or 360 it is always the left red. if you are using the color circle you should not run into that problem (as the circle is closed = 0 and 360 is at the same spot. We discussed this problem in a closed topic.

To help you further i need some demo data on the input (place a debug node there and copy the data out of the demo panel and paste it into one or more inject nodes) - perhaps you are able to capture a message to reproduce the issue.

The only solution (if this is your problem) I see is to limit the hue output to 0..359.99 but if someone select RGB output he will run into the same behavior but I can't determine if the right or left red was selected.

I would try a hue circle first to see if this effect is your problem.

[KristiansBox]

Hi, yes, thats correct. I use Hue 0 to 360 and round it to int. Here are the debug values: The differences between the output node red and the KNX response does not always occur but have the same behavior. The selected color was green.

If i change to the hue circle it looks like this:

My previous version was RGBW with a HUE circle and a slider for brightness. But there was the problem that the brightness has never spent more than 50 percent. I suspect that's related. I could also create this node again if you want.

[Christian-Me]

I'm not at my computer but you get a black component if you use a circle or slider without a value component. You can do this but you have to set your initial color to something with a value >0 (100% or 255) or disable the dimm option should work too.

Sending pure numbers as payload I never tested fully as I work always with a complete color model and convert it later according to the capabilities of the device either in my own firmware or using my chroma.js node.

But there might be a bug somewhere if the reset to hue 0 happens (randomly). I have to do some tests (when I find some time)

[KristiansBox]

I disabled the dimm option and you are right. The Hue circle works realy better but in 50 percent it jumps to the center of the circle.

[Christian-Me]

Hi, sorry to answer so late but there where so many things in the pipeline:

I took your node and put it on the dashboard. 1st the initial color looks correct: I tried to build a test flow: But I can't reproduce your issue. All is updating as expected and I can't even see the 0=360=red issue ...

Now the typical questions: Witch versions of the Dashboard / iro-picker are you using? Latest on npm is 0.1.4 there is a 0.1.5 version here on github but with only minor fixes regarding label handling and modal window buttons

[{"id":"4e3f645a.dee124","type":"ui_iro-color-picker","z":"502a840a5bae7ed3","group":"7df8c32c2b36e811","order":9,"width":0,"height":0,"name":"","label":"","placement":"left","hAlign":"flex-start","vAlign":"flex-start","stateField":"payload","enableField":"enable","layoutDirection":"vertical","widgetIndent":"3","buttonWidth":"2","pickerType":"widget","popupWidth":0,"popupHeight":0,"pickerSize":"100","backgroundDim":"50","backgroundColor":"#000000","backgroundVariable":false,"components":[{"options":{"borderColor":"#000000","borderWidth":1,"sliderType":"hue"},"componentId":"slider"}],"format":"hex","outFormat":"hue","dynOutput":"input:end","outputConfirmed":false,"outputLimit":"10","passthru":false,"topic":"topic","topicType":"msg","iroColorValue":"#377cc8","x":480,"y":800,"wires":[["79739860d4ce274b","842629bf8851a95d"]]},{"id":"79739860d4ce274b","type":"debug","z":"502a840a5bae7ed3","name":"from","active":true,"tosidebar":true,"console":false,"tostatus":true,"complete":"true","targetType":"full","statusVal":"payload","statusType":"msg","x":710,"y":800,"wires":[]},{"id":"c88ac6354a2e6cc4","type":"delay","z":"502a840a5bae7ed3","name":"","pauseType":"delay","timeout":"10","timeoutUnits":"milliseconds","rate":"1","nbRateUnits":"1","rateUnits":"second","randomFirst":"1","randomLast":"5","randomUnits":"seconds","drop":false,"allowrate":false,"x":470,"y":880,"wires":[["4e3f645a.dee124","959a9a6d715b70be"]]},{"id":"959a9a6d715b70be","type":"debug","z":"502a840a5bae7ed3","name":"to","active":true,"tosidebar":true,"console":false,"tostatus":true,"complete":"true","targetType":"full","statusVal":"payload","statusType":"msg","x":710,"y":880,"wires":[]},{"id":"842629bf8851a95d","type":"function","z":"502a840a5bae7ed3","name":"floor","func":"msg.payload=Math.floor(msg.payload);\nreturn msg;","outputs":1,"noerr":0,"initialize":"","finalize":"","libs":[],"x":310,"y":880,"wires":[["c88ac6354a2e6cc4"]]},{"id":"7df8c32c2b36e811","type":"ui_group","name":"HUE debug","tab":"4e562e4.b15cad","order":4,"disp":true,"width":"6","collapse":true},{"id":"4e562e4.b15cad","type":"ui_tab","name":"iro.js color picker","icon":"dashboard","order":1,"disabled":false,"hidden":false}]

[Christian-Me]

I even build in a random "error" for the input but could not see any issue

[{"id":"4e3f645a.dee124","type":"ui_iro-color-picker","z":"502a840a5bae7ed3","group":"7df8c32c2b36e811","order":9,"width":0,"height":0,"name":"","label":"","placement":"left","hAlign":"flex-start","vAlign":"flex-start","stateField":"payload","enableField":"enable","layoutDirection":"vertical","widgetIndent":"3","buttonWidth":"2","pickerType":"widget","popupWidth":0,"popupHeight":0,"pickerSize":"100","backgroundDim":"50","backgroundColor":"#000000","backgroundVariable":false,"components":[{"options":{"borderColor":"#000000","borderWidth":1,"sliderType":"hue"},"componentId":"slider"}],"format":"hex","outFormat":"hue","dynOutput":"input:end","outputConfirmed":false,"outputLimit":"10","passthru":false,"topic":"topic","topicType":"msg","iroColorValue":"#377cc8","x":480,"y":800,"wires":[["79739860d4ce274b","842629bf8851a95d"]]},{"id":"79739860d4ce274b","type":"debug","z":"502a840a5bae7ed3","name":"from","active":true,"tosidebar":true,"console":false,"tostatus":true,"complete":"payload","targetType":"msg","statusVal":"","statusType":"auto","x":710,"y":800,"wires":[]},{"id":"c88ac6354a2e6cc4","type":"delay","z":"502a840a5bae7ed3","name":"","pauseType":"delay","timeout":"10","timeoutUnits":"milliseconds","rate":"1","nbRateUnits":"1","rateUnits":"second","randomFirst":"1","randomLast":"5","randomUnits":"seconds","drop":false,"allowrate":false,"x":470,"y":880,"wires":[["4e3f645a.dee124","959a9a6d715b70be"]]},{"id":"959a9a6d715b70be","type":"debug","z":"502a840a5bae7ed3","name":"to","active":true,"tosidebar":true,"console":false,"tostatus":true,"complete":"payload","targetType":"msg","statusVal":"","statusType":"auto","x":710,"y":880,"wires":[]},{"id":"842629bf8851a95d","type":"function","z":"502a840a5bae7ed3","name":"floor","func":"msg.payload = Math.floor(msg.payload + (Math.random() * 4 - 2));\nreturn msg;","outputs":1,"noerr":0,"initialize":"","finalize":"","libs":[],"x":310,"y":880,"wires":[["c88ac6354a2e6cc4"]]},{"id":"7df8c32c2b36e811","type":"ui_group","name":"HUE debug","tab":"4e562e4.b15cad","order":4,"disp":true,"width":"6","collapse":true},{"id":"4e562e4.b15cad","type":"ui_tab","name":"iro.js color picker","icon":"dashboard","order":1,"disabled":false,"hidden":false}]

[KristiansBox]

Hi, i use version 1.4 actually.

First, I have tried with your version and could not find a problem. After a few tests, I installed your color node in the KNX flow and the problem occurred again. So it definitely had to hang on this flow. Then I deleted all values from the input to the color node (knx output) to get the same output. Still the same problem. After that I noticed that in the output has a msg.SocketID. I inserted the msg.socketid in the data stream and it works. Your flow is adapted and now reacts just as faulty.

[{"id":"7987bf0.b93324","type":"change","z":"78abef.11f5941","name":"","rules":[{"t":"set","p":"payload","pt":"msg","to":"$round(msg.payload)\t","tot":"jsonata"}],"action":"","property":"","from":"","to":"","reg":false,"x":1610,"y":340,"wires":[["31a556bd.89d87a","fd54b2d9.1b5f58"]]},{"id":"f1b7001d.c07a1","type":"debug","z":"78abef.11f5941","name":"","active":true,"tosidebar":true,"console":false,"tostatus":false,"complete":"true","targetType":"full","statusVal":"","statusType":"auto","x":1810,"y":560,"wires":[]},{"id":"31a556bd.89d87a","type":"debug","z":"78abef.11f5941","name":"","active":true,"tosidebar":true,"console":false,"tostatus":false,"complete":"true","targetType":"full","statusVal":"","statusType":"auto","x":1820,"y":340,"wires":[]},{"id":"fd54b2d9.1b5f58","type":"ui_iro-color-picker","z":"78abef.11f5941","group":"7df8c32c2b36e811","order":12,"width":0,"height":0,"name":"","label":"","placement":"left","hAlign":"flex-start","vAlign":"flex-start","stateField":"payload","enableField":"enable","layoutDirection":"vertical","widgetIndent":"6","buttonWidth":"0","pickerType":"widget","popupWidth":"6","popupHeight":0,"pickerSize":"100","backgroundDim":"50","backgroundColor":"#ff8000","backgroundVariable":false,"components":[{"options":{"borderColor":"#2d47ff","borderWidth":1,"sliderType":"hue"},"componentId":"slider"}],"format":"hex","outFormat":"hue","dynOutput":"input:end","outputConfirmed":false,"outputLimit":"10","passthru":false,"topic":"topic","topicType":"msg","iroColorValue":"#8ac53a","x":1530,"y":560,"wires":[["f1b7001d.c07a1","dcf1ae9.eced9d"]]},{"id":"a9c1645.1d39a18","type":"delay","z":"78abef.11f5941","name":"","pauseType":"delay","timeout":"150","timeoutUnits":"milliseconds","rate":"1","nbRateUnits":"1","rateUnits":"second","randomFirst":"1","randomLast":"5","randomUnits":"seconds","drop":false,"x":1360,"y":340,"wires":[["7987bf0.b93324"]]},{"id":"dcf1ae9.eced9d","type":"change","z":"78abef.11f5941","name":"","rules":[{"t":"set","p":"payload","pt":"msg","to":"$round(msg.payload)\t","tot":"jsonata"},{"t":"delete","p":"socketid","pt":"msg"}],"action":"","property":"","from":"","to":"","reg":false,"x":1370,"y":420,"wires":[["a9c1645.1d39a18"]]},{"id":"7df8c32c2b36e811","type":"ui_group","name":"HUE debug","tab":"4e562e4.b15cad","order":4,"disp":true,"width":"6","collapse":true},{"id":"4e562e4.b15cad","type":"ui_tab","name":"iro.js color picker","icon":"dashboard","order":1,"disabled":false,"hidden":false}]

[Christian-Me]

Yes, there is bug. Sorry for that! I have to investigate a little bit deeper (it is quite a while that I worked on it). Never really used or tested the one component feature. Something is resetting the saturation and value to 0. Then no matter what hue the color is black in rgb #000000 results a hue of 0 (actually it is NaN)

[KristiansBox]

No problem. Thanks a lot for your support. ;-)

[Christian-Me]

Ok, think I found the problem 😃. Pushed version 0.1.6 Please install directly from here.

From your .node-red directory npm i Christian-Me/node-red-contrib-ui-iro-color-picker restart node-red. Let me know if this works

[KristiansBox]

Sorry. I can't install it. I get a error:

debug.log:

0 info it worked if it ends with ok 1 verbose cli [ 1 verbose cli '/usr/local/bin/node', 1 verbose cli '/usr/local/bin/npm', 1 verbose cli 'i', 1 verbose cli 'Christian-Me/node-red-contrib-ui-iro-color-picker' 1 verbose cli ] 2 info using npm@6.14.8 3 info using node@v14.15.0 4 verbose npm-session d9d0b3d9e6f81fca 5 silly install loadCurrentTree 6 silly install readLocalPackageData 7 silly fetchPackageMetaData error for github:Christian-Me/node-red-contrib-ui-iro-color-picker Error while executing: 7 silly fetchPackageMetaData undefined ls-remote -h -t ssh://git@github.com/Christian-Me/node-red-contrib-ui-iro-color-picker.git 7 silly fetchPackageMetaData 7 silly fetchPackageMetaData 7 silly fetchPackageMetaData spawn git ENOENT 8 timing stage:rollbackFailedOptional Completed in 3ms 9 timing stage:runTopLevelLifecycles Completed in 4242ms 10 verbose stack Error: spawn git ENOENT 10 verbose stack at Process.ChildProcess._handle.onexit (internal/child_process.js:269:19) 10 verbose stack at onErrorNT (internal/child_process.js:465:16) 10 verbose stack at processTicksAndRejections (internal/process/task_queues.js:80:21) 11 verbose cwd /home/pi/.node-red 12 verbose Linux 4.19.66-v7+ 13 verbose argv "/usr/local/bin/node" "/usr/local/bin/npm" "i" "Christian-Me/node-red-contrib-ui-iro-color-picker" 14 verbose node v14.15.0 15 verbose npm v6.14.8 16 error code ENOENT 17 error syscall spawn git 18 error path git 19 error errno -2 20 error enoent Error while executing: 20 error enoent undefined ls-remote -h -t ssh://git@github.com/Christian-Me/node-red-contrib-ui-iro-color-picker.git 20 error enoent 20 error enoent 20 error enoent spawn git ENOENT 21 error enoent This is related to npm not being able to find a file. 22 verbose exit [ -2, true ] ~

[Christian-Me]

strange

npm i Christian-Me/node-red-contrib-ui-iro-color-picker

+ node-red-contrib-ui-iro-color-picker@0.1.6
updated 1 package and audited 595 packages in 11.055s

works on my side ... but never mind, pushed it to npm and flows.node-red.org. So 0.1.6 should appear in the palette manager.

[KristiansBox]

Sounds good. Thanks a lot ;-)

[KristiansBox]

Update ist now available in node red and works realy good. No problems more. Good work.