Untitled

<!DOCTYPE html>
<html lang="pl">
  <head>
    <title>[title]</title>
    <meta charset="utf-8" />
    <link rel="stylesheet" href="style.css" />
  </head>
  <body>
    <div id="board">

    </div>
    <script>
        var board = document.getElementById("board");
        var colors = ['green','green','yellow','yellow','orange','orange','blue','blue','magenta','magenta','lime','lime','pink','pink','turquoise','turquoise'];
        var isFirstClick = true;
        var firstCardValue;
        var firstCardId;
        sortCards();
        for(var i=0; i<16; i++){
            if(i % 4 == 3){
                board.innerHTML += "<div class='card right' onclick='clickEvent(this,"+i+");'></div>";
            }else{
                board.innerHTML += "<div class='card' onclick='clickEvent(this,"+i+");'></div>";
            }
            /*
                lub:
                board.innerHTML = board.innerHTML + "<div class='card'></div>"
            */
        }
        function clickEvent(elem,num){
            if(isFirstClick == true){
                isFirstClick = false;
                firstCardValue = colors[num];
                firstCardId = num;
            }else{
                if(firstCardId == num){
                    console.log("dirty cheater");
                }else{
                    if(firstCardValue == colors[num]){
                        console.log("para");
                    }
                    isFirstClick = true;
                }
            }

            elem.style.backgroundColor = colors[num];
        }

        function sortCards(){
            var tmp;
            var rand;
            for(var i=0; i<16; i++){
                tmp = colors[i];
                rand = Math.round(Math.random()*15)
                colors[i] = colors[rand];
                colors[rand] = tmp;
                //console.log(Math.round(Math.random()*15));
            }
        }
    </script>
  </body>
</html>