MMProg: Praktikum: WiSe 2017/18: GameLoop01 - Versionsgeschichte

Kowa am 1. März 2023 um 12:43 Uhr

2023-03-01T12:43:16Z

Kowa am 13. Dezember 2017 um 10:47 Uhr

2017-12-13T10:47:24Z

← Nächstältere Version		Version vom 13. Dezember 2017, 10:47 Uhr
Zeile 38:		Zeile 38:
	Erstellen Sie ein neues Projekt <code>praktikum01</code> und kopieren Sie die Ordner <code>src</code> und <code>web</code> (samt Inhalt)		Erstellen Sie ein neues Projekt <code>praktikum01</code> und kopieren Sie die Ordner <code>src</code> und <code>web</code> (samt Inhalt)
	sowie alle Dateien, die Sie im Wurzelverzeichnis des Projektes <code>WK_GameLoop02_Empty</code>		sowie alle Dateien, die Sie im Wurzelverzeichnis des Projektes <code>WK_GameLoop02_Empty</code>
	finden, mittels <code>~~Crtl~~-/Apfel-C</code> <code>~~Crtl~~-/Apfel-V</code> in Ihr eigenes Projekt. (Die Frage, ob WebStorm seinen eigenen File Watcher zum		finden, mittels <code>Ctrl-/Apfel-C</code> <code>Ctrl-/Apfel-V</code> in Ihr eigenes Projekt. (Die Frage, ob WebStorm seinen eigenen File Watcher zum
	Übersetzen von ES6-Code in ES5-Code verwenden soll, beantworten Sie bitte mit „No“. Das erledigt Webpack für Sie.)		Übersetzen von ES6-Code in ES5-Code verwenden soll, beantworten Sie bitte mit „No“. Das erledigt Webpack für Sie.)

Kowa am 17. November 2017 um 09:41 Uhr

2017-11-17T09:41:12Z

← Nächstältere Version		Version vom 17. November 2017, 09:41 Uhr
Zeile 40:		Zeile 40:
	finden, mittels <code>Crtl-/Apfel-C</code> <code>Crtl-/Apfel-V</code> in Ihr eigenes Projekt. (Die Frage, ob WebStorm seinen eigenen File Watcher zum		finden, mittels <code>Crtl-/Apfel-C</code> <code>Crtl-/Apfel-V</code> in Ihr eigenes Projekt. (Die Frage, ob WebStorm seinen eigenen File Watcher zum
	Übersetzen von ES6-Code in ES5-Code verwenden soll, beantworten Sie bitte mit „No“. Das erledigt Webpack für Sie.)		Übersetzen von ES6-Code in ES5-Code verwenden soll, beantworten Sie bitte mit „No“. Das erledigt Webpack für Sie.)

			Sie können Ihr Projekt zur Übung auch im Subversion-Repository speichern. Das ist aber nicht so wichtig.

	Nun können Sie in Ihrem eigenen Projekt die benötigten Node.js-Module installieren: <code>npm i</code>.		Nun können Sie in Ihrem eigenen Projekt die benötigten Node.js-Module installieren: <code>npm i</code>.

	~~Sie können Ihr Projekt zur Übung auch im Subversion-Repository speichern. Das ist aber nicht so wichtig.~~

	In Ihrem Projekt finden Sie nun 10 Web-Anwendungen vor: <code>index01.html</code> verwendet die gepackte Version von <code>app01.js</code>,		In Ihrem Projekt finden Sie nun 10 Web-Anwendungen vor: <code>index01.html</code> verwendet die gepackte Version von <code>app01.js</code>,

Kowa am 2. November 2017 um 17:02 Uhr

2017-11-02T17:02:12Z

← Nächstältere Version		Version vom 2. November 2017, 17:02 Uhr
Zeile 72:		Zeile 72:
	Aufgaben.		Aufgaben.

	Vergessen Sie <code>grunt</code> oder besser noch </code>grunt watch</code> nicht. :-)		Vergessen Sie <code>grunt</code> oder besser noch <code>grunt watch</code> nicht. :-)

	===Aufgabe 2===		===Aufgabe 2===

Kowa am 2. November 2017 um 16:58 Uhr

2017-11-02T16:58:18Z

