cocopon / tweakpane

:control_knobs: Compact GUI for fine-tuning parameters and monitoring value changes
https://tweakpane.github.io/docs/
MIT License
3.44k stars 86 forks source link

where a plugin can contrôle mouse speed/frequency ? #471

Closed jonlepage closed 11 months ago

jonlepage commented 1 year ago

sup friend, on my side i contrôle mouse frequency update like this for some of my inputs.

<button
    style={{ cursor: 'w-resize' }}
    onPointerDown={(e) => {
        const { min, max, step, speed } = metas ?? {}; // metas options of the input

        const sdx = (e.clientX - e.clientY);
        const pointermove = (e: PointerEvent) => {
            const dx = (e.clientX - e.clientY);
            let v = value + ((dx - sdx) * (speed ?? 0.5)); // speed of mouse 🟢
            if (step) v = Math.round(v / step) * step; // apply step if need 
            if (min !== undefined) v = Math.max(min, v); // apply clamping
            if (max !== undefined) v = Math.min(max, v);
            v = +v.toFixed(3);
            setValue(v);
            onChange?.(v);
        };
        document.addEventListener('pointermove', pointermove);
        document.addEventListener('pointerup', (e) => document.removeEventListener('pointermove', pointermove), { once: true });
        e.stopPropagation();
        e.preventDefault();
    }}
>
    {`${vkey}:`}
</button>

did you or can you expose a way to allow user hack mouse speed/frequency ? 1 pixel update is too face for lot of case. can you guide how archive this with your api ? related to this issu, thanks https://github.com/0b5vr/tweakpane-plugin-rotation/issues/1


expected behavior 8uuuj

cocopon commented 1 year ago

You mean you want to change a scale for dragging, right?

In the current spec it's estimated from its initial value or step option. https://github.com/cocopon/tweakpane/blob/4f5175b8194dbd8b2e91e7bdcc50cef5f109db59/packages/core/src/common/util.ts#L118-L126

jonlepage commented 1 year ago

thanks

cocopon commented 1 year ago

Wait wait, I'm positive to add an option for changing the scale.

jonlepage commented 1 year ago

Wait wait, I'm positive to add an option for changing the scale.

ho oups, oki i will try done a monkey patch for my app and keep a eye on your commit 😊

cocopon commented 1 year ago

Added keyScale and pointerScale option to NumberInputParams in v4 beta.

pane.addBinding(PARAMS, 'foo', {
  keyScale: 10,
  pointerScale: 1,
  ...
});

https://tweakpane.github.io/docs/api/interfaces/NumberInputParams.html

You can try it with npm install tweakpane@beta or downloading it manually: https://github.com/cocopon/tweakpane/releases/tag/4.0.0-beta.1

jonlepage commented 1 year ago

hey thank i will give a try maybe this week

cocopon commented 11 months ago

Released in v4.0.0.