Building an XNA Game Studio XBox360 Indie Game.

[page 0043] ~ ChessPionage:

But first new news.

Notepad++ v6.3.2 has been updated to Notepad++ v6.4.5.  That is all.

And now, for something completely different . . .

a game with three aspects: chess, espionage and philosophy.  This months OGAM theme is Philosophy.  Seeing that I have already built a computer chess game using Microsoft Visual Basic 6.0, circa late 1990’s , I already have some of the art assets constructed.  I also have some vague ideas of what to expect while building this months game.  The title ChessPionage is, of course, a combination of chess and espionage.

The trick in building this game is that …

Hmm, I’ve actually forgotten how a for loop is constructed.  OK, got it, back on track.  Start off by opening Processing and creating a new project called Chesspionage.  Then with Trail Blazer also open, cut and paste the framework of commented block delineation structures from the finished game into the Chesspionage project sketch window.  This also entails leaving behind the other parts of the previous program that are game specific and have no use or bearing on this game build.  These empty blocks will provide clear areas or regions, in this new game, where the relevant code for this game is to be placed later on.  It’s a simple way of keeping track of code blocks so that when the scrolling searches begin, i.e. nearly perpetually looking up and down the code page, the general position of the code is found more easily because it will start out as a formal and unified template.

An Ode to Forgetfulness.

It has been a while since I’ve updated my website to reflect my progress as I move along this One Game A Month journey.  It is doable but it is still kinda clunky, for me at least.  Everything in my web site is pretty much hard coded as it goes along.  So it seems like, when I do put in the effort, I keep pulling over at the waysides and scenic outlooks to update the different parts of where I am.  My website is one thing, so the game has a consolidated happy hovel to reside in after all is said and done.  This blog is another, where my thought processes and general hemming and hawing, to keep my mind right, yeah sure, can back track and hopefully move forward as I drop trinkets and baubles along the way.  Then there is the actual game that needs to be built, which takes up the task of building logical constructs that eventually, and again hopefully end up as a playable game.  And finally there are all the odds and ends of assorted remembering that give there best to keep it all connected and moving along.  Tweets happen, but that is usually just a capstone hurrah at the end.  Well at least I can write this.  At the beginning of this year I had absolutely no idea of what it would take to build a completed game, let alone a web game, in an API that I had never worked in or with before.  I guess it’s better to have a grand capacity to forget many things rather than neglecting everything and seeing nothing ventured, nothing lost.  So, how do I build an anchor tag in my web code that will take a hyper-link in this blog post to a specific spot in my sites web page. Hmm, more research, and, OK, got it to work, happy now, so . . .

Back to the Thick of It.

Processing doesn’t take bitmaps (bmp) so I’ll need to convert my chess pieces to jpg files.  Done.  Now to drag them into the sketch so they are recognized in the data folder of the project.  Processing needs to preload these art assets with a, /* @pjs preload=”name.jpg”; */ , directive in the header, so that’s next.  Ah, the intricacies of copy, cut, paste, all from the explorer folder set to details, of course.  And watch out for the naming conventions, I needed a little rework there, but it works now,  Can’t start a variable name with a numeric character.  An eight by eight grid of Pawns are centered in the games screen play area.  There are six pieces, Pawn, Rook, Knight, Bishop, Queen and King, that make up the side.  There are also four hues of those pieces that make four choices for the players team.  So there are twenty-four pieces total that need to be preloaded in the header, then have their variables initialized in the declaration space and then have those variables loaded with the jpg files in the setup function, done-done-done.

Setting the Chess Table.

