Looping Through Transitions Params

[kwesijc]

There are six objects on the screen. The user taps the 3 objects in the order in which they saw it flash on the previous scene.
 

Here is my code below. Keep I mind the code is pulling from different modules.

local fruitShuffle = require("TableShuffle") local dragFruits = require("dragObject") local fruits = require("fruits") local flashObjects = ("flashObjects") local objectData = require("objectData") local fruitSheet = graphics.newImageSheet( "fruits.png", fruits:getSheet() ) local t = objectData.Fruits shuffle(t) local s = {t[1],t[2],t[3],t[4],t[5],t[6]} -- Shuffle 6 frames order from original Image Sheet shuffle(s) -- Pulling frames from Shuffle table "s" showFruitsSeqData = { {name="S1",sheet=fruitSheet,frames={s[1]} }, {name="S2",sheet=fruitSheet,frames={s[2]} }, {name="S3",sheet=fruitSheet,frames={s[3]} }, {name="S4",sheet=fruitSheet,frames={s[4]} }, {name="S5",sheet=fruitSheet,frames={s[5]} }, {name="S6",sheet=fruitSheet,frames={s[6]} } } -- configure size and placement for each frame store in table data local showFruitsData = { {frameIndex=s[1], width=80, height=80, x=50, y=25}, {frameIndex=s[2], width=80, height=80, x=display.contentCenterX, y=25 }, {frameIndex=s[3], width=80, height=80, x=270, y=25 }, {frameIndex=s[4], width=80, height=80, x=50, y=150 }, {frameIndex=s[5], width=80, height=80, x=display.contentCenterX, y=150 }, {frameIndex=s[6], width=80, height=80, x=270, y=150 } } local fruitsTransition = { {time=1000, x=50 ,y=400, onComplete}, {time=1000, x=display.contentCenterX, y=400, onComplete}, {time=1000, x=270, y=400, onComplete} } local function moveIt(event) for i = 1,#fruitsTransition do transition.to(event.target, fruitsTransition[i] ) return true end end -- Looping the data from the ShowFruitsData Table & enabling objects to to drag for i = 1,#showFruitsData do showFruits = display.newImageRect( fruitSheet, showFruitsData[i].frameIndex, showFruitsData[i].width, showFruitsData[i].height ) showFruits.x=showFruitsData[i].x showFruits.y=showFruitsData[i].y -- transition.to(showFruits, {time=1000, x=display.contentCenterX ,y=400, onComplete} ) -- Add touch sensitivity to object -- showFruits:addEventListener( "touch", dragObj ) showFruits:addEventListener( "tap", moveIt) end

When I tap on the fruits it keep going to the first position. It is not looping to the next transition position.

local fruitsTransition = { {time=1000, x=50 ,y=400, onComplete}, {time=1000, x=display.contentCenterX, y=400, onComplete}, {time=1000, x=270, y=400, onComplete} } local function moveIt(event) for i = 1,#fruitsTransition do transition.to(event.target, fruitsTransition[i] ) return true end end

To get a better idea of what I am trying to do would be the popular 4 Pics 1 Word game. In that game the user tap the letter and each one goes into a sequential position based on the order in which you tap the letter to form a word.

I am trying to figure a way to do this for the objects. Any help will be appreciated. Thanks.

[roaminggamer]

1. You have not defined an onComplete in that table.

2. Your onComplete needs  to be the same function.

