Adobe Flash Professional CC 2014 v.13.0 - Manual (Page 236)

To the top
To the top
Code Hinting
Creating an HTML5 Canvas document
To create an HTML5 Canvas document, do the following:
1. Launch Flash Professional CC.
2. On the Welcome Screen, click the HTML5 Canvas option. This opens a new FLA with Publish Settings modified to produce HTML5 output.
3. Alternatively, select File > New to display the New Document dialog. Click the HTML5 Canvas option.
You can now begin creating HTML5 content using the tools within Flash Pro. As you begin working with the HTML5 Canvas document, you will
notice that certain features and tools are not supported and are disabled. This is because, Flash Professional supports those features that are in-
turn supported by the Canvas element within HTML5. For example, 3D transformations, dotted lines, bevel effects are not supported.
Adding interactivity in HTML5 Canvas document
Flash Professional CC publishes HTML5 content using the CreateJS libraries. CreateJS is a suite of modular libraries and tools which enable rich
interactive content on open web technologies via HTML5. The CreateJS suite comprises of: EaselJS, TweenJS, SoundJS, PreloadJS, and Zoë.
CreateJS converts content created on stage to HTML5 using these individual libraries to produce HTML and JavaScript output files. You can also
manipulate this JavaScript file to enhance your content.
However, Flash Professional CC allows you to add interactivity to objects on stage created for HTML5 Canvas from within. It means that you can
actually add JavaScript code to individual objects on stage from within Flash Pro and preview at author-time. In turn, Flash Pro provides native
support for JavaScript with useful features within the code-editor to help improve workflow efficiency of programmers.
You can choose individual frames and keyframes on the Timeline to add interactivity to your content. For an HTML5 Canvas document, you can
add interactvity using JavaScript. For more information about writing JavaScript code, see
this link .
JavaScript code can be written directly in the Actions panel, and it supports the following features while writing the JavaScript code:
Allows you to quickly insert and edit JavaScript code and without mistakes. As you type characters in the Actions Panel, you can
see a list of candidates that possibly complete your entry.
Additionally, Flash Professional also supports some features inherent to Actions Panel when working with HTML5 Canvas. These features help
improve workflow efficiency when adding interactivity to objects on stage. They are:
229