diff --git a/public/js/buildings/wohnhaus.js b/public/js/buildings/wohnhaus.js index 5645da4..00d3386 100644 --- a/public/js/buildings/wohnhaus.js +++ b/public/js/buildings/wohnhaus.js @@ -61,8 +61,8 @@ export async function loadWohnhaus() { await loadEquipment(); initDrag(); - initDrop(); initSlotDrag(); + initDrop(); initInventoryDrop(); } @@ -81,11 +81,11 @@ async function loadEquipment() { const label = slot.querySelector(".slot-label"); slot.innerHTML = ` - - `; + +`; if (label) slot.appendChild(label); @@ -176,21 +176,28 @@ function initDrop() { if (!itemSlot || itemSlot !== targetSlot) return; - const icon = - source === "inventory" - ? document.querySelector( - '.inventory-slot[data-id="' + itemId + '"] img', - ).src - : document.querySelector('.slot[data-slot="' + itemSlot + '"] img') - .src; + /* Icon bestimmen */ - /* Inventar Item entfernen */ + let icon; if (source === "inventory") { const inventoryItem = document.querySelector( '.inventory-slot[data-id="' + itemId + '"]', ); - if (inventoryItem) inventoryItem.remove(); + + if (!inventoryItem) return; + + icon = inventoryItem.querySelector("img").src; + + inventoryItem.remove(); + } else { + const slotItem = document.querySelector( + '.slot[data-slot="' + itemSlot + '"] img', + ); + + if (!slotItem) return; + + icon = slotItem.src; } /* vorhandenes Item zurück ins Inventar */ @@ -201,12 +208,13 @@ function initDrop() { const grid = document.getElementById("inventory-grid"); const newItem = document.createElement("div"); + newItem.classList.add("inventory-slot"); newItem.setAttribute("draggable", "true"); newItem.dataset.id = existing.dataset.id; newItem.dataset.level = existing.dataset.level; - newItem.dataset.slot = slot.dataset.slot; + newItem.dataset.slot = targetSlot; newItem.innerHTML = ``; @@ -248,15 +256,18 @@ function initInventoryDrop() { grid.addEventListener("drop", (e) => { e.preventDefault(); - const itemId = e.dataTransfer.getData("itemId"); - const itemLevel = e.dataTransfer.getData("itemLevel"); - const slotName = e.dataTransfer.getData("slot"); const source = e.dataTransfer.getData("source"); if (source !== "slot") return; + const itemId = e.dataTransfer.getData("itemId"); + const itemLevel = e.dataTransfer.getData("itemLevel"); + const slotName = e.dataTransfer.getData("slot"); + const slot = document.querySelector('.slot[data-slot="' + slotName + '"]'); + const img = slot.querySelector("img"); + if (!img) return; const newItem = document.createElement("div"); @@ -272,9 +283,12 @@ function initInventoryDrop() { grid.appendChild(newItem); + /* Slot leeren */ + const label = slot.querySelector(".slot-label"); slot.innerHTML = ""; + if (label) slot.appendChild(label); slot.classList.remove("has-item");