better manual input for normal sliders

public/script.js

@@ -9306,9 +9306,65 @@ jQuery(async function () {
         }
     });
 
-    let manualInputTimeout;
 
-    $(document).on('input', '.range-block-counter input, .neo-range-input', function () {
+    var isManualInput = false
+    var valueBeforeManualInput
+
+    $('.range-block-counter input, .neo-range-input').on('click', function () {
+        valueBeforeManualInput = $(this).val()
+        console.log(valueBeforeManualInput)
+    })
+        .on('keydown', function (e) {
+            const masterSelector = "#" + $(this).data('for');
+            const masterElement = $(masterSelector);
+            if (e.key === 'Enter') {
+                let manualInput = parseFloat($(this).val())
+                if (isManualInput) {
+                    //disallow manual inputs outside acceptable range
+                    if (manualInput >= $(this).attr('min') && manualInput <= $(this).attr('max')) {
+                        //if value is ok, assign to slider and update handle text and position
+                        //newSlider.val(manualInput)
+                        //handleSlideEvent.call(newSlider, null, { value: parseFloat(manualInput) }, 'manual');
+                        valueBeforeManualInput = manualInput
+                        $(masterElement).val($(this).val()).trigger('input')
+                    } else {
+                        //if value not ok, warn and reset to last known valid value
+                        toastr.warning(`Invalid value. Must be between ${$(this).attr('min')} and ${$(this).attr('max')}`)
+                        console.log(valueBeforeManualInput)
+                        //newSlider.val(valueBeforeManualInput)
+                        $(this).val(valueBeforeManualInput)
+                    }
+                }
+            }
+        })
+        .on('keyup', function () {
+            valueBeforeManualInput = $(this).val()
+            console.log(valueBeforeManualInput)
+            isManualInput = true
+        })
+        //trigger slider changes when user clicks away
+        .on('mouseup blur', function () {
+            const masterSelector = "#" + $(this).data('for');
+            const masterElement = $(masterSelector);
+            let manualInput = parseFloat($(this).val())
+            if (isManualInput) {
+                //if value is between correct range for the slider
+                if (manualInput >= $(this).attr('min') && manualInput <= $(this).attr('max')) {
+                    valueBeforeManualInput = manualInput
+                    //set the slider value to input value
+                    $(masterElement).val($(this).val()).trigger('input')
+                } else {
+                    //if value not ok, warn and reset to last known valid value
+                    toastr.warning(`Invalid value. Must be between ${$(this).attr('min')} and ${$(this).attr('max')}`)
+                    console.log(valueBeforeManualInput)
+                    $(this).val(valueBeforeManualInput)
+                }
+            }
+            isManualInput = false
+        })
+    /*
+        let manualInputTimeout;
+             .on('input', '.range-block-counter input, .neo-range-input', function () {
             clearTimeout(manualInputTimeout);
             manualInputTimeout = setTimeout(() => {
                 const caretPosition = saveCaretPosition($(this).get(0));
@@ -9375,8 +9431,8 @@ jQuery(async function () {
                 }
     
                 restoreCaretPosition($(this).get(0), caretPosition);
-        }, 2000);
+            }, 2000); */
-    });
+    //});
 
     $(".user_stats_button").on('click', function () {
         userStatsHandler();