<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="css/navigationBar.css" type="text/css">
    <link rel="stylesheet" href="css/backup.css" type="text/css">
    <script src="https://kit.fontawesome.com/e0ade2e31e.js" crossorigin="anonymous"></script>
    <script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"></script>

    <link rel="stylesheet" href="https://unpkg.com/leaflet@1.9.2/dist/leaflet.css"
        integrity="sha256-sA+zWATbFveLLNqWO2gtiw3HL/lh1giY/Inf1BJ0z14=" crossorigin="" />
    <title>Document</title>
</head>

<body>
    <ul>
        <li><a href="index.php">Mapa</a></li>
        <li><a href="configurator.php">Konfigurátor topologie</a></li>
        <li><a href="condition.php"><i class="fa-solid fa-screwdriver-wrench"></i></a></li>
        <li><a href="update.php"><i class="fa-solid fa-rotate"></i></a></li>
        <li><a class="active" href=#><i class="fa-solid fa-cloud-arrow-up"></i></a></li>
        <li onclick="napoveda()"><a href="#"><i class="fa-solid fa-question"></i></a></li>
    </ul>


    <div class="tabulka"></div>
    <div class="formular"></div>
    <div class="text"></div>

    <script>
        function napoveda() {
            Swal.fire({
                title: '<strong>Nápověda</strong>',
                icon: 'info',
                width: '75%',
                html:
                    '<div class="swal2-html-container">' +
                    '<strong><u>Nahrávání zálohy <b style=\"color:red\">DO</b> databáze: </u></strong>' +
                    '<ol>' +
                    '<li class="swal2-li">Pokud byly v adresáři se zálohami nalezeny nějaké soubory, jejich seznam se objeví v tabulce na levé části stránky.</li>' +
                    '<li class="swal2-li">Kliknutím na konkrétní soubor v tabulce se pod formulářem v pravé části stránky objeví tlačíko <i><b>\"Nahrát zálohu do databáze\"</i></b></li>' +
                    '<li class="swal2-li">Kliknutím na toto tlačítko dojde k nahrání vybraného souboru do databáze.</li>' +
                    '</ol>' +
                    '</div>' +
                    '<div class="swal2-html-container">' +
                    '<strong><u>Vytvoření zálohy databáze: </u></strong>' +
                    '<ol>' +
                    '<li class="swal2-li">K vytvoření slouží formulář v pravé horní části stránky.</li>' +
                    '<li class="swal2-li">Je možné zadat vlastní název souboru (<b style=\"color:red\">bez diakritiky a jiných speciálních znaků</b>) nebo využít vygenerovaný název.</li>' +
                    '<li class="swal2-li">Název souboru se nesmí shodovat s názvem souboru existující zálohy. Pokud se budou shodovat, zálohu nebude možné odeslat.</li>' +
                    '<li class="swal2-li">Kliknutím na tlačítko <i><b>\"Vytvořit zálohu\"</i></b> dojde k vytvoření zálohy databáze.</li>' +
                    '</ol>' +
                    '</div>',
                showCloseButton: true,
                focusConfirm: false,
                confirmButtonColor: '#3085d6',
                confirmButtonText: 'Díky, už to chápu!',
                customClass: {
                    title: 'swal-title',
                    popup: 'swal-popup',
                    closeButton: 'swal-close-button',
                    confirmButton: 'swal-button'
                }
            })
        }
    </script>


</body>

</html>


<script src="https://unpkg.com/leaflet@1.9.2/dist/leaflet.js"
    integrity="sha256-o9N1jGDZrf5tS+Ft4gbIK7mYMipq9lqpVJ91xHSyKhg=" crossorigin=""></script>


<?php

include "php/_CONSTANTS.php";
include "php/connection.php";
// inicializace pole pro ukládání záloh
$backups = array();

