From 949dcb9d3512ede93d057052651487b7ba1ec1a3 Mon Sep 17 00:00:00 2001
From: Joseph Schorr <josephschorr@users.noreply.github.com>
Date: Thu, 15 Sep 2016 13:25:57 -0400
Subject: [PATCH] Add regex validating field

---
 .../create-external-notification.html         |  7 ++--
 static/directives/regex-editor.html           |  4 ++
 static/js/directives/ui/regex-editor.js       | 39 +++++++++++++++++++
 .../js/services/external-notification-data.js |  3 ++
 4 files changed, 50 insertions(+), 3 deletions(-)
 create mode 100644 static/directives/regex-editor.html
 create mode 100644 static/js/directives/ui/regex-editor.js

diff --git a/static/directives/create-external-notification.html b/static/directives/create-external-notification.html
index 65ba8bc9b..7bc684365 100644
--- a/static/directives/create-external-notification.html
+++ b/static/directives/create-external-notification.html
@@ -39,9 +39,10 @@
                   </select>
 
                   <!-- Regular expression -->
-                  <input type="text" class="form-control" ng-model="currentConfig[field.name]" ng-switch-when="regex"
-                         placeholder="{{ field.placeholder || '' }}"
-                         ng-required="!field.optional">
+                  <div ng-switch-when="regex">
+                    <div class="regex-editor" placeholder="{{field.placeholder || '' }}"
+                         binding="currentConfig[field.name]" optional="field.optional"></div>
+                  </div>
 
                   <!-- Value description -->
                   <div class="co-alert co-alert-info"
diff --git a/static/directives/regex-editor.html b/static/directives/regex-editor.html
new file mode 100644
index 000000000..96201d7d0
--- /dev/null
+++ b/static/directives/regex-editor.html
@@ -0,0 +1,4 @@
+<div class="regex-editor-element">
+  <input name="regexField" type="text" class="form-control" ng-model="binding" placeholder="{{ placeholder || '' }}"
+         ng-required="!optional" require-valid-regex>
+</div>
\ No newline at end of file
diff --git a/static/js/directives/ui/regex-editor.js b/static/js/directives/ui/regex-editor.js
new file mode 100644
index 000000000..4b3358c49
--- /dev/null
+++ b/static/js/directives/ui/regex-editor.js
@@ -0,0 +1,39 @@
+/**
+ * An element which displays an edit box for regular expressions.
+ */
+angular.module('quay').directive('regexEditor', function () {
+  var directiveDefinitionObject = {
+    priority: 0,
+    templateUrl: '/static/directives/regex-editor.html',
+    replace: false,
+    transclude: true,
+    restrict: 'C',
+    scope: {
+      'placeholder': '@placeholder',
+      'optional': '=optional',
+      'binding': '=binding'
+    },
+    controller: function($scope, $element) {
+    }
+  };
+  return directiveDefinitionObject;
+});
+
+angular.module('quay').directive('requireValidRegex', function() {
+  return {
+    require: 'ngModel',
+    link: function(scope, element, attr, ctrl) {
+      function validator(value) {
+        try {
+          new RegExp(value)
+          ctrl.$setValidity('regex', true);
+        } catch (e) {
+          ctrl.$setValidity('regex', false);
+        }
+        return value;
+      }
+
+      ctrl.$parsers.push(validator);
+    }
+  };
+});
\ No newline at end of file
diff --git a/static/js/services/external-notification-data.js b/static/js/services/external-notification-data.js
index 997fe96d8..623f1445d 100644
--- a/static/js/services/external-notification-data.js
+++ b/static/js/services/external-notification-data.js
@@ -45,6 +45,7 @@ function(Config, Features, VulnerabilityService) {
             'help_text': 'An optional regular expression for matching the git branch or tag ' +
                          'git ref. If left blank, the notification will fire for all builds.',
             'optional': true,
+            'placeholder': '(refs/heads/somebranch)|(refs/tags/sometag)'
           }
         ]
       },
@@ -60,6 +61,7 @@ function(Config, Features, VulnerabilityService) {
             'help_text': 'An optional regular expression for matching the git branch or tag ' +
                          'git ref. If left blank, the notification will fire for all builds.',
             'optional': true,
+            'placeholder': '(refs/heads/somebranch)|(refs/tags/sometag)'
           }
         ]
       },
@@ -75,6 +77,7 @@ function(Config, Features, VulnerabilityService) {
             'help_text': 'An optional regular expression for matching the git branch or tag ' +
                          'git ref. If left blank, the notification will fire for all builds.',
             'optional': true,
+            'placeholder': '(refs/heads/somebranch)|(refs/tags/sometag)'
           }
         ]
       }];