123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273 |
- svgEditor.addExtension("mathjax", function() {'use strict';
-
-
- var
-
- mathjaxSrcSecure = 'https://c328740.ssl.cf1.rackcdn.com/mathjax/latest/MathJax.js?config=TeX-AMS-MML_SVG.js',
- math,
- locationX,
- locationY,
- mathjaxLoaded = false,
- uiStrings = svgEditor.uiStrings;
-
- $.extend(uiStrings, {
- mathjax: {
- embed_svg: 'Save as mathematics',
- embed_mathml: 'Save as figure',
- svg_save_warning: 'The math will be transformed into a figure is manipulatable like everything else. You will not be able to manipulate the TeX-code anymore. ',
- mathml_save_warning: 'Advised. The math will be saved as a figure.',
- title: 'Mathematics code editor'
- }
- });
- function saveMath() {
- var code = $('#mathjax_code_textarea').val();
-
-
- MathJax.Hub.queue.Push(['Text', math, '\\displaystyle{' + code + '}']);
-
- MathJax.Hub.queue.Push(
- function() {
- var mathjaxMath = $('.MathJax_SVG');
- var svg = $(mathjaxMath.html());
- svg.find('use').each(function() {
- var x, y, id, transform;
-
- if ($(this).attr('href')) {
- id = $(this).attr('href').slice(1);
- } else {
- id = $(this).attr('xlink:href').slice(1);
- }
- var glymph = $('#' + id).clone().removeAttr('id');
- x = $(this).attr('x');
- y = $(this).attr('y');
- transform = $(this).attr('transform');
- if (transform && ( x || y )) {
- glymph.attr('transform', transform + ' translate(' + x + ',' + y + ')');
- }
- else if (transform) {
- glymph.attr('transform', transform);
- }
- else if (x || y) {
- glymph.attr('transform', 'translate(' + x + ',' + y + ')');
- }
- $(this).replaceWith(glymph);
- });
-
- svg.removeAttr('style');
- svg.attr('xmlns', 'http://www.w3.org/2000/svg');
- svgCanvas.importSvgString($('<div>').append(svg.clone()).html(), true);
- svgCanvas.ungroupSelectedElement();
-
-
- svgCanvas.moveSelectedElements(locationX, locationY, true);
- }
- );
- }
- return {
- name: "MathJax",
- svgicons: svgEditor.curConfig.extPath + "mathjax-icons.xml",
- buttons: [{
- id: "tool_mathjax",
- type: "mode",
- title: "Add Mathematics",
- events: {
- click: function() {
-
-
- if (mathjaxLoaded === false) {
- $('<div id="mathjax">\
- <!-- Here is where MathJax creates the math -->\
- <div id="mathjax_creator" class="tex2jax_process" style="display:none">\
- $${}$$\
- </div>\
- <div id="mathjax_overlay"></div>\
- <div id="mathjax_container">\
- <div id="tool_mathjax_back" class="toolbar_button">\
- <button id="tool_mathjax_save">OK</button>\
- <button id="tool_mathjax_cancel">Cancel</button>\
- </div>\
- <fieldset>\
- <legend id="mathjax_legend">Mathematics Editor</legend>\
- <label>\
- <span id="mathjax_explication">Please type your mathematics in \
- <a href="http://en.wikipedia.org/wiki/Help:Displaying_a_formula" target="_blank">TeX</a> code.</span></label>\
- <textarea id="mathjax_code_textarea" spellcheck="false"></textarea>\
- </fieldset>\
- </div>\
- </div>'
- ).insertAfter('#svg_prefs').hide();
-
- $('#mathjax_container').draggable({cancel: 'button,fieldset', containment: 'window'});
-
- $('#tool_mathjax_cancel').prepend($.getSvgIcon('cancel', true))
- .on("click touched", function() {
- $('#mathjax').hide();
- });
-
- $('#tool_mathjax_save').prepend($.getSvgIcon('ok', true))
- .on("click touched", function() {
- saveMath();
- $('#mathjax').hide();
- });
-
- $('body').addClass('tex2jax_ignore');
-
- $.getScript(mathjaxSrcSecure)
- .done(function(script, textStatus) {
-
- MathJax.Hub.queue.Push(function() {
- math = MathJax.Hub.getAllJax('#mathjax_creator')[0];
- console.log(math);
- mathjaxLoaded = true;
- console.log('MathJax Loaded');
- });
- })
-
- .fail(function() {
- console.log("Failed loadeing MathJax.");
- $.alert("Failed loading MathJax. You will not be able to change the mathematics.");
- });
- }
-
- svgCanvas.setMode("mathjax");
- }
- }
- }],
-
- mouseDown: function() {
- if (svgCanvas.getMode() === "mathjax") {
- return {started: true};
- }
- },
- mouseUp: function(opts) {
- if (svgCanvas.getMode() === "mathjax") {
-
- var zoom = svgCanvas.getZoom();
-
- locationX = opts.mouse_x / zoom;
- locationY = opts.mouse_y / zoom;
- $('#mathjax').show();
- return {started: false};
- }
- },
- callback: function() {
- $('<style>').text('\
- #mathjax fieldset{\
- padding: 5px;\
- margin: 5px;\
- border: 1px solid #DDD;\
- }\
- #mathjax label{\
- display: block;\
- margin: .5em;\
- }\
- #mathjax legend {\
- max-width:195px;\
- }\
- #mathjax_overlay {\
- position: absolute;\
- top: 0;\
- left: 0;\
- right: 0;\
- bottom: 0;\
- background-color: black;\
- opacity: 0.6;\
- z-index: 20000;\
- }\
- \
- #mathjax_container {\
- position: absolute;\
- top: 50px;\
- padding: 10px;\
- background-color: #B0B0B0;\
- border: 1px outset #777;\
- opacity: 1.0;\
- font-family: Verdana, Helvetica, sans-serif;\
- font-size: .8em;\
- z-index: 20001;\
- }\
- \
- #tool_mathjax_back {\
- margin-left: 1em;\
- overflow: auto;\
- }\
- \
- #mathjax_legend{\
- font-weight: bold;\
- font-size:1.1em;\
- }\
- \
- #mathjax_code_textarea {\\n\
- margin: 5px .7em;\
- overflow: hidden;\
- width: 416px;\
- display: block;\
- height: 100px;\
- }\
- ').appendTo('head');
-
-
- }
- };
- });
|