Reviving ActionScript2.0 with javascript

And now, in March 2017, Adobe Flash Player no longer starts by default without explicit user actions, at least in Google Chrome, you need to follow these instructions to automatically launch Adobe Flash Player content. Thus, the focus of web development is shifting more and more. towards using JavaStript libraries that provide access to HTML5 Canvas.

One of the convenient ways to develop HTML5 Canvas, instead of Flash, is Adobe Animate CC 2017, which supports the following types of projects:

From the list it is clear that support for ActionScript2.0 is completely excluded from the current version of the development environment, and there is also no possibility to transfer the existing AS2 / 3 code to the html5 Canvas.
The only thing you can do in Adobe Animate CC 2017 is to convert the graphic content of the Flash project and all its components into an HTML5 project.
To do this, simply open the Flash project and select the Convert To Other Documents Format item from the Commands menu, then a dialog box will open offering a choice of the type of project into which the conversion takes place. HTML5 Canvas is used by default, and we will use it in our new projects.

After converting the Flash project, all the AS code in the project is commented on, which means everything should be rewritten again in JavaScript. As an interface interface for interacting with the development environment, the CreateJS library is used .

This library is functional in many ways, but unfortunately not in everything, compatible with many of the standard AS methods and classes. For example, any object of type MovieClip includes a gotoAndStop () method for switching between frames, and much more.

Due to the large amount of ActionScript2.0 code, after familiarizing with the CreateJS library, it was decided to develop an extension to the library's functionality with additional methods compatible with AS2.0.

As a result, a project was created to simplify the transfer of the code of Flash CreateJSToAS2 graphic components. This library includes some basic extension methods for the MovieClip class. Also, the eval function is implemented (overloaded) so that there is a possibility of accessing
to certain elements on the video using a string, similar to how it is done in ActionScript 2.0.

Although this is still a small part of the capabilities of ActionScript 2.0, it already allows you to transfer a lot without changing the code.

The library CreateJSToAS2 is connected in the header of the html file using the file Lib \ AS2_Library.js.

<script src="https://code.createjs.com/createjs-2015.11.26.min.js"></script> <script src="Lib\AS2_Library.js"></script> 

And the initAS library function InitAS2 () must be called in the body of the init function, and after it it is possible to write your code, of course another option is possible by calling the event, but this one is the simplest.

  var canvas, stage, exportRoot; function init() { canvas = document.getElementById("canvas"); exportRoot = new lib.AS2ToAS3_Canvas(); stage = new createjs.Stage(canvas); stage.addChild(exportRoot); stage.update(); createjs.Ticker.setFPS(lib.properties.fps); createjs.Ticker.addEventListener("tick", stage); InitAS2(); Init(); } function Init(){ var _root = exportRoot; // Write your code here } 

For example, the following example of creating a MovieClip and drawing lines will be compatible with html 5 Canvas

  _root.createEmptyMovieClip("line_mc", 1); _root.line_mc.lineStyle(10, 0xFF0000, 100); _root.line_mc.moveTo(0, 0); _root.line_mc.lineTo(150, 0); _root.line_mc.lineTo(150, 50); _root.line_mc.lineTo(0, 50); _root.line_mc.lineTo(0, 0); _root.line_mc._x=150; _root.line_mc._y=150; 

Creating a new MyText text with the text 'Hello Word'

  eval('line_mc').createTextField("MyText", undefined, 10, 10); eval('line_mc.MyText').text = 'Hello Word'; 

Even connecting a new component from the Adobe Animate library will be similar to how you would have done it in AS2. For example, if there is a component "LibMovie", then to connect it, as Movie2 will do so.

  _root.attachMovie("LibMovie","Movie2",undefined).x = 250; _root.Movie2.y = 100; eval('Movie2')._width = 40; eval('Movie2')._height = 40; 

Of course, there is still a lot that can be expanded and implemented in this library in the same way as it has already been done, but for this, of course, the interest of the community in the openSource project is necessary. Thanks for attention.