<?php 
include(__DIR__.'/../../config/db.php');

$info_popup = "SELECT * FROM popup WHERE id = 1";
$stmt = $db->prepare($info_popup);
$stmt->execute();
$popup = $stmt->fetch(PDO::FETCH_ASSOC);

if (isset($popup['status']) && $popup['status'] != 1) {
    $popup = null;
}

if ($popup):
?>

<div id="popup_modal" class="modal popup-modal" role="dialog" data-title="<?= $popup['title']; ?>" aria-hidden="true" style="display: none;">
  <div class="modal-dialog">
    <div class="modal-content" style="--desktop-popup-alert-src: url(//d33egg70nrp50s.cloudfront.net/Images/v-zelma-v2-beta/dark-orange/desktop/layout/popup/alert.png?v=20241125);;--desktop-popup-notification-src: url(//d33egg70nrp50s.cloudfront.net/Images/v-zelma-v2-beta/dark-orange/desktop/layout/popup/notification.png?v=20241125);;--mobile-popup-alert-src: url(//d33egg70nrp50s.cloudfront.net/Images/v-zelma-v2-beta/dark-orange/mobile/layout/popup/alert.png?v=20241125);;--mobile-popup-notification-src: url(//d33egg70nrp50s.cloudfront.net/Images/v-zelma-v2-beta/dark-orange/mobile/layout/popup/notification.png?v=20241125);;--event-giveaway-popper-src: url(//d33egg70nrp50s.cloudfront.net/Images/giveaway/popper.png?v=20241125);">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-label="Close" id="popup_close_button">
          <span aria-hidden="true">×</span>
        </button>
        <h4 class="modal-title"><?= $popup['title']; ?></h4>
      </div>
      <div class="modal-body">
        <a href="https://1.1.1.1/" target="_self">
          <img loading="lazy" src="<?= $popup['image']; ?>">
        </a>
        <?= $popup['description']; ?>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-primary" id="popup_ok_button">OK</button>
      </div>
    </div>
  </div>
</div>

<script>
document.addEventListener("DOMContentLoaded", function () {
  const popupModal = document.getElementById("popup_modal");
  const closeButton = document.getElementById("popup_close_button");
  const okButton = document.getElementById("popup_ok_button");

  if (!sessionStorage.getItem("popup_closed")) {
    popupModal.style.display = "block";
  }

  function closePopup() {
    popupModal.style.display = "none";
    sessionStorage.setItem("popup_closed", "true");
  }

  if (closeButton) closeButton.addEventListener("click", closePopup);
  if (okButton) okButton.addEventListener("click", closePopup);
});
</script>

<?php endif; ?>
