Mini Shell

{# vim: ts=2:sw=2:et:ft=jinja-html #}
{% extends "base.html.jinja" %}
{% from "bootstrap_macros.html.jinja" import header_card without context %}
{% block body %}

<script type="text/javascript">
{# see list_backups.html.jinja #}
window.RESTORE_LIST_TIMEOUT_SECS = 10;
window.RESTORE_LIST_REFRESH_SECS = 11;
function restore_files() {
  var alert = document.getElementById('files-restore-alert');
  var snap = get_snapshot('files');
  var form_data = new FormData();
  form_data.append('task', 'files');
  form_data.append('snapshot', snap.value);
  form_data.append('date', snap.dataset.date);
  form_data.append('include', document.getElementById('files-restore-include').value);
  form_data.append('dest', document.getElementById('files-restore-destination').value);
  restore(alert, form_data);
}
function restore_db(db_type) {
  var alert = document.getElementById(db_type.concat('-restore-alert'));
  var snap = get_snapshot(db_type);
  var form_data = new FormData();
  form_data.append('task', db_type);
  form_data.append('snapshot', snap.value);
  form_data.append('date', snap.dataset.date);
  if (document.getElementById(db_type.concat('-compress')).checked){
    var compress = '1';
  } else {
    var compress = '0';
  }
  form_data.append('compress', compress);
  form_data.append('dest', document.getElementById(db_type.concat('-restore-destination')).value);
  restore(alert, form_data);
}
function set_alert(alert, state){
  alert.classList.remove('d-none');
  alert.classList.remove('alert-light');
  alert.classList.remove('alert-danger');
  alert.classList.remove('alert-success');
  if (state === null){
    alert.classList.add('d-none');
  } else {
    alert.classList.add('alert-'.concat(state));
  }
}
function dismiss(name, form_name){
  var form_data = new FormData()
  form_data.append(form_name, name);
  fetch(
    '{{ url_for("restore_page") }}', {
      method: 'delete',
      body: form_data,
    }
  ).then((response) => {
    if (response.status != 200) {
      alert(response.statusText); // TODO: make a legit alert div
      return false;
    }
    return true;
  }).then((res) => {
    if (res){
      list_restores();
    }
  });
}
function restore(alert, form_data) {
  buttons_disabled(true);
  fetch(
    "{{ url_for('restore_page') }}", {
      method: 'post',
      body: form_data,
    }
  ).then((response) => {
    if (response.status != 200) {
      alert.textContent = response.statusText;
      set_alert(alert, "danger");
      buttons_disabled(false);
      return null;
    }
    return response.json();
  }).then((res) => {
    if (res === null ){
      return;
    }
    alert.textContent = res['text'];
    if (res['success']){
      set_alert(alert, "success");
      list_restores()
    } else {
      set_alert(alert, "danger");
    }
    buttons_disabled(false);
  }).catch((error) => {
    buttons_disabled(false);
    set_alert(alert, "danger");
    alert.textContent = error;
  });
}
function get_snapshot(task) {
  var radios = document.getElementsByName(task.concat('-snapshot'));
  for( i = 0; i < radios.length; i++ ) {
    if( radios[i].checked ) {
      return radios[i];
    }
  }
  return null;
}
function compress_changed(checkbox, dest_input_id) {
  var dest_input = document.getElementById(dest_input_id);
  if (checkbox.checked && !dest_input.value.endsWith(".gz")) {
    dest_input.value = dest_input.value.concat(".gz");
  } else if (!checkbox.checked && dest_input.value.endsWith(".gz")) {
    dest_input.value = dest_input.value.substring(0, dest_input.value.length-3)
  }
}
function fetch_div(url, div, backups) {
  fetch(
    url, {signal: AbortSignal.timeout(1000 * window.RESTORE_LIST_TIMEOUT_SECS)}
  ).then((response) => {
    if (response.status == 200){
      return response.text();
    } else {
      div.classList.add('alert');
      div.classList.add('alert-danger');
      div.innerText = response.statusText;
      return null;
    }
  }).then((res) => {
    if (res === null){
      return;
    }
    div.classList.remove('alert');
    div.classList.remove('alert-danger');
    div.innerHTML = res;
  }).catch((error) => {
    console.log(error);
    if (backups){
      div.classList.add('alert');
      div.classList.add('alert-danger');
      div.innerText = error;
    }
  });
}
function buttons_disabled(state) {
  var buttons = document.getElementsByTagName("button");
  for (var button of buttons) {
    button.disabled = state;
  }
}
function list_restores() {
  fetch_div("{{ url_for('list_restores') }}", document.getElementById('restores'), false);
}
function list_backups() {
  var snapshots_div = document.getElementById('snapshots');
  snapshots_div.textContent = 'Fetching completed backups...';
  fetch_div("{{ url_for('list_backups') }}", snapshots_div, true);
}
</script>

<div id="restores"></div>
<div id="snapshots"></div>

<script type="text/javascript">
document.getElementById('restores').textContent = 'Fetching running and completed restores...';
list_restores();
list_backups();
// TODO: lower secs and add start/stop logic
setInterval(list_restores, 1000 * window.RESTORE_LIST_REFRESH_SECS);
</script>
{% endblock %}