79 lines
2.8 KiB
Twig
79 lines
2.8 KiB
Twig
{% extends 'master.twig' %}
|
|
|
|
{% set title = 'Status' %}
|
|
|
|
{% block js %}
|
|
<script>
|
|
var yuunoStatusStates = [
|
|
{"text": "Offline", "colour": "#800"},
|
|
{"text": "Experiencing Issues", "colour": "#840"},
|
|
{"text": "Online", "colour": "#080"}
|
|
];
|
|
|
|
var yuunoStatusEndpoints = {{ endpoints|json_encode|raw }};
|
|
|
|
function yuunoCheckStatus(endpoint) {
|
|
var client = new Sakura.AJAX;
|
|
client.SetUrl("{{ route('status.data') }}?history=0&name=" + endpoint);
|
|
client.AddCallback(200, function () {
|
|
var result = client.JSON(),
|
|
field = document.querySelector('[data-status-name="' + endpoint + '"]');
|
|
|
|
if (result.error) {
|
|
if (field) {
|
|
field.innerText = 'error';
|
|
}
|
|
|
|
var error = new Sakura.Dialogue;
|
|
error.Title = "Status";
|
|
error.Text = result.error;
|
|
error.Display();
|
|
} else {
|
|
var state = yuunoStatusStates[result.state];
|
|
field.innerText = state.text;
|
|
field.style.color = state.colour;
|
|
}
|
|
});
|
|
client.Start(Sakura.HTTPMethod.GET);
|
|
}
|
|
|
|
window.addEventListener("load", function () {
|
|
for (var i in yuunoStatusEndpoints) {
|
|
var endpoint = yuunoStatusEndpoints[i];
|
|
yuunoCheckStatus(endpoint);
|
|
}
|
|
});
|
|
</script>
|
|
{% endblock %}
|
|
|
|
{% block content %}
|
|
<div class="content status">
|
|
<div class="content__header">Status</div>
|
|
<div class="status__services">
|
|
{% for name in endpoints %}
|
|
<div class="status__service">
|
|
<h1>{{ name }}</h1>
|
|
<h3 data-status-name="{{ name }}">loading...</h3>
|
|
</div>
|
|
{% endfor %}
|
|
</div>
|
|
<div class="content__header">Incidents</div>
|
|
{% for date, events in incidents %}
|
|
<div class="news__head">{{ date }}</div>
|
|
{% if events|length > 0 %}
|
|
<table>
|
|
{% for event in events %}
|
|
{% set state = event.state|lower %}
|
|
<tr>
|
|
<td><b><span style="font-size: .8em">{{ event.time }} UTC</span></b></td>
|
|
<td><b style="font-size: .8em; color: {% if state == 'resolved' %}#080{% elseif state == 'monitoring' %}#800{% else %}#840{% endif %}">{{ event.state }}</b></td>
|
|
<td>{{ event.comment }}</td>
|
|
</tr>
|
|
{% endfor %}
|
|
</table>
|
|
{% else %}
|
|
<i>No incidents occurred.</i>
|
|
{% endif %}
|
|
{% endfor %}
|
|
</div>
|
|
{% endblock %}
|