Inventory From AS3 to HTML5

New Here ,
Sep 21, 2019

Copy link to clipboard

Copied

Hello dear people. Some one can help me with this html inventory for a simple game?

the code is in AS3 and I want to use it in HTML.

 

package { import flash.display.*;

public class InventoryDemo extends MovieClip { var inventory:Inventory;

function InventoryDemo() { inventory = new Inventory(this);

inventory.makeInventoryItems([box1,box2,box3,box4]); } } }

 

and the other part of the code

 

package { import flash.display.*;

import flash.events.*;

public class Inventory { var itemsInInventory:Array;

var inventorySprite:Sprite;

function Inventory(parentMC:MovieClip) { itemsInInventory = new Array()

; inventorySprite = new Sprite();

inventorySprite.x = 50;

inventorySprite.y = 360;

parentMC.addChild(inventorySprite); }

function makeInventoryItems(arrayOfItems:Array) { for(var i:int=0;i<arrayOfItems.length;i++) { arrayOfItems[i].addEventListener(MouseEvent.CLICK, getItem);

arrayOfItems[i].buttonMode = true; } }

function getItem(e:Event) { var item:MovieClip = MovieClip(e.currentTarget);

itemsInInventory.push(item);

inventorySprite.addChild(item);

item.x = (itemsInInventory.length-1)*40;

item.y = 0;

item.removeEventListener(MouseEvent.CLICK, getItem);

item.addEventListener(MouseEvent.CLICK, useItem); }

function useItem(e:Event) { var item:MovieClip = MovieClip(e.currentTarget);

trace("Use Item: "+item.name); } } }

Views

72

Likes

Translate

Translate

Report

Report
Reply
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Adobe Community Professional ,
Sep 21, 2019

Copy link to clipboard

Copied

Hi.

 

It could be like this:

 

Frame 1 of your FLA:

const inventory = new Inventory(this);
inventory.makeInventoryItems([this.box1, this.box2, this.box3, this.box4]);
 
External Inventory.js file (you're gonna have to goto to Actions > Global > Include to include this JS file):
class Inventory
{        
    constructor(parentMC)
    {
        this.itemsInInventory = [];
        this.inventorySprite = new createjs.Container();
        this.inventorySprite.x = 50;
        this.inventorySprite.y = 360;
        parentMC.addChild(this.inventorySprite);
    }
    
    makeInventoryItems(arrayOfItems)
    {
        arrayOfItems.forEach(item =>
        {
            item.addEventListener("click", this.getItem.bind(this));
            item.cursor = "pointer";   
        });
    }

    getItem(e)
    {
        const item = e.currentTarget;

        this.itemsInInventory.push(item);
        this.inventorySprite.addChild(item);
        item.x = (this.itemsInInventory.length - 1) * 40;
        item.y = 0;
        item.removeEventListener("click", this.getItem);
        item.addEventListener("click", this.useItem.bind(this));
    }

    useItem(e)
    {
        console.log("Use Item:" + e.currentTarget.name);
    }
}
 
Notice that I'm using ES6 JavaScript syntax. So you're gonna have to transpile/convert it using something like Babel to support older browsers.
 

Regards,
JC

Likes

Translate

Translate

Report

Report
Reply
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
New Here ,
Oct 07, 2019

Copy link to clipboard

Copied

WOW ! Thank you very much sir, Im really very happy .

Likes

Translate

Translate

Report

Report
Reply
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Adobe Community Professional ,
Oct 07, 2019

Copy link to clipboard

Copied

You're welcome!

Likes

Translate

Translate

Report

Report
Reply
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more