278 lines
12 KiB
JavaScript
278 lines
12 KiB
JavaScript
"use strict";
|
|
|
|
let AmountOfNonCompliantRules;
|
|
let AmountOfCompliantRules;
|
|
let TotalAmountOfRules;
|
|
let QuantityCompliance;
|
|
|
|
let TotalAmountOfSeverityRules;
|
|
let AmountOfFailedSeverityRules;
|
|
let SeverityCompliance;
|
|
|
|
|
|
const cssVars = getComputedStyle(document.documentElement);
|
|
|
|
const COLORS = {
|
|
green: cssVars.getPropertyValue('--color-green').trim(),
|
|
red: cssVars.getPropertyValue('--company-red').trim(),
|
|
orange: cssVars.getPropertyValue('--color-orange').trim(),
|
|
purple: cssVars.getPropertyValue('--color-purple').trim(),
|
|
white: cssVars.getPropertyValue('--color-white').trim(),
|
|
blue: cssVars.getPropertyValue('--color-blue').trim(),
|
|
dark_gray: cssVars.getPropertyValue('--color-dark-gray').trim(),
|
|
light_gray: cssVars.getPropertyValue('--color-light-gray').trim()
|
|
};
|
|
|
|
function startConditions() {
|
|
let isRiskScoreValue = document.getElementById("riskScore");
|
|
let isMITREValue = document.getElementById("MITRE");
|
|
|
|
/* Default-Value: Display summary always at the beginning */
|
|
document.getElementById("summary").style.display = "block";
|
|
|
|
/* Default-Value: Disable all other tabs at the beginning */
|
|
document.getElementById("foundationData").style.display = "none";
|
|
document.getElementById("references").style.display = "none";
|
|
document.getElementById("settingsOverview").style.display = "none";
|
|
|
|
|
|
/* document.getElementById("summaryBtn").style.backgroundColor = COLORS.orange;
|
|
document.getElementById("foundationDataBtn").style.backgroundColor = 'transparent';
|
|
document.getElementById("referenceBtn").style.backgroundColor = 'transparent';
|
|
document.getElementById("settingsOverviewBtn").style.backgroundColor = 'transparent'; */
|
|
|
|
if (isRiskScoreValue != null) {
|
|
document.getElementById("riskScore").style.display = "none";
|
|
/* document.getElementById("riskScoreBtn").style.backgroundColor = 'transparent'; */
|
|
/* Initialize necessary variables */
|
|
|
|
AmountOfNonCompliantRules = document.getElementById("AmountOfNonCompliantRules").textContent;
|
|
AmountOfCompliantRules = document.getElementById("AmountOfCompliantRules").textContent;
|
|
TotalAmountOfRules = document.getElementById("TotalAmountOfRules").textContent;
|
|
QuantityCompliance = document.getElementById("QuantityCompliance").textContent;
|
|
TotalAmountOfSeverityRules = document.getElementById("TotalAmountOfSeverityRules").textContent;
|
|
AmountOfFailedSeverityRules = document.getElementById("AmountOfFailedSeverityRules").textContent;
|
|
|
|
calcDotPosition();
|
|
let severityComplianceCollapseBtn = document.getElementById("severityComplianceCollapse");
|
|
severityComplianceCollapseBtn.addEventListener("click", () => {
|
|
if (document.getElementById("severityDetails").style.display == "none") {
|
|
document.getElementById("severityDetails").style.display = "block";
|
|
}
|
|
else {
|
|
document.getElementById("severityDetails").style.display = "none";
|
|
}
|
|
})
|
|
}
|
|
|
|
if (isMITREValue != null) {
|
|
document.getElementById("MITRE").style.display = "none";
|
|
document.getElementById("MITREBtn").style.backgroundColor = 'transparent';
|
|
document.getElementById("CISA").style.display = "none";
|
|
document.getElementById("CISABtn").style.backgroundColor = 'transparent';
|
|
}
|
|
}
|
|
|
|
|
|
let buttonNumber;
|
|
|
|
function clickButton(value) {
|
|
buttonNumber = parseInt(value);
|
|
|
|
/* Disable all content */
|
|
let tabContents = document.getElementsByClassName('tabContent');
|
|
for (let i = 0; i < tabContents.length; i++) {
|
|
tabContents.item(i).style.display = "none";
|
|
}
|
|
|
|
/* Disable all buttons */
|
|
let buttons = document.getElementsByClassName('navButton');
|
|
for (let i = 0; i < buttons.length; i++) {
|
|
/* buttons.item(i).style.backgroundColor = 'transparent'; */
|
|
buttons.item(i).classList.remove("selectedNavButton");
|
|
}
|
|
|
|
|
|
|
|
/* Re-Enable fitting content / button */
|
|
switch (buttonNumber) {
|
|
case 1:
|
|
document.getElementById("summary").style.display = "block";
|
|
/* document.getElementById("summaryBtn").style.backgroundColor = COLORS.orange; */
|
|
document.getElementById("summaryBtn").classList.add("selectedNavButton");
|
|
break;
|
|
case 2:
|
|
document.getElementById("riskScore").style.display = "block";
|
|
/* document.getElementById("riskScoreBtn").style.backgroundColor = COLORS.orange; */
|
|
document.getElementById("riskScoreBtn").classList.add("selectedNavButton");
|
|
calcDotPosition();
|
|
break;
|
|
case 3:
|
|
document.getElementById("references").style.display = "block";
|
|
/* document.getElementById("referenceBtn").style.backgroundColor = COLORS.orange; */
|
|
document.getElementById("referenceBtn").classList.add("selectedNavButton");
|
|
break;
|
|
case 4:
|
|
document.getElementById("settingsOverview").style.display = "block";
|
|
/* document.getElementById("settingsOverviewBtn").style.backgroundColor = COLORS.orange; */
|
|
document.getElementById("settingsOverviewBtn").classList.add("selectedNavButton");
|
|
break;
|
|
case 5:
|
|
document.getElementById("foundationData").style.display = "block";
|
|
/* document.getElementById("foundationDataBtn").style.backgroundColor = COLORS.orange; */
|
|
document.getElementById("foundationDataBtn").classList.add("selectedNavButton");
|
|
break;
|
|
case 6:
|
|
document.getElementById("MITRE").style.display = "block";
|
|
/* document.getElementById("MITREBtn").style.backgroundColor = COLORS.orange; */
|
|
document.getElementById("MITREBtn").classList.add("selectedNavButton");
|
|
break;
|
|
case 7:
|
|
document.getElementById("CISA").style.display = "block";
|
|
/* document.getElementById("CISABtn").style.backgroundColor = COLORS.orange; */
|
|
document.getElementById("CISABtn").classList.add("selectedNavButton");
|
|
break;
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
/*
|
|
Calculate the position of the dot inside the risk matrix;
|
|
Will be calleed, after the user has clicked on Risk Score Button
|
|
*/
|
|
function calcDotPosition() {
|
|
|
|
|
|
let dotRiskScoreTab = document.getElementById("dotRiskScoreTab");
|
|
let dotSummaryTab = document.getElementById("dotSummaryTab");
|
|
QuantityCompliance = parseFloat(QuantityCompliance);
|
|
|
|
let complianceValueQuantity = 0;
|
|
let complianceValueSeverity = 0;
|
|
|
|
/*low quantity compliance*/
|
|
if (80 < QuantityCompliance) {
|
|
dotRiskScoreTab.style.gridColumnStart = 3;
|
|
dotSummaryTab.style.gridColumnStart = 3;
|
|
complianceValueQuantity = 1;
|
|
}
|
|
/*medium quantity compliance*/
|
|
else if (65 < QuantityCompliance && QuantityCompliance < 80) {
|
|
dotRiskScoreTab.style.gridColumnStart = 4;
|
|
dotSummaryTab.style.gridColumnStart = 4;
|
|
complianceValueQuantity = 2;
|
|
}
|
|
/*high quantity compliance*/
|
|
else if (50 < QuantityCompliance && QuantityCompliance < 65) {
|
|
dotRiskScoreTab.style.gridColumnStart = 5;
|
|
dotSummaryTab.style.gridColumnStart = 5;
|
|
complianceValueQuantity = 3;
|
|
}
|
|
/*critical quantity compliance*/
|
|
else {
|
|
dotRiskScoreTab.style.gridColumnStart = 6;
|
|
dotSummaryTab.style.gridColumnStart = 6;
|
|
complianceValueQuantity = 4;
|
|
}
|
|
|
|
|
|
SeverityCompliance = parseInt(AmountOfFailedSeverityRules);
|
|
/*low severity compliance*/
|
|
if (SeverityCompliance == 0) {
|
|
dotRiskScoreTab.style.gridRowStart = 4;
|
|
dotSummaryTab.style.gridRowStart = 4;
|
|
complianceValueSeverity = 1;
|
|
|
|
|
|
document.getElementById("complianceStatus").style.backgroundColor = COLORS.green;
|
|
}
|
|
/*critical severity compliance*/
|
|
else {
|
|
dotRiskScoreTab.style.gridRowStart = 1;
|
|
dotSummaryTab.style.gridRowStart = 1;
|
|
complianceValueSeverity = 4;
|
|
document.getElementById("complianceStatus").style.backgroundColor = COLORS.red;
|
|
}
|
|
/* Unhide the dot now that it has been positioned */
|
|
document.getElementById("dotSummaryTab").style.display = "inline-block";
|
|
|
|
let totalComplianceValue = Math.max(complianceValueQuantity, complianceValueSeverity);
|
|
|
|
let summary = "Current Risk Score on tested System: ";
|
|
let riskResult = document.createElement("p");
|
|
riskResult.style.display = "contents";
|
|
if (totalComplianceValue == 1) {
|
|
riskResult.innerText = "Low";
|
|
riskResult.style.backgroundColor = "#548dd6";
|
|
}
|
|
else if (totalComplianceValue == 2) {
|
|
riskResult.innerText = "Medium";
|
|
riskResult.style.backgroundColor = "#ffc000";
|
|
}
|
|
else if (totalComplianceValue == 3) {
|
|
riskResult.innerText = "High";
|
|
riskResult.style.color = "white";
|
|
riskResult.style.backgroundColor = "#cc0000";
|
|
}
|
|
else {
|
|
riskResult.innerText = "Critical";
|
|
riskResult.style.color = "white";
|
|
riskResult.style.backgroundColor = "purple";
|
|
}
|
|
riskResult.style.display = "inline";
|
|
riskResult.style.padding = "5px 10px";
|
|
riskResult.style.borderRadius = "8px";
|
|
riskResult.style.fontWeight = "bold";
|
|
riskResult.style.margin = "auto";
|
|
|
|
let copyRiskResult = riskResult.cloneNode();
|
|
copyRiskResult.innerText = riskResult.innerText;
|
|
|
|
document.getElementById("CurrentRiskScore").textContent = summary;
|
|
document.getElementById("CurrentRiskScore").appendChild(riskResult);
|
|
document.getElementById("CurrentRiskScoreRS").textContent = summary;
|
|
document.getElementById("CurrentRiskScoreRS").appendChild(copyRiskResult);
|
|
|
|
}
|
|
|
|
/*
|
|
techniques are hidden or shown based on the status of the provided checkboxes and classes
|
|
classes must be in a compatible format for document.querySelectorAll()
|
|
examples with first all nodes in the 'orgMeasure' class and second all nodes that are in the 'MITRETechnique' but not in the 'mailVector' class:
|
|
hideMitreTechniques(this, '.orgMeasure')
|
|
hideMitreTechniques(this, '.MITRETechnique:not(.mailVector)')
|
|
*/
|
|
let activeFilter = new Array();
|
|
function hideMitreTechniques(checkbox, classes) {
|
|
let classElements = document.querySelectorAll(classes);
|
|
if (checkbox.checked) {
|
|
/* push the current classes into the activeFilter array to determine which filters are currently active. */
|
|
activeFilter.push(classes);
|
|
for (let i = 0; i < classElements.length; i++) {
|
|
classElements[i].style.padding = '0.1em';
|
|
|
|
const children = classElements[i].querySelectorAll('*');
|
|
for (let j = 0; j < children.length; j++) {
|
|
children[j].style.display = 'none';
|
|
}
|
|
}
|
|
}
|
|
else {
|
|
activeFilter.splice(activeFilter.indexOf(classes), 1);
|
|
/* create an array from the classElements since it makes filtering easier. */
|
|
let elementsToHide = Array.from(classElements);
|
|
/* create an array that includes all elements from the remaining active filters */
|
|
let elementsNotToHide = (activeFilter.length === 0) ? new Array() : Array.from(document.querySelectorAll(activeFilter));
|
|
/* filter the elementsToHide array to retrieve and display only the elements that are not hidden by other filters */
|
|
elementsToHide = elementsToHide.filter(element => !elementsNotToHide.includes(element));
|
|
for (let i = 0; i < elementsToHide.length; i++) {
|
|
elementsToHide[i].style.removeProperty('padding');
|
|
const children = elementsToHide[i].querySelectorAll('*');
|
|
for (let j = 0; j < children.length; j++) {
|
|
children[j].style.removeProperty('display');
|
|
}
|
|
}
|
|
}
|
|
} |