Add Taskgate_New.HTML
This commit is contained in:
428
Taskgate_New.HTML
Normal file
428
Taskgate_New.HTML
Normal file
@@ -0,0 +1,428 @@
|
|||||||
|
// this is written with Reusable fuunctions for the buttons with in theory would be easier to manage in the long run!
|
||||||
|
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="en">
|
||||||
|
<head>
|
||||||
|
<meta charset="UTF-8">
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||||
|
<title>SVS TaskGate</title>
|
||||||
|
<link rel="icon" href="https://git.svstools.com/syelle/Logo/raw/branch/main/SVS_Favicon.ico" type="image/x-icon">
|
||||||
|
<style>
|
||||||
|
/* Base styles for layout and design */
|
||||||
|
body {
|
||||||
|
font-family: Arial, sans-serif;
|
||||||
|
margin: 0;
|
||||||
|
padding: 0;
|
||||||
|
background-color: #1e1e1e;
|
||||||
|
color: #ffffff;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Logo container styling */
|
||||||
|
.logo-container {
|
||||||
|
text-align: left;
|
||||||
|
padding: 20px;
|
||||||
|
background-color: #1e1e1e;
|
||||||
|
/* Matches the background color */
|
||||||
|
}
|
||||||
|
|
||||||
|
.logo-container img {
|
||||||
|
max-width: 300px;
|
||||||
|
/* Ensure the logo is properly sized */
|
||||||
|
height: auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Main container for sidebar and content */
|
||||||
|
.container {
|
||||||
|
display: flex;
|
||||||
|
height: 100vh;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Sidebar styles */
|
||||||
|
.sidebar {
|
||||||
|
width: 200px;
|
||||||
|
background-color: #1e1e1e;
|
||||||
|
padding: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Tab button styling in the sidebar */
|
||||||
|
.sidebar button {
|
||||||
|
display: block;
|
||||||
|
width: 100%;
|
||||||
|
margin-bottom: 10px;
|
||||||
|
padding: 10px;
|
||||||
|
color: white;
|
||||||
|
background-color: #444;
|
||||||
|
border: none;
|
||||||
|
border-radius: 5px;
|
||||||
|
cursor: pointer;
|
||||||
|
text-align: left;
|
||||||
|
transition: background-color 0.3s ease, transform 0.2s ease;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Active and hover states for sidebar buttons */
|
||||||
|
.sidebar button.active {
|
||||||
|
background-color: #007bff;
|
||||||
|
}
|
||||||
|
|
||||||
|
.sidebar button:hover {
|
||||||
|
background-color: #0056b3;
|
||||||
|
transform: scale(1.05);
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Content area styles */
|
||||||
|
.content {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
justify-content: center; /* Centers vertically */
|
||||||
|
align-items: center; /* Centers horizontally */
|
||||||
|
padding: 20px;
|
||||||
|
overflow-y: auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
/* Tab content default state */
|
||||||
|
.tab-content {
|
||||||
|
display: none;
|
||||||
|
/* Initially hidden */
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Tab content active state */
|
||||||
|
.tab-content.active {
|
||||||
|
display: block;
|
||||||
|
/* Show active tab content */
|
||||||
|
}
|
||||||
|
|
||||||
|
.checkbox-group label {
|
||||||
|
display: block;
|
||||||
|
margin-bottom: 5px; /* Optional: Adds spacing between checkboxes */
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
</head>
|
||||||
|
|
||||||
|
<body>
|
||||||
|
<!-- Logo Section -->
|
||||||
|
<div class="logo-container">
|
||||||
|
<img src="https://git.svstools.com/syelle/Logo/raw/branch/main/SVS_Logo.png" alt="SVS Logo">
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- Main Container -->
|
||||||
|
<div class="container">
|
||||||
|
<!-- Sidebar with Tab Buttons -->
|
||||||
|
<div class="sidebar">
|
||||||
|
<button class="tab-button active" data-tab="onboardTab">On-Boarding</button>
|
||||||
|
<button class="tab-button" data-tab="offboardTab">Off-Boarding</button>
|
||||||
|
<button class="tab-button" data-tab="tweaksTab">Tweaks</button>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- Tab Content Area -->
|
||||||
|
<div class="content">
|
||||||
|
<!-- Placeholder for tab content -->
|
||||||
|
<div id="onboardTab" class="tab-content active">
|
||||||
|
<h2>On-Boarding</h2>
|
||||||
|
<!-- Checkbox Group -->
|
||||||
|
<div class="checkbox-group">
|
||||||
|
<label>
|
||||||
|
<input type="checkbox" id="selectAllOnboardCheckbox"
|
||||||
|
onclick="toggleCheckboxes('onboardTab', 'selectAllOnboardCheckbox')">
|
||||||
|
Select All
|
||||||
|
</label>
|
||||||
|
<label>
|
||||||
|
<input type="checkbox" id="SetSVSPowerplanCheckbox">
|
||||||
|
Set SVS Powerplan
|
||||||
|
</label>
|
||||||
|
<label>
|
||||||
|
<input type="checkbox" id="installSVSMSPModuleCheckbox">
|
||||||
|
Install SVSMSP Module
|
||||||
|
</label>
|
||||||
|
<label>
|
||||||
|
<input type="checkbox" id="installCyberQPCheckbox">
|
||||||
|
Install CyberQP
|
||||||
|
</label>
|
||||||
|
<label>
|
||||||
|
<input type="checkbox" id="installSplashtopCheckbox">
|
||||||
|
Install Splashtop
|
||||||
|
</label>
|
||||||
|
<label>
|
||||||
|
<input type="checkbox" id="installSVSHelpDeskCheckbox">
|
||||||
|
Install SVS HelpDesk
|
||||||
|
</label>
|
||||||
|
<label>
|
||||||
|
<input type="checkbox" id="installSVSWatchtowerCheckbox">
|
||||||
|
Install SVS Watchtower
|
||||||
|
</label>
|
||||||
|
<label>
|
||||||
|
<input type="checkbox" id="installThreatLockerCheckbox">
|
||||||
|
Install ThreatLocker
|
||||||
|
</label>
|
||||||
|
<label>
|
||||||
|
<input type="checkbox" id="installRocketCyberCheckbox">
|
||||||
|
Install RocketCyber
|
||||||
|
</label>
|
||||||
|
<label>
|
||||||
|
<input type="checkbox" id="installDattoRMMCheckbox" onclick="toggleDattoRMMOptions()">
|
||||||
|
Install Datto RMM
|
||||||
|
</label>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- Datto RMM Options -->
|
||||||
|
<div id="dattoRMMOptionsContainer" style="display: none; padding-left: 20px;">
|
||||||
|
<label>
|
||||||
|
<input type="checkbox" name="dattoRMMOption" value="inputVar">
|
||||||
|
Copy Site Variables
|
||||||
|
</label>
|
||||||
|
<label>
|
||||||
|
<input type="checkbox" name="dattoRMMOption" value="rmm">
|
||||||
|
Install DRMM Agent
|
||||||
|
</label>
|
||||||
|
<label>
|
||||||
|
<input type="checkbox" name="dattoRMMOption" value="exe">
|
||||||
|
Download .exe
|
||||||
|
</label>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- N8N Password Input -->
|
||||||
|
<div id="n8nPasswordContainer" style="display: none;">
|
||||||
|
<label for="n8nPassword">Enter n8n Password:</label><br>
|
||||||
|
<input type="password" id="n8nPassword" class="password-input" placeholder="Enter n8n Password">
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- Datto RMM Dropdown -->
|
||||||
|
<div id="DattoRMMContainer" style="display: none;">
|
||||||
|
<label for="dattoRmmDropdown">Select a Datto RMM site:</label><br>
|
||||||
|
<select id="dattoRmmDropdown" class="dropdown">
|
||||||
|
<option value="">Fetching sites...</option>
|
||||||
|
<!-- Dynamically populated site options -->
|
||||||
|
</select>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- Buttons -->
|
||||||
|
<div class="button-group">
|
||||||
|
<button class="install-button" id="fetchSitesButton" onclick="fetchSites()" disabled>Fetch
|
||||||
|
Sites</button>
|
||||||
|
<button class="install-button" onclick="triggerInstall()">Install</button>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- Logs -->
|
||||||
|
<div class="log" id="logArea">
|
||||||
|
<p>Logs will appear here...</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div id="offboardTab" class="tab-content">
|
||||||
|
<h2>Off-Boarding</h2>
|
||||||
|
<!-- Checkbox Group -->
|
||||||
|
<div class="checkbox-group">
|
||||||
|
<label>
|
||||||
|
<input type="checkbox" id="selectAllOffboardCheckbox"
|
||||||
|
onclick="toggleCheckboxes('offboardTab', 'selectAllOffboardCheckbox')">
|
||||||
|
Select All
|
||||||
|
</label>
|
||||||
|
<label>
|
||||||
|
<input type="checkbox" id="uninstallSVSMSPModuleCheckbox">
|
||||||
|
Uninstall SVSMSP Module
|
||||||
|
</label>
|
||||||
|
<label>
|
||||||
|
<input type="checkbox" id="uninstallThreatLockerCheckbox">
|
||||||
|
Uninstall ThreatLocker
|
||||||
|
</label>
|
||||||
|
<label>
|
||||||
|
<input type="checkbox" id="removeSplashtopCheckbox">
|
||||||
|
Remove Splashtop
|
||||||
|
</label>
|
||||||
|
<label>
|
||||||
|
<input type="checkbox" id="removeRocketCyberCheckbox">
|
||||||
|
Remove RocketCyber
|
||||||
|
</label>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- Buttons -->
|
||||||
|
<div class="button-group">
|
||||||
|
<button class="install-button" onclick="triggerOffboarding()">Execute Off-Boarding</button>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- Logs -->
|
||||||
|
<div class="log" id="offboardLogArea">
|
||||||
|
<p>Off-Boarding logs will appear here...</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div id="tweaksTab" class="tab-content">
|
||||||
|
<h2>Tweaks</h2>
|
||||||
|
<!-- Checkbox Group -->
|
||||||
|
<div class="checkbox-group">
|
||||||
|
<label>
|
||||||
|
<input type="checkbox" id="selectAllTweaksCheckbox"
|
||||||
|
onclick="toggleCheckboxes('tweaksTab', 'selectAllTweaksCheckbox')">
|
||||||
|
Select All
|
||||||
|
</label>
|
||||||
|
<label>
|
||||||
|
<input type="checkbox" id="setEdgeSearchEngineCheckbox">
|
||||||
|
Set Edge Default Search Engine
|
||||||
|
</label>
|
||||||
|
<label>
|
||||||
|
<input type="checkbox" id="disableAnimationsCheckbox">
|
||||||
|
Disable Animations
|
||||||
|
</label>
|
||||||
|
<label>
|
||||||
|
<input type="checkbox" id="optimizePerformanceCheckbox">
|
||||||
|
Optimize Performance
|
||||||
|
</label>
|
||||||
|
<label>
|
||||||
|
<input type="checkbox" id="increaseFontSizeCheckbox">
|
||||||
|
Increase Font Size
|
||||||
|
</label>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- Buttons -->
|
||||||
|
<div class="button-group">
|
||||||
|
<button class="install-button" onclick="applyTweaks()">Apply Tweaks</button>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- Logs -->
|
||||||
|
<div class="log" id="tweaksLogArea">
|
||||||
|
<p>Tweaks logs will appear here...</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
// Tab Navigation
|
||||||
|
const tabButtons = document.querySelectorAll('.tab-button');
|
||||||
|
const tabContents = document.querySelectorAll('.tab-content');
|
||||||
|
|
||||||
|
tabButtons.forEach(button => {
|
||||||
|
button.addEventListener('click', () => {
|
||||||
|
tabButtons.forEach(btn => btn.classList.remove('active'));
|
||||||
|
tabContents.forEach(tab => tab.classList.remove('active'));
|
||||||
|
|
||||||
|
button.classList.add('active');
|
||||||
|
document.getElementById(button.dataset.tab).classList.add('active');
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
// Reusable Toggle Checkboxes
|
||||||
|
function toggleCheckboxes(tabId, selectAllCheckboxId) {
|
||||||
|
const selectAllCheckbox = document.getElementById(selectAllCheckboxId);
|
||||||
|
const checkboxes = document
|
||||||
|
.getElementById(tabId)
|
||||||
|
.querySelectorAll('input[type="checkbox"]:not(#' + selectAllCheckboxId + ')');
|
||||||
|
|
||||||
|
checkboxes.forEach(checkbox => {
|
||||||
|
checkbox.checked = selectAllCheckbox.checked;
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
// Reusable Append Log
|
||||||
|
function appendLog(message, color = "white", logAreaId = "logArea") {
|
||||||
|
const logArea = document.getElementById(logAreaId);
|
||||||
|
const log = document.createElement('p');
|
||||||
|
log.style.color = color;
|
||||||
|
log.textContent = message;
|
||||||
|
logArea.appendChild(log);
|
||||||
|
}
|
||||||
|
|
||||||
|
// General Task Executor
|
||||||
|
function executeTasks(taskList, logAreaId) {
|
||||||
|
let tasksCompleted = false;
|
||||||
|
|
||||||
|
taskList.forEach(task => {
|
||||||
|
if (task.checkbox.checked) {
|
||||||
|
appendLog(`Executing: ${task.name}`, "cyan", logAreaId);
|
||||||
|
fetch(task.endpoint, { method: 'GET' })
|
||||||
|
.then(response => {
|
||||||
|
if (!response.ok) throw new Error(`${task.name} failed`);
|
||||||
|
appendLog(`${task.name} completed successfully!`, "green", logAreaId);
|
||||||
|
})
|
||||||
|
.catch(error => appendLog(`Error: ${error.message}`, "red", logAreaId));
|
||||||
|
tasksCompleted = true;
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
if (!tasksCompleted) {
|
||||||
|
appendLog("No tasks selected.", "yellow", logAreaId);
|
||||||
|
} else {
|
||||||
|
appendLog("All tasks completed successfully!", "green", logAreaId);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// On-Boarding
|
||||||
|
async function fetchSites() {
|
||||||
|
const n8nPasswordInput = document.getElementById('n8nPassword');
|
||||||
|
const fetchSitesButton = document.getElementById('fetchSitesButton');
|
||||||
|
const dropdown = document.getElementById('dattoRmmDropdown');
|
||||||
|
|
||||||
|
if (!n8nPasswordInput.value) {
|
||||||
|
appendLog("Please enter the n8n password.", "red");
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
try {
|
||||||
|
appendLog("Fetching sites...", "yellow");
|
||||||
|
|
||||||
|
const response = await fetch('/getn8npw', {
|
||||||
|
method: 'POST',
|
||||||
|
headers: { 'Content-Type': 'application/json' },
|
||||||
|
body: JSON.stringify({ password: n8nPasswordInput.value })
|
||||||
|
});
|
||||||
|
|
||||||
|
if (!response.ok) throw new Error('Failed to fetch sites.');
|
||||||
|
|
||||||
|
const sites = await response.json();
|
||||||
|
dropdown.innerHTML = '';
|
||||||
|
|
||||||
|
sites.forEach(site => {
|
||||||
|
const option = document.createElement('option');
|
||||||
|
option.value = site.UID;
|
||||||
|
option.textContent = site.Name;
|
||||||
|
dropdown.appendChild(option);
|
||||||
|
});
|
||||||
|
|
||||||
|
appendLog("Sites fetched successfully!", "green");
|
||||||
|
} catch (error) {
|
||||||
|
appendLog("Error: " + error.message, "red");
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
function triggerInstall() {
|
||||||
|
const tasks = [
|
||||||
|
{ checkbox: document.getElementById('SetSVSPowerplanCheckbox'), name: "Set SVS Powerplan", endpoint: "/SetSVSPowerplan" },
|
||||||
|
{ checkbox: document.getElementById('installSVSMSPModuleCheckbox'), name: "Install SVSMSP Module", endpoint: "/installSVSMSPModule" },
|
||||||
|
{ checkbox: document.getElementById('installCyberQPCheckbox'), name: "Install CyberQP", endpoint: "/installCyberQP" },
|
||||||
|
{ checkbox: document.getElementById('installSplashtopCheckbox'), name: "Install Splashtop", endpoint: "/installSplashtop" },
|
||||||
|
{ checkbox: document.getElementById('installSVSHelpDeskCheckbox'), name: "Install SVS HelpDesk", endpoint: "/installSVSHelpDesk" },
|
||||||
|
{ checkbox: document.getElementById('installSVSWatchtowerCheckbox'), name: "Install SVS Watchtower", endpoint: "/installSVSWatchtower" },
|
||||||
|
{ checkbox: document.getElementById('installThreatLockerCheckbox'), name: "Install ThreatLocker", endpoint: "/installThreatLocker" },
|
||||||
|
{ checkbox: document.getElementById('installRocketCyberCheckbox'), name: "Install RocketCyber", endpoint: "/installRocketCyber" }
|
||||||
|
];
|
||||||
|
|
||||||
|
executeTasks(tasks, "logArea");
|
||||||
|
}
|
||||||
|
|
||||||
|
// Off-Boarding
|
||||||
|
function triggerOffboarding() {
|
||||||
|
const tasks = [
|
||||||
|
{ checkbox: document.getElementById('uninstallSVSMSPModuleCheckbox'), name: "Uninstall SVSMSP Module", endpoint: "/uninstallSVSMSPModule" },
|
||||||
|
{ checkbox: document.getElementById('uninstallThreatLockerCheckbox'), name: "Uninstall ThreatLocker", endpoint: "/uninstallThreatLocker" },
|
||||||
|
{ checkbox: document.getElementById('removeSplashtopCheckbox'), name: "Remove Splashtop", endpoint: "/removeSplashtop" },
|
||||||
|
{ checkbox: document.getElementById('removeRocketCyberCheckbox'), name: "Remove RocketCyber", endpoint: "/removeRocketCyber" }
|
||||||
|
];
|
||||||
|
|
||||||
|
executeTasks(tasks, "offboardLogArea");
|
||||||
|
}
|
||||||
|
|
||||||
|
// Tweaks
|
||||||
|
function applyTweaks() {
|
||||||
|
const tweaks = [
|
||||||
|
{ checkbox: document.getElementById('setEdgeSearchEngineCheckbox'), name: "Set Edge Default Search Engine", endpoint: "/setEdgeSearchEngine" },
|
||||||
|
{ checkbox: document.getElementById('disableAnimationsCheckbox'), name: "Disable Animations", endpoint: "/disableAnimations" },
|
||||||
|
{ checkbox: document.getElementById('optimizePerformanceCheckbox'), name: "Optimize Performance", endpoint: "/optimizePerformance" },
|
||||||
|
{ checkbox: document.getElementById('increaseFontSizeCheckbox'), name: "Increase Font Size", endpoint: "/increaseFontSize" }
|
||||||
|
];
|
||||||
|
|
||||||
|
executeTasks(tweaks, "tweaksLogArea");
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
</body>
|
||||||
|
|
||||||
|
</html>
|
||||||
Reference in New Issue
Block a user