if ($MYSQL_UPLOAD && !$ANONYMOUS_MODE) {
    if (is_dir($BACKUP_DIR)) {
        // otevření složky se zálohami
        $backupFiles = scandir($BACKUP_DIR);

        // prohledání složky a vyhledání záloh MySQL
        foreach ($backupFiles as $backupFile) {
            if (strpos($backupFile, '.sql') !== false) {
                // získání data vytvoření souboru
                $backupFileDate = date("Y-m-d H:i:s", filemtime($BACKUP_DIR . '/' . $backupFile));

                // vytvoření objektu s názvem souboru a datem vytvoření
                $backupObject = (object) [
                    'nazev' => $backupFile,
                    'datum' => $backupFileDate
                ];
                // přidání objektu do pole záloh
                $backups[] = $backupObject;
            }
        }
    }
}
?>

<script src="https://unpkg.com/leaflet@1.9.2/dist/leaflet.js"
    integrity="sha256-o9N1jGDZrf5tS+Ft4gbIK7mYMipq9lqpVJ91xHSyKhg=" crossorigin=""></script>


<script type="module">
    import * as Objekty from "./js/object.js";
    import { ajaxCreateBackup, ajaxUploadBackup } from './js/ajax.js';
    import { Tabulka } from './js/tabulka.js';
    import { Formular, odstranitFormular, formularUpdateLabel, formularUpdateInput } from './js/formular.js';
    const tabulkaContainer = document.querySelector(".tabulka");
    const formularContainer = document.querySelector(".formular");
    const textContainer = document.querySelector(".text");
    var tlacitko = undefined;
    var tabulka;

    const Constants = <?php echo json_encode($all_vars); ?>;


    // Je-li zakázán anonymní mód a povolen upload dat do mySQL
    if (Constants.MYSQL_UPLOAD && !Constants.ANONYMOUS_MODE) {
        var zalohy = <?php echo json_encode($backups); ?>;
        // Pokud byly nalezeny nějaké zálohy
        if (zalohy.length > 0) {
            // Přetvoření php objektu na js objekt
            Objekty.Soubor.vytvoritSouborySQL(zalohy);

            // Tabulka se seznamem backup souborů
            // Místo parametru vybraná topologie je odesláno pole souborů
            tabulka = new Tabulka(Constants, "zaloha", Objekty.poleSouboru, null, null)
            tabulkaContainer.appendChild(tabulka.tabulka);
            // Event-listenery tabulky
            eventListeners();


        } else {
            // Pokud nebyly nalezeny nějaké zálohy, vypíše se hláška
            tabulkaContainer.innerHTML = "<b><i style=\"color:darkred\">Nebyly nalezeny žádné soubory zálohy.</i>";
            tabulkaContainer.style.fontSize = "2.3vw";
            tabulkaContainer.style.textAlign = "center";
        }


        // Formulář pro vytvoření zálohy
        var formular = new Formular(Constants, "backup", null, null);
        formularContainer.appendChild(formular.form);

        // Event-listener pro formulář
        formular.souborInput.addEventListener("input", function (event) {
            // Pokud bude zadán nějaký název souboru, který se nebude shodovat s existujícím (záleží na konstantě OVERWRITE) umožní odeslání formuláře. Zároveň přepíše mezery na znak "_"
            if (formular.souborInput.value.length > 0) {
                /*Výraz /\s/g nahrazuje všechny bílé znaky (včetně mezer, tabulátorů a nových řádků) znakem _. 
                Parametr g označuje globální vyhledávání, což znamená, že se provede nahrazení všech výskytů v celém řetězci
                Metoda replace() vrátí nový řetězec*/
                formular.souborInput.value = formular.souborInput.value.replace(/\s/g, '_');
                let shoda = false;

                // Pokud není povolené přepisování souborů, dochází ke kontrole shody názvů souborů
                if (!Constants.OVERWRITE) {
                    for (let i = 0; i < Objekty.poleSouboru.length; i++) {
                        if (Objekty.poleSouboru[i].nazev == (formular.souborInput.value + ".sql")) {
                            shoda = true;
                            break;
                        }
                    }
                }
                if (shoda) {
                    formularUpdateInput(formular.souborInput, "", "", "", "lightcoral", "");
                    formular.submit.disabled = true;
                    formular.submit.style.cursor = "not-allowed";
                } else {
                    formularUpdateInput(formular.souborInput, "", "", "", "", "");
                    formular.submit.disabled = false;
                    formular.submit.style.cursor = "";
                }

            } else {
                // V opačném případě zablokuje odeslání formuláře
                formularUpdateInput(formular.souborInput, "", "", "", "lightcoral", "");
                formular.submit.disabled = true;
                formular.submit.style.cursor = "not-allowed";
            }
        });

        // Event-listener pro odeslání formuláře na vytvoření zálohy
        formular.form.addEventListener("submit", function (event) {
            event.preventDefault();
            ajaxCreateBackup(Constants, formular.souborInput.value);

            let d = new Date();
            let rok = d.getFullYear(); if (rok < 10) rok = "0" + rok;
            let mesic = d.getMonth() + 1; if (mesic < 10) mesic = "0" + mesic;
            let den = d.getDate(); if (den < 10) den = "0" + den;
            let hodina = d.getHours(); if (hodina < 10) hodina = "0" + hodina;
            let minuta = d.getMinutes(); if (minuta < 10) minuta = "0" + minuta;
            let sekunda = d.getSeconds(); if (sekunda < 10) sekunda = "0" + sekunda;

            let datumVytvoreni = rok + "-" + mesic + "-" + den + " " + hodina + ":" + minuta + ":" + sekunda;

            // Pokud předtím nebyly nalezeny žádné soubory, smažu hlášku
            if (Objekty.poleSouboru.length == 0) tabulkaContainer.innerHTML = "";


            // Pokud je povoleno přepisování souborů, provedu kontrolu, zda-li bude soubor přepsán
            let shoda = false;
            if (Constants.OVERWRITE) {
                for (let i = 0; i < Objekty.poleSouboru.length; i++) {
                    if (Objekty.poleSouboru[i].nazev == (formular.souborInput.value + ".sql")) {
                        Objekty.poleSouboru[i].datum = datumVytvoreni;
                        shoda = true;
                        // Setřídění pole souborů
                        Objekty.Soubor.vytridit();
                        break;
                    }
                }
            } if (!shoda){
                // Vytvoření objektu nového souboru
                let novySoubor = new Objekty.Soubor(formular.souborInput.value + ".sql", datumVytvoreni);
            }


            // Vygenerování nové tabulky a jejích event listenerů
            if (tabulka != undefined) tabulkaContainer.removeChild(tabulka.tabulka);
            tabulka = new Tabulka(Constants, "zaloha", Objekty.poleSouboru, null, null)
            tabulkaContainer.appendChild(tabulka.tabulka);
            eventListeners();


        });

    } else {
        textContainer.innerHTML = "<b><i style=\"color:darkred\">Přístup zamítnut: Anonymní mód nebo zakázaný upload do DB.</i>";
    }


    function eventListeners() {
        tabulka.tabulka.addEventListener("click", function (event) {
            // Pokud není vybrán žádný soubor a je vykresleno tlačíko, tak bude tlačítko odstraněno
            if (tabulka.tabulka.kliknutySoubor == undefined) {
                if (tlacitko != undefined) {
                    formularContainer.removeChild(tlacitko);
                    tlacitko = undefined;
                }
            } else {
                // Pokud je vybrán soubor, vykreslí se tlačítko pro potvrzení
                if (tlacitko != undefined) {
                    formularContainer.removeChild(tlacitko);
                    tlacitko = undefined;
                }

                tlacitko = vykreslitTlacitko();
                formularContainer.appendChild(tlacitko);

                // Obsluha stisknutí tlačítka
                tlacitko.addEventListener("click", function (event) {
                    ajaxUploadBackup(Constants, tabulka.tabulka.kliknutySoubor.nazev);
                });
            }
        });
    }

    function vykreslitTlacitko() {
        var tlacitko = document.createElement("button");
        tlacitko.id = "uploadButton";
        tlacitko.innerHTML = "Nahrát zálohu do databáze";
        return tlacitko;
    }

</script>