← Nächstältere Version		Version vom 2. November 2017, 16:58 Uhr
Zeile 76:		Zeile 76:
	===Aufgabe 2===		===Aufgabe 2===

	Lassen Sie die Eule nicht waagerecht, sondern in der horizontalen Mitte des Browserfensters senkrecht von Fenstrrand zu ~~Festerrand~~ fliegen.		Lassen Sie die Eule nicht waagerecht, sondern in der horizontalen Mitte des Browserfensters senkrecht von Fenstrrand zu Fensterrand fliegen.

	Um die Aufgabe zu lösen, müssen Sie für die Eule zusätzlich eine y-Position und eine y-Geschwindigkeit definieren. Die Berechnung der aktuellen y-Position funktioniert		Um die Aufgabe zu lösen, müssen Sie für die Eule zusätzlich eine y-Position und eine y-Geschwindigkeit definieren. Die Berechnung der aktuellen y-Position funktioniert

Kowa am 2. November 2017 um 16:28 Uhr

2017-11-02T16:28:56Z

← Nächstältere Version		Version vom 2. November 2017, 16:28 Uhr
Zeile 38:		Zeile 38:
	Erstellen Sie ein neues Projekt <code>praktikum01</code> und kopieren Sie die Ordner <code>src</code> und <code>web</code> (samt Inhalt)		Erstellen Sie ein neues Projekt <code>praktikum01</code> und kopieren Sie die Ordner <code>src</code> und <code>web</code> (samt Inhalt)
	sowie alle Dateien, die Sie im Wurzelverzeichnis des Projektes <code>WK_GameLoop02_Empty</code>		sowie alle Dateien, die Sie im Wurzelverzeichnis des Projektes <code>WK_GameLoop02_Empty</code>
	finden mittels <code>Crtl-/Apfel-C</code> <code>Crtl-/Apfel-V</code> in Ihr eigenes Projekt. (Die Frage, ob WebStorm seinen eigenen File Watcher zum		finden, mittels <code>Crtl-/Apfel-C</code> <code>Crtl-/Apfel-V</code> in Ihr eigenes Projekt. (Die Frage, ob WebStorm seinen eigenen File Watcher zum
	Übersetzen von ES6-Code in ES5-Code verwenden soll, beantworten Sie bitte mit „No“. Das erledigt Webpack für Sie.)		Übersetzen von ES6-Code in ES5-Code verwenden soll, beantworten Sie bitte mit „No“. Das erledigt Webpack für Sie.)

Kowa am 2. November 2017 um 11:14 Uhr

2017-11-02T11:14:37Z

← Nächstältere Version		Version vom 2. November 2017, 11:14 Uhr
Zeile 76:		Zeile 76:
	===Aufgabe 2===		===Aufgabe 2===

	Lassen Sie die Eule nicht waagerecht, sondern in der horizontalen Mitte des ~~Browserfesnters~~ senkrecht von Fenstrrand zu Festerrand fliegen.		Lassen Sie die Eule nicht waagerecht, sondern in der horizontalen Mitte des Browserfensters senkrecht von Fenstrrand zu Festerrand fliegen.

	Um die Aufgabe zu lösen, müssen Sie für die Eule zusätzlich eine y-Position und eine y-Geschwindigkeit definieren. Die Berechnung der aktuellen y-Position funktioniert		Um die Aufgabe zu lösen, müssen Sie für die Eule zusätzlich eine y-Position und eine y-Geschwindigkeit definieren. Die Berechnung der aktuellen y-Position funktioniert

Kowa am 2. November 2017 um 07:04 Uhr

2017-11-02T07:04:21Z

← Nächstältere Version		Version vom 2. November 2017, 07:04 Uhr
Zeile 43:		Zeile 43:
	Nun können Sie in Ihrem eigenen Projekt die benötigten Node.js-Module installieren: <code>npm i</code>.		Nun können Sie in Ihrem eigenen Projekt die benötigten Node.js-Module installieren: <code>npm i</code>.

	Sie können Ihr Projekt zur Übung auch im Subversion-Repository speichern. Das ist aber ~~nit~~ so wichtig.		Sie können Ihr Projekt zur Übung auch im Subversion-Repository speichern. Das ist aber nicht so wichtig.

	In Ihrem Projekt finden Sie nun 10 Web-Anwendungen vor: <code>index01.html</code> verwendet die gepackte Version von <code>app01.js</code>,		In Ihrem Projekt finden Sie nun 10 Web-Anwendungen vor: <code>index01.html</code> verwendet die gepackte Version von <code>app01.js</code>,

Kowa am 1. November 2017 um 19:37 Uhr

2017-11-01T19:37:21Z

