diff options
| author | Devaev Maxim <[email protected]> | 2018-09-29 03:43:46 +0300 |
|---|---|---|
| committer | Devaev Maxim <[email protected]> | 2018-09-29 03:43:46 +0300 |
| commit | 6d57846ef4e8fb6dcc74b1253e7081304ec9521f (patch) | |
| tree | 50f319fb781bc29169815d74b06eed861471176f | |
| parent | 7d403822b53398d0c935d0d8b0e355846d14ef3d (diff) | |
screenshot using web ui
| -rw-r--r-- | web/index.html | 6 | ||||
| -rw-r--r-- | web/js/stream.js | 20 |
2 files changed, 22 insertions, 4 deletions
diff --git a/web/index.html b/web/index.html index 4fd108b0..61e9f4dc 100644 --- a/web/index.html +++ b/web/index.html @@ -71,7 +71,8 @@ <button id="show-keyboard-button">• Show keyboard</button> <hr> <button id="show-stream-button">• Show stream</button> - <button disabled id="stream-reset-button">• Reset stream</button> + <hr> + <button disabled id="stream-screenshot-button">• Take a screenshot</button> </div> <hr> <div data-dont-hide-menu class="ctl-dropdown-content-text"> @@ -85,6 +86,9 @@ <input id="stream-size-slider" type="range" min="50" max="150" value="100" step="10" /> </div> </div> + <div class="ctl-dropdown-content-buttons"> + <button disabled id="stream-reset-button">• Reset stream</button> + </div> </div> </div> </li> diff --git a/web/js/stream.js b/web/js/stream.js index 18907788..71f0345b 100644 --- a/web/js/stream.js +++ b/web/js/stream.js @@ -19,11 +19,14 @@ function Stream() { $("stream-quality-select").innerHTML += "<option value=\"" + quality + "\">" + quality + "%</option>"; } - tools.setOnClick($("stream-reset-button"), __clickResetButton); + tools.setOnClick($("stream-screenshot-button"), __clickScreenshotButton); + $("stream-quality-select").onchange = __changeQuality; $("stream-size-slider").oninput = __resize; $("stream-size-slider").onchange = __resize; + tools.setOnClick($("stream-reset-button"), __clickResetButton); + __startPoller(); }; @@ -42,8 +45,9 @@ function Stream() { $("stream-box").classList.add("stream-box-inactive"); $("stream-led").className = "led-off"; $("stream-led").title = "Stream inactive"; - $("stream-reset-button").disabled = true; + $("stream-screenshot-button").disabled = true; $("stream-quality-select").disabled = true; + $("stream-reset-button").disabled = true; } else if (http.status === 200) { if (__prev_state) { if (__normal_size != response.stream.resolution) { @@ -58,8 +62,9 @@ function Stream() { $("stream-box").classList.remove("stream-box-inactive"); $("stream-led").className = "led-on"; $("stream-led").title = "Stream is active"; - $("stream-reset-button").disabled = false; + $("stream-screenshot-button").disabled = false; $("stream-quality-select").disabled = false; + $("stream-reset-button").disabled = false; } } } @@ -67,6 +72,15 @@ function Stream() { setTimeout(__startPoller, 1000); }; + var __clickScreenshotButton = function() { + var el_a = document.createElement("a"); + el_a.href = "/streamer/snapshot"; + el_a.download = "screenshot.jpg"; + document.body.appendChild(el_a); + el_a.click(); + setTimeout(() => document.body.removeChild(el_a), 0); + }; + var __clickResetButton = function() { $("stream-reset-button").disabled = true; var http = tools.makeRequest("POST", "/kvmd/streamer/reset", function() { |