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