Hnojící stanice

Zadej tajný kód své květiny:

{% extends "templates/base.html" %}
{% set game_name = "Stanice - Hnojivo" %}
{% block content %}

<div id="pinScreen" class="container d-flex flex-column justify-content-center align-items-center h-100">
        <h1 class="mb-4 text-center" style="color: #8B4513;"><i class="fa-solid fa-poop"></i> Hnojící stanice</h1>
        <h4 class="mb-4 text-center">Zadej tajný kód své květiny:</h4>
        
        <div class="d-flex justify-content-center gap-3 mb-4" id="pinDisplay">
            <div class="pin-slot border rounded-circle shadow-sm bg-white" style="width: 80px; height: 80px;"></div>
            <div class="pin-slot border rounded-circle shadow-sm bg-white" style="width: 80px; height: 80px;"></div>
            <div class="pin-slot border rounded-circle shadow-sm bg-white" style="width: 80px; height: 80px;"></div>
        </div>

<button class="btn btn-outline-danger btn-lg mt-2 px-4" onclick="clearPin()">Vymazat</button>
    </div>

<div id="fertScreen" class="container py-4 flex-column h-100 d-none justify-content-center align-items-center" style="position: relative;">
        <h1 class="mb-3" style="color: #8B4513;"><i class="fa-solid fa-sack-dollar"></i> Doplňování živin</h1>
        <h4 class="mb-5 text-secondary">Drž tlačítko a opatrně přisypávej!</h4>

<button class="btn btn-outline-secondary mt-5" onclick="cancelFert()"><i class="fa-solid fa-arrow-left"></i> Zrušit a odejít</button>
    </div>

<div id="resultScreen" class="container py-4 flex-column h-100 d-none justify-content-center align-items-center text-center">
        <i id="resultIcon" class="fa-solid fa-circle-check text-success" style="font-size: 8rem;"></i>
        <h1 id="resultTitle" class="mt-4 display-4 fw-bold">Hotovo!</h1>
        <h3 id="resultMessage" class="mt-3 text-secondary">Tvoje kytka má radost.</h3>
        <div class="spinner-border text-secondary mt-5" role="status"></div>
        <p class="mt-2 text-muted">Připravuji stanici pro dalšího hráče...</p>
    </div>
</div>

