Created elements in my game are sometimes doing their needed function, sometimes not

1 day ago 1
ARTICLE AD BOX

I'm making a game where "Blorbs" roam around and drink water when thirsty, eat when hungry, and have kids if they have enough food and water.

My whole problem is that the Blorb clones I make using createElement and the movements and stuff I make them do aren't working for some of them. Someone told me to elaborate on that: I mean that the movement scripts for each Blorb are not working for everyone. Some of the Blorbs move and go to places when they need to, like when they're thirsty or hungry, they eat and drink, but some just sit there, frozen. It's also important to note that the Blorbs that were previously moving don't ever freeze like this; this is how I know it's not to do with the freeze in the mating logic.

Obviously, I don't want empty shells of a clone sitting there with no purpose.

All of this is in base JavaScript, in an HTML file with no mods or anything added.

async function createBlorb(type) { blorbsMade += 1; let blorb = document.createElement("img"); blorb.id = "blorb" + blorbsMade; console.log(blorb.id + " spawned into this world!") gameLog(blorb.id + " spawned into this world!") while (idList.includes(blorb.id)) { blorbsMade++; blorb.id = "blorb" + blorbsMade; } idList.push(blorb.id) blorb.src = "textures/creatures/" + type; blorb.classList.add("blorb") blorb.style.top = (Math.floor(Math.random() * 800) + 1) + "px" blorb.style.left = (Math.floor(Math.random() * 1000) + 1) + "px" document.body.appendChild(blorb); blorbMovement(blorb.id, "Blorb #" + blorbsMade); } async function blorbMovement(id,displayID) { let blorbFood = 100; let blorbWater = 100; let distMoved = 0; let distMovedCUnSqrt = 0; let cycles = 0; let prevLocX = 0; let prevLocY = 0; let curLocX = 0; let curLocY = 0; while (true) { await sleep(2500) const blorbValid = document.getElementById(id); const blorbID = displayID; console.log(blorbID + " is thinking...") gameLog(blorbID + " is thinking...") if (blorbValid) { await sleep(1000) if (!blorbValid) { console.log(blorbID + " was deleted because it no longer exists...") gameLog(blorbID + " was deleted because it no longer exists...") blorbValid.remove() return; } if (blorbWater < 1 || blorbFood < 1) { console.log(blorbID + " died.") gameLog(blorbID + " died.") blorbValid.remove() return; } if (blorbWater < 80) { prevLocX = parseFloat(blorbValid.style.left) || 0; prevLocY = parseFloat(blorbValid.style.top) || 0; if (Math.floor(Math.random() * 2) + 1 === 1) { blorbValid.style.top = ((Math.floor(Math.random() * 50) + 1) + 500) + "px" blorbValid.style.left = ((Math.floor(Math.random() * 50) + 1) + 1000) + "px" } else { blorbValid.style.top = ((Math.floor(Math.random() * 50) + 1) + 500) + "px" blorbValid.style.left = ((Math.floor(Math.random() * 50) + 1) + 250) + "px" } blorbWater += Math.floor(Math.random() * 15) + 1; blorbFood -= 10; console.log(blorbID + " has " + blorbWater + " water and " + blorbFood + " food left.") } else if (blorbFood < 80){ prevLocX = parseFloat(blorbValid.style.left) || 0; prevLocY = parseFloat(blorbValid.style.top) || 0; blorbValid.style.top = (tree.offsetTop + (Math.floor(Math.random() * 35) + 1)) + "px" blorbValid.style.left = (tree.offsetLeft + (Math.floor(Math.random() * 35) + 1)) + "px" treeEaten += 1; if (treeEaten > 5) { treeEaten = 0; tree.style.display = "none"; treeRespawn() } blorbFood += Math.floor(Math.random() * 15) + 1; console.log(blorbID + " has " + blorbWater + " water and " + blorbFood + " food left.") } else if (blorbFood > 90 && blorbWater > 90 && mateList.includes(blorbID) === false) { prevLocX = parseFloat(blorbValid.style.left) || 0; prevLocY = parseFloat(blorbValid.style.top) || 0; if (mateOffer < 2) { mateOffer += 1; mateList.push(blorbID); console.log(mateList) } } else if (blorbFood > 90 && blorbWater > 90 && mateOffer === 2 && mateList.includes(blorbID)) { prevLocX = parseFloat(blorbValid.style.left) || 0; prevLocY = parseFloat(blorbValid.style.top) || 0; blorbValid.style.top = 100 + (Math.floor(Math.random() * 30) + 1) + "px" blorbValid.style.left = 700 + (Math.floor(Math.random() * 30) + 1) + "px" await sleep(3000) mateOffer -= 1; mateList = []; blorbFood -= 50; blorbWater -= 50; if (Math.floor(Math.random() * 2) + 1 === 1) { createBlorb("fancy_blorb.png"); } else { createBlorb("blorb.png") } } else { prevLocX = parseFloat(blorbValid.style.left) || 0; prevLocY = parseFloat(blorbValid.style.top) || 0; blorbValid.style.top = (Math.floor(Math.random() * 800) + 1) + "px" blorbValid.style.left = (Math.floor(Math.random() * 1000) + 1) + "px" blorbFood -= 10; blorbWater -= 10; console.log(blorbID + " has " + blorbWater + " water and " + blorbFood + " food left.") } console.log(blorbID) curLocX = parseFloat(blorbValid.style.left); curLocY = parseFloat(blorbValid.style.top); distMovedCUnSqrt = Math.pow((curLocX-prevLocX),2) + Math.pow((curLocY-prevLocY),2); distMoved += Math.sqrt(distMovedCUnSqrt); cycles += 1; if (cycles > 3 && distMoved === 0) { console.log(blorbID + " was deleted because it was too lazy...") blorbValid.remove() return; } else if (cycles > 3) { cycles = 0; distMoved = 0; } } } }
Read Entire Article