Control Panel - Sliding Puzzle Game
This game can be used for entertainement or to display a product or service in a playful manner. The game is an online version of the popular sliding puzzle game.
1. Installation
To install the game, simply access your control panel and
click the 'Sliding Puzzle' button. The game will automatically be installed on your hosting account.
The below files will be installed on your website.
File Name | Purpose |
/slider/slider.cgi | The actual script |
/slider/index.html | Go here to play the game |
/slider/header.html | Shown at the top of every page |
/slider/footer.html | Shown at the bottom of every page |
/slider/parrot_winner.html | Page shown when the puzzle is solved |
/slider/rand.dat | Data file |
/slider/random.data | Data file |
/parrot0...parrot15.jpg | Sample game pieces (graphics) |
|
The game is now ready for use on your web site.
2. Customize
To create a game set, select a name for this gameset (we'll use 'parrot' in the below example).
Start with a 260 x 260 pixel game graphic and cut it into 16 graphic pieces (both .gif and .jpg
will work) called parrot0.jpg, parrot1.jpg ... parrot15.jpg.
Each piece should be 65 x 65 pixels. 'parrot0.jpg' is the top left piece of the origal graphic,
'parrot3.jpg' is the top right piece. 'parrot15.jpg' is the 'empty' or 'sliding' game piece.
The sample graphic set is a good example to look at.
The page that is shown when the game is solved is called 'gameset_winner.html' (parrot_winner.html for example).
When using only one game graphic set, create a web page with the below .html in the /slider directory on your website hosting account.
<FORM METHOD="POST" ACTION="slider.cgi">
<INPUT TYPE="hidden" NAME="command" VALUE="setup">
<INPUT TYPE="hidden" NAME="set" VALUE="gameset">
<INPUT TYPE="submit" VALUE="Start Game">
</FORM>
|
|
Replace gameset with the name for your gameset. You could use 'parrot' for example.
Here is an example to use multiple game graphic sets.
<FORM METHOD="POST" ACTION="slider.cgi">
<INPUT TYPE="hidden" NAME="command" VALUE="setup">
<SELECT NAME="set">
<OPTION VALUE="gameset">Brief Description
<OPTION VALUE="gameset2">Brief Description 2
</SELECT>
<INPUT TYPE="submit" VALUE="Start Game">
</FORM>
|
|
Replace gameset with the name for your gameset ('parrot' for example) and Brief Description with the actual description for that game set. You can add as many lines as you wish.
The sample 'index.html' has an example of both options and is placed in the 'slider' directory of your hosting account during installation.