fixed pikvm/pikvm#223: confirm stream window closing

This commit is contained in:
Devaev Maxim 2021-03-06 15:50:12 +03:00
parent ec0f985109
commit 8ee6a4a517
4 changed files with 24 additions and 9 deletions

View File

@ -472,7 +472,7 @@
</div> </div>
</li> </li>
</ul> </ul>
<div class="window" id="stream-window"> <div class="window" id="stream-window" data-close-confirm="Do you want to close the stream? This action will temporarily stop&lt;br&gt;the video transmission until you open the broadcast again.&lt;br&gt;This can be useful for saving traffic.">
<div class="window-header" id="stream-window-header"> <div class="window-header" id="stream-window-header">
<div class="window-grab">Stream</div> <div class="window-grab">Stream</div>
<button class="window-button-close">&times;</button> <button class="window-button-close">&times;</button>
@ -501,7 +501,7 @@
</div> </div>
</div> </div>
</div> </div>
<div class="window" id="keyboard-window"> <div class="window" id="keyboard-window" data-close-confirm="">
<div class="window-header" id="keyboard-window-header"> <div class="window-header" id="keyboard-window-header">
<div class="window-grab">Virtual Keyboard</div> <div class="window-grab">Virtual Keyboard</div>
<button class="window-button-close">&times;</button> <button class="window-button-close">&times;</button>
@ -1345,7 +1345,7 @@
</div> </div>
</div> </div>
</div> </div>
<div class="window" id="about-window"> <div class="window" id="about-window" data-close-confirm="">
<div class="window-header" id=""> <div class="window-header" id="">
<div class="window-grab">About</div> <div class="window-grab">About</div>
<button class="window-button-close">&times;</button> <button class="window-button-close">&times;</button>

View File

@ -1,4 +1,7 @@
+window("stream-window", "Stream", true) - let confirm_msg = "Do you want to close the stream? This action will temporarily stop<br>";
- confirm_msg += "the video transmission until you open the broadcast again.<br>";
- confirm_msg += "This can be useful for saving traffic.";
+window("stream-window", "Stream", true, confirm_msg)
div(id="stream-info") div(id="stream-info")
div(id="stream-box" class="stream-box-inactive") div(id="stream-box" class="stream-box-inactive")
img(id="stream-image" class="stream-image-inactive" src=`${png_dir}/blank-stream.png`) img(id="stream-image" class="stream-image-inactive" src=`${png_dir}/blank-stream.png`)

View File

@ -1,5 +1,5 @@
mixin window(id, title, with_header_id=false) mixin window(id, title, with_header_id=false, close_confirm_msg="")
div(id=id class="window") div(id=id class="window" data-close-confirm=close_confirm_msg)
div(id=(with_header_id ? `${id}-header` : "") class="window-header") div(id=(with_header_id ? `${id}-header` : "") class="window-header")
div(class="window-grab") #{title} div(class="window-grab") #{title}
button(class="window-button-close") &times; button(class="window-button-close") &times;

View File

@ -62,8 +62,20 @@ function __WindowManager() {
let el_button = el_window.querySelector(".window-header .window-button-close"); let el_button = el_window.querySelector(".window-header .window-button-close");
if (el_button) { if (el_button) {
tools.setOnClick(el_button, function() { tools.setOnClick(el_button, function() {
__closeWindow(el_window); let close_window = function() {
__activateLastWindow(el_window); __closeWindow(el_window);
__activateLastWindow(el_window);
};
let confirm_msg = el_window.getAttribute("data-close-confirm");
if (confirm_msg) {
self.confirm(confirm_msg).then(function(ok) {
if (ok) {
close_window();
}
});
} else {
close_window();
}
}); });
} }
} }
@ -456,7 +468,7 @@ function __WindowManager() {
} }
el_window.setAttribute("data-centered", ""); el_window.setAttribute("data-centered", "");
el_window.onclick = el_window.ontouchend = () => __activateWindow(el_window); el_window.onmousedown = el_window.ontouchstart = () => __activateWindow(el_window);
el_grab.onmousedown = startMoving; el_grab.onmousedown = startMoving;
el_grab.ontouchstart = startMoving; el_grab.ontouchstart = startMoving;