-
Notifications
You must be signed in to change notification settings - Fork 4
/
Copy pathindex.html
35 lines (31 loc) · 1.97 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
<!DOCTYPE html>
<html><head>
<meta charset="utf-8">
<title>Online PEG Syntax Highlighter - PEGSH</title>
<link rel="stylesheet" type="text/css" href="pegsh.css">
<style type="text/css" id="custom"></style>
</head><body>
<h1>PEGSH - A Free Online PEG Syntax Highlighter <span> <a href="https://github.com/Phrogz/PEGSH/blob/master/README.md#documentation" target="GitHub">docs</a> <a href="http://github.com/Phrogz/PEGSH" target="GitHub">code</a></span></h1>
<div id="peg"><h2>PEG <span>(the <a href="http://pegjs.majda.cz/documentation#grammar-syntax-and-semantics" target="peg_grammar" title="Open PEG Syntax in a new window">parsing expression grammar</a>)</span></h2>
<div class="wrapper"><textarea autocomplete="off" autocorrect="off" autocapitalize="off" spellcheck="false">paragraph = sentence+
sentence = (word sp)+ word punctuation sp?
word = [a-zA-Z]+
sp = ' '
punctuation = [.!]</textarea></div></div>
<div id="css"><h2>CSS <span>(each peg rule is a css class)</span></h2>
<div class="wrapper"><textarea autocomplete="off" autocorrect="off" autocapitalize="off" spellcheck="false">
#output { background:#eee }
.paragraph { display:block; padding:3px; border:1px solid blue }
.sentence { border:1px solid rgba(0,180,0,0.5) }
.word { color:red }
.punctuation { color:blue }
.sp { background:rgba(255,255,0,0.5) }</textarea></div></div>
<div id="inp"><h2>Raw Input <span>(the stuff to parse)</span></h2>
<div class="wrapper"><textarea autocomplete="off" autocorrect="off" autocapitalize="off" spellcheck="false" wrap="off">Hello cats. Goodbye dogs!</textarea></div></div>
<div id="out"><h2>Syntax-Highlighted Result <span>(or maybe error messages)</span></h2>
<div class="wrapper"><pre id="output"></pre></div></div>
<script type="text/javascript" src="lib/peg-0.8.0.min.js"></script>
<script type="text/javascript" src="lib/utils.js"></script>
<script type="text/javascript" src="pegsh.js"></script>
<footer>Copyright ©2014-2018 <a href="http://phrogz.net/">Gavin Kistner</a></footer>
</body></html>