index.html (2004B)
1 --- 2 date: 2024-06-08 3 title: "Regex engine demo" 4 description: "Simple demo of the regex engine with associated automatons" 5 summary: "Simple demo of the regex engine with associated automatons" 6 showReadingTime: false 7 showWordCount: false 8 --- 9 10 <script type="module" src="dist/main.js"></script> 11 12 <h1>Simple demo</h1> 13 <p> 14 Sorry that this demo kinda sucks, I wrote the HTML by hand. 15 </p> 16 <div> 17 <label for="regex">Regular expression:</label> 18 <input type="text" id="regex" name="regex"> 19 <button type="submit" id="submitRegex" style=" 20 padding: 1px 3px; 21 border-radius: 6px; 22 color: #3D3D3D; 23 background: #fff; 24 "> 25 Generate Automaton 26 </button> 27 <span id="regexError"></span><br> 28 </div> 29 <div> 30 <label for="inputString">Input string:</label> 31 <input type="text" id="inputString" name="inputString"><br> 32 </div> 33 <div> 34 <p> 35 Automaton accepts input: <span id="acceptance" style="font-weight: bold">true</span> 36 </p> 37 </div> 38 <div style="text-align: center"> 39 <div style="display: inline-block; text-align: center; width: 100%"> 40 ε-NFA: <br> 41 <svg id="enfaSVGElement" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" 42 width="500" height="500" 43 xmlns:ev="http://www.w3.org/2001/xml-events" style="overflow: hidden; width: 100%"> 44 </svg> 45 </div> 46 <div style="display: inline-block; text-align: center; width: 100%"> 47 NFA: <br> 48 <svg id="nfaSVGElement" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" 49 width="500" height="500" 50 xmlns:ev="http://www.w3.org/2001/xml-events" style="overflow: hidden; width: 100%"> 51 </svg> 52 </div> 53 <div style="display: inline-block; text-align: center; width: 100%"> 54 DFA:<br> 55 <svg id="dfaSVGElement" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" 56 width="500" height="500" 57 xmlns:ev="http://www.w3.org/2001/xml-events" style="overflow: hidden; width: 100%"> 58 </svg> 59 </div> 60 </div>