<?php

include "../../config/master.php";
allowRoles([1,5]);

include "../layout/header.php";

/* HIDE SIDEBAR */
echo "<style>
.sidebar{display:none !important;}
.topbar{margin-left:0 !important;}
.main{margin-left:0 !important;padding-bottom:80px;}
</style>";

$id = intval($_GET['id'] ?? 0);

$data = mysqli_fetch_assoc(mysqli_query($conn,"SELECT * FROM village_sliders WHERE id='$id'"));

if(!$data){
    echo "Slider not found";
    exit;
}

/* UPDATE */
if(isset($_POST['update']))
{

$title = mysqli_real_escape_string($conn,$_POST['title']);
$description = mysqli_real_escape_string($conn,$_POST['description']);
$order = intval($_POST['display_order']);

$image = $data['image'];

/* IMAGE UPDATE */
if(!empty($_FILES['image']['name']))
{
    $target_dir="../../uploads/sliders/";

    if(!is_dir($target_dir)){
        mkdir($target_dir,0777,true);
    }

    $ext = pathinfo($_FILES['image']['name'],PATHINFO_EXTENSION);
    $image="slider_".time().rand(100,999).".".$ext;

    move_uploaded_file($_FILES['image']['tmp_name'],$target_dir.$image);

    /* DELETE OLD */
    if(!empty($data['image'])){
        $file = $target_dir.$data['image'];
        if(file_exists($file)){
            unlink($file);
        }
    }
}

mysqli_query($conn,"
UPDATE village_sliders SET
title='$title',
description='$description',
image='$image',
display_order='$order'
WHERE id='$id'
");

echo "<script>
alert('Slider Updated Successfully');
window.location='view_sliders.php';
</script>";

}
?>

<div class="app-content">

<!-- HEADER -->
<div class="card-box">
    <h4>Edit Slider</h4>
    <p style="font-size:12px;color:#777;">Update slider details</p>
</div>

<!-- FORM -->
<div class="card-box">

<form method="post" enctype="multipart/form-data">

<label>Title</label>
<input type="text" name="title" class="form-control"
value="<?php echo htmlspecialchars($data['title']); ?>">

<!-- CURRENT IMAGE -->
<?php if($data['image']){ ?>
<label>Current Image</label>
<img src="../../uploads/sliders/<?php echo $data['image']; ?>"
style="width:100%;height:160px;object-fit:cover;border-radius:10px;margin-top:8px;">
<?php } ?>

<!-- NEW IMAGE -->
<label>Change Image</label>

<label style="
display:block;
text-align:center;
padding:14px;
background:#3498db;
color:white;
border-radius:10px;
cursor:pointer;
margin-top:8px;
">
<i class="fa fa-upload"></i> Select New Image
<input type="file" name="image" id="fileInput" accept="image/*" style="display:none;">
</label>

<img id="preview" style="
width:100%;
height:160px;
object-fit:cover;
border-radius:10px;
margin-top:10px;
display:none;
">

<label>Description</label>
<textarea name="description" class="form-control"><?php echo htmlspecialchars($data['description']); ?></textarea>

<label>Display Order</label>
<input type="number" name="display_order" class="form-control"
value="<?php echo $data['display_order']; ?>">

<br>

<button type="submit" name="update" class="btn-mobile" style="background:#2980b9;color:#fff;">
<i class="fa fa-save"></i> Update Slider
</button>

</form>

</div>

</div>

<!-- BOTTOM NAV -->
<div class="bottom-nav">
    <a href="../dashboard.php">
        <i class="fa fa-home"></i>
        Home
    </a>

    <a href="../villages/village_data.php">
        <i class="fa fa-map"></i>
        Villages
    </a>

    <a href="../families/view_families.php">
        <i class="fa fa-users"></i>
        Families
    </a>

    <a href="../schemes/view_schemes.php">
        <i class="fa fa-list"></i>
        Schemes
    </a>
</div>

<?php include "../layout/footer.php"; ?>

<script>

/* IMAGE PREVIEW */
document.getElementById("fileInput")?.addEventListener("change", function(){
    if(this.files && this.files[0]){
        document.getElementById("preview").src = URL.createObjectURL(this.files[0]);
        document.getElementById("preview").style.display = "block";
    }
});

</script>