-1

Hi! I hope you are doing fine!
I've been working on some kind of tool for a Mining system for an ARPG. I've managed to make a Random Number Generator with probabilities -I'm using Javascript-.

My idea is to do the following:

In this project, 'Mining' can go from level 0 up to level 10. And as the player levels up, each probability to find minerals goes up +4% for each level (lvl 1: +4%, lvl 2: +8%, lvl 3: +12% ...). I've given numbers to each mineral (5 in total). Each of these ores has this probability of appearing at level 0:

-Mining Lvl 0-
1. Copper: 80%
2. Iron: 60%
3. Titanium: 40%
4. Silver: 10%
5. Platinum: 5%
And everytime time a player levels up +4% should be added to each ore.

What I did:

I wanted to create a tool that would give me a random number (from 1 to 5) depending on the probabilities of each one AND the players Level. So what I did was create a page where I would input the level, then click a button and then the result should appear on a < p > element.

The page

 <div class="genbox"> <!--this is just a container for the tool-->
    <h3><u>Enter Level & Click the button to get a random Number</u></h3>
    <label for="txtLvl">Current Level:</label>
    <input type="number" id="txtLvl" name="Enter current Lvl here">
    <button onclick=mLvl() class="sbutton">Click me!</button>
    <br><hr>
    <p id="mresult">Result Here</p>
    <hr>
</div>

And here's my function:

function mLvl() {
    //to get the value entered
    //need to check if value=0,1,2,3...10 --
    //var inputText = document.getElementById(txtLvl).value;
    //For lvl 0:
    function mRandom() {
    var n=Math.floor(Math.random()*100)
    switch(n){
        case n<80:
            return 1;
        case n<60:
            return 2;
        case n<40:
            return 3;
        case n<10:
            return 4;
        case n<5:
            return 5;                   
        }
    }
document.getElementById("mresult").innerHTML= mRandom();
}


Here I wanted to test if this was working and just click the button to get the result on a < p > element. The problem is that whenever I did, I would get 'undefined' printed out instead.


I would like to know how to fix it so that I can display the value when I click the button.
**Thank you so much for reading, and have a nice day.**
Waffles77
  • 13
  • 7

2 Answers2

1

You're executing mRandom() when the click happens. Instead, you'll want to execute the document.getElementById(mresult).innerHTML= mRandom(); statement in there. So put that into a function to call:

<div class="genbox"> <!--this is just a container for the tool-->
    <h3><u>Enter Level & Click the button to get a random Number</u></h3>
    <label for="txtLvl">Current Level:</label>
    <input type="number" id="txtLvl" name="Enter current Lvl here">
    <button onclick="newLevel()" class="sbutton">Click me!</button>
    <!--             ^^^^^^^^^^^^^ -->
    <br><hr>
    <p id="mresult">Result Here</p>
    <hr>
</div>

function newLevel() {
    var inputText = document.getElementById("txtLvl").value;
    …
    document.getElementById("mresult").innerHTML = mRandom();
}
Bergi
  • 630,263
  • 148
  • 957
  • 1,375
  • Hello! Thank you for your reply! I've made the changes you've suggested but when I click on the button now i get another type of error: `Uncaught RangeError: Maximum call stack size exceeded at Math.random () at mRandom (random.html:182) at mRandom (random.html:195)` - the lines that it points out are: `var n=Math.floor(Math.random()*100)` - And : `document.getElementById("mresult").innerHTML = mRandom(); ` – Waffles77 Jun 23 '20 at 13:42
  • @Waffles77 Don't change your `mRandom` function. Keep it exactly as it was in your question. – Bergi Jun 23 '20 at 13:59
  • I've edited my question with the "" i was missing and stuff. I've realized I was placing the document.getElement... outside the function so I've changed that too - but the function stays the same. Thank you for the inputText var, since now i know how to check which lvl the user enters. But i keep getting the error for the Math.random! – Waffles77 Jun 23 '20 at 14:14
  • @Waffles77 But `document.getElementById("mresult").innerHTML= mRandom();` **should** be placed outside of the function - it's the line that is calling the function in the first place. It should be placed inside the `newLevel` function instead. – Bergi Jun 23 '20 at 14:15
  • I see! I apologize! I'll make that change then. – Waffles77 Jun 23 '20 at 14:16
  • --Now it is indeed trying to display the result but it prints out 'undefined' instead on the < p >. What could be going wrong? I'll edit the question with what i have now. Thank you so much for your time! – Waffles77 Jun 23 '20 at 14:28
  • @Waffles77 That's because your `mRandom` function doesn't `return` anything. Apart from your [`switch` statement being broken](https://stackoverflow.com/q/17145723/1048572), you don't seem to have a result for random values between 80 and 99. – Bergi Jun 23 '20 at 14:36
1

You are missing "" and also executing the code which displays the output outside of function so it will be set when the script is loaded and not when you click...

Do following to make it correct...

function mRandom() {
    let n=Math.floor(Math.random()*100)
    let result=0
    if(n<80)result= 1;
    else if(n<60)result= 2;
    else if(n<40)result= 3;
    else if(n<10)result= 4;
    else if(n<5)result= 5;                   

    document.getElementById("mresult").innerHTML=result;
}