Equations not inheriting font color in IE and Chrome

Equations not inheriting font color in IE and Chrome

by Tianna Tagami -
Number of replies: 25
I have my AM1.js file set to have the equation inherit font color. This is working in Firefox, but not in IE and Chrome.

I also can't seem to get any changes to
var mathfontfamily to take.

The file I have was updated November 2009. Is this the latest file?
Average of ratings: -
In reply to Tianna Tagami

Re: Equations not inheriting font color in IE and Chrome

by Mauno Korpelainen -

Firefox can inherit font color because it uses MathML - for image fallbacks (other browsers) you need to use tags that define textcolor or colorbox (background color) but color support is not implemented to asciimathml tags - I have only implemented it to latexmathml tags using \textcolor

I have not tested AM1.js lately but if I remember it correct you should be able to use tags like

$\textcolor{#FF0000}{test}$

or

 $\textcolor{red}{test}$

to change the colors.

If your image fallback renderer does no support colors with \usepackage[usenames]{color} you could try AMgoogle.js that uses google chart api tex which has full color support - see http://korpelainen.net/gmoodle/mod/resource/view.php?id=8

I have not modified the files for 9 months so I suppose the latest files are in

http://korpelainen.net/plugindemo/lib/editor/common/AM1.js (AM.js is a combination of AM1.js and AS1.js)

http://korpelainen.net/plugindemo/lib/editor/common/AMgoogle.js 

Mimetex has very poor color support (less than 10 named colors supported) and original versions of AsciimathML support colors only for FF/MathML with mathcolor setting.

In reply to Mauno Korpelainen

Re: Equations not inheriting font color in IE and Chrome

by Tianna Tagami -
Unfortunately, I'm not really familiar with LaTEX. Can you suggest a site where I can find the syntax?

In your example is the {test} where I put the equation?

Thanks!
Tianna
In reply to Tianna Tagami

Re: Equations not inheriting font color in IE and Chrome

by Mauno Korpelainen -

Color syntax in that particular script is:

$ \textcolor{TheColor}{text to be colored} $

$ \colorbox{TheColor}{text to be background colored} $

In asciimathml you use backticks, in latexmathml you use dollars.
Asciimathml is using some custom syntax created originally by Peter Jipsen and most available symbols are visible in the script itself (AMsymbols).
LatexMathML is using some Latex type syntax (only some selected symbols of Latex - not all symbols of Latex) and most available symbols are visible in the script itself (LMsymbols). Note that you need to know which image fallback renderer is using (my test site AM.js and AM1.js are using TexLive 2007 with mathtex.cgi) - google gives some links to guides of different distributions of Latex. Google Chart Api Tex is Mimetex type syntax and colors are defined through Google Chart api itself in AMgoogle.js script

The original latexMathML color support was implemented by Jeff Knisley http://math.etsu.edu/LaTeXMathML/ but that script did not have image fallback and on the other hand scripts made by Peter Jipsen and David Lippman had symbol sets created for Mimetex type fallback so I collected the previous scripts to AM(1).js - AMgoogle.js was my own idea and it was just recently documented in http://code.google.com/apis/chart/docs/gallery/formulas.html

AMgoogle.js script is simply converting the textcolor and color box tags to google chart api tex instead of usual \usepackage[usenames]{color} type Latex code.

In mathtex it is also possible to use external cgi renderer this way:

http://korpelainen.net/cgi-bin/mathtex.cgi?\dpi{300}\usepackage[usenames]{color}\textcolor{red}{text\;to\;be\;colored}

which gives

http://korpelainen.net/cgi-bin/mathtex.cgi?\dpi{300}\usepackage[usenames]{color}\textcolor{red}{text\;to\;be\;colored}

But the main difference between FF and other browsers is that in MathML (FF) the font color is given directly with "mathcolor" - in image fallback (other browsers that do not support mathml) you need to get the renderer to create images with that text color... and for example Mathtran does not support colors at all...

In reply to Mauno Korpelainen

Re: Equations not inheriting font color in IE and Chrome

by Colin Fraser -
Picture of Documentation writers Picture of Testers
Forgive my ignorance here Muano, is this level of sophistication available in Moodle, in a mediaWiki, just on GoogleDocs or applicable across the board for browsers. I understand FireFox has implemented a MathML, but what about Moodle? And more importantly, for me anyway, where do I go and get the basic information I need to be able to use these tools in my Courses?

It is just simple things, escape sequences, accessing correct maths symbols. Are they the same as TeX? Have they built on TeX? Or developed their own subset? What rules are there to use these things in different environments? What advice do I give people to look for things where? What is the difference between AsciiMathML and TeX? (Obvious to me, but I still have to articulate it when trying, perhaps, to give training to other staff. I am way ahead of other people, and they will not have the time or patience to develop the skills on their own.)

In reply to Colin Fraser

Re: Equations not inheriting font color in IE and Chrome

by Mauno Korpelainen -

Colin,

first of all you must understand that I am just a normal moodler and primarely a teacher - not a developer or even a maintainer of any official script. I have modified old asciimathml and latexmathml script to AM(1).js/AMgoogle.js and AS.js scripts about 9 months ago to do something useful for TESTING purposes - they are poorly documented but some pieces of docs can be found from the original AsciiMathML and LatexMathML using google (or other search engines).

Moodle does not (by default) support MathML input/output, in fact the only forms of math that moodle (by default) supports are Tex filter and Algebra filter that are likewise poorly documented. Syntax of Algebra filter is actually very near of syntax of Asciimathml but there are only some old posts that give you hints about that syntax unless you have time to read the code of actual files rendering maths with Algebra filter. Typical teachers and students have no idea about syntax of Latex (with different distributions having different versions with partly different syntax), they have no idea about using asciimathml, latexmathml, mathml or any other javascript or java based tools we have been talking about on these math forums.

Typical teachers and students do not read our posts or our forums so the tools should have docs in themselves - help buttons and other helper systems to give that unknown syntax if plugins of editors can't output correct syntax that should be cross browser compatible (with all versions of browsers including IE6) on all possible environments that moodle can be installed to. Still different people on these forums ask different questions about different things that we should have time and knowledge to give helpful and useful answers even if some features may not exist at all in core code ( like "How do I add asciimathml support to Chat module?" )

I have some notes in http://korpelainen.net/mediawiki and on my demo sites like http://korpelainen.net/plugindemo and http://korpelainen.net/gmoodle (AMgoogle.js) that I have set up to be able to TEST (and let others test) some plugins for direct input of maths - but they are not meant to be more a collection of "Look at me display my brilliance!"... see http://moodle.org/mod/forum/discuss.php?d=151651

These sripts may be useful or helpful for some (few) people who have that time and patience to develop the skills on their own. Who have time to study how to add new scripts to moodle. Who have time to learn the basic syntax of Latex (latexmathml is using a small subset of Latex syntax) or asciimathml to be able to use tools like tex filter or dragmath to be able to add even some basic maths to moodle - not to mention some more advanced but undocumented features like GRAPHS.

You could buy a book written by Ian Wild - Moodle1.9 Math ( http://moodle.org/mod/data/view.php?d=55&rid=3021 ) for those teachers that want to learn some basics of using maths in moodle 1.9 and explain to others how to use Equation editor of Word (or PowerPoint) to insert equations to docs and how to add links to those docs in moodledata or how to add attachmets to forum posts. Or try a commercial solution like Wiris - http://www.wiris.com/content/view/20/62/ - which is a pretty good set of tools for basic maths.

It is beyond my power to change the structure of www, standards of HTML and browsers that do not support online maths properly and unfortunately there are only a few open source tools that can be used to add maths and graphs to moodle.

In reply to Mauno Korpelainen

Re: Equations not inheriting font color in IE and Chrome

by Mauno Korpelainen -

And to make things simpler I have tried to use some of my time to create new plugins for moodle (primarely for future 2.0 and tinymce - check googletex plugin from Googletex in editor toolbar on my plugindemo editor, Colin ) that give teachers and students an editor plugin that has that color selection button that adds ready-to-use code to editor screen that shows that colored image as it will be displayed ion web pages...because those typical teachers and students can use images like http://chart.apis.google.com/chart?cht=tx&chco=ff0000&chf=bg,s,FFFFFF00&chl=%5CHeart even if the source/syntax of that red heart is rather complex looking

http://chart.apis.google.com/chart?cht=tx&chco=ff0000&chf=bg,s,FFFFFF00&chl=%5CHeart

Attachment heart.gif
In reply to Mauno Korpelainen

Re: Equations not inheriting font color in IE and Chrome

by Mauno Korpelainen -

In editor plugin there is a preview window on the right side of syntax - in actual editor screen the images or equations are shown as selectable and editable wysiwyg images which is much simpler than long unknown latex (or any other) syntax.

Attachment heart2.gif
In reply to Mauno Korpelainen

Re: Equations not inheriting font color in IE and Chrome

by Colin Fraser -
Picture of Documentation writers Picture of Testers
For starters, Muano, you are not "just a normal moodler". I am an ordinary Moodler, but you have the skill and patience to help a lot of people like me, who will often be frustrated by the obvious weaknesses of those systems we find useful. That makes you a little more than ordinary.

For me, I am not a maths teacher, I am actually an historian both by nature and by virtue of a degree, a bootmaker by trade and a teacher by accident. That means I will always be an ordinary everything - but that is my problem.

I wasn't aware that there was very little documentation about using any MathsML, but that explains why I cannot find any..sad . Even that is something, now I know I have to make it up as I go, something I have always found easy - the blind leading the clueless is a game I play very well..mixed

I have a break coming up soon, and perhaps I might even produce something useful. I was going to do something on the Windows documentation, but this might be more immediately useful - perhaps even for Moodle 2.0 as well. So whatever I do, even if it is unlikely to be useful, I am sure that someone else will be able to build on it and make it useful. At least, it will be more than nothing, not better maybe, but perhaps more...big grin


In reply to Mauno Korpelainen

Re: Equations not inheriting font color in IE and Chrome

by Tianna Tagami -
Thanks for all your help!

How would I, for example, show the fraction 1/2 and make the 1 green and the 2 blue?
In reply to Tianna Tagami

Re: Equations not inheriting font color in IE and Chrome

by Mauno Korpelainen -

Ah - good point!

With google chart api tex this is impossible because it can use only one color for one "chart image".

I think I also missed one thing - if you have a latex fallback renderer that can use color package with \usepackage[usenames]{color} you need to have this usepackage code somewhere in asciimathml script automatically added or need to add those tags yourself.

So obviously that previous code did not work and you should try

$\usepackage[usenames]{color}\frac{\textcolor{green}{1}}{\textcolor{blue}{2}}$

that should output

 http://korpelainen.net/cgi-bin/mathtex.cgi?\usepackage[usenames]{color}\frac{\textcolor{green}{1}}{\textcolor{blue}{2}}

with a "color capable" fallback renderer like in this case

var AMTcgiloc = "http://korpelainen.net/cgi-bin/mathtex.cgi?\\gammacorrection{1.4}";
var Gemcgiloc = "http://korpelainen.net/cgi-bin/mathtex.cgi?\\gammacorrection{1.4}";

I had not checked file AM1.js for a long time and the file on my server was using google chart api fallback so I changed it now to use my cgi mathtex fallback - ideally we could of course have different fallbacks for different special cases...

File http://korpelainen.net/plugindemo/lib/editor/common/AM1.js should not use google chart api fallback anymore - and in the future each renderer should have a little separate code for such "special cases" - if I just had that time to rewrite the code to support all of the most common renderers as far as features are supported by those renderers...

In reply to Mauno Korpelainen

Re: Equations not inheriting font color in IE and Chrome

by Mauno Korpelainen -

One more note: this \gammacorrection{1.4} at the end of fallback renderers is not necessary and has nothing to do with colors - I have used it only to make normal output of mathtex gif images a little softer.

However there is no big difference between

http://korpelainen.net/cgi-bin/mathtex.cgi?\gammacorrection{1.4}\usepackage[usenames]{color}\frac{\textcolor{green}{1}}{\textcolor{blue}{2}} (using gammacorrection 1.4) and http://korpelainen.net/cgi-bin/mathtex.cgi?\usepackage[usenames]{color}\frac{\textcolor{green}{1}}{\textcolor{blue}{2}} (no gammacorrection tag)

In reply to Mauno Korpelainen

Re: Equations not inheriting font color in IE and Chrome

by Tianna Tagami -
I apologize, but I need some hand-holding with all of this. So, to get this to work in my pages, I need to replace my AM1.js file with this one:
http://korpelainen.net/plugindemo/lib/editor/common/AM1.js

Then use this in my page:
$\usepackage[usenames]{color}\frac{\textcolor{green}{1}}{\textcolor{blue}{2}}$

Do I need to replace "usepackage" or "usenames" with anything? Or just place the code in as is?

Thanks!
In reply to Tianna Tagami

Re: Equations not inheriting font color in IE and Chrome

by Tianna Tagami -
That actually worked even in the browsers without MathML. So apparently, that's changing the color even in the image fallback!

Only, it doesn't appear to take Hexadecimal colors. What color format(s) should work with this code?
In reply to Tianna Tagami

Re: Equations not inheriting font color in IE and Chrome

by Mauno Korpelainen -

Correct.

\usepackage[usenames]{color} is standard latex expression which tells the renderer to use latex package "color" with all available color names (68 standard color names known to dvips are listed in that script).

Copy or link the script to your site (theme) and test that tag

$\usepackage[usenames]{color}\frac{\textcolor{green}{1}}{\textcolor{blue}{2}}$

It works both with image fallback and with mathML in FF.

In reply to Mauno Korpelainen

Re: Equations not inheriting font color in IE and Chrome

by Tianna Tagami -
Where can I find an explanation of this syntax so I can use it with my other equations that are not appearing as I formatted them with the image fallback?

Also, two more questions on this code you gave me:
$\usepackage[usenames]{color}\frac{\textcolor{green}{1}}{\textcolor{blue}{2}}$

How do I make this bold?

And, how do I use it to make a fraction that is all the same color? I tried:
$\usepackage[usenames]{color}\frac{\textcolor{blue}{3}{4}}$

to make 3/4 all blue, but that didn't work.

Thanks! You are such a big help!
In reply to Tianna Tagami

Re: Equations not inheriting font color in IE and Chrome

by Mauno Korpelainen -

If you login to my test site http://korpelainen.net/plugindemo with username test and password test you can see some examples and http://korpelainen.net/mediawiki has some more info about available AsciimathML, latexMathML and Latex tags - note that LatexMathML is using only those latex symbols that are included to the script itself (LMsymbols) and asciimathml can use only AMsymbols...+ some extra features defined in those script.

I just noticed that I must add the script to Mediawiki since after upgrading my server I have forgotten to update theme of mediawiki. (Edit: Mediawiki now upgraded)

With forced fallback between double @:s it is possible to force also FF use latex symbol with fallback renderer and in my case it's using Texlive 2007 full package so it is possible to show many, many more symbls than just those named in the script - but images are always rendered with worse quality than mathML in FF.

All of the examples in http://korpelainen.net/mediawiki/index.php/LaTeX do not work in LatexmathML but most of them do work in latex.

$\usepackage[usenames]{color}\mathbf{\frac{\textcolor{green}{1}}{\textcolor{blue}{2}}}$

gives bold font and http://korpelainen.net/cgi-bin/mathtex.cgi?\usepackage[usenames]{color}\mathbf{\frac{\textcolor{green}{1}}{\textcolor{blue}{2}}}

In reply to Tianna Tagami

Re: Equations not inheriting font color in IE and Chrome

by Mauno Korpelainen -

For Latex http://www.ctan.org/tex-archive/info/symbols/comprehensive/symbols-a4.pdf has a huge number of symbols but even full Tex live package has not implemented all of them (I have not installed all extra packages)

If you want to have it all blue use for example

$\usepackage[usenames]{color}\textcolor{blue}{\frac{3}{4}}$

that gives http://korpelainen.net/cgi-bin/mathtex.cgi?\usepackage[usenames]{color}\textcolor{blue}{\frac{3}{4}} (be careful with brackets...)

In reply to Mauno Korpelainen

Re: Equations not inheriting font color in IE and Chrome

by Tianna Tagami -
Is there a way to control the font face the image fallback uses?
In reply to Tianna Tagami

Re: Equations not inheriting font color in IE and Chrome

by Mauno Korpelainen -

Sure, see http://moodle.org/mod/forum/discuss.php?d=152292

With \usepackage you can use any such packages that are installed to the fallback server. For example \usepackage[T1]{fontenc}\usepackage{euler} changes font face to Euler font and you can control the size of font with \dpi or \density:

Using the same example I had in that linked post now from Forkost server:

http://www.forkosh.dreamhost.com/mathtex.cgi?\usepackage[T1]{fontenc}\usepackage{euler}\dpi{300}%20f%28x%29=\displaystyle\int\limits_{-N}^{N}e^{x}dx,\;%20\forall%20x\epsilon%20\mathbb%20R

And then we have of course different typefaces:

http://korpelainen.net/mediawiki/index.php/Alphabets_and_typefaces

In reply to Mauno Korpelainen

Re: Equations not inheriting font color in IE and Chrome

by Tianna Tagami -
What is wrong with this:

$\usepackage[T1]{fontenc}\usepackage{verdana}\usepackage[usenames]{color}\mathbf{\textcolor{Blue}{\frac{k}{-6} - 4}$
In reply to Tianna Tagami

Re: Equations not inheriting font color in IE and Chrome

by Mauno Korpelainen -

3 tiny things:

1) Don't use dollars - use GeM:s - because \usepackage and font commands are not supported by latexmathml

2) \mathbf {... is not closed with }

3) A latex package called verdana may not be installed by default and may not support maths - use some other packages that support math, for example

