HTML5-Tutorium: Canvas: MiniPong - Versionsgeschichte

Kowa am 23. Oktober 2018 um 08:35 Uhr

2018-10-23T08:35:52Z

← Nächstältere Version		Version vom 23. Oktober 2018, 08:35 Uhr
Zeile 32:		Zeile 32:
	Bewegungsrichtung und Geschwindigkeit des Schlägers abgelenkt.		Bewegungsrichtung und Geschwindigkeit des Schlägers abgelenkt.

			<!--
	==Tutorium==		==Tutorium==
	# [[HTML5-Tutorium: Canvas: MiniPong 01\|Teil 1]]: Ball-Animation		# [[HTML5-Tutorium: Canvas: MiniPong 01\|Teil 1]]: Ball-Animation
Zeile 37:		Zeile 38:
	# [[HTML5-Tutorium: Canvas: MiniPong 03\|Teil 3]]: Bewegung des Schlägers		# [[HTML5-Tutorium: Canvas: MiniPong 03\|Teil 3]]: Bewegung des Schlägers
	# [[HTML5-Tutorium: Canvas: MiniPong 04\|Teil 4]]: Die vollständige Anwendung		# [[HTML5-Tutorium: Canvas: MiniPong 04\|Teil 4]]: Die vollständige Anwendung
			-->
	==Quellen==		==Quellen==
	<references/>		<references/>

Kowa am 1. Dezember 2016 um 16:12 Uhr

2016-12-01T16:12:04Z

