Understanding the html5 canvas output, Migrating existing content to html5 canvas – Adobe Flash Professional CC 2014 v.13.0 User Manual
Page 239
HTML file
JavaScript file
Copy
Import
Work
Scripts
Content is removed
Content is modified to a supported default value
Understanding the HTML5 Canvas output
The published HTML5 output contains the following files:
Contains definitions for all shapes, objects, and artwork within the Canvas element. It also invokes the CreateJS namespace to convert
Flash to HTML5 and the corresponding JavaScript file that contains interactive elements.
Contains dedicated definitions and code for all interactive elements of the animation. Also defined within the JavaScript file are,
code for all types of tweens.
These files are copied to the same location as that of the FLA by default. You can change the location by providing the output path on the Publish
Settings dialog (File > Publish Settings).
Migrating existing content to HTML5 Canvas
You can migrate existing content within Flash Pro to generate an HTML5 output. To its end, Flash Pro allows you to migrate content by manually
copying or importing individual layers, symbols, and other library items. Alternatively, you could run the Convert AS3 to HTML5 Canvas document
command to automatically port existing ActionScript content to a new HTML5 Canvas document. For more information, see
However, when working the HTML5 document type in Flash Professional CC, you can notice that certain Flash features are not supported. This is
because, the features within Flash do not have corresponding features within the Canvas API. And hence, these features cannot be used within
the HTML5 Canvas document type. This may affect you during content migration, when you attempt to:
content (layers or library symbols) from a traditional Flash document type (such as ActionScript 3.0, AIR for Android, AIR for Desktop, and
so on) into an HTML5 document. In this case, an unsupported content-type is either removed or converted to supported defaults.
For example, copying 3D animation will remove all 3D transformations applied to objects on stage.
a PSD or AI file that contain unsupported content. In this case, the content is either removed or converted to supported defaults.
For example, import a PSD file that has Gradient Bevel effect applied. Flash Pro removes the effect.
with multiple document types (for example, ActionScript 3.0 and HTML5 Canvas) simultaneously, you switch documents with an
unsupported tool or option selected. In this case, Flash Pro CC visually indicates that the feature is not supported.
For example, you created a dotted line in an ActionScript 3.0 document and switch to HTML5 Canvas with the Line tool still selected. Observe the
pointer and the the Properties Inspector, they display icons to indicate that dotted line is not supported within HTML5 Canvas.
ActionScript components are removed and the code is commented out. And also, if you have JavaScript written within the comment block
(for Toolkit for CreateJS with Flash Professional CC 13.0), ensure that you manually uncomment the code.
For example, if you copied layers that contain buttons, they are removed.
Changes applied to content after migrating
The following are the types of changes that are applied when you migrate legacy content to an HTML5 Canvas document.
Content types that are not supported in HTML5 Canvas are removed. For example:
3D Transformations are removed
ActionScript code is commented out
Videos are removed
Content type or feature is supported, but a property of the feature is not. For example:
232