MajsterMajnd

<!DOCTYPE html>
<html>
    <head>
        <title></title>
        <meta charset="utf-8"/>
    </head>
    <body>
        <h1 onclick="Test()">Mastermind</h1>
        <div id="menu">
            <fieldset id="ramka_menu">
                <legend>Menu</legend>
                <button onclick="NowaGra()">Nowa gra</button>
                <button onclick="Rezygnacja()">Poddaję się</button>
                L. cyfr: <input id="l_cyfr" type="number" min="4" max="6" value="5" onchange="ZmianaIlCyfr()"/>
            </fieldset>
        </div>
        <i id="komunikat"></i><br><br>
        <div id="prosba_o_cyfry">Podaj cyfry: <input type="text" id="pole_cyfry" maxlength="5" size="5" onchange="Interakcja()"/></div>
        <div id="wygrana">Wygrałeś/łaś! Wielkie brawa!</div>
        <div id="przegrana">No cóż, nie udało ci się rozwiązać tej zagadki, prawidłową odpowiedzią jest <span id="rozwiazanie"></span>.</div>
        <table id="tabela_prob">
            <thead>
                <th>Nr</th>
                <th>Kombinacja</th>
                <th>Trafione</th>
                <th>Istniejące</th>
            </thead>
            <tbody id="lista_prob"></tbody>
            <tfoot></tfoot>
        </table>
        <span id="oszustwo"></span>
        <script>
            var timer_komunikat;

            function Komunikat(id, t, czas)
            {
                var el_komunikat = document.getElementById(id);
                if (t)
                {
                    el_komunikat.innerHTML = t;
                    el_komunikat.style.display = "inline-block";

                    WlaczTimer(id, czas);
                }
                else
                {
                    el_komunikat.style.display = "none";
                    UsunTimer();
                }
            }

            function UsunTimer()
            {
                clearInterval(timer_komunikat);
                timer_komunikat=undefined;
            }

            function WlaczTimer(id, czas)
            {
                if (timer_komunikat)
                    UsunTimer();

                timer_komunikat = setInterval(Komunikat, czas, id);
            }

        </script>
        <script>
            const status = {w_toku: 0, wygrana: 1, przegrana: 2};

            var el_oszustwo = document.getElementById("oszustwo"),
                el_cyfry = document.getElementById("pole_cyfry"),
                el_prosba = document.getElementById("prosba_o_cyfry"),
                el_wygrana = document.getElementById("wygrana"),
                el_przegrana = document.getElementById("przegrana"),
                el_lista_prob = document.getElementById("lista_prob"),
                el_rozwiazanie = document.getElementById("rozwiazanie"),
                el_l_cyfr = document.getElementById("l_cyfr"),
                el_proby = document.getElementById("proby");


            var proba_nr, rozw = "", il_cyfr = 5;

            function OdNowa()
            {
                il_cyfr = parseInt(el_l_cyfr.value);
                proba_nr = 1;
                rozw = GenerujRozw();
                el_lista_prob.innerHTML = "";
                el_cyfry.value = "";
                el_cyfry.maxLength = el_cyfry.size = il_cyfr;
                PokazStatus(status.w_toku);

                if (el_oszustwo) el_oszustwo.innerHTML = rozw;
            }

            function LosujZnakCyfry()
            {
                const max = 9;
                var liczba = Math.floor(Math.random() * max);
                return liczba + "";
            }

            function GenerujRozw()
            {
                var i = 0, znak_cyfra, t="";
                while (i < il_cyfr)
                {
                    znak_cyfra = LosujZnakCyfry();
                    if (t.indexOf(znak_cyfra) == -1)
                    {
                        t+=znak_cyfra;
                        ++i;
                    }
                }
                return t;
            }

            function Sprawdz(podane_cyfry)
            {
                var i = 0, j, wyn = {pasujace: 0, istniejace: 0}, tab_ozn_poz=[], k;
                while (i < podane_cyfry.length)
                {
                    j = 0;
                    while (j < rozw.length)
                    {
                        if (rozw[j] == podane_cyfry[i])
                        {
                            if (i == j)
                            {
                                tab_ozn_poz[j] = 'p';
                            }
                            else
                            {
                                if (tab_ozn_poz[j] != 'p')
                                    tab_ozn_poz[j] = 'i';
                            }
                        }
                        ++j;
                    }
                    ++i;
                }

                i = 0;
                while (i < tab_ozn_poz.length)
                {
                    if (tab_ozn_poz[i] == 'p') ++wyn.pasujace;
                    else if (tab_ozn_poz[i] == 'i') ++wyn.istniejace;

                    ++i;
                }
                return wyn;
            }
            /*
            function CzyCyfryUnikatowe(podane_cyfry)
            {
                var i = 0, wyn = true, dl = podane_cyfry.length, poz;
                while (i < dl && wyn)
                {
                    poz = podane_cyfry.indexOf(podane_cyfry[i],i+1);
                    if (poz > -1)
                        wyn = false;

                    ++i;
                }
                return wyn;
            }*/

            function SprawdzPopr(podane_cyfry)
            {
                return (podane_cyfry.length == il_cyfr && podane_cyfry.search(/\D/) == -1 /*&& CzyCyfryUnikatowe(podane_cyfry)*/);
            }

            function WypiszProbe(nr, cyfry, pas, istn)
            {
                var html = "<tr><td>"+nr+"</td><td><table class='tabela_cyfry'><tr>";
                var i = 0;
                while (i < cyfry.length)
                {
                    html+="<td>"+cyfry[i]+"</td>";
                    ++i;
                }
                html += "</tr></table></td><td>" + pas + "</td><td>" + istn + "</td></tr>";

                el_lista_prob.innerHTML += html;
            }

            function Interakcja()
            {
                var tekst = el_cyfry.value;
                if (SprawdzPopr(tekst))
                {
                    var spr = Sprawdz(tekst);
                    WypiszProbe(proba_nr++, tekst, spr.pasujace, spr.istniejace);
                    el_cyfry.value = "";

                    if (spr.pasujace == il_cyfr && spr.istniejace == 0)
                        Wygrana();
                }
                else
                    Komunikat("komunikat", "Wprowadź tylko cyfry. Najlepiej żeby się nie powtarzały.", 3000);
            }

            function PokazStatus(s)
            {
                el_prosba.style.display = (s == status.w_toku ? "block" : "none");
                el_wygrana.style.display = (s == status.wygrana ? "block" : "none");
                el_przegrana.style.display = (s == status.przegrana ? "block" : "none");
            }

            function NowaGra()
            {
                var ok = false;
                if (proba_nr >= 1)
                    ok = confirm("Czy na pewno chcesz rozpocząć grę od nowa?");

                if (proba_nr == 0 || ok)
                    OdNowa();
            }

            function Rezygnacja()
            {
                if (proba_nr == 1)
                    alert("Ej, no weź! Jeszcze nie podjąłeś/łaś próby odgadnięcia, a ty już klikasz ten guzik.\n\n:|\n\nWstydź się!");
                else if (proba_nr > 1)
                {
                    var ok = confirm("Napewno wywieszasz białą flagę?");
                    if (ok)
                        Przegrana();
                }
            }

            function Wygrana(){ PokazStatus(status.wygrana); }

            function Przegrana()
            {
                el_rozwiazanie.innerHTML = rozw;
                proba_nr = 0;
                PokazStatus(status.przegrana);
            }

            function ZmianaIlCyfr() { Komunikat('komunikat','Zmiany zostaną zastosowane po kliknięciu "Nowa Gra"', 4000); }

            OdNowa();
        </script>
        <style>
            body {
                font-family: "Arial", "Verdana";
                text-align: center;
                margin: auto;
            }

            .tabela_cyfry, #tabela_prob { margin: auto; }

            .tabela_cyfry, #pole_cyfry, #rozwiazanie {
                font-family: "Courier New", "Tahoma";
                font-size: 25px;
                font-weight: bold;
            }

            #tabela_prob,
            .tabela_cyfry { border-collapse: collapse; }

            #tabela_prob th { font-size: 18px; }
            #tabela_prob td { font-size: 22px; }

            #tabela_prob th,
            #tabela_prob td,
            .tabela_cyfry td { border: 2px solid; padding: 5px;}

            .tabela_cyfry td { font-size: 25px !important; }
            #ramka_menu { display:inline;}
            #prosba_o_cyfry { padding-top: 5px; padding-bottom: 5px; }
            #wygrana { color: green; display: none; }
            #przegrana { color: red; display: none; }

            #rozwiazanie { background-color: red; color: white; }
            #l_cyfr { width: 30px; }

            #komunikat {
                border: 3px double;
                background-color: #fffac9;
                padding: 2px;
                display: none;
            }
        </style>
    </body>
</html>