//Toto je deník ze školního roku 2020/2021. Možná vás zajímá [[krouzek:denik|aktuální deník]], nebo jiný [[archiv:krouzek:deniky|archivní]].//

==== 23.září 2020 ====
  * Poučení o bezpečnosti a pravidlech
  * [[https://adasek.cz/js/doku.php?id=krouzek:osnova|Plán kroužku]]
  * Javascript v kontextu [[http://www.rosettacode.org/wiki/Rosetta_Code|jiných programovacích jazyků]]
  * Seznámení s účastníky
  * První seznámení s Javascriptem - v konzoli prohlížeče
  * Další zdroje: [[https://www.w3schools.com/js/default.asp|W3Schools]]

==== 30.září 2020 ====
  * [[html:lekce|HTML: lekce]]
  * [[krouzek:html_sablona|html šablona]]
  * [[https://validator.w3.org/]]

==== 7.října ====
  * //Koronavirové opatření, nekonáme se (zatím ani online)//
  * Zkuste si doma vytvořit html stránku, třeba s tématikou vašeho koníčku.
  * Použijte [[html:lekce|zápis z minula]], [[https://www.w3schools.com/html/|W3Schools/html]] a výslednou stránku si zkontrolujte [[https://validator.w3.org/|validátorem]]
  * S výsledkem se mi můžete pochlubit skrz email adam@adasek.cz


==== 14.října ====
  * //výuka proběhla na dálku//
  * CSS - kaskádové styly
  * {{ :krouzek:css_sablona.zip |testovací html soubor}}
  * [[https://developer.mozilla.org/en-US/docs/Web/CSS/Reference | CSS referenční seznam]]
  * Zápis CSS, základní selektory - ''%%tag%%'', ''%%.trida%%'', ''%%#identifikator%%''
  * CSS na textu: vlastnosti:
    * ''font-size'' (hodnoty např. ''%%45px%%'' nebo ''%%2em%%'')
    * ''font-family'' (např. ''%%"Times New Roman", Sans-Serif%%''
    * ''font-weight'' (např. ''%%bold%%'' nebo ''%%500%%'' nebo ''%%900%%'')
    * ''font-style'' (např. ''%%italic%%'')
    * ''color'' (např  ''%%#ff3300%%'' nebo ''%%red%%'' nebo ''%%rgb(255, 0 , 120)%%'')
    * ''text-align'' (např. ''%%left%%'' nebo ''%%center%%'')
    * ''text-decoration'' (např. ''%%underline%%'')
    * ''text-shadow'' (např ''%%#FC0 1px 0 10px;%%''


==== 21.října ====
  * //výuka proběhla na dálku// na Skypu
  * opakování z minula - [[https://adasek.cz/js/lib/exe/fetch.php?media=krouzek:web-cil.png|napodobte vzhled textu]]
  * blokové versus řádkové prvky (vlastnost ''display'':''block'' nebo ''inline'')
  * obtékání vlastností ''float'':''left'' nebo ''right'')
  * [[https://www.jakpsatweb.cz/css/position.html|CSS pozicování: vlastnost]]''position'', hodnoty ''%%normal%%'', ''%%relative%%'', ''%%absolute%%'', ''%%fixed%%''
  * Vlastnosti ''width'' (šířka), ''max-width'' (obdobně ''height'' a ''max-height''), délkové jednotky (''px'', ''em'', ''cm'', ''%'')
  * Jednoduchý klasický css layout se sloupečkem
  * Moderní webdesign: [[https://css-tricks.com/snippets/css/a-guide-to-flexbox/|Flexbox]], přizpůsobování různým displejům (testujte na mobilech!)

//28. října - státní svátek a podzimní prázdniny, nekonáme se//

==== 4.listopadu ====
  * //výuka proběhla na dálku// na Skypu
  * Práce s [[krouzek:html_sablona|html šablonou]]
  * CSS: opakování
  * Javascript ve stránce - první krůčky (funkce //alert//, //confirm//)

==== 11.listopadu ====
  * //na Skype//
  * Začneme se [[krouzek:sablona_formular|Šablona s formulářem]]
  * Přístup k html prvkům pomocí ''%%var prvek = document.getElementById("identifikator_prvku")%%''
  * Ovlivňování jejich stavu: ''%%prvek.value="abc"%%'' pro formulářové prvky, ''%%prvek.innerHTML="Hodnota <br>s html kódem"%%''
  * Cíl práce: na šabloně vytvořit jednoduchou **kalkulačku**

==== 18.listopadu ====
  * //na Skype//
  * podmíněný kód - ''%%if%%'' ''%%else%%'' ''%%else if%%''
  * [[krouzek:uloha:zviratka|úloha: zvířátka]]


==== 25.listopadu ====
  * //na Skype//
  * podmínky, logika
  * úvod do soustavy souřadné
  * [[krouzek:uloha:obrazovka2020|úloha: obrazovka]]

==== 2. prosince ====
  * //na Skype//
  * HTML element select
  * opakování: podmínky (if)
  * [[krouzek:uloha:vanocni_darky|úloha: vánoční dárky]]

==== 9. prosince ====
  * //na Skype//
  * Představení programovacích her:
    * [[https://www.codingame.com/]]
    * [[https://js.checkio.org/]]
    * [[https://alexnisnevich.github.io/untrusted/]]

==== 16. prosince ====
  * Cykly ''%%for%%'' a ''%%while%%''
    * úloha: řada násobků 3
    * úloha: rozbijte prohlížeč (nekonečný cyklus)
    * úloha: vygenerovat řadu: //mám 1 husu, 2 husy, 3 husy, 4 husy, 5 hus ...// (podmínky uvnitř cyklu)
    * úloha*: tabulka malé násobilky (vnořený for cyklus)

----
🎄👪🎄 //vánoční prázdniny// ❄️☃️🎁


==== 6. ledna ====
  * ''%%for%%'' cyklus
    * [[krouzek:uloha:prvociselnost|zjištění prvočíselnosti]] 

==== 13. ledna ====
  * pole (datová struktura), ''%%for%%'' cyklus
  * [[krouzek:uloha:hledani_maxima|Hledání maxima v poli]] 

==== 20. ledna ====
  * pole
  * [[krouzek:uloha:pole_hesel|Tajní agenti (pole hesel)]] 

==== 27. ledna ====
  * Řetězce (strings)

==== 3. února ====
  * [[krouzek:pole|Úloha: karty]] (pole)
 
==== 10. února ====
  * Od pole k objektům: [[krouzek:slovniky|úloha tramvaje]]

==== 17. února ====
  * [[krouzek:slovniky|Úloha tramvaje]]: Počítání pomocným polem (čárky)


==== 3. března ====
  * [[krouzek:objekty|Objekty]]



==== 10. března ====
  * [[krouzek:objekty_psi|Objekty: pejsci]]


==== 17. března ====
  * [[krouzek:auticko| úloha autíčko]]

==== 24. března ====
  * [[krouzek:auticko| úloha autíčko]] - odvození vzorečku pro otáčení autíčka

==== 31. března ====
  * [[krouzek:auticko| úloha autíčko]] - vstup z klávesnice

🎀🥚🐣 Velikonoční víkend 🍫🐇🎀

==== 7. dubna ====
  * [[krouzek:auticko_akcelerace| úloha autíčko]] - akcelerace
  * 
==== 14. dubna ====
  * [[krouzek:auticko_objekty| úloha autíčko]] - další objekty

==== 21. dubna ====
Suplování Martin

==== 28. dubna ====
  * [[krouzek:auticko_kolize| úloha autíčko]] - kolize

=== 5.května ===
  * [[krouzek:json| JSON]]

=== 12.května ===
  * JSON: pokračujte se [[krouzek:json| seznamem zastávek]] z minula, nebo si zkuste úlohu s [[krouzek:json_lexikon_zvirat|Lexikonem zvířat]]

=== 19.května ===
Úloha: [[krouzek:uloha:sirky|hra tahání zápalek]]

=== 26.května ===
Již ve stanici
  * JS DOM, [[uloha:element|Elementy]], [[uloha:removeChild|removeChid]]

=== 2.června ===
  * JS DOM: průchod stromem (HTML stránky) - rekurzivní

=== 9.června ===
  * Použití knihoven: Co je v programování knihovna?
  * Použití knihovny [[https://brm.io/matter-js/|Matter.js]] k simulování fyziky: {{ :krouzek:matter.zip |příklad}}.

=== 16.června ===
  * Knihovna [[https://brm.io/matter-js/|Matter.js]]: [[krouzek:arcade volleyball]]

=== 23.června ===
  * Knihovny: dokončení
  * Rekapitulace kroužku, rozloučení