Random Numbers Generator based on Current Time and Birth Date

Question

I am starting to learn JavaScript and I found this article: http://michalbe.blogspot.ro/2011/02/javascript-random-numbers-with-custom.html

I liked the idea of a custom seed number generator but I for the love of Thor cannot figure it out, I really need a practical example done with pure javascript or a library like jQuery if it's easier.

Here we go:

So what I want is to generate 10 different numbers sepparated by "-" (minus), each number with the range of 1-50 and I would like the seed for each number to be made up by multiplying 2 things:

1. the current time in as much as a bigger number sequence as you can get it (with a delay of 1 second for each number so the time will be different)
2. your birth date (from 3 select inputs)

[!] Also I want to know how we can animate the generation of these 10 numbers in different ways, like... for example the animation of old train station Arival/Departures mechanical displays, or like different HTML5 canvas particle techniques or CSS3 or anything really. - This can be done in another question if you think it's too much.

If you are able to help me out with this I will be so very forever grateful!

Thank you!

var CustomRandom = function(nseed) {    
  
  var seed,    
    constant = Math.pow(2, 13)+1,    
    prime = 1987,    
//any prime number, needed for calculations, 1987 is my favorite:)  
    maximum = 50;    
//maximum number needed for calculation the float precision of the numbers (10^n where n is number of digits after dot)  
    if (nseed) {    
      seed = nseed;    
    }    
    
    if (seed == null) {    
//before you will correct me in this comparison, read Andrea Giammarchi's text about coercion http://goo.gl/N4jCB  
      
      seed = (new Date()).getTime();   
//if there is no seed, use timestamp     
    }     
    
    return {    
      next : function(min, max) {    
        seed *= constant;    
        seed += prime;    
           
      
        return min && max ? min+seed%maximum/maximum*(max-min) : seed%maximum/maximum;  
// if 'min' and 'max' are not provided, return random number between 0 & 1  
      }    
    }    
}

var rng = CustomRandom(09031887);
//use '09031887' as a seed ?
    rng.next();
    rng.next();
});

<b>Your birth date:</b><br>
Day: 
<select id="day">
<option selected="selected">01</option>
<option>02</option><option>03</option><option>04</option><option>05</option><option>06</option><option>07</option><option>08</option><option>09</option><option>10</option><option>11</option><option>12</option><option>13</option><option>14</option><option>15</option><option>16</option><option>17</option><option>18</option><option>19</option><option>20</option><option>21</option><option>22</option><option>23</option><option>24</option><option>25</option><option>26</option><option>27</option><option>28</option><option>29</option><option>30</option><option>31</option>
</select>
Month:
<select id="month">
<option selected="selected">01</option>
<option>02</option><option>03</option><option>04</option><option>05</option><option>06</option><option>07</option><option>08</option><option>09</option><option>10</option><option>11</option><option>12</option>
</select>
Year: 
<select id="year">
<option selected="selected">1998</option>
<option>1997</option><option>1996</option><option>1995</option><option>1994</option><option>1993</option><option>1992</option><option>1991</option><option>1990</option><option>1989</option><option>1988</option><option>1987</option><option>1986</option><option>1985</option><option>1984</option><option>1983</option><option>1982</option><option>1981</option><option>1980</option><option>1979</option><option>1978</option><option>1977</option><option>1976</option><option>1975</option><option>1976</option><option>1975</option><option>1976</option>
</select>
<br><br>

<span id="nr1"></span> - 
<span id="nr2"></span> - 
<span id="nr3"></span> - 
<span id="nr4"></span> - 
<span id="nr5"></span> - 
<span id="nr6"></span> - 
<span id="nr7"></span> - 
<span id="nr8"></span> - 
<span id="nr9"></span> - 
<span id="nr10"></span>
<br><br>

<button>Generate</button>

Answer 1

If you fix the SyntaxError in your supplied code, then the Javascript code actually works. You don't have any event handlers to control it with your supplied HTML though.

var CustomRandom = function (nseed) {
    var seed,
        constant = Math.pow(2, 13) + 1,
        prime = 1987,
        //any prime number, needed for calculations, 1987 is my favorite:)  
        maximum = 50;
        //maximum number needed for calculation the float precision of the numbers (10^n where n is number of digits after dot)  
    
    if (nseed) {
        seed = nseed;
    }

    if (seed == null) {
        //before you will correct me in this comparison, read Andrea Giammarchi's text about coercion http://goo.gl/N4jCB  
        seed = (new Date()).getTime();
        //if there is no seed, use timestamp     
    }

    return {
        next: function (min, max) {
            seed *= constant;
            seed += prime;

            return min && max ? min + seed % maximum / maximum * (max - min) : seed % maximum / maximum;
            // if 'min' and 'max' are not provided, return random number between 0 & 1  
        }
    }
}

