How much programming is in this Campus Map project?

[jambojam]

I am the Illustrator of this Campus Map. I provided an Adobe Illustrator vector file and I was done. I am very happy with how they brought it to life with the rollovers and popups. I also like the menu on the right side of the frame. My question is what went into this programming?

• Is this a complex programming project? ( I know that's relative so just YOUR opinion based on experience 1-10)
• Could this be accomplished in Animate 2020?
• It would appear to me that lots of additional JS knowledge would be needed?
• It also looks like a WordPress site. If so, where does WordPress begin and end on a graphic like this?

I am new to the programming side so please be kind. Just trying to understand the magnitude of this project from start to finish.

https://www.carrollu.edu/map

[ClayUUID]

Are you not allowed to ask the people who actually did it?

[jambojam]

I am trying to track that down. I thought this community might be helpful too. Is that OK?

[JoãoCésar]

Hi.

I'm glad you came up with a result that you like.

Answering your questions:

- Kind of. I cannot give you a score, but I would say you need a basic knowledge of JavaScript and a intermediate knowledge of Adobe Animate;

- Certainly. Here is an example of an interactive map created with Adobe Animate that has lots of similarities with the example you provided.

https://community.adobe.com/t5/animate/best-way-to-create-an-interactive-map-with-clickable-icons/td...

- As stated above.

- It doesn't seem to be a WordPress website. But keep in mind anyway that you would only use Animate for the map itself and the sidebar. The rest of the website should be developed outside the canvas using other HTML DOM elements, JavaScript, and CSS.

Please let us know if you have further questions.

Regards,

JC

[jambojam]

Thanks so much for your responses. I have made great progress but several challenges remain. For now, any input would be helpful and greatly appreciated.

1. My published file doesn't even work so I need to understand if I am publishing wrong. 

2. When you test the movie you will see that it "runs" the movie timeline. I don't want that to happen. I have tried to place a Stop() on frame 1 so there is no real movement on the timeline. However, wherever I put that stop it affects all my other actions. 

3. If you can test the .fla file you will see basic structure. The movie clip "map" has the pan and zoom script from one of JC's replies on another thread. It works great when I test the movie.  Map movie in the back has buildings that are all buttons that call up a detail box about that building. The action "gotoAndStop(5)" on the parent timeline. buildings 1-17 work but for an unknown reason, 18 and 19 don't work. Exact same code.

4. The menu on the right is also "gotoAndStop(5)" and calls up the same detail box. I then have the entire detail box act as a close button and when clicked goes back to frame one and stop.

Any help on any of the issues would be awesome. If you see a better way to do any of this that would be welcomed as well. Keep in mind I am a beginner.

Campus Map File 

or

https://drive.google.com/open?id=1IJohgEjFbJbUqGK8U7A0yTbzB0pQO7wv

[JoãoCésar]

Hi.

The issues are:

1 - You're missing a this.stop(); instruction on the first frame of the main timeline;

2 - The code inside of the map symbol has two invalid references on these two lines:

Line 155:

this.buildingBut_16.addEventListener("click",buildingBut_16Clicked.bind(this));

Line 165:

this.buildingBut_17.addEventListener("click",buildingBut_17Clicked.bind(this));

If you fix these problems, then your content is going to run as expected.

Also, if you're using a recent version of Adobe Animate, go to File > Publish Settings... > JavaScript/HTML > Image Settings > Export Image > Export as and choose Texture from the dropdown menu for better performance.

For extra tips about performance, please check out the comment that starts with "Excellent!" in this thread.

Regards,

JC

[jambojam]

Thank you, JC for all you do.  This will keep me busy for a while but I am sure I will be back.

Thanks again!!

[jambojam]

https://drive.google.com/open?id=1dFRqOs6-ekDvrtp232mwojGDznYYerfn

Hey JC,

I made some progress.  All the links in the menu on the right work.  They bring up the popup about each building. When I click the popup it goes away (by going back to frame one).  However, when I trigger the popups by clicking the buildings, which are in the "map" movie, they popup and appear as intended. Good so far... but I cannot close them by clicking. A few do close but most do not.  This is a mystery to me. Once the popup is called and appears, why would it work when called up from the main timeline action, but not work when called up from the Map movie? The popup is the same and the action is the same but it seems to not bring up the action when triggered by the building buttons.

Also, I tried to publish it as directed above.  I do get the entire image now but it has no working buttons or actions.

Thanks again for any insight.

Jim