🇺🇦 We stand with Ukraine! 🇺🇦

TouchUI, Matchbox, Virtual Keyboard and Color Picker problem


(hopping Billyblaze comes here from time to time...)

I'm developping a plugin that's intended to work with TouchUI. Works fine except one thing.
My plugin settings page has a couple of buttons with color pickers.
Clicking on these buttons brings the windows manager color picker (WM = Matchbox, IIRC), and also the virtual keyboard. The problem comes from the virtual keyboard : it is impossible to close, and focus remains on the button after closing the color picker !
The only workaround I found is scrolling up and switching to the second tab : the virtual keyboard disappears, and I finally can click OK.
This is really annoying and ruins all the work I have done !

So, the question is : does anyone know how to prevent this useless virtual keyboard to popup when opening my plugin settings page ?

I want to use the default color picker for compatibility with the standard UI.

PS : TouchUI does not use the standard color picker for its own settings, it uses another one (a "wheel" with predefined colors).

Default (Matchbox) color picker :

TouchUI color picker :

[EDIT] this virtual keyboard is from the author of TouchUI : OctoPrint-TouchUI/keyboard.js at 73665b2d6fd9d735f383339620a049771dfe0f6f · BillyBlaze/OctoPrint-TouchUI · GitHub

it's probably because the underlying input is still active. Maybe if you trigger the blur event so it loses focus it would go away?

Really weird... The problem also occurs with another control : the slider (type="range") ; when clicking on it, the virtual keyboard is also displaying, cannot be closed, and the slider keeps the focus whatever i do (clicking another control, or using the tab key).

I searched for a known good plugin showing a slider control, found Mote Lighting Control, and installed it. The exact same problem occurs : my code is not the only one with this issue.

Why the hell does the keyboard pops up with type="color" and type="range" ? (the color picker dialog itself has a range/slider, the problem could be the slider...).

Luckily, in TouchUI settings, we can disable the virtual keyboard. And use one of these cheap tiny wireless keyboards.

They're all inputs though. Seems more of an issue with the keyboard component itself not excluding those types of inputs from it's selector. Wonder if there is an updated version of the component that could potentially replace the one bundled with TouchUI. The component is from here.

Here's a quick fiddle that seems to not trigger the keyboard with a color input.

Many thanks for the effort, but unfortunately I'm unable to do such things... I never went into web developoment and HTML, and now I'm too old.
I've always been using Dreamweaver in designer mode for my website (with very few JS scripts), and the only (or so) tag I'm comfortable with is <br /> !!!
I can understand procedural programming only.

If I understand correctly, it would mean hacking TouchUI. Not even in my dreams ! OTOH, i never use the virtual keyboard locally, but a tiny wireless one, or a tablet with OctoPrint in a browser. I'm sure many TouchUI users do the same.

Before I complete my project, I'll probably have another (and last) question about the OctoPrint APIs. Will be the last one before I can upload the whole thing to GitHub.