Step by Step procedure to convert a flash game to html5

Haxe
#1

HI
I am having a flash game which i need to convert to a html5 game . Can you help me how to convert it. i tried of doing it as per instructions and commands in the blog , that output is that it is playing as a slide show but not as a game. please suggest me how to start and complete in order to get the game

#2

Which blog article are you referring to?

#3

There are two distributions of OpenFL, one for Haxelib, one for NPM.

The NPM version supports ActionScript 3.0 (using Apache Royale), TypeScript, ES5 JavaScript, ES6+ JavaScript as well as Haxe.





The Haxelib version supports Haxe only.

Both support a SWF converter for importing resources from SWF files. Neither supports using ActionScript code embedded in an existing SWF file right now.

You can check out the “demos/NyanCat” project in one of the above repositories above for an example of using a Flash animation. There’s also a “SimpleLayout” example that uses multiple resources from a SWF file by name. We support linkage names, simple animations, dynamic text and many other features (but no embedded ActionScript bytecode)

Please let me know if there’s anything more we can do to help :smiley:

#4

Hey @singmajesty and all
I am totally new in Openfl and other things, i was little bit lost about this stuff i try sample that provided example nyancat project, is the nyancat is only animation ? not full game ? if i replace nyancat.swf with other swf file is it require some manual code in main.hx ? when i replace the nyancat.swf and test it with flashdevelop it just show blank.

i try usingSWFAssets too, i already process and generate .bundle folder from swf games but i don’t know how to use it properly, i read and test it Building .bundle at runtime and i fail,
the goal i learning is i want to convert from swf flash games to html5.

Hope soon i understand what i learning
please let me know if there’'s any tutorial step by step to porting swf to html5.

Thanks.

#5

You will (ideally!) need to be able to have the original ActionScript sources for your Flash project.

Haxelib

ActionScript 3.0 can be converted using the free “as3hx” tool, or by hand, into the Haxe language. Then many of the original Flash features will continue to work in OpenFL, but the code will compile directly to C++, back to a Flash SWF, or to JavaScript. This is how most developers ship their live products for HTML5, native desktop, mobile and console platforms.

NPM

ActionScript 3.0 can be used with the Apache Royale project, to transpile to JavaScript. This also pairs with the OpenFL project to create an HTML5-only project, though I don’t know anyone who has shipped with this yet, as Apache Royale on NPM is new.

ActionScript 3.0 code could also be converted by hand to JavaScript or to TypeScript, or converted (like above) to Haxe, then linked with the OpenFL library for HTML5 deployment.

SWFs

A final Flash SWF may contain fonts, graphics, sounds and compiled ActionScript code. We currently have support for most SWF graphics in OpenFL, with ways to link it to your code. The Shumway project is the most mature solution I know to play a SWF file as-is (with no modifications), but there are some serious problems with that approach. Performance is an issue, but shipping real products often requires changes to your code.

Shumway

The Shumway project has been abandoned, but perhaps there is a fork with more promise.

Here’s a blog post from someone who tried to use Shumway recently, there may be other stories of success or failure: https://dev.to/elmuerte/shumway-shiv-scant-success-o1a

Next Steps

Going back to see if you have source code for your Flash SWF project will go a long way to helping know what your options are.

A SWF decompiler might be able to help, but converting will probably require some work, though certainly less than rewriting in JavaScript and having no Flash API library

#6

Hey @singmajesty,
Thank you for quick replay
i have fla file and some only swf files, i would like to convert games with A SWF decompiler as this is not ideal,
do you have any idea what option i have ?

#7

JPEXS looks promising since it is free/open-source, so I would probably start there. I’ve used Sothink with a license before, and there probably are some other choices out there as well. Sometimes they can convert compiled ActionScript bytecode into something legible that could be re-compiled again

#8

After using JPEXS what should i do ? should i use as3hex ?

#9

Yes, I believe you can use as3hx to convert ActionScript 3.0 code to Haxe. It does about 95%-98% of the conversion automatically, though it helps to understand some of the basics of the difference between the Haxe and ActionScript. Some of this is documented here: https://books.openfl.org/as3-conversion-guide/

#10

I’ve converting it to hx using as3hx, what next step ?

#11

Create a new OpenFL project:

openfl create project ProjectName
cd ProjectName
openfl test neko

You can drop the converted Haxe code into the “Source” directory of your new project, and can run it again.

I also recommend having Visual Studio Code and the Lime extension installed, so you have a good Haxe code editor. There are other options available, but that’s what I use :wink:

