General

Feed to Puzzle Maker some graphic file to make a puzzle game from corresponding image. The game will be generated as HTML file and set of JPG files, one JPG file for each puzzle piece. The header of HTML file contains java script. This script enables plaing the game.

You can play the game using embeded WEB-browser of the program or open generated HTML file dierctly via external WEB-browser. Information program needs to generate the game is stored in *.pgd file. This kind of file conatains location of source graphic file, name and paths to destination files, properties of the game (like number of pieces, cellspasing etc) and some other information. Note that *.pgd file does not contain source image, but only path to source graphic file. If source graphic file can not be open program uses default image.

Program can generate complete HTML page with the game as well as parts of HTM you can copy-paste into your custom HTML page.

HOWTOs

How to create new game

How to play the game

How to change source image

How to change game options

How to add the game to some custom HTML page

How to create new game

Click "NEW" button. Program will ask you enter the name of new PGD file. Do not mistake PGD files and final HTML files. PGD file contains information the program needs to generate final HTML file. The name of the final HTML file is one of parameters the PGD file contains. The final HTML file, instead, is the game user can play. After you enter the name of new PGD file "NEW GAME" wizard will run. Follow the wizard instructions.

How to play the game

To randomize the puzzle click the "New Game" buttom of the game webpage.
To get solved puzzle click the "Refrehs" button of the browser.
To move some cell click it by mouse. Only pieces that are at left side, at right side, at the top and at the bottom of the free cell can be moved.
The goal of the player is to put each piece to its place so that build correct view of the puzzle image.

How to change source image

Click "Change Image" button. Source Image Form will appear. You can set default image as grphic source or load source image from a graphic file. To change size of the image click "Change Size" button. If you wish set a "native" size of source image check "Set Auto Size" button and click Ok; If you wish to set custom size check "Set Custom Size" radiobutton and set wished width and height of the image; if the "Keep proportion" checkbox is checked you can change eather width or height of the image: the other dimension will be changed automatically.

How to change game options

Click the "Options" button. Options forms will appear. This form contains 3 tabbed pages: "Files", "Puzzle" and "Page".

at the "Files" page you can set path to source graphic file and path to output file;
at the "Puzzle" page you can set options of the puzzle game:

Puzzle size: the number of pieces the puzzle consists of;
On puzzle done: the event that happends when user solves the puzzle. This can be a displaing a message you define or redirection to some url you define;
Custom nessage will be shown on attempt to move wrong puzzle cell;
Cellspacing: distance between puzzle cells;
Show cell index: if this checkbox is checked each puzzle piece is marked with the index of row and the index of column the piece must be placed to;

at the "Page" page you can set options, such as the Page title (text shown in header of browser's window), Page header text, Custom text for the "New game" button, Text and location for the Puzzle description. The fields "Page Header" and "Description text" allow using HTML tags to format the text and set the cook of the page. of final HTML page

How to add the game to some custom HTML page

After you create new game or change source image or change some option programs generates the game as simple HTML file. If you wish add the game into your custom HTML page you need:

Make sure that JPG files with the puzzle pieces are located in the same directory as your custom HTML page

Paste game java script into your custom page

Paste puzzle table into your custom page

Click the "Make" button. Code fragments form will appear. Clicking corresponding "Copy to clipboard" button you can put to the clipboard the game java-script or the puzzle table. Then you can paste these fragments into text of your custom HTML page using editor you prefer. Note, that the "New game" button is not copied in this case. To let user reset the game you need to call the ResetPuzzle() function, for example as onClick value of some img obgect.