GeM \usepackage[T1]{fontenc}\usepackage{arev}\usepackage[usenames]{color}\mathbf{\textcolor{Blue}{\frac{k}{-6}-4}} GeM

http://www.forkosh.dreamhost.com/mathtex.cgi?\usepackage[T1]{fontenc}\usepackage{arev}\usepackage[usenames]{color}\mathbf{\textcolor{Blue}{\frac{k}{-6}-4}}

In reply to Mauno Korpelainen

Re: Equations not inheriting font color in IE and Chrome

by Tianna Tagami -
I was trying to get the equations to match the font of the surrounding text, which is Verdana.
In reply to Tianna Tagami

Re: Equations not inheriting font color in IE and Chrome

by Mauno Korpelainen -

Verdana is one of those Microsoft fonts that is not by default installed to any distribution of latex. It can be separately installed as an extra package but my fallback server does not support it and probably none of those public servers do.

I made the following test using cmbright font and it is almost like Verdana - see the image attached to the bottom of this post:

This is cmbright
GeM \usepackage[T1]{fontenc}\usepackage{cmbright}\mathrm{\frac{d}{dx}f(x)=\lim_{h\to 0}\frac{f(x+h)-f(x)}{h}} GeM
ABCDEFGHIJKLMNOPQRSTUVWX
GeM \usepackage[T1]{fontenc}\usepackage{cmbright}\mathrm{ABCDEFGHIJKLMNOPQRSTUVWX} GeM
abcdefghijklmnopqrstuvwx
GeM \usepackage[T1]{fontenc}\usepackage{cmbright}\mathrm{abcdefghijklmnopqrstuvwx} GeM

