phpmyadmin working

8 files changed, 735 insertions, 0 deletions

diff --git a/srcs/phpmyadmin/templates/server/status/advisor/index.twig b/srcs/phpmyadmin/templates/server/status/advisor/index.twig
new file mode 100644
index 0000000..b1bc3a9
--- /dev/null
+++ b/srcs/phpmyadmin/templates/server/status/advisor/index.twig
@@ -0,0 +1,39 @@
+{% extends 'server/status/base.twig' %}
+{% set active = 'advisor' %}
+
+{% block content %}
+
+  {% if data is not empty %}
+    <a href="#openAdvisorInstructions">{{ get_icon('b_help', 'Instructions'|trans) }}</a>
+
+    <div id="statustabs_advisor"></div>
+
+    <div id="advisorInstructionsDialog" class="hide">
+      <p>
+        {% trans %}
+          The Advisor system can provide recommendations on server variables by analyzing the server status variables.
+        {% endtrans %}
+      </p>
+      <p>
+        {% trans %}
+          Do note however that this system provides recommendations based on simple calculations and by rule of thumb which may not necessarily apply to your system.
+        {% endtrans %}
+      </p>
+      <p>
+        {% trans %}
+          Prior to changing any of the configuration, be sure to know what you are changing (by reading the documentation) and how to undo the change. Wrong tuning can have a very negative effect on performance.
+        {% endtrans %}
+      </p>
+      <p>
+        {% trans %}
+          The best way to tune your system would be to change only one setting at a time, observe or benchmark your database, and undo the change if there was no clearly measurable improvement.
+        {% endtrans %}
+      </p>
+    </div>
+
+    <div id="advisorData" class="hide">{{ data }}</div>
+  {% else %}
+    {{ 'Not enough privilege to view the advisor.'|trans|error }}
+  {% endif %}
+
+{% endblock %}
diff --git a/srcs/phpmyadmin/templates/server/status/base.twig b/srcs/phpmyadmin/templates/server/status/base.twig
new file mode 100644
index 0000000..66547a8
--- /dev/null
+++ b/srcs/phpmyadmin/templates/server/status/base.twig
@@ -0,0 +1,39 @@
+<div>
+  <ul id="topmenu2">
+    <li>
+      <a href="server_status.php{{ get_common() }}"{{ active == 'status' ? ' class="tabactive"' }}>
+        {% trans 'Server' %}
+      </a>
+    </li>
+    <li>
+      <a href="server_status_processes.php{{ get_common() }}"{{ active == 'processes' ? ' class="tabactive"' }}>
+        {% trans 'Processes' %}
+      </a>
+    </li>
+    <li>
+      <a href="server_status_queries.php{{ get_common() }}"{{ active == 'queries' ? ' class="tabactive"' }}>
+        {% trans 'Query statistics' %}
+      </a>
+    </li>
+    <li>
+      <a href="server_status_variables.php{{ get_common() }}"{{ active == 'variables' ? ' class="tabactive"' }}>
+        {% trans 'All status variables' %}
+      </a>
+    </li>
+    <li>
+      <a href="server_status_monitor.php{{ get_common() }}"{{ active == 'monitor' ? ' class="tabactive"' }}>
+        {% trans 'Monitor' %}
+      </a>
+    </li>
+    <li>
+      <a href="server_status_advisor.php{{ get_common() }}"{{ active == 'advisor' ? ' class="tabactive"' }}>
+        {% trans 'Advisor' %}
+      </a>
+    </li>
+  </ul>
+  <div class="clearfloat"></div>
+
+  <div>
+    {% block content %}{% endblock %}
+  </div>
+</div>
diff --git a/srcs/phpmyadmin/templates/server/status/monitor/index.twig b/srcs/phpmyadmin/templates/server/status/monitor/index.twig
new file mode 100644
index 0000000..c4c7277
--- /dev/null
+++ b/srcs/phpmyadmin/templates/server/status/monitor/index.twig
@@ -0,0 +1,268 @@
+{% extends 'server/status/base.twig' %}
+{% set active = 'monitor' %}
+{% block content %}
+
+<div class="tabLinks">
+  <a href="#pauseCharts">
+    {{ get_image('play') }}
+    {% trans 'Start Monitor' %}
+  </a>
+  <a href="#settingsPopup" class="popupLink">
+    {{ get_image('s_cog') }}
+    {% trans 'Settings' %}
+  </a>
+  <a href="#monitorInstructionsDialog">
+    {{ get_image('b_help') }}
+    {% trans 'Instructions/Setup' %}
+  </a>
+  <a href="#endChartEditMode" class="hide">
+    {{ get_image('s_okay') }}
+    {% trans 'Done dragging (rearranging) charts' %}
+  </a>
+</div>
+
+<div class="popupContent settingsPopup">
+  <a href="#addNewChart">
+    {{ get_image('b_chart') }}
+    {% trans 'Add chart' %}
+  </a>
+  <a href="#rearrangeCharts">
+    {{ get_image('b_tblops') }}
+    {% trans 'Enable charts dragging' %}
+  </a>
+  <div class="clearfloat paddingtop"></div>
+
+  <div class="floatleft">
+    {% trans 'Refresh rate' %}
+    <br>
+    <select id="id_gridChartRefresh" class="refreshRate" name="gridChartRefresh">
+      {% for rate in [2, 3, 4, 5, 10, 20, 40, 60, 120, 300, 600, 1200] %}
+        <option value="{{ rate }}"{{ rate == 5 ? ' selected' }}>
+          {% if rate < 60 %}
+            {% if rate == 1 %}
+              {{ '%d second'|trans|format(rate) }}
+            {% else %}
+              {{ '%d seconds'|trans|format(rate) }}
+            {% endif %}
+          {% else %}
+            {% if rate / 60 == 1 %}
+              {{ '%d minute'|trans|format(rate / 60) }}
+            {% else %}
+              {{ '%d minutes'|trans|format(rate / 60) }}
+            {% endif %}
+          {% endif %}
+        </option>
+      {% endfor %}
+    </select>
+    <br>
+  </div>
+
+  <div class="floatleft">
+    {% trans 'Chart columns' %}
+    <br>
+    <select name="chartColumns">
+      <option>1</option>
+      <option>2</option>
+      <option>3</option>
+      <option>4</option>
+      <option>5</option>
+      <option>6</option>
+    </select>
+  </div>
+
+  <div class="clearfloat paddingtop">
+    <strong>{% trans 'Chart arrangement' %}</strong>
+    {{ show_hint('The arrangement of the charts is stored to the browsers local storage. You may want to export it if you have a complicated set up.'|trans) }}
+    <br>
+    <a class="ajax" href="#importMonitorConfig">
+      {% trans 'Import' %}
+    </a> -
+    <a class="disableAjax" href="#exportMonitorConfig">
+      {% trans 'Export' %}
+    </a> -
+    <a href="#clearMonitorConfig">
+      {% trans 'Reset to default' %}
+    </a>
+  </div>
+</div>
+
+<div id="monitorInstructionsDialog" title="{% trans 'Monitor Instructions' %}" class="hide">
+  <p>
+    {% trans %}
+      The phpMyAdmin Monitor can assist you in optimizing the server configuration and track down time intensive queries. For the latter you will need to set log_output to 'TABLE' and have either the slow_query_log or general_log enabled. Note however, that the general_log produces a lot of data and increases server load by up to 15%.
+    {% endtrans %}
+  </p>
+  <img class="ajaxIcon" src="{{ image_path }}ajax_clock_small.gif" alt="{% trans 'Loading…' %}">
+
+  <div class="ajaxContent"></div>
+  <br>
+
+  <div class="monitorUse hide">
+    <p><strong>{% trans 'Using the monitor:' %}</strong></p>
+    <p>
+      {% trans %}
+        Your browser will refresh all displayed charts in a regular interval. You may add charts and change the refresh rate under 'Settings', or remove any chart using the cog icon on each respective chart.
+      {% endtrans %}
+    </p>
+    <p>
+      {% trans %}
+        To display queries from the logs, select the relevant time span on any chart by holding down the left mouse button and panning over the chart. Once confirmed, this will load a table of grouped queries, there you may click on any occurring SELECT statements to further analyze them.
+      {% endtrans %}
+    </p>
+    <p>
+      {{ get_image('s_attention') }}
+      <strong>{% trans 'Please note:' %}</strong>
+    </p>
+    <p>
+      {% trans %}
+        Enabling the general_log may increase the server load by 5-15%. Also be aware that generating statistics from the logs is a load intensive task, so it is advisable to select only a small time span and to disable the general_log and empty its table once monitoring is not required any more.
+      {% endtrans %}
+    </p>
+  </div>
+</div>
+
+<div id="addChartDialog" title="{% trans 'Add chart' %}" class="hide">
+  <div id="tabGridVariables">
+    <p>
+      <input type="text" name="chartTitle" value="{% trans 'Chart Title' %}">
+    </p>
+    <input type="radio" name="chartType" value="preset" id="chartPreset">
+
+    <label for="chartPreset">{% trans 'Preset chart' %}</label>
+    <select name="presetCharts"></select>
+    <br>
+
+    <input type="radio" name="chartType" value="variable" id="chartStatusVar" checked="checked">
+    <label for="chartStatusVar">
+      {% trans 'Status variable(s)' %}
+    </label>
+    <br>
+
+    <div id="chartVariableSettings">
+      <label for="chartSeries">{% trans 'Select series:' %}</label>
+      <br>
+      <select id="chartSeries" name="varChartList" size="1">
+        <option>{% trans 'Commonly monitored' %}</option>
+        <option>Processes</option>
+        <option>Questions</option>
+        <option>Connections</option>
+        <option>Bytes_sent</option>
+        <option>Bytes_received</option>
+        <option>Threads_connected</option>
+        <option>Created_tmp_disk_tables</option>
+        <option>Handler_read_first</option>
+        <option>Innodb_buffer_pool_wait_free</option>
+        <option>Key_reads</option>
+        <option>Open_tables</option>
+        <option>Select_full_join</option>
+        <option>Slow_queries</option>
+      </select>
+      <br>
+
+      <label for="variableInput">
+        {% trans 'or type variable name:' %}
+      </label>
+      <input type="text" name="variableInput" id="variableInput">
+      <br>
+
+      <input type="checkbox" name="differentialValue" id="differentialValue" value="differential" checked="checked">
+      <label for="differentialValue">
+        {% trans 'Display as differential value' %}
+      </label>
+      <br>
+
+      <input type="checkbox" id="useDivisor" name="useDivisor" value="1">
+      <label for="useDivisor">{% trans 'Apply a divisor' %}</label>
+
+      <span class="divisorInput hide">
+        <input type="text" name="valueDivisor" size="4" value="1">
+        (<a href="#kibDivisor">{% trans 'KiB' %}</a>,
+        <a href="#mibDivisor">{% trans 'MiB' %}</a>)
+      </span>
+      <br>
+
+      <input type="checkbox" id="useUnit" name="useUnit" value="1">
+      <label for="useUnit">
+        {% trans 'Append unit to data values' %}
+      </label>
+      <span class="unitInput hide">
+        <input type="text" name="valueUnit" size="4" value="">
+      </span>
+
+      <p>
+        <a href="#submitAddSeries">
+          <strong>{% trans 'Add this series' %}</strong>
+        </a>
+        <span id="clearSeriesLink" class="hide">
+          | <a href="#submitClearSeries">{% trans 'Clear series' %}</a>
+        </span>
+      </p>
+
+      {% trans 'Series in chart:' %}
+      <br>
+      <span id="seriesPreview">
+        <em>{% trans 'None' %}</em>
+      </span>
+    </div>
+  </div>
+</div>
+
+<div id="logAnalyseDialog" title="{% trans 'Log statistics' %}" class="hide">
+  <p>
+    {% trans 'Selected time range:' %}
+    <input type="text" name="dateStart" class="datetimefield" value="">
+    -
+    <input type="text" name="dateEnd" class="datetimefield" value="">
+  </p>
+
+  <input type="checkbox" id="limitTypes" value="1" checked="checked">
+  <label for="limitTypes">
+    {% trans 'Only retrieve SELECT,INSERT,UPDATE and DELETE Statements' %}
+  </label>
+  <br>
+
+  <input type="checkbox" id="removeVariables" value="1" checked="checked">
+  <label for="removeVariables">
+    {% trans 'Remove variable data in INSERT statements for better grouping' %}
+  </label>
+
+  <p>
+    {% trans 'Choose from which log you want the statistics to be generated from.' %}
+  </p>
+  <p>
+    {% trans 'Results are grouped by query text.' %}
+  </p>
+</div>
+
+<div id="queryAnalyzerDialog" title="{% trans 'Query analyzer' %}" class="hide">
+  <textarea id="sqlquery"></textarea>
+  <br>
+  <div class="placeHolder"></div>
+</div>
+
+<table class="clearfloat tdblock" id="chartGrid"></table>
+<div id="logTable"><br></div>
+
+<script type="text/javascript">
+  var variableNames = [
+    {% for variable_name in javascript_variable_names %}
+      "{{ variable_name|e('js') }}",
+    {% endfor %}
+  ];
+</script>
+
+<form id="js_data" class="hide">
+  {% for name, value in form %}
+    <input type="hidden" name="{{ name }}" value="{{ value }}">
+  {% endfor %}
+</form>
+
+<div id="profiling_docu" class="hide">
+  {{ show_mysql_docu('general-thread-states') }}
+</div>
+
+<div id="explain_docu" class="hide">
+  {{ show_mysql_docu('explain-output') }}
+</div>
+
+{% endblock %}
diff --git a/srcs/phpmyadmin/templates/server/status/processes/index.twig b/srcs/phpmyadmin/templates/server/status/processes/index.twig
new file mode 100644
index 0000000..bb73156
--- /dev/null
+++ b/srcs/phpmyadmin/templates/server/status/processes/index.twig
@@ -0,0 +1,53 @@
+{% extends 'server/status/base.twig' %}
+{% set active = 'processes' %}
+{% block content %}
+
+<fieldset id="tableFilter">
+  <legend>{% trans 'Filters' %}</legend>
+  <form action="server_status_processes.php" method="post">
+    {{ get_hidden_inputs(url_params) }}
+    <input class="btn btn-secondary" type="submit" value="{% trans 'Refresh' %}">
+    <div class="formelement">
+      <input type="checkbox" name="showExecuting" id="showExecuting" class="autosubmit"{{ is_checked ? ' checked' }}>
+      <label for="showExecuting">
+        {% trans 'Show only active' %}
+      </label>
+    </div>
+  </form>
+</fieldset>
+
+{{ server_process_list|raw }}
+
+{{ 'Note: Enabling the auto refresh here might cause heavy traffic between the web server and the MySQL server.'|trans|notice }}
+
+<div class="tabLinks">
+  <label>
+    {% trans 'Refresh rate' %}:
+
+    <select id="id_refreshRate" class="refreshRate" name="refreshRate">
+      {% for rate in [2, 3, 4, 5, 10, 20, 40, 60, 120, 300, 600, 1200] %}
+        <option value="{{ rate }}"{{ rate == 5 ? ' selected' }}>
+          {% if rate < 60 %}
+            {% if rate == 1 %}
+              {{ '%d second'|trans|format(rate) }}
+            {% else %}
+              {{ '%d seconds'|trans|format(rate) }}
+            {% endif %}
+          {% else %}
+            {% if rate / 60 == 1 %}
+              {{ '%d minute'|trans|format(rate / 60) }}
+            {% else %}
+              {{ '%d minutes'|trans|format(rate / 60) }}
+            {% endif %}
+          {% endif %}
+        </option>
+      {% endfor %}
+    </select>
+  </label>
+  <a id="toggleRefresh" href="#">
+    {{ get_image('play') }}
+    {% trans 'Start auto refresh' %}
+  </a>
+</div>
+
+{% endblock %}
diff --git a/srcs/phpmyadmin/templates/server/status/processes/list.twig b/srcs/phpmyadmin/templates/server/status/processes/list.twig
new file mode 100644
index 0000000..83561f9
--- /dev/null
+++ b/srcs/phpmyadmin/templates/server/status/processes/list.twig
@@ -0,0 +1,65 @@
+<div class="responsivetable">
+  <table id="tableprocesslist" class="data clearfloat noclick sortable">
+    <thead>
+      <tr>
+        <th>{% trans 'Processes' %}</th>
+        {% for column in columns %}
+          <th>
+            <a href="server_status_processes.php" data-post="{{ get_common(column.params) }}" class="sortlink">
+              {{ column.name }}
+              {% if column.is_sorted %}
+                <img class="icon ic_s_desc soimg" alt="
+                  {%- trans 'Descending' %}" src="themes/dot.gif" style="display: {{ column.sort_order == 'DESC' ? 'none' : 'inline' }}">
+                <img class="icon ic_s_asc soimg hide" alt="
+                  {%- trans 'Ascending' %}" src="themes/dot.gif" style="display: {{ column.sort_order == 'DESC' ? 'inline' : 'none' }}">
+              {% endif %}
+            </a>
+            {% if column.has_full_query %}
+              <a href="server_status_processes.php" data-post="{{ get_common(refresh_params, '') }}">
+                {% if column.is_full %}
+                  {{ get_image(
+                    's_partialtext',
+                    'Truncate shown queries'|trans,
+                    {'class': 'icon_fulltext'}
+                  ) }}
+                {% else %}
+                  {{ get_image(
+                    's_fulltext',
+                    'Show full queries'|trans,
+                    {'class': 'icon_fulltext'}
+                  ) }}
+                {% endif %}
+              </a>
+            {% endif %}
+          </th>
+        {% endfor %}
+      </tr>
+    </thead>
+
+    <tbody>
+      {% for row in rows %}
+        <tr>
+          <td>
+            <a class="ajax kill_process" href="server_status_processes.php" data-post="{{ get_common({'kill': row.id}, '') }}">
+              {% trans 'Kill' %}
+            </a>
+          </td>
+          <td class="value">{{ row.id }}</td>
+          <td>{{ row.user }}</td>
+          <td>{{ row.host }}</td>
+          <td>
+            {% if row.db != '' %}
+              {{ row.db }}
+            {% else %}
+              <em>{% trans 'None' %}</em>
+            {% endif %}
+          </td>
+          <td>{{ row.command }}</td>
+          <td class="value">{{ row.time }}</td>
+          <td>{{ row.state }}</td>
+          <td>{{ row.progress }}</td>
+          <td>{{ row.info|raw }}</td>
+      {% endfor %}
+    </tbody>
+  </table>
+</div>
diff --git a/srcs/phpmyadmin/templates/server/status/queries/index.twig b/srcs/phpmyadmin/templates/server/status/queries/index.twig
new file mode 100644
index 0000000..be743b9
--- /dev/null
+++ b/srcs/phpmyadmin/templates/server/status/queries/index.twig
@@ -0,0 +1,56 @@
+{% extends 'server/status/base.twig' %}
+{% set active = 'queries' %}
+{% block content %}
+
+{% if is_data_loaded %}
+  <h3 id="serverstatusqueries">
+    {% trans %}
+      Questions since startup:
+    {% notes %}
+      Questions is the name of a MySQL Status variable
+    {% endtrans %}
+    {{ format_number(stats.total, 0) }}
+    {{ show_mysql_docu('server-status-variables', false, null, null, 'statvar_Questions') }}
+  </h3>
+
+  <ul>
+    <li>ø {% trans 'per hour:' %} {{ format_number(stats.per_hour, 0) }}</li>
+    <li>ø {% trans 'per minute:' %} {{ format_number(stats.per_minute, 0) }}</li>
+    {% if stats.per_second >= 1 %}
+      <li>ø {% trans 'per second:' %} {{ format_number(stats.per_second, 0) }}</li>
+    {% endif %}
+  </ul>
+
+  <table id="serverstatusqueriesdetails" class="width100 data sortable noclick">
+    <colgroup>
+      <col class="namecol">
+      <col class="valuecol" span="3">
+    </colgroup>
+
+    <thead>
+      <tr>
+        <th>{% trans 'Statements' %}</th>
+        <th>{% trans %}#{% notes %}# = Amount of queries{% endtrans %}</th>
+        <th>ø {% trans 'per hour' %}</th>
+        <th>%</th>
+      </tr>
+    </thead>
+
+    <tbody>
+      {% for query in queries %}
+        <tr>
+          <th class="name">{{ query.name }}</th>
+          <td class="value">{{ format_number(query.value, 5, 0, true) }}</td>
+          <td class="value">{{ format_number(query.per_hour, 4, 1, true) }}</td>
+          <td class="value">{{ format_number(query.percentage, 0, 2) }}</td>
+        </tr>
+      {% endfor %}
+    </tbody>
+  </table>
+
+  <div id="serverstatusquerieschart" class="width100" data-chart="{{ chart|json_encode }}"></div>
+{% else %}
+  {{ 'Not enough privilege to view query statistics.'|trans|error }}
+{% endif %}
+
+{% endblock %}
diff --git a/srcs/phpmyadmin/templates/server/status/status/index.twig b/srcs/phpmyadmin/templates/server/status/status/index.twig
new file mode 100644
index 0000000..53fd63f
--- /dev/null
+++ b/srcs/phpmyadmin/templates/server/status/status/index.twig
@@ -0,0 +1,78 @@
+{% extends 'server/status/base.twig' %}
+{% set active = 'status' %}
+{% block content %}
+
+{% if is_data_loaded %}
+  <h3>{{ 'Network traffic since startup: %s'|trans|format(network_traffic) }}</h3>
+  <p>{{ 'This MySQL server has been running for %1$s. It started up on %2$s.'|trans|format(uptime, start_time) }}</p>
+
+  <table id="serverstatustraffic" class="width100 data noclick">
+    <thead>
+      <tr>
+        <th>
+          {% trans 'Traffic' %}
+          {{ show_hint('On a busy server, the byte counters may overrun, so those statistics as reported by the MySQL server may be incorrect.'|trans) }}
+        </th>
+        <th>#</th>
+        <th>&oslash; {% trans 'per hour' %}</th>
+      </tr>
+    </thead>
+
+    <tbody>
+      {% for each_traffic in traffic %}
+        <tr>
+          <th class="name">{{ each_traffic.name }}</th>
+          <td class="value">{{ each_traffic.number }}</td>
+          <td class="value">{{ each_traffic.per_hour }}</td>
+        </tr>
+      {% endfor %}
+    </tbody>
+  </table>
+
+  <table id="serverstatusconnections" class="width100 data noclick">
+    <thead>
+      <tr>
+        <th>{% trans 'Connections' %}</th>
+        <th>#</th>
+        <th>&oslash; {% trans 'per hour' %}</th>
+        <th>%</th>
+      </tr>
+    </thead>
+
+    <tbody>
+      {% for connection in connections %}
+        <tr>
+          <th class="name">{{ connection.name }}</th>
+          <td class="value">{{ connection.number }}</td>
+          <td class="value">{{ connection.per_hour }}</td>
+          <td class="value">{{ connection.percentage }}</td>
+        </tr>
+      {% endfor %}
+    </tbody>
+  </table>
+
+  {% if is_master or is_slave %}
+    <p class="notice clearfloat">
+      {% if is_master and is_slave %}
+        {% trans 'This MySQL server works as <b>master</b> and <b>slave</b> in <b>replication</b> process.' %}
+      {% elseif is_master %}
+        {% trans 'This MySQL server works as <b>master</b> in <b>replication</b> process.' %}
+      {% elseif is_slave %}
+        {% trans 'This MySQL server works as <b>slave</b> in <b>replication</b> process.' %}
+      {% endif %}
+    </p>
+
+    <hr class="clearfloat">
+
+    <h3>
+      <a name="replication">{% trans 'Replication status' %}</a>
+    </h3>
+
+    {{ replication|raw }}
+  {% endif %}
+
+{% else %}
+  {{ 'Not enough privilege to view server status.'|trans|error }}
+{% endif %}
+
+{% endblock %}
diff --git a/srcs/phpmyadmin/templates/server/status/variables/index.twig b/srcs/phpmyadmin/templates/server/status/variables/index.twig
new file mode 100644
index 0000000..a5f8724
--- /dev/null
+++ b/srcs/phpmyadmin/templates/server/status/variables/index.twig
@@ -0,0 +1,137 @@
+{% extends 'server/status/base.twig' %}
+{% set active = 'variables' %}
+{% block content %}
+
+{% if is_data_loaded %}
+  <fieldset id="tableFilter">
+    <legend>{% trans 'Filters' %}</legend>
+    <form action="server_status_variables.php" method="post">
+      {{ get_hidden_inputs() }}
+
+      <input class="btn btn-secondary" type="submit" value="{% trans 'Refresh' %}">
+
+      <div class="formelement">
+        <label for="filterText">{% trans 'Containing the word:' %}</label>
+        <input name="filterText" type="text" id="filterText" value="{{ filter_text }}">
+      </div>
+
+      <div class="formelement">
+        <input type="checkbox" name="filterAlert" id="filterAlert"{{ is_only_alerts ? ' checked' }}>
+        <label for="filterAlert">
+          {% trans 'Show only alert values' %}
+        </label>
+      </div>
+
+      <div class="formelement">
+        <select id="filterCategory" name="filterCategory">
+          <option value="">{% trans 'Filter by category…' %}</option>
+          {% for category in categories %}
+            <option value="{{ category.id }}"{{ category.is_selected ? ' selected' }}>{{ category.name }}</option>
+          {% endfor %}
+        </select>
+      </div>
+
+      <div class="formelement">
+        <input type="checkbox" name="dontFormat" id="dontFormat"{{ is_not_formatted ? ' checked' }}>
+        <label for="dontFormat">
+          {% trans 'Show unformatted values' %}
+        </label>
+      </div>
+    </form>
+  </fieldset>
+
+  <div id="linkSuggestions" class="defaultLinks hide">
+    <p class="notice">
+      {% trans 'Related links:' %}
+      {% for link in links %}
+        <span class="{{ link.name }}">
+          {% for link_name, link_url in link.links %}
+            {% if link_name == 'doc' %}
+              {{ show_mysql_docu(link_url) }}
+            {% else %}
+              <a href="{{ link_url.url }}" data-post="{{ link_url.params }}">{{ link_name }}</a>
+            {% endif %}
+            |
+          {% endfor %}
+        </span>
+      {% endfor %}
+    </p>
+  </div>
+
+  <div class="responsivetable">
+    <table class="data noclick" id="serverstatusvariables">
+      <colgroup>
+        <col class="namecol">
+        <col class="valuecol">
+        <col class="descrcol">
+      </colgroup>
+      <thead>
+        <tr>
+          <th>{% trans 'Variable' %}</th>
+          <th>{% trans 'Value' %}</th>
+          <th>{% trans 'Description' %}</th>
+        </tr>
+      </thead>
+      <tbody>
+        {% for variable in variables %}
+          <tr{% if variable.class is not empty %} class="s_{{ variable.class }}"{% endif %}>
+            <th class="name">
+              {{ variable.name|replace({'_': ' '}) }}
+              {{ variable.doc|raw }}
+            </th>
+
+            <td class="value">
+              <span class="formatted">
+                {% if variable.has_alert %}
+                  <span class="{{ variable.is_alert ? 'attention' : 'allfine' }}">
+                {% endif %}
+
+                {% if variable.name ends with '%' %}
+                  {{ format_number(variable.value, 0, 2) }} %
+                {% elseif 'Uptime' in variable.name %}
+                  {{ timespan_format(variable.value) }}
+                {% elseif variable.is_numeric and variable.value >= 1000 %}
+                  <abbr title="{{ format_number(variable.value, 0) }}">
+                    {{ format_number(variable.value, 3, 1) }}
+                  </abbr>
+                {% elseif variable.is_numeric %}
+                  {{ format_number(variable.value, 3, 1) }}
+                {% else %}
+                  {{ variable.value }}
+                {% endif %}
+
+                {% if variable.has_alert %}
+                  </span>
+                {% endif %}
+              </span>
+              <span class="original hide">
+                {% if variable.has_alert %}
+                  <span class="{{ variable.is_alert ? 'attention' : 'allfine' }}">
+                {% endif %}
+                {{ variable.value }}
+                {% if variable.has_alert %}
+                  </span>
+                {% endif %}
+              </span>
+            </td>
+
+            <td class="descr">
+              {{ variable.description }}
+              {% for doc in variable.description_doc %}
+                {% if doc.name == 'doc' %}
+                  {{ show_mysql_docu(doc.url) }}
+                {% else %}
+                  <a href="{{ doc.url.url }}" data-post="{{ doc.url.params }}">{{ doc.name }}</a>
+                {% endif %}
+              {% endfor %}
+            </td>
+          </tr>
+        {% endfor %}
+      </tbody>
+    </table>
+  </div>
+{% else %}
+  {{ 'Not enough privilege to view status variables.'|trans|error }}
+{% endif %}
+
+{% endblock %}