You cannot select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

125 lines
4.1 KiB
Plaintext

<table id="columns">
<tr>
<td>
<table class="column online" id="left-column">
<tr>
<td class="content-height">
<h2 class="suggestion top">
<span class="step-number">1</span>
<div class="step-title">Write your PEG.js grammar</div>
</h2>
</td>
</tr>
<tr>
<td>
<div class="textarea-wrapper">
<textarea class="code" id="grammar" autocomplete="off" autocorrect="off" autocapitalize="off" spellcheck="false" disabled>
// Simple Arithmetics Grammar
// ==========================
//
// Accepts expressions like "2 * (3 + 4)" and computes their value.
Expression
= head:Term tail:(_ ("+" / "-") _ Term)* {
return tail.reduce(function(result, element) {
if (element[1] === "+") { return result + element[3]; }
if (element[1] === "-") { return result - element[3]; }
}, head);
}
Term
= head:Factor tail:(_ ("*" / "/") _ Factor)* {
return tail.reduce(function(result, element) {
if (element[1] === "*") { return result * element[3]; }
if (element[1] === "/") { return result / element[3]; }
}, head);
}
Factor
= "(" _ expr:Expression _ ")" { return expr; }
/ Integer
Integer "integer"
= _ [0-9]+ { return parseInt(text(), 10); }
_ "whitespace"
= [ \t\n\r]*
</textarea>
</div>
</td>
</tr>
<tr>
<td class="content-height">
<div id="build-message" class="message progress">Loading...</div>
</td>
</tr>
</table>
</td>
<td>
<table class="column" id="right-column">
<tr>
<td class="content-height">
<h2 class="suggestion top">
<span class="step-number">2</span>
<div class="step-title">Test the generated parser with some input</div>
</h2>
</td>
</tr>
<tr>
<td>
<div class="textarea-wrapper">
<textarea class="code" id="input" autocomplete="off" autocorrect="off" autocapitalize="off" spellcheck="false" disabled>2 * (3 + 4)</textarea>
</div>
</td>
</tr>
<tr>
<td class="content-height">
<div id="parse-message" class="message disabled">Parser not available.</div>
</td>
</tr>
<tr>
<td class="content-height">
<h2 id="output-header">Output</h2>
<pre id="output" class="disabled">Output not available.</pre>
</td>
</tr>
<tr>
<td class="content-height">
<h2 class="suggestion">
<span class="step-number">3</span>
<div class="step-title">Download the parser code</div>
</h2>
</td>
</tr>
<tr>
<td class="content-height">
<form method="post" action="/online/download">
<input type="hidden" id="parser-source" name="source">
<input type="submit" id="parser-download" value="Download parser" disabled>
<div id="settings">
<label for="parser-var">Parser variable:</label>
<input type="text" id="parser-var" value="module.exports" disabled>
<div id="options">
<input type="checkbox" id="option-cache" disabled>
<label for="option-cache">Use results cache</label>
<label for="option-optimize">Optimize:</label>
<select id="option-optimize" disabled>
<option value="speed">Parsing speed</option>
<option value="size">Code size</option>
</select>
</div>
</div>
</from>
</td>
</tr>
</table>
</td>
</tr>
</table>
<script src="https://unpkg.com/jquery@1.12.4/dist/jquery.min.js"></script>
<script src="<%- pegjs %>"></script>
<script src="/vendor/jsdump/jsDump.js"></script>
<script src="/vendor/codemirror/codemirror.js"></script>
<script src="/js/online.js"></script>