mailinabox/management/templates/system-backup.html

189 lines
5.8 KiB
HTML

<style>
#backup-status th { text-align: center; }
#backup-status tr.full-backup td { font-weight: bold; }
</style>
<h2>Backup Status</h2>
<h3>Copying Backup Files</h3>
<p>The box makes an incremental backup each night. By default the backup is stored on the machine itself, but you can also have it stored on Amazon S3</p>
<p>You can also use SFTP (FTP over SSH) to copy files from <tt id="backup-location"></tt>. These files are encrypted, so they are safe to store anywhere. Copy the encryption password from <tt id="backup-encpassword-file"></tt> also but keep it in a safe location.</p>
<h3>Backup Configuration</h3>
<form class="form-horizontal" role="form" onsubmit="set_custom_backup(); return false;">
<div class="form-group">
<label for="target" class="col-sm-2 control-label">Backup target</label>
<div class="col-sm-2">
<select class="form-control" rows="1" id="target-type" onchange="toggle_form()">
<option value="file">Store locally</option>
<option value="s3">Amazon S3</option>
</select>
</div>
</div>
<div class="form-group">
<label for="target" class="col-sm-2 control-label">How many days should backups be kept?</label>
<div class="col-sm-8">
<input type="number" class="form-control" rows="1" id="min-age"></input>
</div>
</div>
<div class="form-group form-advanced">
<label for="target" class="col-sm-2 control-label">S3 URL</label>
<div class="col-sm-8">
<input type="text" placeholder="s3://s3-eu-central-1.amazonaws.com/bucket-name" class="form-control" rows="1" id="target"></textarea>
</div>
</div>
<div class="form-group form-advanced">
<label for="target-user" class="col-sm-2 control-label">S3&nbsp;Key</label>
<div class="col-sm-8">
<input type="text" class="form-control" rows="1" id="target-user"></input>
</div>
</div>
<div class="form-group form-advanced">
<label for="target-pass" class="col-sm-2 control-label">S3&nbsp;Secret</label>
<div class="col-sm-8">
<input type="text" class="form-control" rows="1" id="target-pass"></input>
</div>
</div>
<div class="form-group">
<div class="col-sm-offset-2 col-sm-11">
<button id="set-s3-backup-button" type="submit" class="btn btn-primary">Save</button>
</div>
</div>
</form>
<h3>Current Backups</h3>
<p>The backup directory currently contains the backups listed below. The total size on disk of the backups is currently <span id="backup-total-size"></span>.</p>
<table id="backup-status" class="table" style="width: auto">
<thead>
<th colspan="2">When</th>
<th>Type</th>
<th>Size</th>
<th>Deleted in...</th>
</thead>
<tbody>
</tbody>
</table>
<h3>Backup logs</h3>
<pre id="backup-log"></pre>
<script>
function toggle_form() {
var target_type = $("#target-type").val();
if (target_type == 'file') {
$(".form-advanced").hide();
} else {
$(".form-advanced").show();
}
}
function nice_size(bytes) {
var powers = ['bytes', 'KB', 'MB', 'GB', 'TB'];
while (true) {
if (powers.length == 1) break;
if (bytes < 1000) break;
bytes /= 1024;
powers.shift();
}
// round to have three significant figures but at most one decimal place
if (bytes >= 100)
bytes = Math.round(bytes)
else
bytes = Math.round(bytes*10)/10;
return bytes + " " + powers[0];
}
function show_system_backup() {
show_custom_backup()
$('#backup-status tbody').html("<tr><td colspan='2' class='text-muted'>Loading...</td></tr>")
api(
"/system/backup/status",
"GET",
{ },
function(r) {
var status = r.backups;
var log = r.log;
$('#backup-location').text(status.directory);
$('#backup-encpassword-file').text(status.encpwfile);
$('#backup-status tbody').html("");
var total_disk_size = 0;
if (status.backups.length == 0) {
var tr = $('<tr><td colspan="3">No backups have been made yet.</td></tr>');
$('#backup-status tbody').append(tr);
}
for (var i = 0; i < status.backups.length; i++) {
var b = status.backups[i];
var tr = $('<tr/>');
if (b.full) tr.addClass("full-backup");
tr.append( $('<td/>').text(b.date_str + " " + status.tz) );
tr.append( $('<td/>').text(b.date_delta + " ago") );
tr.append( $('<td/>').text(b.full ? "full" : "increment") );
tr.append( $('<td style="text-align: right"/>').text( nice_size(b.size)) );
if (b.deleted_in)
tr.append( $('<td/>').text(b.deleted_in) );
else
tr.append( $('<td class="text-muted">unknown</td>') );
$('#backup-status tbody').append(tr);
total_disk_size += b.size;
}
$('#backup-total-size').text(nice_size(total_disk_size));
$('#backup-log').text(log || 'No backup logs yet');
})
}
function show_custom_backup() {
api(
"/system/backup/config",
"GET",
{ },
function(r) {
var target_type = r.target.split(':')[0]
$("#target").val(r.target);
$("#target-type").val(target_type);
$("#target-user").val(r.target_user);
$("#target-pass").val(r.target_pass);
$("#min-age").val(r.min_age_in_days);
toggle_form()
})
}
function set_custom_backup() {
var target = $("#target").val();
var target_type = $("#target-type").val();
var target_user = $("#target-user").val();
var target_pass = $("#target-pass").val();
var min_age = $("#min-age").val();
api(
"/system/backup/config",
"POST",
{
target: target,
target_user: target_user,
target_pass: target_pass,
min_age: min_age
},
function(r) {
// Responses are multiple lines of pre-formatted text.
show_modal_error("Backup configuration", $("<pre/>").text(r));
},
function(r) {
show_modal_error("Backup configuration (error)", r);
});
return false;
}
</script>