Semi-working inventory

lib/menus/inventory.js

@@ -3,6 +3,8 @@ import * as InventoryWindows from 'minecraft-inventory-gui'
 
 import { getImage } from './utils/image-util.js'
 
+import WindowManager from './utils/inv-manager-util.js'
+
 const { LitElement, html, css } = require('lit')
 
 class Inventory extends LitElement {
@@ -85,26 +87,7 @@ class Inventory extends LitElement {
 
     console.log('Initialising inventory!')
 
-    class Item {
+    new WindowManager(bot.inventory, inventory).initialRender()
-      constructor (type, count) {
-        this.type = type
-        this.count = count
-        this.stackSize = 64
-      }
-
-      clone () {
-        return new Item(this.type, this.count)
-      }
-    }
-    inventory.inventoryItems = bot.inventory.slots.slice(bot.inventory.inventoryStart, bot.inventory.inventoryEnd + 1).map(slot => slot ? new Item(slot ? slot.name : 'air', slot ? slot.count : 0) : new Item('air', ''))
-    bot.inventory.on('updateSlot', (slot, _oldItem, newItem) => {
-      if (newItem) {
-        inventory.inventoryItems[slot - bot.inventory.inventoryStart] = new Item(newItem.name, newItem.count)
-      } else {
-        inventory.inventoryItems[slot - bot.inventory.inventoryStart] = new Item('air', '')
-      }
-      inventory.needsUpdate = true
-    })
   }
 
   render () {

lib/menus/utils/image-util.js

@@ -70,11 +70,16 @@ export function getImage (resource) {
   img.src = 'invsprite.png' // see assets/invsprite.png
   img.style.imageRendering = 'pixelated' // antialiasing bad in block game
   // img.style.objectFit = 'none'
-  // img.style.objectPosition = invspritePositions[resource.item.type].x + 'px ' + invspritePositions[resource.item.type].y + 'px'
+  // img.style.objectPosition = invspritePositions[resource.item.name].x + 'px ' + invspritePositions[resource.item.name].y + 'px'
+
+  if (!resource.item) {
+    resource.item = new Item('air', '') // if null or undefined is passed in, pretend air
+  }
+
   const metaImg = {
     image: img,
-    x: invspritePositions[resource.item.type].x,
+    x: invspritePositions[resource.item.name].x,
-    y: invspritePositions[resource.item.type].y,
+    y: invspritePositions[resource.item.name].y,
     width: 32,
     height: 32,
     scale: 0.5
@@ -82,4 +87,16 @@ export function getImage (resource) {
   return metaImg
 }
 
+class Item {
+  constructor (name, count) {
+    this.name = name
+    this.count = count
+    this.stackSize = 64
+  }
+
+  clone () {
+    return new Item(this.name, this.count)
+  }
+}
+
 loadAllImagesWeb()

lib/menus/utils/inv-manager-util.js

@@ -0,0 +1,83 @@
+// Takes a prismarine-windows instance and a PlayerWin instance and connects them together.
+
+export default class WindowManager {
+  constructor (playerInventory, renderedInventory) {
+    console.log('Using WindowManager!')
+    this.playerInventory = playerInventory
+    this.renderedInventory = renderedInventory
+
+    console.log('registering inventory click events')
+
+    renderedInventory.on('itemEvent', (_id, type, _pos, data) => {
+      console.log('ItemEvent triggered', _id, type, _pos, data)
+      if (type === 'click') {
+        this.onLeftClick(data[1], playerInventory.slots[data[1] + playerInventory.inventoryStart])
+      } else if (type === 'rightClick') {
+        console.log('right click not implemented', data.inventoryIndex, data.item)
+      }
+    })
+  }
+
+  initialRender () {
+    this.renderedInventory.inventoryItems = this.playerInventory.slots.slice(this.playerInventory.inventoryStart, this.playerInventory.inventoryEnd + 1).map(slot => slot ? new Item(slot ? slot.name : 'air', slot ? slot.count : 0) : new Item('air', ''))
+    this.playerInventory.on('updateSlot', (slot, _oldItem, newItem) => {
+      if (newItem) {
+        this.renderedInventory.inventoryItems[slot - this.playerInventory.inventoryStart] = new Item(newItem.name, newItem.count)
+      } else {
+        this.renderedInventory.inventoryItems[slot - this.playerInventory.inventoryStart] = new Item('air', '')
+      }
+      this.renderedInventory.needsUpdate = true
+    })
+  }
+
+  setSlot (inventoryIndex, item) {
+    this.renderedInventory.inventoryItems[inventoryIndex] = item
+    this.playerInventory.updateSlot(inventoryIndex + this.playerInventory.inventoryStart, item)
+    console.log('set', inventoryIndex, item)
+    this.renderedInventory.needsUpdate = true
+  }
+
+  onLeftClick (inventoryIndex, item) { // this code was mostly copied from the web demo with some modifications
+    console.log('left click', inventoryIndex, item)
+    const floating = this.renderedInventory.floatingItem
+    if (floating) { // if we already have a floating item
+      if (item) {
+        if (floating.name === item.name) {
+          // add to existing slot
+          const free = item.stackSize - item.count
+          const consumable = Math.min(floating.count, free)
+          floating.count -= consumable
+          item.count += consumable
+          if (floating.count <= 0) delete this.renderedInventory.floatingItem
+          this.renderedInventory.needsUpdate = true
+        } else {
+          // swap
+          const old = this.playerInventory.slots[inventoryIndex]
+          this.setSlot(inventoryIndex, this.renderedInventory.floatingItem)
+          this.renderedInventory.floatingItem = old
+          this.renderedInventory.needsUpdate = true
+        }
+      } else {
+        // slot is empty, set floating item to slot
+        this.setSlot(inventoryIndex, this.renderedInventory.floatingItem)
+        this.renderedInventory.floatingItem = null
+        this.renderedInventory.needsUpdate = true
+      }
+    } else { // pickup item
+      this.renderedInventory.floatingItem = item
+      this.setSlot(inventoryIndex, null)
+    }
+  }
+}
+
+class Item {
+  constructor (name, count) {
+    this.name = name
+    this.count = count
+    this.stackSize = 64
+  }
+
+  clone () {
+    return new Item(this.name, this.count)
+  }
+}

package.json

@@ -38,7 +38,7 @@
     "express": "^4.17.1",
     "ismobilejs": "^1.1.1",
     "lit": "^2.0.2",
-    "minecraft-inventory-gui": "file:////Users/owl/Documents/GitHub/prismarine-inventory-gui/",
+    "minecraft-inventory-gui": "github:AwesomestCode/prismarine-inventory-gui",
     "net-browserify": "PrismarineJS/net-browserify",
     "querystring": "^0.2.1",
     "url": "^0.11.0"