Inventory From AS3 to HTML5

[jorget19452882]

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); } } }

[JoãoCésar]

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

[jorget9016216]

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

[JoãoCésar]

You're welcome!