MathJax on TiddlyWiki

[RobertM]

[Previous posted at http://sourceforge.net/projects/mathjax/forums/forum/948701/topic/3642640]

thedos
2010-03-26 15:11:37 UTC

I'm trying to get MathJax working on a TiddlyWiki (TiddlyWiki.org , a
one file wiki project). I have an TiddlyWiki plugin which uses jsMath
(Plugin:jsMath from http://bob.mcelrath.org/tiddlyjsmath-2.0.3.html)
and it seems to work fairly well. My idea was to simply load MathJax
instead of jsMath and tweek the jsMath plugin to use MathJax instead.
However, I have yet to accomplish this.

I'm sure it should be very easy but, despite being a decent
programmer, I'm very new to javascripts and web development in
general. Is anyone out there working on something similar who has
already done this or can help me?
I'm almost sure its very simple for someone with more experience/
knowledge on the subject.
Thx

--------------

robertminer
2010-03-26 15:26:27 UTC

Thedos,

Interestingly, I had a private inquiry about using MathJax with
TiddlyWiki last week as well. We haven't had time to look at it yet,
so if someone else out there has an idea, that would be great!
However, it's in the queue and one of us will try to find to time look
at it soon. At the moment, we are trying to focus on getting out a
new beta with MathML support enabled, so it might not be until after
that.

--Robert

--------------

victor_ivrii
2010-03-27 01:36:26 UTC

I use MathJax with mediawiki wiki - just substituted in jsMath plug-
in. Just in
LocalSettings.php:
$wgJsMathRoot = "http://weyl.math.toronto.edu:8888/mathjax";;

and in

extensions/JsMath/JsMath.php:
$wgOut->addScript( '<script type="' . $wgJsMimeType . '" src="'
. $wgJsMathRoot . '/MathJax.js"></script>' );


No doubt something like this should work

--------------

dpvc
2010-03-28 14:14:28 UTC

Bob McElrath was one of the first people to incorporate jsMath into a
Wiki setting, and TiddlyWiki did a lot to help establish jsMath in
that environment. Because Bob's plugin was an early adopter, not all
of jsMath's current features were available at the time; for example,
the easy/load.js mechanism for configuring jsMath wasn't available,
and I think maybe even the tex2math preprocessor might not have been
there (I know for sure that its processing of latex environments
outside of math mode was not implemented yet). So the plugin does
more than it would have to if he wrote it today. So it might not be
the best choice of template for MathJax.

I took a very quick look at it, and there are a number of things that
will have to be changed to work with MathJax. First, it makes very
specific use of some internals of jsMath that are not the same for
MathJax (setting the root location of jsMath, turning off the initial
processing pass, and so on). It also seems to use XmlHttpRequest as
its AJAX method, and that will not be effective for MathJax (since
MathJax relies on the fact that it is loaded with a SCRIPT tag in
order to handle its configuration).

So the section of the plugin that loads jsMath would have to be
substantially changed for MathJax. Something like


(function () {
var HEAD = document.getElementsByTagName("head")[0];
var SCRIPT = document.createElement("script");
SCRIPT.src = String(document.location).replace(/[^\/]*$/,'MathJax/
MathJax.js');
HEAD.appendChild(SCRIPT);
})();


might work to load MathJax from a MathJax subdirectory of the
directory where the tiddlywiki file is stored. That would cause
MathJax to use its MathJax/config/MathJax.js file for configuration,
where you can set what input and output jax to use, the preprocessors
to run, and so on.

It looks like Bob took some pains to prevent jsMath from doing its
initial processing pass (it seems to process the tiddlers as they
open), so you may want to turn off MathJax's initial pass by changing
the value of skipStartupTypeset in the config file.

The rest of the plugin (from "Define wikifiers for latex" on) seems to
be doing much of the same sort of thing that the tex2jax preprocessor
will do, so I'd say you can remove that and let tex2jax handle that
part. The only thing I think you need to include is the last routine,
which looks like it is there simply to call
jsMath.ProcessBeforeShowing() at the right time. You want to have it
call MathJax.Hub.Typeset() instead.

I haven't tried any of this, but that's what it looks like to me.
Give it a try and see if that gets you anywhere, and report back when
you have any news. Thanks.

Davide

--------------

thedos
2010-03-30 16:09:27 UTC

Thank you very much for your prompt replies.
I still haven't gotten around to do much testing as this is something
I'm working on on the side, but I thought I'd at least send my
appreciation. To be honest, the instructions are going a bit over my
head, sorry I'm very new at this. I have a friend whom is working
with TiddlyWiki also, perhaps my friend is better able to get this
going.
I'll let you know how it goes, any further instruction/help is very
welcomed.
Thanks,
David

--------------

pdfion
010-03-30 16:11:30 UTC

It did seem the obvious thing to hope that MathJax could become a
TiddlyWiki plugin as Bob McElrath had arranged for jsMath. But I
found understanding what was going on in his embedding beyond me, so
couldn't try for MathJax. We have had a version of the TiddlyWiki
form of the Math Subject Classification MSC2010 working happily with
jsMath, though the present form uses the LaTeXMathML Plugin
http://msc2010.org/MSC-2010-server.html[\url]. The plugin allows a
user to make simple notes with math in a downloaded personal copy of
the MSC from [url]http://msc2010.org/MSC-2010-personal.html[\url].
Since the AMS is going on to MathJax it will be better to be using
that for the MSC as well. This new posting gives hope that we can get
a MathJax TW plugin and I'm grateful for something more to try. It
also explains, perhaps:

MathJax does not work inside a minBrowser in TiddlyWiki.

For a view of this not working see
[url=http://www-personal.umich.edu/~pion/WebGeom/
TiddlyGeom.html#[[MathJax%20MiniBrowser]]]http://www-
personal.umich.edu/~pion/WebGeom/TiddlyGeom.html#[[MathJax
%20MiniBrowser]]

and you can also see that Soares's MathSVG Plugin does a pretty good
job of dealing with some
of the same material, if you have a MathML rendering browser like a
recenrt FireFox, by visiting
[url=http://www-personal.umich.edu/~pion/WebGeom/
TiddlyGeom.html#[[MathJax%20Preview]]]http://www-personal.umich.edu/
~pion/WebGeom/TiddlyGeom.html#[[MathJax%20Preview]]

Other heavy JavaScript pages, like another TW page, perform fine in a
miniBrowser.

Note that the rest of the material on that TiddlyGeom is pretty
scrappy and not ready for prime time.

Patrick

--------------

dpvc
2010-03-31 14:16:25 UTC

@David:

You're welcome, and I hope we can get the plugin working eventually (I
don't use TiddlyWiki myself, and can't take time at the moment to
learn how to write plugins for it, but perhaps after MathJax v1.0 is
out I can do that).

@Patrick:

I'll check into the miniBrowser problem (Firefox's security policy is
blocking it from working, and the problem has to do with MathJax's
interaction with the IFRAME that contains the miniBrowser). I'll need
to do some experimenting.

