can't make it

client/src/scenes/constants.js

@@ -175,8 +175,8 @@ module.exports = {
           { name: 'Decay',
             description:
              'afflict a cryp with a blue damage based damage over time debuff' },
-          { name: 'Drain',
-            description: 'drain hp from target cryp with a blue damage based debuff' },
+          { name: 'Siphon',
+            description: 'siphon hp from target cryp with a blue damage based debuff' },
           { name: 'Empower',
             description: 'increase the red damage dealt by a cryp' },
           { name: 'Haste',

client/src/scenes/elements/item.js

@@ -41,7 +41,7 @@ class Item extends Phaser.GameObjects.Container {
     clickHandler() {
         this.scene.activeItem = this;
         // Set the main context to display the item info
-        this.scene.registry.set('itemInfo', this.action);
+        this.scene.registry.set('itemInfo', this.item);
         this.select();
     }
 

client/src/scenes/item.list.js

@@ -89,7 +89,7 @@ class CombinerHitBox extends Phaser.GameObjects.Rectangle {
     }
 
     deallocate() {
-        this.item.setPosition(this.item.origX, this.item.origY);
+        if (this.item) this.item.setPosition(this.item.origX, this.item.origY);
         this.item = false;
     }
 }
@@ -137,33 +137,35 @@ class ItemList extends Phaser.Scene {
     create(vbox) {
         this.registry.events.on('changedata', this.updateData, this);
         this.registry.events.on('setdata', this.updateData, this);
-        this.combinerItems = [-1, -1, -1];
-        if (!vbox.free) return false;
-        this.addStatic(vbox);
-        this.addItems(vbox);
-        this.addClickHandlers(vbox);
-        return this;
-    }
-
-    addStatic(vbox) {
+        if (!vbox.bound) return false;
+        this.combinerItems = this.registry.get('combinerItems');
+        if (!this.combinerItems || vbox.bound.length < this.registry.get('boundLength')) {
+            this.combinerItems = [-1, -1, -1];
+        }
+        this.registry.set('boundLength', vbox.bound.length);
         const ws = this.registry.get('ws');
+
+        // Static Elements
         const graphics = this.add.graphics();
         graphics.lineStyle(5, 0x808080, 1.0);
         drawCombiner(graphics);
         drawInventory(graphics);
         drawVbox(graphics);
+
         this.add.text(X + WIDTH * 0.1, Y, 'Inventory', TEXT.HEADER);
         this.add.text(X + WIDTH * 0.47, Y, 'Combiner', TEXT.HEADER);
         this.add.text(X + WIDTH * 0.35, Y + HEIGHT / 2, 'Varibox', TEXT.HEADER);
 
-        const reroll = this.add.rectangle(WIDTH * 0.01, Y + HEIGHT * 0.775, ITEM_WIDTH * 1.25, ITEM_HEIGHT * 1.25, 0x222222)
+        const reroll = this.add
+            .rectangle(WIDTH * 0.01, Y + HEIGHT * 0.775, ITEM_WIDTH * 1.25, ITEM_HEIGHT * 1.25, 0x222222)
             .setInteractive()
             .setOrigin(0)
             .on('pointerdown', () => this.registry.get('ws').sendVboxDiscard(vbox.game));
         this.add.text(reroll.getCenter().x, reroll.getCenter().y, 'Reroll', TEXT.HEADER)
             .setOrigin(0.5, 0.5);
 
-        const combine = this.add.rectangle(ITEM_WIDTH * 1.1 + COMB_X, ITEM_HEIGHT * 1.1 + COMB_Y, ITEM_WIDTH, ITEM_HEIGHT, 0x222222)
+        const combine = this.add
+            .rectangle(ITEM_WIDTH * 1.1 + COMB_X, ITEM_HEIGHT * 1.1 + COMB_Y, ITEM_WIDTH, ITEM_HEIGHT, 0x222222)
             .setInteractive()
             .setOrigin(0)
             .on('pointerdown', () => {
@@ -182,11 +184,8 @@ class ItemList extends Phaser.Scene {
         const del = this.add.existing(new DeleteHitBox(this, WIDTH * 0.01, Y + HEIGHT * 0.6));
         this.add.text(del.getCenter().x, del.getCenter().y, 'Del', TEXT.HEADER)
             .setOrigin(0.5, 0.5);
-    }
-
-    addItems(vbox) {
-        const ws = this.registry.get('ws');
 
+        // Generate Items
         vbox.bound.forEach((action, i) => {
             const ITEM_X = ITEM_WIDTH * 1.1 * (i % INV_COLUMNS) + INV_X + ITEM_WIDTH * 0.5;
             const ITEM_Y = ITEM_HEIGHT * 1.1 * Math.floor(i / INV_COLUMNS) + INV_Y + ITEM_HEIGHT * 0.5;
@@ -206,10 +205,22 @@ class ItemList extends Phaser.Scene {
                 });
             this.add.existing(itemBox);
         });
-    }
 
-    addClickHandlers(vbox) {
-        const ws = this.registry.get('ws');
+        // Restore previous combiner item slots
+        this.combinerItems.forEach((index, i) => {
+            if (index === -1) return false;
+            const item = this.children.list.filter(obj => obj instanceof Item).find(it => it.index === index);
+            const hitBox = this.children.list.filter(obj => obj instanceof CombinerHitBox).find(hb => hb.slot === i);
+            hitBox.allocate(item);
+            return true;
+        });
+
+        // allocation functions
+        const allocate = (item, hitBox) => {
+            hitBox.allocate(item);
+            this.combinerItems[hitBox.slot] = item.index;
+            this.registry.set('combinerItems', this.combinerItems);
+        };
 
         const deallocate = (item) => {
             const clearIndex = this.combinerItems.indexOf(item.index);
@@ -231,11 +242,7 @@ class ItemList extends Phaser.Scene {
             } return false;
         };
 
-        const allocate = (item, hitBox) => {
-            hitBox.allocate(item);
-            this.combinerItems[hitBox.slot] = item.index;
-        };
-
+        // Add Handlers
         this.input.on('dragstart', (pointer, item) => {
             if (!(item instanceof Item)) return false;
             item.clickHandler();
@@ -278,6 +285,7 @@ class ItemList extends Phaser.Scene {
             deallocate(item);
             return true;
         });
+        return this;
     }
 
     cleanUp() {