It also looks like using those elsewhere mentioned "public mathtex servers" have limitations either in usage or available packages but you can also use img tags with editor image plugin without any scripts - for example adding the following to image plugin address bar with alignment to middle

http://korpelainen.net/cgi-bin/mathtex.cgi?\gammacorrection{1.4}\usepackage[T1]{fontenc}\usepackage{cmbright}\mathrm{\frac{d}{dx}f(x)=\lim_{h\to0}\frac{f(x+h)-f(x)}{h}}

gives  http://korpelainen.net/cgi-bin/mathtex.cgi?\gammacorrection{1.4}\usepackage[T1]{fontenc}\usepackage{cmbright}\mathrm{\frac{d}{dx}f(x)=\lim_{h\to0}\frac{f(x+h)-f(x)}{h}}

The good point in using simple image tags is that then maths work even if javascript is disabled in browser - the bad thing is that adding those long latex strings is a pain and you need to find a site or fallback server that outputs correct code.

If you have Microsoft Office and Word or PowerPoint you can as well use Equation Editor there and change the default font of your equation in Equation editor to Verdana - and once you have done a full document with Word upload the doc to files of moodle or save it as a html document. Word will save the equations as images to a subfolder of that html document and you can move the html page together with subfolders and gif images to moodle...if you zip them you can upload just the zipped file and unzip it to course files in moodle...hopefully - I have not tested how well it works anyway wink

