Commit Graph

44 Commits

Author SHA1 Message Date
Emily Eisenberg
0be77d4e6f Add style changing functions
Summary:
Add \displaystyle, \textstyle, \scriptstyle, and \scriptscriptstyle commands.
Added tests and huxley screenshots for everything that looks different in
displaystyle vs normal style.

Fixes #24.

Test Plan:
 - See new tests work, and old tests still work
 - See no huxley screenshots changed, and new screenshot looks good

Reviewers: alpert

Reviewed By: alpert

Differential Revision: http://phabricator.khanacademy.org/D13079
2014-09-10 17:10:38 -07:00
Emily Eisenberg
a76f6eb985 Make all the lines the correct sizes
Fix the \frac and \overline lines so they actually render at the correct sizes
(i.e. don't get smaller when in script and scriptscript sizes). This also seems
to fix #33.

Test Plan:
 - Make sure new huxley screenshot look good.
 - Render
     \frac{1}{\Bigl(\sqrt{\phi \sqrt{5}}-\phi\Bigr) e^{\frac25 \pi}} =
     1+\frac{e^{-2\pi}} {1+\frac{e^{-4\pi}} {1+\frac{e^{-6\pi}}
     {1+\frac{e^{-8\pi}} {1+...} } } }
   at small font sizes like 30pt and smaller, see that it looks much better

Auditors: alpert
2014-09-10 16:30:38 -07:00
Emily Eisenberg
0c9e9738c3 Fix our parsing strategy so it is the same as (or very similar to) TeX's
Summary:
Rewrote the parser to make this work, and added a bunch of tests to make sure
this does work. In the process, refactored all of our functions into a separate
file, functions.js. Added a bunch of comments to Parser.js. Also, update jasmine
so we can make our tests better, and add a lint_blacklist.txt to not lint bad
jasmine stuff.

Fixes #10
Fixes #12

Test Plan:
- Make sure all of the tests still work, and all of the new ones work also
- Make sure huxley screenshots didn't change

Reviewers: alpert

Reviewed By: alpert

Differential Revision: http://phabricator.khanacademy.org/D12989
2014-09-09 23:18:37 -07:00
Emily Eisenberg
925c96dbe2 Add square roots (\sqrt)
Summary:
Follow the TeXbook instructions on how to construct square roots. Using
makeCustomSizedDelim, this becomes nearly trivial.

Test Plan:
 - Make sure normal tests work
 - Make sure the new huxley test looks good, and other huxley tests haven't changed.

Reviewers: alpert

Reviewed By: alpert

Differential Revision: http://phabricator.khanacademy.org/D12918
2014-09-06 15:08:23 -07:00
Emily Eisenberg
c3f758c319 Add support for \left and \right
Summary:
Added stacked delimiter support for more delimiters. Split out delimiter
functions into its own file, and split out some tree building functions into a
common file. Supports the empty `.` delimiter with \left and \right, and doesn't
try to produce huge /, \backslash, <, or > delimiters. Depends on D7844

Test input:

\left( \left) \left[ \left\lbrack \left] \left\rbrack \left\{ \left\lbrace
\left\} \left\rbrace \left\lfloor \left\rfloor \left\lceil \left\rceil
\left\langle \left\rangle \left/ \left\backslash \left| \left\vert \left\|
\left\Vert \left\uparrow \left\Uparrow \left\downarrow \left\Downarrow
\left\updownarrow \left\Updownarrow {x^{x^{x^{x^{x^{x^{x^{x^{x^{x^x}}}}}}}}}}
\right.\right.\right.\right.\right.\right.\right.\right.\right.\right.
\right.\right.\right.\right.\right.\right.\right.\right.\right.\right.
\right.\right.\right.\right.\right.\right.\right.\right.

Test Plan:
 - Run the test input, see that it works
 - Run the tests, see that they work
 - Look at huxley screenshots (not here yet :( ) and make sure they look good

Reviewers: alpert

Reviewed By: alpert

Differential Revision: http://phabricator.khanacademy.org/D11602
2014-09-04 21:58:43 -07:00
Emily Eisenberg
eb31c6880b Make \rules work in script and scriptscript sizes
Auditors: alpert
2014-08-30 22:41:32 -07:00
Emily Eisenberg
f17bbf1b05 Add the '\rule' command for drawing boxes
Summary:
Supports the 'ex' and 'em' units for sizes. Doesn't support the optional depth
argument.

Test Plan:
 - See that the huxley test looks good, and nothing else changed
 - See that the tests pass

Reviewers: alpert

Reviewed By: alpert

Differential Revision: http://phabricator.khanacademy.org/D12777
2014-08-29 14:45:27 -07:00
Ben Alpert
a75bf1afc2 Add \scriptspace after superscripts and subscripts
Summary: Plain TeX assigns `\scriptspace=0.5pt`, which is used in Rules 18bcd in the TeXbook's Appendix G.

Test Plan:
- Look at `x^{x^{x_{x_{x_{x_x}}}}}\biggr|`, see a gap that looks similar to the one produced by real TeX.
- Look at the huxley tests, see that they look reasonable. Make sure that all changes to other huxley tests are now correct, and only changed because of this.

Reviewers: emily

Reviewed By: emily

Subscribers: jessie

Differential Revision: http://phabricator.khanacademy.org/D12763
2014-08-29 12:28:43 -07:00
Emily Eisenberg
04f13b9be8 Fix font sizing issues
Summary:
In LaTeX, large delimiters are the same font size as they are at a normal size,
regardless of the actual size. This means that we need to scale up the font size
in the inner nodes, which is annoying because we run into the same problem we
had with \Huge, etc in those nodes. Thus, this fixes both problems at once.

The problem was that when we used our baseline-align-hack and then increased the
font size inside of one of the middle (display: block and height: 0) nodes, the
node with the increased font size would shift downards (misaligning its
baseline). To fix this, we add a method for calculating the maximum font size
used in each of the nodes, and adding a small node with this font size to each
of the other nodes (including the fix-ie node). This shifts all of the nodes
down the same amount, and gets their baselines aligned.

Test Plan:
 - Do dumb things by putting \Huge and \big in places they shouldn't be, and
   make sure they behave responsibly
 - Do the same thing in IE 8, 9, 10, 11, Safari, Firefox, and make sure they all
   behave the same (to some approximation)
 - Make sure the new huxley image looks good, and the images that changed don't
   have significant changes

Reviewers: alpert

Reviewed By: alpert

Differential Revision: http://phabricator.khanacademy.org/D12684
2014-08-27 01:12:15 -07:00
Emily Eisenberg
ad97dab19c Update fonts from MathJax
Summary:
Also, rename all of our uses of fonts to use the uppercased versions. We want to
use the uppercase versions because it makes updating and modifying the fonts
much easier (since the font names inside the actual font files are uppercased).

Test Plan:
  - Make sure the huxley screenshots look good (You can compare a diff of them
    on github at
    f90d093361
    By my eye, it seems like some things have moved up ~1/2 pixel, and some of
    the fonts have maybe slightly changed shape, like the large `b` in
    SizingBaseline)

Reviewers: alpert

Reviewed By: alpert

Differential Revision: http://phabricator.khanacademy.org/D11979
2014-08-06 17:52:26 -07:00
Emily Eisenberg
fe6b67817c Add support for \overline
Summary:
Follow the instructions in the TeX book for drawing \overlines. This uses the
same code as fractions to produce the bars. Also added the ability to cramp
styles (i.e. T -> T' and T' -> T').

Test Plan:
 - Look at `\overline{x}`, `\overline{\dfrac{x}{y}+z}`, and
   `\blue{\overline{x}}` to make sure they look good.
 - Make sure the tests work
 - Make sure the huxley tests look good (Not here yet :( )

Reviewers: alpert

Reviewed By: alpert

Differential Revision: http://phabricator.khanacademy.org/D11604
2014-08-05 17:48:10 -07:00
Emily Eisenberg
100798847b Add delimiter sizing
Summary:
Make delimiter sizing work. This involved
 - Adding the symbols for the remaining delimiters (like `\lfloor` and `\{`)
 - Adding metrics for the size1, size2, size3, and size4 fonts
 - Parsing delimiter sizing functions
 - Using the big fonts when possible, otherwise building large copies of the
   delimiters from scratch

Test Plan:
 - See that
   `\bigl\uparrow\Bigl\downarrow\biggl\updownarrow\Biggl\Uparrow
    \Biggr\Downarrow\biggr\Updownarrow\bigm/\Bigm\backslash\biggm|
    \Biggm|\big\lceil\Big\rceil\bigg\langle\Bigg\rangle\bigl(\Bigl)
    \biggl[\Biggl]\Biggr\{\biggr\}\Bigr\lfloor\bigr\rfloor`
   parses correctly (this contains all of the delimiters, and all of the sizing
   modes)
 - See that the huxley tests didn't change, and the new one looks good
 - See the normal tests work

Reviewers: alpert

Reviewed By: alpert

Differential Revision: http://phabricator.khanacademy.org/D7844
2014-08-05 16:43:43 -07:00
Emily Eisenberg
02935f7dde Add an 'implicit group' parser, use with sizing
Summary:
Implicit groups are objects that act like groups but don't have brackets around
them. This is used for things like sizing functions or font-change functions
that can occur in the middle of the group, but act like they apply to a group
after them which stops when the current group stops. E.g. `Hello {world \Large
hello} world` produces normal, normal, Large, normal text. (Note, I just came up
with the name implicit group, I don't think this is actually how it is parsed in
LaTeX but it fits nicely with the current parsing scheme and seems to work
well).

For now, apply this to the sizing functions (we don't have any other functions
that act like this). Also note that this doesn't really do much practically
because we limit sizing functions to only be on the top level of the expression,
but it does let people do `\Large x` and get a large `x`, without having to add
braces.

Test Plan:
 - Run the tests, see they work
 - Make sure `abc \Large abc` looks correct

Reviewers: alpert

Reviewed By: alpert

Differential Revision: http://phabricator.khanacademy.org/D10876
2014-07-10 16:06:19 -07:00
Emily Eisenberg
16b79a2a42 Fix the struts in IE9
Summary:
For some reason, `vertical-align: top` doesn't work in IE9, or at least doesn't
work the same as in any other browser (I'm too lazy to figure out what the
correct behavior really should be). Giving a literal value for `vertical-align`
works the same in all browsers, so use that instead.

Test Plan:
- Replace line 13 of static/index.html with

    <br>m<span id="math"></span>m

- See that the test page now looks good in Chrome, Firefox, and IE9
- See that huxley tests haven't changed

Reviewers: alpert

Reviewed By: alpert

Differential Revision: http://phabricator.khanacademy.org/D8384
2014-04-22 21:01:29 -04:00
Emily Eisenberg
3173a6e53e Make supsubs work correctly with character boxes
Summary:
In rule 18a. of the TeX book, it says we're supposed to set `u` and `v` to 0 if
the nucleus is a character box. Character boxes are loosely defined, but through
experimentation they are anything that contains a single character, including
ordgroups with a single element in them. This change makes KaTeX follow this
rule, and fixes T2404.

Test Plan:
- Make sure the new huxley screenshot looks good
- Make sure none of the huxley tests have changed

Reviewers: alpert

Reviewed By: alpert

Maniphest Tasks: T2404

Differential Revision: http://phabricator.khanacademy.org/D8275
2014-04-17 14:44:30 -04:00
Emily Eisenberg
e68cc472c6 Make errors more informative
Make error messages from the lexing and parsing stages be a bit more helpful. If
provided with the input and a position, the error will display the error
position, and the nearby input with the error position underlined (yay combining
marks). Also, standardize the errors a bit (remove doubled "Error:" strings)

Test plan:
 - Make sure the errors look totally sweet (before: {F15602}, after: {F15603})
 - Trigger every error (that can be triggered) in Parser, Lexer, and buildTree
   using the inputs:
  `a^`
  `a_`
  `a^x^x`
  `a_x_x`
  `\color f`
  `\blue `
  `\Huge`
  `\llap`
  `\text`
  `\dfrac`
  `\dfrac{x}`
  `\d`
  `\blue{`
  `\color{#f`
  `{\Huge{x}}`
 - See that the tests still work

Auditors: alpert
2014-03-30 23:05:37 -04:00
Emily Eisenberg
c22d8644cc Fix a weird bug with rlap
For some reason, when you have a nested elements that look like
  `display: inline-block; > position: relative; > position: absolute;`
then the `position: absolute;` element is shifted down a bunch. If there is
anything* else inside either of the other two elements, then this behavior
disappears. (This can be seen at [this fiddle](http://jsfiddle.net/qZXRr/). We
have this structure when we create `\llap` and `\rlap`s, and this weird behavior
So, to fix this I added an empty `display: inline-block;` span inside the llap
to fix this.

Test plan:
 - See that the new huxley image looks good
 - Test this in a bunch of browsers and see they also look good

Auditors: alpert
2014-03-29 23:33:05 -04:00
Emily Eisenberg
b5ef06b52d Fix our getTypeOfGroup function
Add in the missing `'sizing'` entry, put the `'text'` entry in the correct
place, and replace `groupToType.ord` (a null value) with `groupToType.mathord`
(something real).

Test Plan:
 - See that `^3+` now puts the correct space before the `+`
 - See the new huxley test works, and nothing else has changed

Auditors: alpert
2014-03-28 23:50:18 -04:00
Emily Eisenberg
4154c370ec Add tie symbol (~)
Summary:
Add real support for the tie symbol. Also, get rid of any of the
leftover bad support

Test Plan:
 - See the new normal tests succeed
 - See huxley tests didn't change except the new ones, which looks good

Reviewers: alpert

Reviewed By: alpert

Differential Revision: http://phabricator.khanacademy.org/D7772
2014-03-27 19:23:15 -04:00
Emily Eisenberg
d729ba5281 Add a \color command for custom colors
Summary:
Keep track of the color inside the style now, and use that when we are
rendering things. Added a custom lexing mode to handle lexing colors correctly.
Prefixed the old katex colors (internally) with "katex-" to distinguish them
from CSS colors.

Test Plan:
 - Run the normal tests, see they work
 - Run the huxley tests, see that they didn't change except for the color one
   which looks right

Reviewers: alpert

Reviewed By: alpert

Differential Revision: http://phabricator.khanacademy.org/D7763
2014-03-27 12:34:45 -04:00
Emily Eisenberg
7723d3dcaf First attempt at \text function
Summary:
Make all of the parsing functions keep track of whether they are
parsing in math mode or text mode. Then, add a separate lexing function to lex
text mode, which is different than the normal mode because it does weird things
with spacing and allows a different set of characters.

Test Plan:
 - See that the normal tests work
 - See that the huxley screenshot looks reasonable
 - See that none of the other huxley screenshots changed

Reviewers: alpert

Reviewed By: alpert

Differential Revision: http://phabricator.khanacademy.org/D7578
2014-03-26 22:17:41 -04:00
Emily Eisenberg
2eca338e23 Replace our annoying lookup tables with a unified symbol table
Summary:
Before, there were a couple problems:
1. There were similar tables of functions in the buildTree and Parser modules,
   making it hard to add new functions, and code duplication is bad
2. We distinguished the font to use (mostly just ams vs normal) using a
   different parser class, which led to annoyance and some weird bugs
3. (Not actually in this code, but in D7578) We can't distinguish between
   functions that should be expanded in text mode and those that shouldn't.
To solve these problems, I've created an all-encompassing table in symbols.js
that fixes 1. and 2., and should fix 3. once it's merged in. The table keeps
track of each of the functions and their class, font, and possible replacement,
and then Parser and buildTree do lookups in this table.

Also added the functions for the new_definitions functions, to show how easy it
is to add new functions.

Test Plan:
1. Run the normal tests, see they all pass
2. Run huxley, see none of the screenshots changed
3. See that things like the main page loads
4. See that the new functions look correctly with
   '\barwedge\veebar\odot\oplus\otimes\oslash\circledcirc
    \boxdot\bigtriangleup\bigtriangledown\dagger\diamond
    \star\triangleleft\triangleright'

Reviewers: alpert

Reviewed By: alpert

Differential Revision: http://phabricator.khanacademy.org/D7704
2014-03-26 01:10:10 -04:00
Emily Eisenberg
204270fa0d Somehow manage to fix the sizing bugs
Summary:
Remove a single `vertical-align: top`, and somewhow it now works. May
the gods of CSS have mercy on us. Also added some tests.

Test Plan:
 - See that the huxley tests don't have any changes
 - See that the new huxley screenshots look reasonable
 - Run the normal tests and see that they work

Reviewers: alpert

Reviewed By: alpert

Differential Revision: http://phabricator.khanacademy.org/D7494
2014-03-20 21:36:37 -04:00
Emily Eisenberg
63fda74202 Make marginRight work in firefox
Summary:
`.style["margin-right"]` doesn't work in firefox, but
`.style.marginRight` does.

Test Plan:
- Look at `b\llap{f}` in chrome and firefox
- Make sure it looks the same (or at least very similar) in both

Reviewers: alpert

Reviewed By: alpert

Differential Revision: http://phabricator.khanacademy.org/D7476
2014-03-17 23:44:36 -04:00
Alex Lopatin
ba84964d6f Add \enspace (0.5em space)
Summary:
TeX spacing is complicated - there's \enskip and \enspace and the two are
subtly different in some weird way. But \enspace seems to be the preferred
half em space in LaTeX, and the only one which MathJax supports.

Test Plan: Parsed and rendered correctly.

Reviewers: alpert

Reviewed By: alpert

Differential Revision: http://phabricator.khanacademy.org/D6437
2014-01-29 18:14:12 -08:00
Alex Lopatin
50c1242147 Added \! (negative thin space)
Test Plan: Parses and renders locally. \!\, and \,\! are now no-ops.

Reviewers: alpert

Reviewed By: alpert

Differential Revision: http://phabricator.khanacademy.org/D6395
2014-01-28 16:20:14 -08:00
Alex Lopatin
8c179252c5 Added \cong + fixed comment copypasta.
Test Plan: Parses and renders locally.

Reviewers: alpert

Reviewed By: alpert

Differential Revision: http://phabricator.khanacademy.org/D6393
2014-01-28 16:13:51 -08:00
Ben Alpert
fe346f56ca Add \langle and \rangle
Auditors: alex
2014-01-16 22:32:24 -08:00
Ben Alpert
330b1f5873 Add \le, \ge, \ne symbols
Auditors: eater
2014-01-13 13:37:27 -08:00
Ben Alpert
c8ba6a698f Add \in
Auditors: eater
2014-01-10 11:56:42 -08:00
Ben Alpert
20994d7351 Prevent line breaks immediately after math
For whatever reason, `<inline-block/>,` allows a break in between the block and the comma. `<nobr><inline-block/></nobr>,` doesn't.

Auditors: emily
2013-12-16 05:46:04 -08:00
Ben Alpert
302f5502ef Add \approx as a symbol
This is important because the interactive graph labels use \approx now for polygon sides and it feels really sluggish with MathJax.
2013-11-21 22:15:25 -08:00
Ben Alpert
f3225ee7ee Add percent sign
Auditors: emily
2013-09-13 16:10:34 -07:00
Ben Alpert
2efa794fd3 Add \triangle
Auditors: emily
2013-08-27 18:33:40 -07:00
Emily Eisenberg
8a8a9505cb Fix sizing
Make sizing blocks inline-block

Auditors: alpert
2013-08-22 17:14:55 -07:00
Emily Eisenberg
387c159a8e Add sizing functions (like \small)
Summary:
Right now, when the size gets bigger, this still doesn't work, so there's a
check to prevent that. However, functions that go smaller (like `\small`,
`\tiny`, etc) do work. Also, we can't seem to use the sizing functions inside
of fractions (so something like `\dfrac{\small\frac{x}{y}}{z}` doesn't work).
However, the most prominent use case is `\small` as the outer-most object, so
this is still helpful. This commit has the parsing and stuff to handle all of
it, but it'll throw an error if you try to do something that doesn't work. (For
the record, "doesn't work" means "looks bad", not "throws an unexpected
error").

Test Plan:
Make sure things like `\small x` work, and things like `\Huge x` and
`\frac{\small x}{y}` don't.

Reviewers: alpert

Reviewed By: alpert

Differential Revision: http://phabricator.khanacademy.org/D3619
2013-08-21 20:22:24 -07:00
Ben Alpert
944b55a6b0 Make supsub work with empty nucleus
Auditors: emily
2013-08-17 16:14:06 -07:00
Emily Eisenberg
920dd0bef9 Add some AMS characters
Summary:
\nleq and \ngeq are AMS characters, so add support for parsing and
showing those. Also, add font metrics from the ams_regular font.

Test Plan:
View `\ngeq \geq`, make sure that they look the same but with a
slash through `\ngeq`. View `a \ngeq b`, make sure there's the right spacing
for a rel.

Reviewers: alpert

Reviewed By: alpert

Differential Revision: http://phabricator.khanacademy.org/D3547
2013-08-14 17:39:24 -07:00
Ben Alpert
7f25fd7dc9 Parse metrics directly from .ttf files
Summary:
Fixes T1325.

This has the advantage of not having to do the mapping manually. Also it means that characters like \neq are included in the mapping, so this resolves T1323 as well.

I opted to group the metrics by character instead of by metric type because I think it'll gzip better and it makes getCharacterMetrics simpler anyway.

Test Plan: The test page looks identical to the pixel to my eye.

Reviewers: emily

Reviewed By: emily

Maniphest Tasks: T1323, T1325

Differential Revision: http://phabricator.khanacademy.org/D3535
2013-08-14 10:57:00 -07:00
Emily Eisenberg
9fc357b8a1 Add italic correction
Summary: Add margin to the right of characters that have italic correction.

Test Plan:
Look at `f'` and `C'` before and after. Note that they both now look
good at small font sizes (like 17pt).

Reviewers: alpert

Reviewed By: alpert

Differential Revision: http://phabricator.khanacademy.org/D3534
2013-08-14 10:51:09 -07:00
Emily Eisenberg
0a3a2271f4 Add ability to calculate heights/depths
Summary:
This diff does a couple different things:

 - There is now a metrics/ folder, which contains the property files describing
   the metrics if the fonts, as well as a script for reading and printing the
   metrics in javascript.
 - Fractions and superscripts/subscripts are now rendered in slightly different
   ways now (notably, no use of inline-table). This allows for much more precise
   positioning of the superscripts, subscripts, numerators, and denominators,
   while still having an appropriate baseline. Also, there is no longer a
   sup/sub/supsub distinction, there are only supsubs with null sup/sub.
 - Using the new font metrics and by implementing the formulas found in The TeX
   Book, Appendix G, the heights and depths of all of the sub-expressions in a
   formula are now calculated. These are currently used to:
    - Correctly position superscripts, subscripts, numerators, and denominators
    - Adjust the height and depth of the overall expression so it takes up the
      appropriate space
 - Because we have to add attributes (height and depth) to every attribute, I
   have changed the way DOM nodes are assembled. Now, instead of assembling the
   DOM elements inline (which is a problem because we need to track
   height/depth, and we shouldn't (and can't in IE 8) attach raw attributes to DOM
   nodes), we assemble a pseudo-DOM structure with the extra information, and
   then actually assemble it at the very end.

The main page also now has an updated expression to show off and test the new
and improved parsing.

Test Plan:
View the main page, make sure that the expression renders. Make sure
that the tests pass. Make sure that expressions have the correct calculated
height (this is most easily tested by viewing them on the main page and making
sure that the top of the expression lines up with the bottom of the input box).

Reviewers: alpert

Reviewed By: alpert

Differential Revision: http://phabricator.khanacademy.org/D3442
2013-08-13 18:16:43 -07:00
Emily Eisenberg
5788a76dcf Do bin -> ord for all the correct types
Fixes T1303

Auditors: alpert
2013-08-10 03:23:46 -07:00
Emily Eisenberg
7e5e6a90d3 Add the \KaTeX command
Summary:
Add a command to print out a TeX-style logo for KaTeX. I think the
code is okay, but suggestions for the design of the logo are most welcome (I'll
post screenshots soon).

Test Plan: Make sure \KaTeX renders, and the tests still succeed.

Reviewers: alpert

Reviewed By: alpert

Differential Revision: http://phabricator.khanacademy.org/D3443
2013-08-09 20:51:05 -07:00
Emily Eisenberg
cfb9f2b31b Refactor some stuff
Summary:
Pull node making into a separate module, make an "options" param for
the make_ functions, and pull the different types of groups into separate
functions.

Test Plan: Open the homepage, make sure everything still works.

Reviewers: alpert

Reviewed By: alpert

Differential Revision: http://phabricator.khanacademy.org/D3368
2013-08-06 14:12:06 -07:00