How to stop a value from going into negative value

Cornelius Labuschagne

I'm developing an incremental game here is the link for visual reference:

https://code.sololearn.com/WF65X6DEns7o/#css

The problem i have is that buttons can be clicked unlimited times and INCOME value will go into the negative.

How can disable the button if the player doesn't have enough INCOME to click the button

function buttonOne() {
  a++;
  document.getElementById("btnLabel1").innerHTML = " Units Owned :  " + a;
  income -= 500;
  document.getElementById("HeaderLabel").innerHTML = "<b> OK, good, now let's   watch as your money starts to generate slowly but surely. < p > After all no   empire was built in a day. < p > When you have enough money you can buy more   units. " ;


  window.setInterval(function move() {
    var elem = document.getElementById("myprogbar1");
    var width = 1;
    var id = setInterval(frame, 4);

    function frame() {
      if (width >= 100) {
        clearInterval(id);
      } else {
        width++;
        elem.style.width = width + '%';
      }
    }
  }, 1000)
}

function buttonTwo() {
  b++;
  document.getElementById("btnLabel2").innerHTML = " Units Owned :  " + b;
  income -= 1000;

  window.setInterval(function move() {
    var elem = document.getElementById("myprogbar2");
    var width = 1;
    var id = setInterval(frame, 9);

    function frame() {
      if (width >= 100) {
        clearInterval(id);
      } else {
        width++;
        elem.style.width = width + '%';
      }
    }
  }, 2000)
}

function buttonThree() {
  c++;
  document.getElementById("btnLabel3").innerHTML = " Lofts Owned :  " + c;
  income -= 2000;

  window.setInterval(function move() {
    var elem = document.getElementById("myprogbar3");
    var width = 1;
    var id = setInterval(frame, 19);

    function frame() {
      if (width >= 100) {
        clearInterval(id);
      } else {
        width++;
        elem.style.width = width + '%';
      }
    }
  }, 3000)
}
<div id="gameMoneyBG">
  <div id="gameMoney"> Income : $ 500 </div</div>

    <button id="buttonOne" onclick="buttonOne()">
          <b>Small Units</b></button>
    <div id="progbar1">
      <div id="myprogbar1"> </div>
    </div>
    <br /> <br />
    <div id="btnLabel1"> Units Owned : 0 </div>
    <div id="costLabel1">
      Unit Cost : $ 500 </div>

    <br /><br />

    <button id="buttonTwo" onclick="buttonTwo()"><b>Large Units</b></button>
    <div id="progbar2">
      <div id="myprogbar2"> </div>
    </div>
    <br /><br />
    <div id="btnLabel2"> Units Owned : 0 </div>
    <div id="costLabel2"> Unit Cost : $ 1000 </div>

    <br /><br />

    <button id="buttonThree" onclick="buttonThree()"><b>City Lofts</b></button>
    <div id="progbar3">
      <div id="myprogbar3"> </div>
    </div>
    <br /><br />
    <div id="btnLabel3"> Lofts Owned : 0 </div>
    <div id="costLabel3"> Loft Cost : $ 2000 </div>

prasanth

paste the code with each function after income -=num .It will restrict the value below 0 .its ternary operator

 income= income < 0 ? 0 :income;

Js Code

 var income = 500;
    var a = 0;
    var b = 0;
    var c = 0;

    alert("Welcome to my game. It took me 2 days to create it.  I hope you enjoy it. \n\nPlease note that you get best experience on a PC not on a mobile. \n\n Also please ignore any bugs you may find, but feedback on improvement is welcome.")


    function buttonOne() {

        a++;
        document.getElementById("btnLabel1").innerHTML = " Units Owned :  " + a;
        income-=500;
         income= income < 0 ? 0 :income;
        document.getElementById("HeaderLabel").innerHTML = "<b> OK, good, now lets watch as your money starts to generate slowly but surely. <p> After all no empire was built in a day. <p> When you have enough money you can buy more units." ;


        window.setInterval (function move() {
        var elem = document.getElementById("myprogbar1");
        var width = 1;
        var id = setInterval(frame, 4);
        function frame() {
            if (width >= 100) {
                clearInterval(id);
            } else {
                width++;
                elem.style.width = width + '%';
            }
        }
    }, 1000)
    }

    function buttonTwo() {
        b++;
        document.getElementById("btnLabel2").innerHTML = " Units Owned :  " + b;
        income-=1000;
             income= income < 0 ? 0 :income;
        window.setInterval (function move() {
        var elem = document.getElementById("myprogbar2");
        var width = 1;
        var id = setInterval(frame, 9);
        function frame() {
            if (width >= 100) {
                clearInterval(id);
            } else {
                width++;
                elem.style.width = width + '%';
            }
        }
    }, 2000)
    }

    function buttonThree() {
        c++;
        document.getElementById("btnLabel3").innerHTML = " Lofts Owned :  " + c;
        income-=2000;
         income= income < 0 ? 0 :income;
        window.setInterval (function move() {
        var elem = document.getElementById("myprogbar3");
        var width = 1;
        var id = setInterval(frame, 19);
        function frame() {
            if (width >= 100) {
                clearInterval(id);
            } else {
                width++;
                elem.style.width = width + '%';
            }
        }
    }, 3000)
    }

    window.setInterval(function() {
        if (a >= 1)
          document.getElementById("gameMoney").innerHTML = " Income : $ " + (income+=a*5);

        if(a>=25)
        document.getElementById("gameMoney").innerHTML = " Income : $ " + (income+=a *10);

        if(a>=50)
        document.getElementById("gameMoney").innerHTML = " Income : $ " + (income+=a *20);

    }, 1000)

    window.setInterval(function() {
        if (b >= 1)
          document.getElementById("gameMoney").innerHTML = " Income : $ " + (income+=b+49*b);

        if (b >= 25)
          document.getElementById("gameMoney").innerHTML = " Income : $ " + (income+=b+49*b*4);

        if (b >= 50)
          document.getElementById("gameMoney").innerHTML = " Income : $ " + (income+=b+49*b*8);

    }, 2000)

    window.setInterval(function() {
        if (c >= 1)
          document.getElementById("gameMoney").innerHTML = " Income : $ " + (income+=c+99*c);

        if (c >= 25)
          document.getElementById("gameMoney").innerHTML = " Income : $ " + (income+=c+99*c*4);

        if (c >= 50)
          document.getElementById("gameMoney").innerHTML = " Income : $ " + (income+=c+99*c*8);
    }, 3000)

    function income(){
        if (income >= 1000000)
        document.getElementById("HeaderLabel").innerHTML = "You have been caught for tax evasion. The Government will now take $500 000." ;
    }

Collected from the Internet

Please contact [email protected] to delete if infringement.

edited at
0

Comments

0 comments
Login to comment

Related