.action-btn { transition: transform 0.2s ease, background-color 0.2s ease; border: none; }
    .action-btn:active { transform: scale(1.05); }
    .action-btn.active-fert { background-color: #A0522D !important; }

.fert-idle { transform: rotate(0deg); transition: transform 0.3s ease-in-out; }
    .fert-tilt { transform: rotate(30deg) scale(1.1); transition: transform 0.3s ease-in-out; }
</style>

function toggleFullscreen() {
        const el = document.documentElement;
        if (!document.fullscreenElement) {
            if (el.requestFullscreen) el.requestFullscreen();
            else if (el.webkitRequestFullscreen) el.webkitRequestFullscreen();
            else if (el.msRequestFullscreen) el.msRequestFullscreen();
        }
    }

document.addEventListener('fullscreenchange', () => {
        document.getElementById('fsBtn').style.display = document.fullscreenElement ? 'none' : 'block';
    });

function addPinColor(color) {
        if (currentPin.length < 3) {
            currentPin.push(color);
            updatePinDisplay();
            if (currentPin.length === 3) checkPinInDatabase();
        }
    }

function clearPin() {
        currentPin = [];
        updatePinDisplay();
    }

async function checkPinInDatabase() {
        targetFlowerId = varPrefix + currentPin.join('_');
        
        try {
            let exists = await forrestHubLib.dbVarKeyExists(targetFlowerId);
            
            if (exists) {
                targetFlowerData = await forrestHubLib.dbVarGetKey(targetFlowerId);
                
                if (targetFlowerData.status === "sick") {
                    forrestHubLib.uiShowAlert('warning', 'Tvoje kytka je nemocná! Běž do Záchranné stanice.', 4000);
                    setTimeout(clearPin, 2000);
                    return;
                }
                
                targetFlowerData.status = "busy";
                await forrestHubLib.dbVarSetKey(targetFlowerId, targetFlowerData);
                
                prepareFertScreen();
            } else {
                forrestHubLib.uiShowAlert('danger', 'Tento kód neexistuje. Zkus to znovu.', 3000);
                setTimeout(clearPin, 1000); 
            }
        } catch (error) {
            console.error(error);
            forrestHubLib.uiShowAlert('danger', 'Chyba serveru při ověřování PINu.', 3000);
            clearPin();
        }
    }

function resetInactivityTimer() {
        clearTimeout(inactivityTimer);
        inactivityTimer = setTimeout(cancelFert, 30000);
    }

function prepareFertScreen() {
        localFertLevel = targetFlowerData.fertilizer;
        updateProgressBar();
        document.getElementById('pinScreen').classList.replace('d-flex', 'd-none');
        document.getElementById('fertScreen').classList.replace('d-none', 'd-flex');
        
        document.getElementById('fertIcon').className = "fa-solid fa-poop fert-idle";
        document.getElementById('btnText').innerText = "DRŽ MĚ";
        
        resetInactivityTimer();
    }

const fertBtn = document.getElementById('fertBtn');
    fertBtn.addEventListener('contextmenu', e => e.preventDefault());

fertBtn.addEventListener('pointerdown', (e) => {
        e.preventDefault();
        if (isFerting) return;
        isFerting = true;
        clearTimeout(inactivityTimer);
        
        fertBtn.classList.add('active-fert'); 
        document.getElementById('fertIcon').classList.replace('fert-idle', 'fert-tilt');
        document.getElementById('btnText').innerText = "HNOJÍM...";

fertInterval = setInterval(() => {
            localFertLevel += 1;
            updateProgressBar();
            if (localFertLevel >= 110) stopFert();
        }, 100);
    });

fertBtn.addEventListener('pointerup', stopFert);
    fertBtn.addEventListener('pointerleave', stopFert);
    fertBtn.addEventListener('pointercancel', stopFert);

async function stopFert() {
        if (!isFerting) return;
        isFerting = false;
        clearInterval(fertInterval);
        
        fertBtn.classList.remove('active-fert');
        document.getElementById('fertIcon').classList.replace('fert-tilt', 'fert-idle');
        document.getElementById('btnText').innerText = "DRŽ MĚ";

finalizeFert();
    }

async function finalizeFert() {
        targetFlowerData.fertilizer = localFertLevel;
        let isOverferted = false;

if (localFertLevel > 100) {
            targetFlowerData.status = "sick";
            isOverferted = true;
        } else {
            targetFlowerData.status = "ok";
        }

try {
            await forrestHubLib.dbVarSetKey(targetFlowerId, targetFlowerData);
            showResultScreen(isOverferted);
        } catch (error) {
            forrestHubLib.uiShowAlert('danger', 'Chyba při ukládání hnojiva.', 3000);
            cancelFert(); 
        }
    }

async function cancelFert() {
        clearTimeout(inactivityTimer);
        if (targetFlowerData) {
            targetFlowerData.status = "ok"; 
            await forrestHubLib.dbVarSetKey(targetFlowerId, targetFlowerData);
        }
        resetStation();
    }

function showResultScreen(isOverferted) {
        document.getElementById('fertScreen').classList.replace('d-flex', 'd-none');
        const resScreen = document.getElementById('resultScreen');
        const icon = document.getElementById('resultIcon');
        const title = document.getElementById('resultTitle');
        const msg = document.getElementById('resultMessage');

resScreen.classList.replace('d-none', 'd-flex');

if (isOverferted) {
            icon.className = "fa-solid fa-skull-crossbones text-danger";
            title.innerText = "Přehnojeno!";
            title.className = "mt-4 display-4 fw-bold text-danger";
            msg.innerText = "Kytka má spálené kořeny! Rychle do Záchranné stanice.";
            appContainer.classList.add('bg-danger-flash');
        } else {
            icon.className = "fa-solid fa-circle-check text-success";
            title.innerText = "Pohnojeno!";
            title.className = "mt-4 display-4 fw-bold text-success";
            msg.innerText = `Květina má teď ${localFertLevel} % živin.`;
        }

setTimeout(() => {
            appContainer.classList.remove('bg-danger-flash');
            resetStation();
        }, 4000);
    }

function resetStation() {
        clearPin();
        targetFlowerId = ""; targetFlowerData = null; localFertLevel = 0;
        document.getElementById('resultScreen').classList.replace('d-flex', 'd-none');
        document.getElementById('fertScreen').classList.replace('d-flex', 'd-none');
        document.getElementById('pinScreen').classList.replace('d-none', 'd-flex');
    }
</script>
{% endblock %}