30 Oct
2015
30 Oct
'15
3:08 a.m.
Module: check_mk
Branch: master
Commit: 1ca16dace4c234d6c1306aed099eacce10b063cd
URL:
http://git.mathias-kettner.de/git/?p=check_mk.git;a=commit;h=1ca16dace4c234…
Author: Lars Michelsen <lm(a)mathias-kettner.de>
Date: Thu Oct 29 09:21:52 2015 +0100
Retinafied help button, cleaned up help button rendering code
---
web/htdocs/htmllib.py | 7 ++++---
web/htdocs/images/helpbutton_active.png | Bin 1104 -> 0 bytes
web/htdocs/images/helpbutton_active_hi.png | Bin 1153 -> 0 bytes
web/htdocs/images/helpbutton_passive.png | Bin 991 -> 0 bytes
web/htdocs/images/helpbutton_passive_hi.png | Bin 935 -> 0 bytes
web/htdocs/images/icon_help.png | Bin 0 -> 3728 bytes
web/htdocs/js/checkmk.js | 30 +++++++++++++++------------
web/htdocs/pages.css | 24 ++++++++++-----------
8 files changed, 32 insertions(+), 29 deletions(-)
diff --git a/web/htdocs/htmllib.py b/web/htdocs/htmllib.py
index 15d506d..1e36f51 100644
--- a/web/htdocs/htmllib.py
+++ b/web/htdocs/htmllib.py
@@ -923,8 +923,9 @@ class html:
def top_heading_right(self):
cssclass = self.help_visible and "active" or "passive"
- self.write('<a id=helpbutton class=%s href="#"
onclick="help_toggle();" style="display: none"></a>' %
- cssclass)
+ self.icon_button(None, _("Toggle context help texts"),
"help", id="helpbutton",
+ onclick="toggle_help()",
style="display:none", ty="icon", cssclass=cssclass)
+
self.write("%s</td></tr></table>" %
_("<a href=\"http://mathias-kettner.de\"><img
src=\"images/logo_mk_small.png\"/></a>"))
self.write("<hr class=header>\n")
@@ -968,7 +969,7 @@ class html:
def body_end(self):
if self.have_help:
- self.javascript("help_enable();")
+ self.javascript("enable_help();")
if self.keybindings_enabled and self.keybindings:
self.javascript("var keybindings = %r;\n"
"document.body.onkeydown = keybindings_keydown;\n"
diff --git a/web/htdocs/images/helpbutton_active.png
b/web/htdocs/images/helpbutton_active.png
deleted file mode 100644
index 53b6df8..0000000
Binary files a/web/htdocs/images/helpbutton_active.png and /dev/null differ
diff --git a/web/htdocs/images/helpbutton_active_hi.png
b/web/htdocs/images/helpbutton_active_hi.png
deleted file mode 100644
index b929f1e..0000000
Binary files a/web/htdocs/images/helpbutton_active_hi.png and /dev/null differ
diff --git a/web/htdocs/images/helpbutton_passive.png
b/web/htdocs/images/helpbutton_passive.png
deleted file mode 100644
index 266cb54..0000000
Binary files a/web/htdocs/images/helpbutton_passive.png and /dev/null differ
diff --git a/web/htdocs/images/helpbutton_passive_hi.png
b/web/htdocs/images/helpbutton_passive_hi.png
deleted file mode 100644
index e79df53..0000000
Binary files a/web/htdocs/images/helpbutton_passive_hi.png and /dev/null differ
diff --git a/web/htdocs/images/icon_help.png b/web/htdocs/images/icon_help.png
new file mode 100644
index 0000000..d4851ca
Binary files /dev/null and b/web/htdocs/images/icon_help.png differ
diff --git a/web/htdocs/js/checkmk.js b/web/htdocs/js/checkmk.js
index 342b182..efd7095 100644
--- a/web/htdocs/js/checkmk.js
+++ b/web/htdocs/js/checkmk.js
@@ -2070,24 +2070,28 @@ function vs_listofmultiple_init(varprefix) {
//# | |
//# '--------------------------------------------------------------------'
-function help_enable() {
- var aHelp = document.getElementById('helpbutton');
- aHelp.style.display = "inline-block";
+function enable_help()
+{
+ var help = document.getElementById('helpbutton');
+ help.style.display = "inline-block";
}
-function help_toggle() {
- var aHelp = document.getElementById('helpbutton');
- if (aHelp.className == "active") {
- aHelp.className = "passive";
- help_switch(false);
- }
- else {
- aHelp.className = "active";
- help_switch(true);
+function toggle_help()
+{
+ var help = document.getElementById('helpbutton');
+ if (has_class(help, "active")) {
+ remove_class(help, "active");
+ add_class(help, "passive");
+ switch_help(false);
+ } else {
+ add_class(help, "active");
+ remove_class(help, "passive");
+ switch_help(true);
}
}
-function help_switch(how) {
+function switch_help(how)
+{
// recursive scan for all div class=help elements
var helpdivs = document.getElementsByClassName('help');
for (var i=0; i<helpdivs.length; i++) {
diff --git a/web/htdocs/pages.css b/web/htdocs/pages.css
index 271d841..6a646c7 100644
--- a/web/htdocs/pages.css
+++ b/web/htdocs/pages.css
@@ -889,22 +889,20 @@ div.togglebutton.checkbox.off { opacity: 0.5; filter:
alpha(opacity=50); }
a#helpbutton {
width: 19px;
height: 19px;
- margin: 0px 5px;
+ margin: 0 5px;
position: relative;
- top: 2px;
- left: 3px;
-}
-a#helpbutton.active:hover {
- background-image: url("images/helpbutton_active_hi.png");
-}
-a#helpbutton.passive:hover {
- background-image: url("images/helpbutton_passive_hi.png");
-}
-a#helpbutton.active {
- background-image: url("images/helpbutton_active.png");
+ top: -8px;
+ left: -2px;
}
+
a#helpbutton.passive {
- background-image: url("images/helpbutton_passive.png");
+ filter: grayscale(100%);
+ -webkit-filter: grayscale(100%);
+ -moz-filter: grayscale(100%);
+ -ms-filter: grayscale(100%);
+ -o-filter: grayscale(100%);
+ filter: gray;
+ -webkit-filter: grayscale(1);
}
div.help {