Skip to content

Commit cc77e2e

Browse files
committed
chg: [ui objects] refactor object dashboard + add investigations section
1 parent 182f52f commit cc77e2e

File tree

9 files changed

+238
-40
lines changed

9 files changed

+238
-40
lines changed

bin/lib/ail_stats.py

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -81,7 +81,7 @@ def get_feeders_dashboard_full():
8181

8282
def get_feeders_dashboard():
8383
timestamp = get_current_feeder_timestamp(int(time.time()))
84-
print(timestamp)
84+
# print(timestamp)
8585

8686
f_dashboard = {}
8787
t_feeders = get_feeders_by_time(timestamp)

var/www/blueprints/dashboard.py

Lines changed: 9 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -7,9 +7,6 @@
77

88
import os
99
import sys
10-
import time
11-
12-
import json # TODO REMOVE ME
1310

1411
from flask import render_template, Response, request, Blueprint
1512
from flask_login import login_required, current_user
@@ -23,9 +20,6 @@
2320
##################################
2421
from lib import ail_stats
2522

26-
# TODO STATS
27-
# from lib import ail_updates
28-
2923
# ============ BLUEPRINT ============
3024
dashboard = Blueprint('dashboard', __name__, template_folder=os.path.join(os.environ['AIL_FLASK'], 'templates/dashboard'))
3125

@@ -43,10 +37,19 @@ def index():
4337
user_org = current_user.get_org()
4438
user_id = current_user.get_user_id()
4539
nb_objects = ail_stats.get_nb_objs_dashboard()
40+
nb_objects = dict(sorted(nb_objects.items()))
4641
feeders_dashboard = ail_stats.get_feeders_dashboard_full()
4742
crawlers_stats = ail_stats.get_crawlers_stats()
4843
trackers = ail_stats.get_tracked_objs_dashboard(user_org, user_id)
4944
tagged_objs = ail_stats.get_tagged_objs_dashboard()
5045
return render_template("dashboard.html", feeders_dashboard=feeders_dashboard,
5146
nb_objects=nb_objects, trackers=trackers, tagged_objs=tagged_objs,
5247
bootstrap_label=bootstrap_label, crawlers_stats=crawlers_stats)
48+
49+
@dashboard.route("/objects", methods=['GET'])
50+
@login_required
51+
@login_read_only
52+
def objects_dashboard():
53+
nb_objects = ail_stats.get_nb_objs_dashboard()
54+
nb_objects = dict(sorted(nb_objects.items()))
55+
return render_template("objects_dashboard.html", nb_objects=nb_objects)

var/www/blueprints/investigations_b.py

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -58,7 +58,7 @@ def investigations_dashboard():
5858
def investigations_admin():
5959
inv_org = Investigations.get_orgs_investigations_meta(r_str=True)
6060
return render_template("investigations.html", bootstrap_label=bootstrap_label,
61-
inv_global=[], inv_org=inv_org)
61+
inv_global=[], inv_org=inv_org, is_admin=True)
6262

6363

6464
@investigations_b.route("/investigation", methods=['GET']) # # FIXME: add /view ????

var/www/blueprints/objects_item.py

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -51,6 +51,8 @@ def create_json_response(data, status_code):
5151

5252
# ============= ROUTES ==============
5353

54+
#### SCREENSHOTS ####
55+
5456
@objects_item.route('/screenshot/<path:filename>')
5557
@login_required
5658
@login_read_only
@@ -64,6 +66,8 @@ def screenshot(filename):
6466
s = Screenshot(filename)
6567
return send_from_directory(SCREENSHOT_FOLDER, s.get_rel_path(add_extension=True), as_attachment=False, mimetype='image')
6668

