rreusser / controls-state

⚙️ An object for managing state
https://observablehq.com/@rreusser/control-panel-2-prototype-test
21 stars 2 forks source link

Add mapping and inverseMapping options to Slider #7

Closed marcofugaro closed 4 years ago

marcofugaro commented 4 years ago

Hey Ricky! Tried to implement issue #4. I added the mapping and inverseMapping options, which are used to map the slider to the state.

To achieve this I added a new property to the slider, valueForSlider, which will be used from the controls-gui slider. It uses mapping and inverse mapping in its getter/setter. What do you think about this implementation, do you have any suggestions?

Now I'm stuck on the mapping functions, as a result I want something like control-panel, where it starts slow and then ramps up at the end, like this, this is the function being used in control-panel as the inverseMapping:

Screenshot 2020-01-08 at 17 16 12

However the control-panel implementation is taking into consideration also the min and max values in the function (alfa and beta in the image).

Do you have any idea how to handle this? To make the function parametrizable and still make it work with min and max? Maybe we could map the user mapping function from 0-1 to min-max?

close #4

rreusser commented 4 years ago

This looks really nice. Yeah, let me work through this and check it over. I think in general it's a bit tricky to define the mapping just right. I think my thought at the time was that this would maybe even be rolled up as a LogSlider component that depends on the Slider so that unless you really want to do it yourself, it's mostly just handled for you internally without you having to come up with these functions yourself.