CINF 301 The University of Tampa Eight Puzzle Project

User Generated

nyfhonvrf515

Computer Science

CINF 301

The University of Tampa

CINF

Description

Project 1: Eight Puzzle

For your first project, you will develop the 8-puzzle game using Javascript
You are free to complete this project however you wish, as long as you use Javascript (it is your
choice if you want to use Bootstrap). In the class repository, I have provided you with sample code that
uses an HTML table (though no Bootstrap) with text elements inside the cells and Javascript to access
the elements of the table and switch numbers between them (i.e. script table.js. I have added some
code that is more functional between 19 - 25, and you should cut and past parts in the browser console
to see how it works. You MUST use this code in creating your puzzle solver, to make it work using
Javascript to check which element you click, whether the blank square is adjacent to it, whether the
puzzle is solved, etc. To be exact, you must use the code in file script table.js from lines 19 - 25 with
window.onload, then modify switch elems() and add functionality to create a working game. This is
a requirement! The final goal state should look like:
Figure 1: Goal State of puzzle
The beginning state should be the goal state so I can test more easily. Since the beginning state is
the goal state, your puzzle should be “solvable” in two moves (e.g. 2 moves to blank square then moves
back). I should be able to test this way by choosing a number of moves then moving in reverse order back
to the goal state. You must also include a button to scramble the squares and have the puzzle appear
when you open the page. Note that for the puzzle to be actually solvable, you cannot actually make the
puzzle scramble completely random. You must begin with the start state and work backwards, swapping
tiles which are adjacent to the blank tile some number of times. (Otherwise, there is a parity issue where
two tiles are always in the reversed positions.) When the goal state is reached, you should indicate this
either with a Javascript alert or a message on the web page itself, your choice. You should be able to
reset the puzzle to a random puzzle whenever the scramble button is pushed, but this puzzle MUST be
solvable! That is, to shuffle the puzzle, you should start from the goal state and randomly switch tiles
some number of times to get to a “random” starting state.
Your requirements are:

1. committed to repos regularly
2. looks good (w/ or w/out Bootstrap)
3. used lines 19 - 25 from script table.js
4. started in goal state, and goal state is correct
5. scrambled puzzle as described in class and above, starting from goal state and randomly switching
tiles
6. accurately posts message when puzzle is solved
7. used proper directory structure (e.g. css and scripts)1. committed to repos regularly
2. looks good (w/ or w/out Bootstrap)
3. used lines 19 - 25 from script table.js
4. started in goal state, and goal state is correct
5. scrambled puzzle as described in class and above, starting from goal state and randomly switching
tiles
6. accurately posts message when puzzle is solved

Unformatted Attachment Preview

Project 1: Eight Puzzle CINF301: Web Application Development Assigned: Wednesday, February 16, 2022 Due: Friday, February 25, 2022 at midnight For your first project, you will develop the 8-puzzle game using Javascript. To turn in this assignment, you are to complete the same process you followed with previous assignments, using the link at https://classroom.github.com/a/oIQUmzJC. Then please develop all of your code within the repository. That is, please do not work in a different workspace that is not in the repos, and once finished, copy the code all to the repository! That defeats the whole point of using Git. Commit and push your code frequently to make sure nothing gets lost when developing. You will lose points if you only commit on the last day or two of the assignment. You should at least be doing some work beforehand, like designing and styling your view with CSS and a nice look, getting some of the basic code included in the javascript file, etc. You are free to complete this project however you wish, as long as you use Javascript (it is your choice if you want to use Bootstrap). In the class repository, I have provided you with sample code that uses an HTML table (though no Bootstrap) with text elements inside the cells and Javascript to access the elements of the table and switch numbers between them (i.e. script table.js. I have added some code that is more functional between 19 - 25, and you should cut and past parts in the browser console to see how it works. You MUST use this code in creating your puzzle solver, to make it work using Javascript to check which element you click, whether the blank square is adjacent to it, whether the puzzle is solved, etc. To be exact, you must use the code in file script table.js from lines 19 - 25 with window.onload, then modify switch elems() and add functionality to create a working game. This is a requirement! The final goal state should look like: Figure 1: Goal State of puzzle The beginning state should be the goal state so I can test more easily. Since the beginning state is the goal state, your puzzle should be “solvable” in two moves (e.g. 2 moves to blank square then moves back). I should be able to test this way by choosing a number of moves then moving in reverse order back to the goal state. You must also include a button to scramble the squares and have the puzzle appear when you open the page. Note that for the puzzle to be actually solvable, you cannot actually make the puzzle scramble completely random. You must begin with the start state and work backwards, swapping tiles which are adjacent to the blank tile some number of times. (Otherwise, there is a parity issue where two tiles are always in the reversed positions.) When the goal state is reached, you should indicate this either with a Javascript alert or a message on the web page itself, your choice. You should be able to reset the puzzle to a random puzzle whenever the scramble button is pushed, but this puzzle MUST be solvable! That is, to shuffle the puzzle, you should start from the goal state and randomly switch tiles some number of times to get to a “random” starting state. Your requirements are: 1. committed to repos regularly 2. looks good (w/ or w/out Bootstrap) 3. used lines 19 - 25 from script table.js 4. started in goal state, and goal state is correct 5. scrambled puzzle as described in class and above, starting from goal state and randomly switching tiles 6. accurately posts message when puzzle is solved 7. used proper directory structure (e.g. css and scripts)
Purchase answer to see full attachment
User generated content is uploaded by users for the purposes of learning and should be used following Studypool's honor code & terms of service.

Explanation & Answer

View attached explanation and answer. Let me know if you ...


Anonymous
Great study resource, helped me a lot.

Studypool
4.7
Trustpilot
4.5
Sitejabber
4.4

Related Tags