Merge pull request #44 from moshfeu/regex-error

Display an error message when the regex is invalid #43

Author: jonmagic

application.css

@@ -229,17 +229,22 @@ input, textarea, #results, #groups {
   width: 565px;
 }
 
-#output, #error {
+#output, #error, #regex-error {
   display: none;
 }
 
-#intro, #error, #output {
+#intro, #error, #output, #regex-error {
   margin: 10px -30px -30px -30px;
   padding: 30px;
   background-color: #eef;
   border-top: 1px solid #dde;
 }
 
+#regex-error {
+  color: #f7296f;
+  font-size: 14px;
+}
+
 #results li {
   margin-bottom: 10px;
 }

index.html

@@ -56,6 +56,9 @@ <h2>Test Strings:</h2>
       <div id="error">
         <p>No Matches</p>
       </div>
+      <div id="regex-error">
+        <p>Invalid regular expression</p>
+      </div>
 
       <div id="output">
         <h2>Match Results:</h2>

scripts/application.coffee

@@ -47,6 +47,12 @@ class Results
     $('ul#groups').empty()
     count = 1
 
+    if @expression.regexp.val() != ''
+      try
+        new RegExp(@expression.regexp.val())
+      catch
+        @showRegexError()
+        return true
     if @expression.regexp.val() == '' && @test_strings.input.val() == ''
       @showIntro()
       return true
@@ -72,11 +78,11 @@ class Results
     url += "/#" + expression_url + encodeURIComponent("||||") + test_strings_url
     $("#share_link").attr("href", url)
 
-  ### 
+  ###
     escape function from Peter Hoffman found at
     http://peter-hoffmann.com/2012/coffeescript-string-interpolation-with-html-escaping.html
   ###
-  escape: (s) -> 
+  escape: (s) ->
     (''+s).replace(/&/g, '&amp;').replace(/</g, '&lt;')
       .replace(/>/g, '&gt;').replace(/"/g, '&quot;')
       .replace(/'/g, '&#x27;').replace(/\//g,'&#x2F;')
@@ -117,16 +123,25 @@ class Results
     $('#error').hide()
     $('#output').hide()
     $('#intro').show()
+    $('#regex-error').hide()
 
   showError: ->
     $('#intro').hide()
     $('#output').hide()
     $('#error').show()
+    $('#regex-error').hide()
 
   showOutput: ->
     $('#intro').hide()
     $('#error').hide()
     $('#output').show()
+    $('#regex-error').hide()
+
+  showRegexError: ->
+    $('#intro').hide()
+    $('#error').hide()
+    $('#output').hide()
+    $('#regex-error').show()
 
 class App
   constructor: ->