summaryrefslogtreecommitdiff
path: root/kvmd/web/js
diff options
context:
space:
mode:
authorDevaev Maxim <[email protected]>2018-07-24 02:48:23 +0300
committerDevaev Maxim <[email protected]>2018-07-24 02:48:23 +0300
commit22c060956e37a9cb1733a3e7f808048779a5a72a (patch)
treea1fa16f1648622731555d574ba4ccb6edda01dd5 /kvmd/web/js
parent70b7f73e2063cdb61f1d31a8edf679f4f264e008 (diff)
floating windows
Diffstat (limited to 'kvmd/web/js')
-rw-r--r--kvmd/web/js/main.js2
-rw-r--r--kvmd/web/js/ui.js43
2 files changed, 43 insertions, 2 deletions
diff --git a/kvmd/web/js/main.js b/kvmd/web/js/main.js
index f33c7203..5a55e966 100644
--- a/kvmd/web/js/main.js
+++ b/kvmd/web/js/main.js
@@ -1,5 +1,5 @@
function main () {
- window.onclick = ui.windowClickHandler;
+ ui.init();
session.loadKvmdVersion();
session.startPoller();
stream.startPoller();
diff --git a/kvmd/web/js/ui.js b/kvmd/web/js/ui.js
index 60fcf70f..e6b3de33 100644
--- a/kvmd/web/js/ui.js
+++ b/kvmd/web/js/ui.js
@@ -1,4 +1,13 @@
var ui = new function() {
+ this.init = function() {
+ window.onclick = __windowClickHandler;
+
+ Array.prototype.forEach.call(document.getElementsByClassName("window"), function(el_window) {
+ var el_header = el_window.querySelector(".window-header");
+ __makeWindowMovable(el_header, el_window);
+ });
+ };
+
this.toggleMenu = function(el_a) {
Array.prototype.forEach.call(document.getElementsByClassName("ctl-item"), function(el_item) {
var el_menu = el_item.parentElement.querySelector(".ctl-dropdown-content");
@@ -12,7 +21,7 @@ var ui = new function() {
});
};
- this.windowClickHandler = function(event) {
+ var __windowClickHandler = function(event) {
if (!event.target.matches(".ctl-item")) {
for (el_item = event.target; el_item && el_item !== document; el_item = el_item.parentNode) {
if (el_item.hasAttribute("data-force-hide-menu")) {
@@ -25,4 +34,36 @@ var ui = new function() {
ui.toggleMenu(null);
}
};
+
+ var __makeWindowMovable = function(el_header, el_body) {
+ var prev_x = 0;
+ var prev_y = 0;
+
+ function startMoving(event) {
+ event = (event || window.event);
+ event.preventDefault();
+ prev_x = event.clientX;
+ prev_y = event.clientY;
+ document.onmousemove = doMoving;
+ document.onmouseup = stopMoving;
+ }
+
+ function doMoving(event) {
+ event = (event || window.event);
+ event.preventDefault();
+ x = prev_x - event.clientX;
+ y = prev_y - event.clientY;
+ prev_x = event.clientX;
+ prev_y = event.clientY;
+ el_body.style.top = (el_body.offsetTop - y) + "px";
+ el_body.style.left = (el_body.offsetLeft - x) + "px";
+ }
+
+ function stopMoving() {
+ document.onmousemove = null;
+ document.onmouseup = null;
+ }
+
+ el_header.onmousedown = startMoving;
+ };
};