lpil/elixre

<main class="test" role="main" ng-controller="testController">
  <div class="inputs">
    <div>
      <label for="regex" class="regex-label">Regex</label>
      <input name="regex"
             type="text"
             class="regex-input"
             autofocus
             ng-trim="false"
             ng-model="regex"
             ng-change="test(regex, subject, modifiers)"
             ng-model-options="{ debounce: 150 }"/>

      <label for="modifiers" class="modifiers-label">Modifiers</label>
      <input name="modifiers"
             type="text"
             class="modifiers-input"
             ng-model="modifiers"
             ng-pattern="validModifiers"
             ng-change="test(regex, subject, modifiers)"
             ng-model-options="{ debounce: 150 }"/>
    </div>

    <div>
      <label for="subject">Subject</label>
      <textarea name="subject"
                rows=5
                ng-trim="false"
                ng-model="subject"
                ng-change="test(regex, subject, modifiers)"
                ng-model-options="{ debounce: 150 }"
                ></textarea>
      <label for="split" class="subject-split">Split on newlines?</label>
      <input type="checkbox" name="split" class="subject-split"
             ng-change="test(regex,subject)" ng-model="split">
    </div>
  </div>

  <div ng-controller="resultsController" class="results">
    <pre><div class="results__error"
              ng-if="return.error"
              ng-bind="'Compilation Error! \n' + (return.error | json)"></div

              ><div class="results__regex"
              ng-if="return.regex"
              ng-bind="'# ' + return.regex + '\n\n'"></div

              ><div class="results__result"
              ng-repeat="case in return.results"
              ><result data="case"></div></pre>
  </div>
</main>

<div class="reference">
  <p>Reference</p>
  <ul>
    <li><code>.</code> non-newline char</li>
    <li><code>^</code> start of line</li>
    <li><code>$</code> end of line</li>
    <li><code>\b</code> word boundary</li>
    <li><code>\b</code> word boundary</li>
    <li><code>\A</code> start of subject</li>
    <li><code>\z</code> end of subject</li>
    <li><code>\d</code> decimal digit</li>
    <li><code>\D</code> non-decimal digit</li>
    <li><code>\s</code> whitespace</li>
    <li><code>\S</code> non-whitespace</li>
    <li><code>\w</code> word character</li>
    <li><code>\W</code> non-word character</li>
    <li><code>(a|z)</code> a or z</li>
    <li><code>[az]</code> a or z</li>
    <li><code>[^az]</code> not a or z</li>
    <li><code>[a-z]</code> a through z</li>
    <li><code>(foo)</code> capture foo</li>
    <li><code>a?</code> 0 or 1 a</li>
    <li><code>a*</code> 0 or more a</li>
    <li><code>a+</code> 1 or more a</li>
    <li><code>a{3}</code> 3 of a</li>
    <li><code>a{3,}</code> 3 or more a</li>
    <li><code>a{3,5}</code> 3 through 5 a</li>
  </ul>
  <p>Modifiers</p>
  <ul>
    <li><code>u</code> unicode</li>
    <li><code>i</code> case insensitive</li>
    <li><code>s</code> dot matches newline</li>
    <li><code>m</code> multiline</li>
    <li><code>x</code> whitespace ignored</li>
    <li><code>f</code> start on first line</li>
    <li><code>r</code> inverts greediness</li>
  </ul>
  <p class="reference__more">
  For more information see the Elixir
  <a href="http://elixir-lang.org/docs/v1.0/elixir/Regex.html" target="_blank">
    Regex documentation</a>, and the Erlang
  <a href="http://www.erlang.org/doc/man/re.html" target="_blank">re
  documentation</a>.
  </p>
</div>