← Nächstältere Version		Version vom 1. Dezember 2016, 16:12 Uhr
Zeile 42:		Zeile 42:
	<ol start="2">		<ol start="2">
	<li>{{Quelle\|Kowarschick, W.: Multimedia-Programmierung}}</li>		<li>{{Quelle\|Kowarschick, W.: Multimedia-Programmierung}}</li>
	<li>[http://glossar.hs-augsburg.de/beispiel/tutorium/~~html5_canvas~~/minipong/ Musterlösungen]</li>		<li>[http://glossar.hs-augsburg.de/beispiel/tutorium/es5/minipong/ Musterlösungen]</li>
	</ol>		</ol>
	[[Kategorie: HTML5-Tutorium: Canvas: MiniPong]][[Kategorie: HTML5-Beispiel]][[Kategorie:Kapitel:Multimedia-Programmierung:Beispiele]]		[[Kategorie: HTML5-Tutorium: Canvas: MiniPong]][[Kategorie: HTML5-Beispiel]][[Kategorie:Kapitel:Multimedia-Programmierung:Beispiele]]

Kowa am 1. Dezember 2016 um 16:11 Uhr

2016-12-01T16:11:20Z

← Nächstältere Version		Version vom 1. Dezember 2016, 16:11 Uhr
Zeile 36:		Zeile 36:
	# [[HTML5-Tutorium: Canvas: MiniPong 02\|Teil 2]]: Optimierungen der Ball-Animation		# [[HTML5-Tutorium: Canvas: MiniPong 02\|Teil 2]]: Optimierungen der Ball-Animation
	# [[HTML5-Tutorium: Canvas: MiniPong 03\|Teil 3]]: Bewegung des Schlägers		# [[HTML5-Tutorium: Canvas: MiniPong 03\|Teil 3]]: Bewegung des Schlägers
	# ~~<!--~~[[HTML5-Tutorium: Canvas: MiniPong 04\|Teil 4]]~~-->Teil 4~~: Die vollständige Anwendung		# [[HTML5-Tutorium: Canvas: MiniPong 04\|Teil 4]]: Die vollständige Anwendung

	==Quellen==		==Quellen==

Kowa am 30. November 2016 um 12:24 Uhr

2016-11-30T12:24:50Z

← Nächstältere Version		Version vom 30. November 2016, 12:24 Uhr
Zeile 10:		Zeile 10:

	===Use Cases===		===Use Cases===
	[[Datei:MiniPong04 ~~Use Cases~~.png\|ohne\|882px\|Use Cases der Tutoriums-Anwendung <code>MiniPong</code>]]		[[Datei:MiniPong04 UseCases.png\|ohne\|882px\|Use Cases der Tutoriums-Anwendung <code>MiniPong</code>]]
	Ein Spieler kann das Spiel starten (Startknopf) und vorzeitig		Ein Spieler kann das Spiel starten (Startknopf) und vorzeitig
	beenden (Stopp-Knopf). Nach Spielstart kann der Spieler den Schläger		beenden (Stopp-Knopf). Nach Spielstart kann der Spieler den Schläger

Kowa: /* Use Cases */

2016-11-29T13:15:06Z

Use Cases

← Nächstältere Version		Version vom 29. November 2016, 13:15 Uhr
Zeile 14:		Zeile 14:
	beenden (Stopp-Knopf). Nach Spielstart kann der Spieler den Schläger		beenden (Stopp-Knopf). Nach Spielstart kann der Spieler den Schläger
	am unteren Rand des Spielfeldes mit Hilfe der Richtungstasten des		am unteren Rand des Spielfeldes mit Hilfe der Richtungstasten des
	Keyboards~~, mit Hilfe der Kippsensoren eines Smartphones, mit Hilfe~~		Keyboards nach links und rechts bewegen. (Auch andere Sensoren könnten zur Steuerung
	~~von Touch-Events etc.~~ nach links und rechts bewegen.		des Spiels verwendet werden, wie beispielsweise die Kippsensoren oder der Touchscreen eines Smartphones)

	Nachdem das Spiel gestartet wurde, bewegt sich ~~außerdem~~		Nachdem das Spiel gestartet wurde, bewegt sich
	der Ball geradlinig im Spielfeld, wobei die Startrichtung zufällig		der Ball geradlinig im Spielfeld, wobei die Startrichtung zufällig
	gewählt wird. Kollisionen mit der linken, oberen oder		gewählt wird. Kollisionen mit der linken, oberen oder

Kowa: /* Use Cases */

2016-11-29T12:02:12Z

Use Cases

← Nächstältere Version		Version vom 29. November 2016, 12:02 Uhr
Zeile 10:		Zeile 10:

	===Use Cases===		===Use Cases===
	[[Datei:~~MiniPongUseCases~~.png~~\|miniatur~~\|ohne\|~~924px~~\|Use Cases der Tutoriums-Anwendung <code>MiniPong</code>]]		[[Datei:MiniPong04 Use Cases.png\|ohne\|882px\|Use Cases der Tutoriums-Anwendung <code>MiniPong</code>]]
	Ein Spieler kann das Spiel starten (Startknopf) und vorzeitig		Ein Spieler kann das Spiel starten (Startknopf) und vorzeitig
	beenden (Stopp-Knopf). Nach Spielstart kann der Spieler den Schläger		beenden (Stopp-Knopf). Nach Spielstart kann der Spieler den Schläger

Kowa: /* Tutorium */

2016-11-09T09:53:46Z

Tutorium

← Nächstältere Version		Version vom 9. November 2016, 09:53 Uhr
Zeile 35:		Zeile 35:
	# [[HTML5-Tutorium: Canvas: MiniPong 01\|Teil 1]]: Ball-Animation		# [[HTML5-Tutorium: Canvas: MiniPong 01\|Teil 1]]: Ball-Animation
	# [[HTML5-Tutorium: Canvas: MiniPong 02\|Teil 2]]: Optimierungen der Ball-Animation		# [[HTML5-Tutorium: Canvas: MiniPong 02\|Teil 2]]: Optimierungen der Ball-Animation
			# [[HTML5-Tutorium: Canvas: MiniPong 03\|Teil 3]]: Bewegung des Schlägers
	# <!--[[HTML5-Tutorium: Canvas: MiniPong 04\|Teil 4]]-->Teil 4: Die vollständige Anwendung		# <!--[[HTML5-Tutorium: Canvas: MiniPong 04\|Teil 4]]-->Teil 4: Die vollständige Anwendung

Kowa: /* Tutorium */

2016-11-09T09:53:10Z

Tutorium

← Nächstältere Version		Version vom 9. November 2016, 09:53 Uhr
Zeile 34:		Zeile 34:
	==Tutorium==		==Tutorium==
	# [[HTML5-Tutorium: Canvas: MiniPong 01\|Teil 1]]: Ball-Animation		# [[HTML5-Tutorium: Canvas: MiniPong 01\|Teil 1]]: Ball-Animation
	# ~~<!--~~[[HTML5-Tutorium: Canvas: MiniPong 02\|Teil 2]]-~~->Teil 2: Bewegung des Schlägers~~		# [[HTML5-Tutorium: Canvas: MiniPong 02\|Teil 2]]: Optimierungen der Ball-Animation
	# <!--[[HTML5-Tutorium: Canvas: MiniPong 03\|Teil 3]]-->Teil 3: Die vollständige Anwendung		# <!--[[HTML5-Tutorium: Canvas: MiniPong 04\|Teil 4]]-->Teil 4: Die vollständige Anwendung

	==Quellen==		==Quellen==

Kowa am 27. Oktober 2016 um 08:14 Uhr

2016-10-27T08:14:30Z

← Nächstältere Version		Version vom 27. Oktober 2016, 08:14 Uhr
Zeile 6:		Zeile 6:
	==Ziel==		==Ziel==
	In diesem Tutorium wird beschrieben, wie man in [[HTML5]] eine kleine interaktive Multimedia-Anwendungen mit Hilfe		In diesem Tutorium wird beschrieben, wie man in [[HTML5]] eine kleine interaktive Multimedia-Anwendungen mit Hilfe
	von [[JavaScript]] sowie [[Canvas (HTML5)\|Canvas]] erstellt. Das Tutorium basiert auf einen ~~Minipong~~-Tutorium von		von [[JavaScript]] sowie [[Canvas (HTML5)\|Canvas]] erstellt. Das Tutorium basiert auf einen MiniPong-Tutorium von
	Herbert Braun<ref>{{Quelle\|Braun, H. (2011): Webanimationen mit Canvas}}</ref>.		Herbert Braun<ref>{{Quelle\|Braun, H. (2011): Webanimationen mit Canvas}}</ref>.

	===Use Cases===		===Use Cases===
	[[Datei:MiniPongUseCases.png\|miniatur\|ohne\|924px\|Use Cases der Tutoriums-Anwendung <code>~~Minipong~~</code>]]		[[Datei:MiniPongUseCases.png\|miniatur\|ohne\|924px\|Use Cases der Tutoriums-Anwendung <code>MiniPong</code>]]
	Ein Spieler kann das Spiel starten (Startknopf) und vorzeitig		Ein Spieler kann das Spiel starten (Startknopf) und vorzeitig
	beenden (~~Stopknopf~~). Nach Spielstart kann der Spieler den Schläger		beenden (Stopp-Knopf). Nach Spielstart kann der Spieler den Schläger
	am unteren Rand des Spielfeldes mit Hilfe der Richtungstasten des		am unteren Rand des Spielfeldes mit Hilfe der Richtungstasten des
	Keyboards, mit Hilfe der Kippsensoren eines Smartphones, mit Hilfe		Keyboards, mit Hilfe der Kippsensoren eines Smartphones, mit Hilfe
Zeile 21:		Zeile 21:
	gewählt wird. Kollisionen mit der linken, oberen oder		gewählt wird. Kollisionen mit der linken, oberen oder
	rechten Wand haben eine Richtungsänderung des Balls		rechten Wand haben eine Richtungsänderung des Balls
	zur Folge (Einfallswinkel = ~~Ausfallswinkel~~).		zur Folge (Einfallswinkel = Ausfallwinkel).
	Eine Kollision mit der unteren Wand beendet das Spiel.		Eine Kollision mit der unteren Wand beendet das Spiel.

	Ziel des Spiels sind möglichst viele Kollision des Balls mit		Ziel des Spiels sind möglichst viele Kollision des Balls mit
	dem Schläger. Eine derartige Kollision hat eine Richtungsänderung		dem Schläger. Eine derartige Kollision hat eine Richtungsänderung
	sowie einen Punktgewinn zur Folge. Der aktuelle ~~Puktestand~~ (Score)		sowie einen Punktgewinn zur Folge. Der aktuelle Punktestand (Score)
	wird der Benutzer jederzeit angezeigt.		wird der Benutzer jederzeit angezeigt.

Zeile 34:		Zeile 34:
	==Tutorium==		==Tutorium==
	# [[HTML5-Tutorium: Canvas: MiniPong 01\|Teil 1]]: Ball-Animation		# [[HTML5-Tutorium: Canvas: MiniPong 01\|Teil 1]]: Ball-Animation
	# [[HTML5-Tutorium: Canvas: MiniPong 02\|Teil 2]]: Bewegung des Schlägers		# <!--[[HTML5-Tutorium: Canvas: MiniPong 02\|Teil 2]]-->Teil 2: Bewegung des Schlägers
	# [[HTML5-Tutorium: Canvas: MiniPong 03\|Teil 3]]~~: MiniPong mittels einer „Moloch~~-~~Datei“~~		# <!--[[HTML5-Tutorium: Canvas: MiniPong 03\|Teil 3]]-->Teil 3: Die vollständige Anwendung
	~~# [[HTML5~~-~~Tutorium: Canvas: MiniPong 04\|~~Teil ~~4]]~~: ~~MiniPong mittels „JavaScript-Klassen“~~

	==Quellen==		==Quellen==

Kowa am 8. September 2016 um 13:18 Uhr

2016-09-08T13:18:16Z

← Nächstältere Version		Version vom 8. September 2016, 13:18 Uhr
Zeile 1:		Zeile 1:
	{{HTML5-Tutorium:Canvas:MiniPong:Menü}}		{{HTML5-Tutorium:Canvas:MiniPong:Menü}}
	=Voraussetzung=		==Voraussetzung==

	Sie sollten die Inhalte des Tutoriums [[HTML5-Tutorium: Canvas: Hello World]] kennen.		Sie sollten die Inhalte des Tutoriums [[HTML5-Tutorium: Canvas: Hello World]] kennen.

	=Ziel=		==Ziel==
	In diesem Tutorium wird beschrieben, wie man in [[HTML5]] eine kleine interaktive Multimedia-Anwendungen mit Hilfe		In diesem Tutorium wird beschrieben, wie man in [[HTML5]] eine kleine interaktive Multimedia-Anwendungen mit Hilfe
	von [[JavaScript]] sowie [[Canvas (HTML5)\|Canvas]] erstellt. Das Tutorium basiert auf einen Minipong-Tutorium von		von [[JavaScript]] sowie [[Canvas (HTML5)\|Canvas]] erstellt. Das Tutorium basiert auf einen Minipong-Tutorium von
	Herbert Braun<ref>{{Quelle\|Braun, H. (2011): Webanimationen mit Canvas}}</ref>.		Herbert Braun<ref>{{Quelle\|Braun, H. (2011): Webanimationen mit Canvas}}</ref>.

	==Use Cases==		===Use Cases===
	[[Datei:MiniPongUseCases.png\|miniatur\|ohne\|924px\|Use Cases der Tutoriums-Anwendung <code>Minipong</code>]]		[[Datei:MiniPongUseCases.png\|miniatur\|ohne\|924px\|Use Cases der Tutoriums-Anwendung <code>Minipong</code>]]
	Ein Spieler kann das Spiel starten (Startknopf) und vorzeitig		Ein Spieler kann das Spiel starten (Startknopf) und vorzeitig
Zeile 32:		Zeile 32:
	Bewegungsrichtung und Geschwindigkeit des Schlägers abgelenkt.		Bewegungsrichtung und Geschwindigkeit des Schlägers abgelenkt.

	=Tutorium=		==Tutorium==
	# [[HTML5-Tutorium: Canvas: MiniPong 01\|Teil 1]]: Ball-Animation		# [[HTML5-Tutorium: Canvas: MiniPong 01\|Teil 1]]: Ball-Animation
	# [[HTML5-Tutorium: Canvas: MiniPong 02\|Teil 2]]: Bewegung des Schlägers		# [[HTML5-Tutorium: Canvas: MiniPong 02\|Teil 2]]: Bewegung des Schlägers
Zeile 38:		Zeile 38:
	# [[HTML5-Tutorium: Canvas: MiniPong 04\|Teil 4]]: MiniPong mittels „JavaScript-Klassen“		# [[HTML5-Tutorium: Canvas: MiniPong 04\|Teil 4]]: MiniPong mittels „JavaScript-Klassen“

	=Quellen=		==Quellen==
	<references/>		<references/>
	<ol start="2">		<ol start="2">

← Nächstältere Version		Version vom 9. November 2016, 09:53 Uhr
Zeile 35:		Zeile 35:
	# [[HTML5-Tutorium: Canvas: MiniPong 01\|Teil 1]]: Ball-Animation		# [[HTML5-Tutorium: Canvas: MiniPong 01\|Teil 1]]: Ball-Animation
	# [[HTML5-Tutorium: Canvas: MiniPong 02\|Teil 2]]: Optimierungen der Ball-Animation		# [[HTML5-Tutorium: Canvas: MiniPong 02\|Teil 2]]: Optimierungen der Ball-Animation
			# [[HTML5-Tutorium: Canvas: MiniPong 03\|Teil 3]]: Bewegung des Schlägers
	# <!--[[HTML5-Tutorium: Canvas: MiniPong 04\|Teil 4]]-->Teil 4: Die vollständige Anwendung		# <!--[[HTML5-Tutorium: Canvas: MiniPong 04\|Teil 4]]-->Teil 4: Die vollständige Anwendung