Tutorial reversi - Historial de revisións

Tunnel assembler: /* Introduction */

2018-12-02T01:57:47Z

Introduction

← Revisión máis antiga		Revisión como estaba o 2 de decembro de 2018 ás 01:57
Liña 8:		Liña 8:
	* Know the [http://en.wikipedia.org/wiki/Reversi#Rules rules of Reversi].		* Know the [http://en.wikipedia.org/wiki/Reversi#Rules rules of Reversi].
	* Know the languages used on BGA: PHP, SQL, HTML, CSS, Javascript		* Know the languages used on BGA: PHP, SQL, HTML, CSS, Javascript
	* Setup ~~you~~ development environment [http://en.doc.boardgamearena.com/First_steps_with_BGA_Studio First Steps with BGA Studio]		* Setup your development environment [http://en.doc.boardgamearena.com/First_steps_with_BGA_Studio First Steps with BGA Studio]

	== Create your first game ==		== Create your first game ==

Liquiddivide: /* Create your first game */

2018-07-16T22:22:05Z

Create your first game

← Revisión máis antiga		Revisión como estaba o 16 de xullo de 2018 ás 22:22
Liña 12:		Liña 12:
	== Create your first game ==		== Create your first game ==

	With the initial skeleton of code provided initially, you can already start a game from the BGA Studio. For now, we are going to work with 1 player only. Most of the time ~~this~~ is simpler to proceed with only one player during the early phase of development of your game, as it's easy and fast to start/stop games.		With the initial skeleton of code provided initially, you can already start a game from the BGA Studio. For now, we are going to work with 1 player only. Most of the time it is simpler to proceed with only one player during the early phase of development of your game, as it's easy and fast to start/stop games.

	Thus, you can start a "Reversi" game, and arrive on a void, empty game. Yeah.		Thus, you can start a "Reversi" game, and arrive on a void, empty game. Yeah.

Liquiddivide: /* The game state machine */

2018-07-16T22:21:09Z

The game state machine

← Revisión máis antiga		Revisión como estaba o 16 de xullo de 2018 ás 22:21
Liña 303:		Liña 303:
	Now, let's stop our game again, because we are going to start the core game logic.		Now, let's stop our game again, because we are going to start the core game logic.

	You already read the "Focus on BGA game state machine", so you know that this is the heart of your game logic. For reversi, it's very simple ~~although~~. Here's a diagram of our game state machine:		You already read the "Focus on BGA game state machine", so you know that this is the heart of your game logic. For reversi, it's very simple. Here's a diagram of our game state machine:

	[[File:reversi6.jpg]]		[[File:reversi6.jpg]]

Morgalad o 13 de xuño de 2017 ás 10:55

2017-06-13T10:55:21Z

← Revisión máis antiga		Revisión como estaba o 13 de xuño de 2017 ás 10:55
Liña 730:		Liña 730:

	The list of the discs to be turned over has been made available by our server side code in "notif.args.turnedOver" (see previous paragraph). We loop through all these discs, and create a complex animation using dojo.Animation for each of them. The complete documentation on dojo animations [http://dojotoolkit.org/documentation/tutorials/1.6/animation/ can be found here].		The list of the discs to be turned over has been made available by our server side code in "notif.args.turnedOver" (see previous paragraph). We loop through all these discs, and create a complex animation using dojo.Animation for each of them. The complete documentation on dojo animations [http://dojotoolkit.org/documentation/tutorials/1.6/animation/ can be found here].

			And Also the notification to update the scores:

			<pre>
			notif_newScores: function( notif )
			{
			for( var player_id in notif.args.scores )
			{
			var newScore = notif.args.scores[ player_id ];
			this.scoreCtrl[ player_id ].toValue( newScore );
			}
			},
			</pre>


	In few words: we create a chain of 4 animations to make the disc fade out, fade in, fade out again, and fade in again. At the end of the second fade out, we change the color of the disc. Finally, we launch the animation with "play()".		In few words: we create a chain of 4 animations to make the disc fade out, fade in, fade out again, and fade in again. At the end of the second fade out, we change the color of the disc. Finally, we launch the animation with "play()".

Victoria la: /* Introduction */

2017-04-08T16:04:57Z

Introduction

← Revisión máis antiga		Revisión como estaba o 8 de abril de 2017 ás 16:04
Liña 7:		Liña 7:
	* Read the overall presentations of the BGA Framework ([[Studio\|see here]]).		* Read the overall presentations of the BGA Framework ([[Studio\|see here]]).
	* Know the [http://en.wikipedia.org/wiki/Reversi#Rules rules of Reversi].		* Know the [http://en.wikipedia.org/wiki/Reversi#Rules rules of Reversi].
	* Know the languages used on BGA: PHP, SQL, HTML, CSS, Javascript.		* Know the languages used on BGA: PHP, SQL, HTML, CSS, Javascript
			* Setup you development environment [http://en.doc.boardgamearena.com/First_steps_with_BGA_Studio First Steps with BGA Studio]

	== Create your first game ==		== Create your first game ==

Victoria la: Added missing instructions on putting tokens graphics in img

2016-05-04T02:24:05Z

Added missing instructions on putting tokens graphics in img

← Revisión máis antiga		Revisión como estaba o 4 de maio de 2016 ás 02:24
Liña 131:		Liña 131:

	[[File:tokens.png]]		[[File:tokens.png]]

			Upload this image file "tokens.png" in your "img/" directory.

	Important: we are using ONE file for both discs. It's really important that you use a minimum number of graphic files for your game with this "CSS sprite" technique, because it makes the game loading faster and more reliable. [http://www.w3schools.com/css/css_image_sprites.asp Read more about CSS sprites].		Important: we are using ONE file for both discs. It's really important that you use a minimum number of graphic files for your game with this "CSS sprite" technique, because it makes the game loading faster and more reliable. [http://www.w3schools.com/css/css_image_sprites.asp Read more about CSS sprites].
Liña 186:		Liña 188:
	At first, with "dojo.place" and "this.format_block" methods, we create a HTML piece of code and insert it as a new child of "tokens" div element.		At first, with "dojo.place" and "this.format_block" methods, we create a HTML piece of code and insert it as a new child of "tokens" div element.

	Then, with BGA "this.placeOnObject" method, we place this element over the panel of some player. Immediately after, using BGA "this.~~slidetoObject~~" method, we make the disc slide to the "square" element, its final destination.		Then, with BGA "this.placeOnObject" method, we place this element over the panel of some player. Immediately after, using BGA "this.slideToObject" method, we make the disc slide to the "square" element, its final destination.

	Note: don't forget to call the "play()", otherwise the token remains at its original location.		Note: don't forget to call the "play()", otherwise the token remains at its original location.

Skyfire815: /* The discs */

2016-01-16T04:09:19Z

The discs

← Revisión máis antiga		Revisión como estaba o 16 de xaneiro de 2016 ás 04:09
Liña 197:		Liña 197:
	</pre>		</pre>

	Now, to test if everything works fine, just add "this.addTokenOnBoard( 2, 2, ~~<your_player_id>~~ )" in the "setup" Javascript method in reversi.js, and reload the page.		Now, to test if everything works fine, just add "this.addTokenOnBoard( 2, 2, [player_id] )" in the "setup" Javascript method in reversi.js, and reload the page.

	~~'''Note''': ''your_player_id'' can be found by... ''someone who knows please edit''~~

Gmc14 o 11 de outubro de 2015 ás 12:32

2015-10-11T12:32:55Z

← Revisión máis antiga		Revisión como estaba o 11 de outubro de 2015 ás 12:32
Liña 197:		Liña 197:
	</pre>		</pre>

	Now, to test if everything works fine, just ~~call~~ "this.addTokenOnBoard( 2, 2, <your_player_id> )" in ~~your~~ "setup" Javascript method, and reload the page. A token should appear and slide immediately to its position, like this:		Now, to test if everything works fine, just add "this.addTokenOnBoard( 2, 2, <your_player_id> )" in the "setup" Javascript method in reversi.js, and reload the page.

			'''Note''': ''your_player_id'' can be found by... ''someone who knows please edit''


			A token should appear and slide immediately to its position, like this:

	[[File:reversi3.jpg]]		[[File:reversi3.jpg]]

Wucnuc o 9 de maio de 2015 ás 20:00

2015-05-09T20:00:48Z

← Revisión máis antiga		Revisión como estaba o 9 de maio de 2015 ás 20:00
Liña 605:		Liña 605:

	... finally, we jump to the next game state if everything goes fine ('playDisc' is also the name of a transition in the 'playerTurn' game state description above).		... finally, we jump to the next game state if everything goes fine ('playDisc' is also the name of a transition in the 'playerTurn' game state description above).
	To make the statistics work, we have to initialize them in ~~state~~.inc.php:		To make the statistics work, we have to initialize them in stats.inc.php:

	<pre>		<pre>

Christopheryoder: /* Let's play */

2015-02-05T19:36:23Z

Let's play

← Revisión máis antiga		Revisión como estaba o 5 de febreiro de 2015 ás 19:36
Liña 494:		Liña 494:
	* Finally, we make a call to the server using BGA "ajaxcall" method with argument x and y.		* Finally, we make a call to the server using BGA "ajaxcall" method with argument x and y.

	Now, we have to manage this "playDisc" action on server side. At first, we introduce a "playDisc" entry point in our "reversi.action.php":		Now, we have to manage this "playDisc" action on the server side. At first, we introduce a "playDisc" entry point in our "reversi.action.php":

	<pre>		<pre>