Update code for Pyglet 2.0

#28

Author: encukou

Diff for: courses/pyladies.yml

@@ -122,9 +122,6 @@ sessions:
   materials:
   - lesson: intro/pyglet
   - lesson: projects/pong
-  - title: Kód celé hry Pong
-    type: link
-    url: http://pyladies.cz/v1/s012-pyglet/pong.py
   - title: Tahák na Pyglet
     url: https://pyvec.github.io/cheatsheets/pyglet/pyglet-basics-cs.pdf
     type: cheatsheet

Diff for: lessons/projects/asteroids/index.md

@@ -157,22 +157,15 @@ První krok bude naprogramovat vesmírnou loď, která půjde ovládat klávesni
   def draw():
       window.clear()
 
-      for x_offset in (-window.width, 0, window.width):
-          for y_offset in (-window.height, 0, window.height):
-              # Remember the current state
-              gl.glPushMatrix()
-              # Move everything drawn from now on by (x_offset, y_offset, 0)
-              gl.glTranslatef(x_offset, y_offset, 0)
-
-              # Draw
-              batch.draw()
-
-              # Restore remembered state (this cancels the glTranslatef)
-              gl.glPopMatrix()
+      for x_offset in (-window.width, window.width, 0):
+          for y_offset in (-window.height, window.height, 0):
+              # Set the view matrix to offset draws
+              matrix = pyglet.math.Mat4.from_translation(x_offset, y_offset, 0)
+              window.view = matrix
   ```
   Pro přehled, dokumentace k použitým funkcím je tady:
-  [glPushMatrix, glPopMatrix](https://www.opengl.org/sdk/docs/man2/xhtml/glPushMatrix.xml),
-  [glTranslatef](https://www.opengl.org/sdk/docs/man2/xhtml/glTranslate.xml).
+  [window.view](https://pyglet.readthedocs.io/en/latest/programming_guide/migration.html?highlight=matrix#window-projection-and-cameras),
+  [ Mat4](https://pyglet.readthedocs.io/en/latest/modules/math.html#pyglet.math.Mat4).
 
 Povedlo se? Můžeš létat vesmírem?
 Čas to všechno dát do Gitu!
@@ -230,26 +223,19 @@ Naše asteroidy jsou zatím docela neškodné. Pojďme to změnit.
   Každý objekt bude potřebovat mít poloměr – atribut `radius`.
 * Aby bylo vidět co si hra o objektech „myslí”,
   nakresli si nad každým objektem příslušné kolečko.
-  Nejlepší je to udělat pomocí
-  [pyglet.gl](http://pyglet.readthedocs.org/en/latest/programming_guide/gl.html)
-  a trochy matematiky; pro teď si jen opiš funkci
-  `draw_circle` a pro každý objekt ji zavolej.
-  Až to bude všechno fungovat, můžeš funkci dát pryč.
+  Pyglet na to má třídu `Circle` v modulu
+  [`pyglet.shapes`](https://pyglet.readthedocs.io/en/latest/programming_guide/shapes.html):
 
   ```python
   def draw_circle(x, y, radius):
-      iterations = 20
-      s = math.sin(2*math.pi / iterations)
-      c = math.cos(2*math.pi / iterations)
-
-      dx, dy = radius, 0
-
-      gl.glBegin(gl.GL_LINE_STRIP)
-      for i in range(iterations+1):
-          gl.glVertex2f(x+dx, y+dy)
-          dx, dy = (dx*c - dy*s), (dy*c + dx*s)
-      gl.glEnd()
+      circle = shapes.Circle(x=x, y=y, radius=radius)
+      circle.opacity = 120  # (ne)průhlednost, od 0 (průhledné) do 255 (plné)
+      circle.draw()
   ```
+  Pro zrychlení můžeš kolečka přidat do `batch` a vykreslovat společně se
+  zbytkem vesmíru.
+
+  Až to bude všechno fungovat, můžeš kolečka dát pryč.
 * Když asteroid narazí do lodi, loď exploduje a zmizí.
   Explozi necháme na později, teď je důležité odebrání objektu ze hry.
   Dej ho do metody `SpaceObject.delete`,

Diff for: lessons/projects/pong/index.md

@@ -112,35 +112,33 @@ ploše.
 
 Většina z tvarů jsou obdélníky, takže nejprve
 navrhněme funkci `nakresli_obdelnik`, která
-dostane čtveřici souřadnic a pomocí modulu `gl`
-z Pygletu vykreslí čtverec pomocí 2 trojúhelníků.
+dostane souřadnice a velikost obdélníku a vykreslí ho.
+Na to má pyglet v modulu `pyglet.shapes` třídu `Rectangle`,
+která se používá následovně:
 
 ```python
 from pyglet import gl
 ...
-def nakresli_obdelnik(x1, y1, x2, y2):
-    """Nakresli obdelnik na dane souradnice
+def nakresli_obdelnik(x, y, sirka, vyska):
+    """Nakresli obdelnik na danych souradnicich
 
     Nazorny diagram::
 
