Use CSS classes to control the visibility

This commit is contained in:
Carsten Grohmann 2018-10-16 19:50:33 +02:00
parent 5d83eeccbb
commit 5a89d46034
2 changed files with 19 additions and 22 deletions

View File

@ -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>

View File

@ -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):