<html>
<head>
<script type="text/javascript">
<!--
function randRange(incLow, incHigh)
{
return Math.floor(Math.random()
*(incHigh-(incLow-1)))+incLow
}
function calculateDiceResults(rollCount, diceSize)
{
var rollResults = new Array(rollCount);
for(var roll=0;roll < rollCount;roll++)
{
rollResults[roll] = randRange(1,diceSize);
}
return rollResults
}
function createDiceRollHeaderText(diceRolls, diceSize)
{
var resultsText = ""
var optionalPlural = diceRolls>1?"s":"";
resultsText += "<p>" + diceRolls + " roll" + optionalPlural + " of a D" + diceSize + ", ";
resultsText += "generated at " + (new Date()).toLocaleTimeString() + ":</p>";
return resultsText;
}
function createDiceRollText(diceRolls, diceSize)
{
var resultsText = ""
var rollResults = calculateDiceResults(diceRolls, diceSize);
resultsText += "<table border=\"1\"><tr><th>Roll</th><th>Value</th><th>Running Total</th></tr>";
var total = 0;
for(var roll=0;roll < diceRolls;roll++)
{
total += rollResults[roll]
resultsText += "<tr><th>" + (roll+1) + "</th><th>"
resultsText += rollResults[roll] + "</th><th>" + total + "</th></tr>";
}
resultsText += "</table>";
resultsText = "<p>Total: " + total + "<br/>Average: " + (total/diceRolls) + "</p>" + resultsText;
return resultsText
}
function rollDice()
{
var resultsHeaderHTML = createDiceRollHeaderText(rollCountTextBox.value, diceSizeTextBox.value);
document.getElementById("resultsHeader").innerHTML = resultsHeaderHTML ;
var resultsHTML = createDiceRollText(rollCountTextBox.value, diceSizeTextBox.value);
document.getElementById("results").innerHTML = resultsHTML;
}
//-->
</script>
</head>
<body>
<h1>Dice Rolls</h1>
Number of rolls: <input type="text" size="10" id="rollCountTextBox" value="3"/><br/>
Dice size: <input type="text" size="10" id="diceSizeTextBox" value="6"/><br/>
<input type="button" value="Roll" onclick="rollDice()"/><br/>
<div id="resultsHeader"></div>
<div id="results"></div>
</body>
</html>
Refactorings
No refactoring yet !
Tj Holowaychuk
October 19, 2009, October 19, 2009 17:29, permalink
No rating.
Login to rate!
Your not utilizing the OO aspects of javascript.
;(function(){
Dice = function() {
}
Dice.prototype = {
roll: function(){ ... }
renderTo: function(){ ... }
}
})
(new Dice()).roll().renderTo('#some-element')
Tj Holowaychuk
October 19, 2009, October 19, 2009 17:30, permalink
No rating.
Login to rate!
Check out my tiny js-oo lib, if your more comfortable with classes over prototypal idioms http://github.com/visionmedia/js-oo
Dice = Class({
init: function(){
...
},
roll: function(){
...
}
})
A C++ programmer who is learning Javascript. Please commment on my attempt at an RNG.