No srsly not having regression tests sucks every time anything changes ever

when you type \nthroot{n}{m}, mathquill correctly generates the latex \sqrt[n]{m}. however, it doesn't properly handle things in the other direction. i.e. if you do a mathquill('write', '\\sqrt[n]{m}'), you get garbage html and latex. this is because it doesn't know that it should actually map to an NthRoot command... it just generates a SquareRoot with \left[\right] as its argument, and everything else as trailing garbage

i think i've found a pretty clean way to make this work, i'll push it to my fork shortly

According to Joel Spolsky, even a one-person, one-file project needs some kind of bug tracking that's not in the programmers head, a text file at the very least. Just now I was thinking "Hm! With this commit I don't think there are any outstanding bugs! ...as far as I can remember." Which is exactly the problem -- I don't remember. Better start learning how to use this.

it looks like there are a couple problems around matrices:

1. when you create a vector in mathquill, the generated latex cannot actually be parsed by mathquill. e.g. typing \vectorab gives you the latex \begin{matrix}a\b\end{matrix}. when you try to write that to mathquill, the rendered latex in mathquill just looks like begin{matrix.
2. it would be good to support matrices fully (columns and rows). as a workaround you can create a vector and try to separate elements on with spaces, but that breaks down when things have different widths. e.g. we should be able to do stuff like this: http://latex.codecogs.com/gif.latex?\begin{matrix}a+1&b\\c&d\end{matrix}

if you type \nthroot then give it an exponent of 3 (so cube root) and then, in the body of the nthroot, backspace, the 3 becomes unremovable.

Currently when you select something and type a command like ^, the selection is cleared and the cursor is prepended to the first block of the new command. This should be changed to not clear the selection, so the same thing is selected, it's just the selection is now in the new command.

Currently things like square roots and brackets are just text. The problem is when they grow big they scale in 2 dimensions.

Try this:

1. Go to the demo
2. Type a [
3. Type \vector
4. Put a few elements in the vector.
5. Notice how ugly the giant bracket looks.

A solution for square brackets is easy. Simply add logic in the Bracket constructor so that no text is drawn for square brackets, instead a bracket-open or bracket-close class is added. The open-bracket class can look like this:
.mathquill-rendered-math .open-bracket{ border-left:3px solid; border-top:3px solid; border-bottom:3px solid; margin:-3px; }

So what looks like a bracket is really just a three side border. In the Redraw function the width and height of the bracket can be changed and it will scale nicely. I've implemented this is a MathQuill copy I have laying around, but my copy is substantially changed, with a different font and a lot of the features pared down, so I can't say what the original would need to change, but I think something like this would be good.

The next problem is figuring out what to do with parentheses, curly braces, square roots, etc.

int is a reserved word. It works in most browsers, but gives an error in minifiers and stuff. A simple fix.

Tell RootMathBlock::renderLatex where to put the cursor after rendering the LaTeX.

Like #32 .mathquill('write', latex), depends on figuring out how to abstract Cursor::writeLatex to work with textboxes in addition to editable math boxes.

There's a weird issue affecting the display of nth-roots in Chrome and Firefox 3:

• Type "\nthroot" "3" [TAB] "27" [TAB] [SHIFT + LEFT] -- to create the cube-root of 27, then immediately select it using the keyboard
• The cube root that was just created should be selected, but it appears as though it is being word-wrapped inside its containing element.
• Selecting using the mouse also causes the issue
• Deselecting the root fixes the display. If more than just the root is selected, the display bug also goes away.
• Using $('span').mathquill('latex') on a <span>\nthroot3{27}</span> will also induce the display bug, which is how we initially discovered it.
• Affects Chrome and Firefox 3, Mac and Windows platforms. IE8 was not affected.

Maybe it's just the way that I think of the math when I type, but this is a problem I have:

I type - b \pm \sqrt tab b ^ 2 tab - 4 a c tab /
When I hit divide, it only includes the square root term and not the -b term. That is expected because of order of operations, but still. The solutions I see are a) Use the keyboard or mouse to select the whole thing, then hit divide, or b) use \frac.

What I have a habit of doing is typing parentheses. Unfortunately, those are impossible to type after the fact without selecting the whole thing, because they are always generated in pairs that are empty. It would be nice if, for example:

\frac tab 3 tab 5 )

Would result in the parentheses surrounding 5, rather than generating a new empty set of parentheses. Likewise, a start parentheses in front of something already typed would surround it with parentheses.

I think this change would help a lot in making this more usable. Thanks!

Hello,

how can I enter 1/2;1/3 ? If I try, the result is : http://latex.codecogs.com/gif.latex?%5Cfrac%7B%5Cfrac%7B1%7D%7B2%7D%3B1%7D%7B3%7D