3. This is ONE way of many to do it:

   local fruitsTransition = { {time=1000, x=50 ,y=400 }, {time=1000, x=display.contentCenterX, y=400 }, {time=1000, x=270, y=400 } } local function onComplete( self ) self.transNum = self.transNum + 1 if( self.transNum > #fruitTransition ) then return end end fruitsTransition[self.transNum].onComplete = self transition.to( self, fruitsTransition[self.transNum] ) end local function moveIt( event ) local target = event.target target.onComplete = onComplete target.transNum = 0 target:onComplete() return true end

[ldurniat]

I’m not sure but you need use variable to keep track which parameters (table) for transition use for tapped fruit.

local index = 1 local function moveIt( event )     transition.to( event.target, fruitsTransition[index] )    index = index + 1      return true end

Note:

for i = 1,#fruitsTransition do transition.to(event.target, fruitsTransition[i] )  return true end

Your for loop runs only once. After it reach return statement it stops iterate.

To run some code (yourListener function) after transition completed use  onComplete parameter like that 

transition.to( yourObject, { time=1000, x=50 ,y=400, onComplete=yourListener } )

[roaminggamer]

An alternate way to code what I showed above that may be more clear:

local function moveIt( event ) local target = event.target transition.cancel( target ) local fruitsTransition local transNum = 0 function target.onComplete( self ) transNum = transNum + 1 if( transNum \> #fruitTransition ) then return end fruitsTransition[transNum].onComplete = self transition.to( self, fruitsTransition[transNum] ) end fruitsTransition = { {time=1000, x=50 ,y=400, onComplete = target }, {time=1000, x=display.contentCenterX, y=400, onComplete = target }, {time=1000, x=270, y=400, onComplete = target }, } target:onComplete() return true end

[roaminggamer]

Sorry, but I only focused on the transition loop (as per the title).

I did not address the implied (is there a better way to do this) question.

A link to a YouTube video and a time in the video to watch would help us understand what you want to do.  I don’t play the game mentioned, so it doesn’t connect with me and while I could find a random 4 pic video I might not be seeing what you’re visualizing.

[ldurniat]

@roaminggamer:

1. Should be #fruitsTransition instead of #fruitTransitions

2. I  think line 

   fruitsTransition[transNum].onComplete = self

 in target.onComplete function is useless since you specify onComplete parameter later. 

[roaminggamer]

Probably.  I may have typoed.  I generally rely on the OPs to catch them.  I’ll check and correct above.

PS - I make that mistake often.  My ‘writing’ mind is adding an ‘s’ when I know something is plural…

#transitions becomes ‘number of transitions’ in my mind, then I add an ‘s’.  Again, I do this often.  :blink:

[kwesijc]

I want to thank the both of you on helping me with this issue.  The code works but it is not exactly what I am looking for.

Here is the link below.

https://www.youtube.com/watch?v=Z3WB5DnAWXQ

As the user clicks the letter it goes to a fix position. Example word CAT. User taps C goes position 1, taps A goes to position 2, taps T goes to position 3.

Now imagine these were the positions he used based in my code

“C” {time=1000, x=50 ,y=400, onComplete = target },
“A”{time=1000, x=display.contentCenterX, y=400, onComplete = target },
“T” {time=1000, x=270, y=400, onComplete = target }
 

I am using 3 for now but it will increase. Now after the user taps T the tap should end because there is no more positions to fill.

I am trying to accomplish that with my objects in the code. Hopefully that video made it clear.

[nick_sherman]

Just store the x, y target positions in a table. Track how many positions are filled. If filled < number of positions available, pull the data at that location and use it to transition.

[kwesijc]

@nick_sherman I will give It a try and let you all know the results.

[kwesijc]

Thank you all for helping me out. I got the code to work.

If you look at the original this is what I added.

local number = 0 local textField = display.newText(number, 30, 30, native.systemFont, 25) local function moveIt(event) number = number + 1 textField:removeSelf() textField = display.newText(number, 30, 30, native.systemFont, 25) for i = number,#fruitsTransition do transition.to(event.target, fruitsTransition[i] ) return true end end

This is how the program runs. Now that you see it is there a more efficient way of writing this code? Keep I mind I am looking to make this scalable where it can handle multiple transitions with more objects in various positions on the screen in the future. Consider this level 1.

Any guidance will help. Thank you.

[sharedmedia=core:attachments:7342]

[roaminggamer]

1. You have not defined an onComplete in that table.

2. Your onComplete needs  to be the same function.

3. This is ONE way of many to do it:

   local fruitsTransition = { {time=1000, x=50 ,y=400 }, {time=1000, x=display.contentCenterX, y=400 }, {time=1000, x=270, y=400 } } local function onComplete( self ) self.transNum = self.transNum + 1 if( self.transNum > #fruitTransition ) then return end end fruitsTransition[self.transNum].onComplete = self transition.to( self, fruitsTransition[self.transNum] ) end local function moveIt( event ) local target = event.target target.onComplete = onComplete target.transNum = 0 target:onComplete() return true end

[ldurniat]

I’m not sure but you need use variable to keep track which parameters (table) for transition use for tapped fruit.

local index = 1 local function moveIt( event )     transition.to( event.target, fruitsTransition[index] )    index = index + 1      return true end

Note:

for i = 1,#fruitsTransition do transition.to(event.target, fruitsTransition[i] )  return true end

Your for loop runs only once. After it reach return statement it stops iterate.

To run some code (yourListener function) after transition completed use  onComplete parameter like that 

transition.to( yourObject, { time=1000, x=50 ,y=400, onComplete=yourListener } )

[roaminggamer]

An alternate way to code what I showed above that may be more clear:

local function moveIt( event ) local target = event.target transition.cancel( target ) local fruitsTransition local transNum = 0 function target.onComplete( self ) transNum = transNum + 1 if( transNum \> #fruitTransition ) then return end fruitsTransition[transNum].onComplete = self transition.to( self, fruitsTransition[transNum] ) end fruitsTransition = { {time=1000, x=50 ,y=400, onComplete = target }, {time=1000, x=display.contentCenterX, y=400, onComplete = target }, {time=1000, x=270, y=400, onComplete = target }, } target:onComplete() return true end

[roaminggamer]

Sorry, but I only focused on the transition loop (as per the title).

I did not address the implied (is there a better way to do this) question.

A link to a YouTube video and a time in the video to watch would help us understand what you want to do.  I don’t play the game mentioned, so it doesn’t connect with me and while I could find a random 4 pic video I might not be seeing what you’re visualizing.

[ldurniat]

@roaminggamer:

1. Should be #fruitsTransition instead of #fruitTransitions

2. I  think line 

   fruitsTransition[transNum].onComplete = self

 in target.onComplete function is useless since you specify onComplete parameter later. 

[roaminggamer]

Probably.  I may have typoed.  I generally rely on the OPs to catch them.  I’ll check and correct above.

PS - I make that mistake often.  My ‘writing’ mind is adding an ‘s’ when I know something is plural…

#transitions becomes ‘number of transitions’ in my mind, then I add an ‘s’.  Again, I do this often.  :blink:

[kwesijc]

I want to thank the both of you on helping me with this issue.  The code works but it is not exactly what I am looking for.

Here is the link below.

https://www.youtube.com/watch?v=Z3WB5DnAWXQ

As the user clicks the letter it goes to a fix position. Example word CAT. User taps C goes position 1, taps A goes to position 2, taps T goes to position 3.

Now imagine these were the positions he used based in my code

“C” {time=1000, x=50 ,y=400, onComplete = target },
“A”{time=1000, x=display.contentCenterX, y=400, onComplete = target },
“T” {time=1000, x=270, y=400, onComplete = target }
 

I am using 3 for now but it will increase. Now after the user taps T the tap should end because there is no more positions to fill.

I am trying to accomplish that with my objects in the code. Hopefully that video made it clear.

[nick_sherman]

Just store the x, y target positions in a table. Track how many positions are filled. If filled < number of positions available, pull the data at that location and use it to transition.

[kwesijc]

@nick_sherman I will give It a try and let you all know the results.