Clean up and improve tooltips, show the name

This commit is contained in:
Scott Lahteine 2015-02-07 11:58:19 -08:00
parent 0116320d2c
commit 4228758f1d
2 changed files with 29 additions and 20 deletions

View file

@ -24,7 +24,15 @@ input[type="text"], select { margin: 0.75em 0 0; }
input[type="checkbox"], input[type="radio"], input[type="file"] { margin: 1em 0 0; } input[type="checkbox"], input[type="radio"], input[type="file"] { margin: 1em 0 0; }
#config_form { display: block; background: #DDD; padding: 20px; color: #000; position: relative; } #config_form { display: block; background: #DDD; padding: 20px; color: #000; position: relative; }
/*#config_text, #config_adv_text { font-family: "Andale mono", monospace; clear: both; }*/ /*#config_text, #config_adv_text { font-family: "Andale mono", monospace; clear: both; }*/
#config_text, #config_adv_text { height: 25em; overflow: auto; background-color: #FFF; color: #888; padding: 10px; } #config_text, #config_adv_text {
height: 25em;
padding: 10px;
border: 2px solid #888;
border-radius: 5px;
overflow: auto;
background-color: #FFF;
color: #000;
}
input[type="checkbox"], input[type="radio"].enabler { margin-left: 1em; } input[type="checkbox"], input[type="radio"].enabler { margin-left: 1em; }
input:disabled { color: #BBB; } input:disabled { color: #BBB; }
.clear { clear: both; } .clear { clear: both; }
@ -109,3 +117,4 @@ fieldset legend { display: none; }
bottom: -10px; bottom: -10px;
left: 20px; left: 20px;
} }
#tooltip>strong { color: #00B; }

View file

@ -27,6 +27,7 @@ String.prototype.lpad = function(len, chr) {
}; };
String.prototype.prePad = function(len, chr) { return len ? this.lpad(len, chr) : this; }; String.prototype.prePad = function(len, chr) { return len ? this.lpad(len, chr) : this; };
String.prototype.zeroPad = function(len) { return this.prePad(len, '0'); }; String.prototype.zeroPad = function(len) { return this.prePad(len, '0'); };
String.prototype.toHTML = function() { return jQuery('<div>').text(this).html(); };
String.prototype.regEsc = function() { return this.replace(/[.?*+^$[\]\\(){}|-]/g, "\\$&"); } String.prototype.regEsc = function() { return this.replace(/[.?*+^$[\]\\(){}|-]/g, "\\$&"); }
String.prototype.lineCount = function() { var len = this.split(/\r?\n|\r/).length; return len > 0 ? len - 1 : len; }; String.prototype.lineCount = function() { var len = this.split(/\r?\n|\r/).length; return len > 0 ? len - 1 : len; };
@ -367,7 +368,7 @@ var configuratorApp = (function(){
$tipme.hover( $tipme.hover(
function() { function() {
var pos = $tipme.position(); var pos = $tipme.position();
$tooltip.text(inf.comment) $tooltip.html(inf.comment)
.append('<span>') .append('<span>')
.css({bottom:($tooltip.parent().outerHeight()-pos.top)+'px',left:(pos.left+70)+'px'}) .css({bottom:($tooltip.parent().outerHeight()-pos.top)+'px',left:(pos.left+70)+'px'})
.show(); .show();
@ -484,6 +485,7 @@ var configuratorApp = (function(){
* then update, highlight, and scroll to the line * then update, highlight, and scroll to the line
*/ */
setDefineLine: function(name, newline) { setDefineLine: function(name, newline) {
this.log('setDefineLine:'+name+'\n'+newline,4);
var $elm = $('#'+name), elm = $elm[0], inf = elm.defineInfo; var $elm = $('#'+name), elm = $elm[0], inf = elm.defineInfo;
var $c = $(inf.field), txt = $c.text(); var $c = $(inf.field), txt = $c.text();
@ -492,10 +494,8 @@ var configuratorApp = (function(){
txt = txt.replace(inf.line, hilite_token + newline); txt = txt.replace(inf.line, hilite_token + newline);
inf.line = newline; inf.line = newline;
this.log(newline, 2);
// Convert txt into HTML before storing // Convert txt into HTML before storing
var html = $('<div/>').text(txt).html().replace(hilite_token, '<span></span>'); var html = txt.toHTML().replace(hilite_token, '<span></span>');
// Set the final text including the highlighter // Set the final text including the highlighter
$c.html(html); $c.html(html);
@ -634,13 +634,12 @@ var configuratorApp = (function(){
// Get the end-of-line comment, if there is one // Get the end-of-line comment, if there is one
var comment = ''; var comment = '';
findDef = new RegExp('.*#define[ \\t].*/[/*]+[ \\t]*(.*)'); findDef = new RegExp('.*#define[ \\t].*/[/*]+[ \\t]*(.*)');
if (info.line.search(findDef) >= 0) { if (info.line.search(findDef) >= 0)
comment = info.line.replace(findDef, '$1'); comment = info.line.replace(findDef, '$1');
}
else {
// Get all the comments immediately before the item // Get all the comments immediately before the item
var r, s; var r, s;
findDef = new RegExp('(([ \\t]*(//|#)[^\n]+\n){1,4})([ \\t]*\n){0,1}' + info.line, 'g'); findDef = new RegExp('(([ \\t]*(//|#)[^\n]+\n){1,4})([ \\t]*\n){0,1}' + info.line.regEsc(), 'g');
if (r = findDef.exec(txt)) { if (r = findDef.exec(txt)) {
findDef = new RegExp('^[ \\t]*//+[ \\t]*(.*)[ \\t]*$', 'gm'); findDef = new RegExp('^[ \\t]*//+[ \\t]*(.*)[ \\t]*$', 'gm');
while((s = findDef.exec(r[1])) !== null) { while((s = findDef.exec(r[1])) !== null) {
@ -648,12 +647,13 @@ var configuratorApp = (function(){
comment = ''; comment = '';
break; break;
} }
comment += s[1] + "\n"; comment += ' ' + s[1] + "\n";
}
} }
} }
findDef = new RegExp('^[ \\t]*'+name+'[ \\t]*', 'm');
$.extend(info, { $.extend(info, {
comment: comment.trim(), comment: '<strong>'+name+'</strong> '+comment.replace(findDef,'').trim().toHTML(),
lineNum: this.getLineNumberOfText(info.line, txt) lineNum: this.getLineNumberOfText(info.line, txt)
}); });
} }