mirror of https://github.com/CIRCL/lookyloo
new: use multiple modals instead of changing page in favicons and ressources views
Raphaël Vinot
parent
15e409340f
commit
dcbec2efef
|
|
@ -1046,10 +1046,10 @@ class Lookyloo():
|
|||
for domain, freq in self.indexing.get_cookie_domains(cookie_name)]
|
||||
return captures, domains
|
||||
|
||||
def get_favicon_investigator(self, favicon_sha512: str, /) -> tuple[list[tuple[str, str, str]], bytes | None]:
|
||||
def get_favicon_investigator(self, favicon_sha512: str, /) -> tuple[list[tuple[str, str, str, datetime]], bytes | None]:
|
||||
'''Returns all the captures related to a cookie name entry, used in the web interface.'''
|
||||
cached_captures = self.sorted_capture_cache([uuid for uuid in self.indexing.get_captures_favicon(favicon_sha512)])
|
||||
captures = [(cache.uuid, cache.title, cache.redirects[-1]) for cache in cached_captures]
|
||||
captures = [(cache.uuid, cache.title, cache.redirects[-1], cache.timestamp) for cache in cached_captures]
|
||||
favicon = self.indexing.get_favicon(favicon_sha512)
|
||||
return captures, favicon
|
||||
|
||||
|
|
|
|||
|
|
@ -1,3 +1,4 @@
|
|||
{% if from_popup %}
|
||||
{% extends "main.html" %}
|
||||
|
||||
{% from 'bootstrap5/utils.html' import render_messages %}
|
||||
|
|
@ -13,53 +14,59 @@
|
|||
});
|
||||
</script>
|
||||
|
||||
{% if from_popup %}
|
||||
<script type="text/javascript">
|
||||
function openTreeInNewTab(treeUUID) {
|
||||
window.opener.openTreeInNewTab(treeUUID);
|
||||
};
|
||||
</script>
|
||||
{% endif %}
|
||||
|
||||
{% endblock %}
|
||||
{%endif%}
|
||||
|
||||
{% block content %}
|
||||
<center>
|
||||
<h4>{{ body_hash }}</h4>
|
||||
{% if from_popup %}
|
||||
<button onclick="window.history.back();" class="btn btn-primary" type="button">Go Back</button>
|
||||
{% endif %}
|
||||
</center>
|
||||
<div class="table-responsive">
|
||||
<table id="table" class="table" style="width:96%">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Hostname</th>
|
||||
<th>Frequency</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
{% for domain, freq in domains %}
|
||||
<tr>
|
||||
<td>
|
||||
{{ domain }}
|
||||
</td>
|
||||
<td>{{ freq }}</td>
|
||||
</tr>
|
||||
{% endfor %}
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
<p>The same file was seen in these captures:</p>
|
||||
<ul>
|
||||
{% for capture_uuid, title in captures %}
|
||||
<li>
|
||||
{% if from_popup %}
|
||||
<a href="#/" onclick="openTreeInNewTab('{{ capture_uuid }}')">{{ title }}</a>
|
||||
{% else %}
|
||||
<a href="{{ url_for('tree', tree_uuid=capture_uuid) }}")">{{ title }}</a>
|
||||
{% endif %}
|
||||
</li>
|
||||
{% endfor %}
|
||||
</ul>
|
||||
|
||||
{% if from_popup %}
|
||||
<button onclick="window.history.back();" class="btn btn-primary" type="button">Go Back</button>
|
||||
{%endif%}
|
||||
|
||||
<script type="text/javascript">
|
||||
new DataTable('#bodyHashDetailsTable', {
|
||||
columnDefs: [{ width: '20%', targets: 0 },
|
||||
{ width: '80%', targets: 1 }],
|
||||
});
|
||||
</script>
|
||||
<center>
|
||||
<h4>{{ body_hash }}</h4>
|
||||
</center>
|
||||
<table id="bodyHashDetailsTable" class="table table-striped" style="width:100%">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Hostname</th>
|
||||
<th>Frequency</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
{% for domain, freq in domains %}
|
||||
<tr>
|
||||
<td>
|
||||
{{ domain }}
|
||||
</td>
|
||||
<td>{{ freq }}</td>
|
||||
</tr>
|
||||
{% endfor %}
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
<p>The same file was seen in these captures:</p>
|
||||
<ul>
|
||||
{% for capture_uuid, title in captures %}
|
||||
<li>
|
||||
{% if from_popup %}
|
||||
<a href="#/" onclick="openTreeInNewTab('{{ capture_uuid }}')">{{ title }}</a>
|
||||
{% else %}
|
||||
<a href="{{ url_for('tree', tree_uuid=capture_uuid) }}">{{ title }}</a>
|
||||
{% endif %}
|
||||
</li>
|
||||
{% endfor %}
|
||||
</ul>
|
||||
{% endblock %}
|
||||
|
|
|
|||
|
|
@ -1,39 +1,37 @@
|
|||
{% extends "main.html" %}
|
||||
<script type="text/javascript">
|
||||
new DataTable('#faviconDetailsTable', {
|
||||
columnDefs: [{ width: '40%', targets: 0 },
|
||||
{ width: '40%', targets: 1 },
|
||||
{ width: '20%', targets: 2 }],
|
||||
});
|
||||
</script>
|
||||
|
||||
{% from 'bootstrap5/utils.html' import render_messages %}
|
||||
|
||||
{% block title %}Favicon: {{ favicon_sha512 }}{% endblock %}
|
||||
|
||||
{% block content %}
|
||||
<center>
|
||||
<h2>{{ favicon_sha512 }}</h2>
|
||||
<img src="data:image/ico;base64,{{ b64_favicon }}" style="width:32px;height:32px;"/>
|
||||
</center>
|
||||
<p>The same favicon was seen in these captures:</p>
|
||||
<ul>
|
||||
<div class="table-responsive">
|
||||
<table id="table" class="table">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Capture Title</th>
|
||||
<th>Landing page</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
{% for capture_uuid, title, landing_page in captures %}
|
||||
<tr>
|
||||
<td>
|
||||
<a href="{{ url_for('tree', tree_uuid=capture_uuid) }}">
|
||||
{{ title }}
|
||||
</a>
|
||||
</td>
|
||||
<td>
|
||||
{{landing_page}}
|
||||
</td>
|
||||
</tr>
|
||||
{% endfor %}
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</ul>
|
||||
{% endblock %}
|
||||
<center>
|
||||
<img src="data:image/ico;base64,{{ b64_favicon }}" style="width:64px;height:64px;"/>
|
||||
</center>
|
||||
<table id="faviconDetailsTable" class="table table-striped" style="width:100%">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Capture Title</th>
|
||||
<th>Landing page</th>
|
||||
<th>Capture Time</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
{% for capture_uuid, title, landing_page, capture_time in captures %}
|
||||
<tr>
|
||||
<td>
|
||||
<a href="{{ url_for('tree', tree_uuid=capture_uuid) }}">
|
||||
{{ title }}
|
||||
</a>
|
||||
</td>
|
||||
<td>
|
||||
{{landing_page}}
|
||||
</td>
|
||||
<td>
|
||||
{{capture_time}}
|
||||
</td>
|
||||
</tr>
|
||||
{% endfor %}
|
||||
</tbody>
|
||||
</table>
|
||||
|
|
|
|||
|
|
@ -4,68 +4,75 @@
|
|||
{% if not circl_pdns and not riskiq %}
|
||||
No historical data available
|
||||
{%else%}
|
||||
{% if circl_pdns %}
|
||||
<center>
|
||||
<h1 class="display-4">CIRCL Passive DNS
|
||||
<div class="help-tip" title="Click for more details"
|
||||
onclick="location.href='https://www.circl.lu/services/passive-dns/';"
|
||||
style="cursor: pointer;">
|
||||
</div>
|
||||
</h1>
|
||||
{% for query, responses in circl_pdns.items() if responses %}
|
||||
<div>
|
||||
<h3>{{query}}</h3>
|
||||
<table class="table">
|
||||
{% if circl_pdns %}
|
||||
<script type="text/javascript">
|
||||
new DataTable('#CIRCL_pdns_table');
|
||||
</script>
|
||||
|
||||
<center>
|
||||
<h1 class="display-4">CIRCL Passive DNS
|
||||
<div class="help-tip" title="Click for more details"
|
||||
onclick="location.href='https://www.circl.lu/services/passive-dns/';"
|
||||
style="cursor: pointer;">
|
||||
</div>
|
||||
</h1>
|
||||
{% for query, responses in circl_pdns.items() if responses %}
|
||||
<div>
|
||||
<h3>{{query}}</h3>
|
||||
<table id= "CIRCL_pdns_table" class="table table-striped" style="width:100%">
|
||||
<thead>
|
||||
<tr>
|
||||
<th class="col-sm-2" scope="col">First seen</th>
|
||||
<th class="col-sm-2" scope="col">Last seen</th>
|
||||
<th class="col-sm-1" scope="col">RR Type</th>
|
||||
<th class="col-sm-2" scope="col">R Data</th>
|
||||
<th scope="col">RR Name</th>
|
||||
</thead>
|
||||
<tbody>
|
||||
{%for response in responses %}
|
||||
<tr>
|
||||
<td>{{response.time_first_datetime}}</td>
|
||||
<td>{{response.time_last_datetime}}</td>
|
||||
<td>{{response.rrtype}}</td>
|
||||
<td>{{response.rdata}}</td>
|
||||
<td>{{response.rrname}}</td>
|
||||
</tr>
|
||||
{% endfor %}
|
||||
</table>
|
||||
</div>
|
||||
{%endfor%}
|
||||
</center>
|
||||
{% endif%}
|
||||
{% if riskiq %}
|
||||
<hr>
|
||||
<script type="text/javascript">
|
||||
new DataTable('#RiskIQ_pdns_table');
|
||||
</script>
|
||||
<center>
|
||||
<h1 class="display-4">RiskIQ</h1>
|
||||
<div>
|
||||
<h3>{{riskiq['queryValue']}}</h3>
|
||||
<h4>{{riskiq['firstSeen']}} - {{ riskiq['lastSeen']}}</h4>
|
||||
<table id="RiskIQ_pdns_table" class="table table-striped" style="width:100%">
|
||||
<thead>
|
||||
<tr>
|
||||
<th class="col-sm-2" scope="col">First seen</th>
|
||||
<th class="col-sm-2" scope="col">Last seen</th>
|
||||
<th class="col-sm-1" scope="col">RR Type</th>
|
||||
<th class="col-sm-2" scope="col">R Data</th>
|
||||
<th scope="col">RR Name</th>
|
||||
<th class="col-sm-1" scope="col">Type</th>
|
||||
<th scope="col">Resolve</th>
|
||||
</thead>
|
||||
<tbody>
|
||||
{%for response in responses %}
|
||||
{% for entry in riskiq['results'] %}
|
||||
<tr>
|
||||
<td>{{response.time_first_datetime}}</td>
|
||||
<td>{{response.time_last_datetime}}</td>
|
||||
<td>{{response.rrtype}}</td>
|
||||
<td>{{response.rdata}}</td>
|
||||
<td>{{response.rrname}}</td>
|
||||
<td>{{entry['firstSeen']}}</td>
|
||||
<td>{{entry['lastSeen']}}</td>
|
||||
<td>{{entry['recordType']}}</td>
|
||||
<td>{{entry['resolve']}}</td>
|
||||
</tr>
|
||||
{% endfor %}
|
||||
</table>
|
||||
</div>
|
||||
{%endfor%}
|
||||
</center>
|
||||
{% endif%}
|
||||
{% if riskiq %}
|
||||
<hr>
|
||||
<center>
|
||||
<h1 class="display-4">RiskIQ</h1>
|
||||
<div>
|
||||
<h3>{{riskiq['queryValue']}}</h3>
|
||||
<h4>{{riskiq['firstSeen']}} - {{ riskiq['lastSeen']}}</h4>
|
||||
<table class="table">
|
||||
<thead>
|
||||
<tr>
|
||||
<th class="col-sm-2" scope="col">First seen</th>
|
||||
<th class="col-sm-2" scope="col">Last seen</th>
|
||||
<th class="col-sm-1" scope="col">Type</th>
|
||||
<th scope="col">Resolve</th>
|
||||
</thead>
|
||||
<tbody>
|
||||
{% for entry in riskiq['results'] %}
|
||||
<tr>
|
||||
<td>{{entry['firstSeen']}}</td>
|
||||
<td>{{entry['lastSeen']}}</td>
|
||||
<td>{{entry['recordType']}}</td>
|
||||
<td>{{entry['resolve']}}</td>
|
||||
</tr>
|
||||
{% endfor %}
|
||||
</table>
|
||||
</div>
|
||||
</center>
|
||||
{% endif%}
|
||||
</div>
|
||||
</center>
|
||||
{% endif%}
|
||||
{% endif%}
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -91,6 +91,13 @@
|
|||
});
|
||||
</script>
|
||||
<script>
|
||||
$('#faviconDetailsModal').on('show.bs.modal', function(e) {
|
||||
var button = $(e.relatedTarget);
|
||||
var modal = $(this);
|
||||
modal.find('.modal-body').load(button.data("remote"));
|
||||
});
|
||||
</script>
|
||||
<script>
|
||||
$('#bodyHashesModal').on('show.bs.modal', function(e) {
|
||||
var button = $(e.relatedTarget);
|
||||
var modal = $(this);
|
||||
|
|
@ -98,6 +105,13 @@
|
|||
});
|
||||
</script>
|
||||
<script>
|
||||
$('#bodyHashDetailsModal').on('show.bs.modal', function(e) {
|
||||
var button = $(e.relatedTarget);
|
||||
var modal = $(this);
|
||||
modal.find('.modal-body').load(button.data("remote"));
|
||||
});
|
||||
</script>
|
||||
<script>
|
||||
$('#mispPushModal').on('show.bs.modal', function(e) {
|
||||
var button = $(e.relatedTarget);
|
||||
var modal = $(this);
|
||||
|
|
@ -537,6 +551,26 @@
|
|||
</div>
|
||||
</div>
|
||||
|
||||
<div class="modal fade" id="faviconDetailsModal" tabindex="-1" role="dialog">
|
||||
<div class="modal-dialog modal-xl" role="document">
|
||||
<div class="modal-content">
|
||||
<div class="modal-header">
|
||||
<h5 class="modal-title" id="faviconDetailsModalLabel">Other occurrences of the favicon</h5>
|
||||
<button type="button" class="btn btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
|
||||
</div>
|
||||
<div class="modal-body">
|
||||
... loading favicon details ...
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<a class="btn btn-primary" href="#faviconsModal"
|
||||
data-remote="{{ url_for('tree_favicons', tree_uuid=tree_uuid) }}"
|
||||
data-bs-toggle="modal" data-bs-target="#faviconsModal" role="button">Back to capture's favicons</a>
|
||||
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="modal fade" id="bodyHashesModal" tabindex="-1" role="dialog">
|
||||
<div class="modal-dialog modal-xl" role="document">
|
||||
<div class="modal-content">
|
||||
|
|
@ -554,6 +588,26 @@
|
|||
</div>
|
||||
</div>
|
||||
|
||||
<div class="modal fade" id="bodyHashDetailsModal" tabindex="-1" role="dialog">
|
||||
<div class="modal-dialog modal-xl" role="document">
|
||||
<div class="modal-content">
|
||||
<div class="modal-header">
|
||||
<h5 class="modal-title" id="bodyHashDetailsModalLabel">Other occurrences of the ressource</h5>
|
||||
<button type="button" class="btn btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
|
||||
</div>
|
||||
<div class="modal-body">
|
||||
... loading ressource details ...
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<a class="btn btn-primary" href="#bodyHashesModal"
|
||||
data-remote="{{ url_for('tree_body_hashes', tree_uuid=tree_uuid) }}"
|
||||
data-bs-toggle="modal" data-bs-target="#bodyHashesModal" role="button">Back to capture's ressources</a>
|
||||
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="modal fade" id="mispPushModal" tabindex="-1" role="dialog">
|
||||
<div class="modal-dialog modal-xl" role="document">
|
||||
<div class="modal-content">
|
||||
|
|
|
|||
|
|
@ -1,35 +1,13 @@
|
|||
<script type="text/javascript">
|
||||
$('#bodyHashesTable')
|
||||
.on('order.dt', () => {
|
||||
$(function () {
|
||||
$('[data-bs-toggle="tooltip"]').tooltip()
|
||||
})
|
||||
})
|
||||
.on('search.dt', () => {
|
||||
$(function () {
|
||||
$('[data-bs-toggle="tooltip"]').tooltip()
|
||||
})
|
||||
})
|
||||
.on('page.dt', () => {
|
||||
$(function () {
|
||||
$('[data-bs-toggle="tooltip"]').tooltip()
|
||||
})
|
||||
})
|
||||
.DataTable( {
|
||||
"order": [[ 1, "desc" ]],
|
||||
"pageLength": 50
|
||||
});
|
||||
new DataTable('#bodyHashesTable', {
|
||||
columnDefs: [{ width: '10%', targets: 0 },
|
||||
{ width: '10%', targets: 1 },
|
||||
{ width: '60%', targets: 2 },
|
||||
{ width: '20%', targets: 3 }],
|
||||
});
|
||||
</script>
|
||||
|
||||
{% if from_popup %}
|
||||
<script type="text/javascript">
|
||||
function openTreeInNewTab(treeUUID) {
|
||||
window.opener.openTreeInNewTab(treeUUID);
|
||||
};
|
||||
</script>
|
||||
{% endif %}
|
||||
|
||||
<table id="bodyHashesTable" class="table w-auto">
|
||||
<table id="bodyHashesTable" class="table table-striped" style="width:100%">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>File type</th>
|
||||
|
|
@ -60,7 +38,10 @@
|
|||
<td><p class="text-break">{{ info['node'].name }}</p></td>
|
||||
<td>
|
||||
<span class="d-inline-block text-truncate" style="max-width: 200px;">
|
||||
<a href="{{ url_for('body_hash_details', body_hash=body_hash) }}">{{body_hash}}</a>
|
||||
<a href="#bodyHashDetailsModal" data-remote="{{ url_for('body_hash_details', body_hash=body_hash) }}"
|
||||
data-bs-toggle="modal" data-bs-target="#bodyHashDetailsModal" role="button">
|
||||
{{body_hash}}
|
||||
</a>
|
||||
</span>
|
||||
</td>
|
||||
</tr>
|
||||
|
|
|
|||
|
|
@ -1,35 +1,12 @@
|
|||
<script type="text/javascript">
|
||||
$('#faviconsTable')
|
||||
.on('order.dt', () => {
|
||||
$(function () {
|
||||
$('[data-bs-toggle="tooltip"]').tooltip()
|
||||
})
|
||||
})
|
||||
.on('search.dt', () => {
|
||||
$(function () {
|
||||
$('[data-bs-toggle="tooltip"]').tooltip()
|
||||
})
|
||||
})
|
||||
.on('page.dt', () => {
|
||||
$(function () {
|
||||
$('[data-bs-toggle="tooltip"]').tooltip()
|
||||
})
|
||||
})
|
||||
.DataTable( {
|
||||
"order": [[ 1, "desc" ]],
|
||||
"pageLength": 50
|
||||
});
|
||||
new DataTable('#faviconsTable', {
|
||||
columnDefs: [{ width: '20%', targets: 0 },
|
||||
{ width: '40%', targets: 1 },
|
||||
{ width: '40%', targets: 2 }],
|
||||
});
|
||||
</script>
|
||||
|
||||
{% if from_popup %}
|
||||
<script type="text/javascript">
|
||||
function openTreeInNewTab(treeUUID) {
|
||||
window.opener.openTreeInNewTab(treeUUID);
|
||||
};
|
||||
</script>
|
||||
{% endif %}
|
||||
|
||||
<table id="faviconsTable" class="table w-auto">
|
||||
<table id="faviconsTable" class="table table-striped" style="width:100%">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Favicon</th>
|
||||
|
|
@ -41,7 +18,8 @@
|
|||
{% for favicon_sha512, freq, number_captures, b64_favicon in favicons %}
|
||||
<tr>
|
||||
<td>
|
||||
<a href="{{ url_for('favicon_detail', favicon_sha512=favicon_sha512) }}">
|
||||
<a href="#faviconDetailsModal" data-remote="{{ url_for('favicon_detail', favicon_sha512=favicon_sha512) }}"
|
||||
data-bs-toggle="modal" data-bs-target="#faviconDetailsModal" role="button">
|
||||
<img src="data:image/ico;base64,{{ b64_favicon }}" style="width:32px;height:32px;"/>
|
||||
</a>
|
||||
</td>
|
||||
|
|
|
|||
Loading…
Reference in New Issue