-         y2 - +-----+
-              |/////|
-         y1 - +-----+
-              :     :
-             x1    x2
+                sirka (velikost v ose X)
+              |<------>|
+
+              +--------+     -
+              |KRESLIME|     ^
+              |*TENHLE*|     | vyska (velikost v ose Y)
+              |OBDELNIK|     v
+          y - +--------+     -
+              :
+              x
     """
-    # Tady pouzijeme volani OpenGL, ktere je pro nas zatim asi nejjednodussi
-    # na pouziti
-    gl.glBegin(gl.GL_TRIANGLE_FAN)   # zacni kreslit spojene trojuhelniky
-    gl.glVertex2f(int(x1), int(y1))  # vrchol A
-    gl.glVertex2f(int(x1), int(y2))  # vrchol B
-    gl.glVertex2f(int(x2), int(y2))  # vrchol C, nakresli trojuhelnik ABC
-    gl.glVertex2f(int(x2), int(y1))  # vrchol D, nakresli trojuhelnik BCD
-    # dalsi souradnice E by nakreslila trojuhelnik CDE, atd.
-    gl.glEnd()  # ukonci kresleni trojuhelniku
+    obdelnik = pyglet.shapes.Rectangle(x=x, y=y, width=sirka, height=vyska)
+    obdelnik.draw()
 ```
 
-
 Teď začneme pracovat na funkci `vykresli()`
 Nejprve ji vytvoř prázdnou a zaregistruj ji
 v Pygletu na událost `on_draw`, jak jsme to
@@ -155,8 +153,7 @@ grafických prvků.
 ...
 def vykresli():
     """Vykresli stav hry"""
-    gl.glClear(gl.GL_COLOR_BUFFER_BIT)  # smaz obsah okna (vybarvi na cerno)
-    gl.glColor3f(1, 1, 1)  # nastav barvu kresleni na bilou
+    window.clear()  # smaz obsah okna (vybarvi na cerno)
 
 window = pyglet.window.Window(width=SIRKA, height=VYSKA)
 window.push_handlers(
@@ -173,18 +170,17 @@ vykreslení `míčku` na správné pozici,
 kterou získáš z příslušné globální proměnné. Míček je
 v našem případě jen malý čtvereček jehož velikost
 máme uloženou v konstantě.
+Pozor na to, že `pozice_mice` určuje *střed* míčku, ne roh.
 
 {% filter solution %}
 ```python
 def vykresli():
     ...
-    # Vykresleni micku
     nakresli_obdelnik(
         pozice_mice[0] - VELIKOST_MICE // 2,
         pozice_mice[1] - VELIKOST_MICE // 2,
-        pozice_mice[0] + VELIKOST_MICE // 2,
-        pozice_mice[1] + VELIKOST_MICE // 2,
-    )
+        VELIKOST_MICE,
+        VELIKOST_MICE)
 ```
 {% endfilter %}
 
@@ -198,18 +194,21 @@ správně a na správném místě? Princip určení souřadnic
 je podobný jako u vykreslení míčku.
 
 {% filter solution %}
+Existuje víc řešení.
+Třeba se vykreslit obdélník dvojnásobnou šířkou, ale na hraně okna takže
+ho bude vidět jen půl:
+
 ```python
 def vykresli():
     ...
-    # palky - udelame si seznam souradnic palek a pro kazdou dvojici souradnic
+    # palky - udelame si seznam souradnic palek, a pro kazdou dvojici souradnic
     # v tom seznamu palku vykreslime
-    for x, y in [(0, pozice_palek[0]), (SIRKA, pozice_palek[1])]:
+    for x, y in [(0, pozice_palek[0]), (SIRKA, pozice_palek[1])] :
         nakresli_obdelnik(
             x - TLOUSTKA_PALKY,
             y - DELKA_PALKY // 2,
-            x + TLOUSTKA_PALKY,
-            y + DELKA_PALKY // 2,
-        )
+            TLOUSTKA_PALKY * 2,
+            DELKA_PALKY)
 ```
 {% endfilter %}
 
@@ -220,7 +219,7 @@ Namalujme ji jako sérii obdélníčků táhnoucích se odshora
 dolů. Chce to jen vygenerovat seznam souřadnic,
 které budou mít dostatečné rozestupy, a na každé
 z nich vykreslit obdélníček. Kterou funkci z Pythonu
-bys použila na získání tohoto seznamu souřadnic?
+bys použil{{a}} na získání tohoto seznamu souřadnic?
 
 {% filter solution %}
 ```python
@@ -231,9 +230,8 @@ def vykresli():
         nakresli_obdelnik(
             SIRKA // 2 - 1,
             y,
-            SIRKA // 2 + 1,
-            y + DELKA_PULICI_CARKY
-        )
+            2,
+            DELKA_PULICI_CARKY)
 ```
 {% endfilter %}
 
@@ -244,11 +242,7 @@ objekt `Label` (Nápis). Ten se hodí k vykreslení hodnoty
 skóre. Objekt musíme nejdřív vytvořit. To uděláme
 kulatými závorkami za jménem objektu, jako bychom
 volali funkci, a uložíme si ho do proměnné:
-`napis = Label()`. Normálně bychom objekt
-vytvořili jen jednou a pak měnili jeho hodnotu, ale
-pro jednoduchost vytvoříme vždy nový a celé to zabalíme
-do funkce. V jejím závěru musíme na nadpisu zavolat
-metodu `draw()`, jinak se nápis nevykreslí.
+`napis = Label()`.
 
 ```python
 def nakresli_text(text, x, y, pozice_x):
@@ -578,3 +572,6 @@ def obnov_stav(dt):
 Hurá, prokousali jsme se k zdárnému konci Pongu!
 Máš teď plně funkční interaktivní grafickou
 hru zakládající se na reálné předloze. :)
+
+Můžeš si stáhnout [celý kód hry]({{ static('pong.py') }})
+a porovnat ho se svým řešením.