Mottie / Keyboard

Virtual Keyboard using jQuery ~
http://mottie.github.io/Keyboard/
Other
1.78k stars 723 forks source link

Can it initialise globally? #558

Open ZeeCoder opened 7 years ago

ZeeCoder commented 7 years ago

Is there a way to initialise one instance of the keyboard, instead of calling it on all elements?

So instead of calling $().keyboard() on the specific element, I would just initialise it once, globally, and then whenever I click inside an input / textarea, it would open the virtual keyboard.

Mottie commented 7 years ago

Hi @ZeeCoder!

Currently, no you will need to initialize the plugin on an existing input or textarea. Eventually, I do plan on making it initialize and have it set to include or exclude inputs and textareas with a certain class when they get focused.

ZeeCoder commented 7 years ago

👍

ZeeCoder commented 7 years ago

@Mottie I was thinking about a bit of a hacky solution for the time being: in a loop (running every ~200ms) I would initialise all new input / textarea fields automatically. A bit hacky, but since js selector engines are quite fast I'm not too worried about performance drop.

However I wonder if this approach may introduce memory leak issues, since I might not be able to destroy the plugin on certain elements. In your opinion, would it cause any issue?

I'd assume that as long as the plugin uses jQuery.data on the element, that gets cleaned up automatically.

As to why I might not be able to call destroy manually: I'm using React Components, which means that for every component I would need to initialise / destroy the plugin manually on each mount / unmount. However, if I forget even once to include initialisation, the whole User Journey would be ruined. Basically I'm looking for a more future- / foolproof solution.

Mottie commented 7 years ago

Hi @ZeeCoder!

I guess initializing the keyboard on new inputs would work, but what if a keyboard is already open? Doesn't the caret jump around (if it isn't set at the end)? I don't think there would be a memory leak as the keyboard is destroyed as soon as it is closed (properly).

I could optimize the code a bit more... I know it needs some loving. Maybe before I start my rewrite, I could use delegated binding from the body and remove all internal element caches to make it work with React a little better.

ZeeCoder commented 7 years ago

It looks like it works just fine, React won't open the keyboard automatically when it's already open.

So the flow is something like: React rendered input -> Loop attaches keyboard -> user clicks input -> keyboard pops up -> user clicks outside -> keyboard closes -> user opens another overlay, which destroys the old input and creates new ones -> loop attaches keyboard to new inputs -> user clicks one of the new inputs -> etc