Skip to content
Snippets Groups Projects
Commit e6eec64c authored by Alex Ellis's avatar Alex Ellis
Browse files

UI: allow binary download 


Signed-off-by: default avatarAlex Ellis <alexellis2@gmail.com>
parent 5c8bb37b
No related branches found
No related tags found
No related merge requests found
Hide whitespace changes
Inline Side-by-side
gateway/assets/index.html
+ 2
− 2
View file @ e6eec64c
...@@ -133,10 +133,10 @@ ...@@ -133,10 +133,10 @@
<div layout-gt-sm="row"> <div layout-gt-sm="row">
<md-input-container class="md-block" flex-gt-sm> <md-input-container class="md-block" flex-gt-sm>
<md-radio-group ng-model="invocation.contentType"> <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="text" class="md-primary"> Text </md-radio-button>
<md-radio-button value="json"> JSON </md-radio-button> <md-radio-button value="json"> JSON </md-radio-button>
<md-radio-button value="binary"> Binary </md-radio-button> <md-radio-button value="binary"> Download </md-radio-button>
</md-radio-group> </md-radio-group>
</md-input-container> </md-input-container>
</div> </div>
......
gateway/assets/script/bootstrap.js
+ 51
− 28
View file @ e6eec64c
...@@ -27,7 +27,8 @@ app.controller("home", ['$scope', '$log', '$http', '$location', '$timeout', '$md ...@@ -27,7 +27,8 @@ app.controller("home", ['$scope', '$log', '$http', '$location', '$timeout', '$md
envProcess: "", envProcess: "",
network: "", network: "",
service: "", service: "",
envVars: {} envVars: {},
labels: {}
}; };
$scope.invocation.request = ""; $scope.invocation.request = "";
...@@ -56,7 +57,7 @@ app.controller("home", ['$scope', '$log', '$http', '$location', '$timeout', '$md ...@@ -56,7 +57,7 @@ app.controller("home", ['$scope', '$log', '$http', '$location', '$timeout', '$md
data: $scope.invocation.request, data: $scope.invocation.request,
method: "POST", method: "POST",
headers: { "Content-Type": requestContentType }, headers: { "Content-Type": requestContentType },
responseType: $scope.invocation.contentType responseType: $scope.invocation.contentType == "binary" ? "arraybuffer" : $scope.invocation.contentType
}; };
$scope.invocationInProgress = true; $scope.invocationInProgress = true;
...@@ -65,44 +66,64 @@ app.controller("home", ['$scope', '$log', '$http', '$location', '$timeout', '$md ...@@ -65,44 +66,64 @@ app.controller("home", ['$scope', '$log', '$http', '$location', '$timeout', '$md
$scope.roundTripDuration = ""; $scope.roundTripDuration = "";
$scope.invocationStart = new Date().getTime() $scope.invocationStart = new Date().getTime()
var tryDownload = function(data, filename) {
var caught;
var linkElement = document.createElement('a');
try {
var blob = new Blob([data], { type: "binary/octet-stream" });
var url = window.URL.createObjectURL(blob);
linkElement.setAttribute('href', url);
linkElement.setAttribute("download", filename);
var clickEvent = new MouseEvent("click", {
"view": window,
"bubbles": true,
"cancelable": false
});
linkElement.dispatchEvent(clickEvent);
} catch (ex) {
caught = ex;
}
return caught;
}
$http(options) $http(options)
.success(function (data, status, headers) { .success(function (data, status, headers) {
console.log(headers());
var headerMap = headers();
if($scope.invocation.contentType == "binary") { if($scope.invocation.contentType == "binary") {
$scope.invocationResponse = "Bytes received: "+ data.length; var filename = uuidv4();
var linkElement = document.createElement('a'); if($scope.selectedFunction.labels) {
try { var ext = $scope.selectedFunction.labels["com.openfaas.ui.ext"];
var blob = new Blob([data], { type: "binary/octet-stream" }); if(ext && ext.length > 0 ) {
var url = window.URL.createObjectURL(blob); filename = filename + "" + ext;
var filename = uuidv4(); }
}
linkElement.setAttribute('href', url);
linkElement.setAttribute("download", filename); var caught = tryDownload(data, filename);
if(caught) {
var clickEvent = new MouseEvent("click", { console.log(caught);
"view": window, $scope.invocationResponse = caught
"bubbles": true, } else {
"cancelable": false $scope.invocationResponse = data.byteLength + " byte(s) received";
});
linkElement.dispatchEvent(clickEvent);
} catch (ex) {
console.log(ex);
$scope.invocationResponse = ex;
} }
} else { } else {
var response = {"data": data};
if (typeof response.data == 'object') { if (typeof data == 'object') {
$scope.invocationResponse = JSON.stringify(response.data, null, 2); $scope.invocationResponse = JSON.stringify(data, null, 2);
} else { } else {
$scope.invocationResponse = response.data; $scope.invocationResponse = data;
} }
} }
$scope.invocationInProgress = false; $scope.invocationInProgress = false;
$scope.invocationStatus = response.status; $scope.invocationStatus = status;
var now = new Date().getTime(); var now = new Date().getTime();
$scope.roundTripDuration = (now - $scope.invocationStart) / 1000; $scope.roundTripDuration = (now - $scope.invocationStart) / 1000;
showPostInvokedToast("Success"); showPostInvokedToast("Success");
...@@ -187,6 +208,7 @@ app.controller("home", ['$scope', '$log', '$http', '$location', '$timeout', '$md ...@@ -187,6 +208,7 @@ app.controller("home", ['$scope', '$log', '$http', '$location', '$timeout', '$md
$scope.item.envProcess = func.fprocess; $scope.item.envProcess = func.fprocess;
$scope.item.network = func.network; $scope.item.network = func.network;
$scope.item.envVars = func.environment; $scope.item.envVars = func.environment;
$scope.item.labels = func.labels;
$scope.selectedFunc = func; $scope.selectedFunc = func;
} }
...@@ -219,6 +241,7 @@ app.controller("home", ['$scope', '$log', '$http', '$location', '$timeout', '$md ...@@ -219,6 +241,7 @@ app.controller("home", ['$scope', '$log', '$http', '$location', '$timeout', '$md
item.envProcess = ""; item.envProcess = "";
item.network = ""; item.network = "";
item.envVars = {}; item.envVars = {};
item.labels = {};
$scope.validationError = ""; $scope.validationError = "";
$scope.closeDialog(); $scope.closeDialog();
......
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment