Support for MathJax

This commit is contained in:
benweet 2013-05-13 00:59:17 +01:00
parent 8be8d15f30
commit 82f904aef4
4 changed files with 32 additions and 25 deletions

View File

@ -513,6 +513,13 @@
</select> </select>
</div> </div>
</div> </div>
<div class="control-group">
<label class="control-label" for="input-settings-enable-mathjax">MathJax support
</label>
<div class="controls">
<input type="checkbox" id="input-settings-enable-mathjax" />
</div>
</div>
<div class="control-group"> <div class="control-group">
<label class="control-label" <label class="control-label"
for="input-settings-editor-font-size">Editor font size</label> for="input-settings-editor-font-size">Editor font size</label>

View File

@ -828,7 +828,7 @@
var elapsedTime; var elapsedTime;
var oldInputText; var oldInputText;
var maxDelay = 3000; var maxDelay = 3000;
var startType = "delayed"; // The other legal value is "manual" var startType = "manual"; // The other legal value is "manual"
// Adds event listeners to elements // Adds event listeners to elements
var setupEvents = function (inputElem, listener) { var setupEvents = function (inputElem, listener) {

View File

@ -207,6 +207,7 @@ define(
// Setting management // Setting management
core.settings = { core.settings = {
converterType : "markdown-extra-prettify", converterType : "markdown-extra-prettify",
enableMathJax : true,
layoutOrientation : "horizontal", layoutOrientation : "horizontal",
scrollLink : true, scrollLink : true,
editorFontSize : 14, editorFontSize : 14,
@ -233,6 +234,8 @@ define(
$("#input-settings-scroll-link").prop("checked", core.settings.scrollLink); $("#input-settings-scroll-link").prop("checked", core.settings.scrollLink);
// Converter type // Converter type
$("#input-settings-converter-type").val(core.settings.converterType); $("#input-settings-converter-type").val(core.settings.converterType);
// MathJax
$("#input-settings-enable-mathjax").prop("checked", core.settings.enableMathJax);
// Editor font size // Editor font size
$("#input-settings-editor-font-size").val(core.settings.editorFontSize); $("#input-settings-editor-font-size").val(core.settings.editorFontSize);
// Default content // Default content
@ -251,6 +254,8 @@ define(
"input:radio[name=radio-layout-orientation]:checked").prop("value"); "input:radio[name=radio-layout-orientation]:checked").prop("value");
// Converter type // Converter type
newSettings.converterType = $("#input-settings-converter-type").val(); newSettings.converterType = $("#input-settings-converter-type").val();
// MathJax
newSettings.enableMathJax = $("#input-settings-enable-mathjax").prop("checked");
// Scroll Link // Scroll Link
newSettings.scrollLink = $("#input-settings-scroll-link").prop("checked"); newSettings.scrollLink = $("#input-settings-scroll-link").prop("checked");
// Editor font size // Editor font size
@ -355,7 +360,6 @@ define(
// apply Scroll Link // apply Scroll Link
lastEditorScrollTop = -9; lastEditorScrollTop = -9;
lastPreviewScrollTop = -9;
scrollLink(); scrollLink();
}, 500); }, 500);
@ -370,7 +374,6 @@ define(
var editorScrollTop = editorElt.scrollTop(); var editorScrollTop = editorElt.scrollTop();
var previewElt = $("#wmd-preview"); var previewElt = $("#wmd-preview");
var previewScrollTop = previewElt.scrollTop(); var previewScrollTop = previewElt.scrollTop();
console.log(previewScrollTop);
function animate(srcScrollTop, srcSectionList, destElt, destSectionList, callback) { function animate(srcScrollTop, srcSectionList, destElt, destSectionList, callback) {
// Find the section corresponding to the offset // Find the section corresponding to the offset
var sectionIndex = undefined; var sectionIndex = undefined;
@ -501,8 +504,11 @@ define(
if(core.settings.converterType == "markdown-extra-prettify") { if(core.settings.converterType == "markdown-extra-prettify") {
editor.hooks.chain("onPreviewRefresh", prettyPrint); editor.hooks.chain("onPreviewRefresh", prettyPrint);
} }
if(viewerMode === false && core.settings.scrollLink === true) { function previewFinished() {
editor.hooks.chain("onPreviewRefresh", function() { if(viewerMode === false && core.settings.scrollLink === true) {
// MathJax may have change the scroll position. Restore it
$("#wmd-preview").scrollTop(lastPreviewScrollTop);
// Update Scroll Link sections
// Modify scroll position of the preview not the editor // Modify scroll position of the preview not the editor
lastEditorScrollTop = -9; lastEditorScrollTop = -9;
buildSections(); buildSections();
@ -511,7 +517,14 @@ define(
lastEditorScrollTop = -9; lastEditorScrollTop = -9;
buildSections(); buildSections();
}); });
}); }
}
// MathJax
if(core.settings.enableMathJax === true) {
mathjaxEditing.prepareWmdForMathJax(editor, [["$", "$"], ["\\\\(", "\\\\)"]], previewFinished);
}
else {
editor.hooks.chain("onPreviewRefresh", previewFinished);
} }
// Custom insert link dialog // Custom insert link dialog
editor.hooks.set("insertLinkDialog", function (callback) { editor.hooks.set("insertLinkDialog", function (callback) {
@ -527,11 +540,10 @@ define(
$("#modal-insert-image").modal(); $("#modal-insert-image").modal();
return true; return true;
}); });
// MathJax
mathjaxEditing.prepareWmdForMathJax(editor, [["$", "$"], ["\\\\(", "\\\\)"]]);
editor.run(); editor.run();
firstChange = false; firstChange = false;
$("#wmd-input").bind('input propertychange', _.throttle(editor.refreshPreview, 1000));
// Hide default buttons // Hide default buttons
$(".wmd-button-row").addClass("btn-group").find("li:not(.wmd-spacer)") $(".wmd-button-row").addClass("btn-group").find("li:not(.wmd-spacer)")

View File

@ -1,4 +1,4 @@
define([ "jquery", "../lib/MathJax/MathJax" ], function($) { define([ "../lib/MathJax/MathJax" ], function() {
MathJax.Hub.Config({"HTML-CSS": {preferredFont: "TeX",availableFonts: ["STIX", "TeX"],linebreaks: {automatic: true},EqnChunk: (MathJax.Hub.Browser.isMobile ? 10 : 50), imageFont: null}, MathJax.Hub.Config({"HTML-CSS": {preferredFont: "TeX",availableFonts: ["STIX", "TeX"],linebreaks: {automatic: true},EqnChunk: (MathJax.Hub.Browser.isMobile ? 10 : 50), imageFont: null},
tex2jax: {inlineMath: [["$", "$"], ["\\\\(", "\\\\)"]],displayMath: [["$$", "$$"], ["\\[", "\\]"]],processEscapes: true,ignoreClass: "tex2jax_ignore|dno"}, tex2jax: {inlineMath: [["$", "$"], ["\\\\(", "\\\\)"]],displayMath: [["$$", "$$"], ["\\[", "\\]"]],processEscapes: true,ignoreClass: "tex2jax_ignore|dno"},
@ -151,24 +151,12 @@ define([ "jquery", "../lib/MathJax/MathJax" ], function($) {
// This is run to restart MathJax after it has finished // This is run to restart MathJax after it has finished
// the previous run (that may have been canceled) // the previous run (that may have been canceled)
// //
var refreshCallback = undefined;
function RestartMJ() { function RestartMJ() {
pending = false; pending = false;
HUB.cancelTypeset = false; // won't need to do this in the future HUB.cancelTypeset = false; // won't need to do this in the future
// Keep scroll position (due to a weird behavior when updating div)
var scrollTop = undefined;
console.log($(preview).scrollTop());
HUB.Queue(function() {
console.log($(preview).scrollTop());
scrollTop = preview.scrollTop;
});
HUB.Queue([ "Typeset", HUB, preview ]); HUB.Queue([ "Typeset", HUB, preview ]);
HUB.Queue(function() { HUB.Queue(refreshCallback);
console.log($(preview).scrollTop());
setTimeout(function() {
console.log($(preview).scrollTop());
preview.scrollTop = scrollTop;
}, 1000);
});
} }
// //
@ -179,7 +167,6 @@ define([ "jquery", "../lib/MathJax/MathJax" ], function($) {
if (!pending && ready) { if (!pending && ready) {
pending = true; pending = true;
HUB.Cancel(); HUB.Cancel();
console.log($(preview).scrollTop());
HUB.Queue(RestartMJ); HUB.Queue(RestartMJ);
} }
} }
@ -190,7 +177,8 @@ define([ "jquery", "../lib/MathJax/MathJax" ], function($) {
// to handle escaping the math. // to handle escaping the math.
// Create a preview refresh hook to handle starting MathJax. // Create a preview refresh hook to handle starting MathJax.
// //
function prepareWmdForMathJax(editorObject, delimiters) { function prepareWmdForMathJax(editorObject, delimiters, callback) {
refreshCallback = callback;
preview = document.getElementById("wmd-preview"); preview = document.getElementById("wmd-preview");
inline = delimiters[0][0]; inline = delimiters[0][0];