Edge Animate loads JS files twice

HI,
Does anyone know why Edge animate loads all the javascript files and JQuery and Edge Libraries twice. Is there a way to prevent or override this?
When profiling my animation with Safari and Chrome, in the Network requiements you can see that these file are loaded twice, increasing the network requirements.
It seems that the first time the format is not recognized given that the icon next to the files is for IMG. The second time it is loaded then it gets the icon for JS.
Has anyone seen this?

Sarah,
Yes, this is the only way Yepnope 1.0.x works and 1.5.x still does such things. There are changes in this area in 1.5.x though. Yepnope exposed two direct methods to inject JS and CSS files. So yepnope({load: ...}) will preload files first and inject them after. Direct methods don't preload files. As far as Edge Animate doesn't use full power of yepnope, there is good chance that direct method will work good:
yepnope.injectJs( scriptSource [, callback ] [, elemAttributes ] [, timeout ]);
yepnope.injectCss( stylesheetSource [, callback ] [, elemAttributes ] [, timeout ]);
Simplest testcase:
<!DOCTYPE html>
<html>
<head>
          <script src="http://cdnjs.cloudflare.com/ajax/libs/yepnope/1.5.4/yepnope.min.js"></script>
          <script>
                    yepnope.injectCss('http://cdnjs.cloudflare.com/ajax/libs/1140/2.0/1140.css');
                    yepnope.injectJs('http://cdnjs.cloudflare.com/ajax/libs/Base64/0.1.3/base64.min.js')
          </script>
</head>
<body>
</body>
</html>

Similar Messages

Edge Animate loading jquery twice. External jquery plugin error.