Davide

--------------

dpvc
2010-04-03 00:05:26 UTC

@Patrick:

I have fixed the problem with MathJax in an IFRAME, but haven't yet
updated the copy on www.mathjax.org, so your example still won't work
until I do that. that should be sometime next week. But if you try
it from a site that has an up-to-date copy of MathJax, it should work.

Davide

--------------

pdfion
2010-04-03 01:41:25 UTC

Davide,

That's great. Thank you very much. TiddlyWiki's IFRAME use, such as
in miniBrowser
and External Tiddlers can be very handy sometimes.

Patrick

--------------

dbonk
2010-09-26 11:56:29 UTC

I have been working on this and have it in an intermediate state here:
http://myweb.dal.ca/haines/#Plugin-MathJax
It works as is right now, but check the MathJax Sample tiddler - not
rendered...
But when I load it in the MarkupPostHead Tiddler as I have in the
instructions it all works fine... but I'd rather load it dynamically
as you suggest. But if I do (as currently) the two calls to
MathJax.Hub.Typeset that I have currently commented out are
undefined...

So how do I reference the dynamically loaded MathJax in this case?

I will play with skipping the other code and using tex2math once I get
past this. (as well as addressing the IE8 bug - I have tried all the
usual suggestions to no avail)

The old jsMath plugin used an ajax call to load jsmath, and I
experimented with using the TiddlyWiki embedded jQuery ajax request
directly...

But I like loading it as you suggest... just how to call it?

It will process on its own startup, but if I turn off the the initial
typeset it does not render the math (as I desire). I want to call it
on demand... I can if I put the MathJax script tag and config in the
MarkupPostHead tiddler (as in the current plugin instructions - but
not currently done), but I'd rather load it dynamically for fewer
edits for the user to install...

Hopefully you can see where I'm going here, I don't think I've
explained it very well, but I think you'll get it...

(note: not working in IE8, works in IE9 and all other browsers though
- go figure...)