There will probably be minor compilation issues. I just helped someone on this thread with some. This older blog post may help with some issues you’ll experience, and of course, there’s the forums here and Discord for help as well.

#12

hello
thanks for sharing this info
I want To ask you when I create a new project I need to create first a folder??

have you a exemple to convert flash game to html5

thanks

#13

i get this error

Source/Main.hx:12: characters 17-30 : Type not found : MySymbolClass

#14

If you use the “generate” option with a SWF file, you will be able to create a new instance of a class that exists within the SWF.

“MySymbolClass” is probably an example name

#15

hello
I need if you have a video tuto to convert swf to html

thanks again

#16

hello

I have some problem

first one when I run test

Error: You must define AIR_SDK with the path to your AIR SDK

this line I solved with this

openfl config AIR_SDK path/to/air/sdk

second

Error: The specified target path “null/platform-tools/” does not exist

I’ve edite hx file and xlm file

then I get this error again

Source/Main.hx:17: characters 17-30 : Type not found : MySymbolClass

thanks

#17

Have you already tried to build and run an OpenFL sample?

openfl create PiratePig
cd PiratePig
openfl test html5
openfl test flash
openfl test air
#18

yes I try

openfl test html5

display white screen

openfl test flash

display white screen

openfl test air

C:\HaxeToolkit\haxe\lib\openfl-samples\8,7,0\features\display\DisplayingABitmap\swfapktest>openfl test air
Called from lime/_internal/backend/native/NativeCFFI.hx line 609
Called from lime/system/CFFI.hx line 172
Called from lime/system/CFFI.hx line 306
Uncaught exception - Could not find NekoAPI interface.
Called from ? line 1
Called from CommandLineTools.hx line 1884
Called from CommandLineTools.hx line 22
Called from CommandLineTools.hx line 126
Called from CommandLineTools.hx line 630
Called from lime/tools/PlatformTarget.hx line 98
Called from AIRPlatform.hx line 249
Called from lime/tools/IconHelper.hx line 66
Called from lime/tools/IconHelper.hx line 360
Called from lime/tools/ImageHelper.hx line 117
Called from lime/graphics/Image.hx line 697
Called from lime/graphics/Image.hx line 1627
Called from /usr/share/haxe/std/neko/Lib.hx line 42
Uncaught exception - load.c(237) : Failed to load library : C:\HaxeToolkit\haxe\lib\lime\7,6,2//ndll/Windows64/lime.ndll

thanks

#19

Hi,

I’ve been trying to convert a (compiled) .swf file to AS/haxe/JS/html5. The swf consists of a bunch of frames through which you navigate by pressing buttons (no physics or complex moving stuff). I don’t have the source code. I used JPEXS to decompile it, and exported all the assets and AS snippets. This results in a folder with hundreds of separate, small AS code files of the kind:

on(release){
   gotoAndPlay(18);
}

When I run as3hx (latest version of haxelib and as3hx) on the folder with the AS snippets however, I get a bunch of errors like this (but way more):

In /scripts/DefineButton2_2476/on(release).as(1) : Unexpected on
In /scripts/DefineSprite_2412/frame_50/DoAction.as(1) : Unexpected stop
In /scripts/DefineSprite_2412/frame_15/DoAction.as(1) : Unexpected _root
In /scripts/DefineSprite_188/frame_10728/DoAction.as(1) : Unexpected gotoAndPlay

The ./out folder ends up empty. If I run as3hx on one of the .as samples in the openfl-as samples it does work correctly and I do end up with the expected .hx files. Maybe JPEXS outputs a different version of AS?
@sibli_busro did you manage to do the conversion? How exactly did you extract the ActionScript from the .swf file with JPEXS? And then how did you use as3hx on the output?

Then I saw the announcement that openFL with npm now also supports AS source code. This would be interesting, since I (presumably) have all the AS code and the assets. So basically this could work straight on the decompiled .swf? But I don’t really see how all the tiny .as snippets coming out of JPEXS would fit together in an openFL app like the samples? It seems like the glue tying together all the assets and tiny logic fragments is missing. Was JPEXS just not able to decompile the entire .swf? Or am I missing something?

Any help is much appreciated :slight_smile: . Thanks in advance!

PS: when I run the openFL (npm) samples, everything works as expected, both with the ES6 and the AS3 samples.

#20

Hello!

This looks like old ActionScript code (ActionScript 1?) and not ActionScript 3.

The equivalent ActionScript 3 code would be something like this:

this.addEventListener("mouseUp", function(_)
{
    this.gotoAndPlay(18);
});