Why are my else if statements not working

[codethematrix1]

Why are these not working the code works on the first if statement then stops working with no error messages in the console.

let normalTreeChopped = 0
let patch1 = document.getElementById("patch-image-1")
let patch1Src = patch1.getAttribute('src')

let patch2 = document.getElementById("patch-image-2")
let patch2Src = patch2.getAttribute('src')

let patch3 = document.getElementById("patch-image-3")
let patch3Src = patch3.getAttribute('src')

let nonePath = 'assets/img/woodcutting/trees/none.png'

function startTreeGrow() {
	if (woodLevel >= 1) {
		let normalTreeChance = Math.floor(Math.random() * 45)
		if (normalTreeChance == 33) {
			if (patch1Src == nonePath) {
				document.getElementById("treeName1").innerHTML = "Tree"
				patch1.src = 'assets/img/woodcutting/trees/tree/tree1.png'
			} else if (patch2Src == nonePath) {
				console.log("2!")
				document.getElementById("treeName2").innerHTML = "Tree"
				patch2.src = 'assets/img/woodcutting/trees/tree/tree1.png'
			} else if (patch3Src == nonePath) {
				console.log("3!")
				document.getElementById("treeName3").innerHTML = "Tree"
				patch3.src = 'assets/img/woodcutting/trees/tree/tree1.png'
			} else {
				console.log("NOPE!")
			}
		}
	}
}

setInterval(startTreeGrow, 1000)

[hbar1st]

hi there, is this an fCC challenge? Can you post a link to it?

[codethematrix1]

No it’s not. Its just something I’m stuck on.

[hbar1st]

maybe you can try adding some log statements?

@codethematrix1

if (normalTreeChance == 33) {

for eg. if this if is not executing then I would add a console.log right above it
console.log("normalTreeChance = " + normalTreeChance);

Eventually you will find a log that is unexpected and can work from there.

[codethematrix1]

yeah, the else ifs are broken

[hbar1st]

can you log patch1Src patch2Src etc?

[codethematrix1]

patch1 says tree1 as src because The program was running for an while if it was not it would’ve been none.png

Here is my HTML if you’re curious

      
            <!--Woodcutting-->
            <div id="woodcut" class="tabcontents">
                <h1 style="text-align: center;" class="titleSkill">Woodcutting</h1>
                <h3 id="levelWoodcut" style="text-align: center;">Woodcutting Level: 1</h3>
                <div class="grass">
                    <span>
                        <span class="path-margin desc-patch"><p id="treeName1" class="treeNAME">None</p><p id="timeleft1tree">(00:00:00)</p></span>
                        <img class="patchO-grass" id="patch-image-1" src="assets/img/woodcutting/trees/none.png">
                    </span>
                    <span>
                        <span class="path-margin desc-patch"><p id="treeName2" class="treeNAME">None</p><p id="timeleft1tree">(00:00:00)</p></span>
                       <img class="patchO-grass" id="patch-image-2" src="assets/img/woodcutting/trees/none.png">
                    </span>
                    <span>
                        <span class="path-margin desc-patch"><p id="treeName1" class="treeNAME">None</p><p id="timeleft1tree">(00:00:00)</p></span>
                       <img class="patchO-grass" id="patch-image-3" src="assets/img/woodcutting/trees/none.png">
                    </span>
                 </div>
            </div>

(sorry of the formatting) don’t mind the time left

[hbar1st]

what if you do this

console.log(patch1Src == nonePath);
console.log(patch1Src === nonePath);
console.log(patch1Src.equals(nonePath));

[codethematrix1]

[hbar1st]

so true means that the if statement did fire.

@codethematrix1

			if (patch1Src == nonePath) {
				document.getElementById("treeName1").innerHTML = "Tree"
				patch1.src = 'assets/img/woodcutting/trees/tree/tree1.png'
			}

Can you add a console.log inside this if? We know it is running, but maybe you are just not seeing the results?

[codethematrix1]

the if staement works fine its just the else if statements that don’t work
Here is a visual

The nones are supposed to be trees if the else if did not work

[hbar1st]

@hbar1st

console.log(patch1Src == nonePath);
console.log(patch1Src === nonePath);

Sorry, i keep misreading you.
Can you do the above for patch2Src and patch3Src then?

[codethematrix1]

true and true

[hbar1st]

can you log them all at the same time?
including patch1Src first, then patch2Src etc.
I want to see what they are simultaneously

[codethematrix1]

Is this what you want?

That’s weird because the tree started growing in the first patch it’s supposed to be assets/img/woodcutting/trees/tree/tree1.png right now it displays assets/img/woodcutting/trees/tree/tree1.png but the console says it’s not.

[hbar1st]

yes so you can see that they are all true
this means the first if will fire which is why no else will fire after that

[codethematrix1]

Red the top I juts updated it. lemme try changing patch1.src to patch1Src when I change the image to a tree

[codethematrix1]

so it works now but the images are nto showing up Ill fix that onmyown in the meantime I found some more naming errors like treeName3 was not even there