diff options
Diffstat (limited to 'web')
-rw-r--r-- | web/kvm/index.html | 3 | ||||
-rw-r--r-- | web/kvm/window-about.pug | 2 | ||||
-rw-r--r-- | web/kvm/window-keyboard.pug | 2 | ||||
-rw-r--r-- | web/kvm/window-stream.pug | 2 | ||||
-rw-r--r-- | web/kvm/windows.pug | 7 | ||||
-rw-r--r-- | web/share/js/kvm/stream.js | 28 | ||||
-rw-r--r-- | web/share/js/wm.js | 27 |
7 files changed, 57 insertions, 14 deletions
diff --git a/web/kvm/index.html b/web/kvm/index.html index be39a464..53c985ac 100644 --- a/web/kvm/index.html +++ b/web/kvm/index.html @@ -402,8 +402,9 @@ </li> </ul> <div class="window" id="stream-window"> - <div class="window-header" id="stream-window-header" style="z-index:1"> + <div class="window-header" id="stream-window-header"> <div class="window-grab">Stream</div> + <button class="window-button-close">×</button> </div> <div id="stream-info"></div> <div class="stream-box-inactive" id="stream-box"><img class="stream-image-inactive" id="stream-image" src="/share/png/blank-stream.png"></div> diff --git a/web/kvm/window-about.pug b/web/kvm/window-about.pug index 6304096e..b22d5a96 100644 --- a/web/kvm/window-about.pug +++ b/web/kvm/window-about.pug @@ -9,7 +9,7 @@ mixin about_tab(name, title, checked=false) else span(class="code-comment") No data -+window("about-window", "About", true, false) ++window("about-window", "About", false) div(id="about") table tr diff --git a/web/kvm/window-keyboard.pug b/web/kvm/window-keyboard.pug index 49d89767..467142df 100644 --- a/web/kvm/window-keyboard.pug +++ b/web/kvm/window-keyboard.pug @@ -15,7 +15,7 @@ mixin empty_key(width=0) mixin lamp(cls) img(class=`inline-lamp ${cls} led-gray` src=`${svg_dir}/led-square.svg`) -+window("keyboard-window", "Virtual Keyboard", true, true) ++window("keyboard-window", "Virtual Keyboard", true) div(id="keyboard-desktop" class="keypad" align="center") div(class="keypad-block") div(class="keypad-row") diff --git a/web/kvm/window-stream.pug b/web/kvm/window-stream.pug index a86c1812..232a3f72 100644 --- a/web/kvm/window-stream.pug +++ b/web/kvm/window-stream.pug @@ -1,4 +1,4 @@ -+window("stream-window", "Stream", false, true) ++window("stream-window", "Stream", true) div(id="stream-info") div(id="stream-box" class="stream-box-inactive") img(id="stream-image" class="stream-image-inactive" src=`${png_dir}/blank-stream.png`) diff --git a/web/kvm/windows.pug b/web/kvm/windows.pug index 21e17e0a..15fdf131 100644 --- a/web/kvm/windows.pug +++ b/web/kvm/windows.pug @@ -1,9 +1,8 @@ -mixin window(id, title, closeable=true, with_header_id=false) +mixin window(id, title, with_header_id=false) div(id=id class="window") - div(id=(with_header_id ? `${id}-header` : "") class="window-header" style=(closeable ? "" : "z-index:1")) + div(id=(with_header_id ? `${id}-header` : "") class="window-header") div(class="window-grab") #{title} - if closeable - button(class="window-button-close") × + button(class="window-button-close") × block include window-stream.pug diff --git a/web/share/js/kvm/stream.js b/web/share/js/kvm/stream.js index 4e04aa9d..5a85b41b 100644 --- a/web/share/js/kvm/stream.js +++ b/web/share/js/kvm/stream.js @@ -35,11 +35,15 @@ export function Streamer() { var __resolution = {width: 640, height: 480}; var __resolution_str = "640x480"; var __available_resolutions = []; + var __size_factor = 1; + var __client_key = tools.makeId(); var __client_id = ""; var __client_fps = -1; + var __state_for_invisible = null; + var __init__ = function() { $("stream-led").title = "Stream inactive"; @@ -60,11 +64,29 @@ export function Streamer() { tools.setOnClick($("stream-screenshot-button"), __clickScreenshotButton); tools.setOnClick($("stream-reset-button"), __clickResetButton); + + $("stream-window").show_hook = function() { + if (__state_for_invisible !== null) { + self.setState(__state_for_invisible); + } + }; }; /************************************************************************/ self.setState = function(state) { + if (!wm.isWindowVisible($("stream-window"))) { + if (__state_for_invisible === null) { + $("stream-image").src = "/share/png/blank-stream.png"; + $("stream-image").className = "stream-image-inactive"; + $("stream-box").classList.add("stream-box-inactive"); + } + __state_for_invisible = state; + state = null; + } else { + __state_for_invisible = null; + } + if (state) { tools.featureSetEnabled($("stream-quality"), state.features.quality && (state.streamer === null || state.streamer.encoder.quality > 0)); tools.featureSetEnabled($("stream-resolution"), state.features.resolution); @@ -124,12 +146,17 @@ export function Streamer() { wm.switchEnabled($("stream-reset-button"), true); $("stream-quality-slider").activated = false; $("stream-desired-fps-slider").activated = false; + tools.info("Stream: active"); } __updateStreamWindow(true, state.streamer.source.online); } else { + if ($("stream-led").className !== "led-gray") { // Чтобы не дублировать логи, когда окно стрима закрыто + tools.info("Stream: inactive"); + } + $("stream-led").className = "led-gray"; $("stream-led").title = "Stream inactive"; wm.switchEnabled($("stream-screenshot-button"), false); @@ -137,7 +164,6 @@ export function Streamer() { wm.switchEnabled($("stream-quality-slider"), false); wm.switchEnabled($("stream-desired-fps-slider"), false); wm.switchEnabled($("stream-resolution-selector"), false); - tools.info("Stream: inactive"); __updateStreamWindow(false, false); } diff --git a/web/share/js/wm.js b/web/share/js/wm.js index ee4da180..23d64af3 100644 --- a/web/share/js/wm.js +++ b/web/share/js/wm.js @@ -177,14 +177,25 @@ function __WindowManager() { }; self.showWindow = function(el_window, activate=true, center=false) { + let showed = false; if (el_window.style.visibility === "hidden") { center = true; + showed = true; } __organizeWindow(el_window, center); el_window.style.visibility = "visible"; if (activate) { __activateWindow(el_window); } + if (Object.prototype.hasOwnProperty.call(el_window, "show_hook")) { + if (showed) { + el_window.show_hook(); + } + } + }; + + self.isWindowVisible = function(el_window) { + return (window.getComputedStyle(el_window, null).visibility !== "hidden"); }; self.getViewGeometry = function() { @@ -255,7 +266,7 @@ function __WindowManager() { } else if ((el_parent = event.target.closest(".menu")) !== null) { el_parent.classList.add("menu-active"); } - tools.debug("Focus in:", el_parent); + tools.debug("UI: Focus in:", el_parent); }; var __focusOut = function(event) { @@ -267,7 +278,7 @@ function __WindowManager() { } else if ((el_parent = event.target.closest(".menu")) !== null) { el_parent.classList.remove("menu-active"); } - tools.debug("Focus out:", el_parent); + tools.debug("UI: Focus out:", el_parent); }; var __globalMouseButtonHandler = function(event) { @@ -320,6 +331,9 @@ function __WindowManager() { if (document.activeElement) { el_last_window = (document.activeElement.closest(".modal-window") || document.activeElement.closest(".window")); + if (el_last_window && window.getComputedStyle(el_last_window, null).visibility === "hidden") { + el_last_window = null; + } } if (!el_last_window || el_last_window === el_except_window) { @@ -337,8 +351,11 @@ function __WindowManager() { } if (el_last_window) { - tools.debug("Activating last window:", el_last_window); + tools.debug("UI: Activating last window:", el_last_window); __activateWindow(el_last_window); + } else { + tools.debug("UI: Unsetting focuse because no windows left"); + document.activeElement.blur(); } }; @@ -358,12 +375,12 @@ function __WindowManager() { if (el_window.className !== "modal" && parseInt(el_window.style.zIndex) !== __top_z_index) { __top_z_index += 1; el_window.style.zIndex = __top_z_index; - tools.debug("UI: activated window:", el_window); + tools.debug("UI: Activated window:", el_window); } if (el_window !== el_window_contains_focus) { el_to_focus.focus(); - tools.debug("UI: focused window:", el_window); + tools.debug("UI: Focused window:", el_window); } } }; |