Untitled

<html>
<head>
<title></title>
<style>

    img:hover
    {
        opacity: 0.8;
        cursor: pointer;
    }

    img:active
    {
        opacity: 0.5;
        cursor: pointer;
    }

    body
    {
        background-image: url("jungla.jpg");
        background-repeat: no-repeat;
        background-attachment: fixed;
        background-size: cover;
    }
    #cont
    {
        position:absolute;
        border:0px solid black;
        width:300px;
        height:30%;
        left:0;
        right:0;
        margin-left: auto;
        margin-right: auto;
        top:22%
    }

    div
    {
        position:absolute;
        border:1px solid black;
        width:100px;
        height:100px;
    }

    #info
    {
        top:300px;
        left:300px;
    }

    img
    {
        width:100px;
        height:100px;
    }

    form
    {
        top:30px;
        left:50px;
        position:absolute;
    }
</style>
<script>
    /*AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA

    ziomeczku jak dla mnie to trzeba zrobic tak:
    $$ -> żabe można klikać raz tylko raaaaz a nie jak teraz bo to czity jakieś som
   $$ -> alert wyskakuje przed pojawieniem sie nowej zaby trzeba zrobic tak ze najpierw zaba potem       alert i to jest most importante chyba
        w sumie można tego nawet nie robić alertem tylko jakiegoś diva dać pod tą jaszczurą tam czy coś i w nim dać "WYGRAŁA ŻABA X ELOELO"
   $$ -> ten guzik "zakryj" to by trza wyjebać albo upięknić
        + on w sumie nie działa bo chyba trzeba by pozerować zmienne te co sprawdzają jak się go klika czy coś najlepiej to albo go wyjebac albo zrobić nim reset całej strony a nie tylko gengrid
        a może jak się go kliknie to się tobi kolejne 9 divow i razem jest 18 i przy jednym kliknieciu liczy teraz 2 punkty
        bo on generalnie średnio działa dunno man u can do it
                                    hehe rozumiesz że ju ken du AJTI hehe
    -> mozna dac guzik co cofa do indexu ale nie wiem po co ktos chciałby tam wracac
    -> może jakiś licznik punktów dla żaby zielonej i niebieskiej
    -> mozna sie nawet pokusić o jakieś "którą żabą chcesz grać" albo "podaj nick"
   $$ -> ten alert by mogl byc jakis ladniejszy czy cos nwm
    -> moze jakies bajery jeszcze w css dunno
   $$ -> na koniec trzeba wyjebac ten div info i moje komentarze bo sa zjebaaaaneeeee

   te rzeczy które są istotne ojebałem dolarem $$$
    szerokości i pozderki
    AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA*/
    var a="<img src='a.jpg'>";
    var b="<img src='b.jpg'>";
    var Tab33 = [[0,0,0],[0,0,0],[0,0,0]]
    var TabId=['a00','a01','a02','a10','a11','a12','a20','a21','a22'];
    var tura=1;

function gengrid() //generowanie obrazków wewnątrz diva cont działa elegancko
    {
        var newdiv, divIdName, sum=3,row=3;
        for (var j=0; j<row; j++)
        {
            for (var i=0; i<sum; i++)
            {
            newdiv = document.createElement('div');
            divIdName='a'+j+i;
            newdiv.setAttribute('id',divIdName);
            newdiv.style.top = 0+100*j+'px';
            newdiv.style.left = 0+100*i+'px';
            newdiv.addEventListener('click',function(){gra(this);});

            {newdiv.innerHTML="<img src='slice_"+j+"_"+i+".jpg'>";}//tutaj niby te nawiasy nie potrzebne ale jak wyjebe to nie działa XD
            document.getElementById('cont').appendChild(newdiv);
            }
        }
    }

    function gra(x)
    {
        if (tura%2==0)
        {
            x.innerHTML="<img src='a.jpg'>";
        }
        else
        {
            x.innerHTML="<img src='b.jpg'>";
        }
         tura=tura+1;
        info.innerHTML=' ';
        var k = TabId.indexOf(x.id);
        var i = Math.floor(k/3);
        var j = k%3;
        var zmienna;
        if (tura%2==0)
        {
            Tab33[i][j]=1;
            zmienna=1;
        }
        else
        {
            Tab33[i][j]=-1;
            zmienna=-1;
        }

        wyswietl();
        sprawdz(zmienna);
    }

    function wyswietl() //to je do tego diva info żeby widziec co i jak
    //w sumie mozna to wyjebac chyba cale ale zostawiam do diagnostyki czy cos
    {
        for (var i=0;i<3;i++)
        {
            for (var j=0;j<3;j++)
                info.innerHTML+=Tab33[i][j]+' ';
                info.innerHTML+='<br>';

        }

    }


    function sprawdz(t)
    {
        var asd=0;
        var sum=0;
        var win=false;
        for(var i=0;i<3;i++)//poziomo
        {
            for(var j=0;j<3;j++)
            sum+=Tab33[i][j];
            if (sum==3*t)
            {
                win=true;
            }
            sum=0;
        }
        for(var i=0;i<3;i++)//pionowo
        {
            for(var j=0;j<3;j++)
            sum+=Tab33[j][i];
            if (sum==3*t)
            {
                win=true;
            }
            sum=0;
        }

        //taki skos -> \
        for (var k=0;k<9;k++)//ta petla z k do 9 chyba nie jest potrzebna ale
                            //mi nie przeszkadza a boje sie usunac xd
        {
        for(var i=0;i<3;i++)//taki skos -> \
        {
            for(var j=0;j<3;j++)
            {
                if (i==j)
                sum+=Tab33[i][j];
            }

        }
        if (sum==3*t)
        {
            win=true;
        }
        sum=0;
        }
        //taki skos -> /
        var qweqwe; //suma i+j
        for (var k=0;k<9;k++) // tu tak samo to k do 9 chyba useless
        {
            for(var i=0;i<3;i++)
            {
                for(var j=0;j<3;j++)
                {
                    qweqwe=j+i;
                    if (qweqwe==2)
                    sum+=Tab33[i][j];
                }

            }
            if (sum==3*t)
            {
                win=true;
            }
            sum=0;
        }

        if (win==true)
        {
            if (t==-1)
            alert("zielona rzapa");
            else
            alert("niebieska rzapa");
        }

    }
</script>
</head>
<body onload = "gengrid()" >
<div id="info"></div>
<div id="cont"></div>
</body>
<form>
<input type="button" value="zakryj" onclick="gengrid()">
</form>