Interact between values-CodePudding

I'm wondering how to stop counting money (iloscPieniedzy) when HP (iloscZycia) is 0 in this code:

let iloscZycia = 20;

const sumaZycia = document.getElementById("suma-zycia");
const dodajZycie = document.getElementById('dodaj-zycie');
const odejmijZycie = document.getElementById('odejmij-zycie');

dodajZycie.addEventListener("click", function() {
  iloscZycia  ;
  sumaZycia.textContent = iloscZycia;
});

odejmijZycie.addEventListener("click", function() {
  iloscZycia = iloscZycia - 5;
  if (iloscZycia <= 0) {
    iloscZycia = 0
  };

  sumaZycia.textContent = iloscZycia;
});


let iloscPieniedzy = 0;

const sumaPieniedzy = document.getElementById("suma-pieniedzy");
const dodajPieniadze = document.getElementById('dodaj-pieniadze');
const odejmijPieniadze = document.getElementById('odejmij-pieniadze');

dodajPieniadze.addEventListener("click", function() {
  iloscPieniedzy = iloscPieniedzy   10;
  sumaPieniedzy.textContent = iloscPieniedzy;
});

odejmijPieniadze.addEventListener("click", function() {
  iloscPieniedzy = iloscPieniedzy - 1;
  if (iloscPieniedzy <= 0) {
    iloscPieniedzy = 0
  };

  sumaPieniedzy.textContent = iloscPieniedzy;
});

I tried something like this:

if (sumaZycia=0){
    sumaPieniedzy=0
};

but even this doesn't work like it's not connected.

CodePudding user response：

the = operator is used to assign values to variables what you're looking for is the equality operator ===.

so try it like this:

if (iloscZycia === 0){
  iloscPieniedzy = 0
};

CodePudding user response：

Because Stack Overflow is an English language site, I've renamed your variables and created a map of the new names to previous names in comments at the top of the JavaScript below.

If you create a functional closure for updating your numeric variables, you can encapsulate the necessary logic for only updating money when hp is not equal to 0.

Here's a working example in a code snippet:

// hp: iloscZycia
// element1: sumaZycia
// element2: dodajZycie
// element3: odejmijZycie

// money: iloscPieniedzy
// element4: sumaPieniedzy
// element5: dodajPieniadze
// element6: odejmijPieniadze

let hp = 20;

const adjustHp = (amount) => {
  hp  = amount;
  if (hp < 0) hp = 0;

  element1.textContent = hp;
};

const element1 = document.getElementById("suma-zycia");
const element2 = document.getElementById("dodaj-zycie");
const element3 = document.getElementById("odejmij-zycie");

element1.textContent = hp;

element2.addEventListener("click", () => adjustHp(1));
element3.addEventListener("click", () => adjustHp(-5));

let money = 0;

const adjustMoney = (amount) => {
  // Update money, but ONLY if hp is not 0:
  if (hp !== 0) {
    money  = amount;
    if (money < 0) money = 0;
  }

  element4.textContent = money;
};

const element4 = document.getElementById("suma-pieniedzy");
const element5 = document.getElementById("dodaj-pieniadze");
const element6 = document.getElementById("odejmij-pieniadze");

element4.textContent = money;

element5.addEventListener("click", () => adjustMoney(10));
element6.addEventListener("click", () => adjustMoney(-1));

.group { display: flex; gap: 0.5rem; }

<h2>HP</h2>
<div >
  <button id="odejmij-zycie">-</button>
  <div id="suma-zycia">0</div>
  <button id="dodaj-zycie"> </button>
</div>

<h2>Money</h2>
<div >
  <button id="odejmij-pieniadze">-</button>
  <div id="suma-pieniedzy">0</div>
  <button id="dodaj-pieniadze"> </button>
</div>