patrick/KaTeX
1
0
Fork 0
mirror of https://github.com/Smaug123/KaTeX synced 2025-10-04 18:58:39 +00:00
Code Issues Packages Projects Releases Wiki Activity

Add display/displayMode toggle on test page (#1193)

Browse Source 
* Add display/displayMode toggle on test page

* Fix #1035
* Refactor query parsing code to promote re-use
* Also add support for (unescaped) single-character macros

* Rewrite to use query-string

* Restore modes on package*json
This commit is contained in:
Erik Demaine
2018-03-11 20:15:09 -04:00
committed by Kevin Barabash
parent b148d5da71
commit 75b55a63b1
3 changed files with 90 additions and 997 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1033
package-lock.json generated
View File

File diff suppressed because it is too large Load Diff

1
package.json
View File

@@ -44,6 +44,7 @@
"object-assign": "^4.1.0",
"pako": "1.0.4",
"pre-commit": "^1.2.2",
"query-string": "^5.1.0",
"rimraf": "^2.6.2",
"selenium-webdriver": "^2.48.2",
"sri-toolbox": "^0.2.0",

53
static/main.js
View File

@@ -4,6 +4,7 @@
*/
import katex from '../katex.webpack.js';
import './main.css';
import queryString from 'query-string';
function init() {
const input = document.getElementById("input");
@@ -13,52 +14,56 @@ function init() {
input.addEventListener("input", reprocess, false);
permalink.addEventListener("click", setSearch);
let match = (/(?:^\?|&)text=([^&]*)/).exec(window.location.search);
if (match) {
input.value = decodeURIComponent(match[1]);
const options = {displayMode: true, macros: {}};
const query = queryString.parse(window.location.search);
if (query.text) {
input.value = query.text;
}
const macros = {};
// TODO: Add toggle for displayMode.
// https://github.com/Khan/KaTeX/issues/1035
const options = {displayMode: true};
const macroRegex = /(?:^\?|&)(?:\\|%5[Cc])([A-Za-z]+)=([^&]*)/g;
let macroString = "";
while ((match = macroRegex.exec(window.location.search)) !== null) {
options.macros = macros;
macros["\\" + match[1]] = decodeURIComponent(match[2]);
macroString += "&" + match[0].substr(1);
// Use `display=0` or `displayMode=0` (or `=f`/`=false`/`=n`/`=no`)
// to turn off displayMode (which is on by default).
const displayQuery = (query.displayMode || query.display);
if (displayQuery && displayQuery.match(/^(0|f|n)/)) {
options.displayMode = false;
}
// The `before` search parameter puts normal text before the math.
// The `after` search parameter puts normal text after the math.
// The `before` or `pre` search parameter puts normal text before the math.
// The `after` or `post` search parameter puts normal text after the math.
// Example use: testing baseline alignment.
if (/(?:^\?|&)(?:before|after)=/.test(window.location.search)) {
if (query.before || query.after || query.pre || query.post) {
const mathContainer = math;
mathContainer.id = "math-container";
if ((match = /(?:^\?|&)before=([^&]*)/.exec(window.location.search))) {
const before = document.createTextNode(decodeURIComponent(match[1]));
if (query.before || query.pre) {
const before = document.createTextNode(query.before || query.pre);
mathContainer.appendChild(before);
macroString += "&" + match[0].substr(1);
}
math = document.createElement("span");
math.id = "math";
mathContainer.appendChild(math);
if ((match = /(?:^\?|&)after=([^&]*)/.exec(window.location.search))) {
const after = document.createTextNode(decodeURIComponent(match[1]));
if (query.after || query.post) {
const after = document.createTextNode(query.after || query.post);
mathContainer.appendChild(after);
macroString += "&" + match[0].substr(1);
}
}
// Macros can be specified via `\command=expansion` or single-character
// `c=expansion`.
Object.getOwnPropertyNames(query).forEach((key) => {
if (key.match(/^\\|^[^]$/)) {
options.macros[key] = query[key];
}
});
reprocess();
function setSearch() {
window.location.search =
"?text=" + encodeURIComponent(input.value) + macroString;
const query = queryString.parse(window.location.search);
query.text = input.value;
window.location.search = queryString.stringify(query);
}
function reprocess() {