Thanks,
Vincent

Following applies for most mathematical symbols. (\cdots, \longrightarrow, etc.) I will use \slash as an example.

Since '/'-character is interpreted as \frac{}{}, writing $a/b$ must be done as $a\slash b$. However, the space after '\slash' is missing and hence I get $a\slashb$. '\slashb' is not LaTeX-command and ends up as '\text{slashb}'.

Steps to reproduce:

1. Go to demo page: http://laughinghan.github.com/mathquill/demo.html
2. In 'MathQuill editable math:' input: a\slash [space] b
3. MathQuill shows that as 'a/b', but 'Latex source:' has text: 'a\slashb'
4. Go to 'Latex source'-textbox and add space after the text. => MathQuill-box shows now: 'aslashb' with 'slashb' as text.
5. Click on MathQuill-box and move with cursor. => Latex source -box updates to: 'a\text{slashb}'

Fix suggestion:
Add a space after \slash (and other similar commands) as is done for example with \cdot

I am creating a strictly HTML WYSIWYG, where a user can click on a symbol, from a menu, and it is written to the textarea, using mathquill.js, where they can modify it. (This is so a user does not have to know all the Latax syntax). I found that certain symbols do not display... eg. bigtriangleup, dagger (just to name a few.) Is this a bug? or Do I have to do something else to get certain symbols to display? I am trying to make a wysiwyg, that does not need to use images. If this is not the proper place to post, I appologize. Mathquill is awesome btw.

When lines get too long, the math should shrink or, if it gets too small to scale any smaller, wrap in a sensical way.

To reproduce: x ^2 <right> _ 1 <left> <left>

Now the cursor is between the ^2 and the _1, but it shows after both of them. Ideally, the cursor should skip over the space between a subscript and superscript and go directly from the left of the subscript to the right of the superscript.

There doesn't seem to be a way to bold text (e.g. to denote vectors or matrices).

There also doesn't seem to be a way to get at other typefaces besides Roman (\text). Talking about e.g. \mathcal.

Lastly, isn't \mathrm recommended over \text?

Text element inside denominator of \frac-element puts an extra } each time the formula is rendered.

Steps to reproduce:

1. Go to demo page: http://laughinghan.github.com/mathquill/demo.html
2. In first MathQuill-box write: '1/$a'
3. In Latex source it shows: '\frac{1}{\text{a}}'
4. In Latex source -box add a space in the end. Now Latex box has: '\frac{1}{\text{a}} ', but the denominator in MathQuill-box is 'a}'

Fix suggestion:
In cursor.js in _.writeLatex(), adding one '}' into a regexp, seems to fix this.
Change line:

