Member Avatar for AODfan

Hello,

I am taking a JavaScript class and I am currently on an assignment where my Professor wants me to create a dice roller program with the following stipulations:

* Users can choose via form how many sides that they can choose from, between 2 and 100.
* Dice are rolled '36000' times and totals are tracked.
* Actual totals and percentages are shown. ie.
2: 2341
3: 4486
4: 6626
5: 9166
6: 6636
7: 4480
8: 2265

2: 6.50%
3: 12.46%
4: 18.41%
5: 25.46%
6: 18.43%
7: 12.44%
8: 6.29%

Now to the problems. I have set up to where it will take the form, pass it to my "sidecheck" function, but I do not think it is passing it to the Die() function to roll the die. As far as the output part of it to show roll totals and percentages, I am lost on that one. Below is my code and what I have so far. Thank you for your help in advance.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Lab05 - Dice Roller</title>

<script type="text/javascript" >

	function sidecheck( ) {
		
	  if ( document.getElementById("sides").value < 2 || document.getElementById("sides").value > 100 ) {
	    alert( "Value you entered is not within range" );
	 	 } else if ( isNaN(document.getElementById("sides").value )) {
			alert( "Value you entered is not within range" );
	  		} else {
	    		Die( sides );
	  		}
	  			return false;
	
		}
		
		
	function Die( sides ) {
		this.sides = 6;
		this.roll = function( ) {
		return parseInt((Math.random( ) * 1000) % this.sides) + 1;
		}
	}


	function field_prompt(field_name, prompt) {
		var sides = document.getElementById( field_name );
		sides.value = prompt;
		sides.style.color = "#888";

			sides.onfocus = function( ) {
				this.style.color = "#000";
				if ( this.value == prompt ){
					this.value = "";
		}
	}
	
			sides.onblur = function( ){
				if( this.value == "" ){
					this.style.color = "#888";
					this.value = prompt;
			}
		}
		
	}

	window.onload = function( ) {
		field_prompt( "sides", 12 );
			
			
			
		}

</script>


</head>

<body>

	<h1>Dice Roller</h1>
    <hr />
    Enter a number of sides for the die between 2 and 100.
    
	<form action="" name="dice_roller" id="dice_roller" />
	
		<p><input type="text" name="sides" id="sides"  /></p>

		<p><input type="submit" value="Click to roll the Die!"  onclick="sidecheck( );" /></p>

	</form>
    
    <script type="text/javascript">
	  var d = new Die( );
	  d.sides = 12;
	  var rolled_value = d.roll( );
    
     
    </script>

<table>
	    <tr>
	        <td><b>Rolled Times</b></td>
            
            <td></td>
            
            <td><b>Each Percentage Total</b></td>
            
            
</body>

</html>
  • 2 Contributors
  • 1 Reply
  • 301 Views
  • 1 Day Discussion Span
  • Latest Post Latest Post by Taywin
Member Avatar for Taywin

1.You need a loop to do the roll. Currently, you only roll it once and done.
2.You do not have the display part for the value you just row.
3.What does your line 16 Die(sides) do? The "sides" variable is unknown in the function. If you want to create a new variable, you could do Die(document.getElementById("sides").value); , but there is a problem here. Where do you save the variable at?

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.