add static highlighter highlight method
This commit is contained in:
parent
a2244c6d01
commit
51dc39bb95
3 changed files with 50 additions and 18 deletions
|
|
@ -168,14 +168,6 @@ function highlight() {
|
|||
var m = el.className.match(/language-(\w+)|(javascript)/);
|
||||
if (!m) return
|
||||
var mode = "ace/mode/" + (m[1] || m[2]);
|
||||
var theme = "ace/theme/xcode";
|
||||
var data = dom.getInnerText(el).trim();
|
||||
|
||||
highlighter.render(data, mode, theme, 1, true, function (highlighted) {
|
||||
dom.importCssString(highlighted.css, "ace_highlight");
|
||||
el.innerHTML = highlighted.html;
|
||||
});
|
||||
highlighter.highlight(el, {mode: mode, theme: "ace/theme/xcode"})
|
||||
});
|
||||
|
||||
|
||||
}
|
||||
|
|
@ -9,8 +9,8 @@
|
|||
<link href="./doc/site/style.css" rel="stylesheet" type="text/css" />
|
||||
<link href="./doc/site/images/favicon.ico" rel="icon" type="image/x-icon" />
|
||||
|
||||
<script src="./build/src-min-noconflict/ace.js"></script>
|
||||
<script src="./build/src-min-noconflict/ext-static_highlight.js"></script>
|
||||
<script src="./build/src-min/ace.js"></script>
|
||||
<script src="./build/src-min/ext-static_highlight.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<a href="http://github.com/ajaxorg/ace">
|
||||
|
|
|
|||
|
|
@ -35,6 +35,7 @@ var EditSession = require("../edit_session").EditSession;
|
|||
var TextLayer = require("../layer/text").Text;
|
||||
var baseStyles = require("../requirejs/text!./static.css");
|
||||
var config = require("../config");
|
||||
var dom = require("../lib/dom");
|
||||
/**
|
||||
* Transforms a given input code snippet into HTML using the given mode
|
||||
*
|
||||
|
|
@ -86,13 +87,13 @@ exports.render = function(input, mode, theme, lineStart, disableGutter, callback
|
|||
return waiting || done();
|
||||
};
|
||||
|
||||
/* Transforms a given input code snippet into HTML using the given mode
|
||||
*
|
||||
* @param {string} input Code snippet
|
||||
* @param {mode} mode Mode loaded from /ace/mode (use 'ServerSideHiglighter.getMode')
|
||||
* @param {string} r Code snippet
|
||||
* @returns {object} An object containing: html, css
|
||||
*/
|
||||
/*
|
||||
* Transforms a given input code snippet into HTML using the given mode
|
||||
* @param {string} input Code snippet
|
||||
* @param {mode} mode Mode loaded from /ace/mode (use 'ServerSideHiglighter.getMode')
|
||||
* @param {string} r Code snippet
|
||||
* @returns {object} An object containing: html, css
|
||||
*/
|
||||
|
||||
exports.renderSync = function(input, mode, theme, lineStart, disableGutter) {
|
||||
lineStart = parseInt(lineStart || 1, 10);
|
||||
|
|
@ -136,4 +137,43 @@ exports.renderSync = function(input, mode, theme, lineStart, disableGutter) {
|
|||
};
|
||||
};
|
||||
|
||||
|
||||
|
||||
exports.highlight = function(el, opts) {
|
||||
var m = el.className.match(/lang-(\w+)/);
|
||||
var mode = opts.mode || m && ("ace/mode/" + m[1]);
|
||||
if (!mode)
|
||||
return false;
|
||||
var theme = opts.theme || "ace/theme/textmate";
|
||||
|
||||
var data = "";
|
||||
var nodes = [];
|
||||
|
||||
if (el.firstElementChild) {
|
||||
var textLen = 0;
|
||||
for (var i = 0; i < el.childNodes.length; i++) {
|
||||
var ch = el.childNodes[i];
|
||||
if (ch.nodeType == 3) {
|
||||
textLen += ch.data.length;
|
||||
data += ch.data;
|
||||
} else {
|
||||
nodes.push(textLen, ch);
|
||||
}
|
||||
}
|
||||
} else {
|
||||
data = dom.getInnerText(el);
|
||||
}
|
||||
|
||||
exports.render(data, mode, theme, 1, true, function (highlighted) {
|
||||
dom.importCssString(highlighted.css, "ace_highlight");
|
||||
el.innerHTML = highlighted.html;
|
||||
var container = el.firstChild.firstChild
|
||||
for (var i = 0; i < nodes.length; i += 2) {
|
||||
var pos = highlighted.session.doc.indexToPosition(nodes[i])
|
||||
var node = nodes[i + 1];
|
||||
var lineEl = container.children[pos.row];
|
||||
lineEl && lineEl.appendChild(nodes[i+1]);
|
||||
}
|
||||
});
|
||||
};
|
||||
});
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue