Skip to content

Commit

Permalink
SHS3: moved plugins from system health to their own page
Browse files Browse the repository at this point in the history
  • Loading branch information
jstucke committed Nov 8, 2023
1 parent c9d0ebf commit f02a177
Show file tree
Hide file tree
Showing 5 changed files with 113 additions and 83 deletions.
7 changes: 7 additions & 0 deletions src/web_interface/components/statistic_routes.py
Original file line number Diff line number Diff line change
Expand Up @@ -33,6 +33,13 @@ def show_system_health(self):
plugin_dict.pop('unpacker')
return render_template('system_health.html', analysis_plugin_info=plugin_dict)

@roles_accepted(*PRIVILEGES['status'])
@AppRoute('/plugins', GET)
def show_plugin_page(self):
plugin_dict = self.intercom.get_available_analysis_plugins()
plugin_dict.pop('unpacker')
return render_template('plugins.html', plugins=plugin_dict)

def _get_stats_from_db(self):
with get_shared_session(self.db.stats_viewer) as stats_db:
return {
Expand Down
42 changes: 20 additions & 22 deletions src/web_interface/static/js/system_health.js
Original file line number Diff line number Diff line change
Expand Up @@ -106,39 +106,37 @@ function updatePluginCard(pluginName, pluginData) {
}
queueElement.innerText = pluginData.queue.toString();
outQueueElement.innerText = pluginData.out_queue.toString();
if (pluginData.stats !== null) {
statsElement.innerHTML = `
<table class="table table-sm table-striped" style="margin-left: 16px">
statsElement.innerHTML = getPluginRuntimeStats(pluginData.stats);
}

function getPluginRuntimeStats(stats) {
if (stats !== null) {
return `
<table class="table table-sm table-striped m-0" style="margin-left: 16px">
<tbody>
<tr>
<td style="width: 10px; text-align: right;">min</td>
<td>${pluginData.stats.min}s</td>
</tr>
<tr>
<td style="width: 10px; text-align: right;">max</td>
<td>${pluginData.stats.max}s</td>
</tr>
<tr>
<td style="width: 10px; text-align: right;">mean</td>
<td>${pluginData.stats.mean}s</td>
</tr>
<tr>
<td style="width: 10px; text-align: right;">median</td>
<td>${pluginData.stats.median}s</td>
<td style="width: 25%; text-align: right;">min</td>
<td style="width: 25%;">${stats.min}s</td>
<td style="width: 25%; text-align: right;">max</td>
<td style="width: 25%;">${stats.max}s</td>
</tr>
<tr>
<td style="width: 10px; text-align: right;">std.dev.</td>
<td>${pluginData.stats.std_dev}s</td>
<td style="text-align: right;">mean</td>
<td>${stats.mean}s</td>
<td style="text-align: right;">median</td>
<td>${stats.median}s</td>
</tr>
<tr>
<td style="width: 10px; text-align: right;">count</td>
<td>${pluginData.stats.count}</td>
<td style="text-align: right;">std.dev.</td>
<td>${stats.std_dev}s</td>
<td style="text-align: right;">count</td>
<td>${stats.count}</td>
</tr>
</tbody>
</table>
`;
} else {
statsElement.innerHTML = `N/A`;
return `N/A`;
}
}

Expand Down
1 change: 1 addition & 0 deletions src/web_interface/templates/base.html
Original file line number Diff line number Diff line change
Expand Up @@ -154,6 +154,7 @@
Statistics</a>
<a class="dropdown-item" href="/system_health" style="font-size: 14px"><i
class="fas fa-heartbeat"></i> System</a>
<a class="dropdown-item" href="/plugins" style="font-size: 14px"><i class="fas fa-puzzle-piece"></i> Plugins</a>
<a class="dropdown-item" href="/doc" style="font-size: 14px"><i class="fas fa-terminal"></i> Rest API</a>
<a class="dropdown-item" href="/about" style="font-size: 14px"><i class="fas fa-beer"></i> About</a>
</div>
Expand Down
72 changes: 72 additions & 0 deletions src/web_interface/templates/plugins.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,72 @@
{% extends "base.html" %}

{% set active_page = "Info" %}

{% block head %}
<script type="text/javascript" src="{{ url_for('static', filename='js/plugins.js') }}"></script>
<script>
setInterval(updatePluginStats, 5000);
updatePluginStats();
</script>
{% endblock %}

{% macro icon_tooltip_desk(icon, tooltip, icon_class=None) %}
{% set icon_class = icon_class if icon_class else 'fas' %}
<td class="align-middle text-center" style="width: 30px;" data-toggle="tooltip" data-placement="bottom" title="{{ tooltip }}">
<i class="{{ icon_class }} fa-{{ icon }}"></i>
</td>
{% endmacro %}

{% macro plugin_card(plugin_name) %}
{% set description, _, __, version, dependencies, blacklist, whitelist, threads = plugins[plugin_name] %}
<div class="card m-2" style="width: 430px;">
<div class="card-body">
<h5 class="card-title">{{ plugin_name }}</h5>
<h6 class="card-subtitle mb-2 text-muted">{{ version }}</h6>

<div class="collapse m-0 p-0 mt-3" id="{{ plugin_name }}">
<span class="card-text">
{{ description }}
</span>
<table class="table table-borderless mb-0 table-sm">
<tr>
{{ icon_tooltip_desk('project-diagram', 'Plugin dependencies') }}
<td>{{ dependencies | list_group_collapse | safe}}</td>
</tr>
<tr>
{{ icon_tooltip_desk('flag', 'Blacklisted file types') }}
<td>{{ blacklist | list_group_collapse | safe }}</td>
</tr>
<tr>
{{ icon_tooltip_desk('flag', 'Whitelisted file types', icon_class='far') }}
<td>{{ whitelist | list_group_collapse | safe }}</td>
</tr>

</table>
</div>

{% set button_id = "bt-" + plugin_name %}
<button class="btn btn-outline-secondary btn-sm btn-block mt-3" data-toggle="collapse" data-target="#{{ plugin_name }}" onclick="change_button('{{ button_id }}')">
<i id="{{ button_id }}" class="fas fa-caret-down"></i>
</button>

</div>
</div>
{% endmacro %}

{% block body %}

<div class="row justify-content-center mt-4">
<h3 class="mb-3">Analysis Plugins</h3>
</div>
{% if plugins %}
<div class="row justify-content-center">
{% for plugin_name in plugins | sort %}
{% if plugin_name != "unpacker" %}
{{ plugin_card(plugin_name) }}
{% endif %}
{% endfor %}
</div>
{% endif %}

{% endblock %}
74 changes: 13 additions & 61 deletions src/web_interface/templates/system_health.html
Original file line number Diff line number Diff line change
Expand Up @@ -72,47 +72,6 @@ <h6 class="card-subtitle mb-2" id="{{ component }}-status">
</div>
{% endmacro %}

{% macro plugin_card(plugin_name) %}
{% set description, _, __, version, dependencies, blacklist, whitelist, threads = analysis_plugin_info[plugin_name] %}
<div class="card m-2" style="width: 430px;">
<div class="card-body">
<h5 class="card-title">{{ plugin_name }}</h5>
<h6 class="card-subtitle mb-2 text-muted">{{ version }}</h6>

<div class="collapse m-0 p-0 mt-3" id="{{ plugin_name }}">
<span class="card-text">
{{ description }}
</span>
<table class="table table-borderless mb-0 table-sm">
<tr>
{{ icon_tooltip_desk('project-diagram', 'Plugin dependencies') }}
<td>{{ dependencies | list_group_collapse | safe}}</td>
</tr>
<tr>
{{ icon_tooltip_desk('flag', 'Blacklisted file types') }}
<td>{{ blacklist | list_group_collapse | safe }}</td>
</tr>
<tr>
{{ icon_tooltip_desk('flag', 'Whitelisted file types', icon_class='far') }}
<td>{{ whitelist | list_group_collapse | safe }}</td>
</tr>
<tr>
{{ icon_tooltip_desk('chart-bar', 'Analysis stats', icon_class='far') }}
<td id="{{ plugin_name }}-stats"></td>
</tr>

</table>
</div>

{% set button_id = "bt-" + plugin_name %}
<button class="btn btn-outline-secondary btn-sm btn-block mt-3" data-toggle="collapse" data-target="#{{ plugin_name }}" onclick="change_button('{{ button_id }}')">
<i id="{{ button_id }}" class="fas fa-caret-down"></i>
</button>

</div>
</div>
{% endmacro %}

{% block body %}

<div class="row justify-content-center mt-4">
Expand All @@ -122,9 +81,9 @@ <h6 class="card-subtitle mb-2 text-muted">{{ version }}</h6>
</div>

<div class="row justify-content-center mt-4">
{# anaylsis plugin status #}
<div class="col-3">
<div class="card m-2" style="width: 430px;">
{# analysis plugin status #}
<div class="col-md-12 col-lg-6 col-xl-5">
<div class="card m-2" style="width: 100%;">
<div class="card-body">
<div class="d-flex justify-content-between align-items-center" style="width: 100%">
<h5 class="card-title">Analysis Plugin Status</h5>
Expand Down Expand Up @@ -152,17 +111,25 @@ <h5 class="card-title">Analysis Plugin Status</h5>
<i class="fas fa-sign-out-alt" style="color: darkgrey" id="{{ plugin_name }}-out-queue-indicator"></i>
</td>
<td style="width: 40px;" id="{{ plugin_name }}-out-queue"></td>
<td style="width: 0px;" data-toggle="tooltip" data-placement="bottom" title="Show runtime stats">
<span class="fas fa-chart-bar clickable" style="color: #007bff;"
data-toggle="collapse" data-target="#{{ plugin_name }}-stats-collapse">
</span>
</td>
</tr>
<tr class="collapse" id="{{ plugin_name }}-stats-collapse">
<td colspan="10" class="p-0" id="{{ plugin_name }}-stats"></td>
</tr>
{% endfor %}
</table>
</div>
</div>
</div>

<div class="col-3">
<div class="col-md-12 col-lg-6 col-xl-4">
<!-- Current Analyses -->
<div class="row justify-content-center">
<div class="card m-2" style="width: 430px;">
<div class="card m-2" style="width: 100%;">
<div class="card-body">
<div class="d-flex justify-content-between align-items-center" style="width: 100%">
<h5 class="card-title">Currently analyzed firmware</h5>
Expand All @@ -180,19 +147,4 @@ <h5 class="card-title">Currently analyzed firmware</h5>
</div>
</div>

{% if analysis_plugin_info %}
<div class="row justify-content-center my-3">
<div style="width: 430px;" class="border-secondary border-top border-bottom align-middle">
<h5 class="d-flex justify-content-center mb-0 p-2">Analysis Plugins</h5>
</div>
</div>
<div class="row justify-content-center">
{% for plugin_name in analysis_plugin_info | sort %}
{% if plugin_name != "unpacker" %}
{{ plugin_card(plugin_name) }}
{% endif %}
{% endfor %}
</div>
{% endif %}

{% endblock %}

0 comments on commit f02a177

Please sign in to comment.