Fix: Add inline display:none to modals, fix terminal to loop after 3 cycles

This commit is contained in:
Roberth Rajala 2026-02-01 17:48:37 +01:00
parent 040254f81d
commit 5dd6161b93
2 changed files with 19 additions and 15 deletions

View File

@ -687,8 +687,8 @@
</div> </div>
</footer> </footer>
<!-- Service Info Modals --> <!-- Service Info Modals - Hidden by default -->
<div id="modal-nextcloud" class="service-modal"> <div id="modal-nextcloud" class="service-modal" style="display: none !important;">
<div class="modal-content"> <div class="modal-content">
<button class="modal-close">&times;</button> <button class="modal-close">&times;</button>
<h3>☁️ Nextcloud</h3> <h3>☁️ Nextcloud</h3>
@ -707,7 +707,7 @@
</div> </div>
</div> </div>
<div id="modal-netdata" class="service-modal"> <div id="modal-netdata" class="service-modal" style="display: none !important;">
<div class="modal-content"> <div class="modal-content">
<button class="modal-close">&times;</button> <button class="modal-close">&times;</button>
<h3>📊 Netdata Monitoring</h3> <h3>📊 Netdata Monitoring</h3>
@ -726,7 +726,7 @@
</div> </div>
</div> </div>
<div id="modal-immich" class="service-modal"> <div id="modal-immich" class="service-modal" style="display: none !important;">
<div class="modal-content"> <div class="modal-content">
<button class="modal-close">&times;</button> <button class="modal-close">&times;</button>
<h3>📸 Immich Photo Server</h3> <h3>📸 Immich Photo Server</h3>
@ -745,7 +745,7 @@
</div> </div>
</div> </div>
<div id="modal-homarr" class="service-modal"> <div id="modal-homarr" class="service-modal" style="display: none !important;">
<div class="modal-content"> <div class="modal-content">
<button class="modal-close">&times;</button> <button class="modal-close">&times;</button>
<h3>🎛️ Homarr Dashboard</h3> <h3>🎛️ Homarr Dashboard</h3>
@ -764,7 +764,7 @@
</div> </div>
</div> </div>
<div id="modal-tailscale" class="service-modal"> <div id="modal-tailscale" class="service-modal" style="display: none !important;">
<div class="modal-content"> <div class="modal-content">
<button class="modal-close">&times;</button> <button class="modal-close">&times;</button>
<h3>🔒 Tailscale VPN</h3> <h3>🔒 Tailscale VPN</h3>

View File

@ -368,7 +368,7 @@ function initLimitedTerminalTyping() {
let isTyping = false; let isTyping = false;
const typeCommand = () => { const typeCommand = () => {
if (isTyping || cycleCount >= maxCycles) return; if (isTyping) return;
isTyping = true; isTyping = true;
const cmd = commands[currentCommand]; const cmd = commands[currentCommand];
@ -416,10 +416,11 @@ function initLimitedTerminalTyping() {
terminal.scrollTop = terminal.scrollHeight; terminal.scrollTop = terminal.scrollHeight;
isTyping = false; isTyping = false;
currentCommand = (currentCommand + 1) % commands.length; currentCommand++;
// Count completed cycles // Count completed cycles
if (currentCommand === 0) { if (currentCommand >= commands.length) {
currentCommand = 0;
cycleCount++; cycleCount++;
} }
}, 500); }, 500);
@ -429,15 +430,18 @@ function initLimitedTerminalTyping() {
typeChar(); typeChar();
}; };
// Start typing effect every 6 seconds, but only for 3 cycles // Start typing effect every 5 seconds - loops forever, clears after 3 cycles
const intervalId = setInterval(() => { setInterval(() => {
// Reset terminal after 3 cycles
if (cycleCount >= maxCycles) { if (cycleCount >= maxCycles) {
clearInterval(intervalId); // Clear all dynamic content
// Keep cursor blinking at the end const dynamicContent = terminal.querySelectorAll('.terminal-line:nth-child(n+4), .terminal-output');
return; dynamicContent.forEach(el => el.remove());
currentCommand = 0;
cycleCount = 0;
} }
typeCommand(); typeCommand();
}, 6000); }, 5000);
} }
/** /**