make error messages work with multiple stylesheets

This commit is contained in:
cloudhead
2010-06-15 02:12:30 -04:00
parent 4e14ea045d
commit 3c897024ab

View File

@@ -95,7 +95,7 @@ function loadStyleSheet(sheet, callback, async) {
if (e) { return error(e, sheet.href) }
try {
callback(root, sheet, { local: false, lastModified: lastModified });
removeNode(document.getElementById('less-error-message'));
removeNode(document.getElementById('less-error-message:' + sheet.href.replace(/[^a-z]+/gi, '-')));
} catch (e) {
error(e, sheet.href);
}
@@ -195,7 +195,9 @@ function log(str) {
}
function error(e, href) {
if (document.getElementById('less-error-message')) { return }
var id = 'less-error-message:' + href.replace(/[^a-z]+/ig, '-');
if (document.getElementById(id)) { return }
var template = ['<div>',
'<pre class="ctx"><span>[-1]</span>{0}</pre>',
@@ -204,39 +206,40 @@ function error(e, href) {
'</div>'].join('\n');
var elem = document.createElement('div'), timer;
elem.id = "less-error-message";
elem.id = id;
elem.className = "less-error-message";
elem.innerHTML = '<h3>' + (e.message || 'There is an error in your .less file') + '</h3>' +
'<p><a href="' + href + '">' + href + "</a> " +
'on line ' + e.line + ', column ' + (e.column + 1) + ':</p>' +
template.replace(/\[(-?\d)\]/g, function (_, i) {
return e.line + parseInt(i);
return (parseInt(e.line) + parseInt(i)) || '';
}).replace(/\{(\d)\}/g, function (_, i) {
return e.extract[parseInt(i)];
return e.extract[parseInt(i)] || '';
}).replace(/\{current\}/, e.extract[1].slice(0, e.column) +
'<span class="error">' +
e.extract[1].slice(e.column) +
'</span>');
// CSS for error messages
createCSS([
'#less-error-message span {',
'.less-error-message span {',
'margin-right: 15px;',
'}',
'#less-error-message pre {',
'.less-error-message pre {',
'color: #ee4444;',
'padding: 4px 0;',
'margin: 0;',
'}',
'#less-error-message pre.ctx {',
'.less-error-message pre.ctx {',
'color: #dd7777;',
'}',
'#less-error-message h3 {',
'.less-error-message h3 {',
'padding: 15px 0 5px 0;',
'margin: 0;',
'}',
'#less-error-message a {',
'.less-error-message a {',
'color: #10a',
'}',
'#less-error-message .error {',
'.less-error-message .error {',
'color: red;',
'font-weight: bold;',
'padding-bottom: 2px;',