Subscriber form validation

Added a subscriber validator to prevent users from submitting invalid
subscribers. Valid formats are assumed to be http:// https:// and mailto:

Added a minimum value of 60 for ttl. When user adjusts value below 60,
an error message will appear.

Change-Id: I6143d00f128fa7c13b5d6687f48425be47f1208f

zaqar_ui/static/dashboard/project/queues/steps/subscription/subscription.controller.js

@@ -36,7 +36,7 @@
   function SubscriptionController($scope, zaqar, events) {
 
     var ctrl = this;
-    ctrl.subscription = {};
+    ctrl.subscription = { ttl: 3600 };
     ctrl.update = false;
 
     ////////////////////////

zaqar_ui/static/dashboard/project/queues/steps/subscription/subscription.html

@@ -6,14 +6,13 @@
 
     <div class="subtitle" translate>
       Note that you can create a subscription without defining options.
-      Subscribers must be in the form of mailto, HTTP, or HTTPS.
-      The TTL for a subscription must be at least 60 seconds long.
     </div>
 
     <div class="selected-source clearfix">
       <div class="row">
         <div class="col-xs-12 col-sm-8">
-          <div class="form-group required">
+          <div class="form-group required"
+            ng-class="{'has-error': subscriptionForm.subscriber.$invalid && subscriptionForm.subscriber.$dirty}">
             <label class="control-label required">
               <translate>Subscriber</translate>
               <span class="hz-icon-required fa fa-asterisk"></span>
@@ -24,21 +23,31 @@
               ng-model="detailsCtrl.subscription.subscriber"
               ng-maxlength="255"
               ng-disabled="detailsCtrl.update"
+              validate-subscriber
               placeholder="{$ 'Enter a subscriber'|translate $}">
+            <p class="help-block alert alert-danger" translate
+              ng-show="subscriptionForm.subscriber.$invalid && subscriptionForm.subscriber.$dirty">
+              Subscribers must be in the form of mailto, HTTP, or HTTPS.
+            </p>
           </div>
         </div>
         <div class="col-xs-12 col-sm-8">
-          <div class="form-group required">
+          <div class="form-group required"
+            ng-class="{'has-error': subscriptionForm.ttl.$invalid && subscriptionForm.ttl.$dirty}">
             <label class="control-label required" translate>
               <translate>Time To Live</translate>
               <span class="hz-icon-required fa fa-asterisk"></span>
             </label>
             <input required
-               id="" name="ttl" min="60"
-               type="number" class="form-control"
-               ng-model="detailsCtrl.subscription.ttl"
-               ng-disabled="detailsCtrl.update"
-               placeholder="{$ 'Enter TTL for subscription'|translate $}">
+              id="subscriptionForm-ttl" name="ttl"
+              min="60" step="10"
+              type="number" class="form-control"
+              ng-model="detailsCtrl.subscription.ttl"
+              ng-disabled="detailsCtrl.update">
+            <p class="help-block alert alert-danger" translate
+              ng-show="subscriptionForm.ttl.$invalid && subscriptionForm.ttl.$dirty">
+              The TTL for a subscription must be at least 60 seconds long.
+            </p>
           </div>
         </div>
       </div><!-- row -->

zaqar_ui/static/framework/util/validators/validateSubscriber.js

@@ -0,0 +1,64 @@
+/**
+ * Copyright 2016 IBM Corp.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License"); you may
+ * not use this file except in compliance with the License. You may obtain
+ * a copy of the License at
+ *
+ *    http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
+ * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
+ * License for the specific language governing permissions and limitations
+ * under the License.
+ */
+
+(function () {
+  'use strict';
+
+  /**
+   * @ngdoc directive
+   * @name validateSubscriber
+   * @restrict A
+   *
+   * @description
+   * A valid subscriber must be in the form of mailto, HTTP, or HTTPS.
+   * This validator checks for the correct format.
+   *
+   * @example
+   * ```
+   * <input type="text" ng-model="someValue" validate-subscriber">
+   * ```
+   */
+  angular
+    .module('horizon.framework.util.validators')
+    .directive('validateSubscriber', validateSubscriber);
+
+  function validateSubscriber() {
+
+    var regex = /^(http:\/\/\w+|https:\/\/\w+|mailto:\w+)/
+    var directive = {
+      require: 'ngModel',
+      restrict: 'A',
+      link: link
+    };
+
+    return directive;
+
+    ////////////////
+
+    function link(scope, element, attrs, ctrl) {
+
+      if (!ctrl) { return; }
+      ctrl.$parsers.push(subValidator);
+      ctrl.$formatters.push(subValidator);
+
+      function subValidator(value) {
+        ctrl.$setValidity('validateSubscriber', regex.test(value));
+        return value;
+      }
+    } // end of link
+  } // end of validateSubscriber
+
+})();