--------------

dbonk
2010-09-26 14:30:45 UTC

I totally redid it.

I figured it out: let majthjax/tex2jax do all the work, as you
suggested, and just tuck the window.wikify redifinition inside the
appended MathJax script tag. Works in all browsers now too. (have not
added X-UA compat tag for IE tho...)

--------------

dbonk
2010-09-26 16:57:16 UTC

I renamed it to http://myweb.dal.ca/haines/#PluginMathJax to allow
registration in the TiddlyWiki config.extensions namespace. (with an
eye to further functionality besides .insert, like perhaps a .remove
if needed for some purpose...)

--------------

dpvc
2010-09-28 10:47:48 UTC

OK, this last version looks much better, and I'm glad you have it
working.

A couple of comments:

1. There is no need for the empty 'config: [],' line (it will default
to an empty array).

2. I don't think you need the 'delayStartupUntil: "onload"' line since
you are forcing the onload immediately anyway.

3. There is no need for the 'webFont: "TeX"," setting, since that is
the default (and only choice at the moment).

4. I personally would not make 'imageFont: null," the default, as the
image fonts will be part of the MathJax installation for most people.
If you want to tell people how to remove the png directory and set
this, then that's fine, but if someone is going to make a MathJax-
based TiddlyWIki available on the web, then it will be important to
have these fonts available. It may also be important to have them
even for local installations when Firefox is used. (If MathJax is not
in the same directory as the TiddlyWiki HTML file, Firefox will not be
able to access the web-based fonts and will have to use the image
fonts.) SO you rin a real risk of your plugin "not working" for
people in those situations. They will not be likely to look closely
at the details of your plugin and realize that they can reconfigure it
to work for them.

If you do want to keep this line, you should remove the extra comma at
the end (it will confuse some browsers). If you remove this line, be
sure to remove the comma on the previous line.

5. I see that you have made the change to window.wikifier be part of
the MathJax configuration script. This was in order to make the
change occur only when MathJax is available, presumably to avoid
problems with MathJax.Hub not being defined before MathJax loads.
That is clever, but there is also another way to do it. You could
use
if (window.MathJax)
{MathJax.Hub.Queue(["Typeset",MathJax.Hub,output])}

instead and make the change to window.wikify as you did originally.

I think these changes will improve the result, but you have done a
good job in getting it to this ppint.

Davide

--------------

dbonk
2010-10-04 20:55:23 UTC

Thanks for the input!

