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
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>
|