<!-- index.php -->
<?php 
include ('includes/header.php');

$table_name = 'spapi';
$page_name = 'sport_api';
$data = ['apikey' => ''];

$db->insertIfEmpty($table_name, $data);

$res = $db->select($table_name, '*', '', '');

if(isset($_POST['submit'])){
    unset($_POST['submit']);
    $updateData = $_POST;
    $db->update($table_name, $updateData, 'id = :id',[':id' => 1]);
    echo "<script>window.location.href='". $page_name.".php'</script>";
}


?>
<style>
  .responsive-logo {
    margin-top: 20px;
    width: 300px;
    height: 170px;
  }

  @media (max-width: 768px) {
    .responsive-logo {
      width: 100%;
      height: auto;
    }
  }
</style>
<!-- Form Start -->
<div class="container-fluid pt-4 px-4">
    <div class="row g-4">
        <div class="col-12">
            <div class="bg-secondary rounded h-100 p-4">
                <h2 class="mb-4">Sports API Key</h6>
                <h7 class="mb-4 text-info">‼️ This already has a default api key added. The default api key will be used as long as the bottom section is empty. There is a risk of exceeding the key limit. Therefore, use your own key whenever possible to avoid inconveniences.</h7>
                <br><br>
                <a href="https://www.thesportsdb.com/pricing" class="mb-4 text-warning" target="_blank">
                    How do I get my own API key?
                </a>

                <br><br>
                    <form method="post">
                        <div class="mb-3">
                            <label class="form-label">Enter Sports API Key</label>
                            <input type="text" name="apikey" class="form-control" value="<?=$res[0]['apikey'] ?>">
                        </div>
                        <button type="submit" name="submit" class="btn btn-primary">Update Sports API</button>

                    </form>
            </div>
        </div>
    </div>
</div>
<!-- Form End -->

<!-- Footer Start -->
<?php include ('includes/footer.php');?>
<!-- Footer End -->
</body>

</html>