blank out the squares
Post on 17-Jul-2015
31 Views
Preview:
TRANSCRIPT
What the game is, how to play it Improvements New Developments Further Comments Wrap up – what have I learned?
Blank Out the Squares
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
An empty column will cause the squares to the left of the column to shunt to the right
Starting a game
The game attempts to generate a solvable configuration – can take several iterations!
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
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”
Section 2 - Improvements
Separate “Game” from Generator This isn't a game more an interface for
testing functions and algorithms
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....
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
• 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
top related