mochikit_v14/examples/mochiregexp/index.html

   1 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
   2 <html>
   3     <head>
   4         <title>MochiRegExp - JavaScript Regular Expression (RegExp) Explorer</title>
   5         <link href="mochiregexp.css" rel="stylesheet" type="text/css" />
   6         <script type="text/javascript" src="../../MochiKit/MochiKit.js"></script>
   7         <script type="text/javascript" src="mochiregexp.js"></script>
   8     </head>
   9     <body>
  10         <h1>
  11             MochiRegExp - JavaScript Regular Expression (RegExp) Explorer
  12         </h1>
  13         <div>
  14             <p>
  15                 This demo does "live" Regular Expression matching to help you
  16                 toy with JavaScript Regular Expressions.
  17                 It takes advantage of
  18                 <a href="http://mochikit.com">MochiKit</a>'s
  19                 <a href="../../doc/html/MochiKit/DOM.html">MochiKit.DOM</a>
  20                 to manipulate the display and
  21                 <a href="../../doc/html/MochiKit/Async.html">MochiKit.Async</a>
  22                 to facilitate the "half a second" live updating.
  23             </p>
  24             <p>
  25                 The table will update while you're typing if you're idle for
  26                 half a second or when you tab away from the field, whichever
  27                 comes first.  If you enter an invalid RegExp, the RegExp label
  28                 will turn <span class="error">red</span> (the "error" class).
  29                 For a good JavaScript's RegExp reference, see
  30                 <a href="http://developer.mozilla.org/en/docs/Core_JavaScript_1.5_Guide:Regular_Expressions">Regular Expressions</a>
  31                 over at <a href="http://developer.mozilla.org">DevMo</a>.
  32             </p>
  33         </div>
  34
  35         <form id="regexp_form">
  36             <table class="form">
  37                 <col class="column1">
  38                 <col class="column2">
  39                 <tbody>
  40                     <tr>
  41                         <th><label id="lab_text" for="inp_text">Input Text:</label></th>
  42                         <td><input id="inp_text" name="text" type="text" class="textbox" size="80" /></td>
  43                     </tr>
  44                     <tr>
  45                         <th><label id="lab_regexp" for="inp_regexp">RegExp:</label></th>
  46                         <td><input id="inp_regexp" name="regexp" type="text" class="textbox" size="80" /></td>
  47                     </tr>
  48                     <tr>
  49                         <th></th>
  50                         <td><input type="reset" value="Clear" /></td>
  51                     </tr>
  52                 </tbody>
  53             </table>
  54         </form>
  55
  56         <div>
  57             View Source: [
  58             <a href="index.html" class="view-source">index.html</a> |
  59             <a href="mochiregexp.js" class="view-source">mochiregexp.js</a>
  60             ]
  61         </div>
  62         <table class="datagrid">
  63             <thead>
  64                 <tr>
  65                     <th>Property</th>
  66                     <th>Result</th>
  67                     <th>Repr</th>
  68                 </tr>
  69             </thead>
  70             <tfoot class="invisible"><tr><td colspan="3"></td></tr></tfoot>
  71             <tbody id="result_body"><tr><td colspan="3"></td></tr></tbody>
  72         </table>
  73     </body>
  74 </html>