Better handling of namespace validation to fix a number of issues

- Fixes a bug which allows for underscores at the beginning of namespaces: Fixes #1849
- Allows dots and dashes for newer Docker clients: Fixes #1188
- Has the UI display better messaging associated with namespace entry

static/js/app.js

@@ -1,6 +1,6 @@
 var TEAM_PATTERN = '^[a-z][a-z0-9]+$';
 var ROBOT_PATTERN = '^[a-z][a-z0-9_]{3,29}$';
-var USER_PATTERN = '^[a-z0-9_]{4,30}$';
+var USERNAME_PATTERN = '^([a-z0-9]+(?:[._-][a-z0-9]+)*){4,30}$';
 
 // Define the pages module.
 quayPages = angular.module('quayPages', [], function(){});

static/js/directives/ui/namespace-input.js

@@ -0,0 +1,32 @@
+/**
+ * An element which displays an input box for creating a namespace.
+ */
+angular.module('quay').directive('namespaceInput', function () {
+  var directiveDefinitionObject = {
+    priority: 0,
+    templateUrl: '/static/directives/namespace-input.html',
+    replace: false,
+    transclude: true,
+    restrict: 'C',
+    scope: {
+      'binding': '=binding',
+      'isBackIncompat': '=isBackIncompat',
+      'namespaceTitle': '@namespaceTitle',
+    },
+    controller: function($scope, $element) {
+      $scope.USERNAME_PATTERN = USERNAME_PATTERN;
+      $scope.usernamePattern = new RegExp(USERNAME_PATTERN);
+
+
+      $scope.$watch('binding', function(binding) {
+        if (!binding) {
+          $scope.isBackIncompat = false;
+          return;
+        }
+
+        $scope.isBackIncompat = (binding.indexOf('-') > 0 || binding.indexOf('.') > 0);
+      })
+    }
+  };
+  return directiveDefinitionObject;
+});

static/js/pages/new-organization.js

@@ -54,9 +54,9 @@
     };
 
     $scope.createNewOrg = function() {
-      $('#orgName').popover('hide');
-
+      $scope.createError = null;
       $scope.creating = true;
+
       var org = $scope.org;
       var data = {
         'name': org.name,
@@ -96,9 +96,6 @@
       }, function(resp) {
         $scope.creating = false;
         $scope.createError = ApiService.getErrorMessage(resp);
-        $timeout(function() {
-          $('#orgName').popover('show');
-        });
       });
     };
   }