Button on first frame doesn't work with Math.random()

New Here ,
May 12, 2021 May 12, 2021

Copy link to clipboard

Copied

Hi everyone,

 

I've run into a weird problem in Adobe Animate with the randomizer, and I can't find the solution for it through google. I'm creating a product slideshow banner with 5 frames total. It will have previous and next buttons, and each frame will have a ClickToGoToWebPage button leading to the product's page.

 

The slide and buttons work great, with and without the randomizer, but I have noticed that when the page initially loads, the first frame's button to the webpage does nothing, no matter how many times I click on it. If I scroll to the next slide with the previous/next buttons, then all the buttons are fine.

 

It's always the button on the first slide that doesn't seem to work with the randomizer. I know it's the randomizer, because without it, the button on the first frame works as it should.

 

Does anyone have any tips on what I should check?

Here's my code from the first frame, and I've attached a crude screenshot, if it helps!

 

var nextFrame = 0
var totalFrames = 4;

this.gotoAndStop(1+Math.random()*5);
this.stop();


this.next.addEventListener("click", fl_ClickToGoToAndStopAtFrame.bind(this));

function fl_ClickToGoToAndStopAtFrame()
{
	nextFrame++;
	
	if(nextFrame > totalFrames) {
		nextFrame = 0;
		this.gotoAndStop(nextFrame);
	}
	else {
		this.gotoAndStop(nextFrame);
	}
}


this.previous.addEventListener("click", fl_ClickToGoToAndStopAtFrame_3.bind(this));

function fl_ClickToGoToAndStopAtFrame_3()
{
	nextFrame--;
	
	if(nextFrame < 0) {
		nextFrame = totalFrames;
		this.gotoAndStop(nextFrame);
	}
	else {
		this.gotoAndStop(nextFrame);
	}
}


/* Click to Go to Web Page, corrected with IF statement */

this.product1_cta.addEventListener("click", fl_ClickToGoToWebPage);

function fl_ClickToGoToWebPage() {
	window.open("https://www.google.com", "_blank");
	
	if(!this.started) {
		this.product1_cta.addEventListener("click", fl_ClickToGoToWebPage);
		this.started = true;
	}
}

 

TOPICS
ActionScript

Views

203

Likes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines

correct answers 1 Correct answer

Adobe Community Professional , May 12, 2021 May 12, 2021
It's possible your web page click listener isn't working because you're trying to add it before the clip actually exists. Try adding a one-frame delay. Also, this code is needlessly redundant: nextFrame++; if(nextFrame > totalFrames) { nextFrame = 0; this.gotoAndStop(nextFrame); } else { this.gotoAndStop(nextFrame); } Should be: nextFrame++; if (nextFrame > totalFrames) { nextFrame = 0; } this.gotoAndStop(nextFrame); Or even just: nextFrame = nextFrame < totalFrames ? nextFrame + 1 : 0; t...

Likes

Translate

Translate
Adobe Community Professional ,
May 12, 2021 May 12, 2021

Copy link to clipboard

Copied

It's possible your web page click listener isn't working because you're trying to add it before the clip actually exists. Try adding a one-frame delay.

 

Also, this code is needlessly redundant:

nextFrame++;
if(nextFrame > totalFrames) {
	nextFrame = 0;
	this.gotoAndStop(nextFrame);
}
else {
	this.gotoAndStop(nextFrame);
}

Should be:

nextFrame++;
if (nextFrame > totalFrames) {
	nextFrame = 0;
}
this.gotoAndStop(nextFrame);

Or even just:

nextFrame = nextFrame < totalFrames ? nextFrame + 1 : 0;
this.gotoAndStop(nextFrame);

Likes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
New Here ,
May 12, 2021 May 12, 2021

Copy link to clipboard

Copied

Thank you! I got the nextframe++ if/else code from a youtube tutorial, because I'm still learning. Thank you for cleaning it up.

 

I extended my timeline by one frame and shifted the math.random() and next/previous button event listeners to frame 0 instead. The event listeners for the web page buttons are on their own frame (1-5) with their individual products.

 

However, I think the issue is with this.gotoAndStop vs this.gotoAndPlay when being used with the Math.random(). I tried out Stop at Frame 0 and it gave me the initial issue again with the button not working on launch, but it works when I try it with Play! The only issue I have when using Play is that it very briefly (for less than a second) loads a frame from 1 to 5 and then stops at another random one.

 

Functionally it works on load now, but it's going to an extra frame on launch rather than going straight to the random number.

 

Here's how I currently have it on Frame 0:

var nextFrame = 1;
var totalFrames = 5;
var randomFrame = Math.random()*5;

this.next.addEventListener("click", fl_ClickToGoToAndStopAtFrame.bind(this));

function fl_ClickToGoToAndStopAtFrame()
{
	nextFrame++;
	if (nextFrame > totalFrames) {
	nextFrame = 1;
}
	this.gotoAndStop(nextFrame);
}


this.previous.addEventListener("click", fl_ClickToGoToAndStopAtFrame.bind(this));

function fl_ClickToGoToAndStopAtFrame()
{
	nextFrame--;
	
	if(nextFrame < 1) {
	nextFrame = totalFrames;
}
	this.gotoAndStop(nextFrame);
}

this.gotoAndPlay(randomFrame);

 

Here's how I have it on Frame 1 (with the first product):

/* Product 1 Link */

this.stop();

this.product1_cta.addEventListener("click", fl_ClickToGoToWebPage);

function fl_ClickToGoToWebPage() {
	window.open("https://www.google.com", "_blank");
	
	if(!this.started) {
		this.product1_cta.addEventListener("click", fl_ClickToGoToWebPage);
		this.started = true;
	}
}

 

Do you think it would be helpful to preload randomFrame in someway before it executes everything? It seems to be calculating it live, which is why it looks like jumps a frame before landing on a random one.

Likes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
New Here ,
May 13, 2021 May 13, 2021

Copy link to clipboard

Copied

LATEST

I think I figured it out! This solved the extra frame blip on launch, and also the button not working for the first frame. I have this on Frame 0 before everything else:

 

var randomFrame = Math.random()*5;
var lastPicked = randomFrame - 1;

this.gotoAndPlay(randomFrame);
{
	if (randomFrame == currentFrame){
		randomFrame = lastPicked;
	}
}

 

Not sure if that's the best way to write it, but let me know. Thank you!

Likes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines