Allow users to create functions in a non-default NS from ui

This allows a uswer to select a non-standard (not openfaas-fn)
namespace from the UI to deploy a function into.

Signed-off-by: Alistair Hey <alistair@heyal.co.uk>

gateway/assets/index.html

@@ -47,14 +47,6 @@
 
                 <md-content layout-padding>
 
-                    <md-input-container>
-                        <md-select ng-model="namespaceSelect" placeholder="Select a Namespace">
-                            <md-option ng-click="setNamespace(namespace)" ng-value="namespace" ng-repeat="namespace in allNamespaces">
-                                Namespace(s): {{ namespace }}
-                            </md-option>
-                        </md-select>
-                    </md-input-container>
-
                     <md-list>
                         <md-list-item class="primary-item" ng-disabled="isFunctionBeingCreated" ng-click="newFunction()">
                             <md-icon style="margin-right: 16px" md-svg-icon="img/icons/ic_shop_two_black_24px.svg"></md-icon>
@@ -62,6 +54,15 @@
                         </md-list-item>
                     </md-list>
 
+                    <md-input-container>
+                        <label>Namespace</label>
+                        <md-select  ng-model="namespaceSelect" placeholder="Select a Namespace">
+                            <md-option ng-click="setNamespace(namespace)" ng-value="namespace" ng-repeat="namespace in allNamespaces">
+                                {{ namespace }}
+                            </md-option>
+                        </md-select>
+                    </md-input-container>
+
                     <md-input-container ng-hide="functions.length === 0" class="md-block" flex-gt-sm>
                         <label style="padding-left: 8px">Search for Function</label>
                         <input ng-model="search.name">

gateway/assets/script/bootstrap.js

@@ -23,6 +23,7 @@ app.controller("home", ['$scope', '$log', '$http', '$location', '$interval', '$f
             contentType: "text"
         };
 
+        $scope.namespaceSelect = $scope.selectedNamespace;
         $scope.baseUrl = $location.absUrl().replace(/\ui\/$/, '');
         try {
             $scope.canCopyToClipboard = document.queryCommandSupported('copy');
@@ -54,7 +55,8 @@ app.controller("home", ['$scope', '$log', '$http', '$location', '$interval', '$f
             envVars: {},
             labels: {},
             annotations: {},
-            secrets: []
+            secrets: [],
+            namespace: "",
         };
 
         $scope.invocation.request = "";
@@ -69,6 +71,8 @@ app.controller("home", ['$scope', '$log', '$http', '$location', '$interval', '$f
                 })
         };
 
+
+
         var fetchFunctionsInterval = $interval(function() {
             refreshData($scope.selectedNamespace);
         }, fetchFunctionsDelay);
@@ -260,13 +264,20 @@ app.controller("home", ['$scope', '$log', '$http', '$location', '$interval', '$f
                 targetEvent: $event,
                 templateUrl: "templates/newfunction.html",
                 locals: {
-                    item: $scope.functionTemplate
+                    item: $scope.functionTemplate,
+                    allNamespaces: $scope.allNamespaces
                 },
                 controller: DialogController
             });
         };
 
         var DialogController = function($scope, $mdDialog, item) {
+            var fetchNamespaces = function () {
+                $http.get("../system/namespaces")
+                    .then(function(response) {
+                        $scope.allNamespaces = response.data;
+                    })
+            }
             $scope.selectedTabIdx = newFuncTabIdx;
             $scope.item = {};
             $scope.selectedFunc = null;
@@ -281,6 +292,9 @@ app.controller("home", ['$scope', '$log', '$http', '$location', '$interval', '$f
 
             $scope.annotationFieldsVisible = false;
             $scope.annotationInputs = [{key: "", value: ""}];
+            $scope.namespaceSelect = "openfaas-fn";
+            fetchNamespaces();
+
 
             $scope.closeDialog = function() {
                 $mdDialog.hide();
@@ -295,6 +309,8 @@ app.controller("home", ['$scope', '$log', '$http', '$location', '$interval', '$f
                 $scope.labelsToLabelInputs(func.labels);
                 $scope.annotationsToAnnotationInputs(func.annotations);
                 $scope.secretsToSecretInputs(func.secrets);
+                $scope.item.namespace = func.selectedNamespace;
+
 
                 $scope.selectedFunc = func;
             }
@@ -316,6 +332,7 @@ app.controller("home", ['$scope', '$log', '$http', '$location', '$interval', '$f
                 $scope.item.secrets = $scope.secretInputsToSecrets();
                 $scope.item.labels = $scope.labelInputsToLabels();
                 $scope.item.annotations = $scope.annotationInputsToAnnotations();
+                $scope.item.namespace = $scope.namespaceSelected();
 
                 var options = {
                     url: "../system/functions",
@@ -335,6 +352,7 @@ app.controller("home", ['$scope', '$log', '$http', '$location', '$interval', '$f
                         item.labels = {};
                         item.annotations = {};
                         item.secrets = [];
+                        item.namespace = "openfaas-fn";
 
                         $scope.validationError = "";
                         $scope.closeDialog();
@@ -509,6 +527,11 @@ app.controller("home", ['$scope', '$log', '$http', '$location', '$interval', '$f
                 return result;
             }
 
+            $scope.namespaceSelected = function() {
+                var self = this;
+                return self.namespaceSelect;
+            }
+
             $scope.annotationsToAnnotationInputs = function(annotations) {
                 var result = [];
                 for (var a in annotations) {

gateway/assets/templates/newfunction.html

@@ -58,6 +58,17 @@
                                 <input name="network" ng-model="item.network" md-maxlength="200" minlength="0">
                             </md-input-container>
                         </div>
+                        <div layout-gt-xs="row">
+                            <md-input-container class="md-block" flex-gt-sm>
+                                <md-tooltip md-direction="bottom">Namespace your function runs in i.e. 'openfaas-fn'. Only namespaces OpenFaaS can manage will show here</md-tooltip>
+                                <label>Namespace</label>
+                                <md-select name="namespace" ng-model="namespaceSelect" placeholder="Select a Namespace">
+                                    <md-option ng-value="namespace" ng-repeat="namespace in allNamespaces">
+                                        {{ namespace }}
+                                    </md-option>
+                                </md-select>
+                            </md-input-container>
+                        </div>
                         <br />
                         <div layout-gt-xs="column">
                             <div layout-gt-xs="row" ng-click="onEnvInputExpand()" stop-propagation>