<?php include('include/headscript.php');
$idyogaschool = 1;

?>
<?php
// Collegamento al database
$conn = new mysqli($servername, $username, $password, $database);

// Recupera le amenities
$query = $conn->prepare("SELECT idamenities FROM amenitiesschool WHERE idyogaschool = ?");
$query->bind_param("i", $idyogaschool);
$query->execute();
$result = $query->get_result();

$selectedAmenities = [];
while ($row = $result->fetch_assoc()) {
    $selectedAmenities[] = $row['idamenities'];
}

// Recupera tutte le amenities disponibili
$query = $conn->prepare("SELECT idamenities, slugamenities FROM amenities");
$query->execute();
$result = $query->get_result();

$amenities = [];
while ($row = $result->fetch_assoc()) {
    $amenities[] = $row;
}
?>
<!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, user-scalable=0, minimal-ui">
    <?php include('include/seo.php'); ?>

    <meta http-equiv="X-UA-Compatible" content="IE=edge" />

    <link rel="shortcut icon" href="assets/images/favicon.ico">

    <link href="assets/css/bootstrap.min.css" rel="stylesheet" type="text/css">
    <link href="assets/css/icons.css" rel="stylesheet" type="text/css">
    <link href="assets/css/style.css" rel="stylesheet" type="text/css">

    <style>
        .amenities-container {
            display: grid;
            grid-template-columns: 1fr 1fr;
            /* Due colonne */
            gap: 10px;
        }

        .amenity-item {
            display: flex;
            align-items: center;
            padding: 10px;
            border: 1px solid #007bff;
            border-radius: 5px;
            background-color: #f8f9fa;
        }

        .amenity-item input[type="checkbox"] {
            margin-right: 10px;
        }

        .amenity-item label {
            font-size: 16px;
            color: #007bff;
        }
    </style>
</head>

<body class="fixed-left">

    <!-- Begin page -->
    <div id="wrapper">

        <?php include('include/navigationbar.php'); ?>

        <!-- Start right Content here -->

        <div class="content-page">
            <!-- Start content -->
            <div class="content">

                <?php include('include/topbar.php'); ?>

                <div class="page-content-wrapper ">

                    <div class="container-fluid">

                        <div class="row">
                            <div class="col-sm-12">
                                <div class="page-title-box">
                                    <div class="btn-group float-right">
                                        <ol class="breadcrumb hide-phone p-0 m-0">
                                            <li class="breadcrumb-item"><a href="#">YogiWhere</a></li>
                                            <li class="breadcrumb-item active">Amenities</li>
                                        </ol>
                                    </div>
                                    <h4 class="page-title">Seleziona le amenities per la tua scuola</h4>
                                </div>
                            </div>
                        </div>
                        <!-- end page title end breadcrumb -->

                        <div class="row">
                            <div class="col-lg-12">
                                <div class="card card-body">
                                    <h4 class="card-title font-20 mt-0">Lista delle amenities</h4>
                                    <p class="font-13 text-muted">Seleziona le caratteristiche della tua scuola</p>

                                    <!-- Lista delle amenities -->
                                    <div class="amenities-container">
                                        <?php foreach ($amenities as $amenity): ?>
                                            <div class="amenity-item">
                                                <input type="checkbox" id="amenity-<?php echo $amenity['idamenities']; ?>" name="amenities[]" value="<?php echo $amenity['idamenities']; ?>"
                                                    <?php echo in_array($amenity['idamenities'], $selectedAmenities) ? 'checked' : ''; ?>>
                                                <label for="amenity-<?php echo $amenity['idamenities']; ?>"><?php echo htmlspecialchars($amenity['slugamenities']); ?></label>
                                            </div>
                                        <?php endforeach; ?>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <!-- end row -->

                </div><!-- container -->

            </div> <!-- Page content Wrapper -->

        </div> <!-- content -->

        <?php include('include/footer.php'); ?>

    </div>
    <!-- End Right content here -->

    </div>
    <!-- END wrapper -->

    <script src="assets/js/jquery.min.js"></script>
    <script>
        document.addEventListener('DOMContentLoaded', function() {
            // Gestisci il click sui checkbox
            document.querySelectorAll('input[type="checkbox"]').forEach(function(checkbox) {
                checkbox.addEventListener('change', function() {
                    const idamenity = this.value;
                    const isChecked = this.checked;

                    const formData = new FormData();
                    formData.append('idyogaschool', '<?php echo $idyogaschool; ?>');
                    formData.append('idamenity', idamenity);
                    formData.append('action', isChecked ? 'add' : 'remove');

                    fetch('update_amenity.php', {
                            method: 'POST',
                            body: formData
                        })
                        .then(response => response.json())
                        .then(data => {
                            if (data.success) {
                                console.log(data.message);
                            } else {
                                console.error(data.message);
                            }
                        })
                        .catch(error => {
                            console.error('Errore nella richiesta:', error);
                        });
                });
            });
        });
    </script>

</body>

</html>