Okay so what I'd like to do is drag the dog food in the inventory slot onto the dog food bowls. Right now my code registers that the dog food is being dragged and it even knows that it's in inventory slot 0. Furthermore it knows that the dropzone (objZone4) has particular coordinates of "361,237,401,274". However, when I drag the dog food over the food bowls, all I see is a red cancellation sign and I'm not seeing the square drop zone box. What's interesting is if I leave the current room and climb up the ship some, there's a drop zone that DOES work using the same code. Am I missing something? The code will enter dragStart() but is unable to enter dragOver() because the drop zone isn't working correctly. Why would it work in one room if it doesn't work in another?
//get the drop zone and let it be droppable
this.objZone4 = document.getElementById("objZone4");
this.objZone4.addEventListener('dragover', this.dragOver);
this.objZone4.addEventListener('drop', this.dragDrop);
dragStart(e) {
//it still knows coordinates of the food bowl
console.log('hello good sir: ' + e.target.id);
//assigns to beingDragged the current inventory slot
//simply evaluates to 0,1,2,3,4,5,6, or 7 so it knows the inventory slot
//for instance it knows if dog food is in inventory slot 0
document.getElementById("beingDragged").innerText = (parseInt((e.target.id)[7]) - 1);
}
dragOver(e) {
//allow drop into square
e.preventDefault();
}
dragDrop(e) {
//not working
}
