JQuery - Random Numbers Sequences
Fiddle exploring how to generate a randomly ordered sequence of numbers whose value is within a fixed range.
by brady houseknecht
HTML
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootswatch/3.3.5/superhero/bootstrap.min.css">
<div id="fiddleHook"></div>
CSS
.enter-stage-south {
-moz-animation-duration: 3s;
-webkit-animation-duration: 3s;
-moz-animation-name: slide-up;
-webkit-animation-name: slide-up;
}
@-moz-keyframes slide-up {
from {
margin-top: 100%;
}
to {
margin-top: 0%;
}
}
@-webkit-keyframes slide-up {
from {
margin-top: 100%;
}
to {
margin-top: 0%;
}
}
JavaScript
(function (app, $, undefined) {
app.output = function (text, color) {
var div = document.createElement('div');
div.setAttribute('class', 'enter-stage-south');
div.innerHTML = text;
div.style.color = color;
$("#fiddleHook").append(div);
};
app.output.digits = function (min, max, count) {
var range = [],
number = 0,
matches = [],
i = 0;
while (i < count) {
number = Math.floor(Math.random() * (max - min + 1)) + min;
matches = range.filter(function (elem) {
return elem == number;
});
if (matches.length == 0) {
range.push(number);
i++;
}
}
return range;
};
app.output.pad = function (digit) {
var str = digit + '';
if (str.length == 1) {
return ' ' + str;
}
return str;
}
$(document).ready(function () {
var rows = [],
tab = ' ',
i = 1;
for (var x = 0; x < 100; x++) {
rows.push(app.output.digits(1, 15, 15));
}
rows.map(function (row) {
app.output(app.output.pad(i) + tab + '|' + tab + row + '', "#000F");
i++;
});
});
})(window.app = window.app || {}, jQuery)