ng2-json-editor
Version:
Angular2 component for editing large json documents
151 lines • 5.82 kB
JavaScript
import { Injectable } from '@angular/core';
import { render, ParseError } from 'katex';
var KatexService = (function () {
function KatexService() {
this.delimiters = [
{ left: '$$', right: '$$', display: true },
{ left: '$', right: '$', display: false },
// FIXME check if we need the ones below
{ left: '\\[', right: '\\]', display: true },
{ left: '\\(', right: '\\)', display: false },
];
}
/**
*
* Receives text that can contain LaTeX formulas. The formulas will be
* identified using `this.delimiters` and rendered inside the passed
* HTMLElement
*
* NOTE: The HTMLElement is expected to have a single child and this
* will be replaced by the HTML with formatted LaTeX
*
* @param {string} text - text to be formatted with LaTeX
* @param {HTMLElement} el - the HTMLElement where the LaTeX should be rendered
*/
KatexService.prototype.renderMathInText = function (text, el) {
var data = this.splitWithDelimiters(text, this.delimiters);
var fragment = document.createDocumentFragment();
for (var i = 0; i < data.length; i++) {
if (data[i].type === 'text') {
fragment.appendChild(document.createTextNode(data[i].data));
}
else {
var span = document.createElement('span');
var math = data[i].data;
try {
render(math, span, {
displayMode: data[i].display,
});
}
catch (e) {
if (!(e instanceof ParseError)) {
throw e;
}
console.error("KaTeX auto-render: Failed to parse " + data[i].data + " with " + e);
fragment.appendChild(document.createTextNode(data[i].rawData));
continue;
}
fragment.appendChild(span);
}
}
// clear
el.innerHTML = '';
el.appendChild(fragment);
};
KatexService.prototype.findEndOfMath = function (delimiter, text, startIndex) {
// Adapted from
// https://github.com/Khan/perseus/blob/master/src/perseus-markdown.jsx
var index = startIndex;
var braceLevel = 0;
var delimLength = delimiter.length;
while (index < text.length) {
var character = text[index];
if (braceLevel <= 0 &&
text.slice(index, index + delimLength) === delimiter) {
return index;
}
else if (character === '\\') {
index++;
}
else if (character === '{') {
braceLevel++;
}
else if (character === '}') {
braceLevel--;
}
index++;
}
return -1;
};
KatexService.prototype.splitAtDelimiters = function (startData, leftDelim, rightDelim, display) {
var finalData = [];
for (var i = 0; i < startData.length; i++) {
if (startData[i].type === 'text') {
var text = startData[i].data;
var lookingForLeft = true;
var currIndex = 0;
var nextIndex = void 0;
nextIndex = text.indexOf(leftDelim);
if (nextIndex !== -1) {
currIndex = nextIndex;
finalData.push({
type: 'text',
data: text.slice(0, currIndex),
});
lookingForLeft = false;
}
while (true) {
if (lookingForLeft) {
nextIndex = text.indexOf(leftDelim, currIndex);
if (nextIndex === -1) {
break;
}
finalData.push({
type: 'text',
data: text.slice(currIndex, nextIndex),
});
currIndex = nextIndex;
}
else {
nextIndex = this.findEndOfMath(rightDelim, text, currIndex + leftDelim.length);
if (nextIndex === -1) {
break;
}
finalData.push({
type: 'math',
data: text.slice(currIndex + leftDelim.length, nextIndex),
rawData: text.slice(currIndex, nextIndex + rightDelim.length),
display: display,
});
currIndex = nextIndex + rightDelim.length;
}
lookingForLeft = !lookingForLeft;
}
finalData.push({
type: 'text',
data: text.slice(currIndex),
});
}
else {
finalData.push(startData[i]);
}
}
return finalData;
};
KatexService.prototype.splitWithDelimiters = function (text, delimiters) {
var data = [{ type: 'text', data: text }];
for (var i = 0; i < delimiters.length; i++) {
var delimiter = delimiters[i];
data = this.splitAtDelimiters(data, delimiter.left, delimiter.right, delimiter.display || false);
}
return data;
};
return KatexService;
}());
export { KatexService };
KatexService.decorators = [
{ type: Injectable },
];
/** @nocollapse */
KatexService.ctorParameters = function () { return []; };
//# sourceMappingURL=katex.service.js.map