← Nächstältere Version		Version vom 1. November 2017, 19:37 Uhr
Zeile 1:		Zeile 1:
	{{MMProg:Praktikum:WiSe 2017/18:Menü}}		{{MMProg:Praktikum:WiSe 2017/18:Menü}}

	'''Musterlösung''': [https://glossar.hs-augsburg.de/beispiel/~~praktikum~~/~~2017wise~~/~~praktikum01~~/ SVN-Repository]		'''Musterlösung''': [https://glossar.hs-augsburg.de/beispiel/tutorium/es6/ball/WK_Ball01/ SVN-Repository]

	==Vorbereitung==		==Vorbereitung==

Kowa am 1. November 2017 um 18:35 Uhr

2017-11-01T18:35:28Z

← Nächstältere Version		Version vom 1. November 2017, 18:35 Uhr
Zeile 1:		Zeile 1:
	{{MMProg:Praktikum:WiSe 2017/18:Menü}}		{{MMProg:Praktikum:WiSe 2017/18:Menü}}

	'''Musterlösung''': [https://glossar.hs-augsburg.de/beispiel/praktikum/2017wise/praktikum01/ SVN-Repository]		'''Musterlösung''': [https://glossar.hs-augsburg.de/beispiel/praktikum/2017wise/praktikum01/ SVN-Repository]

← Nächstältere Version		Version vom 1. März 2023, 12:43 Uhr
Zeile 15:		Zeile 15:
	* Klick auf die Pfeilspitze vor diesem Pfad → Klick auf die Pfeilspitze vor <code>game_loop</code> → Klick '''auf''' <code>WK_GameLoop02</code>		* Klick auf die Pfeilspitze vor diesem Pfad → Klick auf die Pfeilspitze vor <code>game_loop</code> → Klick '''auf''' <code>WK_GameLoop02</code>
	* <code>Checkout</code> (<code>WK_GameLoop01</code> dient nur didaktischen Zwecken und wird für diese Praktikumsaufgabe nicht benötigt.)		* <code>Checkout</code> (<code>WK_GameLoop01</code> dient nur didaktischen Zwecken und wird für diese Praktikumsaufgabe nicht benötigt.)
	* Speichern Sie das Projekt irgendwo auf Ihrem Rechner. '''Achtung: Speichern Sie das Projekt nicht innerhalb eines anderen ~~Projektes~~ (insbesondere nicht in Ihrem neuen Projekt) oder innerhalb eines Ordners, der bereits unter SVN-Kontrolle steht. Speichern meine Projekte in einem ganz anderen Ordner, der {{zB}} <code>KowaBeispiele</code> heißen könnte.'''		* Speichern Sie das Projekt irgendwo auf Ihrem Rechner. '''Achtung: Speichern Sie das Projekt nicht innerhalb eines anderen Projekts (insbesondere nicht in Ihrem neuen Projekt) oder innerhalb eines Ordners, der bereits unter SVN-Kontrolle steht. Speichern meine Projekte in einem ganz anderen Ordner, der {{zB}} <code>KowaBeispiele</code> heißen könnte.'''
	* Ö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.

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

	Im ersten Beispiel finden Sie diverse Game-Loop-Varianten. Schrittweise werden potentielle		Im ersten Beispiel finden Sie diverse Game-Loop-Varianten. Schrittweise werden potentielle
Zeile 25:		Zeile 25:

	Im zweiten Beispiel wurde eine einfache Game-Loop-Klasse realisiert, die sie für dieses Praktikum		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~~,		nutzen können und sollten. Diese Klasse basiert auf den Ergebnissen des ersten Projekts,
	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.
Zeile 37:		Zeile 37:

	Erstellen Sie ein neues Projekt <code>praktikum01</code> und kopieren Sie die Ordner <code>src</code> und <code>web</code> (samt Inhalt)		Erstellen Sie ein neues Projekt <code>praktikum01</code> und kopieren Sie die Ordner <code>src</code> und <code>web</code> (samt Inhalt)
	sowie alle Dateien, die Sie im Wurzelverzeichnis des ~~Projektes~~ <code>WK_GameLoop02_Empty</code>		sowie alle Dateien, die Sie im Wurzelverzeichnis des Projekts <code>WK_GameLoop02_Empty</code>
	finden, mittels <code>Ctrl-/Apfel-C</code> <code>Ctrl-/Apfel-V</code> in Ihr eigenes Projekt. (Die Frage, ob WebStorm seinen eigenen File Watcher zum		finden, mittels <code>Ctrl-/Apfel-C</code> <code>Ctrl-/Apfel-V</code> in Ihr eigenes Projekt. (Die Frage, ob WebStorm seinen eigenen File Watcher zum
	Übersetzen von ES6-Code in ES5-Code verwenden soll, beantworten Sie bitte mit „No“. Das erledigt Webpack für Sie.)		Übersetzen von ES6-Code in ES5-Code verwenden soll, beantworten Sie bitte mit „No“. Das erledigt Webpack für Sie.)