latex = ( latex && latex.match(/\\text\{([^{]|\\\{)*\}|\\[a-z]*|[^\s]/ig) ) || 0;

to:

latex = ( latex && latex.match(/\\text\{([^{}]|\\\{)*\}|\\[a-z]*|[^\s]/ig) ) || 0;

sin should get autocorrected to \sin and so on

"although your demo seems to work in IE8 over the web,
my local copy seems to have display issues.
Not sure, but are you using a diff. version of the CSS on the web, versus the copy checked in?

i.e. The edit box, gets really wide and wraps, and the edit blue highlighting does not display.
Works fine in Firefox, Chrome and Safari."

"if I copy the your demo code, down locally, the edit box is messed up, in IE.
Its definitely a CSS issue. If I figure it out, I'll let you know"

-- Gene Aiello [email protected]

To reproduce:
Type ( \vector 1 <enter> 2 <enter> 3 <right> ) ^ 2 _ 1

The superscript should be aligned to the top and the subscript should be aligned to the bottom.

Solution: Mark elements that are tall with a class and use a bunch of adjacent sibling selectors. I've implemented a fix in my fork.
http://russellsprouts.github.com/demo.html
It still has issues with selections though. (Try selecting only the *-scripts after a large element).

Current Behavior:

In IE8, on the MathQuill demo page where it says "LaTeX math can also have textboxes inside", if you type a fraction, a radical in its denominator, and a fraction in that radical, the text can overflow the bounding box until you move the cursor.

If you try it in the MathQuill Textbox above that, it hides the overflow.
If you try it beside "MathQuill editable math:" box, it works normally.
If you try it in Chrome, it works normally.

Steps to Repeat:

1. Open up http://laughinghan.github.com/mathquill/demo.html in IE8
2. Click on the bottom empty text box
3. Hit the keys: 1 / \sqrt ENTER 1 / 2
4. Verify the text has overflowed the box
5. Press the up arrow, and notice how the formatting is corrected

Darned.

good lib.
Ctr+C is not working or working incorrect
after copy \frac{1}{2} i have \frac{\frac{1}{2}}{\left{1\right}\left{2\right}}

So to type ^ on in this layout, you press the ^-key (our "[" key) then press space.

When you press x^ 2 it generates this:
<var>x</var><span>^2</span>
instead of the superscript.

Using Snow Leopard 10.6.7, Safari, French-Canadian-CSA keyboard layout.

Thanks to Christian who reported this issue to me.

In Gecko browsers, commands like Ctrl+L (focus on the location bar) trigger keypress, which sets a timeout for textInput which will check to see if text has been entered into the textarea by the command. If there is text selected, it will be in the textarea then and will be interpreted as text entry. We deal with this in Cut/Copy/Paste, that is, Ctrl+X/C/V, by setting a flag to skip textInput when the cut/copy/paste events are triggered, but we can't ignore every Ctrl+Key press because on some keyboards text entry actually requires Ctrl or Cmd (see #11).

Possible solutions:

• onkeypress, clear the textarea, restore in the cut or copy handlers
• instead of root.selectionChanged, set and select the text in the textarea in the cut and copy handlers
  • breaks cut and copy in browsers that don't support the cut/copy/paste events (e.g. Opera), currently only paste doesn't work
    • (though I guess the previous option would also break cut and copy in browsers that also trigger keypress, if there are any)

Accidental deletion etc. should be undo-able. Must support both undo and redo and both Command/Ctrl-Y as well as Shift-Command/Ctrl-Z.

Currently dragging with the mouse selects the text, which is very ugly when copy/pasted. The only way to use the fake but "smart" selections that let you write commands and stuff is shift+left or right arrow keys. Need to figure out a way to detect when you drag with the mouse and create our much more useful fake selection.

Initial latex code (written between span tags) doesn't be shown on textarea mode.
Exm: <span class="mathquill-textbox">\frac{1}{2\sqrt{x}}</span>

sup and sub should go above and below \sum, \prod and \coprod etc, like \displaystyle LaTeX

there's a rare race condition around keypress events and the setTimeout(textInput) call that extracts characters from the textarea.

even though the timeout is zero (meaning it will run as immediately as possible), you can potentially queue up another keypress before the setTimeout for the first keypress gets kicked off. so the second keypress' event handlers run before the textInput call does, and you end up with two characters in the textarea. so for example, if those happen to be a valid command, you get that instead of the two variables you actually wanted.

some weird things i've seen:

• in -> \in
• \sin -> \s\in

this is definitely easier to repro on a slower machine/browser, and the key is to press both keys pretty much simultaneously (even then, you'll be lucky to repro 10% of the time). you can artificially create those slow conditions by putting a long running for loop right before the setTimeout (or just giving it a timeout > 0). i've been able to repro this on the demo page in firefox and chrome

i think changing textInput() to call cursor.parent.textInput() on each individual character rather than the whole string should fix this, though there may be a better way

Use CSS3 Speech to pronounce math DOM according to http://people.rit.edu/easi/easisem/talkmath.htm

EDIT: Dead link, but mirror-ish-ed at http://accessinghigherground.org/handouts2013/HTCTU%20Alt%20Format%20Manuals/Math%20Accommodations/07%20MATHSPEAK.pdf, also archived at https://web.archive.org/web/20131014070811/http://people.rit.edu/easi/easisem/talkmath.htm

thanks to \editable{}, it turns out mousedown/move/up, cut, copy and paste need to be virtual events that bubble and can be cancelled in the virtual DOM. Currently propagation is stopped in the HTML DOM as the simplest solution, but ideally the fake MathQuill textboxes would emit the same events a normal textbox would, and MathQuill would never stop the propagation of any events.

also return false would be equivalent to e.stopPropagation(), but only in the virtual DOM, and to prevent default the handler would have to call e.preventDefault(), even if they returned false.

Proposal:

//usage: jQ.keyup(function(e){ cmd.trigger(e.type, e); });
MathElement::trigger = function(eventType, eventObj) {
  for (var ancestor = this; ancestor; ancestor = ancestor.parent) {
    var handler = ancestor[eventType];
    if (handler && handler(eventObj) === false) break;
  }
};

and possibly:

function delegateTo(cmd) { return function(e) { cmd.trigger(e.type, e); }; } 
//usage: jQ.keyup(delegateTo(cmd));
// random wacky idea

In Opera, our MathQuill-Editable's and MathQuill-Textboxes are not in the tab order.

In Chrome, when you tab to one of our fields, the first character you type is ignored. (?!)

(Note that neither of these issues are present in Firefox.)

i am playing with the lib.

on the demo page
$("#editable-math").mathquill("redraw")
TypeError: this.find(":not(:has(:first))").data(d) is undefined
[Break On This Error] Failed to load source for: http://laug....github.com/mathquill/mathquill.min.js

Automated fuzz tester, based on QuickCheck for Haskell: https://bitbucket.org/darrint/qc.js/

Hi Guys!

I'm working at an educational company, and we really love what you're doing with MathQuill. I've been digging around in the codebase for a few days, and I noticed that around line 102 in rootelements.js, you use:

}).bind('selectstart.mathquill', false ).blur();

This notation is not available until jQuery 1.4.3, though the MathQuill homepage says you can use jQuery 1.4+

Joe

It's a rather minor bug, but I thought it would be good to note down.

Test

• http://laughinghan.github.com/mathquill/demo.html
• Enter y=a b (that is, y "equals" a "space" b) into the field "Mathquill editable math"
• Observe that the latex source is y=a:b
• Modify latex source to y=a:b:c
• Observe that the field "Mathquill editable math" now prints y=a:b:c, whereas it is expected to display y=a b c

all the mouse event handlers don't get attached to latex-rendered-math

From Han's and my etherpad discussion:

Currently, Cursor is the hand of god that manipulates the hapless tree of commands and blocks. Root elements call Cursor::write() with text input, resulting in the same writing behavior always, except for hacks. What it will be, is cursor is merely a position in the tree, like Selection and MathFragments, and environments, like RootMathElement, on textInput, create a new command based on the text input and call cmd.insertAt(this.cursor) on the new command, so there's no ugly skeleton like the current Cursor::insertNew(). MathCommand::insertAt(...) can be overridden, so for example LiveFraction and Choose will no longer be so hacky.

This functionality was present in the old LatexLive, MathQuill must implement this.

The javascript seems to hand when \text{ is entered.

Hello,

I've 2 problems : I've a mathquill-textbox to ask user to enter a text. I record the .mathquill('latex') on the serveur. (exemple : "Un try ${\frac{1}{2}}" . It works !). which is not the good syntax, so when I want to display later the content in a mathquill-textbox it don't word.

Other question : is it possible to display a non-editable mathquill-textbox, just to display the formula ?

Thanks

In #4 @RussellSprouts mentioned rangy, which looks really useful for this.

If the latex input has "less than or equal" or "greater than or equal" signs, i.e., \leq or \geq, the .mathquill('latex') returns incorrectly \le and \ge . (missing 'q')

Input:

jQuery('<span class="mathquill-editable">$\\leq , \\geq$</span>').mathquill().mathquill('latex')

Output:

$\le,\ge$

Rendering \mathbb{R} (and N, Z, C, Q, ...) fails.

Steps to reproduce:

1. Go to demo page: http://laughinghan.github.com/mathquill/demo.html
2. In mathquill-box enter: \R
3. This is rendered as ℝ and latex source shows: "\mathbb{R}
4. In Latex source -box add a space in the end. Mathquill-box shows now: "mathbb{R" in text-mode.
5. In Mathquill-box move cursor. Latex source shows: "\text{mathbb}{R"

Additionally, anything after \R is not shown at all.

Hello,
At first congratulations for this wonderfull code. I was looking for a such component since a long time. I'm a french math teacher (So excuse my bad english) and I'll use it in my web page for my students.

It 'd be great to have shorcuts (ex : CTRL+R or ALT+R for \sqrt ....). And if the list of specials keys could be in an external (editable) file, it will be better

At the time, is it possible to have a function like insert(id,what) which insert the text "what" at the cursor place in span "id".

Thanks a lot !
Vincent

Command \deg is a shorthand for ^\circ. However mathquill does not parse ^\command correctly.

Steps to reproduce:

1. Go to demo page: http://laughinghan.github.com/mathquill/demo.html
2. In mathquill-box enter: a\deg<space>. This renders as a°
3. In Latex source -box add a space in the end. Mathquill-box shows now: a^\circ

If degree is written as a^{\circ}, everything works fine. The symbol is however different. Instead of degree symbol ° (as a°) it uses the symbol ∘ in superscript (as a^∘). And the superscript can be edited.

Same problem is with any latex with only one command in superscript without curly brackets. For example a^\beta. With them there is not such problem, since a^{\beta}can be used, but maybe a^\beta should be normalized to a^{\beta}.

If you type ((a_n x^n))) in Opera, moving the cursor in and out of the super and subscripted n's causes noticable changing of vertical alignment of outer parens.

Will update when test cases for WebKit and Gecko are found.