isaballoon

Moving from AS3 to JS - how can I recreate this functionality (as accomplished in AS3) with GSAP? (Button is an image). btn.addEventListener(MouseEvent.MOUSE_OVER, over); btn.addEventListener(MouseEvent.MOUSE_OUT, out); function over(e:MouseEvent):void { TweenLite.to(btn, 1, {alpha: 1}); } function out(e:MouseEvent):void { TweenLite.to(btn, 1, {alpha: .6}); } Thanks guys

Excellent. I'll give it a shot. Thanks Rodrigo!

Is there a parameter setting for autoAlpha enabling you to fade up to a value of <1? If not, what would be next best solution? Thanks

figured it out. Here's what works: start.addEventListener(MouseEvent.CLICK, animate); startStop.addEventListener(MouseEvent.CLICK, startStop); private function animate(e:MouseEvent):void { isMoving = true; start.removeEventListener(MouseEvent.CLICK, animate); start.visible = false; tl = new TimelineMax({repeat:-1}); tl.append(TweenMax.to(ball, .4, {x:twoXPos, ease:Linear.easeNone})); tl.append(TweenMax.to(ball, .1, {y:threeYPos, ease:Linear.easeNone})); tl.append(TweenMax.to(ball, .4, {x:fourXPos, ease:Linear.easeNone})); tl.append(TweenMax.to(ball, .1, {y:oneYPos, ease:Linear.easeNone})); } private function startStop(e:MouseEvent):void { if(isMoving) { tl.pause(); ct = tl.currentTime // recording current time isMoving = false; } else { tl.gotoAndPlay(ct); // playing from that current time isMoving = true; } }

How is it possible to record the 'stop' position (derived from a CLICK of 'stop' button) and have it continue from that point on restart (toggling a 'startStop' button). Question I have is in coding of the 'startStop' handler. Here's what I've got (I haven't included the variables set up as a way of keeping it simple): start.addEventListener(MouseEvent.CLICK, animate); startStop.addEventListener(MouseEvent.CLICK, startStop); private function animate(e:MouseEvent):void { isMoving = true; start.removeEventListener(MouseEvent.CLICK, animate); start.visible = false; tl = new TimelineMax({repeat:-1}); tl.append(TweenMax.to(ball, .4, {x:twoXPos, ease:Linear.easeNone})); tl.append(TweenMax.to(ball, .1, {y:threeYPos, ease:Linear.easeNone})); tl.append(TweenMax.to(ball, .4, {x:fourXPos, ease:Linear.easeNone})); tl.append(TweenMax.to(ball, .1, {y:oneYPos, ease:Linear.easeNone})); } private function startStop(e:MouseEvent):void { if(isMoving) { tl.pause(); cp = tl.currentProgress // recording current progress isMoving = false; } else { tl.restart(); isMoving = true; } } Any help is greatly appreciated.

Is it possible with these classes to create a multiply effect similar to the multiply layer mode effect you get in Photoshop between two overlapping objects? If so are the methods documented? Don't see anything here along these lines. TIA

More than happy to donate Jack. Overdue really. Anyway here's the rub. Once logged in I fail to see a download button anywhere. Just the green "become a member..." button. Call me blind but I just don't see it. Please help.

Is there a way to download the Greensock member classes outside of SVN? I have donated and have no SVN account.

My vote for the most valuable person to the Flash platform... and I don't say that lightly.

What a beautiful thing

Is it possible to ply multiple filters on a single object simultaneously (say the colorTransformMatrix filter and the blur filter)? If so, how? Thanks

I believe you can create a custom tween with just the effect you're looking for. Try this.. http://blog.greensock.com/customease/

Nice! Thank you.

I have a question about nullifying colorization via manipulations of the colorMatrixFilter. I understand how to tween the value back to 0, but my I'm not sure how to get there without a tween... setting to a value of 0 straight away. Can someone show me how this is possible in the context of the following code? TIA import com.greensock.*; import com.greensock.easing.*; var one:String = "yes"; var slide:TweenMax; stage.addEventListener(MouseEvent.CLICK, move); function move(e:MouseEvent):void { switch (one) { case "yes": TweenMax.to(clip, 1, {colorMatrixFilter:{colorize:0x33cc33, amount:0.7}}); one = "no"; break; case "no": // code to de-colorize clip without tweening goes here one = "yes"; break; } }

Got it. Simple oversite on my part. Thanks for the help.

Trying the reverse() method for the first time. Created this very simple animation as a test file and the following code isn't working for me (below). I get a null object reference error. What gives? (The commented-out line DOES work however). TIA. import com.greensock.*; import com.greensock.easing.*; var one:String = "yes"; stage.addEventListener(MouseEvent.CLICK, move); function move(e:MouseEvent):void { switch (one) { case "yes": var slide:TweenMax = new TweenMax(clip, 1, {x:300}); one = "no"; break; case "no": //TweenMax.to(clip, 1, {x:75}); slide.reverse(); one = "yes"; break; } }

My thought was to run the tween then call the disabling upon its completion. My attempt (see below) didn't work however.. import com.greensock.*; import com.greensock.easing.*; var clipArray:Array = [one, two, three, four, five]; for (var i:int = 0; i < clipArray.length; i++) { clipArray[i].buttonMode = true; clipArray[i].addEventListener(MouseEvent.CLICK, clickHandler); clipArray[i].addEventListener(MouseEvent.ROLL_OVER, over); clipArray[i].addEventListener(MouseEvent.ROLL_OUT, out); } function clickHandler(event:MouseEvent):void { for (var i:int = 0; i < clipArray.length; i++) { if (event.currentTarget == clipArray[i]) { //TweenMax.to(clipArray[i], 1, {colorMatrixFilter:{brightness:2}}); TweenMax.to(clipArray[i], 1, {colorMatrixFilter:{brightness:2}, onComplete: disable}); } else { clipArray[i].mouseEnabled = true; clipArray[i].buttonMode = true; clipArray[i].alpha = 1; TweenMax.to(clipArray[i], 1, {colorMatrixFilter:{brightness:1}}); } function disable():void { clipArray[i].mouseEnabled = false; clipArray[i].buttonMode = false; } } } function over(event:MouseEvent):void { TweenMax.to(event.currentTarget, .3, {colorMatrixFilter:{brightness:1.5}}); } function out(event:MouseEvent):void { TweenMax.to(event.currentTarget, .3, {colorMatrixFilter:{brightness:1}});

Well that's interesting. Is there a solution that comes to mind now that you seem to understand my intent with this (if it isn't an inconvenience)?

