Print

Please login or register.
1 Hour 1 Day 1 Week 1 Month Forever
Login with username, password and session length

[jackslawed]

Hi all
I'm working on creating a jigsaw-type puzzle right now, plugging away with trial and error. I'm making slow progress but I feel like things are getting unwieldy... juggling too many things. I assume others have created similar puzzles in the past, so I thought I'd ask for some advice.

What is the best/simplest way to implement a jigsaw with rotatable pieces?  I assume that each should be an entity, but I'm not sure of the best way to allow the player to pick up and drop the pieces in new places. I guess the key issue I'm having is how best to move the entity around the screen following the cursor, and then settle in a new place.

I was thinking left click pickup/drop and right click rotate, with the active cursor changing to match the piece sprite. However, with this, I'm not sure how to drop the entity somewhere else.

If you haven't realized by now, I'm a tech fool, so feel free to point out the seemingly obvious... any advice is a new lesson for me!

[Mnemonic]

I scripted something like this years ago for Five magical amulets. I don't know if it's going to help you, or confuse you, but here are the original sources:

http://dead-code.org/download/demos/papirky.rar

The puzzle is a window and each piece is a button. The buttons handle the LeftClick event, and clicked button starts following the mouse pointer. Clicking the button again will ask the window to try to place the puzzle piece. If it's approximately in the correct position, the button is placed and disabled, so that the player can't click it again.

Right clicking the selected button will rotate it. Here there are two images used for each piece, normal and rotated. If you wanted to use wme's rotation functions, you'd indeed need to use entities, but the principle will be similar.

The problem here is that in order for the selected button to catch the left/right click events, the mouse pointer must be always above the button surface. In Five magical amulets the pieces are designed in a way that guaratees that there are no holes in the middle of the piece graphics, to the script always moves the center of the piece to mouse pointer position.

[jackslawed]

Thanks for the reply. As I said, it's always good to see examples of how other people handle WME programming, since I have such limited experience.

I continued to plug away and finally got an incredibly ugly pile of code that fortunately works. (ten rotatable sprite entities and ten region entities, each with a few global variables involved). I hope it won't end up being a gargantuan drain on memory, but at least it works!

[metamorphium]

Hi jackslawed,

I scripted fully rotatable jigsaw puzzle for my game (eg. 360 degrees rotation), but it involves some basic math. What I'm doing is that I have tiles each of them has set it's hotspot to it's center so it rotates along sprite's center. The trick is, that for every sprite entity (non-interactive) I did a corresponding regionEntity which I dynamically assign shape points. The catch is, that WME doesn't tell you sprite width so I had to preset these manually for each image file.

Also as I think of that now, it would be possible to have only one set of scene entities - images and assign those control points directly to that entity. So it's possible to optimize.

Now I am SURE I've posted this script here already, but I can't find it so here goes:

Code: WME Script

1.  
2. method RotateRegion(entityNumber, angle)
3. {
4.  
5.         // this is entity
6.         var e = Scene.GetNode("jigsawTile"+entityNumber);
7.  
8.  
9.         var regionEntityObject = Scene.GetNode("jigsawRegion"+entityNumber);
10.         var regionObject = regionEntityObject.Region;
11.        
12.         var rx = -1 * (e.Width / 2);
13.         var ry = -1 * e.Height;
14.  
15.         var rx2 = (e.Width / 2);
16.         var ry2 = e.Height;
17.        
18.         var x1 = ToInt(e.rx + (e.Width /2 ) + (rx * Math.Cos(e.Rotate) - ry*Math.Sin(e.Rotate)));       
19.         var y1 = ToInt(e.ry + e.Height + (rx * Math.Sin(e.Rotate) + ry * Math.Cos(e.Rotate)));
20.  
21.         var x2 = ToInt(e.rx2 - (e.Width / 2) + (rx2 * Math.Cos(e.Rotate) - ry*Math.Sin(e.Rotate)));     
22.         var y2 = ToInt(e.ry + e.Height + (rx2 * Math.Sin(e.Rotate) + ry * Math.Cos(e.Rotate)));
23.  
24.         var x3 = ToInt(e.rx2 - (e.Width /2 ) + (rx2 * Math.Cos(e.Rotate) - ry2*Math.Sin(e.Rotate)));   
25.         var y3 = ToInt(e.ry2 - e.Height + (rx2 * Math.Sin(e.Rotate) + ry2 * Math.Cos(e.Rotate)));
26.        
27.         var x4 = ToInt(e.rx + (e.Width /2 ) + (rx * Math.Cos(e.Rotate) - ry2*Math.Sin(e.Rotate)));     
28.         var y4 = ToInt(e.ry2 - e.Height +  (rx * Math.Sin(e.Rotate) + ry2 * Math.Cos(e.Rotate)));
29.        
30.         regionObject.SetPoint(0,x1,y1);
31.         regionObject.SetPoint(1,x2,y2);
32.         regionObject.SetPoint(2,x3,y3);
33.         regionObject.SetPoint(3,x4,y4);
34.  
35. }
36.  
37.