I have since revised it again (before reading this) after some user
feedback regarding how the autolinkwikiwords function of tiddlywiki
interferes with mathjax - the way we are running it here - it could be
avoided by manually adding the parsers to tiddlywilki as the jsMath
plugin did, but then there othere other issues with that approach and
myself I don't like the auto-link wikiwords feature much anyway, it's
only helpful about 50% of the time, the other half of the time it
seems to get in the way. There is aplugin that addresses this (and
I've added detection of it to my plugin) but that plugin uses
configuration options that are stored in cookies only. A tiddlywiki
persistence issue that has no immediate solution without using a
server ... oh wait... idea... tiddlyWiki cookie server... I saw
something about "baking" cookies into html too... but I don't want to
go down that road, it is a tiddlywiki architecture issue and I don't
necessarily want to get in that deep (or see much gain in it).

I will go over your input here and incorporate it as best I can with
my current approach. I'm a little spooked that people picked up and
started using it right away, but the combo is too cool. I want to get
ChemDoodleWeb working in my TiddlyWiki too, but the way it uses jQuery
is giving me headaches. The whole .noconflict thing seems to be
actually getting in the way. If I can get past this stuff and get to
adding in some of the other features I want, I might just have a
competitive (uncertified) lab notebook application. I want it to be
slicker than what I have seen, and since the js application market has
exploded with the iPhone (I started way back when...) But who knows if
I'll have time for all that. I've been wondering about the usefulness
of interpreting postscript in tiddlywiki as well. Lots of ideas, tough
to stay focused.

I will take your advice regarding removing the redundant (default)
config entries (though I was thinking to leave some as hints for new
users... they'll think now what's this and ho on over to the docs...

I will think about what you've said about the image fonts... my
initial reasoning is the location I'm hosting from. I just don't have
space for them so can't leave them on in my default setup but I can
make it easier for the user... perhaps I can detect them enable if not
explicitly set otherwise... I think that would make sense but would be
the most work. (?)

I'll read your comments in more detail and update my plugin soon.
Thanks again for the input and encouragement.

(please excuse my stream-of-consciousness reply)

--------------

dbonk
2010-10-05 13:37:19 UTC

I updated the plugin according to your suggestions. It is an
improvement. Thanks again.

(I've left the image fonts out of the mathjax install I have posted,
but have left the usual image font default setting in place (now
redundant?) and tested the plugin locally with and without the folder
present with three different browsers and all seems fine)

Now the only thing really bugging me about it is the autolinkwikiwords
thing. It uglies up an otherwise very simple and tidy plugin. I'm
kinda hoping future changes in the core of tiddlywiki or mathjax might
change that, but this is fine for now.

I may make a permanent home for this stuff somewhere...

--------------

dbonk
2010-10-05 14:44:29 UTC

P.S. might be worthy of note to someone, or myself... when I added the
conditional to the MathJax.Hub.Queue call as suggested and temporarily
removed the autolinkwikiwords disabling code it all worked on a first
load/refresh but tiddlers rendered after the first load suffered the
interference I've mentioned, (at least I think that is what happened)
so I left my autolinkwikiwords disabling code in. It just suggests
that if I timed it right I might be able to get away with leaving
autolinkwikiwords intact. I'm on the MathJax forums here and this more
of a tiddlywiki issue perhaps? But a good sample case of integration
issues perhaps? I guess the tiddlywiki core needs a good way of
standardising this kind of integration. Oops, I ramble again.

I'm looking at creating an SMF plugin and MediaWiki extension for
MathJox as well. (if not existing or adequate)

--------------

dbonk
2010-10-07 02:19:02 UTC

No need for an SMF or MediaWiki plugin. It drops right into both so
easily.

I have posted yet another version of the TiddlyWiki PluginMathJax.

This time with additional input from the original Plugin: jsMath
developer as well. (And that of two users who have picked it up
already)

So between your comments and the others I think I have worked out most
of the kinks for the best solution.

There were just too many complications in letting MathJax do it's
complete thing within TiddlyWiki. The original approach of Plugin:
jsMath is best in this case (at least as far as I can tell). It seems
a tad faster too (I know it should be).

This will also preserve the escapes that existing Plugin: jsMath users
have in their TiddlyWiki content etc.

Before I went back down this road I tried to do it all in Mathjax
config entries, and almost got there (still have the code if
interested.. I can't describe it so well now...)

Thanks to all for their input. This has worked out pretty well. The
only thing I have not done is to setup latex definitions macros as
suggested. Once the base is solid a few features like that might be
appreciated.

--------------

dbonk
2010-10-07 10:36:42 UTC

Ah wouldn't you know it, now it shows issues in IE9 only. Grrr.

--------------
dpvc
2010-10-07 12:09:33 UTC

If you remove the comma after the "scale: 115" I think that will help
IE9. Remember, not all browsers will handle an extra comma in these
structures (IE doesn't).

Davide

--------------

dbonk
2010-10-07 16:18:59 UTC

Arg, is that still there? Oops. let me double check. (as it is loading
fine in ie9 for me today)

I have like seven different browsers on the go, all with different
cache settings. I am going to clear them all check the cache settings
on each restart each and look at a first load vs a refresh on each to
ensure the expected behaviour is occurring in all the major browsers.

Thanks for the reminder!

--------------

dbonk
2010-10-07 18:02:20 UTC

Took care of that rogue comma and I think I've got all the browser
compatibility issues I can get. (IE9 wants InnerHTML like Opera). The
mathjax menu does not appear in IE9 though. I don't think that is
related to this TiddlyWiki plugin though (?) Ah... I can check IE9
MathJax menus on SMF and MediaWIki and see what I get there. -
Interesting... neither works in IE9. simple drop-in MathJax in SMF and
MediaWiki was working on IE8 and IE9PPV, but not in IE9 beta. So
perhaps there is more. Interesting to note that it does render in IE9
beta the way we have done it in this tiddlywiki plugin. Indicating an
IE9 showstopper in tex2jax. (?)

The three links I'm comparing in various browsers:
http://myweb.dal.ca/haines/#PluginMathJax
http://www.dynaverse.net/forum/index.php/topic,163390735.0.html (hmm
the IE9 beta breaks lots of stuff it seems, surprise, surprise...)
and http://www.dynaverse.net/wiki/index.php?title=Help:Math

--------------

dbonk
2010-10-09 17:35:50 UTC

Yet another revision. I think this is the best overall solution for
MathJax in TiddlyWiki. After much thought and testing I feel this is
the best implementation. There are issues with both TIddlyWiki and
MathJax (generally browser specific) that have resulted in this.
Should that change I may update the plugin. (I'd still like to try and
implement latex definitions macros too, to really add some
functionality now that the base is solid)

I have kept an archived copy of the previous version 1.3 (still
Plugin: jsMath compatible) posted for users who prefer to keep their
jsMath tiddlywiki content as is but rendered by MathJax. All versions
from here will most likely follow the design laid out in version 1.4.

aside: I also found a bug in tiddlywiki where it does not parse
htmlentities after a colon (in a table at least).

I just might email the ChemDoodle Web guys. Hopefully they will be as
helpful as all of you have!

--------------

dbonk
2010-10-09 17:47:31 UTC

Correction: I think this is the best overall solution for MathJax in
TiddlyWiki (CURRENTLY).

Observation: the MathJax menu does appear in IE9 in my plugin, it is
just positioned "absolutely" at 0,0 !

Not sure why MathJax is not rendering IE9 as I have it configured in
SMF and MediaWiki. I'll get to that later if it is not solved
otherwise.

--------------

robertminer
2010-10-21 19:44:04 UTC

Dear dbonk,

I wanted to follow up with you and ask if you consider your TiddlyWiki
plugin more or less done for the moment, and whether
http://myweb.dal.ca/haines/#PluginMathJax is the best URL to direct
people toward. I'd like to help publicize it provided it is at a
point of repose, since I think a number of people would be interested.

--Robert

[xuanops]

Dear dbonk,

I have been testing your plugin. Thank you very much for your work.
I have seen that e.appendChild(document.createTextNode(text)) is not
allowed in IE8 if "e" is a script element.
But I found a solution in http://www.phpied.com/dynamic-script-and-style-elements-in-ie/

I think that there is no colateral problems, but I cannot confirm...

In particular, I have discovered that using this new definition for
createTiddlyElement, there are no problems using IE8 with your plugin.
and now the other plugin (sintaxhightight) works, also. In addition
there
are other plugins that work now also, like a FCKeditor based plugins

function createTiddlyElement(parent,element,id,className,text,attribs)
{
var e = document.createElement(element);
if(className != null)
e.className = className;
if(id != null)
e.setAttribute("id",id);
if(text != null){
if(element=="script")
e.text=text;
else
e.appendChild(document.createTextNode(text));
}
if(attribs) {
for(var n in attribs) {
e.setAttribute(n,attribs[n]);
}
}
if(parent != null)
parent.appendChild(e);
return e;
}

--Juan

[Jerry He]

Hi dbonk,
your website seems unavailable from the UK (both
http://myweb.dal.ca/haines/#Plugin-MathJax and http://tiddlywiki.canada-east.ca/).
Could anyone with a working version of this plugin send a copy to me?

Many many thanks,
Jerry

On Nov 30, 5:38 pm, xuanops <jua...@tel.uva.es> wrote:
> Dear dbonk,
>
> I have been testing your plugin. Thank you very much for your work.
> I have seen that e.appendChild(document.createTextNode(text)) is not
> allowed in IE8 if "e" is a script element.

> But I found a solution inhttp://www.phpied.com/dynamic-script-and-style-elements-in-ie/

[creatorlarryli]

Actually MathJax will automatically parse all the math expressions in
the html file. So there is no need to use wikifiy(). I wrote a very
simple plugin, which simply call MathJax at the end of the tiddler to
render the LaTeX code. You can find it here:
http://www.math.umn.edu/~lixx1445/#MathJaxTiddlyPlugin

Cheers,
Larry.

On Dec 10 2010, 5:44 pm, Jerry He <enk...@gmail.com> wrote:
> Hi dbonk,

>     your website seems unavailable from the UK (bothhttp://myweb.dal.ca/haines/#Plugin-MathJax andhttp://tiddlywiki.canada-east.ca/).

[Victor Ivrii]

I thought that I managed to hack SMF 2.0 (including betas) when I inserted line on l.3309 in Subs.php

[code]

  // ]]></script>';

echo "<script type='text/javascript' src='/mathjax/MathJax.js?config=default'></script>";

        if (!isset($context['page_title']))

[/code]

However it appears that while everything works in Webkit-based browsers (Safari, Chrome, Omniweb) Firefox and Opera hang on Post Preview (even if there is no need to use MJ.

I tried to use "Custom And Scripts" SMF package but it solves the above problem but Preview Post does not use MJ even in Safari.

Does anyone has a solution free of such defects?