This is the part I'm not understanding... why setting mouseEnabled to false calls the 'out' event. If anything it seems the 'over' is the one that might be called since the mouse is currently over 'one.' That being the case the overwrite makes sense of course. I'm just not sure what the solution is just yet. By the way I wasn't calling into question your coding of TweenMax. I expected the shortcoming was on my end. Thanks for your time.

Hm. If I replace the TweenMax code with simple alpha settings (commented out in the code) it works just fine for me. I get the tween on the "click" and I get alpha changes on rollOver and rollOut. If I get the alpha changes shouldn't I be able to get tweens as well? This is what is confusing me here and leading me to believe it's a conflict with the tweens. I did what you suggested replacing tweens with traces and it seems to me all the actions are triggering as they should. I still think it's a tweening thing. Regardless, I do appreciate your taking time to look into it as always. Thank you.

Here, I'll make is easy on you. Here's the stripped down fla - http://toghaus.com/forjack.html TIA

Sorry, it doesn't throw errors, I mispoke. What happens is it doesn't execute the colorMatrixFilter tweens in the clickHandler function. Definitely feels like an overwrite issue. Happy to send over the fla if that helps. I stripped the file down to just the five mcs (buttons).

Yeah, just re-downloaded it to make sure and it still throws errors. If you've got a minute...

Jack, loving your new platform. Spent the past weekend kicking the tires. Question, in using the following code I'm discovering that the brightness tweens in the 'over' and 'out' functions seem to be overwriting the tweens in the clickHandler function. What's the story here? Not sure what to do about this. Any help is greatly appreciated. import com.greensock.*; import com.greensock.easing.*; var clipArray:Array = [one, two, three, four, five]; for (var i:int = 0; i < clipArray.length; i++) { clipArray[i].buttonMode = true; clipArray[i].addEventListener(MouseEvent.CLICK, clickHandler); clipArray[i].addEventListener(MouseEvent.ROLL_OVER, over); clipArray[i].addEventListener(MouseEvent.ROLL_OUT, out); } function clickHandler(event:MouseEvent):void { for (var i:int = 0; i < clipArray.length; i++) { if (event.currentTarget == clipArray[i]) { clipArray[i].mouseEnabled = false; clipArray[i].buttonMode = false; TweenMax.to(clipArray[i], 1, {colorMatrixFilter:{brightness:2}}); } else { clipArray[i].mouseEnabled = true; clipArray[i].buttonMode = true; clipArray[i].alpha = 1; TweenMax.to(clipArray[i], 1, {colorMatrixFilter:{brightness:1}}); } } } function over(event:MouseEvent):void { TweenMax.to(event.currentTarget, .3, {colorMatrixFilter:{brightness:1.3}}); } function out(event:MouseEvent):void { TweenMax.to(event.currentTarget, .3, {colorMatrixFilter:{brightness:1}}); }