Embed Size (px)
Citation preview
What the game is, how to play it Improvements New Developments Further Comments Wrap up – what have I learned?
Blank Out the Squares
Aim of the Game
To remove all the colored squares
from the screen
Solving the game
The user picks squares with two or more adjacent squares of the same colour
User selects these 4 grey squares
Solving the game
Grey squares are removed and
yellow drops down
Solving the game
Game continues as the number
of squares diminish
Solving the game
An empty column will cause the squares to the left of the column to shunt to the right
User loses if...
Back to the position...
Black “T” selected.
User loses if...
Can go wrong here!
Red group selected...
User loses if...
Game cannot complete!
Restart!
Another way to lose?
Choose a yellow instead ...
Unsolvable!
But it still cant be solved from here!
Restart!
Solving the game
Back to the start ...
Happy Conclusion...
After a series of correct moves…
Starting a game
The game attempts to generate a solvable configuration – can take several iterations!
Starting a game
… until there is a solvable arrangement
I've given up! Show me how to do it!
Program Structure
Squares (html) a canvas element with some buttons
Javascript code:MainGameSolverDiagramClasses
Program Structure Main – sets up the grid / squares object
with random colours
Game – applies game logic to the grid making movements
Solver – contains the DFS recursive routine to make solutions
Diagram – draws grid and captures user inputs
Program Structure
Classes - contains object of squares and the crucial “clone” routine for object duplication
[run through version 1 code]
Solving by recursion
Depth first search
– what does the solver do? Runs until it has at least one success
stage rather than finding all possible. Answers the question if a random set
of squares is “solvable”
DFS Tree
Section 2 - Improvements
Separate “Game” from Generator This isn't a game more an interface for
testing functions and algorithms
A better game....
Instead of a list of moves ...
A better game....
Do a hints button with highlighted areas
A better game....
Sound and Animation!
− Animate tiles removed quickly one by one
− Sound increasing in pitch proportional to number
of squares
− Congrats and applause, sigh when lose
− Music – “popcorn”
A better game....
Now that generator is out, focus on the game and work it for the phone layout
A better game....
Give the user an aim − download a pack of 20 puzzles of increasing
difficulty.
Hi-Score Table – playing competitively − a networked game – further down the line …. gamers
playing synchronized matches .
A better generator
Speed is an issue!− Remove any dead wood – anything can be done more
efficiently?
− Look at the size of objects – what is in memory?
Unnecessary code?
• Discovered – several methods
• scanForSingleton
• resetRowsCols
• Unselectall
• [game.js]
A Better way
• Keep a running total of number of each colour
• colorTotals[] in a puzzle object alongside the squares objects
• Instead of a “selected” cells during adjacent colour discovery, use a stack of squares to develop and see if already there
• [classes.js & game.js]
Inefficient game logic?
• moveBlocksDown(squaresArray);
• checkForblankColumns(squaresArray);
• Look at one of these
• [game.js]
Blank Columns
Blank Columns
Blank Columns
• Find first empty column (fec)
• Copy occupied column names to a string
• Use those to starting at fec
• Whiten remaining columns.
• [ version 4 game.js ]
Size of objects
• Using “sizeof.js” discovered puzzle object is over 1000b!
• Shave off unnecessary properties – • .x & .y, .selected,
• Move functions out of the class
• Immediate improvement – but not that much – from 6 secs to 3 in one case.
• Store colours as 0, 1, etc rather than “white”, “black”
Slow execution?
• Clone is an expensive operation• Use a specialised clone function rather than generic [misc.js]
• For loops slow in JS
• No tail call elimination in JS!• “a new stack frame every time you recurse”
What I have learned ...
• Split off any non-game sections – don’t make user wait!
• JS is excellent for prototyping functions and algorithms & game play
• But bad for anything requiring lots of calculations recursively – object size wasn’t that important
• Time to move on to more appropriate language like python / C
Thank you for listening!
