mirror of
https://github.com/openfaas/faas.git
synced 2025-06-16 12:16:47 +00:00
Added function url field and copy action to the UI
This change adds a function URL field to the UI and a 'copy to clipboard' button next to it. If the browser does not support the copy command, the copy icon will be hidden. Signed-off-by: Ken Fukuyama <kenfdev@gmail.com>
This commit is contained in:
parent
e6a3658ac3
commit
db465b82a4
18
gateway/assets/img/icons/outline-file_copy-24px.svg
Normal file
18
gateway/assets/img/icons/outline-file_copy-24px.svg
Normal file
@ -0,0 +1,18 @@
|
|||||||
|
<?xml version="1.0" encoding="utf-8"?>
|
||||||
|
<!-- Generator: Adobe Illustrator 19.1.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
|
||||||
|
<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="24px"
|
||||||
|
height="24px" viewBox="0 0 24 24" enable-background="new 0 0 24 24" xml:space="preserve">
|
||||||
|
<g id="Bounding_Boxes">
|
||||||
|
<g id="ui_x5F_spec_x5F_header_copy_3" display="none">
|
||||||
|
</g>
|
||||||
|
<path fill="none" d="M0,0h24v24H0V0z"/>
|
||||||
|
</g>
|
||||||
|
<g id="Outline">
|
||||||
|
<g id="ui_x5F_spec_x5F_header" display="none">
|
||||||
|
</g>
|
||||||
|
<g>
|
||||||
|
<path d="M16,1H4C2.9,1,2,1.9,2,3v14h2V3h12V1z"/>
|
||||||
|
<path d="M15,5H8C6.9,5,6.01,5.9,6.01,7L6,21c0,1.1,0.89,2,1.99,2H19c1.1,0,2-0.9,2-2V11L15,5z M8,21V7h6v5h5v9L8,21z"/>
|
||||||
|
</g>
|
||||||
|
</g>
|
||||||
|
</svg>
|
After Width: | Height: | Size: 747 B |
@ -123,6 +123,11 @@
|
|||||||
<label>Image</label>
|
<label>Image</label>
|
||||||
<input ng-model="function.image" type="text" readonly="readonly">
|
<input ng-model="function.image" type="text" readonly="readonly">
|
||||||
</md-input-container>
|
</md-input-container>
|
||||||
|
<md-input-container class="md-block function-url" flex-gt-sm>
|
||||||
|
<label>URL</label>
|
||||||
|
<input ng-value="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>
|
||||||
<div layout-gt-sm="row" ng-show="function.envProcess">
|
<div layout-gt-sm="row" ng-show="function.envProcess">
|
||||||
<md-input-container class="md-block" flex-gt-sm>
|
<md-input-container class="md-block" flex-gt-sm>
|
||||||
|
19
gateway/assets/script/bootstrap.js
vendored
19
gateway/assets/script/bootstrap.js
vendored
@ -21,6 +21,25 @@ app.controller("home", ['$scope', '$log', '$http', '$location', '$interval', '$f
|
|||||||
contentType: "text"
|
contentType: "text"
|
||||||
};
|
};
|
||||||
|
|
||||||
|
$scope.baseUrl = $location.absUrl().replace(/\ui\/$/, '');
|
||||||
|
try {
|
||||||
|
$scope.canCopyToClipboard = document.queryCommandSupported('copy');
|
||||||
|
} catch (err) {
|
||||||
|
console.error(err);
|
||||||
|
$scope.canCopyToClipboard = false;
|
||||||
|
}
|
||||||
|
$scope.copyClicked = function(e) {
|
||||||
|
e.target.parentElement.querySelector('input').select()
|
||||||
|
var copySuccessful = false;
|
||||||
|
try {
|
||||||
|
copySuccessful = document.execCommand('copy');
|
||||||
|
} catch (err) {
|
||||||
|
console.error(err);
|
||||||
|
}
|
||||||
|
var msg = copySuccessful ? 'Copied to Clipboard' : 'Copy failed. Please copy it manually';
|
||||||
|
showPostInvokedToast(msg);
|
||||||
|
}
|
||||||
|
|
||||||
$scope.toggleSideNav = function() {
|
$scope.toggleSideNav = function() {
|
||||||
$mdSidenav('left').toggle();
|
$mdSidenav('left').toggle();
|
||||||
};
|
};
|
||||||
|
5
gateway/assets/style/bootstrap.css
vendored
5
gateway/assets/style/bootstrap.css
vendored
@ -104,4 +104,9 @@ md-icon {
|
|||||||
|
|
||||||
md-icon.link {
|
md-icon.link {
|
||||||
fill: #303AA5;
|
fill: #303AA5;
|
||||||
|
}
|
||||||
|
|
||||||
|
md-input-container.function-url md-icon {
|
||||||
|
display: inline-block;
|
||||||
|
cursor: pointer;
|
||||||
}
|
}
|
Loading…
x
Reference in New Issue
Block a user