<?php
session_start();
include __DIR__ . '/auth.php'; // sets $CAN_EDIT

include __DIR__ . '/includes/header.php';
include __DIR__ . '/includes/sidebar.php';

$aboutFile = __DIR__ . '/../data/about.json';

/* ------------------------------------------------------------
   LOAD EXISTING CONTENT
------------------------------------------------------------ */
if (file_exists($aboutFile)) {
    $about = json_decode(file_get_contents($aboutFile), true);
} else {
    $about = [
        'mission' => '',
        'who' => '',
        'play' => "🎵 50s & 60s Rock ’n’ Roll\n🎵 70s & 80s Classics\n🎵 90s Throwbacks\n🎵 Rare B‑sides & deep cuts\n🎵 Specialty DJ shows",
        'story1' => '',
        'story2' => '',
        'cta' => ''
    ];
}

/* ------------------------------------------------------------
   SAVE UPDATED CONTENT (EDIT PERMISSION REQUIRED)
------------------------------------------------------------ */
if ($_SERVER['REQUEST_METHOD'] === 'POST') {

    if (!$CAN_EDIT) {
        die("<h1>Access Denied</h1><p>You cannot edit the About page.</p>");
    }

    $about['mission'] = trim($_POST['mission']);
    $about['who']     = trim($_POST['who']);
    $about['play']    = trim($_POST['play']);
    $about['story1']  = trim($_POST['story1']);
    $about['story2']  = trim($_POST['story2']);
    $about['cta']     = trim($_POST['cta']);

    file_put_contents($aboutFile, json_encode($about, JSON_PRETTY_PRINT));

    $successMessage = "<div class='msg success'>About page updated successfully!</div>";
}
?>

<style>
.about-edit-card {
    padding: 30px;
    margin-bottom: 30px;
    text-align: left;
}

.about-edit-card h2 {
    color: #4ff;
    margin-bottom: 10px;
    text-shadow: 0 0 10px rgba(0,255,255,0.45);
}

textarea.input-field {
    min-height: 120px;
    resize: vertical;
}
</style>

<div class="main-wrap">
    <div class="content-panel">

        <h1 class="section-title center-text">📄 Edit About Page</h1>

        <div class="vinyl-divider center-divider"></div>

        <?= $successMessage ?? '' ?>

        <form method="POST">

            <!-- MISSION -->
            <div class="neon-card about-edit-card">
                <h2>🎙️ Mission</h2>
                <textarea name="mission" class="input-field" <?= $CAN_EDIT ? '' : 'readonly' ?> required>
                    <?= htmlspecialchars($about['mission']) ?>
                </textarea>
            </div>

            <div class="vinyl-divider center-divider"></div>

            <!-- WHO WE ARE -->
            <div class="neon-card about-edit-card">
                <h2>👥 Who We Are</h2>
                <textarea name="who" class="input-field" <?= $CAN_EDIT ? '' : 'readonly' ?> required>
                    <?= htmlspecialchars($about['who']) ?>
                </textarea>
            </div>

            <div class="vinyl-divider center-divider"></div>

            <!-- WHAT WE PLAY -->
            <div class="neon-card about-edit-card">
                <h2>🎵 What We Play</h2>
                <p class="about-text">One item per line. Emojis allowed.</p>
                <textarea name="play" class="input-field" <?= $CAN_EDIT ? '' : 'readonly' ?> required>
                    <?= htmlspecialchars($about['play']) ?>
                </textarea>
            </div>

            <div class="vinyl-divider center-divider"></div>

            <!-- OUR STORY -->
            <div class="neon-card about-edit-card">
                <h2>📻 Our Story — Paragraph 1</h2>
                <textarea name="story1" class="input-field" <?= $CAN_EDIT ? '' : 'readonly' ?> required>
                    <?= htmlspecialchars($about['story1']) ?>
                </textarea>
            </div>

            <div class="neon-divider center-divider"></div>

            <div class="neon-card about-edit-card">
                <h2>📻 Our Story — Paragraph 2</h2>
                <textarea name="story2" class="input-field" <?= $CAN_EDIT ? '' : 'readonly' ?> required>
                    <?= htmlspecialchars($about['story2']) ?>
                </textarea>
            </div>

            <div class="vinyl-divider center-divider"></div>

            <!-- CALL TO ACTION -->
            <div class="neon-card about-edit-card">
                <h2>❤️ Call to Action</h2>
                <textarea name="cta" class="input-field" <?= $CAN_EDIT ? '' : 'readonly' ?> required>
                    <?= htmlspecialchars($about['cta']) ?>
                </textarea>
            </div>

            <?php if ($CAN_EDIT): ?>
                <div class="content-box center-text">
                    <button type="submit" class="button radio-static">💾 Save Changes</button>
                </div>
            <?php else: ?>
                <div class="content-box center-text" style="opacity:0.6;">
                    <p>You can view this page, but you cannot edit it.</p>
                </div>
            <?php endif; ?>

        </form>

    </div>
</div>

<?php include __DIR__ . '/includes/footer.php'; ?>
