diff --git a/public/js/buildings/wohnhaus.js b/public/js/buildings/wohnhaus.js index dc81895..e250549 100644 --- a/public/js/buildings/wohnhaus.js +++ b/public/js/buildings/wohnhaus.js @@ -187,7 +187,12 @@ function initDrop() { const label = slot.querySelector(".slot-label"); - slot.innerHTML = ``; + slot.innerHTML = ` + + `; initSlotDrag(); @@ -205,8 +210,9 @@ function initSlotDrag() { img.addEventListener("dragstart", (e) => { const slot = img.closest(".slot"); - e.dataTransfer.setData("icon", img.src); - e.dataTransfer.setData("fromSlot", slot.dataset.slot); + e.dataTransfer.setData("itemId", img.dataset.id); + e.dataTransfer.setData("itemLevel", img.dataset.level); + e.dataTransfer.setData("slot", slot.dataset.slot); }); }); } @@ -221,19 +227,42 @@ function initInventoryDrop() { grid.addEventListener("drop", (e) => { e.preventDefault(); - const icon = e.dataTransfer.getData("icon"); + const itemId = e.dataTransfer.getData("itemId"); + const itemLevel = e.dataTransfer.getData("itemLevel"); + const slot = e.dataTransfer.getData("slot"); - if (!icon) return; + if (!itemId) return; + + const icon = document.querySelector( + '.slot[data-slot="' + slot + '"] img', + ).src; const newItem = document.createElement("div"); newItem.classList.add("inventory-slot"); newItem.setAttribute("draggable", "true"); + newItem.dataset.id = itemId; + newItem.dataset.level = itemLevel; + newItem.innerHTML = ``; grid.appendChild(newItem); + /* Slot leeren */ + + const equipSlot = document.querySelector('.slot[data-slot="' + slot + '"]'); + + const label = equipSlot.querySelector(".slot-label"); + + equipSlot.innerHTML = ""; + + if (label) { + equipSlot.appendChild(label); + } + + equipSlot.classList.remove("has-item"); + initDrag(); }); }