Attachment cmbright.gif
In reply to Tianna Tagami

Re: Equations not inheriting font color in IE and Chrome

by Mauno Korpelainen -

In your case it might be reasonable to test for example

http://www.codecogs.com/components/eqneditor/editor.php

You can change font face and size(a couple of choices) and use most common latex tags with an online editor and finally copy the images or image tags (use mouse right click - properties over image to get the address) to moodle and editor image plugin address bar.

For example  http://latex.codecogs.com/gif.latex?\fn_jvn \80dpi \frac{d}{dx}f(x)=\lim_{h\to0}\frac{f(x+h)-f(x)}{h} with

Attachment codego.gif
In reply to Mauno Korpelainen

Re: Equations not inheriting font color in IE and Chrome

by Mauno Korpelainen -

Yet - codecogs editor supports Verdana and a couple of colors like \textcolor{blue} or \textcolor{green} like this http://latex.codecogs.com/gif.latex?\fn_jvn%20\frac{\textcolor{green}{1}}{\textcolor{blue}{2}} but it does not support use of different latex packages in common and for example does not support for example cancel...

So what ever you do there are always "buts" - world wide web was never desined to support maths online (for all users, browsers, environments and different needs...). Hopefully we have some fully functional standard open source math type setting system some day (2050?) but today there are just a handful of partly functional workarounds available... wink