Graphics Reference
In-Depth Information
If you want to use Fireworks in combination with Edge Animate, you should
take a look at a Fireworks extension from John Dunning (http://johndunning.
com/fireworks/about/EdgeAnimate). This plug-in lets you export your design
work from Fireworks into Edge Animate compositions. The extension is still in
its beta release, but already performs very well in some application scenarios.
Adobe Illustrator •
If you want to create scalable vector graphics, Illustrator is
definitely the right choice. This software is also part of the Creative Cloud. It of-
fers a great variety of vector tools and features to create graphics and save them
in SVG format. Illustrator has extensive export options, such as naming individual
elements within the SVG file, which is ultimately a description file that XML uses
to define all graphic elements. Unfortunately, the first version of Edge Animate
cannot access the individual elements of an SVG file, meaning that it cannot yet
take advantage of this powerful Illustrator feature. This option is also on the wish
list for future versions.
2.7.2 Code Editors and IDEs
Since Edge Animate has already been using open web standards in its design
phase and saves all project information in JavaScript or HTML files, you do not
necessarily have to use Edge Animate's built-in code editor for coding. There are
three files that you can edit with a different editor as needed:
PROJECTNAME.html:
The main document with basic HTML codes. Here you
can add additional JavaScript libraries or CSS style sheets to the header like
you can in any other HTML document. You can also easily make changes to
the body. For example, it may be necessary to modify the body tag with CSS
so that your Edge Animate project is centered on the web page.
PROJECTNAME_edgeActions.js:
All actions from your project are saved in
this JavaScript file. If you are doing heavy coding and want the convenience
of an advanced development environment for extensive JavaScript coding
(code completion, snippets, debugging, etc.), use this file as a starting point
and edit with any JavaScript editor. In an anonymous function, all actions are
defined with the following syntax:
Symbol.bindElementAction(compId, symbolName,
"${_MySymbol}", "click", function(sym, e){
// Insert code for mouseclick here
});
//Edge binding end
