Hi,
great nice to hear, it's all starting to work now. With respect to the
moving, are you moving the pieces to round _x, _y values, not sure, but this
might have something to do with it. I remember building a panorama with
hotspots area's that had to move along with the panorama, and I had the same
problem, the area's slowly moved away from where they should be. I rounded
all the delta x's and y's and the problem went away.
With respect to the other problem, I think (but I haven't yet so sorry if
this isnt the way to go!) I wouldn't use a ref and neighbour ref search, but
actually define groups.
After moving a piece, it can match on four sides. The matches could be
groups themselves or single pieces. You could take the first match, and
either join the new piece to an already existing group, or start a new group
between the matching piece on the moved piece.
You could make it more complex, for example, when the moved piece matches on
both the left and right side, that you combine all those matches into one
group, however that isn't strictly necessary, since if you use only the
first match, you simply need to move it after the first grouping and it will
group again.
This still leaves a lot of questions to be answered though, but still the
principle would be to update groups.
I'm not sure which solution would be better, they both have something to say
for them i think.
ANYWAYZ: with respect to A*, it would be something like:
- build a childlist for all children not already in the list
in pseudo:
var piecesToFind = new Array();
var piecesToIterate = [masterPiece];
while (piecesToIterate.length > 0) {
var currentNode = piecesToIterate.shift();
piecesToFind.push (currentNode);
for each matchingPiece in currentNode {
if (piecesToFind.contains(matchingPiece) {
piecesToIterate.push (matchingPiece);
}
}
}
Does that make any sense? (i hope its right:))
greetz
Hans
On 7/13/06, Guntur N. Sarwohadi <[EMAIL PROTECTED]> wrote:
Hello Hans,
I would like to thank you in advanced for helping me this far.. I
currently
have the jigsaw drawing algorithm in hand, yay! It's looks nicer now :D..
and it does 'blend' when it sticks to other pieces tightly. One good thing
is that I use the bevel filter and I thought it wont looked blended since
you have that filter around, but somehow it did otherwise and looked
pretty
nice.. some 'fake' blending effect hehehe..
I've modified the group movement code and now it's moving corresponding to
the relation to the 'master' piece (piece the user move).. moving with
distance (not piece relation) was pretty buggy coz it (pieces in the
group)
displaces as the mouse slightly moves away from the master piece. But
currently, with the new implementation, it still displaces.. the
displacements occur only to the master piece and it seems like because it
moves a little faster than the others which make it slightly not sticking
with the rest of the group. Very minor bug but still annoying.
Broadcast / dispatching isn't the right term for what I did in code, btw..
coz in pseudo all i did was:
piece.onMouseMove = function() {
for(i = 0; i < piece.group.length; i++) {
piece.group[i].updatePosition(this);
}
}
group is an array located in each piece mc.. and since it's an array of
pieces, then this piece has the 'updatePosition' methode as well.. sumthin
like
piece.updatePosition = function(ref) {
//get the relation to ref, whether it's in the north, south, west or east
of it
//match the _x and _y property by ref by relation
//search for other pieces connected to ref if this piece isn't related
directly to ref
}
Now, this is where my latest problem spawns in.. searching for pieces
connected to ref is pretty damn hard.. it reminds me with A* algorithm,
which i'm not familiar of.. currently i iterate the methode if a piece
can't
find a hierarchy connection to ref / master piece, and it comes that only
2
layer 'descendants' follow the master movement..
For example, in a 3 x 3 puzzle, if i move the center (piece_2_2), i would
get all pieces move together. But for, say, the top left piece
(piece_1_1),
would only bring piece_1_2, piece_1_3, piece_2_1, piece_3_1 and piece_2_2.
the rest would be left behind..
any idea for this problem?
thx
Guntur N. Sarwohadi
On 7/11/06, Hans Wichman <[EMAIL PROTECTED]> wrote:
>
> Hi,
> does it displace until you stop moving, or displace and screws it up
> completely?
> It sounds like either one of the updates you broadcast are not coming
> through, or the updates are based on the wrong offsets. I assume that if
> you
> move a group of 3, the 2 that should be moved automatically ARE
displaced
> by
> the same amount?
> Just a shot in the dark here, but when you broadcast to the group, do
you
> skip the source of the event?
> For example, normally in a group of 2, when you move one, you could
> either:
> 1) move the one you moved and dispatch an event to the other
> 2) create an event and dispatch to the group
> 3) move the one you moved and dispatch an event to the whole group
>
> the 3rd option clearly is invalid, since one piece would be moved twice.
>
> And with respect to the somefrogs.com, i had the same impression you had
> now
> "how do they do that" a few weeks ago, and now i know: one step at a
> time:).
> Once you have the mask, and the movement correct, you are 80% there;)
>
> good luck!
> JC
>
>
> On 7/11/06, Guntur N. Sarwohadi <[EMAIL PROTECTED]> wrote:
> >
> > Hi Hans,
> >
> > Hmm.. I'm not sure what was I thinking when I was writing about
> > onEnterFrame, coz like you describe earlier, I didn't use any
> onEnterFrame
> > either.. gosh, this what happens when you don't have enough coffee
with
> > you
> > after 2 days of no sleep :p.. well, anyway, in onMouseMove, I
broadcast
> to
> > piece group members to move as well, with the current piece as
> reference.
> > Currently I calculated the distance prior broadcast and as the current
> > piece
> > moves, the piece group members would move in the same way without
> getting
> > off location... but it does.. when you move the mouse fast enough, it
> > displaces..
> >
> > somefrogs.com... wow! that's so cool.. How you do such a thing?.. it
> > blends
> > in and mostly, the pieces dont fall off when you move the mouse fast
> > enough!... how the...?..
> >
> > anyone got an idea with my problem?
> >
> > thx!
> > [g]
> >
> > On 7/11/06, Hans Wichman <[EMAIL PROTECTED]> wrote:
> > >
> > > Hi,
> > > with respect to the combining pieces, why would you use onEnterFrame
> to
> > > update the other pieces?
> > > Of course I dont know the details of your implementation, but it
would
> > > seem
> > > that if you had puzzle clumps (in want of a better term), meaning
> groups
> > > of
> > > already combined pieces you could either temporarily parent (meaning
> > > recreating) the whole clump in a parent clip, and move the parent
clip
> > or
> > > do
> > > something like:
> > >
> > > puzzlePiece.onMouseMove = {
> > > get self.deltaxy
> > > if Puzzle.getGroup(self) == null then self.move(deltaxy)
> > > else Puzzle.getGroup(self).move(deltaxy);
> > > }
> > >
> > > With respect to the masking and filling through the drawing api, my
> > > routine
> > > looks like (in pseudo):
> > > canvas.clear()
> > > canvas.beginFill()
> > >
drawTop(canvas);drawRight(canvas);drawBottom(canvas);drawLeft(canvas);
> > > canvas.endFill();
> > >
> > > each draw routine picks up where the first left off, creating a
closed
> > > shape
> > > which can be filled as normal.
> > >
> > > However if you had different sides drawn as vectors in flash, and
> > convert
> > > them to a symbol, and put four of them together, you can't do this,
> > since
> > > 4
> > > symbols together of course dont make a closed 'shape'.
> > >
> > > One other thing though: did you know this one: http://somefrogs.com/
> > > It might be all you need. It lacks a nice bevelled edge around the
> > pieces,
> > > which would have been easy to add to your drawn shapes, using a
> > > bevelfilter,
> > > but it still is a very nice out of the box reusable puzzle component
I
> > > think.
> > >
> > > greetz
> > > Hans
> > >
> > >
> > > On 7/11/06, Hans Wichman <[EMAIL PROTECTED]> wrote:
> > > >
> > > > Hi,
> > > > with respect to the combining pieces, why would you use
onEnterFrame
> > to
> > > > update the other pieces?
> > > > Of course I dont know the details of your implementation, but it
> would
> > > > seem that if you had puzzle clumps (in want of a better term),
> meaning
> > > > groups of already combined pieces you could either temporarily
> parent
> > > > (meaning recreating) the whole clump in a parent clip, and move
the
> > > parent
> > > > clip or do something like:
> > > >
> > > > puzzlePiece.onMouseMove = {
> > > > get self.deltaxy
> > > > if Puzzle.getGroup(self) == null then self.move(deltaxy)
> > > > else Puzzle.getGroup(self).move(deltaxy);
> > > > }
> > > >
> > > > With respect to the masking and filling through the drawing api,
my
> > > > routine looks like (in pseudo):
> > > > canvas.clear()
> > > > canvas.beginFill()
> > > >
> drawTop(canvas);drawRight(canvas);drawBottom(canvas);drawLeft(canvas);
> > > > canvas.endFill();
> > > >
> > > > each draw routine picks up where the first left off, creating a
> closed
> > > > shape which can be filled as normal.
> > > >
> > > > However if you had different sides drawn as vectors in flash, and
> > > convert
> > > > them to a symbol, and put four of them together, you can't do
this,
> > > since 4
> > > > symbols together of course dont make a closed 'shape'.
> > > >
> > > > One other thing though: did you know this one:
http://somefrogs.com/
> > > > It might be all you need.
> > > >
> > > > greetz
> > > > Hans
> > > >
> > > >
> > > >
> > > > On 7/11/06, Guntur N. Sarwohadi <[EMAIL PROTECTED]> wrote:
> > > > >
> > > > > Thanks guys for the reply. Now I have a better understanding on
> how
> > to
> > > > > achieve the effect. Currently i'm planning to provide vector
> puzzle
> > > > > pieces
> > > > > as mask templates first. Once that's done, I would try to start
> > > working
> > > > > on
> > > > > dynamically drawing the puzzle nubs and cutouts.. I like the
> review
> > > Neo
> > > > > handed. It explains a lot what Hans described... One question
> > though,
> > > > > whether the sides are drawn by code or provided as vectors, how
> > would
> > > > > you
> > > > > combine 4 of them to make it as a filled masked vector shape
using
> > > > > drawing
> > > > > api?
> > > > >
> > > > > One other thing, the puzzle I'm doing would allow users to move
> > puzzle
> > > > > pieces and combine them by side references (like, piece A is
> always
> > in
> > > > > the
> > > > > left of piece B, while D is always below A, for example). Now
I've
> > > > > manage to
> > > > > make each piece move other pieces in one group as a whole (using
> > > > > onMouseMove
> > > > > for the dragger and onEnterFrame by calculating distance with
the
> > > > > dragger
> > > > > for the 'dragee') but it seems unoptimized and often lags (which
> > > shifts
> > > > > pieces location) if you move the mouse fast. It would look
> unsticky.
> > > > > Does
> > > > > anyone have an idea for a better algorithm?
> > > > >
> > > > > thx,
> > > > > Guntur N. Sarwohadi
> > > > >
> > > > > PS. Neo, hows the TGB Isometric Add-On doing? :p
> > > > >
> > > > > On 7/11/06, neo binedell <[EMAIL PROTECTED] > wrote:
> > > > > >
> > > > > > Try something like this
> > > > > >
> > > > > > http://www.cedesign.com/cefx/reviews/reviews1_avbros.html
> > > > > >
> > > > > > ~neo
> > > > > >
> > > > > > -----Original Message-----
> > > > > > From: [EMAIL PROTECTED]
> > > > > > [mailto: [EMAIL PROTECTED] On Behalf
Of
> > > > > Guntur N.
> > > > > > Sarwohadi
> > > > > > Sent: 06 July 2006 03:15 AM
> > > > > > To: Flashcoders@chattyfig.figleaf.com
> > > > > > Subject: [Flashcoders] jigsaw puzzle piece algorithm
> > > > > >
> > > > > > I'm working on a puzzle game in flash, much similar to jigsaw
> > > puzzles
> > > > > you
> > > > > > see in gameHouse or such casual game publisher. I'm having a
> hard
> > > time
> > > > >
> > > > > > trying to cut an image to make it as puzzle pieces in AS2.
> > Currently
> > > > > I'm
> > > > > > doing it the hard way, cloning bitmapData image, and masking
> > > portions
> > > > > of
> > > > > > the
> > > > > > image. Can you cut parts on an image using bitmapData methods?
> And
> > > > > does
> > > > > > anyone know how to create the infamous jigsaw pattern to it as
> > well?
> > > > > >
> > > > > > Many thanks,
> > > > > > Guntur N. Sarwohadi
> > > > > > _______________________________________________
> > > > > > Flashcoders@chattyfig.figleaf.com
> > > > > > To change your subscription options or search the archive:
> > > > > > http://chattyfig.figleaf.com/mailman/listinfo/flashcoders
> > > > > >
> > > > > > Brought to you by Fig Leaf Software
> > > > > > Premier Authorized Adobe Consulting and Training
> > > > > http://www.figleaf.com
> > > > > > http://training.figleaf.com
> > > > > >
> > > > > > _______________________________________________
> > > > > > Flashcoders@chattyfig.figleaf.com
> > > > > > To change your subscription options or search the archive:
> > > > > > http://chattyfig.figleaf.com/mailman/listinfo/flashcoders
> > > > > >
> > > > > > Brought to you by Fig Leaf Software
> > > > > > Premier Authorized Adobe Consulting and Training
> > > > > > http://www.figleaf.com
> > > > > > http://training.figleaf.com
> > > > > >
> > > > > _______________________________________________
> > > > > Flashcoders@chattyfig.figleaf.com
> > > > > To change your subscription options or search the archive:
> > > > > http://chattyfig.figleaf.com/mailman/listinfo/flashcoders
> > > > >
> > > > > Brought to you by Fig Leaf Software
> > > > > Premier Authorized Adobe Consulting and Training
> > > > > http://www.figleaf.com
> > > > > http://training.figleaf.com
> > > > >
> > > >
> > > >
> > > _______________________________________________
> > > Flashcoders@chattyfig.figleaf.com
> > > To change your subscription options or search the archive:
> > > http://chattyfig.figleaf.com/mailman/listinfo/flashcoders
> > >
> > > Brought to you by Fig Leaf Software
> > > Premier Authorized Adobe Consulting and Training
> > > http://www.figleaf.com
> > > http://training.figleaf.com
> > >
> > _______________________________________________
> > Flashcoders@chattyfig.figleaf.com
> > To change your subscription options or search the archive:
> > http://chattyfig.figleaf.com/mailman/listinfo/flashcoders
> >
> > Brought to you by Fig Leaf Software
> > Premier Authorized Adobe Consulting and Training
> > http://www.figleaf.com
> > http://training.figleaf.com
> >
> _______________________________________________
> Flashcoders@chattyfig.figleaf.com
> To change your subscription options or search the archive:
> http://chattyfig.figleaf.com/mailman/listinfo/flashcoders
>
> Brought to you by Fig Leaf Software
> Premier Authorized Adobe Consulting and Training
> http://www.figleaf.com
> http://training.figleaf.com
>
_______________________________________________
Flashcoders@chattyfig.figleaf.com
To change your subscription options or search the archive:
http://chattyfig.figleaf.com/mailman/listinfo/flashcoders
Brought to you by Fig Leaf Software
Premier Authorized Adobe Consulting and Training
http://www.figleaf.com
http://training.figleaf.com
_______________________________________________
Flashcoders@chattyfig.figleaf.com
To change your subscription options or search the archive:
http://chattyfig.figleaf.com/mailman/listinfo/flashcoders
Brought to you by Fig Leaf Software
Premier Authorized Adobe Consulting and Training
http://www.figleaf.com
http://training.figleaf.com