69+
## --SCREENSHOTS-- ##
70+
6771
@objects_item.route("/object/item")
6872
@login_required
6973
@login_read_only
Lines changed: 160 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,160 @@
1+
<!DOCTYPE html>
2+
<html>
3+
4+
<head>
5+
<title>AIL Framework</title>
6+
<link rel="icon" href="{{ url_for('static', filename='image/ail-icon.png') }}">
7+
8+
<!-- Core CSS -->
9+
<link href="{{ url_for('static', filename='css/bootstrap4.min.css') }}" rel="stylesheet">
10+
<link href="{{ url_for('static', filename='css/font-awesome.min.css') }}" rel="stylesheet">
11+
12+
<!-- JS -->
13+
<script src="{{ url_for('static', filename='js/jquery.js')}}"></script>
14+
<script src="{{ url_for('static', filename='js/helper.js')}}"></script>
15+
<script src="{{ url_for('static', filename='js/popper.min.js')}}"></script>
16+
<script src="{{ url_for('static', filename='js/bootstrap4.min.js')}}"></script>
17+
18+
<style>
19+
.popover {
20+
max-width: none;
21+
width: 500px;
22+
}
23+
.icon-button {
24+
position: relative;
25+
display: inline-block;
26+
border: none;
27+
background: none;
28+
{#padding: 0;#}
29+
margin: 0;
30+
cursor: pointer;
31+
outline: inherit;
32+
transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;
33+
}
34+
35+
.icon-wrapper {
36+
position: relative;
37+
display: inline-block;
38+
}
39+
40+
.notification-badge {
41+
position: absolute;
42+
top: -10px;
43+
right: -10px;
44+
font-size: 14px;
45+
background: forestgreen;
46+
}
47+
</style>
48+
49+
</head>
50+
<body>
51+
52+
{% include 'nav_bar.html' %}
53+
54+
<div class="container-fluid">
55+
<div class="row">
56+
57+
{% include 'sidebars/sidebar_objects.html' %}
58+
59+
<div class="col-12 col-lg-10" id="core_content">
60+
61+
<div class="row">
62+
<div class="col-12 col-xl-6">
63+
<div class="text-center mt-4">
64+
<a class="btn btn-dark border-secondary" href="{{url_for('chats_explorer.chats_explorer_protocols')}}">
65+
<div class="card-body">
66+
<h2 class="card-title">
67+
<i class="far fa-comments fa-2x "></i>
68+
<b>Chats Explorer</b>
69+
</h2>
70+
<i class="fab fa-discord fa-2x"></i>
71+
<i class="fab fa-telegram fa-2x"></i>
72+
<i class="fas fa-comment-dots fa-2x"></i>
73+
</div>
74+
</a>
75+
</div>
76+
</div>
77+
78+
<div class="col-12 col-xl-6">
79+
80+
<h3 class="text-center mt-1 mb-4" id="current_date"></h3>
81+
82+
<div class="row">
83+
84+
{% for obj_type in nb_objects %}
85+
<div class="col-sm-6 col-md-4 col-lg-3 text-center mb-4">
86+
{% with type=obj_type, name=nb_objects[obj_type]['name'], icon=nb_objects[obj_type]['icon']['icon'], nb=nb_objects[obj_type]['nb'], url=nb_objects[obj_type]['link'] %}
87+
{% include 'objects/block_obj_button.html' %}
88+
{% endwith %}
89+
</div>
90+
{% endfor %}
91+
92+
</div>
93+
94+
</div>
95+
</div>
96+
97+
</div>
98+
99+
100+
101+
</div>
102+
103+
<script>
104+
$(document).ready(function(){
105+
$("#page-Decoded").addClass("active");
106+
updateDate();
107+
});
108+
109+
var btn_selector = {
110+
{% for obj_type in nb_objects %}
111+
'{{ obj_type }}': $("#obj_btn_{{ obj_type }}"),
112+
{% endfor %}
113+
}
114+
</script>
115+
116+
<script>
117+
118+
function updateDate() {
119+
let d = new Date();
120+
let day = d.getUTCDate();
121+
if (day < 10) {
122+
day = "0" + day;
123+
}
124+
let month = d.getUTCMonth() + 1
125+
if (month < 10) {
126+
month = "0" + month;
127+
}
128+
let current_date = d.getUTCFullYear() + ' - ' + month + ' - ' + day;
129+
$('#current_date').text(current_date)
130+
}
131+
132+
function updateNbObjects(data) {
133+
for (const obj_type in data) {
134+
btn_selector[obj_type].text(data[obj_type]);
135+
}
136+
}
137+
138+
// WebSocket
139+
var socket = new WebSocket("wss://" + window.location.host + "/ws/dashboard");
140+
socket.wsocket = function(event) {
141+
console.log("WebSocket connection opened:", event);
142+
};
143+
socket.onmessage = function(event) {
144+
$("[data-toggle='popover']").popover('destroy');
145+
let data = JSON.parse(event.data);
146+
updateNbObjects(data['objs']);
147+
updateDate();
148+
};
149+
socket.onerror = function(error) {
150+
console.error('WebSocket error:', error);
151+
};
152+
socket.onclose = function(event) {
153+
console.log('WebSocket connection closed:', event);
154+
};
155+
156+
157+
</script>
158+
159+
</body>
160+
</html>

var/www/templates/investigations/investigations.html

Lines changed: 16 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -26,22 +26,22 @@
2626
<div class="container-fluid">
2727
<div class="row">
2828

29-
{% include 'sidebars/sidebar_objects.html' %}
29+
{% include 'sidebars/sidebar_investigations.html' %}
3030

3131
<div class="col-12 col-lg-10" id="core_content">
3232

3333
<h3 class="mt-2 text-secondary">
34-
<i class="fas fa-microscope"></i> Organisation Investigations:
34+
<i class="fas fa-microscope"></i> My Organisation:
3535
</h3>
3636

3737
<table id="table_investigation" class="table table-striped border-primary">
3838
<thead class="bg-dark text-white">
3939
<tr>
4040
<th>Name</th>
41-
<th>Org</th>
41+
<th>Info</th>
42+
{% if is_admin %}<th>Org</th>{% endif %}
4243
<th>Date</th>
4344
<th>last modified</th>
44-
<td>Info</td>
4545
<th>Nb Objects</th>
4646
</tr>
4747
</thead>
@@ -58,12 +58,14 @@ <h3 class="mt-2 text-secondary">
5858
</div>
5959
</a>
6060
</td>
61-
<td>
62-
{{ dict_investigation['org_name']}}<br>{{ dict_investigation['org'] }}
63-
</td>
61+
<td>{{ dict_investigation['info']}}</td>
62+
{% if is_admin %}
63+
<td>
64+
{{ dict_investigation['org_name']}}<span hidden>{{ dict_investigation['org'] }}</span>
65+
</td>
66+
{% endif %}
6467
<td>{{ dict_investigation['date']}}</td>
6568
<td>{{ dict_investigation['last_change']}}</td>
66-
<td>{{ dict_investigation['info']}}</td>
6769
<td>{{ dict_investigation['nb_objects']}}</td>
6870
</tr>
6971
{% endfor %}
@@ -81,7 +83,7 @@ <h3 class="mt-2 text-secondary">
8183
<th>Org</th>
8284
<th>Date</th>
8385
<th>last modified</th>
84-
<td>Info</td>
86+
<th>Info</th>
8587
<th>Nb Objects</th>
8688
</tr>
8789
</thead>
@@ -100,7 +102,7 @@ <h3 class="mt-2 text-secondary">
100102
</td>
101103
<td>
102104
{% if dict_investigation['org'] %}
103-
{{ dict_investigation['org_name']}}<br>{{ dict_investigation['org'] }}
105+
{{ dict_investigation['org_name']}}<span hidden>{{ dict_investigation['org'] }}</span>
104106
{% endif %}
105107
</td>
106108
<td>{{ dict_investigation['date']}}</td>
@@ -112,7 +114,7 @@ <h3 class="mt-2 text-secondary">
112114
</tbody>
113115
</table>
114116

115-
<a class="btn btn-primary mt-2" href="{{ url_for('investigations_b.add_investigation') }}">
117+
<a class="btn btn-primary my-2" href="{{ url_for('investigations_b.add_investigation') }}">
116118
<i class="fas fa-plus"></i> Create Investigation
117119
</a>
118120

@@ -125,19 +127,19 @@ <h3 class="mt-2 text-secondary">
125127

126128
<script>
127129
$(document).ready(function(){
128-
$("#page-Decoded").addClass("active");
130+
$("#page-investigation").addClass("active");
129131
$('#nav_investigation').removeClass("text-muted");
130132
$("#nav_investigation_dashboard").addClass("active");
131133

132134
$('#table_investigation').DataTable({
133135
"aLengthMenu": [[5, 10, 15, -1], [5, 10, 15, "All"]],
134136
"iDisplayLength": 10,
135-
"order": [[ 2, "desc" ]]
137+
"order": [[ 3, "desc" ]]
136138
});
137139
$('#table_investigation_global').DataTable({
138140
"aLengthMenu": [[5, 10, 15, -1], [5, 10, 15, "All"]],
139141
"iDisplayLength": 10,
140-
"order": [[ 2, "desc" ]]
142+
"order": [[ 3, "desc" ]]
141143
});
142144

143145
});

var/www/templates/nav_bar.html

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -25,7 +25,10 @@
2525
<a class="nav-link" id="page-Crawler" href="{{ url_for('crawler_splash.crawlers_dashboard') }}" tabindex="-1" aria-disabled="true"><i class="fas fa-spider"></i> Crawlers</a>
2626
</li>
2727
<li class="nav-item mr-3">
28-
<a class="nav-link" id="page-Decoded" href="{{ url_for('investigations_b.investigations_dashboard') }}" aria-disabled="true"><i class="fas fa-cube"></i> Objects</a>
28+
<a class="nav-link" id="page-Decoded" href="{{ url_for('dashboard.objects_dashboard') }}" aria-disabled="true"><i class="fas fa-cube"></i> Objects</a>
29+
</li>
30+
<li class="nav-item mr-3">
31+
<a class="nav-link" id="page-investigation" href="{{ url_for('investigations_b.investigations_dashboard') }}" aria-disabled="true"><i class="fas fa-microscope"></i> Investigations</a>
2932
</li>
3033
<li class="nav-item mr-3">
3134
<a class="nav-link" id="page-search" href="{{ url_for('search_b.search_dashboard') }}" aria-disabled="true"><i class="fas fa-search"></i> Search</a>
Lines changed: 43 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,43 @@
1+
<div class="col-12 col-lg-2 p-0 bg-light border-right" id="side_menu">
2+
3+
<button type="button" class="btn btn-outline-secondary mt-1 ml-3" onclick="toggle_sidebar()">
4+
<i class="fas fa-align-left"></i>
5+
<span>Toggle Sidebar</span>
6+
</button>
7+
8+
<nav class="navbar navbar-expand navbar-light bg-light flex-md-column flex-row align-items-start py-2" id="nav_menu">
9+
<h5 class="d-flex text-muted w-100">
10+
<span>Investigations</span>
11+
</h5>
12+
<ul class="nav flex-md-column flex-row navbar-nav justify-content-between w-100 mb-4">
13+
<li class="nav-item">
14+
<a class="nav-link" href="{{url_for('investigations_b.investigations_dashboard')}}" id="nav_investigation_dashboard">
15+
<i class="fas fa-microscope"></i>
16+
<span>Investigations</span>
17+
</a>
18+
</li>
19+
<li class="nav-item">
20+
<a class="nav-link" href="{{url_for('investigations_b.add_investigation')}}" id="nav_add_investigation">
21+
<i class="fas fa-plus"></i>
22+
<span>Add Investigation</span>
23+
</a>
24+
</li>
25+
</ul>
26+
</nav>
27+
</div>
28+
29+
<script>
30+
function toggle_sidebar(){
31+
if($('#nav_menu').is(':visible')){
32+
$('#nav_menu').hide();
33+
$('#side_menu').removeClass('border-right')
34+
$('#side_menu').removeClass('col-lg-2')
35+
$('#core_content').removeClass('col-lg-10')
36+
}else{
37+
$('#nav_menu').show();
38+
$('#side_menu').addClass('border-right')
39+
$('#side_menu').addClass('col-lg-2')
40+
$('#core_content').addClass('col-lg-10')
41+
}
42+
}
43+
</script>

0 commit comments

Comments
 (0)