Allow to change the backup storage provider in the ui
This commit is contained in:
Johannes Zellner
@@ -145,38 +145,49 @@
|
||||
<h4 class="modal-title">Configure Backup Storage</h4>
|
||||
</div>
|
||||
<div class="modal-body">
|
||||
<p>Only Amazon S3 or API compatible services are supported. <sup><a ng-href="{{ config.webServerOrigin }}/references/selfhosting.html#backups" class="help" target="_blank"><i class="fa fa-question-circle"></i></a></sup></p>
|
||||
<p>Amazon S3 or API compatible services are supported. <sup><a ng-href="{{ config.webServerOrigin }}/references/selfhosting.html#backups" class="help" target="_blank"><i class="fa fa-question-circle"></i></a></sup></p>
|
||||
<form name="configureBackupForm" role="form" novalidate ng-submit="configureBackup.submit()" autocomplete="off">
|
||||
<fieldset>
|
||||
<p class="has-error text-center" ng-show="configureBackup.error">{{ configureBackup.error.generic }}</p>
|
||||
|
||||
<div class="form-group">
|
||||
<label class="control-label" for="storageProviderProvider">Storage provider</label>
|
||||
<select class="form-control" id="storageProviderProvider" ng-model="configureBackup.provider" ng-options="a.value as a.name for a in storageProvider"></select>
|
||||
</div>
|
||||
|
||||
<!-- Filesystem -->
|
||||
<div class="form-group" ng-class="{ 'has-error': configureBackup.error.backupFolder }" ng-show="configureBackup.provider === 'filesystem'">
|
||||
<label class="control-label" for="inputConfigureBackupFolder">Local backup directory</label>
|
||||
<input type="text" class="form-control" ng-model="configureBackup.backupFolder" id="inputConfigureBackupFolder" name="backupFolder" ng-disabled="configureBackup.busy" placeholder="Leave empty for default /var/backups">
|
||||
</div>
|
||||
|
||||
<!-- S3 -->
|
||||
<div class="form-group" ng-class="{ 'has-error': configureBackup.error.bucket }">
|
||||
<div class="form-group" ng-class="{ 'has-error': configureBackup.error.bucket }" ng-show="configureBackup.provider === 's3'">
|
||||
<label class="control-label" for="inputConfigureBackupBucket">Bucket name</label>
|
||||
<input type="text" class="form-control" ng-model="configureBackup.bucket" id="inputConfigureBackupBucket" name="bucket" ng-disabled="configureBackup.busy" required autofocus>
|
||||
<input type="text" class="form-control" ng-model="configureBackup.bucket" id="inputConfigureBackupBucket" name="bucket" ng-disabled="configureBackup.busy" ng-required="configureBackup.provider === 's3'">
|
||||
</div>
|
||||
|
||||
<div class="form-group" ng-class="{ 'has-error': configureBackup.error.prefix }">
|
||||
<div class="form-group" ng-class="{ 'has-error': configureBackup.error.prefix }" ng-show="configureBackup.provider === 's3'">
|
||||
<label class="control-label" for="inputConfigureBackupPrefix">Prefix</label>
|
||||
<input type="text" class="form-control" ng-model="configureBackup.prefix" id="inputConfigureBackupPrefix" name="prefix" ng-disabled="configureBackup.busy" placeholder="Prefix for backup file names" required>
|
||||
<input type="text" class="form-control" ng-model="configureBackup.prefix" id="inputConfigureBackupPrefix" name="prefix" ng-disabled="configureBackup.busy" placeholder="Prefix for backup file names" ng-required="configureBackup.provider === 's3'">
|
||||
</div>
|
||||
|
||||
<div class="form-group" ng-class="{ 'has-error': configureBackup.error.region }">
|
||||
<div class="form-group" ng-class="{ 'has-error': configureBackup.error.region }" ng-show="configureBackup.provider === 's3'">
|
||||
<label class="control-label" for="inputConfigureBackupRegion">Region</label>
|
||||
<select class="form-control" name="region" id="inputConfigureBackupRegion" ng-model="configureBackup.region" ng-options="a.value as a.name for a in s3Regions" ng-disabled="configureBackup.busy" required></select>
|
||||
<select class="form-control" name="region" id="inputConfigureBackupRegion" ng-model="configureBackup.region" ng-options="a.value as a.name for a in s3Regions" ng-disabled="configureBackup.busy" ng-required="configureBackup.provider === 's3'"></select>
|
||||
</div>
|
||||
|
||||
<div class="form-group" ng-class="{ 'has-error': configureBackup.error.accessKeyId }">
|
||||
<div class="form-group" ng-class="{ 'has-error': configureBackup.error.accessKeyId }" ng-show="configureBackup.provider === 's3'">
|
||||
<label class="control-label" for="inputConfigureBackupAccessKeyId">Access key id</label>
|
||||
<input type="text" class="form-control" ng-model="configureBackup.accessKeyId" id="inputConfigureBackupAccessKeyId" name="accessKeyId" ng-disabled="configureBackup.busy" required>
|
||||
<input type="text" class="form-control" ng-model="configureBackup.accessKeyId" id="inputConfigureBackupAccessKeyId" name="accessKeyId" ng-disabled="configureBackup.busy" ng-required="configureBackup.provider === 's3'">
|
||||
</div>
|
||||
|
||||
<div class="form-group" ng-class="{ 'has-error': configureBackup.error.secretAccessKey }">
|
||||
<div class="form-group" ng-class="{ 'has-error': configureBackup.error.secretAccessKey }" ng-show="configureBackup.provider === 's3'">
|
||||
<label class="control-label" for="inputConfigureBackupSecretAccessKey">Secret access key</label>
|
||||
<input type="text" class="form-control" ng-model="configureBackup.secretAccessKey" id="inputConfigureBackupSecretAccessKey" name="secretAccessKey" ng-disabled="configureBackup.busy" required>
|
||||
<input type="text" class="form-control" ng-model="configureBackup.secretAccessKey" id="inputConfigureBackupSecretAccessKey" name="secretAccessKey" ng-disabled="configureBackup.busy" ng-required="configureBackup.provider === 's3'">
|
||||
</div>
|
||||
|
||||
<div class="form-group" ng-class="{ 'has-error': configureBackup.error.endpoint }">
|
||||
<div class="form-group" ng-class="{ 'has-error': configureBackup.error.endpoint }" ng-show="configureBackup.provider === 's3'">
|
||||
<label class="control-label" for="inputConfigureBackupEndpoint">Endpoint (optional)</label>
|
||||
<input type="text" class="form-control" ng-model="configureBackup.endpoint" id="inputConfigureBackupEndpoint" name="endpoint" ng-disabled="configureBackup.busy" placeholder="URL of S3 compatible storage (Minio, Swift). Leave empty when using Amazon S3.">
|
||||
</div>
|
||||
|
||||
@@ -50,6 +50,11 @@ angular.module('Application').controller('SettingsController', ['$scope', '$loca
|
||||
{ name: 'US West (Oregon)', value: 'us-west-2' },
|
||||
];
|
||||
|
||||
$scope.storageProvider = [
|
||||
{ name: 'Amazon S3', value: 's3' },
|
||||
{ name: 'Filesystem (not recommended)', value: 'filesystem' }
|
||||
];
|
||||
|
||||
$scope.planChange = {
|
||||
busy: false,
|
||||
error: {},
|
||||
@@ -332,18 +337,20 @@ angular.module('Application').controller('SettingsController', ['$scope', '$loca
|
||||
busy: false,
|
||||
error: {},
|
||||
|
||||
provider: 's3',
|
||||
provider: '',
|
||||
bucket: '',
|
||||
prefix: '',
|
||||
accessKeyId: '',
|
||||
secretAccessKey: '',
|
||||
region: '',
|
||||
endpoint: '',
|
||||
backupFoler: '',
|
||||
|
||||
show: function () {
|
||||
$scope.configureBackup.error = {};
|
||||
$scope.configureBackup.busy = false;
|
||||
|
||||
$scope.configureBackup.provider = $scope.backupConfig.provider;
|
||||
$scope.configureBackup.bucket = $scope.backupConfig.bucket;
|
||||
$scope.configureBackup.prefix = $scope.backupConfig.prefix;
|
||||
$scope.configureBackup.region = $scope.backupConfig.region;
|
||||
@@ -351,6 +358,7 @@ angular.module('Application').controller('SettingsController', ['$scope', '$loca
|
||||
$scope.configureBackup.secretAccessKey = $scope.backupConfig.secretAccessKey;
|
||||
$scope.configureBackup.endpoint = $scope.backupConfig.endpoint;
|
||||
$scope.configureBackup.key = $scope.backupConfig.key;
|
||||
$scope.configureBackup.backupFolder = $scope.backupConfig.backupFolder;
|
||||
|
||||
$('#configureBackupModal').modal('show');
|
||||
},
|
||||
@@ -365,7 +373,8 @@ angular.module('Application').controller('SettingsController', ['$scope', '$loca
|
||||
prefix: $scope.configureBackup.prefix,
|
||||
accessKeyId: $scope.configureBackup.accessKeyId,
|
||||
secretAccessKey: $scope.configureBackup.secretAccessKey,
|
||||
key: $scope.configureBackup.key
|
||||
key: $scope.configureBackup.key,
|
||||
backupFolder: $scope.configureBackup.backupFolder
|
||||
};
|
||||
|
||||
if ($scope.configureBackup.region) backupConfig.region = $scope.configureBackup.region;
|
||||
@@ -406,8 +415,14 @@ angular.module('Application').controller('SettingsController', ['$scope', '$loca
|
||||
} else {
|
||||
$('#inputConfigureBackupBucket').focus();
|
||||
}
|
||||
} else if (error.statusCode === 400) {
|
||||
$scope.configureBackup.error.generic = error.message;
|
||||
|
||||
if ($scope.configureBackup.provider === 'filesystem') {
|
||||
$scope.configureBackup.error.backupFolder = true;
|
||||
}
|
||||
} else {
|
||||
console.error('Unable to change name.', error);
|
||||
console.error('Unable to change provider.', error);
|
||||
}
|
||||
|
||||
return;
|
||||
|
||||
Reference in New Issue
Block a user