mirror of
https://github.com/mthcht/ThreatHunting-Keywords
synced 2026-06-08 16:12:28 +00:00
282 lines
12 KiB
HTML
282 lines
12 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>Hunting Keywords</title>
|
|
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/handsontable@latest/dist/handsontable.full.min.css">
|
|
<script src="https://cdn.jsdelivr.net/npm/handsontable@latest/dist/handsontable.full.min.js"></script>
|
|
<script src="https://cdn.jsdelivr.net/npm/papaparse@latest"></script>
|
|
<style>
|
|
/* GitHub logo style */
|
|
.github-logo {
|
|
position: absolute;
|
|
top: 10px;
|
|
right: 10px;
|
|
width: 32px;
|
|
height: 32px;
|
|
background-color: white; /* Add background color */
|
|
border-radius: 50%; /* Make it circular */
|
|
padding: 4px; /* Add padding to create a border effect */
|
|
}
|
|
.handsontable .htCore .ht_master .wtHolder {
|
|
overflow-y: hidden !important;
|
|
}
|
|
.handsontable td {
|
|
white-space: nowrap;
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
height: 23px !important;
|
|
line-height: 23px !important;
|
|
border-color: #2f4f4f !important; /* Darker color for cell borders */
|
|
}
|
|
.handsontable th {
|
|
border-color: #2f4f4f !important; /* Darker color for header cell borders */
|
|
}
|
|
/* Dark theme overrides for Handsontable */
|
|
html, body {
|
|
height: 100%; /* Full height */
|
|
margin: 0;
|
|
padding: 0;
|
|
background-color: #0d1b2a; /* Dark background for the page */
|
|
}
|
|
/* Ensure the container also has a dark background and full height */
|
|
#example {
|
|
background-color: #0d1b2a; /* Dark background for the container */
|
|
height: 100%; /* Full height */
|
|
}
|
|
|
|
.handsontable, .wtHolder {
|
|
color: #53A757; /* Green text */
|
|
background-color: #201F1F !important; /* Dark background for the table */
|
|
}
|
|
|
|
/* Specific overrides for table cells */
|
|
.handsontable .htCore td, .handsontable .htCore th {
|
|
background-color: #04151f !important; /* Dark background for cells */
|
|
color: #a7c957 !important; /* Green text */
|
|
}
|
|
|
|
/* Header cells */
|
|
.handsontable .htCore th {
|
|
background-color: #1b263b !important; /* Slightly lighter background for header cells */
|
|
color: #a7c957;
|
|
}
|
|
|
|
/* Override for current row & column highlight */
|
|
.ht__highlight {
|
|
background-color: #0d1b2a !important; /* Darker background for highlight */
|
|
}
|
|
|
|
/* Adjusting selection colors to fit the dark theme */
|
|
.ht_master .htBorders .current {
|
|
border-color: #4f772d !important; /* Green border for current selection */
|
|
}
|
|
|
|
.ht_master .htBorders .area {
|
|
border-color: #90a955 !important; /* Green border for selected area */
|
|
}
|
|
|
|
/* Customizing scrollbar for dark theme */
|
|
::-webkit-scrollbar {
|
|
width: 8px;
|
|
height: 8px;
|
|
}
|
|
|
|
::-webkit-scrollbar-track {
|
|
background: #003049;
|
|
}
|
|
|
|
::-webkit-scrollbar-thumb {
|
|
background: #555;
|
|
}
|
|
|
|
::-webkit-scrollbar-thumb:hover {
|
|
background: #444;
|
|
}
|
|
.ascii-art-container {
|
|
white-space: nowrap; /* Prevents the content from wrapping */
|
|
text-align: center; /* Center the content horizontally */
|
|
width: 100%; /* Ensure the container spans the full width */
|
|
max-width: 100%; /* Ensures the container does not exceed the viewport width */
|
|
overflow: auto; /* In case the ASCII art is wider than the screen */
|
|
overflow-x: auto; /* Enables horizontal scrolling */
|
|
|
|
}
|
|
pre {
|
|
display: inline-block; /* Allows the <pre> block to be centered by text-align */
|
|
white-space: pre-wrap; /* Ensures that the ASCII art does not overflow the container */
|
|
word-wrap: break-word; /* Breaks the text to prevent overflow */
|
|
}
|
|
.ascii-art-container pre {
|
|
white-space: pre; /* Maintains spacing and formatting of the ASCII art */
|
|
overflow-x: auto; /* Allows horizontal scrolling if needed */
|
|
color: #32CD32; /* Light green color */
|
|
display: inline-block; /* Treats the pre element as a block while keeping it inline */
|
|
}
|
|
@keyframes spin {
|
|
0% { transform: rotate(0deg); }
|
|
100% { transform: rotate(360deg); }
|
|
}
|
|
|
|
/* Responsive design adjustments */
|
|
@media (max-width: 768px) {
|
|
.github-logo {
|
|
width: 24px;
|
|
height: 24px;
|
|
}
|
|
.handsontable td {
|
|
font-size: 12px;
|
|
height: 20px !important;
|
|
line-height: 20px !important;
|
|
}
|
|
.handsontable th {
|
|
font-size: 12px;
|
|
}
|
|
#example {
|
|
overflow-x: auto;
|
|
}
|
|
}
|
|
</style>
|
|
</head>
|
|
|
|
<body>
|
|
<a href="https://github.com/mthcht/ThreatHunting-Keywords" target="_blank">
|
|
<img src="https://upload.wikimedia.org/wikipedia/commons/9/91/Octicons-mark-github.svg" alt="GitHub" class="github-logo">
|
|
</a>
|
|
<div class="ascii-art-container">
|
|
<pre>
|
|
▐▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▌
|
|
▐░▀█▀░█░█░█▀▄░█▀▀░█▀█░▀█▀░░░█░█░█░█░█▀█░▀█▀░▀█▀░█▀█░█▀▀░░░█░█░█▀▀░█░█░█░█░█▀█░█▀▄░█▀▄░█▀▀ ▌
|
|
▐░░█░░█▀█░█▀▄░█▀▀░█▀█░░█░░░░█▀█░█░█░█░█░░█░░░█░░█░█░█░█░░░█▀▄░█▀▀░░█░░█▄█░█░█░█▀▄░█░█░▀▀█ ▌
|
|
▐░░▀░░▀░▀░▀░▀░▀▀▀░▀░▀░░▀░░░░▀░▀░▀▀▀░▀░▀░░▀░░▀▀▀░▀░▀░▀▀▀░░░▀░▀░▀▀▀░░▀░░▀░▀░▀▀▀░▀░▀░▀▀░░▀▀▀ ▌
|
|
▐▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▌
|
|
</pre>
|
|
</div>
|
|
<div id="loadingIndicator" style="display:none; text-align:center; color: #0D5C2D;">
|
|
<div class="spinner" style="display:inline-block; margin-left:10px; border: 4px solid rgba(50,205,50,.3); border-radius: 50%; border-top-color: #fff; width: 24px; height: 24px; animation: spin 1s ease-in-out infinite;"></div>
|
|
</div>
|
|
|
|
<div id="example"></div>
|
|
|
|
<script>
|
|
document.addEventListener('DOMContentLoaded', function() {
|
|
loadCSV('threathunting-keywords.csv');
|
|
});
|
|
|
|
function loadCSV(filePath) {
|
|
// Show loading indicator
|
|
document.getElementById('loadingIndicator').style.display = 'block';
|
|
|
|
fetch(filePath)
|
|
.then(response => response.text())
|
|
.then(csvText => {
|
|
Papa.parse(csvText, {
|
|
header: true,
|
|
dynamicTyping: true,
|
|
skipEmptyLines: true,
|
|
complete: function(results) {
|
|
var data = results.data;
|
|
if (data.length === 0 || (data.length === 1 && !data[0])) {
|
|
return;
|
|
}
|
|
|
|
// Original column headers from the data
|
|
var originalColHeaders = Object.keys(data[0]);
|
|
|
|
// Adjusted column headers for display
|
|
var colHeaders = originalColHeaders.map(header =>
|
|
header.startsWith('metadata_') ? header.substring(9) : header
|
|
);
|
|
|
|
// Map original data fields to adjusted column headers for Handsontable
|
|
var columns = originalColHeaders.map(header => ({
|
|
data: header,
|
|
type: 'text',
|
|
title: header.startsWith('metadata_') ? header.substring(9) : header
|
|
}));
|
|
|
|
createHandsontable(data, colHeaders, columns);
|
|
// Hide loading indicator once loading is complete
|
|
document.getElementById('loadingIndicator').style.display = 'none';
|
|
}
|
|
});
|
|
})
|
|
.catch(error => {
|
|
console.error('Error loading the CSV file:', error);
|
|
// Hide loading indicator in case of error
|
|
document.getElementById('loadingIndicator').style.display = 'none';
|
|
});
|
|
}
|
|
|
|
function createHandsontable(data, colHeaders, columns) {
|
|
var container = document.getElementById('example');
|
|
if (window.hot) {
|
|
window.hot.destroy(); // Destroy existing Handsontable instance if exists
|
|
}
|
|
window.hot = new Handsontable(container, {
|
|
data: data,
|
|
colHeaders: colHeaders,
|
|
rowHeaders: true,
|
|
columns: columns.map(column => {
|
|
// Check if the column is the one that needs custom width
|
|
if (column.data === 'keyword') {
|
|
return { ...column, width: 200 }; // Custom width for this specific column
|
|
}
|
|
if (column.data === 'metadata_keyword_regex') {
|
|
return { ...column, width: 110 }; // Custom width for this specific column
|
|
}
|
|
if (column.data === 'metadata_keyword_type') {
|
|
return { ...column, width: 150 }; // Custom width for this specific column
|
|
}
|
|
if (column.data === 'metadata_description') {
|
|
return { ...column, width: 200 }; // Custom width for this specific column
|
|
}
|
|
if (column.data === 'metadata_malwares_name') {
|
|
return { ...column, width: 50 }; // Custom width for this specific column
|
|
}
|
|
if (column.data === 'metadata_tool_techniques') {
|
|
return { ...column, width: 120 }; // Custom width for this specific column
|
|
}
|
|
if (column.data === 'metadata_tool_tactics') {
|
|
return { ...column, width: 120 }; // Custom width for this specific column
|
|
}
|
|
if (column.data === 'metadata_groups_name') {
|
|
return { ...column, width: 50 }; // Custom width for this specific column
|
|
}
|
|
if (column.data === 'metadata_category') {
|
|
return { ...column, width: 150 }; // Custom width for this specific column
|
|
}
|
|
if (column.data === 'metadata_link') {
|
|
return { ...column, width: 150 }; // Custom width for this specific column
|
|
}
|
|
if (column.data === 'metadata_tool') {
|
|
return { ...column, width: 170 }; // Custom width for this specific column
|
|
}
|
|
if (column.data === 'metadata_comment') {
|
|
return { ...column, width: 100 }; // Custom width for this specific column
|
|
}
|
|
if (column.data === 'metadata_severity_score') {
|
|
return { ...column, width: 130 }; // Custom width for this specific column
|
|
}
|
|
if (column.data === 'metadata_popularity_score') {
|
|
return { ...column, width: 130 }; // Custom width for this specific column
|
|
}
|
|
return column; // Return other columns as is
|
|
}),
|
|
licenseKey: 'non-commercial-and-evaluation', // Specify the license key here
|
|
colWidths: 100, // Set fixed width for all columns
|
|
rowHeights: 23, // Set initial height for all rows
|
|
manualColumnResize: true, // Allow manual resizing of columns
|
|
manualRowResize: true, // Allow manual resizing of rows
|
|
filters: true,
|
|
dropdownMenu: true,
|
|
// enable sorting for all columns
|
|
columnSorting: true
|
|
});
|
|
}
|
|
</script>
|
|
|
|
</body>
|
|
</html>
|