From 5a89d46034999cdf20bd79521d97651f4d24fe6d Mon Sep 17 00:00:00 2001
From: Carsten Grohmann <mail@carstengrohmann.de>
Date: Tue, 16 Oct 2018 19:50:33 +0200
Subject: [PATCH] Use CSS classes to control the visibility

---
 OOMAnalyser.html | 13 ++++++-------
 OOMAnalyser.py   | 28 +++++++++++++---------------
 2 files changed, 19 insertions(+), 22 deletions(-)

diff --git a/OOMAnalyser.html b/OOMAnalyser.html
index e79e007..70e8e12 100644
--- a/OOMAnalyser.html
+++ b/OOMAnalyser.html
@@ -25,6 +25,10 @@
             text-align: right;
         }
 
+        .js-text--display-none {
+            display: none;
+        }
+
         .text__superscript {
             vertical-align: super;
             font-size: 0.83em;
@@ -59,10 +63,6 @@
             word-wrap: break-word;
         }
 
-        .js-table__tr--hide {
-            display: none;
-        }
-
         .a--small {
             font-size: small;
             font-weight: unset;
@@ -90,7 +90,6 @@
 
         .license__text {
             font-size: small;
-            display: none;
         }
 
         .notify_box {
@@ -133,7 +132,7 @@ function goBack() {
 </div>
 
 <p>
-    <div class="terminal notify_box" id="notify_box"></div>
+    <div class="terminal notify_box js-text--display-none" id="notify_box"></div>
 </p>
 
 <div id="analysis">
@@ -609,7 +608,7 @@ function goBack() {
     <a href="https://github.com/CarstenGrohmann/OOMAnalyser" title="Source code on GitHub">Source Code on GitHub</a>
 </div>
 
-<div class="license__text" id="license">
+<div class="license__text js-text--display-none" id="license">
     <p>
         Copyright (c) 2017-2018 Carsten Grohmann mail &lt;add at here&gt; carsten-grohmann.de
     </p>
diff --git a/OOMAnalyser.py b/OOMAnalyser.py
index bb8dc24..65c65ca 100644
--- a/OOMAnalyser.py
+++ b/OOMAnalyser.py
@@ -16,28 +16,26 @@ VERSION = "0.2.0"
 
 def hide_element(element_id):
     """Hide the given HTML element"""
-    document.getElementById(element_id).style.display = 'none'
+    element = document.getElementById(element_id)
+    element.classList.add('js-text--display-none')
 
 
 def show_element(element_id):
     """Show the given HTML element"""
-    document.getElementById(element_id).style.display = 'block'
+    element = document.getElementById(element_id)
+    element.classList.remove('js-text--display-none')
 
 
 def toggle(element_id):
     """Toggle the visibility of the given HTML element"""
     element = document.getElementById(element_id)
-    display_prop = element.style.display
-    if display_prop and display_prop == 'block':
-        element.style.display = 'none'
-    else:
-        element.style.display = 'block'
+    element.classList.toggle('js-text--display-none')
 
 
 def error(msg):
     """Show the error box and add the error message"""
+    show_element('notify_box')
     notify_box = document.getElementById('notify_box')
-    notify_box.style.display = 'block'
     notification = document.createElement('div')
     notification.classList.add('js-notify_box__msg--error')
     notification.innerHTML = 'ERROR: {}<br>'.format(msg)
@@ -46,8 +44,8 @@ def error(msg):
 
 def warning(msg):
     """Show the error box and add the warning message"""
+    show_element('notify_box')
     notify_box = document.getElementById('notify_box')
-    notify_box.style.display = 'block'
     notification = document.createElement('div')
     notification.classList.add('js-notify_box__msg--warning')
     notification.innerHTML = 'WARNING: {}<br>'.format(msg)
@@ -746,7 +744,7 @@ Killed process 6576 (java) total-vm:33914892kB, anon-rss:20629004kB, file-rss:0k
 
         if content == '<not found>':
             row = element.parentNode
-            row.classList.add('js-table__tr--hide')
+            row.classList.add('js-text--display-none')
         elif item.endswith('_kb'):
             element.classList.add('text--append-suffix-kbytes')
         elif item.endswith('_pages'):
@@ -765,8 +763,8 @@ Killed process 6576 (java) total-vm:33914892kB, anon-rss:20629004kB, file-rss:0k
         show_element('input')
 
         # show hidden rows
-        for element in document.getElementsByClassName('js-table__tr--hide'):
-            element.classList.remove('js-table__tr--hide')
+        for element in document.querySelectorAll('table .js-text--display-none'):
+            element.classList.remove('js-text--display-none')
 
         for item in self.mem_modinfo_entries:
             element = document.getElementById(item)
@@ -877,11 +875,11 @@ Killed process 6576 (java) total-vm:33914892kB, anon-rss:20629004kB, file-rss:0k
         row_with_oom = oom_element.parentNode.parentNode
         toggle_msg = document.getElementById('oom_toogle_msg')
 
-        if show or row_with_oom.classList.contains('js-table__tr--hide'):
-            row_with_oom.classList.remove('js-table__tr--hide')
+        if show or row_with_oom.classList.contains('js-text--display-none'):
+            row_with_oom.classList.remove('js-text--display-none')
             toggle_msg.text = "(click to hide)"
         else:
-            row_with_oom.classList.add('js-table__tr--hide')
+            row_with_oom.classList.add('js-text--display-none')
             toggle_msg.text = "(click to show)"
 
     def analyse_and_show(self):