Write AS code into HTML

FlashJS is JavaScript graphics and game development engine with API similar to Flash one.
It`s HTML5 game development tool, based on verified for years Flash methodology.
Just write ActionScript 3 code inside of <actionscript> tag.

Download v0.5   Join development

Technology

FlashJS was born at the crossroad of HTML / CSS and beautiful Flash objective model that is known by many interactive developers and fits great for game development.

This library allows to develop HTML5 games and applications in the way that is similar to ordinary AS3 development.

FlashJS was designed to show maximum perfomance for HTML/CSS platforms.

Browser support

FlashJS is tested and supported in major modern browsers like Chrome, Safari, Internet Explorer, and Firefox.

Tested and supported in Chrome, Safari, Internet Explorer, and Firefox
  • Latest Safari
  • Latest Google Chrome
  • Firefox 4+
  • Internet Explorer 9+
  • Opera 11

What's supported

FlashJS comes complete with example games code and syntax sugar for game developers.

  • New in 0.5 Canvas and DOM render engines
  • AssetLists, SpriteAnimations
  • possibility to load animations from separate files and spritesheets as well
  • Optimized request animation frame usage
  • WebAudio support
  • Accelerometer support

Smarty the deer

Christmas arcade game. Uses CollisionManager, animated MovieClips, map is loaded as external MovieClip, prepared in Dreamweaver.

It was realy easy for game-designer to develop levels with dragging objects in WYSIWYG editor.

Instructions

Open application by clicking on splash image. Use any key or tap on tree to jump.

Application

Some pieces of code from demo

Map & collision manager initialization, first level loading.

<actionscript>
    var collisionManager = new CollisionManager();
	var map = new DisplayObject();
    
    stage.addChild(map);
    
    function loadFirstLevel() {
        collisionManager.clean();
        collisionManager.addObject(characterObject);
        
        var mapLoader = new Loader();
        map.addChild(mapLoader);
        mapLoader.load(new URLRequest("./assets/map" + currentLevel + ".html"));
        
        mapLoader.addEventListener(Event.COMPLETE, respawnCaracterObject);
    }
    
...

Сollision handling.

...
	collisionManager.collisionStart = function(objectA, objectB) {
        
        if(objectA === characterObject) {
            var collidedCandy = objectB;
        } else {
            var collidedCandy = objectA;
        }

        if(characterObject.direction === 1 && characterObject.x < collidedCandy.x - 40) {
            characterObject['xright']++;
        }

        if(characterObject.direction === -1 && characterObject.x > collidedCandy.x + 40) {
            characterObject['xleft']++;
        }
    }
    
    collisionManager.collisionStop = function(objectA, objectB) {
...

YAZZ! application

Application for learning FlashJS basics. Actionscript HTML tag, MouseEvent, DisplayObject, Loader, Tween, opacity, rotation.

Yaz is a popular internet mem in Russia.

Instructions

Click on surface to activate application and move mouse over it. YAZZ would follow your pointer.

Application

Some pieces of code from demo

Tweening fish to mouse position.

var tweenY = new Tween(testObject, 'y', undefined, testObject.y, stage.mouseY, 0.5, true);
var tweenX = new Tween(testObject, 'x', undefined, testObject.x, stage.mouseX, 0.5, true);

Fish initialization.

<actionscript>
	var testObject = new DisplayObject();
	
	testObject.width = 100;
	testObject.height = 100;
	testObject.x = 200;
	testObject.y = 250;
	testObject.rotation = 18;
	testObject.fillColor = '#00ff00';
	
	stage.addChild(testObject);
	
	testObject.addChild(new Loader('http://www.rybaki.kz/cdata/jaz_/43.jpg'));
...

Flash to JS convertation

We providing premium quality flash to JS convertation and IT outsourcing services.

Request project development

Flash-ripper.com

Russian Flash platform mentor wrote article about FlashJS and joined development. Thanks to Rostislav Siryk for nice article and fixing IE9 issue !

Visit Flash-Ripper.com »

FlashJS canvas is coming

Hey! FlashJS 2 is coming. Live demo . Want to help to develop new hardware - accelerated FlashJS ?

Join us!