mailinabox/management/templates/system-status.html

<h2>System Status Checks</h2>

<style>
#system-checks .heading td {
  font-weight: bold;
  font-size: 120%;
  padding-top: 1.5em;
}
#system-checks .heading.first td {
  border-top: none;
  padding-top: 0;
}
#system-checks .status-error td, .summary-error {
  color: #733;
}
#system-checks .status-warning td, .summary-warning {
  color: #770;
}
#system-checks .status-ok td, .summary-ok {
  color: #040;
}
#system-checks div.extra {
  display: none;
  margin-top: 1em;
  max-width: 50em;
  word-wrap: break-word;
}
#system-checks a.showhide {
  display: none;
  font-size: 85%;
}
#system-checks .pre {
  margin: 1em;
  font-family: monospace;
  white-space: pre-wrap;
}
</style>

<div class="row">
	<div class="col-md-push-9 col-md-3">

<div id="system-reboot-required" style="display: none; margin-bottom: 1em;">
	<button type="button" class="btn btn-danger" onclick="confirm_reboot(); return false;">Reboot Box</button>
	<div>No reboot is necessary.</div>
</div>

<div id="system-privacy-setting" style="display: none">
	<div><a onclick="return enable_privacy(!current_privacy_setting)" href="#"><span>Enable/Disable</span> New-Version Check</a></div>
	<p style="line-height: 125%"><small>(When enabled, status checks phone-home to check for a new release of Mail-in-a-Box.)</small></p>
</div>

	</div> <!-- /col -->
	<div class="col-md-pull-3 col-md-8">

          <div id="system-checks-summary">
          </div>

<table id="system-checks" class="table" style="max-width: 60em">
  <thead>
  </thead>
  <tbody>
  </tbody>
</table>

	</div> <!-- /col -->
</div> <!-- /row -->

<script>
function show_system_status() {
  const summary = $('#system-checks-summary');
  summary.html("");

  $('#system-checks tbody').html("<tr><td colspan='2' class='text-muted'>Loading...</td></tr>")

  api(
    "/system/privacy",
    "GET",
    { },
    function(r) {
      current_privacy_setting = r;
      $('#system-privacy-setting').show();
      $('#system-privacy-setting a span').text(r ? "Enable" : "Disable");
      $('#system-privacy-setting p').toggle(r);
    });

  api(
    "/system/reboot",
    "GET",
    { },
    function(r) {
      $('#system-reboot-required').show(); // show when r becomes available
      $('#system-reboot-required').find('button').toggle(r);
      $('#system-reboot-required').find('div').toggle(!r);
    });

  api(
    "/system/status",
    "POST",
    { },
    function(r) {
      $('#system-checks tbody').html("");
      const ok_symbol = "✓";
      const error_symbol = "✖";
      const warning_symbol = "?";

      let count_by_status = { ok: 0, error: 0, warning: 0 };

      for (var i = 0; i < r.length; i++) {
        var n = $("<tr><td class='status'/><td class='message'><p style='margin: 0'/><div class='extra'/><a class='showhide' href='#'/></tr>");
        if (i == 0) n.addClass('first')
        if (r[i].type == "heading")
                n.addClass(r[i].type)
        else
                n.addClass("status-" + r[i].type)

        if (r[i].type == "ok") n.find('td.status').text(ok_symbol);
        if (r[i].type == "error") n.find('td.status').text(error_symbol);
        if (r[i].type == "warning") n.find('td.status').text(warning_symbol);
        count_by_status[r[i].type]++;

        n.find('td.message p').text(r[i].text)
        $('#system-checks tbody').append(n);

        if (r[i].extra.length > 0) {
          n.find('a.showhide').show().text("show more").click(function() {
            $(this).hide();
            $(this).parent().find('.extra').fadeIn();
            return false;
          });
        }

        for (var j = 0; j < r[i].extra.length; j++) {

          var m = $("<div/>").text(r[i].extra[j].text)
          if (r[i].extra[j].monospace)
            m.addClass("pre");
          n.find('> td.message > div').append(m);
        }
      }

      // Summary counts
      summary.html("Summary: ");
      if (count_by_status['error'] + count_by_status['warning'] == 0) {
        summary.append($('<span class="summary-ok"/>').text(`All ${count_by_status['ok']} ${ok_symbol} OK`));
      } else {
        summary.append($('<span class="summary-ok"/>').text(`${count_by_status['ok']} ${ok_symbol} OK, `));
        summary.append($('<span class="summary-error"/>').text(`${count_by_status['error']} ${error_symbol} Error, `));
        summary.append($('<span class="summary-warning"/>').text(`${count_by_status['warning']} ${warning_symbol} Warning`));
      }
    })
}

var current_privacy_setting = null;
function enable_privacy(status) {
  api(
    "/system/privacy",
    "POST",
    {
      value: (status ? "private" : "off")
    },
    function(res) {
      show_system_status();
    });
  return false; // disable link
}

function confirm_reboot() {
  show_modal_confirm(
    "Reboot",
    $("<p>This will reboot your Mail-in-a-Box <code>{{hostname}}</code>.</p> <p>Until the machine is fully restarted, your users will not be able to send and receive email, and you will not be able to connect to this control panel or with SSH. The reboot cannot be cancelled.</p>"),
    "Reboot Now",
    function() {
      api(
        "/system/reboot",
        "POST",
        { },
        function(r) {
          var msg = "<p>Please reload this page after a minute or so.</p>";
          if (r) msg = "<p>The reboot command said:</p> <pre>" + $("<pre/>").text(r).html() + "</pre>"; // successful reboots don't produce any output; the output must be HTML-escaped
          show_modal_error("Reboot", msg);
        });
    });
}
</script>