small improvements

templates/results-overview-new.html

@@ -2,10 +2,12 @@
 <script src="static/javascript.js"></script>
 
 <div class="errors-container">
+  {% if error in errors %}
   <p>
     <i>
       You may have mistyped: </i><b>{{errors|join(',')}}</b><i>. Try again!</i>
     </i>
+    {% endif %}
 </div>
 
 <div class="table-container">

templates/results-overview.html

@@ -1,10 +1,11 @@
 <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
 <script src="static/javascript.js"></script>
 
+<!-- took this from https://stackoverflow.com/questions/71301182/creating-a-html-table-with-expandable-collapsible-sections, need to place the Javascript elsewhere -->
 <div class="table-container">
-  <div class="results-table-new">
+  <div class="results-table">
-    <table id="data" class="table table-striped">
+    <table id="myTable" class="table table-striped">
-      <thead>
+      <tr class="header">
         <th>IP address</th>
         <th>VirusTotal</th>
         <th>AbuseIPDB</th>
@@ -12,12 +13,12 @@
         <th>Registration country</th>
         <th>Registration date</th>
         <th>Email security</th>
-      </thead>
+      </tr>
       <tbody>
         {% for host in hosts %}
         <tr>
           <td>{{host.host}}</td>
-          <td>Score: {{host.vt['score']}} / {{host.vt['total']}}<br>
+          <td>Score: {{host.vt['vendors_malicious']}} / {{host.vt['vendors_total']}}<br>
             Last updated: {{host.vt['last_update']}}</td>
           <td>Score: {{host.abuseipdb['data']['abuseConfidenceScore']}}
             Last reported: {{host.abuseipdb['data']['lastReportedAt']}}</td>
@@ -30,13 +31,11 @@
           <td colspan="7" id="info">
             <p>
               Vendor marked this host as malicious or suspicious:
-              {% for vendor in host.vt['vendors'] %}
+              {% for key, value in host.vt['all_vendors'].items() if value['category'] in ['malicious', 'suspicious'] %}
-              {{vendor}}
+              {{key}}
               {% endfor %}
-              <br>
-              Some relevant data from AbuseIPDB:
-              {{ host.abuseipdb }}
             </p>
+
           </td>
         </tr>
         {% endfor %}
@@ -45,29 +44,44 @@
   </div>
 </div>
 
+{# {% include "test-table.html" %} #}
+<!-- important to know: uncommenting the line above makes the red/green JavaScript not work anymore, BUT makes the collapsible table row table work! Go figure it out XD -->
+
 {% block scripts %}
 
+{#{% for host in hosts %}#}
+{#whoopsie = JSON.parse({{ host.vt_json.text | tojson }}) {% endfor %}#}
+{#{{whoopsie}}#}
+
 <script>
+
+
   $(document).ready(function () {
-    $('#data').DataTable({
+    $('myTable').DataTable({
-      paging: true,
+      paging: false,
-      searching: true,
+      searching: false,
-      info: true,
+      info: false,
       columnDefs: [{
         targets: '_all',
         createdCell: function (td, cellData, rowData, row, col) {
           if (cellData == 'outlook.com' && col == 0) {
             $(td).css({'background-color': 'red', 'color': 'white'});
-            console.log(cellData);
           }
-          if (cellData.startsWith('Score: 0') && col == 1) {
+          if (cellData.startsWith('Score: 0' && col == 1)) {
-            console.log("TEST", cellData);
+            $(td).css({'background-color': 'orange', 'color': 'white'});
+          }
+          if (cellData > 0 && col == 2) {
+            $(td).css({'background-color': 'grey', 'color': 'white'});
+          }
+          if (cellData > 0 && col == 3) {
             $(td).css({'background-color': 'green', 'color': 'white'});
           }
-        }
+        },
-      }]
+      }
-    });
+      ]
+    })
   });
+
 </script>
 
 {% endblock %}