Timeline/button issues when publishing

Report · Jul 17, 2017

I have not used actionscript for some time (not since flash was still used for whole websites!)

I have created a rough animation for a splash page and put a stop action to the last frame.

I have then added some buttons to which I have attached actionscript to go to a webpage, however when I test the movie and when I have uploaded to the server, the movie seems to stop short of of the final frame (I know this because I added a 'test' button to the final frame which doesn't show).

I can only find actionscript on the final frame, so not sure why the movie stops before.

I have checked that I am using the right scripting (HTML5 canvas)

I get the following error message when I publish:

WARNINGS:

** 2 Bitmaps packed successfully into 1 spritesheet(s).

Frame numbers in EaselJS start at 0 instead of 1. For example, this affects gotoAndStop and gotoAndPlay calls. (20)

Content with both Bitmaps and Buttons may generate local security errors in some browsers if run from the local file system.

And javascript console brings up the following error when tested in a browser:

Uncaught TypeError: Cannot read property 'addEventListener' of undefined

at lib.rfaworldnew.frame_309 (rfa-world2.js:1484)

at a.b._runActions (createjs-2015.11.26.min.js:17)

at a.b.setPosition (createjs-2015.11.26.min.js:17)

at lib.rfaworldnew.c._updateTimeline (createjs-2015.11.26.min.js:14)

at lib.rfaworldnew.c.advance (createjs-2015.11.26.min.js:14)

at lib.rfaworldnew.c._tick (createjs-2015.11.26.min.js:14)

at a.b._tick (createjs-2015.11.26.min.js:13)

at a.b.tick (createjs-2015.11.26.min.js:13)

at a.b.update (createjs-2015.11.26.min.js:13)

The scripting I have on the animate cc file is as follows, please note, not all the buttons have had actions applied:

/* Stop at This Frame

The timeline will stop/pause at the frame where you insert this code.

Can also be used to stop/pause the timeline of movieclips.

*/

this.stop();

/* Click to Go to Web Page

Clicking on the specified symbol instance loads the URL in a new browser window.

*/

this.Reception.addEventListener("click", fl_ClickToGoToWebPage_4);

function fl_ClickToGoToWebPage_4() {

window.open("http://www.sourcegrafik.com", "_self");

}

/* Click to Go to Web Page

Clicking on the specified symbol instance loads the URL in a new browser window.

*/

this.Year1.addEventListener("click", fl_ClickToGoToWebPage_5);

function fl_ClickToGoToWebPage_5() {

window.open("http://www.sourcegrafik.com", "_self");

}

It is driving me a bit crazy as obviously I have done something incorrectly but cannot work out what!

Many Thanks

Hanniel

Report · Jul 17, 2017

It looks like you're using actionscript for a canvas project. This won't work as you've seen. You need to be using createJS code with a canvas project. If you open an Actions window, and then select the Code Snippets button at the upper right, the Code Snippets window will open. You can also get to the Code Snippets window from the Windows Menu. The snippets are divided into three sections. You want to look at the ones in the HTML5 Canvas section. The code in many respects is very similar to Actionscript.

Here's an Adobe help file that gives a good overview for working with Canvas files: Create HTML5 Canvas documents in Animate CC

Report · Jul 17, 2017

robdillon wrote
It looks like you're using actionscript for a canvas project.

The code he posted is clearly from the HTML5 Canvas snippets. AS3 doesn't use this.stop(), its addEventLIstener parameters are completely different, and window.open doesn't even exist in AS3.

It seems likely he's trying to add event listeners to buttons before they exist on the stage, or he has the name or scope wrong.

Report · Jul 17, 2017

Hi ClayUUID, you are right I am using the right scripting.

I think I worked out what you meant.... I think.

I had tweens on the buttons that ended on the final frame with the actions. i moved all the frames, apart from the one with the action script linked to it, back one so that the tweens finished before the last frame.

When I tested it, the timeline ran as normal, however, I am still getting this error message and the buttons do not seem to be working (inking to another site).

rfa-w.js:1484 Uncaught TypeError: Cannot read property 'addEventListener' of undefined at lib.rfaw.frame_309 (rfa-w.js:1484) at a.b._runActions (createjs-2015.11.26.min.js:17) at a.b.setPosition (createjs-2015.11.26.min.js:17) at a.b.setPosition (createjs-2015.11.26.min.js:17) at lib.rfaw.c._updateTimeline (createjs-2015.11.26.min.js:14) at lib.rfaw.c.advance (createjs-2015.11.26.min.js:14) at lib.rfaw.c._tick (createjs-2015.11.26.min.js:14) at a.b._tick (createjs-2015.11.26.min.js:13) at a.b.tick (createjs-2015.11.26.min.js:13) at a.b.update (createjs-2015.11.26.min.js:13)

frame_309	@	rfa-w.js:1484
b._runActions	@	createjs-2015.11.26.min.js:17
b.setPosition	@	createjs-2015.11.26.min.js:17
b.setPosition	@	createjs-2015.11.26.min.js:17
c._updateTimeline	@	createjs-2015.11.26.min.js:14
c.advance	@	createjs-2015.11.26.min.js:14
c._tick	@	createjs-2015.11.26.min.js:14
b._tick	@	createjs-2015.11.26.min.js:13
b.tick	@	createjs-2015.11.26.min.js:13
b.update	@	createjs-2015.11.26.min.js:13
b.handleEvent	@	createjs-2015.11.26.min.js:13
b._dispatchEvent	@	createjs-2015.11.26.min.js:12
b.dispatchEvent	@	createjs-2015.11.26.min.js:12
a._tick	@	createjs-2015.11.26.min.js:12
a._handleTimeout	@	createjs-2015.11.26.min.js:12

I have no clue how to decipher that, any help would be much appreciated!

Report · Jul 17, 2017

I told you a thing to do. You didn't do it.

Report · Jul 17, 2017

Sorry, I didn't refresh my browser and see your reply.

Tried what you said but got a pop up box saying "undefined" and the timeline still stopped prematurely.

I tried adding the code you gave me to the fix I found, mentioned previously, for the timeline. This time the timeline ran to the end but I still got a pop up box with "undefined"

Javascript console still coming up with the error:

rfa-w.js:1484 Uncaught TypeError: Cannot read property 'addEventListener' of undefined
    at lib.rfaw.frame_309 (rfa-w.js:1484)
    at a.b._runActions (createjs-2015.11.26.min.js:17)
    at a.b.setPosition (createjs-2015.11.26.min.js:17)
    at a.b.setPosition (createjs-2015.11.26.min.js:17)
    at lib.rfaw.c._updateTimeline (createjs-2015.11.26.min.js:14)
    at lib.rfaw.c.advance (createjs-2015.11.26.min.js:14)
    at lib.rfaw.c._tick (createjs-2015.11.26.min.js:14)
    at a.b._tick (createjs-2015.11.26.min.js:13)
    at a.b.tick (createjs-2015.11.26.min.js:13)
    at a.b.update (createjs-2015.11.26.min.js:13)

Report · Jul 17, 2017

Well there you go. There is no symbol named "Reception" and/or "Year1" on the root timeline.

Report · Jul 18, 2017

There definitely is, I created the buttons first on the timeline before i added tweens and in order to apply the action.

There is one for "Reception" and one for "Year1".

Report · Jul 18, 2017

And yet, the alert statement returns "undefined". So either the computer is mistaken, or you are.

You did actually give your buttons instance names, yes? You aren't just trying to refer to them by their library names?

Report · Jul 18, 2017

Hi ClayUUID, right so probably the easiest thing is for you to look at the files yourself, is that possible on this forum? As far as I can see I have added actions to buttons which I gave the instance names of "Reception", "Year1" etc. but maybe I am misunderstanding you or have missed something. Not blaming the computer, I completely believe I am mistaken but not sure where the mistake is and I am just telling you what is happening when I test the movie.

From the posts above it seems like it should be simple solution, but all the above suggestions I have tried have not worked.

Report · Jul 18, 2017

You can't attach files here, but if you have dropbox or any other file sharing system you could upload files there and put a link here.

Report · Jul 18, 2017

Thanks Colin!

I have put a link to animate file below:

Dropbox - rfa-w.fla

Let me know if you need anything else

Report · Jul 18, 2017

Normally when you're going to animate a named object you would make the object, set its instance name, then animate it. As you add key frames the symbol will keep its name.

If you do the animation before the naming, at each key frame you will need to enter the name again.

For your Reception button you have it named correctly on the last frame, and on the previous key frame (frame 151), but it isn't named on frame 1. Select it on frame 1 and set the name.

The Year1 button is named on the last frame, but you don't have it named on frame 1 or 169. Set the name in both places.

After that the alert message will read correctly. You may be puzzled why the name isn't known, that's a CreateJS oddity. If that is an issue there are ways around the problem.

Report · Jul 19, 2017

Brilliant! I don't remember having to name all instances when I worked in Flash MX, so I probably would have been going round in circles for a while still.

The movie is almost working as it should. I am still getting a pop up that says "[Movieclip (name=null)]". But I assume this is something similar to the above and I need to make sure all instances etc are named, correct?

Many thanks for your help and patience robdillon, ClayUUID and Colin Holgate you have also helped me pick up some key troubleshooting tips to watch out for that should ease my transition back into actionscript and Animate CC.

Hanniel

Report · Jul 19, 2017

No, the name being null is normal, and isn’t affected by what names you gave things. If you don’t need to use the name then just don’t worry about it.

Report · Jul 17, 2017

Hi robdillon, thanks for your reply.

I came across the use of wrong actionscript when I was trying to work out the issue. I have triple checked, I am defintely using HTML5 canvas script.

I think the key problem seems to be that the timeline seems to stop short of the final frame for some reason and so the buttons that have the "go to web page" actions on them don't appear in the movie (The actions are all on the last frame of the timeline).

I have gone through the original timeline and can't see any actions other than on the final frame, not sure what the issue is and the error message I got from javascript console is as clear as mud to me!

Report · Jul 17, 2017

It's reaching the final frame just fine, it's just seeming not to because your code is making it immediately crash and burn.

Stick this at the beginning of your code on the last frame:

alert(this.Reception);

alert(this.Year1);

Timeline/button issues when publishing

1 Correct answer