Browse Source

Fix tooltips blocking clicks

pull/1/head
Scott Lahteine 10 years ago
parent
commit
c99f1de9f3
  1. 38
      Marlin/configurator/css/configurator.css
  2. 1
      Marlin/configurator/index.html
  3. 36
      Marlin/configurator/js/configurator.js

38
Marlin/configurator/css/configurator.css

@ -3,7 +3,7 @@
body { margin: 0; padding: 0; background: #56A; color: #FFC; font-family: sans-serif; }
#main { max-width: 1000px; margin: 0 auto; }
#main { max-width: 1000px; margin: 0 auto; position: relative; }
#main { padding: 0 4%; width: 92%; }
#main { font-family: monospace; }
h1, #message { text-align: center; }
@ -73,24 +73,18 @@ fieldset legend { display: none; }
#serial_stepper { padding-top: 0.75em; display: block; float: left; }
#SERIAL_PORT { display: none; }
.tooltip { position: relative; }
.tooltip::before {
content: attr(data-tooltip);
font-family: sans-serif;
font-size: 85%;
text-align: left;
#tooltip {
display: none;
max-width: 30em;
padding: 8px;
border: 2px solid #73d699;
border-radius: 1em;
position: absolute;
z-index: 999;
/*white-space:pre-wrap;*/
bottom: 9999px;
left: 110px;
font-family: sans-serif;
font-size: 85%;
color: #000;
padding: 8px;
line-height: 1.1;
max-width: 30em;
opacity: 0;
border-radius: 1em;
border: 2px solid #73d699;
background: #e2ff99; /* Old browsers */
background: -moz-linear-gradient(top, #e2ff99 0%, #73d699 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#e2ff99), color-stop(100%,#73d699)); /* Chrome,Safari4+ */
@ -103,21 +97,15 @@ fieldset legend { display: none; }
-moz-box-shadow: 0px 6px 25px -4px rgba(0,0,0,0.75);
box-shadow: 0px 6px 25px -4px rgba(0,0,0,0.75);
}
.tooltip:hover::before {
opacity: 1;
bottom: 30px;
}
.tooltip:hover::after {
#tooltip>span {
position: absolute;
content: "";
opacity: 1;
width: 0;
height: 0;
border-left: 8px solid transparent;
border-right: 8px solid transparent;
border-top: 8px solid #73d699;
z-index: 999;
position: absolute;
/*white-space: nowrap;*/
top: 2px;
left: 130px;
bottom: -10px;
left: 20px;
}

1
Marlin/configurator/index.html

@ -20,6 +20,7 @@
</div>
<div id="tabs"></div>
<div id="tooltip"></div>
<form id="config_form">

36
Marlin/configurator/js/configurator.js

@ -60,7 +60,8 @@ var configuratorApp = (function(){
boards_list = {},
therms_list = {},
total_config_lines,
total_config_adv_lines;
total_config_adv_lines,
hover_timer;
// Return this anonymous object as configuratorApp
return {
@ -111,14 +112,12 @@ var configuratorApp = (function(){
var loaded_items = {};
var config_files = [boards_file, config_file, config_adv_file];
$.each(config_files, function(i,fname){
self.log("Loading " + fname + "...", 3);
$.ajax({
url: marlin_config+'/'+fname,
type: 'GET',
async: true,
cache: false,
success: function(txt) {
self.log("Loaded " + fname + "...", 3);
loaded_items[fname] = function(){ self.fileLoaded(fname, txt); };
success_count++;
},
@ -358,12 +357,31 @@ var configuratorApp = (function(){
if (elm.defineInfo == null) {
var inf = elm.defineInfo = this.getDefineInfo(name, adv);
$elm.on($elm.attr('type') == 'text' ? 'input' : 'change', this.handleChange);
var comm = inf.comment;
if (inf.comment) {
var $tipme = $elm.prev('label');
if ($tipme.length) {
comm ?
$tipme.addClass('tooltip').attr('data-tooltip',comm) :
$tipme.removeClass('tooltip').removeAttr('data-tooltip');
if (inf.comment && $tipme.length) {
var $tt = $('#tooltip');
$tipme.hover(
function() {
var offs = $tipme.offset();
$tt.text(inf.comment)
.append('<span>')
.css({bottom:($tt.parent().height()-offs.top+20)+'px',left:(offs.left+70)+'px'})
.show();
if (hover_timer) {
clearTimeout(hover_timer);
hover_timer = null;
}
},
function() {
hover_timer = setTimeout(function(){
hover_timer = null;
$tt.fadeOut(400);
}, 400);
}
);
}
}
}
this.setFieldFromDefine(name);
@ -622,7 +640,7 @@ var configuratorApp = (function(){
var r, s;
findDef = new RegExp('([ \\t]*(//|#)[^\n]+\n){1,4}\\s{0,1}' + info.line, 'g');
if (r = findDef.exec(txt)) {
findDef = new RegExp('^[ \\t]*//+[ \\t]*(.*)[ \\t]*$', 'gm');
findDef = new RegExp('^[ \\t]*//+[ \\t]*([^#].*)[ \\t]*$', 'gm');
while((s = findDef.exec(r[0])) !== null) {
if (s[1].match(/\/\/[ \\t]*#define/) == null)
comment += s[1] + "\n";

Loading…
Cancel
Save