Use CSS to show/hide elements in default view
This commit is contained in:
parent
824e8365e6
commit
138022beae
@ -6,6 +6,7 @@
|
|||||||
<title>OOM Analyser</title>
|
<title>OOM Analyser</title>
|
||||||
|
|
||||||
<style>
|
<style>
|
||||||
|
/* Use BEM naming convention */
|
||||||
|
|
||||||
.text--append-suffix-kbytes {
|
.text--append-suffix-kbytes {
|
||||||
text-align: right;
|
text-align: right;
|
||||||
@ -25,15 +26,19 @@
|
|||||||
text-align: right;
|
text-align: right;
|
||||||
}
|
}
|
||||||
|
|
||||||
.js-text--display-none {
|
|
||||||
display: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
.text__superscript {
|
.text__superscript {
|
||||||
vertical-align: super;
|
vertical-align: super;
|
||||||
font-size: 0.83em;
|
font-size: 0.83em;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.text--default-hide {
|
||||||
|
/* empty just used to hide elements in the default view */
|
||||||
|
|
||||||
|
}
|
||||||
|
.text--default-show {
|
||||||
|
/* empty just used to show elements in the default view */
|
||||||
|
}
|
||||||
|
|
||||||
svg {
|
svg {
|
||||||
display: block;
|
display: block;
|
||||||
max-height: 200px;
|
max-height: 200px;
|
||||||
@ -75,13 +80,16 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
.js-notify_box__msg--warning {
|
.js-notify_box__msg--warning {
|
||||||
color: #9F6000;
|
color: #9F6000;
|
||||||
background-color: #FEEFB3;
|
background-color: #FEEFB3;
|
||||||
}
|
}
|
||||||
.js-notify_box__msg--error {
|
.js-notify_box__msg--error {
|
||||||
color: #D8000C;
|
color: #D8000C;
|
||||||
background-color: #FFD2D2;
|
background-color: #FFD2D2;
|
||||||
}
|
}
|
||||||
|
.js-text--display-none {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
.license__text {
|
.license__text {
|
||||||
font-size: small;
|
font-size: small;
|
||||||
@ -117,9 +125,9 @@ function goBack() {
|
|||||||
</p>
|
</p>
|
||||||
|
|
||||||
<p>
|
<p>
|
||||||
<div class="terminal notify_box js-text--display-none" id="notify_box"></div>
|
<div class="terminal notify_box text--default-hide js-text--display-none" id="notify_box"></div>
|
||||||
|
|
||||||
<div id="input">
|
<div class="text--default-show" id="input">
|
||||||
<h2>Step 1 - Enter your OOM message</h2>
|
<h2>Step 1 - Enter your OOM message</h2>
|
||||||
<textarea autocomplete="off" cols="100" id="textarea_oom" onfocusin="OOMAnalyser.OOMDisplayInstance.empty_textarea_oom()" rows="20" title="OOM input field">Add your OOMhere</textarea>
|
<textarea autocomplete="off" cols="100" id="textarea_oom" onfocusin="OOMAnalyser.OOMDisplayInstance.empty_textarea_oom()" rows="20" title="OOM input field">Add your OOMhere</textarea>
|
||||||
<br/>
|
<br/>
|
||||||
@ -128,7 +136,7 @@ function goBack() {
|
|||||||
<button onclick="OOMAnalyser.OOMDisplayInstance.copy_example_to_form()" title="Copy an example OOM into the input area">Insert example</button>
|
<button onclick="OOMAnalyser.OOMDisplayInstance.copy_example_to_form()" title="Copy an example OOM into the input area">Insert example</button>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div id="analysis">
|
<div class="text--default-hide js-text--display-none" id="analysis">
|
||||||
|
|
||||||
<h2>Step 2 - Results</h2>
|
<h2>Step 2 - Results</h2>
|
||||||
<p>
|
<p>
|
||||||
@ -598,7 +606,7 @@ function goBack() {
|
|||||||
title="Show / hide installation guide">(click to show / hide)</a>
|
title="Show / hide installation guide">(click to show / hide)</a>
|
||||||
</h2>
|
</h2>
|
||||||
|
|
||||||
<div class="js-text--display-none" id="installation">
|
<div class="text--default-hide js-text--display-none" id="installation">
|
||||||
Installing OOMAnalyser is quite easy since OOMAnalyser consists only of two files, a
|
Installing OOMAnalyser is quite easy since OOMAnalyser consists only of two files, a
|
||||||
HTML file and a JavaScript file. Both can be stored locally to use OOMAnalyser
|
HTML file and a JavaScript file. Both can be stored locally to use OOMAnalyser
|
||||||
without an Internet connection.
|
without an Internet connection.
|
||||||
|
@ -843,8 +843,13 @@ Killed process 6576 (java) total-vm:33914892kB, anon-rss:20629004kB, file-rss:0k
|
|||||||
if clean_oom:
|
if clean_oom:
|
||||||
document.getElementById('textarea_oom').value = self.paste_note
|
document.getElementById('textarea_oom').value = self.paste_note
|
||||||
|
|
||||||
hide_element('analysis')
|
# hide all elements marked to be hidden by default
|
||||||
show_element('input')
|
for element in document.querySelectorAll('.text--default-hide'):
|
||||||
|
element.classList.add('js-text--display-none')
|
||||||
|
|
||||||
|
# show all elements marked to be shown by default
|
||||||
|
for element in document.querySelectorAll('.text--default-show'):
|
||||||
|
element.classList.remove('js-text--display-none')
|
||||||
|
|
||||||
# show hidden rows
|
# show hidden rows
|
||||||
for element in document.querySelectorAll('table .js-text--display-none'):
|
for element in document.querySelectorAll('table .js-text--display-none'):
|
||||||
@ -858,7 +863,6 @@ Killed process 6576 (java) total-vm:33914892kB, anon-rss:20629004kB, file-rss:0k
|
|||||||
element = document.getElementById('notify_box')
|
element = document.getElementById('notify_box')
|
||||||
while element.firstChild:
|
while element.firstChild:
|
||||||
element.removeChild(element.firstChild)
|
element.removeChild(element.firstChild)
|
||||||
hide_element('notify_box')
|
|
||||||
|
|
||||||
# remove svg charts
|
# remove svg charts
|
||||||
for element_id in ('svg_swap', 'svg_ram'):
|
for element_id in ('svg_swap', 'svg_ram'):
|
||||||
|
Loading…
Reference in New Issue
Block a user