mirror of
https://github.com/openfaas/faas.git
synced 2025-06-09 08:46:48 +00:00
Change how and when we fetch and parse namespace info
Signed-off-by: Alistair Hey <alistair@heyal.co.uk>
This commit is contained in:
parent
2fd7989d3f
commit
59b7839236
@ -54,10 +54,10 @@
|
|||||||
</md-list-item>
|
</md-list-item>
|
||||||
</md-list>
|
</md-list>
|
||||||
|
|
||||||
<md-input-container ng-show="allNamespaces.length > 1">
|
<md-input-container ng-show="allNamespaces.length > 1" class="display-flex">
|
||||||
<label>Namespace</label>
|
<label>Namespace</label>
|
||||||
<md-select ng-model="namespaceSelectDropdown" placeholder="Select a Namespace">
|
<md-select ng-model="namespaceSelectDropdown" placeholder="Select a Namespace">
|
||||||
<md-option ng-click="setNamespace(namespace)" ng-value="namespace" ng-repeat="namespace in allNamespaces">
|
<md-option ng-click="setNamespace(namespace)" ng-value="namespace" ng-repeat="namespace in allNamespaces" ng-selected="namespace === selectedNamespace">
|
||||||
{{ namespace }}
|
{{ namespace }}
|
||||||
</md-option>
|
</md-option>
|
||||||
</md-select>
|
</md-select>
|
||||||
@ -140,7 +140,7 @@
|
|||||||
</md-input-container>
|
</md-input-container>
|
||||||
<md-input-container class="md-block function-url" flex-gt-sm>
|
<md-input-container class="md-block function-url" flex-gt-sm>
|
||||||
<label>URL</label>
|
<label>URL</label>
|
||||||
<input ng-value="function.namespace === 'openfaas-fn' ? baseUrl + 'function/' + function.name : baseUrl + 'function/' + function.name + '.' + function.namespace" type="text" readonly="readonly">
|
<input ng-value="(function.namespace && function.namespace.length > 0)? baseUrl + 'function/' + function.name + '.' + function.namespace : baseUrl + 'function/' + function.name" type="text" readonly="readonly">
|
||||||
<md-icon ng-if="canCopyToClipboard" md-svg-src="img/icons/outline-file_copy-24px.svg" ng-click="copyClicked($event)"></md-icon>
|
<md-icon ng-if="canCopyToClipboard" md-svg-src="img/icons/outline-file_copy-24px.svg" ng-click="copyClicked($event)"></md-icon>
|
||||||
</md-input-container>
|
</md-input-container>
|
||||||
</div>
|
</div>
|
||||||
|
103
gateway/assets/script/bootstrap.js
vendored
103
gateway/assets/script/bootstrap.js
vendored
@ -17,13 +17,14 @@ app.controller("home", ['$scope', '$log', '$http', '$location', '$interval', '$f
|
|||||||
$scope.invocationStatus = "";
|
$scope.invocationStatus = "";
|
||||||
$scope.invocationStart = new Date().getTime();
|
$scope.invocationStart = new Date().getTime();
|
||||||
$scope.roundTripDuration = "";
|
$scope.roundTripDuration = "";
|
||||||
$scope.selectedNamespace = "openfaas-fn";
|
$scope.selectedNamespace = "";
|
||||||
$scope.allNamespaces = ["openfaas-fn"];
|
$scope.allNamespaces = [""];
|
||||||
$scope.invocation = {
|
$scope.invocation = {
|
||||||
contentType: "text"
|
contentType: "text"
|
||||||
};
|
};
|
||||||
|
|
||||||
$scope.baseUrl = $location.absUrl().replace(/\ui\/$/, '');
|
$scope.baseUrl = $location.absUrl().replace(/\ui\/$/, '');
|
||||||
|
|
||||||
try {
|
try {
|
||||||
$scope.canCopyToClipboard = document.queryCommandSupported('copy');
|
$scope.canCopyToClipboard = document.queryCommandSupported('copy');
|
||||||
} catch (err) {
|
} catch (err) {
|
||||||
@ -65,15 +66,19 @@ app.controller("home", ['$scope', '$log', '$http', '$location', '$interval', '$f
|
|||||||
var fetchFunctionsDelay = 3500;
|
var fetchFunctionsDelay = 3500;
|
||||||
var queryFunctionDelay = 2500;
|
var queryFunctionDelay = 2500;
|
||||||
|
|
||||||
var fetchNamespacesInterval = function() {
|
|
||||||
$http.get("../system/namespaces")
|
|
||||||
.then(function(response) {
|
|
||||||
$scope.allNamespaces = response.data;
|
|
||||||
})
|
|
||||||
};
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
$http.get("../system/namespaces")
|
||||||
|
.then(function(response) {
|
||||||
|
$scope.allNamespaces = response.data;
|
||||||
|
if ($scope.selectedNamespace === "" && response.data && response.data[0] && response.data[0] !== "") {
|
||||||
|
$scope.selectedNamespace = response.data[0]
|
||||||
|
refreshData($scope.selectedNamespace)
|
||||||
|
}
|
||||||
|
})
|
||||||
|
|
||||||
|
|
||||||
var fetchFunctionsInterval = $interval(function() {
|
var fetchFunctionsInterval = $interval(function() {
|
||||||
refreshData($scope.selectedNamespace);
|
refreshData($scope.selectedNamespace);
|
||||||
}, fetchFunctionsDelay);
|
}, fetchFunctionsDelay);
|
||||||
@ -86,13 +91,16 @@ app.controller("home", ['$scope', '$log', '$http', '$location', '$interval', '$f
|
|||||||
|
|
||||||
$scope.setNamespace = function(namespace) {
|
$scope.setNamespace = function(namespace) {
|
||||||
$scope.selectedNamespace = namespace;
|
$scope.selectedNamespace = namespace;
|
||||||
refreshData($scope.selectedNamespace)
|
$scope.selectedFunction = undefined;
|
||||||
|
$scope.functions = [];
|
||||||
|
refreshData($scope.selectedNamespace)
|
||||||
}
|
}
|
||||||
|
|
||||||
var refreshFunction = function(functionInstance) {
|
var refreshFunction = function(functionInstance) {
|
||||||
$http.get("../system/function/" + functionInstance.name + "?namespace=" + $scope.selectedNamespace)
|
const url = "/system/function/" + functionInstance.name;
|
||||||
|
$http.get(buildNamespaceAwareURL(url, $scope.selectedNamespace))
|
||||||
.then(function(response) {
|
.then(function(response) {
|
||||||
functionInstance.ready = (response.data && response.data.availableReplicas && response.data.availableReplicas > 0);
|
$scope.selectedFunction.ready = (response.data && response.data.availableReplicas && response.data.availableReplicas > 0);
|
||||||
})
|
})
|
||||||
.catch(function(err) {
|
.catch(function(err) {
|
||||||
console.error(err);
|
console.error(err);
|
||||||
@ -114,7 +122,7 @@ app.controller("home", ['$scope', '$log', '$http', '$location', '$interval', '$f
|
|||||||
requestContentType = "binary/octet-stream";
|
requestContentType = "binary/octet-stream";
|
||||||
}
|
}
|
||||||
|
|
||||||
var fnNamespace = ($scope.selectedNamespace !== "openfaas-fn") ? "." + $scope.selectedNamespace : "";
|
var fnNamespace = ($scope.selectedNamespace && $scope.selectedNamespace.length > 0) ? "." + $scope.selectedNamespace : "";
|
||||||
var options = {
|
var options = {
|
||||||
url: "../function/" + $scope.selectedFunction.name + fnNamespace,
|
url: "../function/" + $scope.selectedFunction.name + fnNamespace,
|
||||||
data: $scope.invocation.request,
|
data: $scope.invocation.request,
|
||||||
@ -204,42 +212,16 @@ app.controller("home", ['$scope', '$log', '$http', '$location', '$interval', '$f
|
|||||||
};
|
};
|
||||||
|
|
||||||
var refreshData = function (selectedNamespace) {
|
var refreshData = function (selectedNamespace) {
|
||||||
var previous = $scope.functions;
|
$http.get(buildNamespaceAwareURL("/system/functions", selectedNamespace)).then(function (response) {
|
||||||
|
const curNamespace = ($scope.functions.length > 0 && $scope.functions[0].namespace && $scope.functions[0].namespace) ? $scope.functions[0].namespace : "";
|
||||||
|
const newNamespace = (response.data && response.data[0] && response.data[0].namespace) ? response.data[0].namespace : "";
|
||||||
|
|
||||||
var cl = function (previousItems) {
|
if (response && response.data && (curNamespace !== newNamespace || $scope.functions.length != response.data.length)) {
|
||||||
$http.get("../system/functions?namespace=" + selectedNamespace).then(function (response) {
|
$scope.functions = response.data;
|
||||||
if (response && response.data) {
|
if (!$scope.functions.indexOf($scope.selectedFunction )) {
|
||||||
if (previousItems.length != response.data.length) {
|
$scope.selectedFunction = undefined;
|
||||||
$scope.functions = response.data;
|
}
|
||||||
|
}
|
||||||
// update the selected function object because the newly fetched object from the API becomes a different object
|
|
||||||
var filteredSelectedFunction = $filter('filter')($scope.functions, { name: $scope.selectedFunction.name }, true);
|
|
||||||
if (filteredSelectedFunction && filteredSelectedFunction.length > 0) {
|
|
||||||
$scope.selectedFunction = filteredSelectedFunction[0];
|
|
||||||
} else {
|
|
||||||
$scope.selectedFunction = undefined;
|
|
||||||
}
|
|
||||||
} else {
|
|
||||||
for (var i = 0; i < $scope.functions.length; i++) {
|
|
||||||
for (var j = 0; j < response.data.length; j++) {
|
|
||||||
if ($scope.functions[i].name == response.data[j].name) {
|
|
||||||
$scope.functions[i].image = response.data[j].image;
|
|
||||||
$scope.functions[i].replicas = response.data[j].replicas;
|
|
||||||
$scope.functions[i].invocationCount = response.data[j].invocationCount;
|
|
||||||
$scope.functions[i].namespace = response.data[j].namespace;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
});
|
|
||||||
};
|
|
||||||
cl(previous);
|
|
||||||
}
|
|
||||||
|
|
||||||
var fetch = function() {
|
|
||||||
$http.get("../system/functions?namespace=" + $scope.selectedNamespace).then(function(response) {
|
|
||||||
$scope.functions = response.data;
|
|
||||||
});
|
});
|
||||||
};
|
};
|
||||||
|
|
||||||
@ -267,13 +249,13 @@ app.controller("home", ['$scope', '$log', '$http', '$location', '$interval', '$f
|
|||||||
templateUrl: "templates/newfunction.html",
|
templateUrl: "templates/newfunction.html",
|
||||||
locals: {
|
locals: {
|
||||||
item: $scope.functionTemplate,
|
item: $scope.functionTemplate,
|
||||||
allNamespaces: $scope.allNamespaces
|
selectedNamespace: $scope.selectedNamespace
|
||||||
},
|
},
|
||||||
controller: DialogController
|
controller: DialogController,
|
||||||
});
|
});
|
||||||
};
|
};
|
||||||
|
|
||||||
var DialogController = function($scope, $mdDialog, item) {
|
var DialogController = function($scope, $mdDialog, item, selectedNamespace) {
|
||||||
var fetchNamespaces = function () {
|
var fetchNamespaces = function () {
|
||||||
$http.get("../system/namespaces")
|
$http.get("../system/namespaces")
|
||||||
.then(function(response) {
|
.then(function(response) {
|
||||||
@ -294,7 +276,7 @@ app.controller("home", ['$scope', '$log', '$http', '$location', '$interval', '$f
|
|||||||
|
|
||||||
$scope.annotationFieldsVisible = false;
|
$scope.annotationFieldsVisible = false;
|
||||||
$scope.annotationInputs = [{key: "", value: ""}];
|
$scope.annotationInputs = [{key: "", value: ""}];
|
||||||
$scope.namespaceSelect = "openfaas-fn";
|
$scope.namespaceSelect = selectedNamespace;
|
||||||
fetchNamespaces();
|
fetchNamespaces();
|
||||||
|
|
||||||
|
|
||||||
@ -354,7 +336,7 @@ app.controller("home", ['$scope', '$log', '$http', '$location', '$interval', '$f
|
|||||||
item.labels = {};
|
item.labels = {};
|
||||||
item.annotations = {};
|
item.annotations = {};
|
||||||
item.secrets = [];
|
item.secrets = [];
|
||||||
item.namespace = "openfaas-fn";
|
item.namespace = "";
|
||||||
|
|
||||||
$scope.validationError = "";
|
$scope.validationError = "";
|
||||||
$scope.closeDialog();
|
$scope.closeDialog();
|
||||||
@ -572,7 +554,8 @@ app.controller("home", ['$scope', '$log', '$http', '$location', '$interval', '$f
|
|||||||
$mdDialog.show(confirm)
|
$mdDialog.show(confirm)
|
||||||
.then(function() {
|
.then(function() {
|
||||||
var options = {
|
var options = {
|
||||||
url: "../system/functions?namespace=" + $scope.selectedNamespace,
|
|
||||||
|
url: buildNamespaceAwareURL("/system/functions", $scope.selectedNamespace),
|
||||||
data: {
|
data: {
|
||||||
functionName: $scope.selectedFunction.name
|
functionName: $scope.selectedFunction.name
|
||||||
},
|
},
|
||||||
@ -592,9 +575,6 @@ app.controller("home", ['$scope', '$log', '$http', '$location', '$interval', '$f
|
|||||||
}
|
}
|
||||||
});
|
});
|
||||||
};
|
};
|
||||||
|
|
||||||
fetch();
|
|
||||||
fetchNamespacesInterval();
|
|
||||||
}
|
}
|
||||||
]);
|
]);
|
||||||
|
|
||||||
@ -603,4 +583,13 @@ function uuidv4() {
|
|||||||
return ([1e7]+-1e3+-4e3+-8e3+-1e11).replace(/[018]/g, function(c) {
|
return ([1e7]+-1e3+-4e3+-8e3+-1e11).replace(/[018]/g, function(c) {
|
||||||
return (c ^ cryptoInstance.getRandomValues(new Uint8Array(1))[0] & 15 >> c / 4).toString(16)
|
return (c ^ cryptoInstance.getRandomValues(new Uint8Array(1))[0] & 15 >> c / 4).toString(16)
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
|
||||||
|
function buildNamespaceAwareURL(path, namespace) {
|
||||||
|
let newUrl = path.startsWith("/")? ".." + path: "../" + path;
|
||||||
|
|
||||||
|
if (namespace && namespace.length > 0){
|
||||||
|
newUrl += "?namespace=" + namespace
|
||||||
|
}
|
||||||
|
return newUrl
|
||||||
|
}
|
3
gateway/assets/style/bootstrap.css
vendored
3
gateway/assets/style/bootstrap.css
vendored
@ -146,3 +146,6 @@ md-input-container.function-url md-icon {
|
|||||||
color: red;
|
color: red;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.display-flex {
|
||||||
|
display: flex;
|
||||||
|
}
|
@ -63,7 +63,7 @@
|
|||||||
<md-tooltip md-direction="bottom">Namespace your function runs in i.e. 'openfaas-fn'. Only namespaces OpenFaaS can manage will show here</md-tooltip>
|
<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>
|
<label>Namespace</label>
|
||||||
<md-select name="namespace" ng-model="namespaceSelect" placeholder="Select a Namespace">
|
<md-select name="namespace" ng-model="namespaceSelect" placeholder="Select a Namespace">
|
||||||
<md-option ng-click="fnNamespaceSelected(namespace)" ng-value="namespace" ng-repeat="namespace in allNamespaces">
|
<md-option ng-click="fnNamespaceSelected(namespace)" ng-value="namespace" ng-repeat="namespace in allNamespaces" ng-selected="namespace === namespaceSelect">
|
||||||
{{ namespace }}
|
{{ namespace }}
|
||||||
</md-option>
|
</md-option>
|
||||||
</md-select>
|
</md-select>
|
||||||
|
Loading…
x
Reference in New Issue
Block a user