<?php
include "includes/header.php";
?>

<style>
/* Dark / neon global background for this page */
.esso-theme-logo{
    padding: 26px 0 40px;
    background: radial-gradient(circle at top,#0ea5e9 0,#020617 38%,#000 80%);
}

.logo-wrapper{
    max-width: 1100px;
    margin: 0 auto;
}

.logo-card{
    background: radial-gradient(circle at top left,rgba(56,189,248,.16),transparent 55%),
                radial-gradient(circle at bottom right,rgba(96,165,250,.16),transparent 55%),
                linear-gradient(135deg,#020617,#020617,#0b1220);
    border-radius: 18px;
    padding: 22px 24px 26px;
    color: #e5e7eb;
    box-shadow: 0 20px 60px rgba(15,23,42,.9);
    border: 1px solid rgba(148,163,184,.45);
}

.logo-card h1{
    font-size: 1.35rem;
    letter-spacing: .12em;
    font-weight: 800;
    text-transform: uppercase;
    text-align:center;
    margin-bottom: 6px;
}

.logo-card h6{
    font-size:.9rem;
    text-align:center;
    margin-bottom:16px;
    color:#cbd5f5;
}

/* Logo preview */
.preview-image {
    width: 100%;
    height: auto;
    border-radius: 20px;
    display: block;
    margin: 10px auto 0 auto;
    box-shadow:0 18px 40px rgba(15,23,42,.85);
}
@media (min-width: 1200px) {
    .preview-image { width: 40%; }
}
@media (min-width: 768px) and (max-width: 1199px) {
    .preview-image { width: 55%; }
}
@media (max-width: 767px) {
    .preview-image { width: 80%; }
}

/* Controls + buttons */
.container-fluid{
    text-align:center;
}

.controls-row{
    margin-top:14px;
    text-align:center;
    color:#e5e7eb;
}

.controls-row label{
    font-weight:600;
    margin-right:6px;
}

.method-radio{
    margin:0 6px;
}

.custom-button{
    padding: 8px 22px;
    border-radius:999px;
    border:none;
    font-weight:700;
    text-transform:uppercase;
    background:linear-gradient(90deg,#22c55e,#a3e635);
    color:#022c22;
    box-shadow:0 12px 32px rgba(22,163,74,.6);
    cursor:pointer;
    transition:transform .2s ease, box-shadow .2s ease, filter .2s ease;
}
.custom-button:hover{
    filter:brightness(1.05);
    transform:translateY(-1px);
    box-shadow:0 16px 40px rgba(22,163,74,.75);
}

#upload-form,
#url-form{
    margin-top:18px;
    text-align:center;
}

#url-form{
    display:none;
}

#upload-form label,
#url-form label{
    display:block;
    margin-bottom:6px;
    font-weight:600;
    color:#cbd5f5;
}

.file-input,
.url-input{
    display:inline-block;
    padding:8px 12px;
    border-radius:999px;
    border:1px solid rgba(148,163,184,.7);
    background:rgba(15,23,42,.96);
    color:#e5e7eb;
    max-width:360px;
    width:100%;
    margin-bottom:10px;
}
</style>

