hoobs-org / gui

Interface component for the certified HOOBS stack.
GNU General Public License v3.0
2 stars 1 forks source link

Add Color Temperature to Hue Accessory #119

Open apartmedia opened 3 years ago

apartmedia commented 3 years ago

On latest gui (4.0.69) the color picker can not be placed to center (white). Tested with iPadPro iOS 14.6 Mobile Safari, Mobile Firefox and MacBookPro macOS Big Sur 11.4 Chrome Desktop 91.0.4472.114 See attached video...

https://user-images.githubusercontent.com/17024592/125176155-963e1e80-e1d1-11eb-83fb-d2f3860f5d8a.mov

mkellsy commented 3 years ago

I was able to do it. It shows as grey, but I am able to center it. I think what we need is to add the color temp section for this accessory.

You got hue, brightness and then temperature, that shows 4 options, which includes white.

The video because it won't play in GitHub.

apartmedia commented 3 years ago

I was able to do it. It shows as grey, but I am able to center it. I think what we need is to add the color temp section for this accessory.

You got hue, brightness and then temperature, that shows 4 options, which includes white.

The video because it won't play in GitHub.

Could you watch the video what happens when using the color picker on my touch device? Or do you need it in a different format as you say it won’t play (although I can play mov in GitHub with Safari 🤔). It might behave different or even work when using a mouse.

mkellsy commented 3 years ago

What I’m saying is the hue accessory needs some work. One of the things that is needed is a mobile friendlier color wheel. The color balance method is that. (It’s the same method that HomeKit uses)

apartmedia commented 3 years ago

might this be a solution for better mobile and touch usage while keeping the design (if that’s one goal)? iro.js Not sure if this is Vue compatible though…

mkellsy commented 3 years ago

That's exactly what we are using.

https://github.com/hoobs-org/gui/blob/main/package.json

"@jaames/iro": "^5.3.1",
apartmedia commented 3 years ago

Ok, that should be normally fine for touch devices, The codepen demos linked on the iro site worked flawless for me on mobile Safari in iOS and iPad OS.

mkellsy commented 3 years ago

Codepen doesn't show the whole story. The issue is the select and revert to the default display. It needs a slight delay and debounce, so you can adjust the color, and it won't revert until input stops.

Sounds confusing, but remember JavaScript if fast, it's timed in milliseconds.

I am also using this task to complete the hue accessory.

apartmedia commented 3 years ago

I‘m with you… JS: powerful and guilty 😉 Let me know if I can be helpful by testing something. Regarding the hue accessory u r planning to use the same lib?