Firefox crashing using timelinemax [SOLVED]

[mindspaced]

Hi Jack (and others)

 

I've got a very cool use of timelinemax (imho), which I look forward to sharing as soon as it goes live. It involves synching dozens of animations and embedded timelines with an audio track and scrubber. However, I just discovered that I'm having issues with firefox crashing on Windows only. Seems to be working fine in all other browsers/platforms tested.

 

FF is running flash player version 10,0,42,34. I also tried 10,0,12,36 with the same results. I tried ff 3.5.7, 3.5.8, and 3.6, again with same results.

 

I realize I'm being vague, but my question is how to troubleshoot the problem. I tried searching the forums for other users with the same problem but no results.

 

Thanks!

[GreenSock]

I'm not aware of any browser-specific issues with TweenLite/Max or TimelineLite/Max (I'm not aware of any bugs at all in fact). You are using the latest version of the code, right? If not, please update ASAP. Otherwise, if you're still having trouble, please post a SUPER simple FLA that demonstrates the issue so that we can troubleshoot (it's really tough to troubleshoot blind)

[mindspaced]

Well I continue to have bizarre issues with that swf crashing....

 

The swf is now public, so you can see it at http://elluminate.com/

 

Click on the "elluminate in 50 seconds" link and use the scrubber at the bottom right. It works fine on mac, crashes on windows.

 

Interestingly, I pared down the file dramatically, and stumbled upon the fact that if I move the scrubber to the top left quadrant of the swf, it stops crashing. Seems like bizarre behavior.

 

The mouseup handler is as follows, in case that offers any insight (given that it crashes onMouseUp):

function mouseUpHandler(e:MouseEvent):void{
stage.removeEventListener(MouseEvent.MOUSE_UP, mouseUpHandler);
if( dragging )
{
	// Stop drag
	scrubber.thumb.stopDrag();

	// Seek
	var selectedTime:Number = (scrubber.thumb.x - 1 ) / scrubber.width;
	phTime = Math.round(selectedTime * phLength);

	tl.gotoAndPlay(phTime);
	soundManager.playSound("vo", 1, phTime*1000);
	isPlaying = true;	
	dragging = false;
}
}

[GreenSock]

Yeah, you've definitely got something odd going on in there. Tough to say without having access to the source. Have you traced out the values you're plugging in to see if you've got anything strange (like if you divide 0 by a number and end up with INFINITY)? If you're still having trouble, please send the source for review. And make sure you've got the latest version of the GreenSock classes.

[TronicVolta]

I couldn't get it to crash, and I have Windows XP - FF 3.6.2 - Flash Player 10,1,51,95 Debug. Although, when you click on 5 Reasons to use Elluminate, the scrubber and CC are stop receiving mouse events. Also, if you move the scrubber back once it's reached the end, and then click on 5 Reasons to Elluminate quickly, it get's funky. Check out the image below.

 

[mindspaced]

Well, as TronicVolta pointed out, the bug is fixed, though not exactly identified. There's an enter_frame loop that updates the thumb position on the scrubber. The code is as follows:

function onLoop(event:Event):void
{
if(!dragging){
	scrubber.thumb.x = tl.totalProgress * 130;
}
}

The fix? Add an else statement there. Weird! Previously, the vid would just pause while scrubbing. But then I discovered greensock's timeline method of gotoAndStop(). I figure, why not display the frame that the thumb represents to the user while scrubbing. When I did that, browsers in windows stopped crashing. Not only did it fix my problem, but it's now a much cooler scrubber. Thanks Jack for your animation awesomeness! See updated code below:

 

function onLoop(event:Event):void
{
if(!dragging){
	scrubber.thumb.x = tl.totalProgress * 130;
}else{
	var scrubTime:Number = scrubber.thumb.x / 130 * tl.totalDuration;
	tl.gotoAndStop(scrubTime);
}
}

[ukla]

Nice looking presentation. Good work!

 

Tell me ... how are you applying the perspective shadows?

[mindspaced]

Tell me ... how are you applying the perspective shadows?

 

Thanks! I created some custom classes for the popups (one for text, another for images). The images are loaded using a basic loader, and then I duplicate the bitmap and run the following code to throw it on a timeline (using timelineLite) and have it popup:

 

var image:Bitmap = Bitmap(loader.content);
		var duplicate:Bitmap = duplicateImage(image);
		s = new Sprite();
		s.addChild(duplicate);
		duplicate.y = -loader.height - 20;
		s.rotationX=-90;
		s.alpha = .2;
		this.addChild(s);
		this.addChild(p);

		OverwriteManager.init(OverwriteManager.NONE);

		tl = new TimelineLite();
		tl.insert(TweenMax.from(p, .1,{autoAlpha:0, ease:Elastic.customEaseOut, onStart:setTriggers}));
		tl.insert(TweenMax.from(s, .01, {autoAlpha:0}));
		tl.insert(TweenMax.to(s, .01, {blurFilter:{blurX:25, blurY:25},tint:0x225180}));

		tl.insert(TweenMax.to(p, 1.5,{rotationX:0,ease:Elastic.customEaseOut}));
		tl.insert(TweenMax.to(s, 1.5,{rotationX:-75, ease:Elastic.customEaseOut}));

		tl.insert(TweenMax.to(p, .4,{rotationX:-90, onComplete:eventComplete}), l);
		tl.insert(TweenMax.to(p, .2,{autoAlpha:0, delay:.2}), l);
		tl.insert(TweenMax.to(s, .4,{rotationX:-90, autoAlpha:0}), l);

[ukla]

Cool.

 

Was hoping that you developed a perspective shadow class!