Switch math rendering to KaTeX
This commit is contained in:
parent
53d8b2cee2
commit
b8854a287a
4 changed files with 45 additions and 30 deletions
|
@ -295,7 +295,7 @@ $ openssl req -nodes -newkey rsa:4096 -keyout relay.pem -x509 -days 365 -out rel
|
|||
<td class="prefix"><a ng-click="addMention(bufferline.prefix)"><span class="hidden-bracket"><</span><span ng-repeat="part in ::bufferline.prefix" ng-class="::part.classes" ng-bind="::part.text|prefixlimit:25"></span><span class="hidden-bracket">></span></a></td><!--
|
||||
--><td class="message"><!--
|
||||
--><div ng-repeat="metadata in ::bufferline.metadata" plugin data="::metadata"></div><!--
|
||||
--><span ng-repeat="part in ::bufferline.content" class="text" ng-class="::part.classes.concat(['line-' + part.$$hashKey.replace(':','_')])" ng-bind-html="::part.text | linky:'_blank' | DOMfilter:'irclinky' | DOMfilter:'emojify':settings.enableJSEmoji | DOMfilter:'inlinecolour' | DOMfilter:'mathjax':('.line-' + part.$$hashKey.replace(':','_')):settings.enableMathjax"></span>
|
||||
--><span ng-repeat="part in ::bufferline.content" class="text" ng-class="::part.classes.concat(['line-' + part.$$hashKey.replace(':','_')])" ng-bind-html="::part.text | linky:'_blank' | DOMfilter:'irclinky' | DOMfilter:'emojify':settings.enableJSEmoji | DOMfilter:'inlinecolour' | DOMfilter:'latexmath':('.line-' + part.$$hashKey.replace(':','_')):settings.enableMathjax"></span>
|
||||
</td>
|
||||
</tr>
|
||||
<tr class="readmarker" ng-if="activeBuffer().lastSeen==$index">
|
||||
|
|
|
@ -175,15 +175,23 @@ weechat.filter('emojify', function() {
|
|||
};
|
||||
});
|
||||
|
||||
weechat.filter('mathjax', function() {
|
||||
weechat.filter('latexmath', function() {
|
||||
return function(text, selector, enabled) {
|
||||
if (!enabled || typeof(MathJax) === "undefined") {
|
||||
if (!enabled || typeof(katex) === "undefined") {
|
||||
return text;
|
||||
}
|
||||
if (text.indexOf("$$") != -1 || text.indexOf("\\[") != -1 || text.indexOf("\\(") != -1) {
|
||||
// contains math
|
||||
// contains math -> delayed rendering
|
||||
setTimeout(function() {
|
||||
var math = document.querySelector(selector);
|
||||
MathJax.Hub.Queue(["Typeset",MathJax.Hub,math]);
|
||||
renderMathInElement(math, {
|
||||
delimiters: [
|
||||
{left: "$$", right: "$$", display: false},
|
||||
{left: "\\[", right: "\\]", display: true},
|
||||
{left: "\\(", right: "\\)", display: false}
|
||||
]
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
return text;
|
||||
|
|
|
@ -382,26 +382,17 @@ weechat.controller('WeechatCtrl', ['$rootScope', '$scope', '$store', '$timeout',
|
|||
});
|
||||
|
||||
// To prevent unnecessary loading times for users who don't
|
||||
// want MathJax, load it only if the setting is enabled.
|
||||
// want LaTeX math, load it only if the setting is enabled.
|
||||
// This also fires when the page is loaded if enabled.
|
||||
// Note that this says MathJax but we switched to KaTeX
|
||||
settings.addCallback('enableMathjax', function(enabled) {
|
||||
if (enabled && !$rootScope.mathjax_init) {
|
||||
// Load MathJax only once
|
||||
$rootScope.mathjax_init = true;
|
||||
(function () {
|
||||
var head = document.getElementsByTagName("head")[0], script;
|
||||
script = document.createElement("script");
|
||||
script.type = "text/x-mathjax-config";
|
||||
script[(window.opera ? "innerHTML" : "text")] =
|
||||
"MathJax.Hub.Config({\n" +
|
||||
" tex2jax: { inlineMath: [['$$','$$'], ['\\\\(','\\\\)']], displayMath: [['\\\\[','\\\\]']] },\n" +
|
||||
"});";
|
||||
head.appendChild(script);
|
||||
script = document.createElement("script");
|
||||
script.type = "text/javascript";
|
||||
script.src = "//cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-AMS_HTML";
|
||||
head.appendChild(script);
|
||||
})();
|
||||
|
||||
utils.inject_css("https://cdnjs.cloudflare.com/ajax/libs/KaTeX/0.5.1/katex.min.css");
|
||||
utils.inject_script("https://cdnjs.cloudflare.com/ajax/libs/KaTeX/0.5.1/katex.min.js");
|
||||
utils.inject_script("https://cdnjs.cloudflare.com/ajax/libs/KaTeX/0.5.1/contrib/auto-render.min.js");
|
||||
}
|
||||
});
|
||||
|
||||
|
@ -415,14 +406,7 @@ weechat.controller('WeechatCtrl', ['$rootScope', '$scope', '$store', '$timeout',
|
|||
}
|
||||
|
||||
// Load new theme
|
||||
(function() {
|
||||
var elem = document.createElement("link");
|
||||
elem.rel = "stylesheet";
|
||||
elem.href = "css/themes/" + theme + ".css";
|
||||
elem.media = "screen";
|
||||
elem.id = "themeCSS";
|
||||
document.getElementsByTagName("head")[0].appendChild(elem);
|
||||
})();
|
||||
utils.inject_css("css/themes/" + theme + ".css", "themeCSS");
|
||||
});
|
||||
|
||||
settings.addCallback('customCSS', function(css) {
|
||||
|
|
25
js/utils.js
25
js/utils.js
|
@ -21,9 +21,32 @@ weechat.factory('utils', function() {
|
|||
return (document.body.clientWidth < mobile_cutoff);
|
||||
};
|
||||
|
||||
|
||||
// Inject a javascript (used by KaTeX)
|
||||
var inject_script = function(script_url) {
|
||||
var script = document.createElement("script");
|
||||
script.type = "text/javascript";
|
||||
script.src = script_url;
|
||||
var head = document.getElementsByTagName("head")[0];
|
||||
head.appendChild(script);
|
||||
};
|
||||
// Inject a stylesheet (used by KaTeX and theme switching)
|
||||
var inject_css = function(css_url, id) {
|
||||
var elem = document.createElement("link");
|
||||
elem.rel = "stylesheet";
|
||||
elem.href = css_url;
|
||||
if (id)
|
||||
elem.id = id;
|
||||
var head = document.getElementsByTagName("head")[0];
|
||||
head.appendChild(elem);
|
||||
};
|
||||
|
||||
|
||||
return {
|
||||
changeClassStyle: changeClassStyle,
|
||||
getClassStyle: getClassStyle,
|
||||
isMobileUi: isMobileUi
|
||||
isMobileUi: isMobileUi,
|
||||
inject_script: inject_script,
|
||||
inject_css: inject_css,
|
||||
};
|
||||
});
|
||||
|
|
Loading…
Reference in a new issue