44 | Press n or j to go to the next uncovered block, b, p or k for the previous block. 45 |
46 || File | 53 |54 | | Statements | 55 |56 | | Branches | 57 |58 | | Functions | 59 |60 | | Lines | 61 |62 | |
|---|---|---|---|---|---|---|---|---|---|
| katex-modified.min.js | 66 |57.72% | 68 |1425/2469 | 69 |47.53% | 70 |951/2001 | 71 |60.92% | 72 |279/458 | 73 |100% | 74 |3/3 | 75 |
44 | Press n or j to go to the next uncovered block, b, p or k for the previous block. 45 |
46 || File | 53 |54 | | Statements | 55 |56 | | Branches | 57 |58 | | Functions | 59 |60 | | Lines | 61 |62 | |
|---|---|---|---|---|---|---|---|---|---|
| mousetrap.min.js | 66 |78.68% | 68 |107/136 | 69 |48.45% | 70 |78/161 | 71 |62.5% | 72 |20/32 | 73 |100% | 74 |11/11 | 75 |
44 | Press n or j to go to the next uncovered block, b, p or k for the previous block. 45 |
46 || 1 50 | 2 51 | 3 52 | 4 53 | 5 54 | 6 55 | 7 56 | 8 57 | 9 58 | 10 59 | 11 60 | 12 61 | 13 62 | 14 63 | 15 | 1x 64 | 1x 65 | 1x 66 | 1x 67 | 68 | 1x 69 | 70 | 71 | 72 | 1x 73 | 74 | 75 | 76 | 77 | | var Version = {}
78 | Version.GUPPY_VERSION = "2.0.0-alpha.1";
79 | Version.DOC_VERSION = "1.2.0";
80 | Version.SYMBOL_VERSION = "2.0.0-alpha.3";
81 |
82 | Version.DOC_ERROR = function(id, found_ver){
83 | throw Error("Document version mismatch for " + id + ": Found " + found_ver + ", required " + Version.DOC_VERSION + ". To update your document, please see daniel3735928559.github.io/guppy/doc/version.html");
84 | }
85 |
86 | Version.SYMBOL_ERROR = function(id, found_ver){
87 | throw Error("Symbol version mismatch for " + id + ": Found " + found_ver + ", required " + Version.SYMBOL_VERSION + ". To update your document, please see daniel3735928559.github.io/guppy/doc/version.html");
88 | }
89 | export default Version
90 |
91 | |
44 | Press n or j to go to the next uncovered block, b, p or k for the previous block. 45 |
46 || File | 53 |54 | | Statements | 55 |56 | | Branches | 57 |58 | | Functions | 59 |60 | | Lines | 61 |62 | |
|---|---|---|---|---|---|---|---|---|---|
| symbols.json | 66 |100% | 68 |29/29 | 69 |100% | 70 |0/0 | 71 |100% | 72 |0/0 | 73 |100% | 74 |29/29 | 75 |
44 | Press n or j to go to the next uncovered block, b, p or k for the previous block. 45 |
46 || 1 50 | 2 51 | 3 52 | 4 53 | 5 54 | 6 55 | 7 56 | 8 57 | 9 58 | 10 59 | 11 60 | 12 61 | 13 62 | 14 63 | 15 | 1x 64 | 1x 65 | 1x 66 | 1x 67 | 68 | 1x 69 | 70 | 71 | 72 | 1x 73 | 74 | 75 | 76 | 77 | | var Version = {}
78 | Version.GUPPY_VERSION = "2.0.0-alpha.1";
79 | Version.DOC_VERSION = "1.2.0";
80 | Version.SYMBOL_VERSION = "2.0.0-alpha.3";
81 |
82 | Version.DOC_ERROR = function(id, found_ver){
83 | throw Error("Document version mismatch for " + id + ": Found " + found_ver + ", required " + Version.DOC_VERSION + ". To update your document, please see daniel3735928559.github.io/guppy/doc/version.html");
84 | }
85 |
86 | Version.SYMBOL_ERROR = function(id, found_ver){
87 | throw Error("Symbol version mismatch for " + id + ": Found " + found_ver + ", required " + Version.SYMBOL_VERSION + ". To update your document, please see daniel3735928559.github.io/guppy/doc/version.html");
88 | }
89 | export default Version
90 |
91 | |
If you want to help with development, this page contains some 6 | resources to help set up your environment for running, 7 | testing, and understanding the code. I also try to be 8 | responsive to 9 | issues 10 | raised via github. Feel free to raise questions about 11 | development there (as well as issues with the code!)
12 |$ git clone https://github.com/daniel3735928559/guppy 22 | $ cd guppy 23 | $ npm install --only=dev24 |
$ npm run-script build-debug
$ npm test41 | The results of the tests will be displayed on the command line. 42 |
This project is undertaken entirely in my free time. If you 78 | would like to support it with a small donation, you can do so 79 | here:
80 | 81 |If you want to help with development, this page contains some resources to help set up your environment for running, testing, and understanding the code. I also try to be responsive to issues raised via github. Feel free to raise questions about development there (as well as issues with the code!)
41 |$ git clone https://github.com/daniel3735928559/guppy
49 | $ cd guppy
50 | $ npm install --only=dev$ npm run-script build-debug$ npm testThis project is undertaken entirely in my free time. If you would like to support it with a small donation, you can do so here:
100 |npm install guppy-js
<link rel="stylesheet" href="/node_modules/guppy-js/style/guppy-default.min.css"> 7 | <script type="text/javascript" src="/node_modules/guppy-js/guppy.min.js"></script>
var g1 = new Guppy("guppy1");<!doctype html>
20 | <html>
21 | <head>
22 | <link rel="stylesheet" href="/node_modules/guppy-js/style/guppy-default.min.css">
23 | <script type="text/javascript" src="/node_modules/guppy-js/guppy.min.js"></script>
24 | <script type="text/javascript">
25 | window.onload = function(){
26 | var g1 = new Guppy("guppy1");
27 | }
28 | </script>
29 | </head>
30 |
31 | <body>
32 | <div id="guppy1" style="width:400px;"></div>
33 | </body>
34 |
35 | </html>This is a paragraph about $$m^(a^(t^h))$$
42 | ``` 43 | 44 | Can be rendered with `Guppy.Doc.render_all("text", "$$")`. 45 | 46 | ### Accessing rendered document objects 47 | 48 | The function `render_all` returns a list of objects that specify both 49 | the id of the span into which the expression was rendered and the 50 | Guppy.Doc object that contains the information. So, for example, if 51 | you had rendered `x^2` on the page and wanted to evaluate it in 52 | response to user input, you could do: 53 | 54 | ``` 55 | var eqns = Guppy.Doc.render_all("text", "$$") 56 | var x = prompt("Enter a value for x"); 57 | alert(eqns[0].get_content("function")({"x":x})); 58 | ``` 59 | -------------------------------------------------------------------------------- /site/doc/_src/roadmap.md: -------------------------------------------------------------------------------- 1 | % Roadmap 2 | 3 | The high-level goals of this project are that mathematics should be 4 | stored in a way that is easy for both computers and humans to 5 | consume. Our plan has three parts: 6 | 7 | * Enhance its **compatibility**, ensuring it can be used on many 8 | platforms. 9 | 10 | * Explore **integration** with existing platforms for creating 11 | mathematical content. 12 | 13 | * Develop **applications** that allow those consuming mathematical 14 | content to take advantage of the computer's improved understanding 15 | of that content. 16 | 17 | ### Compatibility 18 | 19 | We wish to ensure that the editor is usable on as many platforms as 20 | possible: 21 | 22 | * More mobile testing 23 | 24 | * Internet Explorer compatibility (possibly through babelify?) 25 | 26 | ### Integration 27 | 28 | We seek to allow people to use the editor in contexts in which they 29 | already create mathematical content. Some (by no means all) platforms 30 | that I wish to explore specifically are: 31 | 32 | * Programming tools: Jupyter notebooks, Sage workbooks 33 | 34 | * Javascript libraries/frameworks: Quill.js, ReactJS, CodeMirror 35 | 36 | * Content management systems: TiddlyWiki, Moodle, WordPress, Emacs 37 | 38 | ### Applications 39 | 40 | When mathematical content is stored in a computer-friendly way, there 41 | should be ways of leveraging that extra understanding to help those 42 | consuming that content. 43 | 44 | We envision a tool a bit like a programming IDE, except for reading 45 | mathematics. For example, if when reading a theorem we find a symbol 46 | whose definition we have forgotten, we should be able to click on that 47 | symbol and be able to cross-reference its definition and its other 48 | instances in the document. 49 | 50 | ### Philosophy 51 | 52 | If PostScript is the assembly language of typesetting mathematics, 53 | then perhaps LaTeX is the C and this XML format can be one of many 54 | competing higher-level languages for specifying mathematical 55 | formulae--not optimal for all use-cases, but addressing positively the 56 | needs of a few. 57 | -------------------------------------------------------------------------------- /site/doc/_src/script.md: -------------------------------------------------------------------------------- 1 | % Scripting the editor 2 | 3 | Any Guppy instance can be controlled from javascript. For example, 4 | you can create some buttons that perform actions in the editor (such 5 | as moving the cursor right and left or inserting an integral symbol). 6 | 7 | The object that allows most of this is the `Engine` instance 8 | associated with an editor. If we have an editor with ID "guppy1", we 9 | can access its `Engine` with `Guppy("guppy1").engine`. Functions 10 | available from this object are documented in the API 11 | [here](../api/guppy-js/2.0.0-rc.1/Engine.html). 12 | 13 | For example, to move the cursor one space to the left, insert the 14 | letter "x", and then delete what comes after it, we can do: 15 | 16 | ``` 17 | var e = Guppy("guppy1").engine; 18 | e.left(); 19 | e.insert_string("x"); 20 | e.delete_key(); 21 | ``` 22 | -------------------------------------------------------------------------------- /site/doc/_src/style.md: -------------------------------------------------------------------------------- 1 | % CSS styling 2 | 3 | The following CSS selectors will provide access to various elements of the editor: 4 | 5 | * `.guppy_active`: The guppy div when it is active. For example, one 6 | can use the `border` property of this class to cause the editor to 7 | have a glowing blue border when active. 8 | 9 | * `.guppy_inactive`: The guppy div when it is inactive. For example, 10 | set the `background-color` of this class to a shade of grey to grey 11 | out the editor when inactive. 12 | 13 | * `.guppy_active .main_cursor`: The span for the main cursor. CSS 14 | animations can be used, for example, to make the cursor blink. 15 | 16 | * `.guppy_text_current`: The span for any plain text content currently 17 | under selection. For example, to highlight a textbox with a grey 18 | border while selected, set a `border` style for this CSS class. 19 | 20 | * `.guppy_buttons img`: The image elements for the configuration/help 21 | buttons in the editor. 22 | 23 | * `.guppy_buttons`: The container for the configuration/help buttons 24 | in the editor. 25 | 26 | For example, we present here the stylesheet for the example Guppy 27 | page: 28 | 29 | ``` 30 | .guppy_active { 31 | border: 2px solid black; 32 | padding: 10px; 33 | box-shadow: 1px 1px 1px 0 lightgray inset; 34 | cursor: text; 35 | background-color: #ffffff; 36 | color:#000; 37 | position:relative; 38 | } 39 | 40 | .guppy_inactive { 41 | border: 2px solid black; 42 | padding: 10px; 43 | box-shadow: 1px 1px 1px 0 lightgray inset; 44 | cursor: text; 45 | background-color: #fafafa; 46 | color:#000; 47 | position:relative; 48 | } 49 | 50 | .guppy_text_current { 51 | border: 1px solid #ccc; 52 | } 53 | 54 | .guppy_active .main_cursor { 55 | animation: blink-animation 1s steps(2, start) infinite; 56 | -webkit-animation: blink-animation 1s steps(2, start) infinite; 57 | } 58 | 59 | .guppy_active .guppy_buttons { 60 | display: block; 61 | } 62 | 63 | .guppy_inactive .guppy_buttons { 64 | display: none; 65 | } 66 | 67 | .guppy_buttons { 68 | position:absolute; 69 | bottom:0; 70 | right:0; 71 | padding:0 3px 3px 0; 72 | } 73 | 74 | .guppy_buttons img{ 75 | cursor:pointer; 76 | height:16px; 77 | width:16px; 78 | padding:3px; 79 | opacity: 0.5; 80 | } 81 | 82 | .guppy_buttons img:hover{ 83 | opacity: 1; 84 | } 85 | 86 | @keyframes blink-animation { 87 | to { visibility: hidden; } 88 | } 89 | 90 | @-webkit-keyframes blink-animation { 91 | to { visibility: hidden; } 92 | } 93 | ``` 94 | 95 | -------------------------------------------------------------------------------- /site/doc/_src/version.md: -------------------------------------------------------------------------------- 1 | % Format version changelogs 2 | 3 | Here we describe the various versions of Guppy XML documents and 4 | symbol specifications that may exist in the wild with the following 5 | caveats: 6 | 7 | * Any symbol file not containing a `_version` top-level key may be 8 | assumed to be version 1.0.0. 9 | 10 | * Any Guppy XML document not containing `m/@v` may be assumed to be 11 | 1.1.0. 12 | 13 | * Document and symbol version numbers need not correlate with version 14 | numbers of Guppy itself. 15 | 16 | ### Symbol 17 | 18 | The complete specification for the current version is described in the 19 | documentation for 20 | [`Guppy.add_global_symbol`](../api/guppy-js/2.0.0-rc.1/Guppy.html#.add_global_symbol). 21 | 22 | #### 2.0.0-alpha.3 23 | 24 | * Added `keys` to symbol dictionary to specify keyboard input 25 | combinations for that symbol. 26 | 27 | #### 2.0.0-alpha.2 28 | 29 | * Removed `attrs.char` as redundant 30 | 31 | * Replaced `current.index` with `input` 32 | 33 | #### 2.0.0-alpha.1 34 | 35 | * Added top-level keys `_version`, `_name`, and `_templates`. 36 | 37 | * Moved `attrs` to `args` 38 | 39 | * Moved `char`, `type`, and `group` to subkeys of `attrs` 40 | 41 | * Added `template` 42 | 43 | * Added `ast.type` and `ast.value` 44 | 45 | * Transposed `attrs` (now `args`) from 46 | ``` 47 | { 48 | attr1: [arg1attr1val, arg2attr1val], 49 | attr2: [arg1attr2val, arg2attr2val] 50 | } 51 | ``` 52 | to 53 | ``` 54 | [ 55 | arg1: {attr1:val,attr2:val}, 56 | arg2: {attr1:val,attr2:val} 57 | ] 58 | ``` 59 | since the attributes used by different arguments are frequently 60 | different. Breaks compatibility with 1.0.0. 61 | 62 | #### 1.0.0 63 | 64 | Initial version 65 | 66 | ### Document 67 | 68 | The complete specification for the current version is described in the 69 | [XML format](./format.html) page. 70 | 71 | #### 1.2.0 72 | 73 | * Added `m/@v` to specify version. 74 | 75 | * Removed `f/@c` 76 | 77 | * Backwards-compatible with 1.1.0 and 1.0.0 78 | 79 | #### 1.1.0 80 | 81 | * Added `l` nodes as valid children of `f` and `l` nodes, with valid 82 | children either `l` or `c`. 83 | 84 | * Backwards-compatible with 1.0.0 85 | 86 | #### 1.0.0 87 | 88 | Initial version 89 | -------------------------------------------------------------------------------- /site/doc/guides.json: -------------------------------------------------------------------------------- 1 | { 2 | "usage": {"title": "Using the editor", 3 | "children":{ 4 | "style": {"title":"Styling the editor"}, 5 | "symbols":{"title":"Creating custom symbols"}}}, 6 | "behind-the-scenes":{"title": "Behind the scenes", 7 | "children":{ 8 | "roadmap": {"title": "Roadmap for future development"}, 9 | "format": {"title": "XML format"}, 10 | "internals": {"title": "Editor internals"}}} 11 | } 12 | -------------------------------------------------------------------------------- /site/doc/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 |Quickstart: Quickly get started using the editor
Styling the editor: How to style the editor with CSS
Scripting the editor: How to control the editor from Javascript
Rendering documents statically: Use Guppy to render documents on a page
Creating a new symbol: How to add a symbol to the editor
Document/symbol spec changelog: Version changelogs for document and symbol formats
Frequently asked questions: Other questions
Guppy: The API for working with the editor object
Doc The API for working with documents generated by the editor
Engine The API for controlling the editor programatically
GuppyOSK The API for the built-in on-screen keyboard (e.g. for mobile input)
XML Format: The editor’s XML storage format
Editor internals: The editor’s inner workings
Roadmap: The roadmap for future development
Install guppy with
40 |npm install guppy-jsInclude guppy.min.js and guppy-default.min.css in your page:
42 |<link rel="stylesheet" href="/node_modules/guppy-js/style/guppy-default.min.css">
43 | <script type="text/javascript" src="/node_modules/guppy-js/guppy.min.js"></script>Initialise an instance of the editor with the ID of a div that you want to be turned into the editor.
45 |var g1 = new Guppy("guppy1");Putting it all together for a complete basic example:
54 |<!doctype html>
55 | <html>
56 | <head>
57 | <link rel="stylesheet" href="/node_modules/guppy-js/style/guppy-default.min.css">
58 | <script type="text/javascript" src="/node_modules/guppy-js/guppy.min.js"></script>
59 | <script type="text/javascript">
60 | window.onload = function(){
61 | var g1 = new Guppy("guppy1");
62 | }
63 | </script>
64 | </head>
65 |
66 | <body>
67 | <div id="guppy1" style="width:400px;"></div>
68 | </body>
69 |
70 | </html>Guppy has the ability to render pre-existing mathematical expression on a page, where those expressions may be specified as XML documents, JSON syntax trees, plain text, or semantic LaTeX.
42 |In all cases, equations get rendered into a <span> element with a unique ID and class guppy-render. To render many Guppy documents on a page, you call render_all (parameters described below), which will return a list of objects of the form {"id":id, "doc":doc}, where id is the string ID of the span containing the rendered document, and doc is the Guppy.Doc object there rendered.
If you have a GuppyXML document, say <m v="2.0.0"><e>x+1</e></m>, then you can include it in an HTML document as valid HTML by enclosing it in a script tag:
<script type="text/guppy_xml">
46 | <m v="2.0.0"><e>x+1</e></m>
47 | </script>On such a page, a call to Guppy.Doc.render_all() will render all such tags as documents, and will return the list of {"id":id, "doc":doc} objects as described above.
If you have equations on a page in a format that Guppy can import–plain text or semantic LaTeX, and those equations are delimited by some string such as "$$", Guppy.Doc.render_all can also render these. The first arguemnt is the format in which the equations are specified ("latex" or "text") and the second is the delimited string (e.g. "$$").
<p>This is a paragraph about $$m^(a^(t^h))$$</p>Can be rendered with Guppy.Doc.render_all("text", "$$").
The function render_all returns a list of objects that specify both the id of the span into which the expression was rendered and the Guppy.Doc object that contains the information. So, for example, if you had rendered x^2 on the page and wanted to evaluate it in response to user input, you could do:
var eqns = Guppy.Doc.render_all("text", "$$")
56 | var x = prompt("Enter a value for x");
57 | alert(eqns[0].get_content("function")({"x":x}));The high-level goals of this project are that mathematics should be stored in a way that is easy for both computers and humans to consume. Our plan has three parts:
43 |Enhance its compatibility, ensuring it can be used on many platforms.
Explore integration with existing platforms for creating mathematical content.
Develop applications that allow those consuming mathematical content to take advantage of the computer’s improved understanding of that content.
We wish to ensure that the editor is usable on as many platforms as possible:
50 |More mobile testing
Internet Explorer compatibility (possibly through babelify?)
We seek to allow people to use the editor in contexts in which they already create mathematical content. Some (by no means all) platforms that I wish to explore specifically are:
56 |Programming tools: Jupyter notebooks, Sage workbooks
Javascript libraries/frameworks: Quill.js, ReactJS, CodeMirror
Content management systems: TiddlyWiki, Moodle, WordPress, Emacs
When mathematical content is stored in a computer-friendly way, there should be ways of leveraging that extra understanding to help those consuming that content.
63 |We envision a tool a bit like a programming IDE, except for reading mathematics. For example, if when reading a theorem we find a symbol whose definition we have forgotten, we should be able to click on that symbol and be able to cross-reference its definition and its other instances in the document.
64 |If PostScript is the assembly language of typesetting mathematics, then perhaps LaTeX is the C and this XML format can be one of many competing higher-level languages for specifying mathematical formulae–not optimal for all use-cases, but addressing positively the needs of a few.
66 |Any Guppy instance can be controlled from javascript. For example, you can create some buttons that perform actions in the editor (such as moving the cursor right and left or inserting an integral symbol).
37 |The object that allows most of this is the Engine instance associated with an editor. If we have an editor with ID “guppy1”, we can access its Engine with Guppy("guppy1").engine. Functions available from this object are documented in the API here.
For example, to move the cursor one space to the left, insert the letter “x”, and then delete what comes after it, we can do:
39 |var e = Guppy("guppy1").engine;
40 | e.left();
41 | e.insert_string("x");
42 | e.delete_key();The following CSS selectors will provide access to various elements of the editor:
37 |.guppy_active: The guppy div when it is active. For example, one can use the border property of this class to cause the editor to have a glowing blue border when active.
.guppy_inactive: The guppy div when it is inactive. For example, set the background-color of this class to a shade of grey to grey out the editor when inactive.
.guppy_active .main_cursor: The span for the main cursor. CSS animations can be used, for example, to make the cursor blink.
.guppy_text_current: The span for any plain text content currently under selection. For example, to highlight a textbox with a grey border while selected, set a border style for this CSS class.
.guppy_buttons img: The image elements for the configuration/help buttons in the editor.
.guppy_buttons: The container for the configuration/help buttons in the editor.
For example, we present here the stylesheet for the example Guppy page:
46 |.guppy_active {
47 | border: 2px solid black;
48 | padding: 10px;
49 | box-shadow: 1px 1px 1px 0 lightgray inset;
50 | cursor: text;
51 | background-color: #ffffff;
52 | color:#000;
53 | position:relative;
54 | }
55 |
56 | .guppy_inactive {
57 | border: 2px solid black;
58 | padding: 10px;
59 | box-shadow: 1px 1px 1px 0 lightgray inset;
60 | cursor: text;
61 | background-color: #fafafa;
62 | color:#000;
63 | position:relative;
64 | }
65 |
66 | .guppy_text_current {
67 | border: 1px solid #ccc;
68 | }
69 |
70 | .guppy_active .main_cursor {
71 | animation: blink-animation 1s steps(2, start) infinite;
72 | -webkit-animation: blink-animation 1s steps(2, start) infinite;
73 | }
74 |
75 | .guppy_active .guppy_buttons {
76 | display: block;
77 | }
78 |
79 | .guppy_inactive .guppy_buttons {
80 | display: none;
81 | }
82 |
83 | .guppy_buttons {
84 | position:absolute;
85 | bottom:0;
86 | right:0;
87 | padding:0 3px 3px 0;
88 | }
89 |
90 | .guppy_buttons img{
91 | cursor:pointer;
92 | height:16px;
93 | width:16px;
94 | padding:3px;
95 | opacity: 0.5;
96 | }
97 |
98 | .guppy_buttons img:hover{
99 | opacity: 1;
100 | }
101 |
102 | @keyframes blink-animation {
103 | to { visibility: hidden; }
104 | }
105 |
106 | @-webkit-keyframes blink-animation {
107 | to { visibility: hidden; }
108 | }Here we describe the various versions of Guppy XML documents and symbol specifications that may exist in the wild with the following caveats:
50 |Any symbol file not containing a _version top-level key may be assumed to be version 1.0.0.
Any Guppy XML document not containing m/@v may be assumed to be 1.1.0.
Document and symbol version numbers need not correlate with version numbers of Guppy itself.
The complete specification for the current version is described in the documentation for Guppy.add_global_symbol.
keys to symbol dictionary to specify keyboard input combinations for that symbol.Removed attrs.char as redundant
Replaced current.index with input
Added top-level keys _version, _name, and _templates.
Moved attrs to args
Moved char, type, and group to subkeys of attrs
Added template
Added ast.type and ast.value
Transposed attrs (now args) from
{
75 | attr1: [arg1attr1val, arg2attr1val],
76 | attr2: [arg1attr2val, arg2attr2val]
77 | }to
79 |[
80 | arg1: {attr1:val,attr2:val},
81 | arg2: {attr1:val,attr2:val}
82 | ]since the attributes used by different arguments are frequently different. Breaks compatibility with 1.0.0.
Initial version
87 |The complete specification for the current version is described in the XML format page.
89 |Added m/@v to specify version.
Removed f/@c
Backwards-compatible with 1.1.0 and 1.0.0
Added l nodes as valid children of f and l nodes, with valid children either l or c.
Backwards-compatible with 1.0.0
Initial version
102 |You can use Guppy to render equations like $$x^2$$ and $$defintegral(0,infinity(),sin(x^2),x)$$.
16 | 17 | 18 | 19 | -------------------------------------------------------------------------------- /site/examples/article/codepen_hash: -------------------------------------------------------------------------------- 1 | QJrKbQ 2 | -------------------------------------------------------------------------------- /site/examples/article/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 |29 | See Guppy article example on CodePen. 30 |
31 | 32 |29 | See Guppy basic example on CodePen. 30 |
31 | 32 |29 | See Guppy calc example on CodePen. 30 |
31 | 32 |29 | See Guppy events example on CodePen. 30 |
31 | 32 |29 | See Guppy graph example on CodePen. 30 |
31 | 32 |29 | See Guppy import example on CodePen. 30 |
31 | 32 |A basic example of using the editor on a web page.
Evaluate expressions numerically.
Trace all editor events.
Using the on-screen keyboard for mobile compatibility.
Extremely basic graphing calculator.
Import and export editor expressions to/from all available formats.
Checking inputs against correct answers using math-expressions.
Importing plain text input into the editor using math-expressions.
A mathematical document with expressions rendered.
29 | See Guppy io example on CodePen. 30 |
31 | 32 |29 | See Guppy quiz example on CodePen. 30 |
31 | 32 |29 | See Guppy $name$ example on CodePen. 30 |
31 | 32 |