Adobe Edge use javascripts generetad in other projects

Question

I have made some animations in adobe Edge and it has generated 3 javascripts files : anim_ecran1_edge.js ; anim_ecran1_edgeActions.js ; anim_ecran1_edgePreload.js and my html file.

I want to use this animation in a different project with a specific listener. Can someone explain me how do that ? Regards,

Answer 1

So I had a problem similar to this awhile back, I wanted to call Adobe Edge projects to a webpages but did not want to store all the files in one location on my server, I finally found the solution there is not much information on the web how to do this so I will do my best to try to help you. So what I do know if you start moving Edges files around it gets cranky fast. So lets take my situation for an example I have a webpage in my root folder for my website and I have an Edge folder that I store all my Edge files in. In order for me to call on an animation on the web page in the root folder I need to change a few things in the edgePreload.js file, there are four things you need to change, these are what mine look like:

Edge/Icons/edge_includes/jquery-1.7.1.min.js    
Edge/Icons/edge_includes/edge.2.0.1.min.js   
Edge/Icons/icons_edge.js  
Edge/Icons/icons_edgeActions.js

*Note I would use ctrl f to find these files because this .js file is not neatly written.

You see I had to add "Edge/Icons/ so that way the .js file knows where to look. Also if you are going to have images you will need to change the edge.js file, my file looks like this "var im='Edge/Icons/images/';"

(ristenk1 I think this last step maybe what you are lacking, or you just didnt mention it, instead of using an iFrame try just using a div)

Last but not least the web page that you want these animations to show up on you need to add something that looks like this to your < head> tag. This can be in the .html file in your published edge project, every project you publish has a unique id.

!--Adobe Edge Runtime-->
<script type="text/javascript" charset="utf-8" src="Edge/Icons/icons_edgePreload.js"></script>
<style>
    .edgeLoad-EDGE-42407812 { visibility:hidden; }
</style>

Then in the body where you would like this to show up use:

<div id="Stage" class="EDGE-42407812">
</div>

Also here are a few resources I have found on this:

http://www.danielhanly.com/blog/tutorial/adobe-edge-embedding-animations-page/

http://www.vbulletin.org/forum/showthread.php?t=277838

I think I have a couple more on my work computer I will try to post them tomorrow while at work. I hope this helps if you have any questions let me know.