MMProg: Praktikum: WiSe 2017/18: GameLoop01: Unterschied zwischen den Versionen

aus GlossarWiki, der Glossar-Datenbank der Fachhochschule Augsburg
Kowa (Diskussion | Beiträge)
Keine Bearbeitungszusammenfassung
Kowa (Diskussion | Beiträge)
Keine Bearbeitungszusammenfassung
Zeile 4: Zeile 4:
'''Musterlösung''': [https://glossar.hs-augsburg.de/beispiel/tutorium/es6/test/WK_Test01_babel/ SVN-Repository]
'''Musterlösung''': [https://glossar.hs-augsburg.de/beispiel/tutorium/es6/test/WK_Test01_babel/ SVN-Repository]
-->
-->
==Vorbereitung==


Im SVN-Repository finden Sie zwei WebStorm-Projekte zum Thema GameLoop:
Im SVN-Repository finden Sie zwei WebStorm-Projekte zum Thema GameLoop:
* [https://glossar.hs-augsburg.de/beispiel/tutorium/es6/game_loop/WK_GameLoop01/|WK_GameLoop01]
* [https://glossar.hs-augsburg.de/beispiel/tutorium/es6/game_loop/WK_GameLoop01/ WK_GameLoop01]
* [https://glossar.hs-augsburg.de/beispiel/tutorium/es6/game_loop/WK_GameLoop02/|WK_GameLoop02]
* [https://glossar.hs-augsburg.de/beispiel/tutorium/es6/game_loop/WK_GameLoop02/ WK_GameLoop02]


Sie können diese Projekte folgendermaßen auf Ihrem Rechner installieren:
Sie können diese Projekte folgendermaßen auf Ihrem Rechner installieren:
Zeile 15: Zeile 17:
* Klick auf die Pfeilspitze vor diesem Pfad → Klick auf die Pfeilspitze vor <code>game_loop</code> → Klick '''auf''' <code>WK_GameLoop01</code> bzw. <code>WK_GameLoop02</code>
* Klick auf die Pfeilspitze vor diesem Pfad → Klick auf die Pfeilspitze vor <code>game_loop</code> → Klick '''auf''' <code>WK_GameLoop01</code> bzw. <code>WK_GameLoop02</code>
* <code>Checkout</code>
* <code>Checkout</code>
* Speichern Sie das Projekt irgendwo auf Ihrem Rechner. '''Achtung''': Speichern Sie das PRojekt nicht innerhalb eines anderen Projektes oder innerhalb eines Ordners, der bereits unter SVN-Kontrolle steht.
* Speichern Sie das Projekt irgendwo auf Ihrem Rechner. '''Achtung''': Speichern Sie das Projekt nicht innerhalb eines anderen Projektes oder innerhalb eines Ordners, der bereits unter SVN-Kontrolle steht.
* Öffnen Sie das Projekt und geben Sie im WebStorm-Terminal <code>npm install</code> (oder kurz <code>npm i</code>) ein, um alle benötigten Node.js-Module zu installieren.
* Öffnen Sie das Projekt und geben Sie im WebStorm-Terminal <code>npm install</code> (oder kurz <code>npm i</code>) ein, um alle benötigten Node.js-Module zu installieren.


Zeile 28: Zeile 30:
stellt aber – im Gegensatz zu einigen Web-Anwendungen des ersten Projekt – bislang keine Informationen  
stellt aber – im Gegensatz zu einigen Web-Anwendungen des ersten Projekt – bislang keine Informationen  
über die aktuelle Frame-Rate bereit. Dies ist aber für diese Praktikumsaufgabe nicht von Interesse.
über die aktuelle Frame-Rate bereit. Dies ist aber für diese Praktikumsaufgabe nicht von Interesse.
==Aufgaben==
Laden Sie das leere Projekt [https://glossar.hs-augsburg.de/beispiel/tutorium/es6/empty/WK_GameLoop02_Empty WK_GameLoop02_Empty] auf IHren Rechner.
'''Installieren Sie diesmal aber nicht die Node.js-Module''', das machen Sie später. Sie finden das leere Projekt im zuvor aktivierten
Repository-Pfad <code>https://glossar.hs-augsburg.de/beispiel/tutorium/es6</code> im Unterordner <code>empty</code>.
Erstellen Sie ein neues Projekt <code>praktikum01</code> und kopieren Sie alle Dateien, die Sie im Projekt <code>WK_GameLoop02_Empty</code>
finden mittels <code>Crtl-/Apfel-C</code> <code>Crtl-/Apfel-V</code> in Ihr eigenes Projekt.


==Quellen==
==Quellen==

Version vom 26. Oktober 2017, 08:02 Uhr

Dieser Artikel erfüllt die GlossarWiki-Qualitätsanforderungen nur teilweise:

Korrektheit: 3
(zu größeren Teilen überprüft)
Umfang: 4
(unwichtige Fakten fehlen)
Quellenangaben: 3
(wichtige Quellen vorhanden)
Quellenarten: 5
(ausgezeichnet)
Konformität: 3
(gut)

MMProg-Praktikum

Inhalt | Game Loop 01 | Ball 02 | Ball 03 | Ball 03b | Pong 01


Vorbereitung

Im SVN-Repository finden Sie zwei WebStorm-Projekte zum Thema GameLoop:

Sie können diese Projekte folgendermaßen auf Ihrem Rechner installieren:

  • VCSCheckout from Version ControlSubversion
  • Sofern noch nicht geschehen: Klick auf das grüne Plus-Symbol → Repository URL: https://glossar.hs-augsburg.de/beispiel/tutorium/es6
  • Klick auf die Pfeilspitze vor diesem Pfad → Klick auf die Pfeilspitze vor game_loop → Klick auf WK_GameLoop01 bzw. WK_GameLoop02
  • Checkout
  • Speichern Sie das Projekt irgendwo auf Ihrem Rechner. Achtung: Speichern Sie das Projekt nicht innerhalb eines anderen Projektes oder innerhalb eines Ordners, der bereits unter SVN-Kontrolle steht.
  • Öffnen Sie das Projekt und geben Sie im WebStorm-Terminal npm install (oder kurz npm i) ein, um alle benötigten Node.js-Module zu installieren.

Machen Sie sich mit den Projekten vertraut. Die Web-Anwendung src/js/app des zweiten Projektes dient als Ausgangsbasis für diese Praktikumsaufgabe.

Im ersten Beispiel finden Sie diverse Game-Loop-Varianten. Schrittweise werden potentielle Probleme behoben. Dieses Projekt verfolgt das didaktische Ziel, Ihnen die Probleme und potentielle Lösungen im Zusammenhang mit JavaScript-Animationen zu verdeutlichen.

Im zweiten Beispiel wurde eine einfache Game-Loop-Klasse realisiert, die sie für dieses Praktikum nutzen können und sollten. Diese Klasse basiert auf den Ergebnissen des ersten Projektes, stellt aber – im Gegensatz zu einigen Web-Anwendungen des ersten Projekt – bislang keine Informationen über die aktuelle Frame-Rate bereit. Dies ist aber für diese Praktikumsaufgabe nicht von Interesse.

Aufgaben

Laden Sie das leere Projekt WK_GameLoop02_Empty auf IHren Rechner. Installieren Sie diesmal aber nicht die Node.js-Module, das machen Sie später. Sie finden das leere Projekt im zuvor aktivierten Repository-Pfad https://glossar.hs-augsburg.de/beispiel/tutorium/es6 im Unterordner empty.

Erstellen Sie ein neues Projekt praktikum01 und kopieren Sie alle Dateien, die Sie im Projekt WK_GameLoop02_Empty finden mittels Crtl-/Apfel-C Crtl-/Apfel-V in Ihr eigenes Projekt.


Quellen

  1. Kowarschick (MMProg): Wolfgang Kowarschick; Vorlesung „Multimedia-Programmierung“; Hochschule: Hochschule Augsburg; Adresse: Augsburg; Web-Link; 2018; Quellengüte: 3 (Vorlesung)