have terminal grow on focus to allow better mobile input
Build and Push Container / build-and-push (push) Successful in 26s

This commit is contained in:
2026-05-28 15:13:08 -04:00
parent 28feb0e50e
commit ee2f8a34b3
2 changed files with 93 additions and 7 deletions
+59 -5
View File
@@ -178,8 +178,7 @@ function createServerRack() {
activeTerminal = terminal;
terminal.addEventListener('click', (e) => {
e.stopPropagation();
terminal.addEventListener('click', () => {
mobileInput.focus();
});
@@ -529,12 +528,42 @@ function createServerRack() {
mobileInput.focus();
terminal.style.boxShadow = '0 0 8px rgba(234, 179, 8, 0.3), inset 0 0 20px rgba(34, 197, 94, 0.1)';
terminal.style.borderColor = '#eab308';
terminal.classList.add('grown');
const face = terminal.closest('.server-face');
const unit = face?.closest('.rack-unit');
face?.classList.add('grown');
unit?.classList.add('grown');
document.getElementById('hero').classList.add('shifted');
});
terminal.addEventListener('blur', () => {
if (heroMouseDown) return;
terminal.style.boxShadow = '';
terminal.style.borderColor = '#2a2a2e';
mobileInput.blur();
terminal.classList.remove('grown');
const face = terminal.closest('.server-face');
const unit = face?.closest('.rack-unit');
face?.classList.remove('grown');
unit?.classList.remove('grown');
document.getElementById('hero').classList.remove('shifted');
});
mobileInput.addEventListener('keydown', (e) => {
if (e.key === 'Escape') {
mobileInput.blur();
}
});
mobileInput.addEventListener('blur', () => {
if (heroMouseDown) return;
terminal.style.boxShadow = '';
terminal.style.borderColor = '#2a2a2e';
terminal.classList.remove('grown');
const face = terminal.closest('.server-face');
const unit = face?.closest('.rack-unit');
face?.classList.remove('grown');
unit?.classList.remove('grown');
document.getElementById('hero').classList.remove('shifted');
});
let lastInputValue = '';
@@ -737,10 +766,32 @@ function createServerRack() {
let activeTerminal = null;
createServerRack();
document.getElementById('hero').addEventListener('click', (e) => {
const heroEl = document.getElementById('hero');
let heroMouseDown = false;
heroEl.addEventListener('mousedown', () => { heroMouseDown = true; });
heroEl.addEventListener('mouseup', () => { heroMouseDown = false; });
heroEl.addEventListener('click', (e) => {
if (e.target.closest('.btn')) return;
if (activeTerminal && activeTerminal._mobileInput) {
activeTerminal._mobileInput.focus();
if (activeTerminal.classList.contains('grown')) {
activeTerminal.classList.remove('grown');
const face = activeTerminal.closest('.server-face');
const unit = face?.closest('.rack-unit');
face?.classList.remove('grown');
unit?.classList.remove('grown');
heroEl.classList.remove('shifted');
activeTerminal._mobileInput.blur();
} else {
activeTerminal._mobileInput.focus();
activeTerminal.classList.add('grown');
const face = activeTerminal.closest('.server-face');
const unit = face?.closest('.rack-unit');
face?.classList.add('grown');
unit?.classList.add('grown');
heroEl.classList.add('shifted');
}
}
});
@@ -823,6 +874,9 @@ function checkAchievements(cmdText, isRoot) {
achieved.push(key);
newAchievements.push(achievement);
} else if (achievement.prefix ? cmdText.startsWith(achievement.cmd) : achievement.cmd === cmdText) {
if ((key === 'nice_try' && isRoot) || (key === 'restore_backup' && !isRoot)) {
continue;
}
achieved.push(key);
newAchievements.push(achievement);
}