<div class="container-fluid esso-theme-logo">
    <!-- Page Heading -->
    <h1 class="h3 mb-1 text-gray-100">LOGO AREA</h1>

    <div class="logo-wrapper">
        <div class="card border-left-primary shadow h-100 mb-4 logo-card">
            <div class="card-header py-1" style="background:transparent;border:0;padding-left:0;">
                <h6 class="m-0 font-weight-bold text-primary" style="text-align:left;">
                    <i class="fa fa-cogs"></i> Update Panel Logo
                </h6>
            </div>

            <div class="card-body" style="background:transparent;">

            <?php
            $jsonFilex = './img/logo/logo_filenames.json';

            $jsonDatax   = file_get_contents($jsonFilex);
            $imageDatax  = json_decode($jsonDatax, true);

            $filenamex    = $imageDatax[0]['ImageName'] ?? '';
            $uploadmethord = $imageDatax[0]['Upload_type'] ?? '';

            if ($uploadmethord == "by_file") {
                $string = $filenamex;
                $firstLetterRemoved = substr($string, 1);
                $imageFilex = $firstLetterRemoved;
                $methodLabel = "File Upload";
            } elseif ($uploadmethord == "by_url") {
                $imageFilex = $filenamex;
                $methodLabel = "Image URL";
            } else {
                $imageFilex  = "https://c4.wallpaperflare.com/wallpaper/159/71/731/errors-minimalism-typography-red-wallpaper-preview.jpg";
                $methodLabel = "Not defined";
            }

            echo '<h5>Currently in use: <strong>' . htmlspecialchars($methodLabel, ENT_QUOTES, 'UTF-8') . '</strong></h5>';

            echo '<div class="controls-row">';
            echo '<label><input type="radio" class="method-radio" name="upload-type" id="upload-radio" checked> Set logo using a file</label>';
            echo '<label><input type="radio" class="method-radio" name="upload-type" id="url-radio"> Set logo using a URL</label>';
            echo '</div>';

            echo '<img class="preview-image" src="' . htmlspecialchars($imageFilex, ENT_QUOTES, 'UTF-8') . '" alt="Current Logo">';
            echo '<br>';

            if (isset($_POST['upload'])) {
                $selectedFiles = ['logo.png', 'index.php', 'iimg.json', 'filenames.json', 'binding_dark.webp', 'bg.jpg', 'api.php', 'favicon.ico', 'logo_ne.png', '.htaccess'];
                $folderPath = './img_custom/logo/';

                $files = @scandir($folderPath);
                if ($files !== false) {
                    foreach ($files as $file) {
                        if ($file !== '.' && $file !== '..') {
                            $filePath = $folderPath . $file;
                            if (!in_array($file, $selectedFiles)) {
                                @unlink($filePath);
                            }
                        }
                    }
                }

                if (isset($_FILES['image'])) {
                    $file     = $_FILES['image'];
                    $fileType = $file['type'] ?? '';
                    $fileTemp = $file['tmp_name'] ?? '';

                    $allowedTypes = ['image/jpeg', 'image/png', 'image/gif'];
                    if (in_array($fileType, $allowedTypes)) {
                        $uploadPath  = './img_custom/logo/';
                        $fileName    = uniqid() . '.' . pathinfo($file['name'], PATHINFO_EXTENSION);
                        $destination = $uploadPath . $fileName;

                        if (move_uploaded_file($fileTemp, $destination)) {
                            $jsonFilePath = './img/logo/logo_filenames.json';
                            $jsonData     = json_encode([["ImageName" => "../img_custom/logo/" . $fileName, 'Upload_type' => 'by_file']]);
                            file_put_contents($jsonFilePath, $jsonData);

                            echo "<script>window.location.href='logo.php';</script>";
                            exit;
                        } else {
                            echo '<div class="alert alert-danger mt-2">Failed to move the uploaded file.</div>';
                        }
                    } else {
                        echo '<div class="alert alert-danger mt-2">Invalid file type. Only JPEG, PNG and GIF images are allowed.</div>';
                    }
                }
            }

            if (isset($_POST['url-submit'])) {
                $imageUrl = $_POST['image-url'] ?? '';

                if (filter_var($imageUrl, FILTER_VALIDATE_URL)) {
                    $jsonFilePath = './img/logo/logo_filenames.json';

                    $newImageData = [
                        'ImageName'   => $imageUrl,
                        'Upload_type' => 'by_url'
                    ];

                    $jsonData  = file_get_contents($jsonFilePath);
                    $imageData = json_decode($jsonData, true);

                    $imageData[0] = $newImageData;

                    $jsonData = json_encode($imageData);

                    if (file_put_contents($jsonFilePath, $jsonData)) {
                        echo "<script>window.location.href='logo.php';</script>";
                        exit;
                    } else {
                        echo '<div class="alert alert-danger mt-2">Failed to save the image data to the JSON file.</div>';
                    }
                } else {
                    echo '<div class="alert alert-danger mt-2">Invalid URL.</div>';
                }
            }
            ?>

            <form method="post" enctype="multipart/form-data" id="upload-form">
                <label for="image">Select an image for the logo:</label>
                <input class="file-input" type="file" name="image" id="image" accept="image/jpeg, image/png, image/gif">
                <br>
                <button class="custom-button" type="submit" name="upload">
                    Update Logo
                </button>
            </form>

            <form method="post" id="url-form">
                <label for="image-url">Enter an image URL for the logo:</label>
                <input class="url-input" type="text" name="image-url" id="image-url" placeholder="https://example.com/logo.png">
                <br>
                <button class="custom-button" type="submit" name="url-submit">
                    Save URL
                </button>
            </form>

            <script>
                const uploadRadio = document.getElementById('upload-radio');
                const urlRadio    = document.getElementById('url-radio');
                const uploadForm  = document.getElementById('upload-form');
                const urlForm     = document.getElementById('url-form');

                uploadRadio.addEventListener('change', () => {
                    uploadForm.style.display = 'block';
                    urlForm.style.display    = 'none';
                });

                urlRadio.addEventListener('change', () => {
                    uploadForm.style.display = 'none';
                    urlForm.style.display    = 'block';
                });
            </script>

            </div>
        </div>
    </div>
</div>

<?php
include "includes/footer.php";
?>
</body>
</html>
