mirror of
https://github.com/openfaas/faas.git
synced 2025-06-16 04:06:47 +00:00
6880fdc524
There was a case where a deployment with a single namespace on faas-netes would show the namespace suffix for all functions. we didn't need to show this because the gateway will proxy to the default namespace for fns without the namespace siffix. This was tested on Swarm (no suffix), faas-netes (single namespace, no suffix) and faas-netes, multi-ns, suffix shown. Signed-off-by: Alistair Hey <alistair@heyal.co.uk>
231 lines
13 KiB
HTML
231 lines
13 KiB
HTML
<html ng-app="faasGateway">
|
|
|
|
<head>
|
|
<title>OpenFaaS Portal</title>
|
|
<link href="https://fonts.googleapis.com/css?family=Rationale|Roboto+Mono|Roboto:300,400,400i,500,700" rel="stylesheet">
|
|
<link rel="stylesheet" href="style/angular_material/1.1.0/angular-material.min.css">
|
|
<link rel="stylesheet" href="style/bootstrap.css">
|
|
<link rel="apple-touch-icon" sizes="180x180" href="apple-touch-icon.png">
|
|
<link rel="icon" type="image/png" sizes="32x32" href="favicon-32x32.png">
|
|
<link rel="icon" type="image/png" sizes="16x16" href="favicon-16x16.png">
|
|
<link rel="manifest" href="manifest.json">
|
|
<link rel="mask-icon" href="safari-pinned-tab.svg" color="#5bbad5">
|
|
<meta name="theme-color" content="#ffffff">
|
|
|
|
<noscript>
|
|
<style>
|
|
.jsonly {
|
|
display: none;
|
|
}
|
|
</style>
|
|
</noscript>
|
|
</head>
|
|
|
|
<body ng-controller="home">
|
|
<div class="jsonly">
|
|
<div layout="column" ng-cloak>
|
|
|
|
<md-toolbar class="md-theme-indigo" hide-gt-sm>
|
|
<div class="md-toolbar-tools no-pad">
|
|
<md-button ng-click="toggleSideNav()" class="md-icon-button" aria-label="Menu">
|
|
<md-icon md-svg-icon="img/icons/ic_menu_white.svg"></md-icon>
|
|
</md-button>
|
|
</div>
|
|
</md-toolbar>
|
|
<section id="popupContainer" layout="row" flex>
|
|
<md-sidenav class="md-sidenav-left" md-component-id="left" md-is-locked-open="$mdMedia('gt-sm')" md-whiteframe="4" layout="column">
|
|
|
|
<md-toolbar class="md-theme-indigo">
|
|
<div class="md-toolbar-tools no-pad">
|
|
<a href="https://www.openfaas.com/" target="_blank"><img src="icon.png" alt="OpenFaaS Icon" class="md-avatar" /></a>
|
|
<h1 style="flex: 1 1 auto;"><img src="img/logo-text.svg" class="md-logo"></h1>
|
|
<md-button ng-click="toggleSideNav()" class="md-icon-button" aria-label="Back" hide-gt-sm>
|
|
<md-icon md-svg-icon="img/icons/ic_arrow_back_white.svg"></md-icon>
|
|
</md-button>
|
|
</div>
|
|
</md-toolbar>
|
|
|
|
<md-content layout-padding>
|
|
|
|
<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>
|
|
<p>Deploy New Function</p>
|
|
</md-list-item>
|
|
</md-list>
|
|
|
|
<md-input-container ng-show="allNamespaces.length > 1" class="display-flex">
|
|
<label>Namespace</label>
|
|
<md-select ng-model="namespaceSelectDropdown" placeholder="Select a Namespace">
|
|
<md-option ng-click="setNamespace(namespace)" ng-value="namespace" ng-repeat="namespace in allNamespaces" ng-selected="namespace === selectedNamespace">
|
|
{{ 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">
|
|
</md-input-container>
|
|
<md-list>
|
|
<md-list-item ng-switch class="md-3-line" ng-click="showFunction(function)" ng-repeat="function in functions | filter:search | orderBy: '-invocationCount'" ng-class="function.name == selectedFunction.name ? 'selected' : false">
|
|
<md-icon ng-switch-when="true" style="color: blue" md-svg-icon="person"></md-icon>
|
|
<md-icon ng-switch-when="false" md-svg-icon="person-outline"></md-icon>
|
|
<p>{{function.name}}</p>
|
|
<md-divider ng-if="!$last"></md-divider>
|
|
</md-list-item>
|
|
</md-list>
|
|
</md-content>
|
|
</md-sidenav>
|
|
|
|
<md-content flex layout="column" layout-align="start center" class="blankslate" ng-if="!selectedFunction">
|
|
<p ng-if="functions.length === 0">
|
|
You have no functions in OpenFaaS.<br>
|
|
Start by deploying a new function.
|
|
</p>
|
|
<p ng-if="functions.length !== 0">
|
|
Select a function or deploy a new one.
|
|
</p>
|
|
<md-button class="md-primary md-raised" ng-click="newFunction()">
|
|
Deploy new function
|
|
</md-button>
|
|
<p>Or use <strong>faas-cli</strong> to build and deploy functions:</p>
|
|
<pre>$ curl -sSL https://cli.openfaas.com | sudo sh</pre>
|
|
</md-content>
|
|
|
|
<md-content flex layout="column" ng-repeat="function in functions" ng-if="function.name == selectedFunction.name">
|
|
|
|
<md-card md-theme="default" md-theme-watch>
|
|
<md-card-title>
|
|
<md-card-title-text>
|
|
|
|
<div layout="row" layout-align="space-between">
|
|
<span class="md-headline">
|
|
{{function.name}}
|
|
</span>
|
|
|
|
<md-button ng-click="deleteFunction()" class="md-icon-button" aria-label="Delete">
|
|
<md-tooltip md-direction="left">Delete</md-tooltip>
|
|
<md-icon md-svg-icon="img/icons/ic_delete_black.svg"></md-icon>
|
|
</md-button>
|
|
|
|
</div>
|
|
|
|
<div layout-gt-sm="row">
|
|
<md-input-container class="md-icon-float md-block">
|
|
<label>Status</label>
|
|
<input value="{{ function.ready ? 'Ready' : 'Not ready' }}" type="text" readonly="readonly">
|
|
</md-input-container>
|
|
|
|
<md-input-container class="md-icon-float md-block">
|
|
<label>Replicas</label>
|
|
<input ng-model="function.replicas" type="text" readonly="readonly">
|
|
</md-input-container>
|
|
|
|
<md-input-container class="md-block" flex-gt-sm>
|
|
<label>Invocation count</label>
|
|
<input ng-model="function.invocationCount" type="text" readonly="readonly">
|
|
</md-input-container>
|
|
|
|
<md-input-container class="md-block" flex-gt-sm ng-show="allNamespaces.length > 1">
|
|
<label>Namespace</label>
|
|
<input ng-model="function.namespace" type="text" readonly="readonly">
|
|
</md-input-container>
|
|
</div>
|
|
|
|
<div layout-gt-sm="row">
|
|
<md-input-container class="md-block" flex-gt-sm>
|
|
<label>Image</label>
|
|
<input ng-model="function.image" type="text" readonly="readonly">
|
|
</md-input-container>
|
|
<md-input-container class="md-block function-url" flex-gt-sm>
|
|
<label>URL</label>
|
|
<input ng-value="(function.namespace && function.namespace.length > 0 && allNamespaces && allNamespaces.length > 1)? 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-input-container>
|
|
</div>
|
|
<div layout-gt-sm="row" ng-show="function.envProcess">
|
|
<md-input-container class="md-block" flex-gt-sm>
|
|
<label>Function process</label>
|
|
<input ng-model="function.envProcess" type="text" readonly="readonly">
|
|
</md-input-container>
|
|
</div>
|
|
</md-card-title-text>
|
|
</md-card-title>
|
|
</md-card>
|
|
<md-card>
|
|
<md-card-title>
|
|
<md-card-title-text>
|
|
|
|
<span class="md-headline">
|
|
Invoke function
|
|
</span>
|
|
<div layout-gt-sm="row">
|
|
<md-input-container class="md-block" flex-gt-sm>
|
|
<button ng-click="fireRequest()" class="md-raised md-button md-ink-ripple" type="button" ng-disabled="invocationInProgress || (selectedFunction && !selectedFunction.ready)">
|
|
<span class="ng-scope">Invoke</span><div class="md-ripple-container"></div>
|
|
</button>
|
|
</md-input-container>
|
|
<md-progress-circular md-mode="indeterminate" ng-show="invocationInProgress"></md-progress-circular>
|
|
</div>
|
|
|
|
<div layout-gt-sm="row">
|
|
<md-input-container class="md-block" flex-gt-sm>
|
|
<md-radio-group ng-model="invocation.contentType" layout="row" layout-align="start center">
|
|
<md-radio-button value="text" class="md-primary"> Text </md-radio-button>
|
|
<md-radio-button value="json" class="md-primary"> JSON </md-radio-button>
|
|
<md-radio-button value="binary" class="md-primary"> Download </md-radio-button>
|
|
</md-radio-group>
|
|
</md-input-container>
|
|
</div>
|
|
|
|
<div layout-gt-sm="row">
|
|
<md-input-container class="md-block" flex-gt-sm>
|
|
<label>Request body</label>
|
|
<textarea ng-model="invocation.request" class="monospace" cols="80" rows="4"></textarea>
|
|
</md-input-container>
|
|
</div>
|
|
|
|
<div layout-gt-sm="row">
|
|
<md-input-container class="md-block" flex-gt-sm>
|
|
<label>Response status</label>
|
|
<input ng-model="invocationStatus" type="text" readonly="readonly">
|
|
</md-input-container>
|
|
<md-input-container class="md-block" flex-gt-sm>
|
|
<label>Round-trip (s)</label>
|
|
<input ng-model="roundTripDuration" type="text" readonly="readonly">
|
|
</md-input-container>
|
|
</div>
|
|
<div layout-gt-sm="row">
|
|
<md-input-container class="md-block" flex-gt-sm>
|
|
<label>Response body</label>
|
|
<textarea ng-model="invocationResponse" class="monospace" cols="80" rows=10></textarea>
|
|
</md-input-container>
|
|
</div>
|
|
</md-card-title-text>
|
|
</md-card-title>
|
|
</md-card>
|
|
</md-content>
|
|
</section>
|
|
</div>
|
|
|
|
|
|
<script src="script/angularjs/1.6.9/angular.min.js"></script>
|
|
<script src="script/angularjs/1.6.9/angular-animate.min.js"></script>
|
|
<script src="script/angularjs/1.6.9/angular-aria.min.js"></script>
|
|
<script src="script/angularjs/1.6.9/angular-messages.min.js"></script>
|
|
<script src="script/angular_material/1.1.4/angular-material.min.js"></script>
|
|
<script src="script/funcstore.js"></script>
|
|
<script src="script/bootstrap.js"></script>
|
|
</div>
|
|
|
|
<noscript>
|
|
<div style="padding: 15px;">
|
|
<h2>You need JavaScript to view this page</h2>
|
|
<p>You don't need the web dashboard to use OpenFaaS, you can get the CLI with this command: <code>curl -sL cli.openfaas.com | sh</code></p>
|
|
</div>
|
|
</noscript>
|
|
</body>
|
|
|
|
</html>
|