hledání min
1. hrací pole
- HTML - zakomponování JS a CSS souborů
- HTML - vytvoření tabulky
- CSS - velikost a pozadí pro buňku tabulky
- JS - generování jednotlivých buňek
spustit
2. generování min
- vždy vygeneruje 15 bomb, které se zobrazí jako o
- JS - vytvoření dvourozměrného pole
- JS - generování určitého počtu min
- JS - zobrazení hodnoty pole
spustit
3. výpočet hodnot buňek
- ukáže počet sousedů každého políčka
- JS - zobrazení počtu sousedů
- JS - do while ověřuje jestli se hodnota rovná bombě
spustit
4. odhalování políček
- ze začátku jsou všechna políčka schovaná
- po kliknutí se odkryje kliknuté políčko
- CSS - po najetí myší na políčko máme ukazující kurzor
- JS - po kliknutí ukáže hodnotu políčka
- JS - pokud nemá žádnou hodnotu zobrazí x
spustit
5. pokročilé odhalování políček
- po kliknutí na políčko bez hodnoty (bez sousedů) se odkryje celá prázdná oblast a čísla okolo ní
- odkrytá políčka mají jinou barvu
- CSS - nová třída pro odkrytá políčka
- JS - přidání třídy pro odkryté políčka
- JS - na políčku bez hodnoty se už neukazuje x
- JS - volání funkce show z funkce show
spustit
6. úprava vzhledu
- přidání obrázku pro minu
- barevné odlišení čísel
- CSS - centrování obsahu políček
- JS - zobrazovat
(https://cdn2.iconfinder.com/data/icons/font-awesome/1792/bomb-24.png) místo o
- JS - pole s barvami pro jednotlivé hodnoty
spustit
7. prohra
- po kliknutí na minu spustit funkci prohra
- funkce na zobrazení celého pole
- JS - funkce showAll odkryje všechna políčka
- JS - funkce prohra ukáže alert
spustit
8. výhra
- pokud je počet neodkrytých políček roven počtu min spustit funkci vyhra
- JS - celý obsah funkce show vsadíme do podmínky, kterou ověříme zda je kliknuté políčko odkryté
- JS - nastavíme počet zakrytých políček na size*size
- JS - při každém spuštěním snížíme počet zakrytých políček o 1
- JS - funkce vyhra ukáže alert
- JS - pro lehčí testování nastavíme počet min na 5
spustit
9. restart
- po pohře nebo výhře se nám ukáže tlačítko pro restart hry
- HTML - přidání elementů #prohra a #vyhra
- HTML - prázdný odkaz restart
- CSS - #prohra a #vyhra jsou ze začátku neviditelné
- JS - definování vyhraEl a prohraEl
- JS - po prohře nebo výhře zobrazit element místo alertu
spustit