I recently created an interactive map (http://www.lakesofbellaterra.com/Interactive_Map_Demo/Testing/test1.html) using Edge Animate CC 2014.1.1 Release. I used the zoom.min.js plugin from jQuery Zoom to achieve the zooming image effect present when you click on one of the map section and reveal the "section modal". Further more the zoom.js plugin uses jquery 1.7.1. I am deploying this Edge Animate project in a Business Catalyst site using a content holder. Even though the zoom.js plugin works with Internet Explorer 7+ and Firefox I initially was not able to get the zoom.js plugin to work in either browser. After changing the <meta> in the <head> to <meta http-equiv="X-UA-Compatible" content="IE=10,chrome=1"> via suggestion from StackOverflow (internet explorer - What's the difference if <meta http-equiv="X-UA-Compatible" content="IE=edge"> exists or not? - Stac…) I was able to get the zoom image function to work in Internet Explorer 9+. So now I just need to get this function working in the current version of Firefox 35.0.1. As of now when I click on the zoom image nothing happens. The console in firebug reports the following JS related errors:
Using //@ to indicate sourceMappingURL pragmas is deprecated. Use //# instead jquery.min.js:1
The character encoding of a framed document was not declared. The document may appear different if viewed without the document framing it. LOBT-IxD-SectionMap_edge.js
The character encoding of a framed document was not declared. The document may appear different if viewed without the document framing it. jquery-1.7.1.min.js
The character encoding of a framed document was not declared. The document may appear different if viewed without the document framing it. jquery.easing.1.3.js
The character encoding of a framed document was not declared. The document may appear different if viewed without the document framing it. jquery.zoom-min.js
The character encoding of a framed document was not declared. The document may appear different if viewed without the document framing it. jquery.zoom-min.js
Use of getPreventDefault() is deprecated. Use defaultPrevented instead.
After some research I found a lead (WordPress › Support » how to prevent jquery loading twice?) That suggested that Edge Animate may be loading jquery twice, and that may be the source of the errors. I need to find out why this animation is not working in Firefox.
Here is a list of things I have already tried that did not work:
-Changing the utf charset to : <meta http-equiv="Content-type" content="text/html;charset=UTF-8">
-Changing the version of jquery used from 1.7.1 to the latest release of 1.11.2
-Changing the image source referenced in the zoom.js call from a .svg to a .png
-Removing any scripts that may conflict with Edge Animate or zoom.min.js that are being called from within the Business Catalyst page template.
-Running the project outside of Business Cataylst to see if the error persists (it does)
Here a link to the Edge Animate project: Dropbox - LOBT Interactive Section Map
As always any help is determining why Edge Animate projects with a zoom.js plugin do not work in Firefox 35.0.1 would be most appreciated.

Hi jeremy
Thanks for sharing the info. We'll look into this and get back.
Thanks
Manigandan

How do I keep an Edge Animate banner ad file size small?

Most publishers cap the file size of banner ads at 30 KB to 50 KB. Is that possible using Edge? I know someone asked a question like this two years ago, and the reply was to use a CDN to serve the larger .js files. Is there a more direct approach now that Edge is no longer in preview? Thanks!

Hi SGPGirl,
We were just forming what became the Edge Animate team two years ago, so many questions were asked at that time. The 30k-50k ad standards were built with Flash in mind; HTML advertising standards are still emerging. In the meanwhile, we are making a continuing investment to improve the form factor of Animate output. Here are a few things we've done so far in "Publish":
- Frameworks via CDN (for jQuery)
- "Polite" preloader - this allows you to sneak-in under 30k size limits. It shows a light-weight "preloader" and then pull in a larger payload after the page has loaded. The preloader UI contains a meter that indicates the gzipped size of the preloader including its resources.
- Compressed composition output. When published, the animation (xyz_edge.js) is written in an efficient/compact form that shaves as much as 80% from the composition size.
I'd be grateful for your perspective on the "polite preloader" approach vs. trying to fit the entire composition into 30k. If Animate were to support an "areo-gel weight" output format, what kinds of experiences would you expect to produce with it? If you have any examples, please share!
- Josh

Edge Animate's OAM file problem placed in Muse or other unknown problem?? Please help!

Hi,
I need help please. Did anyone do a whole page animation in Edge Animate and place the OAM file into Muse, and somehow all the menu and social media icon buttons in Muse are blocked by the placed animation? All my menu buttons, social media icon buttons and a link are not working (blocked by the transparent AN stage). I can't go to any other pages because of this issue when previewed in browser. My animation is a slide-open page from center of the page to both right and left side, also text moved up to the top. All are moved out of the stage once animation finished to show the home page with contents, including menu and social media icon buttons. Thanks for your help in advance!!
Thanks,
mykw123

That answers why the two G4's talk normally! I do
have the TCP/IP settings set up manually.
Well, if they are already set manually, maybe you should change them to Auto-negotiate. You shouldn't have to use the Manual setting at all. If you so, then someone, usually the people who wrote the driver for the network card, have screwed something up. It then becomes your job to fix it.
The problems are just very slow document/file
transfer from either new to old or old to new
computer over network, which usually is great with
the two G4's.
That is probably the problem. You may want to go ahead and setup the new machine with manual settings to match the G4s. Otherwise, even the Internet will be noticeably slower.
As for Target Disk Mode...so reboot the old G4
holding the T key and the hard drive should show up
on the desktop of the new computer?
That will do it. It is the best and fastest option to transfer large amounts of data. But even target disk mode is kind of slow. A real, external firewire hard drive will be the fastest of all. It is an excellent idea for backups and this kind of thing.

Edge Animate file does not view properly in Firefox

Adobe Edge Animate 1.0 file does not view properly in Firefox (3.5.19)—figure gets cropped... but looks fine in Chrome and Safari.
Here's a link to the file: http://127.0.0.1:54321/Users/breuter/Desktop/RD_Test%3AEdge/Flying_R_Man6.html?mode=previe w
Thanks for any help.

Hi Darrell,
Thanks for your note... this should help: http://rdtest03.businesscatalyst.com/index.html
It may take a few moments for the animation to load.
Cheers,
Bill

EDGE ANIMATE: MAC files to WINDOWS

how to open source files of the exemplars websites created using edge animate in windows? since they are probably mac!
when i unzip the files, it says that the file already exist for some folders, like images etc amd at the end load only two files named
__MACOSX and
978-1-4302-4350_SourceCode_ch01
When i try to load it directly from edge animate, nothing displays, for the zipped folder as well as for the unzipeed one.
Thankyou
link for the example site source download page:
http://www.adobe.com/devnet/edge-animate/articles/showcase-sample-files.html

As a test, can you download this simple project file, unzip it and double-click the .an file? Let me know what happens?
Are you using the latest version of Edge Animate? What does it say on the splash screen when you first launch it?
Another way to open a project is to simply open Edge Animate; go to File > Open and browse to the source .html or .an file to open it. Have you tried this method with any of the sample files you noted above?
Another scenerio may be related to Windows User Accounts? Are you an administration for the two machines you mention? You may not have administrative rights to run the associative files. One option is to Right-Click on a .an project file, and from the contextual menu list there should be an option to Run as Adminsitrator? Try this option.
Last resort - uninstall from machine and reinstall from your free Adobe Creative Cloud.
Hope some of these help
Darrell

Unable to Insert Adobe Edge Animate files into Dreamweaver CS6!

I have just tried the new Insert Edge Media feature in the new Cloud version of Dreamweaver CS6, but I can't get it to work!!
I have the option, but all the files in the Edge folder are unhighlighted (grey'd out) and I am unable to select anything Edge has published. I have noticed that the file extension has recently changed from .edge to .an with the launch of Animate.. Is this the problem?
Its a shame as its really quite tricky to put edge stuff into a web page at present..
Any ideas?
Wesley

Do you have an HTML5 web document open?
Below are instructions from the DW CS6 Reference document
http://helpx.adobe.com/pdf/dreamweaver_reference.pdf
Import Edge Animate compositions | Creative Cloud
This feature is available for Creative Cloud members and point product subscribers only.
You can import Adobe Edge Animate compositions (OAM files) into Dreamweaver. The composition is placed at the location of the cursor. Dreamweaver extracts the contents of the imported OAM file to a folder named edgeanimate assets. You can change the default location in the Site Setup dialog.
1. Ensure that your cursor is at the location where you want to insert the Edge Animate composition.
2. Select Insert > Media > Edge Animate Composition.
3. Navigate to the location in your computer containing the OAM file, and open it. The animation is placed at the specified location.
By default, the contents of the OAM file are extracted to the edgeanimate_assets folder. A sub folder with the name of the file is created. The contents of the OAM file are placed in the Assets folder under this location.
You can place Edge Animate Compositions into individual pages not part of any site. The files are extracted to the location of the page.
Location of extracted files
     A. The edgeanimate_assets folder
     B. The folder created using the file name of the OAM file
     C. The Assets folder containing the extracted files
4. Preview the inserted Edge Animate composition in a browser or in the Live View.
Change default location for extracted files
1. Open the Site Setup dialog for your site.
2. Under Advanced Settings, select Edge Animate Assets.
3. In Asset Folder, modify the location for extracted files
Nancy O.

Lesson for Adobe Edge Animate

Hello Everyone.
OK. Have been doing Edge Lesson's for quite nearly a year now, and wanted to share them with the community.
If you have any request or questions, please feel free to post them to the video links below, or in here, and I will
Try my best to assist you any way that I can.
Edge Animate has really come a long ways, and with the new CC, it has taken on a life of its own.
Look forward to what the future may bring with this awesome Adobe program release.
Wayne Barron
Dark Effects Production
Adding sound to Mouseover event in Adobe Edge Animate
3:42
1
Adobe Edge Animate - Add Sound in Mouseover Event
by darkeffectstv 1,987 viewsIn this video, we will learn how to add sound to a buttons Mouseover event in Adobe Edge Animate.…
Learning how to add sound to Adobe Edge Animate
7:08
2
Adobe Edge Animate Adding Sound to Project
by darkeffectstv 5,031 viewsAdobe Edge Animate Adding Sound to Project…
Remake, as the cursor was not in the last videos.
4:10
3
Adobe Edge Animate - Mirror Text Effects with Wipe On Text (Lesson 3) (Remake)
by darkeffectstv 447 viewsRemake with "Cursor" this time…
Remake, with Cursor
3:49
4
Adobe Edge Animate - Load Background Image (Lesson 3) (remake)
by darkeffectstv 1,050 viewsremake with Cursor, as Cursor was not int he original one.…
2:00
5
Adobe Edge Animate Starting Symbol at certain location
by darkeffectstv 245 viewsIn this quick tip.
We are going to stop a symbol from playing.…
6:53
6
Adobe Edge Animate Animate Logo to show and hide words
by darkeffectstv 418 viewsIn this lesson, we are going to learn how to take an Image (Like a LOGO for a company) and animate it on the screen, and show and hide words.…
5:44
7
Adobe Edge Animate Publish Files and JS Folder
by darkeffectstv 758 viewsIn this lesson, we will guide you through the ins and outs of publishing your site from Adobe Edge Animate, to a web server.…
6:19
8
Adobe Edge Animate Create a Pen and write a Line
by darkeffectstv 527 viewsIn this lesson, we are going to create a Pen, then write 2 lines.
This can be used in so many different projects, that it is endless.…
2:34
9
Adobe Edge Animate Rollover Button
by darkeffectstv 2,195 viewsIn this lesson, I will show you how to code a Rollover Button.
This is a very simple and easy way to create a Rollover Button, with very little effort.…
4:06
10
Adobe Edge Animate show Grid to fine tune your Animation
by darkeffectstv 77 viewsHave a lot of Animation in your project?
In this lesson, we are going to show you how to fine tune your animation down to the 30th of a second…
16:49
11
Adobe Edge Animate Create a Menu
by darkeffectstv 4,993 viewsIn this lesson, we are going to be creating an animated interactive menu, that is sure to grab your users attention.…
12:30
12
Adobe Edge Animate Menu Slide Down
by darkeffectstv 1,175 viewsIn this lesson, we are going to showing you how to create a Sliding Down Menu.
This was really big a few years ago, a lot of sites had these types of menus…
9:45
13
Adobe Edge Animate Menu Slide In from Left
by darkeffectstv 358 viewsIn this lesson, we are going to be creating a cool little menu that will slide in from the left.
I have never seen one like this before, and thought that I would create one, to see if it would work good,…
4:29
14
Adobe Edge Animate Pin and Timeline Indicator
by darkeffectstv 153 viewsIn this lesson, we are going to go over some basics on how to use the Pin and the timeline indicator. This will come in handy, if you have a big project and you wonder what happened, if something messes up …
16:43
15
Adobe Edge Animate Menu Button Header Footer
by darkeffectstv 905 viewsIn this lesson, we are going to be creating a Menu Button, with a Header and Footer.
This is a cool looking button, that will come in handy for some sites.…
12:56
16
Adobe Edge Animate - Shot Bullet from Gun and hit Wall
by darkeffectstv 110 viewsIn this lesson, we are going to be creating a gun, a bullet, a wall.
We are then going to shot the bullet, out of the gun, and destroy the wall.…
7:44
17
Adobe Edge Animate Menu Rollover Buttons
by darkeffectstv 1,047 viewsIn this lesson we are going to create some Rollover Menu Buttons.…
4:11
18
Adobe Edge Animate - Animate Ball Bounce Squish
by darkeffectstv 172 viewsIn this lesson, we are going to animate a ball, of which is going to bounce on the floor, and once it makes contact with the floor, it is going to squish down, just like a real ball will do.…
6:16
19
Adobe Edge Animate - Change Text when Button is clicked
by darkeffectstv 353 viewsIn this lesson, we are going to learn how to change the text of Textfield, when a button is clicked.
reusing the same Text Element over and over again, keeps the project clean and tidy.…
4:02
20
Adobe Edge Animate - Space Demonstration (Lesson coming soon!)
by darkeffectstv 49 viewsThis is a demonstration of a project that I have been working on for the last few days. This will be turned into a lesson, that will be available within the next week or so…
21:37
21
Adobe Edge Animate - Lesson 1 Space Project
by darkeffectstv 87 viewsAdobe Edge Animate space project, showing how to rotate elements around a centered element. Also, how to reuse the same text element over again…
9:32
22
Adobe Edge Animate - lesson 2 Display Planet Information using single text element
by darkeffectstv 61 viewsview lesson #1 first:
http://youtu.be/16GOY1QOD_…
1:39
23
Adobe Edge Animate - Open Link
by darkeffectstv 227 viewsIn this quick how to lesson.
We are going to create a link on Adobe Edge Animate.…
2:31
24
Adobe Edge Animate - Add Sound in MouseOut Event Part II
by darkeffectstv 192 viewsThis is a follow up to a previous lesson.
Please view the following lesson to catch up to what this is all about…
1:28
25

Here are 2 video using "Edge Hero"
Adobe Edge Animate - Edge Hero Lesson 1 - 3d Objects
by darkeffectstv 107 viewsIn this lesson, we are going to be working with a new plugin for Edge Animate called
Edge Hero…
6:55
2
Adobe Edge Animate CC Lesson #2 - Loading Video with Edge Hero
by darkeffectstv 40 viewsIn this lesson, we are going to load some video into our edge project using Edge Her…
And this is the latest video for Edge Animate CC
Adobe Edge Animate CC - Lesson #3 - Animate ball bouncing on boxes and changing colors
http://youtu.be/MxxpQspBpcw

Edge animate and dreamweaver

I'm using the latest CC versions of these programs on a new Windows PC. I have created an animate_package .oam file and a web .html file and have included all supporting links and folders mirrored on our server. I can get the .oam working locally on firefox, chrome and IE, and I can play the html animation page on its own online, but when I upload my own web page, the animation won't play. I inserted in my page Edge Animate Composition > .oam file and it plays locally. I have also tried inserting the html code but that does not play locally or online in the page (but does on its own if I upload the animation html page). Can you help me get this working? Thank you!

Your Edge animation is contained in a <div>..
All you need to to is open the HTML file that Edge generates for your animation and copy some of the code and paste it into your HTML page you created in Dreamweaver.
The code that looks like this must b copied and pasted on the HTML page you created in Dreamweaver:

    <script type="text/javascript" charset="utf-8" src="Heart_edgePreload.js"></script>
    <style>
        .edgeLoad-EDGE-89560843 { visibility:hidden; }
    </style>

<div id="Stage" class="EDGE-89560843">
</div>
The "Stage" div is where your Edge animation is contained.
NOTE: In order for this to work your HTML file you created in Dreamweaver must be in the same file folder as the Edge animation files.
I have read that with Dreamweaver CS6 there is a way to insert the Edge file automatically:
http://forums.adobe.com/message/4783772#4783772

Edge Animate error message, possibly related to recent upgrade

Keep getting this error message =>This file was created using a previous version of Edge Animate. This file will be automatically upgraded and saved with the suffix 'upgraded'.
- After clicking "ok"
This error message appears => An error occurred while upgrading the file
- After clicking "ok"
Project closes back to the edge animate start page
What if anything can i do to open my project?

Ask in the Edge forum and provide details like what features you actually used. Could be a script that has been updated and you may need to apply some odd trick/ hack to get it opened.
Mylenium

Will an .edge file made with Adobe Edge Animate 1.0 work and load in Adobe Edge Animate 3.0?

I had the beta version of Adobe Edge Animate, and when it was released I was able to download version 1.0 for free, and it is still installed on my computer today.
The problem is I might get a new computer, and I'm just wondering if my old projects that I made with that version of Adobe Edge will work correctly if I purchase Edge Animate CC?
Does Edge Animate CC support backwards compatibility all the way back to 1.0?

Hi,
Also, sometime it depends upon the feature as well. it is deprecated in latest release then you may get error or warning.
Please download trial version of Edge Animate CC 2014 and test your project.
https://creative.adobe.com/products/download/animate
Regards,
Devendra

Adobe Edge Animate JavaScript Coding issues/page load time speeds

To let you have an idea of my skill set I have a background in animation and design and have been taking classes in web development. My question is about how to create an interactive website that loads various animation depending on the user's choice and current place within the Adobe Edge Animate timeline. The website I developed for a client @ www.goshowpro.com works but loads slower than I want and doesn't format properly on my client's Macbook (I believe he needs to update his browsers but that is something else.)
So as you can see from looking at my website I used a multitude of HTML files to create my vision of an interactive website based off of a theatrical stage. I know this is not an ideal method. I would prefer to have it all on one page but I am having trouble with my javascript coding. I was wondering if there would be away to expedite my current site's load time and if not if you could look at my NEW coding. (This IS NOT the current coding on the site.)
if = "hstop" "chomstop" "shomstop" "phomstop"
{sym.play("hporstart")};
else = "hconstop" "sconstop" "pconstop"
{sym.play("cporstart")};
else = "hserstop" "cserstop" "pserstop"
{sym.play("sporstart")};
It looks crappy but I'm trying to learn so don't laugh too much. Thanks again.
Michael

Hi, Marlene-
We currently bundle jQuery 1.7.1 with the Animate runtime. In order to call fadeOut() on the element newSquare, you would do the following:
sym.$("newSquare").fadeOut();
OR
sym.getSymbol("newSquare").getSymbolElement().fadeOut();
Hope that helps!
-Elaine

Adobe Edge Animate CC image loading bug

hello,
The animation which i created in Adobe Edge Animate which is published for web, and when i load the main file in browser noticed that the images which i used inside the Edge Animate for animations are loading two times one with "edge.3.0.0.min.js:240" and "jquery-2.0.3.min.js:5", i hope this is a bug. how can i a avoided this multiple loading of same image files.

Hi, canpark-
We do not have a Korean localized version of Edge Animate, sorry!
-Elaine

PDF files in edge animate

Is there a way to load a PDF file into a symbol on the stage that does not require an internet connection?

Here is a simple example using an iFrame - sample just loads a .pdf file into an element, using required parameters as per Acrobat documentation
View: http://www.heathrowe.com/edge/embed_pdf/
Dl: http://www.heathrowe.com/edge/embed_pdf/embed_pdf.zip
Once downloaded open .an file in Animate and go to the Stage > CompositionReady event handler. You will see a use case to load a pdf file from your drive. In my example the source file (src) is relative to the root (Edge Animate) document. In other in the sample folder as the edge .html file.
hth
Darrell

Glitches and Load Speed Issues with Edge Animate Site

I recently created a website at www.goshowpro.com and am having some glitches and load issues occur and would appreciate any help or insight into the matter. The site loads relatively quickly on my computer and my hosting servers technical support system but when I show it to my client it takes anywhere from 15-20 seconds, even after I have cleared the cache and cookies. All my image files are 'gifs' as to alleviate memory usage and I don't know what else to do that I haven't tried yet. Additionally, when you go to the services page from the about page, the light beams don't connect to the lighting fixtures and the text is placed differently than what I initially had in Adobe Edge Animate before I published the files. And the facebook link doesn't go to facebook but to www.goshowpro.com/facebook.... (ie I get a 404 error) even though in the program I have the link set as www.facebook.com.... I don't know what else to do besides what I have been doing and would very much appreciate any insight into these issues.
I should also mention that I used more html files than I initially planned due to lack of support on creating complete animation functionality with Edge Animate. I would like to have everything on one page but I don't know if that would be possible with the current version of Adobe Edge Animate (1.0.1.204.22434). Thank you again for your help.
Mike

Hi, Mike-
Have you tried profiling? You can use Firefox's Firebug or Google Chrome Inspector to see what's taking so long to download.
http://blogs.adobe.com/edge/2012/01/04/why-cant-it-just-work/
-Elaine

Edge Animate loads JS files twice

Similar Messages

Maybe you are looking for