diff options
Diffstat (limited to 'web')
-rw-r--r-- | web/share/js/kvm/mouse.js | 32 | ||||
-rw-r--r-- | web/share/js/kvm/stream.js | 36 | ||||
-rw-r--r-- | web/share/js/tools.js | 29 |
3 files changed, 40 insertions, 57 deletions
diff --git a/web/share/js/kvm/mouse.js b/web/share/js/kvm/mouse.js index 7b50cf27..3a137957 100644 --- a/web/share/js/kvm/mouse.js +++ b/web/share/js/kvm/mouse.js @@ -63,20 +63,9 @@ export function Mouse(__getResolution, __recordWsEvent) { $("stream-box").onwheel = __streamWheelHandler; $("stream-box").ontouchstart = (event) => __streamTouchMoveHandler(event); - let rate_slider = $("hid-mouse-rate-slider"); - tools.slider.setParams(rate_slider, 10, 100, 10, 100); - rate_slider.oninput = rate_slider.onchange = __updateRate; - tools.slider.setValue(rate_slider, tools.storage.get("hid.mouse.rate", 100)); - - let sens_slider = $("hid-mouse-sens-slider"); - tools.slider.setParams(sens_slider, 0.1, 1.9, 0.1, 1); - sens_slider.oninput = sens_slider.onchange = __updateRelativeSens; - tools.slider.setValue(sens_slider, tools.storage.get("hid.mouse.sens", 1.0)); - __updateRelativeSens(); - tools.storage.bindSimpleSwitch($("hid-mouse-squash-switch"), "hid.mouse.squash", true); - - __updateRate(); // set __timer + tools.slider.setParams($("hid-mouse-sens-slider"), 0.1, 1.9, 0.1, tools.storage.get("hid.mouse.sens", 1.0), __updateRelativeSens); + tools.slider.setParams($("hid-mouse-rate-slider"), 10, 100, 10, tools.storage.get("hid.mouse.rate", 100), __updateRate); // set __timer }; /************************************************************************/ @@ -110,20 +99,19 @@ export function Mouse(__getResolution, __recordWsEvent) { __keypad.releaseAll(); }; - var __updateRate = function() { - let rate = tools.slider.getValue($("hid-mouse-rate-slider")); - $("hid-mouse-rate-value").innerHTML = rate; - tools.storage.set("hid.mouse.rate", rate); + var __updateRate = function(value) { + $("hid-mouse-rate-value").innerHTML = value; + tools.storage.set("hid.mouse.rate", value); if (__timer) { clearInterval(__timer); } - __timer = setInterval(__sendMove, rate); + __timer = setInterval(__sendMove, value); }; - var __updateRelativeSens = function() { - __relative_sens = tools.slider.getValue($("hid-mouse-sens-slider")); - $("hid-mouse-sens-value").innerHTML = __relative_sens.toFixed(1); - tools.storage.set("hid.mouse.sens", __relative_sens); + var __updateRelativeSens = function(value) { + $("hid-mouse-sens-value").innerHTML = value.toFixed(1); + tools.storage.set("hid.mouse.sens", value); + __relative_sens = value; }; var __streamHoveredHandler = function(hovered) { diff --git a/web/share/js/kvm/stream.js b/web/share/js/kvm/stream.js index c949aa65..c2784d73 100644 --- a/web/share/js/kvm/stream.js +++ b/web/share/js/kvm/stream.js @@ -427,14 +427,20 @@ export function Streamer() { $("stream-led").title = "Stream inactive"; - tools.slider.setParams($("stream-quality-slider"), 5, 100, 5, 80); - tools.slider.setOnUpDelayed($("stream-quality-slider"), 1000, __updateQualityValue, (value) => __sendParam("quality", value)); + tools.slider.setParams($("stream-quality-slider"), 5, 100, 5, 80, function(value) { + $("stream-quality-value").innerHTML = `${value}%`; + }); + tools.slider.setOnUpDelayed($("stream-quality-slider"), 1000, (value) => __sendParam("quality", value)); - tools.slider.setParams($("stream-h264-bitrate-slider"), 100, 16000, 100, 5000); - tools.slider.setOnUpDelayed($("stream-h264-bitrate-slider"), 1000, __updateH264BitrateValue, (value) => __sendParam("h264_bitrate", value)); + tools.slider.setParams($("stream-h264-bitrate-slider"), 100, 16000, 100, 5000, function(value) { + $("stream-h264-bitrate-value").innerHTML = value; + }); + tools.slider.setOnUpDelayed($("stream-h264-bitrate-slider"), 1000, (value) => __sendParam("h264_bitrate", value)); - tools.slider.setParams($("stream-desired-fps-slider"), 0, 120, 1, 0); - tools.slider.setOnUpDelayed($("stream-desired-fps-slider"), 1000, __updateDesiredFpsValue, (value) => __sendParam("desired_fps", value)); + tools.slider.setParams($("stream-desired-fps-slider"), 0, 120, 1, 0, function(value) { + $("stream-desired-fps-value").innerHTML = (value === 0 ? "Unlimited" : value); + }); + tools.slider.setOnUpDelayed($("stream-desired-fps-slider"), 1000, (value) => __sendParam("desired_fps", value)); $("stream-resolution-selector").onchange = (() => __sendParam("resolution", $("stream-resolution-selector").value)); @@ -508,17 +514,17 @@ export function Streamer() { if (state.streamer) { tools.el.setEnabled($("stream-quality-slider"), true); - tools.slider.setValue($("stream-quality-slider"), state.streamer.encoder.quality, __updateQualityValue); + tools.slider.setValue($("stream-quality-slider"), state.streamer.encoder.quality); if (state.features.h264 && __janus_enabled) { __setMinMax($("stream-h264-bitrate-slider"), state.limits.h264_bitrate); tools.el.setEnabled($("stream-h264-bitrate-slider"), true); - tools.slider.setValue($("stream-h264-bitrate-slider"), state.streamer.h264.bitrate, __updateH264BitrateValue); + tools.slider.setValue($("stream-h264-bitrate-slider"), state.streamer.h264.bitrate); } __setMinMax($("stream-desired-fps-slider"), state.limits.desired_fps); tools.el.setEnabled($("stream-desired-fps-slider"), true); - tools.slider.setValue($("stream-desired-fps-slider"), state.streamer.source.desired_fps, __updateDesiredFpsValue); + tools.slider.setValue($("stream-desired-fps-slider"), state.streamer.source.desired_fps); let resolution_str = __makeStringResolution(state.streamer.source.resolution); if (__makeStringResolution(__resolution) !== resolution_str) { @@ -597,18 +603,6 @@ export function Streamer() { el.max = limits.max; }; - var __updateQualityValue = function(value) { - $("stream-quality-value").innerHTML = `${value}%`; - }; - - var __updateDesiredFpsValue = function(value) { - $("stream-desired-fps-value").innerHTML = (value === 0 ? "Unlimited" : value); - }; - - var __updateH264BitrateValue = function(value) { - $("stream-h264-bitrate-value").innerHTML = value; - }; - var __clickModeRadio = function() { if (_Janus !== null) { let mode = tools.radio.getValue("stream-mode-radio"); diff --git a/web/share/js/tools.js b/web/share/js/tools.js index eb3ab957..79dbd432 100644 --- a/web/share/js/tools.js +++ b/web/share/js/tools.js @@ -129,13 +129,13 @@ export var tools = new function() { self.slider = new function() { return { - "setOnUpDelayed": function(el, delay, display_callback, execute_callback) { - el.execution_timer = null; + "setOnUpDelayed": function(el, delay, execute_callback) { + el.__execution_timer = null; let clear_timer = function() { - if (el.execution_timer) { - clearTimeout(el.execution_timer); - el.execution_timer = null; + if (el.__execution_timer) { + clearTimeout(el.__execution_timer); + el.__execution_timer = null; } }; @@ -147,26 +147,27 @@ export var tools = new function() { let value = self.slider.getValue(el); event.preventDefault(); clear_timer(); - el.execution_timer = setTimeout(function() { + el.__execution_timer = setTimeout(function() { execute_callback(value); }, delay); }; - - let value = self.slider.getValue(el); - el.oninput = el.onchange = () => display_callback(value); - display_callback(value); }, - "setParams": function(el, min, max, step, value) { + "setParams": function(el, min, max, step, value, display_callback=null) { el.min = min; el.max = max; el.step = step; el.value = value; + if (display_callback) { + el.oninput = el.onchange = () => display_callback(self.slider.getValue(el)); + display_callback(self.slider.getValue(el)); + el.__display_callback = display_callback; + } }, - "setValue": function(el, value, callback=null) { + "setValue": function(el, value) { if (el.value != value) { el.value = value; - if (callback) { - callback(value); + if (el.__display_callback) { + el.__display_callback(value); } } }, |