A standard chess board is made of a square and in that square are sixty-four smaller squares.  The pieces are set in one of the smaller squares and move, centralized in that square, from square to square as they move about the larger board.  It looks like I need a chess board in this game.  Using rect() and its arguments [X,Y,W,H] I have a perimeter around the sixty-four pawns on the screen.  The next part will be a little more tricky, building the checkerboard texture where the chess pieces will rest.  As this will be a standard game of chess, the queen, when the pieces are initially set to begin the game, will rest on her own color.  This means that the top left and the bottom right squares of the board will be the light colored squares.  These alternate back and forth so the diagonals are of the same color.  This will more than likely be a nested for loop, with some tricky if statements to provide the correct shading of the squares.  I’ll see if I can use a % (modulo) function to direct this outcome, having it flip back and forth in the draw loop.  But first I’ll need some hard coded figures to chart this out to get a visually aesthetic model, it is my way of doing things.  Yup, had to change the strokeWeight(#); so the light and dark squares have better highlighting.  Whew! That’s done, and as suspected it was nested for loops with modulo if statements.  I have a chess board.  Now all I need to do is take all that code and drop it into a void function call to tidy up the draw loop and get all those lines out of the way, let’s call it BoardSetUp().

Setting the Chess Pieces.

It’s a nice chess board but it needs the pieces to be placed on the board if a game will ever be played on it.  I’ll need to think this one over.  Or, I could hard code them into place and call that function GameReset(), sure, back to the draw loop I go!  The first thing I’ll need is to find the positions of the pieces so they are all centered on their respective squares, tidy is a good thing.  Another simple for loop of Pawns, white and black, strung across the horizontal rows of the board was simple enough.  Now how to get the other pieces to jump onto the board.  Probably another nested for loop with a switch/case structure to assign the pieces as the loop moves along.  Moving from left to right, yeah left to right but not a nested loop.  The Queen/King and Bishop combination mess up that scheme so it’s easier to give them their own loops.  Or just use the switch/case for all the draws, we’ll have to see if that is a good way to do it or if the game will take a performance hit.  In either case they need to be perpetually drawn to the screen, and so have at you, Ha ha-ha.  Never mind, the Queens line up across from each other on the chess board, so undo that.

Scrubbing Through the First Run.

The chess board has it’s pieces in place, and as it stands, although there are four shades of player pieces, two light two dark, it has become apparent that there will be a main and a secondary player hue for each of the two players.  The reasoning here is that drag and drop or some kind of point and click system seems preferable to any other type of movement mechanism that is conventionally used.  And now for the scrubbing.  Having the pieces drawn to the screen through the current mechanismal function, although it clearly is doing what is intended, there may be some changes to separate the calculations in the functions loop from the actual drawing of the pieces to the screen.  Consolidating all the draws into one function is usually the best way to keep the fastest refresh of the screen commands.  This is where the start of declaration statements for this game, employing arrays, to keep track of the pieces positions will most likely begin.

Save Once, Save Often.

This game, well, project start, has enough work put into it and has gotten to the point where a code page backup should be taken into account.  Done, at least I’ll be able to get back to this point in time if there is ever a need to.

Division of Arguments.

And now to get the draw function arguments separated from the logical loops that programmatically build them.  Draw calls for the pieces need arguments that hold the positions of the pieces on the chess board.  These arguments are currently built within and given to the called draw functions within a looping structure that are dependent on the loops to increment their positions and are immediately drawn to the screen as they are assigned to the arguments, kind of a one-stop-shopping routine.  The calculations are currently inseparable from the calls.  What I need is a series of arrays that will hold the pieces positions in a predefined persistent variable declared in the header space and is initialized in the SetUp function before the program begins the game play.  So what do I need.  Along with the file image, which I already have and have been working with, I’ll need the X and Y position of the image, actually the upper left corner, so that all the images are drawn consistently with in the chess board grid.  And what else will be needed.  If I want any of these chess pieces to move I will need some kind of mechanism that can recognize when the mouse pointer is over that image, i.e. chess piece.  This means I need the area of that pieces jpg file, that being the top left position of the image on the chess board, and the height and width to fill out that square.  Having that information should allow me to do some bounds checking to verify if the tip of the mouse pointer is within the desired area on the screen.  But, to keep the calculations for when this happens down to a sizable roar, I should probably have this happen only when the mousedown function is activated.  A left mouse button click would then allow, because of a boolean flag set to true, the as yet not constructed function to use the chess piece of the secondary hue to be portrayed on the screen.  This will signal to the player that that piece now has focus and the relevant procedures are active and the player may continue to move the set piece, if so desired, to one of the pieces predefined positions.  Voila, the game begins to have pieces that can be moved, but not yet.  I still need to get the arrays of piece positions built, the arrays of boolean flags and the mouse functions that will allow validation of the mouse pointer position in relation to the chess pieces.  This is going to be a long one.  Do I need anything else?

Albeit a Leap of Faith.

Pressing off into the distance may be the best way.  To see what else I’ll need for this game, I will go through an imaginary dry run, playing this game, here, written down, to capture the essence as it supposedly will move along.  This is a game of chess, using a modern standard model of game play.  This computer generated chess game will also incorporate signals that expose the supposed espionage that can come to light while game play ensues.  The resultant philosophy because of the exposition of congruent clues of espionage provide to the players an understanding of causality in relation to each of the pieces the players move.  On a regular chess board, a real chess board, tactile in nature, actually having mass, possibly likened to a piece of furniture along with the curios, the chess pieces, movable through a players adroit manipulations derived of the players physical major appendages because of cognitive implicating desires in concern to the process wherein a winning end game results, the board and pieces are viewed as static in nature and do not vary save for the fact that the pieces are placed on, move about and can be removed from the board.  In comparison, not taking into account all else needed as the hardware, software, connective server hubs, electrical generation and distribution facilities, so on and so forth, etc. etc. etc. unto anon . . . this game, the computer game, has little to no tangibility, no mass except for the photons emitted from the constructed logic portrayed on the computer screen, a conceptional abstraction of the former conveyed as true in the representation of the latter.  In short, in the former chess game the chess board looks the same if a piece moves into a parlous position as when it moves into a safe position.  In the latter, this computer game will add to the chess board a dynamic that, as the players piece is chosen to move, shows the possible paths of that piece and if necessary change the face of the board so tactical placement may be either capitalized on, i.e. moving into, supporting a piece in or averting a dangerous position.

And with that Bout of Gibberish Out of the Way.

This will come about because each piece has its own way of moving.  The Pawn, Rook, Knight, Bishop, Queen and King have predefined movements allocated to them at the start of the game, as yet unimplemented.  The Pawn and the Knight are the only pieces that are not blocked at the start of the game.  All the other pieces cannot move because their movement plots are blocked by other pieces.  Clicking on these pieces will show no alternate paths away from their current position.  The Pawns and Knights, if clicked on, will show their movement plots as . . . hmm, I seem to be getting ahead of myself, in a game programming-atically kind of way.  But, I do want to have a typed game design document to give me an idea to see just what I need, but I really would also like to build while I write so that what I want to do is actually feasible so what I think is the way is possible.  OK, I had to take a little side caveat there to insure that how things are seen on the board can be built programmatically, done and doable.  So, the Pawns and Knights, if clicked on will become blue, cyan actually, and will show their prospective movement plots as a green square outline around a set of tiles where the piece is able to move that turn.  It will be yellow if that tile will put that piece into a position where the opposing players piece will be able to take it the next turn.  If the piece ends its move in a yellow tile the hue of the piece becomes red denoting that it is in danger of being taken by another chess piece.  Thus the espionage.  It looks like I’ll be flipping back and forth between writing this dry run of game play and the capacity to have the game play implementable in code, so be it.  It also looks like I’ll be reverting back into my very old ways of variable naming conventions, back in the days of BASIC, Beginners All-purpose Symbolic Instruction Code, to keep the variable names acronymed, capitalized and very short, i.e. White Pawn 1 == WP1, White Queen == WQ, Black Knight 1 == BK1 and so on.  I’ll try to use the “point(X, Y);” structure to hold the position of the WP1 variable.  Nope, Processing does not recognize the point Data Type as one of its Primitive or Composite data types when it is declared in the header of the code page which means that coordinate pairs are going to be a little long winded and unwieldy in my code.  Hmm, another work around it would seem.  Yes, I’ll be using two sets of arrays, two for each player.  The set consists of an (X, Y) coordinate pair found inside a 2×8 matrix.  The really neeto problem in practicality is how to remember the assignment of the pieces inside the array.  Starting at the top of the board the pieces are lined up R1,K1,B1,Q,K,B2,K2,R2, followed in the second part of the array with, P1, P2, P3, P4, P5, P6, P7, P8.  The arrays start a zero so the columns or files are 0 thru 7 and the rows or ranks move through 0 thru 1.  I want the player, Black Pawns, (P1 – P8), to be in rank 0 along with the White Pawns, just to be consistent while I mentally draw out the chess board with the pieces taken from the array.  The rank 1 array will hold the major pieces, I’ll call them the crown pieces, just to keep it simple, as simple as can be.  The way the board is currently set up the white player is on the bottom with the Queen to the left, and the black player is on top and, while facing the white player, the black Queen is to the right.  Maybe that was what I was trying to figure out a few paragraphs back.  So anyway,  the next thing to do is cut out the entire draw routine used to put the pieces on the board and see if the program still runs, and it does.  And then to assign the arrays of variables, probably using the for/loops with the accompanying switch/case structure, and then switch out the draw() arguments with those array generated variable values.  Syntax, syntax, syntax it’s nice to know a couple of different languages, sort of, sort of confusing.  And watch out so that you don’t switch the number of rows for the number of columns, the screen of death comes up and there isn’t a error checker so you end up flying blind, until you figure it out, wee!  Now back to the nested for/loop with the embedded switch/case in the draw function.  Gad, not a nested loop in the draw function just a single loop with a more intricate switch/case that I think will be getting even more convoluted, only time will tell.

It’s All Back Together.

It draws the chess board with the pieces in place using the arrays that are now built.  So where was I.  The idea I was getting at is clicking on a chess piece and having the possible positions shown by different colored outlines on the respective tiles.  That brings into account the position of the mouse pointer and probably a search algorithm to find the closest match to that point.  Then programmatically assign the match from the search to the list of pieces that remain on the board.  So let’s say that a point on the chess board is clicked.  A mouse down signal is initiated and in the mouse down, for a left mouse button click, activates a function call wherein it reads the list of remaining pieces.  I could shorten that list by using a boolean flag, which would be set to false when a piece is taken.  More arrays, and research.  Nope, no collision detection in the Processing Reference documentation, but there is enough there within the given data types to build something.  I’ll just need the upper left corner and the width and height, which happens to be the same length, to find where on which piece the mouse was clicked.  From the mouse down function, I’ll capture the point on the board, MouseDownPositionX and Y, do some bounds detection and calculate an area that should provide the correct piece selected.  Ok, that’s a nice thing, the mousePressed() function only calls that function once and then exits that function, even when the mouse is held down and moved, very nice.  I thought I might need some extra booleans to remedy that, but not.  So I have a position on the chess board where the mouse pointer had been clicked.  A boolean flag, MouseIsDown, is also needed for further processing and to open the search function to find the pieces position.  Don’t forget to declare the boolean in the header.  So when the mouse is clicked inside a white piece all of the pieces are tinted one color and if clicked in a black piece all are tinted another color.  Now I need to figure out how to get just that one piece to be tinted.  It seems that if I capture the i and j increment of the nested for/loop that might get me closer to my goal here.  From a write to the screen with the text() function, I can see the results which prove true.  The array row zero are the pawns with the row one seen as the crown pieces.  The column numbers are also correctly situated.  In lieu of a boolean I’ll use an int data type that will be set to zero(0) for the black pieces and one(1) for the white pieces.  I’m working towards getting the piece that has been clicked on by . . . Nope, it’s time for another backup to save all this work at this point again.  Ok, I feel better about that, and I’m working towards separating the white pieces from the black pieces with the if() statements inside of two nested for/loops that test the mouse click position against the startup/reset positions given at the initialization of the game.  These positions can and will change as the pieces move, but I haven’t gotten to that point yet.  There, I’ve gotten rid of the menu system from the last game.  I’ll have no use for it in this game and it makes the layout much cleaner.  And that makes it time for another backup save.

The Hunt is On.

The pieces are in the newly revamped structure that separated the position of the piece from the draw method.  It is situated in a switch/case inside a for/loop.  I’ll need to look at that and maybe rework that, OR, just leave it alone by putting it in its own void function to be called at the beginning or reset of the game and then build a game play draw routine from some of those existing pieces.  With all that has been done so far, I’ve broken all the chess pieces into three divisions, that being the white and black pieces, the pawns and the crown pieces.  Finding the one piece that has been clicked on comes from the MouseIsDown flag, the MouseDownPositionX and Y that sets the position of the mouse pointer, and the CaptureI and J variables from a search that captures the piece position on the board along with the PieceColor, either white or black.  From there the player will need to know, or be given acknowledgement that that piece has been selected.  Yes, that switch/case did become a rather large structure but now when the mouse is clicked within a white piece, that piece does change hue to show that it has been selected, very nice.  Now to do the same for the black pieces.  And that works equally as well.  Time for another backup save.

Where Can I Go, What Can I Do?

The board is set, the pieces are placed, the two players can use the mouse to point at a chess piece and select that piece which is then highlighted.  The highlight shows that that piece is ready to move.  The question is how does the selected piece move.  Where does it go.  What is the definition that shows the positions that are possible that turn.  And that is what comes next, the pieces definitions.  Pawns move forward one tile, except for its first move when it can move two tiles.  The Pawn also has the option to move at a diagonal, if attacking an opposing piece.  The other pieces, the crown pieces, being the Rook, Knight, Bishop, Queen and King, have their own movement plots.  I’ll start with the Pawns.  A pawn is selected and what happens.  The pawn is highlighted and then the pawns movement plot is shown in the appropriate tiles.  So I need a definition for a pawn that shows its movement plot.  I’ll also need to know where that definition will be called from, in code, when that piece is selected.  From prior graphics test I have an outline that is used to circumscribe a tile with a green, yellow or red outline.  So far I don’t have a definition that can be attached to a particular piece that will be shown by that outline.  The transposable definition, then, is what will come next.  PlotPawn() will be the void function that is called.  There are sixteen pawns in the game, initially, eight white eight black.  The white pawns will move up the screen and the black down.  I have a division built with the variable PieceColor that can be used to change the direction of the plot inside the function.  The highlights for the Pawn are done, so each of the remaining crown highlights are needed.

And As Time Draws Nigh.

It’s time to bank some of that ever lovin’ grace period.  I’m having too much fun with this game and it has come too far to just pack it away as is.  It’s built for the theme, philosophy, and I’ll be running it to the hilt this time around.  See you on the other side.  To be continued, . . . and finished.

Until then, G’day.


August 31, 2013 - Posted by | 2013 [0019] to [00??], The Process

No comments yet.

Leave a Reply

Please log in using one of these methods to post your comment: Logo

You are commenting using your account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s