
<?php
/*
 * Ülesanne: Kalade andmebaas
* 

Pavel Ivanov Tööstushariduskeskus 9.22.23
 *
 *
 */

?>
<?php
require ('conf.php');
global $yhendus;
if ($_SERVER["REQUEST_METHOD"] == "POST" && isset($_POST["lisamisvorm"])) {
    $kalanimi = $_POST["kalanimi"];
    $pilt = $_POST["pilt"];
    $varv = $_POST["varv"];

    $kask = $yhendus->prepare("INSERT INTO kalad (kalanimi, pilt, varv) VALUES (?, ?, ?)");
    $kask->bind_param("sss", $kalanimi, $pilt, $varv);
    header("Location: " . strtok($_SERVER['REQUEST_URI'], '?'));
    if ($kask->execute()) {
        echo "Data added successfully.";
    } else {
        echo "Failed to save data.";
    }
}
?>

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Kalade andmebass</title>
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="stylesheet" href="https://www.w3schools.com/w3css/4/w3.css">
    <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Sofia">
    <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Allerta+Stencil">
    <meta name="viewport" content="width=device-width, initial-scale=1">

    

</head>

<form class="w3-container" name="vorm" action="<?php echo $_SERVER['PHP_SELF']; ?>" method="POST">
    <div class="w3-container w3-blue">
        <h1 style="text-shadow:1px 1px 0 #444">Kalade andmebaas</h1>
    </div>
    <br>
    <input type="hidden" name="lisamisvorm" value="jah">
    <label for="kalanimi">Kalanimi</label>
    <input class="w3-input w3-border" type="text" name="kalanimi" id="kalanimi">
    <br>
    <br>
    <label for="pilt">Pilt</label>
    <input class="w3-input w3-border w3-round" type="text" name="pilt" id="pilt">
    <br>
    <br>
    <label for="varv">Värv</label>
    <input class="w3-input" type="text" name="varv" id="varv">
    <br>
    <input class="w3-btn w3-blue" type="submit" name="Lisavorm" value="ok">
    <br>
    <br>
    <br>
    <a href="https://pavelivanov22.thkit.ee/" class="w3-btn w3-blue">Tagasi php lehile</a>
</form>

<body>
<div class="footer">
<div id="links">
    <div id="lingid">
        <div class="w3-sofia">
            <?php
            global $yhendus;
            $kask=$yhendus->prepare("SELECT id, kalanimi FROM kalad" );
            $kask->bind_result($id,$kalanimi);
            $kask->execute();
            echo "<ul>";
            while($kask->fetch()){
                
                echo "<li><a href='?id=$id'>".$kalanimi."</a> </li>";
               
            }
            echo "</ul>";
            ?>
        </div>
    </div>
</div>
</div>
<div id="sisu">
    <?php
    if (isset($_REQUEST["id"])){
        $kask=$yhendus->prepare("SELECT id, kalanimi, pilt, varv FROM kalad WHERE id=?");
        $kask->bind_param("i", $_REQUEST["id"]);
        $kask->bind_result($id,$kalanimi, $pilt, $varv);
        $kask->execute();
        if ($kask->fetch()){
            $backgroundColor = $varv; // Use the value from the database
            echo '<td><div class="move-container">';
            echo '<td><div class="image-container">';
            echo '<div class="w3-border w3-padding"" style="background-color:' . $backgroundColor . ';">';

            echo "<strong>".$id.", ".$kalanimi.", ".$varv."</strong><br>";
            echo "<img class='w3-circle' src='$pilt' alt='$kalanimi'>";

            echo '</div></td>';
            echo '<td><div class="w3-container w3-black w3-center w3-allerta">';
            echo '<td><div class="w3-xlarge">';
            echo "<a href='?kustutus=$id'>kustuta</a>";
            echo '</div></td>';
            echo '</div></td>';
            echo '</div>';

        }
    }
    ?>
    <?php
    if (isset($_REQUEST["kustutus"]))
    {
        $kask=$yhendus->prepare("DELETE FROM kalad WHERE id=?");
        $kask->bind_param("i",$_REQUEST["kustutus"]);
        $kask->execute();
    }
    ?>
</div>
</body>
</html>
<a href="KaladHighlight.php"> Hightlight</a>
<style>
    input[type="text"] {
        width: 200px;
        display: flex;
    }
    .image-container {
        width: 300px;
        height: 400px; 
        overflow: hidden;
    }

    .image-container img {
        width: 100%;
        height: auto;
    }



    .move-container{
        position: absolute;
        left: 30%;
        top: 15%;
    }
    #links{
        border: 1px solid #ccc;
        margin-top: 5%;
    }
    a:hover {
        color: darkblue; 
        font-weight: bold; 
        font-size: 16px; 
    }
    .w3-sofia {
        font-family: Sofia, cursive;
        font-size: 30px;
    }
      body {
        background-color: #fefbd8;
    }
    .footer {
       background-color: #d5f4e6;
     }
    

    span {
        background-color: #f18973;
    }
     @media (max-width: 767px) {
             input[type="text"] {
        width: 200px;
        display: flex;
    }
    .image-container {
        width: 300px;
        height: 400px; 
        overflow: hidden;
    }

    .image-container img {
        width: 100%;
        height: auto;
    }



    .move-container{
        position: absolute;
        left: 40%;
        top: 15%;
    }
    #links{
        border: 1px solid #ccc;
        margin-top: 45%;
    }
    a:hover {
        color: darkblue; 
        font-weight: bold; 
        font-size: 16px; 
    }
    .w3-sofia {
        font-family: Sofia, cursive;
        font-size: 30px;
    }
    html{
        position: absolute;
        width: 670px;
        height: auto;
        
    }
       
    }




</style>