mirror of https://github.com/CIRCL/AIL-framework
253 lines
12 KiB
HTML
253 lines
12 KiB
HTML
<!DOCTYPE html>
|
|
<html>
|
|
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
|
|
<title>Analysis Information Leak framework Dashboard</title>
|
|
|
|
<!-- Core CSS -->
|
|
<link href="{{ url_for('static', filename='css/bootstrap.min.css') }}" rel="stylesheet">
|
|
<link href="{{ url_for('static', filename='font-awesome/css/font-awesome.css') }}" rel="stylesheet">
|
|
<link href="{{ url_for('static', filename='css/sb-admin-2.css') }}" rel="stylesheet">
|
|
<link href="{{ url_for('static', filename='css/dataTables.bootstrap.css') }}" rel="stylesheet" type="text/css" />
|
|
<link href="{{ url_for('static', filename='css/jquery-ui.min.css') }}" rel="stylesheet" type="text/css" />
|
|
<script language="javascript" src="{{ url_for('static', filename='js/jquery.js')}}"></script>
|
|
<script src="{{ url_for('static', filename='js/bootstrap.min.js') }}"></script>
|
|
<script src="{{ url_for('static', filename='js/jquery.dataTables.min.js') }}"></script>
|
|
<script src="{{ url_for('static', filename='js/dataTables.bootstrap.js') }}"></script>
|
|
<script src="{{ url_for('static', filename='js/jquery.flot.js') }}"></script>
|
|
<script src="{{ url_for('static', filename='js/jquery.flot.time.js') }}"></script>
|
|
<script src="{{ url_for('static', filename='js/jquery.flot.stack.js') }}"></script>
|
|
|
|
<style>
|
|
.sparkLineStats ul {
|
|
padding-left:0;
|
|
list-style:none
|
|
}
|
|
.btn-link {
|
|
color: #000000
|
|
}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
|
|
<div id="wrapper">
|
|
<nav class="navbar navbar-default navbar-static-top" role="navigation" style="margin-bottom: 0">
|
|
{% include 'header.html' %}
|
|
<!-- /.navbar-top-links -->
|
|
<div class="navbar-default sidebar" role="navigation">
|
|
<div class="sidebar-collapse">
|
|
<ul class="nav" id="side-menu">
|
|
<li class="sidebar-search">
|
|
{% include 'searchbox.html' %}
|
|
</li>
|
|
</ul>
|
|
<!-- /#side-menu -->
|
|
</div>
|
|
<!-- /.sidebar-collapse -->
|
|
<a href="{{ url_for('index') }}"><img src="{{ url_for('static', filename='image/AIL.png') }}" /></a>
|
|
</div>
|
|
<!-- /.navbar-static-side -->
|
|
</nav>
|
|
</div>
|
|
|
|
<div id="page-wrapper">
|
|
<div class="row">
|
|
<div class="col-lg-12">
|
|
<h1 class="page-header" data-page="page-termsfrequency" >Terms frequency: Management interface</h1>
|
|
</div>
|
|
<!-- /.col-lg-12 -->
|
|
</div>
|
|
<!-- /.row -->
|
|
<div class="row">
|
|
|
|
<!-- Panel OPTIONS -->
|
|
<div class="row">
|
|
<div class="col-lg-12">
|
|
<div class="row">
|
|
<div class="col-lg-12">
|
|
<div id="panel-today" class="panel panel-success">
|
|
<div class="panel-heading">
|
|
<strong>Manage tracked terms</strong>
|
|
</div>
|
|
<div class="panel-body">
|
|
|
|
<div class="form-group input-group" style="margin-bottom: 30px;">
|
|
<span class="input-group-addon"><span class="fa fa-eye"></span></span>
|
|
<input id="followTermInput" class="form-control" placeholder="Term to track" type="text" style="max-width: 400px;">
|
|
<button class="btn btn-success btn-interaction" style="margin-left: 10px;" data-section="followTerm" data-action="add"> Add term</button>
|
|
</div>
|
|
|
|
<table class="table table-striped table-bordered table-hover" id="myTable">
|
|
<thead>
|
|
<tr>
|
|
<th style="max-width: 800px;">Term</th>
|
|
<th>Added date</th>
|
|
<th>Day occurence</th>
|
|
<th>Week occurence</th>
|
|
<th>Month occurence</th>
|
|
<th>Action</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
{% set i = 0 %}
|
|
{% for term in track_list %}
|
|
<tr>
|
|
<td>{{ term }}</td>
|
|
<td>{{ track_list_values[i][3] }}</td>
|
|
<td>{{ track_list_values[i][0] }}</td>
|
|
<td>{{ track_list_values[i][1] }}</td>
|
|
<td>{{ track_list_values[i][2] }}</td>
|
|
<td><p style="margin: 0px;">
|
|
<button class="btn-link" data-toggle="tooltip" data-placement="right" title="Show concerned paste(s)"><span class="glyphicon glyphicon-info-sign"></span></button>
|
|
<button class="btn-link btn-interaction" data-toggle="tooltip" data-placement="right" title="Remove this term" data-content="{{ term }}" data-section="followTerm" data-action="delete"><span class="glyphicon glyphicon-trash"></span></button>
|
|
</p></td>
|
|
</tr>
|
|
{% set i = i + 1 %}
|
|
{% endfor %}
|
|
</tbody>
|
|
</table>
|
|
<!-- /.panel-body -->
|
|
</div>
|
|
</div>
|
|
<!-- /.panel -->
|
|
</div>
|
|
<!-- /.panel -->
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Panel OPTIONS -->
|
|
<div class="col-lg-12">
|
|
<div class="row">
|
|
<div class="col-lg-12">
|
|
<div id="panel-today" class="panel panel-danger">
|
|
<div class="panel-heading">
|
|
<strong>Manage blacklisted terms</strong>
|
|
</div>
|
|
<div class="panel-body">
|
|
|
|
<div class="form-group input-group" style="margin-bottom: 30px;">
|
|
<span class="input-group-addon"><span class="fa fa-eye-slash "></span></span>
|
|
<input id="blacklistTermInput" class="form-control" placeholder="Term to track" type="text" style="max-width: 400px;">
|
|
<button class="btn btn-danger btn-interaction" style="margin-left: 10px;" data-section="blacklistTerm" data-action="add"> Black list a term</button>
|
|
</div>
|
|
|
|
<table class="table table-striped table-bordered table-hover" id="myTable2">
|
|
<thead>
|
|
<tr>
|
|
<th style="max-width: 800px;">Termx</th>
|
|
<th>Added date</th>
|
|
<th>Action</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
{% set i = 0 %}
|
|
{% for term in black_list %}
|
|
<tr>
|
|
<td>{{ black_list[i][0] }}</td>
|
|
<td>{{ black_list[i][1] }}</td>
|
|
<td><p style="margin: 0px;">
|
|
<button class="btn-link btn-interaction" data-toggle="tooltip" data-placement="right" title="Remove this term" data-content="{{ black_list[i][0] }}" data-section="blacklistTerm" data-action="delete"><span class="glyphicon glyphicon-trash"></span></button>
|
|
</p></td>
|
|
</tr>
|
|
{% set i = i + 1 %}
|
|
{% endfor %}
|
|
</tbody>
|
|
</table>
|
|
<!-- /.panel-body -->
|
|
</div>
|
|
</div>
|
|
<!-- /.panel -->
|
|
</div>
|
|
<!-- /.panel -->
|
|
</div>
|
|
</div>
|
|
|
|
<!-- /.row -->
|
|
</div>
|
|
<!-- /#page-wrapper -->
|
|
</div>
|
|
|
|
|
|
<!-- import graph function -->
|
|
<script>
|
|
$(document).ready(function(){
|
|
activePage = $('h1.page-header').attr('data-page');
|
|
$("#"+activePage).addClass("active");
|
|
|
|
|
|
$('[data-toggle="tooltip"]').tooltip();
|
|
table_track = $('#myTable').DataTable();
|
|
table_black = $('#myTable2').DataTable();
|
|
|
|
perform_binding();
|
|
});
|
|
</script>
|
|
|
|
<script>
|
|
function perform_binding() {
|
|
$(".btn-interaction").unbind("click.interaction");
|
|
$(".btn-interaction").bind("click.interaction", perform_operation);
|
|
}
|
|
|
|
function perform_operation(){
|
|
var curr_section = $(this).attr('data-section');
|
|
var curr_action = $(this).attr('data-action');
|
|
if (curr_action == "add") {
|
|
var curr_term = $('#'+curr_section+'Input').val();
|
|
} else {
|
|
var curr_term = $(this).attr('data-content');
|
|
}
|
|
var data_to_send = { section: curr_section, action:curr_action, term: curr_term};
|
|
|
|
if (curr_term != "") {
|
|
console.log(data_to_send);
|
|
$.get("{{ url_for('terms_management_action') }}", data_to_send, function(data, status){
|
|
if(status == "success") {
|
|
var json = data;
|
|
|
|
if(json.section == "followTerm") {
|
|
if(json.action == "add") {
|
|
// query data
|
|
$.get("{{ url_for('terms_management_query') }}", { term: json.term, section: json.section }, function(data2, status){
|
|
var action_button = "<button class=\"btn-link btn-interaction\" data-toggle=\"tooltip\" data-placement=\"right\" title=\"Remove this term\" data-content=\"" + json.term + "\" data-section=\"followTerm\" data-action=\"delete\"><span class=\"glyphicon glyphicon-trash\"></span></button>"
|
|
table_track.row.add( [ json.term, data2[3], data2[0], data2[1], data2[2], action_button ] ).draw( false );
|
|
perform_binding();
|
|
});
|
|
} else if (json.action == "delete") {
|
|
// Find indexes of row which have the term in the first column
|
|
var index = table_track.rows().eq( 0 ).filter( function (rowIdx) {
|
|
return table_track.cell( rowIdx, 0 ).data() === json.term;
|
|
} );
|
|
table_track.rows(index).remove().draw( false );
|
|
}
|
|
} else if(json.section == "blacklistTerm"){
|
|
if(json.action == "add") {
|
|
$.get("{{ url_for('terms_management_query') }}", { term: json.term, section: json.section }, function(data2, status){
|
|
console.log(data2);
|
|
var action_button = "<button class=\"btn-link btn-interaction\" data-toggle=\"tooltip\" data-placement=\"right\" title=\"Remove this term\" data-content=\"" + json.term + "\" data-section=\"blacklistTerm\" data-action=\"delete\"><span class=\"glyphicon glyphicon-trash\"></span></button>"
|
|
table_black.row.add( [ json.term, data2[3], action_button ] ).draw( false );
|
|
perform_binding();
|
|
});
|
|
} else if (json.action == "delete") {
|
|
// Find indexes of row which have the term in the first column
|
|
var index = table_black.rows().eq( 0 ).filter( function (rowIdx) {
|
|
return table_black.cell( rowIdx, 0 ).data() === json.term;
|
|
} );
|
|
table_black.rows(index).remove().draw( false );
|
|
}
|
|
}
|
|
|
|
|
|
|
|
}
|
|
});
|
|
}
|
|
}
|
|
</script>
|
|
|
|
|
|
|