1
\$\begingroup\$

So I have a button that is the 'mine' for my incremental game. I would like to track the number of times that it is clicked and be able to do two things:

  1. Have events happen say every 5 clicks.
  2. display the total number of times that is has been clicked.

This is what I have so far:

function addstone(){
        //stone = (parseFloat(stone) + 0.1).toFixed(1);
        //stone = stone + 1;
        var count = 0;
        var totalcount = 0;
            $("input[type='button']").click(function(){
                count = count + 1;
                if(count == 5){
                    stone = stone + 1;}
                if(count == 5){
                    count = 0;
                    totalcount = totalcount + 1;}
                }
                document.getElementById("stone").innerHTML = stone;
    }   

So what do I need to do from here. My button calls function "mine1Click" which in turn calls the different resource addition functions. so for "mine1Click" I have this:

function mine1Click(){ 
    addstone();
    addwood();
    }

function addstone(){
        //stone = (parseFloat(stone) + 0.1).toFixed(1);     TOO LARGE
        //stone = stone + 1;                                TOO MUCH STONE
        var count = 0;
        var totalcount = 0;
            $("input[type='button']").click(function(){
                count = count + 1;
                if(count == 5){
                    stone = stone + 1;}
                if(count == 5){
                    count = 0;
                    totalcount = totalcount + 1;}
                }
                document.getElementById("stone").innerHTML = stone;
    }   

function addwood(){
    wood = wood + 1;
    document.getElementById("wood").innerHTML = wood;
}

//function addcopper(){                                     UNIMPLEMENTED

//}

How should I go about this?

\$\endgroup\$

1 Answer 1

1
\$\begingroup\$

To do the two things that you need:

  1. Have events happen say every 5 clicks.

    if(count % 5 == 0){
        // do event
    }
    

    % is the modulo operator. What this does is it returns the remainder of count divided by 5. Hence, every multiple of 5, the condition is fulfilled, and the event is triggered.

  2. Display the total number of times that it has been clicked.

    I think what you did is fine. document.getElementById(id).innerHTML = count

Putting it together

You can use a "global" variable

    var stoneCount = 0;

    function addStone(){
        stoneCount++;

        if(stoneCount % 5 == 0){
            // do event
        }

        document.getElementById("stone").innerHTML = stoneCount;
    }

or if you dont want to clutter the global namespace:

function createStoneCounter(){
    var count = 0;

    return function(){
        count++;

        if(count % 5 == 0){
            // do event
        }

        // display count
    }
}

$("<your selector>").click(createStoneCounter());
\$\endgroup\$
0

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .