improve log window behaviour

certtools · Sep 18, 2024 · 191ad48 · 191ad48
1 parent 2117b60
commit 191ad48
Show file tree

Hide file tree

Showing 4 changed files with 46 additions and 42 deletions.
diff --git a/intelmq_manager/static/css/style.css b/intelmq_manager/static/css/style.css
@@ -23,7 +23,7 @@ nav ul.nav.navbar-top-links li.active {
   padding: 5px;
   width: 500px;
   height: 44px;
-  overflow: auto;
+  overflow: hidden;
   resize: vertical;
   position: absolute;
   top: 0;
@@ -33,9 +33,8 @@ nav ul.nav.navbar-top-links li.active {
 #wrapper .navbar #log-window.extended {
   height: auto;
   max-height: 100vh;
-  width: auto;
   cursor: unset;
-  overflow: scroll;
+  overflow-y: auto;
 }
 #wrapper .navbar #log-window [role=close] {
   float: right;
@@ -146,4 +145,3 @@ nav ul.nav.navbar-top-links li.active {
 #network-container .network-right-menu .vis-physics-toggle {
   right: 480px;
 }
-/*# sourceMappingURL=style.css.map */
diff --git a/intelmq_manager/static/js/static.js b/intelmq_manager/static/js/static.js
@@ -105,28 +105,32 @@ if (!String.prototype.format) {
 let lw_tips = new Set();
 $(function () {
     let $lw = $("#log-window");
+
+    // close log window on Escape 
+    $(document).on('keydown.close-log-window', event => {
+        if (event.key == "Escape") {
+            $lw.removeClass("extended");
+        }
+    });
+
+    // toggle log window expanded state - if not selecting text
+    let mDownSelection = 0
+    $lw.on("mousedown", e => {
+        mDownSelection = document.getSelection().toString().length
+    });
+    $lw.on("mouseup", e => {
+        if (mDownSelection == document.getSelection().toString().length) {
+            $lw.toggleClass("extended");
+        }
+    });
+
+    // close log window via X
     let closeFn = () => {
         $lw.hide();
         $(".contents", $lw).html("");
         lw_tips.clear(); // no tips displayed
         return false;
     };
-
-    $lw.on("click", e => { // clicking enlarges but not shrinks so that we may copy the text
-        let btn = $(e.target);
-        if (!btn.hasClass("extended")) {
-            btn.toggleClass("extended");
-
-            //$(".alert", this).prependTo(btn);
-
-            $(document).on('keydown.close-log-window', event => {
-                if (event.key == "Escape") {
-                    $(document).off('keydown.close-log-window');
-                    $lw.removeClass("extended");
-                }
-            });
-        }
-    });
     $("#log-window [role=close]").click(closeFn);
 });
 

diff --git a/intelmq_manager/static/less/style.less b/intelmq_manager/static/less/style.less
@@ -25,20 +25,20 @@ nav ul.nav.navbar-top-links li.active {
   padding: 5px;
   width: 500px;
   height: 44px;
-  overflow: auto;
+  overflow: hidden; 
   resize: vertical;
   position: absolute;
   top: 0;
   right: 0;
   cursor: pointer;
 
   &.extended {
-    height: auto;
+    height: auto;  
     max-height: 100vh;
-    width: auto;
-    cursor: unset;
-    overflow:scroll;
-  }
+    // width: auto;   
+    cursor: unset;  
+    overflow-y: auto;
+  } 
 
   [role=close] {
     float: right;
@@ -61,13 +61,13 @@ nav ul.nav.navbar-top-links li.active {
     font-family: Menlo, Monaco, Consolas, "Courier New", monospace;
   }
 
-    .alert a{
-        text-decoration: underline;
-        display: inline-block;
-        padding: 4px;
-        border: 1px solid #ccc;
-        border-radius: 10px;
-    }
+  .alert a {
+    text-decoration: underline;
+    display: inline-block;
+    padding: 4px;
+    border: 1px solid #ccc;
+    border-radius: 10px;
+  }
 }
 
 .fa {
@@ -81,8 +81,9 @@ nav ul.nav.navbar-top-links li.active {
 /*
  * Management page
  */
-#botnet-panels > .panel[data-botnet-group] {
+#botnet-panels>.panel[data-botnet-group] {
   display: none; // initially, all other panels are hidden
+
   &[data-botnet-group=botnet] {
     display: block;
   }
@@ -119,11 +120,10 @@ nav ul.nav.navbar-top-links li.active {
 
 #templates {
   display: none;
-}
-
-#side-menu {
-}
+} 
 
+#side-menu {} 
+
 #network-container {
 
   .control-buttons {
@@ -139,6 +139,7 @@ nav ul.nav.navbar-top-links li.active {
   }
 
   .monitor-button {
+
     //background-image: url('../plugins/vis.js/img/network/rightArrow.png');
     //background-size: 24%;
     div a {
@@ -151,11 +152,12 @@ nav ul.nav.navbar-top-links li.active {
   }
 
   .network-right-menu {
-    > div {
+    >div {
       display: block;
     }
 
-    .vis-live-toggle, .vis-physics-toggle {
+    .vis-live-toggle,
+    .vis-physics-toggle {
       border-radius: 10px;
       position: absolute;
       right: 560px;
@@ -185,4 +187,4 @@ nav ul.nav.navbar-top-links li.active {
       right: 480px;
     }
   }
-}
+}
diff --git a/intelmq_manager/templates/base.mako b/intelmq_manager/templates/base.mako
@@ -107,7 +107,7 @@
                            class="btn btn-primary" style="display: none;">
                 </div>
                 <!-- /.navbar-top-links -->
-                <div title="Click to expand, then escape to minimize again." id='log-window'>
+                <div title="Click to expand, then escape to minimize again." id='log-window' class="extended">
                     <i role="close" class="fa fa-times"></i>
                     <div class="contents"></div>
                 </div>