diff --git a/kvmd/web/css/stream.css b/kvmd/web/css/stream.css index dc0f7baf..96b19810 100644 --- a/kvmd/web/css/stream.css +++ b/kvmd/web/css/stream.css @@ -7,13 +7,30 @@ img#stream-image { } img.stream-image-active { - cursor: crosshair; -webkit-filter: none; filter: none; } img.stream-image-inactive { - cursor: wait; - -webkit-filter: grayscale(100%) brightness(75%); - filter: grayscale(100%) brightness(75%); + -webkit-filter: grayscale(100%) brightness(75%) sepia(75%); + filter: grayscale(100%) brightness(75%) sepia(75%); +} + +div#stream-box { + position: relative; + display: inline-block; +} +div.stream-box-active: { + cursor: crosshair; +} +div.stream-box-inactive::after { + cursor: wait; + content: ""; + position: absolute; + left: 0; + top: 0; + width: 100%; + height: 100%; + display: inline-block; + background: radial-gradient(transparent 20%, black); } diff --git a/kvmd/web/index.html b/kvmd/web/index.html index 12d764f5..c7f0491f 100644 --- a/kvmd/web/index.html +++ b/kvmd/web/index.html @@ -205,7 +205,9 @@
Stream
- Loading... +
+ +
diff --git a/kvmd/web/js/mouse.js b/kvmd/web/js/mouse.js index 3195582c..b9d27e67 100644 --- a/kvmd/web/js/mouse.js +++ b/kvmd/web/js/mouse.js @@ -4,12 +4,12 @@ var mouse = new function() { var __sent_pos = {x: 0, y:0}; this.init = function() { - el_stream_image = $("stream-image"); - el_stream_image.onmousedown = (event) => __buttonHandler(event, true); - el_stream_image.onmouseup = (event) => __buttonHandler(event, false); - el_stream_image.oncontextmenu = (event) => event.preventDefault(); - el_stream_image.onmousemove = __moveHandler; - el_stream_image.onwheel = (event) => __wheelHandler(event); + el_stream_box = $("stream-box"); + el_stream_box.onmousedown = (event) => __buttonHandler(event, true); + el_stream_box.onmouseup = (event) => __buttonHandler(event, false); + el_stream_box.oncontextmenu = (event) => event.preventDefault(); + el_stream_box.onmousemove = __moveHandler; + el_stream_box.onwheel = (event) => __wheelHandler(event); setInterval(__sendMove, 100); }; diff --git a/kvmd/web/js/stream.js b/kvmd/web/js/stream.js index feb05d13..51e00a96 100644 --- a/kvmd/web/js/stream.js +++ b/kvmd/web/js/stream.js @@ -11,12 +11,14 @@ var stream = new function() { tools.info("Refreshing stream ..."); __prev_state = false; $("stream-image").className = "stream-image-inactive"; + $("stream-box").className = "stream-box-inactive"; $("stream-led").className = "led-off"; $("stream-reset-button").disabled = true; } else if (!__prev_state) { __refreshImage(); __prev_state = true; $("stream-image").className = "stream-image-active"; + $("stream-box").className = "stream-box-active"; $("stream-led").className = "led-on"; $("stream-reset-button").disabled = false; } diff --git a/kvmd/web/png/blank-stream.png b/kvmd/web/png/blank-stream.png new file mode 100644 index 00000000..f1e11b14 Binary files /dev/null and b/kvmd/web/png/blank-stream.png differ