Úloha 5 – Jednoduchá animace: pohyb čtverce

Úloha

Zadání (kontext úlohy):

Chceme vytvořit úplně jednoduchou animaci – čtverec, který se sám posouvá doprava.

Cíl úlohy:

Student si procvičí práci s requestAnimationFrame(), vymazání plátna (clearRect) a opakované vykreslování tvaru.

Vstupní podmínky:

Student pracuje pouze se souborem index.html. JavaScript bude ve <script> na konci stránky.

Požadovaný výstup:

• Na plátně se zleva doprava plynule pohybuje vyplněný čtverec.

• V každém snímku je plátno smazané a čtverec překreslený na nové pozici.

• Čtverec po dojetí na pravý okraj „zmizí“ (není nutný odraz).

Doplňující pokyny:

• Začni s malou rychlostí (např. +2 pixely na snímek).

• Pro mazání vždy používej clearRect(0, 0, canvas.width, canvas.height).