moved the task completed status
This commit is contained in:
115
StackMonkey.ps1
115
StackMonkey.ps1
@@ -635,6 +635,7 @@ function Get-UIHtml {
|
||||
|
||||
# no spaces before $style
|
||||
$style = @'
|
||||
|
||||
<style>
|
||||
:root {
|
||||
/* Cool Palette */
|
||||
@@ -654,8 +655,12 @@ $style = @'
|
||||
--btn-success: rgba(40,167,69);
|
||||
--btn-success-disabled: rgba(108,117,125);
|
||||
--btn-danger: rgba(220,53,69);
|
||||
/* Monkey logo*/
|
||||
--monkey-bottom: 135px;
|
||||
|
||||
/* Monkey + status panel settings */
|
||||
--monkey-size: 160px; /* size of SAMY */
|
||||
--monkey-bottom: 135px; /* how high from bottom of sidebar */
|
||||
--status-gap: 20px; /* space between status box and monkey */
|
||||
--status-height: 140px; /* max height of status box */
|
||||
}
|
||||
|
||||
body {
|
||||
@@ -674,13 +679,50 @@ $style = @'
|
||||
.subtitle { font-size: 1.2rem; color: var(--gray-color); margin-top: 0.5em; }
|
||||
|
||||
.container { display:flex; height:100vh; overflow:hidden; }
|
||||
.sidebar {
|
||||
|
||||
/* single, consolidated sidebar rule */
|
||||
.sidebar{
|
||||
width:200px;
|
||||
background:var(--background-color);
|
||||
padding:10px;
|
||||
position: relative; /* added */
|
||||
padding-bottom: 190px; /* added: so buttons don't overlap the monkey */
|
||||
position:relative;
|
||||
/* leave enough room for status box + monkey */
|
||||
padding-bottom: calc(var(--monkey-bottom) + var(--monkey-size) + var(--status-gap) + 10px);
|
||||
}
|
||||
|
||||
/* status panel sits ABOVE the monkey (make sure #status-box is inside .sidebar in HTML) */
|
||||
#status-box{
|
||||
position:absolute;
|
||||
left:10px;
|
||||
bottom: calc(var(--monkey-bottom) + var(--monkey-size) + var(--status-gap));
|
||||
width: calc(100% - 20px);
|
||||
max-height: var(--status-height);
|
||||
overflow-y:auto;
|
||||
padding: 8px 10px;
|
||||
border:1px solid var(--border-color);
|
||||
border-radius:8px;
|
||||
background: rgba(255,255,255,0.06);
|
||||
font-family: 'Segoe UI','Segoe UI Emoji','Segoe UI Symbol',system-ui,sans-serif;
|
||||
font-size:12px;
|
||||
line-height:1.35;
|
||||
z-index: 1; /* keep above pseudo-element just in case */
|
||||
}
|
||||
|
||||
/* SAMY bottom-left */
|
||||
.sidebar::after{
|
||||
content:"";
|
||||
position:absolute;
|
||||
left:10px;
|
||||
bottom: var(--monkey-bottom);
|
||||
width: var(--monkey-size);
|
||||
height: var(--monkey-size);
|
||||
background-image: url("https://git.svstools.com/syelle/Logo/raw/branch/main/SAMY.png");
|
||||
background-repeat:no-repeat;
|
||||
background-size:contain;
|
||||
opacity:0.95;
|
||||
pointer-events:none;
|
||||
}
|
||||
|
||||
.sidebar button {
|
||||
display:block; width:100%; margin-bottom:10px; padding:10px;
|
||||
color:var(--white-color); background:var(--btn-sidebar-light-gray);
|
||||
@@ -692,21 +734,6 @@ $style = @'
|
||||
background:var(--btn-hover); transform:scale(var(--btn-hover-scale));
|
||||
}
|
||||
|
||||
/* draw SAMY in bottom-left of sidebar */
|
||||
.sidebar::after {
|
||||
content: "";
|
||||
position: absolute;
|
||||
left: 10px;
|
||||
bottom: var(--monkey-bottom);
|
||||
width: 160px; /* tweak size as you like */
|
||||
height: 160px;
|
||||
background-image: url("https://git.svstools.com/syelle/Logo/raw/branch/main/SAMY.png");
|
||||
background-repeat: no-repeat;
|
||||
background-size: contain;
|
||||
opacity: 0.95;
|
||||
pointer-events: none; /* don't block clicks on sidebar buttons */
|
||||
}
|
||||
|
||||
.content {
|
||||
position: relative;
|
||||
flex:1;
|
||||
@@ -734,37 +761,25 @@ $style = @'
|
||||
}
|
||||
|
||||
/* Specific overrides */
|
||||
.exit-button {
|
||||
background-color: var(--btn-danger);
|
||||
}
|
||||
|
||||
/* Specific overrides */
|
||||
.run-button {
|
||||
background-color: var(--btn-success);
|
||||
}
|
||||
|
||||
|
||||
.exit-button { background-color: var(--btn-danger); }
|
||||
.run-button { background-color: var(--btn-success); }
|
||||
|
||||
.tab-content { display:none; }
|
||||
.tab-content.active { display:block; }
|
||||
|
||||
.columns-container {
|
||||
display:flex; gap:20px; flex-wrap:wrap; align-items:flex-start;
|
||||
}
|
||||
.columns-container { display:flex; gap:20px; flex-wrap:wrap; align-items:flex-start; }
|
||||
|
||||
/* column styling, same as old script */
|
||||
.column {
|
||||
flex: 1; /* fill available space */
|
||||
max-width: 45%; /* or whatever width you like */
|
||||
flex: 1;
|
||||
max-width: 45%;
|
||||
border: 2px solid var(--border-color);
|
||||
border-radius: 8px;
|
||||
padding: 10px;
|
||||
background-color: var(--dark-gray-color);
|
||||
box-shadow: 0 4px 6px rgba(0,0,0,0.3);
|
||||
}
|
||||
.checkbox-group label {
|
||||
display:flex; align-items:center; margin-bottom:8px;
|
||||
}
|
||||
.checkbox-group label { display:flex; align-items:center; margin-bottom:8px; }
|
||||
|
||||
.button-group { text-align:right; margin-top:20px; }
|
||||
.exit-button {
|
||||
@@ -772,9 +787,7 @@ $style = @'
|
||||
padding:10px 20px; border:none; border-radius:5px; cursor:pointer;
|
||||
}
|
||||
|
||||
#PasswordContainer, #dattoRmmContainer {
|
||||
margin-top: 1em;
|
||||
}
|
||||
#PasswordContainer, #dattoRmmContainer { margin-top: 1em; }
|
||||
|
||||
/* Common styles for inputs, buttons, and selects */
|
||||
#PasswordContainer input,
|
||||
@@ -791,17 +804,12 @@ $style = @'
|
||||
max-width: 200px;
|
||||
}
|
||||
|
||||
/* Style specifically for the fetch button */
|
||||
#PasswordContainer button {
|
||||
background-color: var(--btn-sidebar-blue);
|
||||
cursor: pointer;
|
||||
transition: background-color 0.3s ease;
|
||||
}
|
||||
|
||||
/* Hover effect for the fetch button */
|
||||
#PasswordContainer button:hover {
|
||||
background-color: var(--btn-hover);
|
||||
}
|
||||
#PasswordContainer button:hover { background-color: var(--btn-hover); }
|
||||
|
||||
/* Tag line */
|
||||
#tagline {
|
||||
@@ -816,6 +824,7 @@ $style = @'
|
||||
.sidebar { width:100%; }
|
||||
}
|
||||
</style>
|
||||
|
||||
'@
|
||||
|
||||
# no spaces before $script
|
||||
@@ -837,8 +846,8 @@ function logProgress(label, isSuccess) {
|
||||
updateTitle();
|
||||
|
||||
const msg = isSuccess
|
||||
? `✅ ${completedTasks}/${totalTasks} done: ${label}`
|
||||
: `❌ ${completedTasks}/${totalTasks} failed: ${label}`;
|
||||
? ` ${completedTasks}/${totalTasks} done: ${label}`
|
||||
: ` ${completedTasks}/${totalTasks} failed: ${label}`;
|
||||
|
||||
const div = document.createElement('div');
|
||||
div.style.color = isSuccess ? 'lime' : 'red';
|
||||
@@ -848,10 +857,10 @@ function logProgress(label, isSuccess) {
|
||||
if (completedTasks === totalTasks) {
|
||||
const finalMsg = document.createElement('div');
|
||||
finalMsg.style.marginTop = '10px';
|
||||
finalMsg.innerHTML = `<strong>✅ All tasks complete (${completedTasks}/${totalTasks})</strong>`;
|
||||
finalMsg.innerHTML = `<strong> All tasks complete (${completedTasks}/${totalTasks})</strong>`;
|
||||
statusBox?.appendChild(finalMsg);
|
||||
|
||||
document.title = `✅ ScriptMonkey - Complete (${completedTasks}/${totalTasks})`;
|
||||
document.title = ` ScriptMonkey - Complete (${completedTasks}/${totalTasks})`;
|
||||
|
||||
const sound = new Audio('data:audio/wav;base64,UklGRiQAAABXQVZFZm10IBAAAAABAAEAESsAACJWAAACABAAZGF0YQAAAAA=');
|
||||
sound.play().catch(() => {});
|
||||
@@ -1211,6 +1220,8 @@ $style
|
||||
<button class="tab-button" data-tab="offboardTab">Off-Boarding</button>
|
||||
<button class="tab-button" data-tab="tweaksTab">Tweaks</button>
|
||||
<button class="tab-button" data-tab="SVSAppsTab">SVS APPs</button>
|
||||
|
||||
<div id="status-box" style="margin-top: 1em; font-family: monospace;"></div>
|
||||
</div>
|
||||
<div class="content">
|
||||
<div id="onboardTab" class="tab-content">
|
||||
@@ -1281,7 +1292,7 @@ $script
|
||||
<button class="exit-button" onclick="endSession()">Exit</button>
|
||||
<button class="run-button" onclick="triggerInstall()">Run Selected</button>
|
||||
</div>
|
||||
<div id="status-box" style="margin-top: 1em; font-family: monospace;"></div>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
Reference in New Issue
Block a user