Prama finds

[dy]

Hi @freeman-lab, very nice lib! I was really laughing hard when I saw this repo, as recently I’ve spent 3 days on exact functionality in prama (parameters manager). Funny thing is that API is literally the same. But prama is nowhere close to the nice style of control-panel. Therefore I can just share bugs and features I stumbled upon. First off, it seems range slider does not work in iOS. I used Lea Veorou’s multirange for that purpose. Second, it would be really nice to have control panel draggable, because some components, like gl-spectrum are full-screen. Though that task can be solved by user. Third, I found that saving and loading current state to sessionStorage might come in handy at debugging, to avoid setting up parameters anew each page reload. Wished I knew that package 3 days before!

[rreusser]

Yup. Range slider = my bad. No good reason that's not implemented, just kinda ad-hoc and nontrivial to get all the touch behavior just right. 😄

[freeman-lab]

@dfcreative cool thanks, funny coincidence! This is great info, really helpful to know. I'll make issues for these points.

I also just checked out gl-spectrum, that's really nice! I've done something similar for a few art music things (not nearly as well) so am excited to see how you did it. 👀 😄

[dy]

I considered your code and functionality (I like it very much actually), and I have a proposal which can be winning both for control-panel and prama, to avoid duplicating. I can take control-panel as a dependency for prama, and provide high-level interface for it, in particular:

• Optional settings menu button, which opens/closes the control-panel
• Show control-panel in popup/dialog/sidebar/dropdown, optional
• Draggable/resizable
• Placing options
• Saving/recovering state to session/local storage
• Reflecting state in history, optional

In turn, control-panel will be responsible for managing components, their values, state, style. I think it might be winning both for users who want fast-and-furious settings (instead of test runners btw) and for the ones who want minimal code with high customization (pure control-panel). It also will clean up and separate concerns of both packages. Anyways I was going to spend some time on it.

The only thing, I need a couple of improvements to the API of control-panel:

• per-component input event - it is very handy in practice, instead long switch or chain of ifs.
• help property for components. Sometimes user changes an option which requires reloading the page, and showing little help message is helpful. Also there can be other purposes. It is hidden by default, and shows up under the field.
• make font hack.min.css optional, redefinable via options
• for my taste - rename initital to value, separate label and name (label can be too fancy), add hidden attribute (in case of dependent fields, where one field enables other field). If you are down for that, I can make a couple of PRs, including #12 (if @rreusser doesn’t mind).

[rreusser]

Don't mind at all! Everyone wins!