patrick/KaTeX
1
0
Fork 0
mirror of https://github.com/Smaug123/KaTeX synced 2025-10-05 03:08:40 +00:00
Code Issues Packages Projects Releases Wiki Activity

Added MathJax compatibility script (#680)

Browse Source 
* Added MathJax compatibility script

* Removed make integrity, which release.sh handles

* Renamed scripts

* Use katex.render (and options) instead of manually string munging

* Rewrote code based on feedback

* Renamed file correctly

* Extended README with an example of usage

* Removed CDN paths in place of an abstract path

* Revert "Removed CDN paths in place of an abstract path"

This reverts commit 857f8de2e449d9ac5a3d8eab5104dac561c533c4.

* Replace versions with `...`, with note to avoid confusing users

* Revert some `...` replacements to files that do exist.
This commit is contained in:
William J. Bowman
2017-08-27 18:17:42 -04:00
committed by Kevin Barabash
parent 96c1fe7ad8
commit 2fbb2b0128
4 changed files with 70 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

9
contrib/mathtex-script-type/Makefile Normal file
View File

@@ -0,0 +1,9 @@
.PHONY: build integrity
build: $(BUILDDIR)/contrib/mathtex-script-type.min.js
$(BUILDDIR)/contrib/mathtex-script-type.min.js: $(BUILDDIR)/mathtex-script-type.js
$(UGLIFYJS) < $< > $@
$(BUILDDIR)/mathtex-script-type.js: mathtex-script-type.js
$(BROWSERIFY) -t [ babelify ] $< > $@

36
contrib/mathtex-script-type/README.md Normal file
View File

@@ -0,0 +1,36 @@
# `math/tex` Custom Script Type Extension
This is an extension to automatically display code inside `script` tags with `type=math/tex` using KaTeX.
This script type is commonly used by MathJax, so this can be used to support compatibility with MathJax.
### Usage
This extension isn't part of KaTeX proper, so the script should be separately
included in the page, in addition to KaTeX.
Load the extension by adding the following line to your HTML file.
This extension should be loaded *after* all `script type=math/tex` blocks that you want to render.
```html
<script src="https://cdnjs.cloudflare.com/ajax/libs/KaTeX/.../contrib/mathtex-script-type.min.js" integrity="sha384-o+v+EkJWQmZj7XwHBxehTGJKE18182WyyN2glZMTPw9g5XxjN1uwrquNuMX/NJiF"></script>
```
Note that if the URL above contains `...` in-place of a version string, then this script has not yet
been deployed to the CDN.
You can download the script and use it locally, or from a local KaTeX installation instead.
For example, in the following simple page, we first load KaTeX as usual.
Then, in the body, we use a `math/tex` script to typeset the equation `x+\sqrt{1-x^2}`.
After we're done writing `math/tex` scripts, we load this extension.
```html
<html>
<head>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/KaTeX/0.7.1/katex.min.css" integrity="sha384-wITovz90syo1dJWVh32uuETPVEtGigN07tkttEqPv+uR2SE/mbQcG7ATL28aI9H0" crossorigin="anonymous">
<script src="https://cdnjs.cloudflare.com/ajax/libs/KaTeX/0.7.1/katex.min.js" integrity="sha384-/y1Nn9+QQAipbNQWU65krzJralCnuOasHncUFXGkdwntGeSvQicrYkiUBwsgUqc1" crossorigin="anonymous"></script>
</head>
<body>
<script type="math/tex">x+\sqrt{1-x^2}</script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/KaTeX/.../contrib/mathtex-script-type.min.js" integrity="sha384-o+v+EkJWQmZj7XwHBxehTGJKE18182WyyN2glZMTPw9g5XxjN1uwrquNuMX/NJiF"></script>
</body>
</html>
```

24
contrib/mathtex-script-type/mathtex-script-type.js Normal file
View File

@@ -0,0 +1,24 @@
/* global katex */
{
let scripts = document.body.getElementsByTagName("script");
scripts = Array.prototype.slice.call(scripts);
scripts.forEach(function(script) {
if (!script.type || !script.type.match(/math\/tex/i)) {
return -1;
}
const display =
(script.type.match(/mode\s*=\s*display(;|\s|\n|$)/) != null);
const katexElement = document.createElement(display ? "div" : "span");
katexElement.setAttribute("class",
display ? "equation" : "inline-equation");
try {
katex.render(script.text, katexElement, {displayMode: display});
} catch (err) {
//console.error(err); linter doesn't like this
katexElement.textContent = script.text;
}
script.parentNode.replaceChild(katexElement, script);
});
}