Set the range slider's min handler value

Question

In my app I have a range slider - input combo component:

The user can change the range with slider or with inputs. The max range is 30% of the minimum value, e.g.: if the min value is 1000, the max range can be 300. So if the user moves the max value to 1400, the slider will adjust its min value to 1100.

Another example, if the user drags the max value to 8000, the sliders min range value will be 6200. Since the slider step is 100, the range values are rounded to nearest hundred integer.

And now the problem what I can't solve:

How can I calculate the max range, if the user sets the max value directly through input (since it should be 30% of the min value)? This is how my app now handles such situation (it uses the initial 300 range which is set on app init):

Any idea how can I solve this issue?

EDIT: This is how it's currently implemented:

• If the value (min/max) changes the app will calculate the range max - min
• The max allowed range is calculated (0.3 / 100) * min
• If the range exceeds the allowed range, set the min value to max - (0.3 / 100) * min

Answer 1

If I understand you rightly you want to calculate the min value based on max value, if the max value is set through user input.

As you round range slider values anyway you can calculate the min value based on max value like so:

max - (0.233 / 100) * max.

Of course, this should only be calculated this way if max value is changed. This solution is not perfect but a approximation. Hopefully it does the trick.