diff options
Diffstat (limited to 'src')
| -rw-r--r-- | src/www/syntax-editor/Makefile | 2 | ||||
| -rw-r--r-- | src/www/syntax-editor/README.md | 76 | ||||
| -rw-r--r-- | src/www/syntax-editor/about.html | 113 | ||||
| -rw-r--r-- | src/www/syntax-editor/ast.js | 6 | ||||
| -rw-r--r-- | src/www/syntax-editor/editor.css | 8 | ||||
| -rw-r--r-- | src/www/syntax-editor/editor.js | 53 | ||||
| -rw-r--r-- | src/www/syntax-editor/editor_online.js | 10 |
7 files changed, 161 insertions, 107 deletions
diff --git a/src/www/syntax-editor/Makefile b/src/www/syntax-editor/Makefile index 6f2ccc26b..af10826f4 100644 --- a/src/www/syntax-editor/Makefile +++ b/src/www/syntax-editor/Makefile @@ -1,2 +1,2 @@ html: - pandoc --from=markdown --to=html5 --parse-raw --output=about.html README.md + pandoc --from=markdown+pipe_tables --to=html --output=about.html README.md diff --git a/src/www/syntax-editor/README.md b/src/www/syntax-editor/README.md index 1a029f9b5..6b03caddb 100644 --- a/src/www/syntax-editor/README.md +++ b/src/www/syntax-editor/README.md @@ -6,59 +6,51 @@ <link rel=stylesheet type="text/css" href="editor.css"> <meta charset="UTF-8"> </head> -<body class="syntax-editor"> +<body class="about"> # GF web-based syntax editor John J. Camilleri -December 2012 +January 2013 -An improved version of the [old syntax editor][1]. +A tool for building and manipulating abstract syntax trees in GF. +This is meant as improved replacement of the [old syntax editor][old]. -[1]:http://www.grammaticalframework.org/~meza/restWiki/editor.html +[old]:http://www.grammaticalframework.org/~meza/restWiki/editor.html ## Example usage -See `editor.html` and `editor_online.js`. +If you want to use the tool in your own application, everything you need in the source +files `editor.html` and `editor_online.js`. Contact the [GF developer mailing list][gf-dev] +if you have any problems. + +[gf-dev]:http://groups.google.com/group/gf-dev ## Available startup options -+---------------------+--------------------------------------------------+--------+ -|Options |Description |Default | -+=====================+==================================================+========+ -|target | |"editor"| -| | | | -+---------------------+--------------------------------------------------+--------+ -|initial.grammar |Initial grammar URL, | | -| |e.g. `"http://localhost:41296/grammars/Foods.pgf"`| | -+---------------------+--------------------------------------------------+--------+ -|initial.startcat |Initial startcat |(grammar| -| | |default)| -+---------------------+--------------------------------------------------+--------+ -|initial.languages |Initial linearisation languages, |(all) | -| |e.g. `["Eng","Swe","Mlt"]` | | -+---------------------+--------------------------------------------------+--------+ -|initial.abstr |Initial abstract tree (as string), e.g. `"Pred | | -| |(That Fish) Expensive"` | | -+---------------------+--------------------------------------------------+--------+ -|show_grammar_menu |Show grammar menu? |True | -| | | | -+---------------------+--------------------------------------------------+--------+ -|show_startcat_menu |Show startcat menu? |True | -| | | | -+---------------------+--------------------------------------------------+--------+ -|show_to_menu |Show languages menu? |True | -| | | | -+---------------------+--------------------------------------------------+--------+ -|show_random_button |Show random button? |True | -| | | | -+---------------------+--------------------------------------------------+--------+ -|show_import |Show import button/panel? |True | -| | | | -+---------------------+--------------------------------------------------+--------+ -|show_export |Show export button? |True | -| | | | -+---------------------+--------------------------------------------------+--------+ +### Grammar Manager + +| Options | Description | Default | +|---------------------+-------------------------------------------------------------------------+-------------------| +| `initial.grammar` | Initial grammar URL, e.g. `"http://localhost:41296/grammars/Foods.pgf"` | | +| `initial.startcat` | Initial startcat | (grammar default) | +| `initial.languages` | Initial linearisation languages, e.g. `["Eng","Swe","Mlt"]` | (all) | + + +### Editor + +| Options | Description | Default | +|----------------------+---------------------------------------------------------------------------------+----------| +| `target` | | "editor" | +| `initial.abstr` | Initial abstract tree (as string), e.g. `"Pred (That Fish) Expensive"` | | +| `lin_action` | Function called when clicking on the language button beside each linearisation. | | +| `lin_action_tooltip` | Tooltip for the button beside each linearisation. | | +| `show_grammar_menu` | Show grammar menu? | True | +| `show_startcat_menu` | Show startcat menu? | True | +| `show_to_menu` | Show languages menu? | True | +| `show_random_button` | Show random button? | True | +| `show_import` | Show import button/panel? | True | +| `show_export` | Show export button? | True | ## Notes @@ -72,7 +64,7 @@ See `editor.html` and `editor_online.js`. - Usage of printnames - Enter string/float/int literals - more prominence to Disamb-linearizations -- show all resulting linearizations/variants +- show all resulting linearization variants - undo/redo (or back/forward) navigation - structure fridge magnets more (eg newline before the magnet whose first letter is different) diff --git a/src/www/syntax-editor/about.html b/src/www/syntax-editor/about.html index a05d1dd20..8f9e561f1 100644 --- a/src/www/syntax-editor/about.html +++ b/src/www/syntax-editor/about.html @@ -6,83 +6,100 @@ About the syntax editor </title> <link rel=stylesheet type="text/css" href="../minibar/minibar.css"> <link rel=stylesheet type="text/css" href="editor.css"> <meta charset="UTF-8"> </head> -<body class="syntax-editor"> +<body class="about"> <h1 id="gf-web-based-syntax-editor">GF web-based syntax editor</h1> -<p>John J. Camilleri<br>December 2012</p> -<p>An improved version of the <a href="http://www.grammaticalframework.org/~meza/restWiki/editor.html">old syntax editor</a>.</p> +<p>John J. Camilleri<br />January 2013</p> +<p>A tool for building and manipulating abstract syntax trees in GF. This is meant as improved replacement of the <a href="http://www.grammaticalframework.org/~meza/restWiki/editor.html">old syntax editor</a>.</p> <h2 id="example-usage">Example usage</h2> -<p>See <code>editor.html</code> and <code>editor_online.js</code>.</p> +<p>If you want to use the tool in your own application, everything you need in the source files <code>editor.html</code> and <code>editor_online.js</code>. Contact the <a href="http://groups.google.com/group/gf-dev">GF developer mailing list</a> if you have any problems.</p> <h2 id="available-startup-options">Available startup options</h2> +<h3 id="grammar-manager">Grammar Manager</h3> <table> -<col style="width: 26%" /><col style="width: 62%" /><col style="width: 10%" /><thead> +<thead> <tr class="header"> -<th style="text-align: left;">Options</th> -<th style="text-align: left;">Description</th> -<th style="text-align: left;">Default</th> +<th align="left">Options</th> +<th align="left">Description</th> +<th align="left">Default</th> </tr> </thead> <tbody> <tr class="odd"> -<td style="text-align: left;">target</td> -<td style="text-align: left;"> - -</td> -<td style="text-align: left;">"editor"</td> +<td align="left"><code>initial.grammar</code></td> +<td align="left">Initial grammar URL, e.g. <code>"http://localhost:41296/grammars/Foods.pgf"</code></td> +<td align="left"></td> </tr> <tr class="even"> -<td style="text-align: left;">initial.grammar</td> -<td style="text-align: left;">Initial grammar URL, e.g. <code>"http://localhost:41296/grammars/Foods.pgf"</code></td> -<td style="text-align: left;"> - -</td> +<td align="left"><code>initial.startcat</code></td> +<td align="left">Initial startcat</td> +<td align="left">(grammar default)</td> +</tr> +<tr class="odd"> +<td align="left"><code>initial.languages</code></td> +<td align="left">Initial linearisation languages, e.g. <code>["Eng","Swe","Mlt"]</code></td> +<td align="left">(all)</td> +</tr> +</tbody> +</table> +<h3 id="editor">Editor</h3> +<table> +<thead> +<tr class="header"> +<th align="left">Options</th> +<th align="left">Description</th> +<th align="left">Default</th> </tr> +</thead> +<tbody> <tr class="odd"> -<td style="text-align: left;">initial.startcat</td> -<td style="text-align: left;">Initial startcat</td> -<td style="text-align: left;">(grammar default)</td> +<td align="left"><code>target</code></td> +<td align="left"></td> +<td align="left">"editor"</td> </tr> <tr class="even"> -<td style="text-align: left;">initial.languages</td> -<td style="text-align: left;">Initial linearisation languages, e.g. <code>["Eng","Swe","Mlt"]</code></td> -<td style="text-align: left;">(all)</td> +<td align="left"><code>initial.abstr</code></td> +<td align="left">Initial abstract tree (as string), e.g. <code>"Pred (That Fish) Expensive"</code></td> +<td align="left"></td> </tr> <tr class="odd"> -<td style="text-align: left;">initial.abstr</td> -<td style="text-align: left;">Initial abstract tree (as string), e.g. <code>"Pred (That Fish) Expensive"</code></td> -<td style="text-align: left;"> - -</td> +<td align="left"><code>lin_action</code></td> +<td align="left">Function called when clicking on the language button beside each linearisation.</td> +<td align="left"></td> </tr> <tr class="even"> -<td style="text-align: left;">show_grammar_menu</td> -<td style="text-align: left;">Show grammar menu?</td> -<td style="text-align: left;">True</td> +<td align="left"><code>lin_action_tooltip</code></td> +<td align="left">Tooltip for the button beside each linearisation.</td> +<td align="left"></td> </tr> <tr class="odd"> -<td style="text-align: left;">show_startcat_menu</td> -<td style="text-align: left;">Show startcat menu?</td> -<td style="text-align: left;">True</td> +<td align="left"><code>show_grammar_menu</code></td> +<td align="left">Show grammar menu?</td> +<td align="left">True</td> </tr> <tr class="even"> -<td style="text-align: left;">show_to_menu</td> -<td style="text-align: left;">Show languages menu?</td> -<td style="text-align: left;">True</td> +<td align="left"><code>show_startcat_menu</code></td> +<td align="left">Show startcat menu?</td> +<td align="left">True</td> </tr> <tr class="odd"> -<td style="text-align: left;">show_random_button</td> -<td style="text-align: left;">Show random button?</td> -<td style="text-align: left;">True</td> +<td align="left"><code>show_to_menu</code></td> +<td align="left">Show languages menu?</td> +<td align="left">True</td> </tr> <tr class="even"> -<td style="text-align: left;">show_import</td> -<td style="text-align: left;">Show import button/panel?</td> -<td style="text-align: left;">True</td> +<td align="left"><code>show_random_button</code></td> +<td align="left">Show random button?</td> +<td align="left">True</td> </tr> <tr class="odd"> -<td style="text-align: left;">show_export</td> -<td style="text-align: left;">Show export button?</td> -<td style="text-align: left;">True</td> +<td align="left"><code>show_import</code></td> +<td align="left">Show import button/panel?</td> +<td align="left">True</td> +</tr> +<tr class="even"> +<td align="left"><code>show_export</code></td> +<td align="left">Show export button?</td> +<td align="left">True</td> </tr> </tbody> </table> @@ -98,7 +115,7 @@ About the syntax editor <li>Usage of printnames</li> <li>Enter string/float/int literals</li> <li>more prominence to Disamb-linearizations</li> -<li>show all resulting linearizations/variants</li> +<li>show all resulting linearization variants</li> <li>undo/redo (or back/forward) navigation</li> <li>structure fridge magnets more (eg newline before the magnet whose first letter is different)</li> </ul> diff --git a/src/www/syntax-editor/ast.js b/src/www/syntax-editor/ast.js index 50c417e96..698272228 100644 --- a/src/www/syntax-editor/ast.js +++ b/src/www/syntax-editor/ast.js @@ -73,6 +73,7 @@ function AST(fun, cat) { return new ASTNode({ "fun": fun, "cat": cat, + "string": "", // for String literals "deps": {}, // dependent types "children": [] }); @@ -304,7 +305,10 @@ function AST(fun, cat) { this.toString = function() { var s = ""; function visit(node) { - s += node.fun ? node.fun : "?" ; + if (node.cat == "String") + s += '"' + ((node.string) ? node.string : "") + '"'; + else + s += node.fun ? node.fun : "?" ; if (!node.hasChildren()) // if (node.children.length == 0) return; diff --git a/src/www/syntax-editor/editor.css b/src/www/syntax-editor/editor.css index 6a23c5bd4..263665bab 100644 --- a/src/www/syntax-editor/editor.css +++ b/src/www/syntax-editor/editor.css @@ -1,4 +1,4 @@ -body.syntax-editor { +body { background: #ccc url("../minibar/brushed-metal.png"); } @@ -124,3 +124,9 @@ body.syntax-editor { padding: 1em; } +/* From http://www.grammaticalframework.org/css/style.css */ +.about table { border-collapse: collapse; } +.about th, +.about td { border: 1px solid #333; padding:0 5px; } +.about td { background: white; } +.about th { background: #9df; } diff --git a/src/www/syntax-editor/editor.js b/src/www/syntax-editor/editor.js index 0f4ab4d4d..c7622a058 100644 --- a/src/www/syntax-editor/editor.js +++ b/src/www/syntax-editor/editor.js @@ -27,6 +27,7 @@ function Editor(gm,opts) { /* --- Creating UI components ------------------------------------------- */ this.container = document.getElementById(this.options.target); this.container.classList.add("editor"); + this.ui = { menubar: div_class("menu"), @@ -150,9 +151,13 @@ Editor.prototype.get_startcat=function() { return this.gm.startcat; } +// Called from Minibar, for example Editor.prototype.initialize_from=function(opts) { - if (opts.abstr) - this.import_ast(opts.abstr); + var t = this; + if (opts.abstr) { + t.ast = new AST(null, t.get_startcat()); + t.import_ast(opts.abstr); + } } // Called after changing grammar or startcat @@ -197,12 +202,37 @@ Editor.prototype.add_refinement=function(fun,opts) { return opt; } +// Add a literal refinement to UI, e.g. String +Editor.prototype.add_literal_refinement=function() { + var t = this; + t.ui.refinements.innerHTML = "Enter string: "; + var nde = t.ast.getCurrentNode(); + var val = (nde.string) ? nde.string : ""; + var input = node("input",{ + type:"text", + value: val + },[]); + // TODO: Perhaps we should have an update button instead + input.onkeyup = function() { + nde.string = input.value; + t.redraw_tree(); + t.update_linearisation(); + } + t.ui.refinements.appendChild(input); +} + // Show refinements for given cat (usually that of current node) Editor.prototype.get_refinements=function(cat) { var t = this; t.ui.refinements.innerHTML = "…"; - if (cat == undefined) - cat = t.ast.getCat(); + if (cat == undefined) cat = t.ast.getCat(); + + // Special case when cat is "String" + if (cat == "String") { + t.add_literal_refinement(); + return; + } + var args = { id: cat, format: "json" @@ -460,9 +490,18 @@ Editor.prototype.redraw_tree=function() { var container2 = empty_class("div", "node"); if (id.get().length == 1) container2.classList.add("first"); - var label = - ((node.fun) ? node.fun : "?") + " : " + - ((node.cat) ? node.cat : "?"); + + // Special case for String literal + if (node.cat == "String") { + var label = + '"' + ((node.string) ? node.string : "") + '"' + + " : String"; + } else { + var label = + ((node.fun) ? node.fun : "?") + " : " + + ((node.cat) ? node.cat : "?"); + } + var current = id.equals(t.ast.getCurrentID()); var element = elem("a", {class:(current?"current":"")}, [text(label)]); element.onclick = function() { diff --git a/src/www/syntax-editor/editor_online.js b/src/www/syntax-editor/editor_online.js index 3067346b7..913bec05a 100644 --- a/src/www/syntax-editor/editor_online.js +++ b/src/www/syntax-editor/editor_online.js @@ -39,14 +39,10 @@ if(window.Minibar) // Minibar loaded? }, // get us back to the editor! abstract_action: function(tree) { - var editor_options = { - target: "editor", - initial: { - grammar: editor.minibar.grammar_menu.value, // hmm - startcat: editor.minibar.input.startcat_menu.value, // hmm - abstr: tree - } + var opts = { + abstr: tree } + editor.initialize_from(opts); editor.minibar.hide(); editor.show(); } |