Give error feedback if the requested file does not exist

This commit is contained in:
Johannes Zellner
2017-08-20 18:47:13 +02:00
parent 82380b6b7c
commit 4ca7cccdae
3 changed files with 47 additions and 5 deletions

View File

@@ -6,14 +6,21 @@
<h4 class="modal-title">Download a file from {{ selected.name }}</h4>
</div>
<div class="modal-body">
<form ng-submit="downloadFile.submit()">
<input type="text" class="form-control" ng-model="downloadFile.filePath" required autofocus>
<form name="downloadFileForm" ng-submit="downloadFile.submit()">
<div class="form-group" ng-class="{ 'has-error': downloadFileForm.filePath.$dirty && downloadFile.error }">
<div class="control-label" ng-show="{ 'has-error': downloadFileForm.filePath.$dirty && downloadFile.error }">
<small>{{ downloadFile.error }}</small>
</div>
<input type="text" class="form-control" name="filePath" ng-model="downloadFile.filePath" required autofocus>
</div>
<input class="ng-hide" type="submit" ng-disabled="!downloadFile.filePath"/>
</form>
</div>
<div class="modal-footer">
<a id="fileDownloadLink" class="" ng-href="{{ downloadFile.downloadUrl() }}" target="_blank"></a>
<button type="button" class="btn btn-default" data-dismiss="modal">Cancel</button>
<a id="fileDownloadLink" class="btn btn-success" ng-href="{{ downloadFile.downloadUrl() }}" ng-disabled="!downloadFile.filePath" target="_blank">Download</a>
<button type="button" class="btn btn-success" ng-click="downloadFile.submit()" ng-disabled="!downloadFile.filePath"><i class="fa fa-circle-o-notch fa-spin" ng-show="downloadFile.busy"></i> Download</button>
</div>
</div>
</div>

View File

@@ -24,22 +24,40 @@ angular.module('Application').controller('DebugController', ['$scope', '$locatio
}
$scope.downloadFile = {
error: '',
filePath: '',
busy: false,
downloadUrl: function () {
if (!$scope.downloadFile.filePath) return '';
var filePath = $scope.downloadFile.filePath.replace(/\/*\//g, '/');
return Client.apiOrigin + '/api/v1/apps/' + $scope.selected.value + '/download?file=' + filePath + '&access_token=' + Client.getToken();
},
show: function () {
$scope.downloadFile.busy = false;
$scope.downloadFile.error = '';
$scope.downloadFile.filePath = '';
$('#downloadFileModal').modal('show');
},
submit: function () {
// we have to click the link to make the browser do the download
$('#fileDownloadLink')[0].click();
$scope.downloadFile.busy = true;
Client.checkDownloadableFile($scope.selected.value, $scope.downloadFile.filePath, function (error) {
$scope.downloadFile.busy = false;
if (error) {
$scope.downloadFile.error = 'The requested file does not exist.';
return;
}
// we have to click the link to make the browser do the download
// don't know how to prevent the browsers
$('#fileDownloadLink')[0].click();
});
}
};