var rng = CustomRandom(09031887),
    //use '09031887' as a seed ?
    pre = document.getElementById('out');

pre.textContent += rng.next() + '\n';
pre.textContent += rng.next();

<pre id="out"></pre>

A further example of using the library that you linked to.

Math.seedrandom(09031887);
//use '09031887' as a seed ?

var pre = document.getElementById('out');

pre.textContent += Math.random() + '\n'; // output always 0.21968861683194144
pre.textContent += Math.random(); // output always 0.9079655673042485

<script src="//cdnjs.cloudflare.com/ajax/libs/seedrandom/2.4.0/seedrandom.min.js"></script>
<pre id="out"></pre>

Answer 2

This is as close as I got using David Bau's script (seedrandom.js):

<script src="//cdnjs.cloudflare.com/ajax/libs/seedrandom/2.4.0/seedrandom.min.js">
</script>
<b>Your birth date:</b><br>
Day: 
<select id="day">
<option selected="selected">day</option><option value="1">01</option><option value="2">02</option><option value="3">03</option><option value="4">04</option><option value="5">05</option><option value="6">06</option><option value="7">07</option><option value="8">08</option><option value="9">09</option><option>10</option><option>11</option><option>12</option><option>13</option><option>14</option><option>15</option><option>16</option><option>17</option><option>18</option><option>19</option><option>20</option><option>21</option><option>22</option><option>23</option><option>24</option><option>25</option><option>26</option><option>27</option><option>28</option><option>29</option><option>30</option><option>31</option>
</select>
Month:
<select id="month">
<option selected="selected">month</option><option value="1">01</option><option value="2">02</option><option value="3">03</option><option value="4">04</option><option value="5">05</option><option value="6">06</option><option value="7">07</option><option value="8">08</option><option value="9">09</option><option>10</option><option>11</option><option>12</option>
</select>
Year: 
<select id="year">
<option selected="selected">year</option><option>2015</option><option>2014</option><option>2013</option><option>2012</option><option>2011</option><option>2010</option><option>2009</option><option>2008</option><option>2007</option><option>2006</option><option>2005</option><option>2004</option><option>2003</option><option>2002</option><option>2001</option><option>2000</option><option>1999</option><option>1998</option><option>1997</option><option>1996</option><option>1995</option><option>1994</option><option>1993</option><option>1992</option><option>1991</option><option>1990</option><option>1989</option><option>1988</option><option>1987</option><option>1986</option><option>1985</option><option>1984</option><option>1983</option><option>1982</option><option>1981</option><option>1980</option><option>1979</option><option>1978</option><option>1977</option><option>1976</option><option>1975</option><option>1976</option><option>1975</option><option>1976</option><option>1975</option><option>1974</option><option>1973</option><option>1972</option><option>1971</option><option>1970</option><option>1969</option><option>1968</option><option>1967</option><option>1966</option><option>1965</option><option>1964</option><option>1963</option><option>1962</option><option>1961</option><option>1960</option>
</select>

<br><br>

<span id="nr1"></span> / 
<span id="nr2"></span> / 
<span id="nr3"></span> / 
<span id="nr4"></span> / 
<span id="nr5"></span> / 
<span id="nr6"></span> / 
<span id="nr7"></span> / 
<span id="nr8"></span> / 
<span id="nr9"></span> / 
<span id="nr10"></span>
<br><br>

<button onclick="generate()">Generate</button>

<script type="text/javascript">
function generate() {
    // get user's birth date as a number
    var day = (document.getElementById("day").value);
    var month = (document.getElementById("month").value);
    var year = (document.getElementById("year").value);
    var dob = (day+month+year);

    //check if user specified dob
    if(isNaN(day) || isNaN(month) || isNaN(year))
   {
    alert("Check your birth date!");
   }
    else {
    // Sets Math.random to an ARC4-based PRNG that is autoseeded using the
    // current time, dom state, and other accumulated local entropy.
    // The generated seed string is returned.
    Math.seedrandom();

    //the custom seed is the user's dob
    nr1.textContent = (Math.random(dob));
    nr2.textContent = (Math.random(dob));
    nr3.textContent = (Math.random(dob));
    nr4.textContent = (Math.random(dob));
    nr5.textContent = (Math.random(dob));
    nr6.textContent = (Math.random(dob));
    nr7.textContent = (Math.random(dob));
    nr8.textContent = (Math.random(dob));
    nr9.textContent = (Math.random(dob));
    nr10.textContent = (Math.random(dob));
   }
}
</script>

All I need now is to convert all the numbers into whole numbers ranging from 1 to 50 (something like min max). Anyone knows how to? > Feel free to use this: https://jsfiddle.net/cunuqq7h/9/