Untitled

<?php

$dbhost="localhost"; $dbuser="wasilek_zad4"; $dbpassword="w1BqCUay"; $dbname="wasilek_zad4";

$polaczenie = mysqli_connect ($dbhost, $dbuser, $dbpassword);
mysqli_select_db ($polaczenie, $dbname);

$rezultat = mysqli_query ($polaczenie, "SELECT * from glowna ORDER BY czas DESC LIMIT 1 ");

while ($wiersz = mysqli_fetch_array ($rezultat))
{

//tutaj nastepuja przypisanie odpowiednich zmiennych do odpowiednich kolumn w naszej tabeli
$id = $wiersz [0];
$X1 = $wiersz [1];
$X2 = $wiersz [2];
$X3 = $wiersz [3];
$Z1 = $wiersz [4];
$Z2 = $wiersz [5];
$W1 = $wiersz [6];
$W2 = $wiersz [7];
$O1 = $wiersz [8];
$O2 = $wiersz [9];
}
?>


<!DOCTIPE HTML>
<html lang="pl">
<head>
<title> Michal Wasilewski</title>
<meta http-equiv="refresh" content="10" />

<style>
.grid{width:100%;}
.x {
    width: 30px;
    height: 30px;
    border: 2px solid black;
    background-color: red;
    position: absolute;
    text-align: center;
    vertical-align: middle;
    line-height: 30px;
}
</style>


</head>
<body>

<div id="srodek">
    <div id="przyklad">
    <div style="background:url('http://wasilewskideveloper.pl/upload/cms/apartments_types/301/08-wizualizacja-m35-m38-m41-m44-m47-nowe-miasto-c-elk.jpg');width:600px;height:500px;">
        <?php
        echo '<div class="x" style="left:100px;top:200px;">'.$X1.'</div>';
        echo '<div class="x" style="left:260px;top:330px;">'.$X2.'</div>';
        echo '<div class="x" style="left:340px;top:200px;">'.$X3.'</div>';

        if($_POST['Z1'] == 0){
        echo '<div style="left:300px;top:120px;width:80%;position:absolute;"><img style="width:10%;" src="https://images86.fotosik.pl/428/4405a73a94fdd301.png">'.'</div>';} //Z1 - off
        else{
        echo '<div style="left:300px;top:120px;width:80%;position:absolute;"><img style="width:10%;" src="https://images85.fotosik.pl/428/3c2118fdaa59ac71.png">'.'</div>';} //Z1 - on
        if($_POST['Z2'] == 0){
        echo '<div style="left:190px;top:230px;width:80%;position:absolute;"><img style="width:10%;" src="https://images86.fotosik.pl/428/4405a73a94fdd301.png">'.'</div>';} //Z2 - off
    else{
echo '<div style="left:190px;top:230px;width:80%;position:absolute;"><img style="width:10%;" src="https://images85.fotosik.pl/428/3c2118fdaa59ac71.png">'.'</div>'; } //Z2 - on

        if($_POST['W1'] == 0){
        echo '<div style="left:520px;top:20px;width:80%;position:absolute;"><img style="width:10%;" src="https://images85.fotosik.pl/428/359e47072de36740.png">'.'</div>';} //W1 - off
else{
echo '<div style="left:520px;top:20px;width:80%;position:absolute;"><img style="width:10%;" src="https://images86.fotosik.pl/428/4e824c6846e3c20a.gif">'.'</div>';} //W1 - on
if($_POST['W2'] == 0){
echo '<div style="left:410px;top:20px;width:80%;position:absolute;"><img style="width:10%;" src="https://images85.fotosik.pl/428/359e47072de36740.png">'.'</div>';} //W2 - off
else{
echo '<div style="left:410px;top:20px;width:80%;position:absolute;"><img style="width:10%;" src="https://images86.fotosik.pl/428/4e824c6846e3c20a.gif">'.'</div>';} //W2 - on

if($_POST['O1'] == 0){
        echo '<div style="left:480px;top:290px;width:80%;position:absolute;"><img style="width:10%;" src="https://images85.fotosik.pl/428/70e95fdec4041d9e.png">'.'</div>';} //O1 - off
else{
echo '<div style="left:480px;top:290px;width:80%;position:absolute;"><img style="width:10%;" src="https://images86.fotosik.pl/428/54e4d10b221ba0b5.png">'.'</div>';} //O1 - on

if($_POST['O2'] == 0){
        echo '<div style="left:70px;top:410px;width:80%;position:absolute;"><img style="width:10%;" src="https://images85.fotosik.pl/428/70e95fdec4041d9e.png">'.'</div>';} //O2 - off
else{
echo '<div style="left:70px;top:410px;width:80%;position:absolute;"><img style="width:10%;" src="https://images86.fotosik.pl/428/54e4d10b221ba0b5.png">'.'</div>';} //O2 - on
?>
    </div>

</div>
</div>

</body>
</html>