Dice Roller

What am I doing wrong?

  • (2 Pages)
  • +
  • 1
  • 2

16 Replies - 5060 Views - Last Post: 06 May 2010 - 09:14 PM

#1 dispatch4599  Icon User is offline

  • New D.I.C Head

Reputation: 1
  • View blog
  • Posts: 19
  • Joined: 21-February 10

Dice Roller

Posted 05 May 2010 - 11:02 AM

I am trying to create a dice roller. 2 dice. Can anyone tell me what I have done wrong here?

 
<script type = "text/javascript">
function validate ( ){
	if (document.forms[0].sides.value < 2 || document.forms[0].sides > 100){
		alert( "Value is not within range" );
	}
}



function Die( ){
	this.sides = 6;
	this.roll = function( ){
		return parseInt((Math.random( ) * 1000) % this.sides) + 1;
	}
}

function Roll(){

var roll = 36000;
var d = new Die( );
d.sides = document.forms[0].sides.value;


var rolled_value1;
var rolled_value2;


var output1 = new Array();
var output2 = new Array();

for (var j = 1; j <= roll ; j++){
rolled_value1= d.roll( );
rolled_value2= d.roll( );

output1.push( rolled_value1);
output2.push( rolled_value2);
}

display_output(output1, output2);
}

function display_output( output1, output2){
	var total;
	var total2 = new Array( )
	for (var x = 0; x < output1.length; x++){
		total = 0 + output1[x] + output2[x];
		total2[total] = 1 + getValueOf(total2[total]);
	}

for (x = 0; x < output1.length; x++){
	totalout = document.writeln(getValueOf(total2[x]));
	var percent = (getValueOf(total2[x])/roll * 100);
	percent = Math.round(percent * 100)/ 100;
	totalout2 =document.writeln(percent + "%") ;
}

}

</script>
</head>
<body>
<h1> Roll The Dice! </h1>
<form name = "diceroller" method = "get" />
		<p><label for "sides"><b>Number of sides for your dice (2 - 100):</label></p>
		<p><input type = "text" name = "sides" id = "sides" value = "6" size ="5"/></b></p>
		</br>
		<p><label for "rolls"><b>Rolling your dice:</label></p>
		<p><input disabled name= "roll" id = "roll" value = "36000" /></p>
		<p><input type = "submit" value = "Roll My Dice" onsubmit = "validate()"></p>
		</br>


<table>
	<tr>
		<td><b>Rolled Times</b></td><td></td><td><b>Each Percentage Total</b></td>
		<script>
		document.writeln(display_output());
		</script>
</body>



Is This A Good Question/Topic? 0
  • +

Replies To: Dice Roller

#2 jrm402  Icon User is offline

  • D.I.C Regular
  • member icon

Reputation: 51
  • View blog
  • Posts: 333
  • Joined: 18-March 10

Re: Dice Roller

Posted 05 May 2010 - 11:20 AM

I would switch to use the name of the form instead of forms[0] and use the onsubmit in the form tag not the submit tag. But once that works, after you call the function validate(), the program stops. There is no other function being called.
Was This Post Helpful? 0
  • +
  • -

#3 dispatch4599  Icon User is offline

  • New D.I.C Head

Reputation: 1
  • View blog
  • Posts: 19
  • Joined: 21-February 10

Re: Dice Roller

Posted 05 May 2010 - 11:25 AM

View Postjrm402, on 05 May 2010 - 10:20 AM, said:

I would switch to use the name of the form instead of forms[0] and use the onsubmit in the form tag not the submit tag. But once that works, after you call the function validate(), the program stops. There is no other function being called.


SO if I put my roll function within the validate function, it would process right? Yes, I'm new to this and trying really hard here to figure this out.
Was This Post Helpful? 0
  • +
  • -

#4 jrm402  Icon User is offline

  • D.I.C Regular
  • member icon

Reputation: 51
  • View blog
  • Posts: 333
  • Joined: 18-March 10

Re: Dice Roller

Posted 05 May 2010 - 11:28 AM

Yes exactly (don't worry we were all new at one point) :).

function validate() {
       if (document.diceroller.sides.value < 2 || document.diceroller.sides > 100){
               alert( "Value is not within range" );
               return false;
       }
       else {
               Roll();
       }
}
.........
<form name="diceroller" method="get" onsubmit="return validate();" />



The onsubmit="return validate();" will return false if you entered a number out of range. By returning false, you will ensure the page doesn't refresh on you :)
Was This Post Helpful? 1
  • +
  • -

#5 dispatch4599  Icon User is offline

  • New D.I.C Head

Reputation: 1
  • View blog
  • Posts: 19
  • Joined: 21-February 10

Re: Dice Roller

Posted 05 May 2010 - 11:45 AM

Ok, so why am I getting an error stating "output1 not defined". Can you help me understand?
Was This Post Helpful? 0
  • +
  • -

#6 JMRKER  Icon User is offline

  • D.I.C Addict

Reputation: 128
  • View blog
  • Posts: 826
  • Joined: 25-October 08

Re: Dice Roller

Posted 05 May 2010 - 11:45 AM

:no:
You have a number of syntax errors
and an undefined function [example: getValueOf()]

Your <table> definition is incomplete.

You also cannot change the page with document.write()
once it has been rendered without overwriting the page fresh.
Might want to consider defining an <div> area and write to it with .innerHTML instead.

:surrender:
Can you explain what you are trying to do?
Add a little more explanation as to what the functions are to accomplish.

Also, what is the reason for 1000 sided die when you set this.sides = 6 in the function Die()?
Might also help to show what a "typical" toss might look like as a results display in the table.
Was This Post Helpful? 1
  • +
  • -

#7 jrm402  Icon User is offline

  • D.I.C Regular
  • member icon

Reputation: 51
  • View blog
  • Posts: 333
  • Joined: 18-March 10

Re: Dice Roller

Posted 05 May 2010 - 02:07 PM

You need to declare output1 publicly if you want to use it outside of the Roll() function. Definitely check your syntax too, like JMRKER said.
Was This Post Helpful? 0
  • +
  • -

#8 dispatch4599  Icon User is offline

  • New D.I.C Head

Reputation: 1
  • View blog
  • Posts: 19
  • Joined: 21-February 10

Re: Dice Roller

Posted 05 May 2010 - 04:52 PM

YIKES!

Let me work on this thing some more and try to right more of my wrongs and see what I come up with.

You guys are great. I appreciate the input. I need guidance in this stuff, not the solution. If I don't learn from it, then it was all pointless.

I'll be back I'm sure with more questions. LOL!
Was This Post Helpful? 0
  • +
  • -

#9 dispatch4599  Icon User is offline

  • New D.I.C Head

Reputation: 1
  • View blog
  • Posts: 19
  • Joined: 21-February 10

Re: Dice Roller

Posted 05 May 2010 - 07:37 PM

OK, here is where I am..... Now I'm getting an exception error. Can someone guide me here?



function validate ( ){
	if (document.forms[0].sides.value < 2 || document.forms[0].sides > 100){
		alert( "Value is not within range" );
	}else{
		 roll( )
		}
	}

function Die( ){
	this.sides = 6;
	this.roll = function( ){
		return parseInt((Math.random( ) * 1000) % this.sides) + 1;
	}
}

function roll( ){
		var roll = 36000;
		var d = new Die( );
		d.sides = document.forms[0].sides.value;


		var rolled_value1;
		var rolled_value2;


		var output1 = new Array();
		var output2 = new Array();

		for (var j = 1; j <= roll ; j++){
		rolled_value1= d.roll( );
		rolled_value2= d.roll( );

		output1.push( rolled_value1);
		output2.push( rolled_value2);
		}

		display_output(output1, output2);
		}



function display_output( output1, output2){
	var total;
	var total2 = new Array( )
	for (var x = 0; x < output1.length; x++){
		total = 0 + output1[x] + output2[x];
		total2[total] = 1 + (total2[total]);
	}

for (x = 0; x < output1.length; x++){
	var div1 = document.getElementById( "rolled");
	var div2 = document.getElementById ("percentage");
	totalout = document.createTextNode(total2[x]);
	var percent = (total2[x])/roll * 100;
	percent = Math.round(percent * 100)/ 100;
	totalout2 =document.createTextNode(percent + "%") ;
	li1 = document.createElement( "li" );
	li2 = document.createElement( "li" );
	li1.appendChild( totalout );
	li2.appendChild( totalout2 );
	div1.appendChild( li1 );
	div2.appendChild( li2 );
}

}



View PostJMRKER, on 05 May 2010 - 10:45 AM, said:

:no:
You have a number of syntax errors
and an undefined function [example: getValueOf()]

Your <table> definition is incomplete.

You also cannot change the page with document.write()
once it has been rendered without overwriting the page fresh.
Might want to consider defining an <div> area and write to it with .innerHTML instead.

:surrender:
Can you explain what you are trying to do?
Add a little more explanation as to what the functions are to accomplish.

Also, what is the reason for 1000 sided die when you set this.sides = 6 in the function Die()?
Might also help to show what a "typical" toss might look like as a results display in the table.


It's 2 die which can have up to 100 sides, rolled 36000 times keeping track of the number of time each total was thrown as well as show the percentages.
Was This Post Helpful? 0
  • +
  • -

#10 JMRKER  Icon User is offline

  • D.I.C Addict

Reputation: 128
  • View blog
  • Posts: 826
  • Joined: 25-October 08

Re: Dice Roller

Posted 06 May 2010 - 12:21 PM

I'm still having trouble wrapping my head around what your final goal is
(hundred sided die, 36000 rolls, random numbers * 1000, etc. ???)
but see if you can fix the following to display what you are trying to do. :gunsmilie:

I have put comments near the formulas I don't understand :surrender:
but at least it will produce an output that you might begin to decipher.

I changed the 36000 to 6 for testing purposes as the display gets very... long. :sweatdrop:

<html>
<head>
<title>Dice Roller</title>
<script type="text/javascript">
// From: http://www.dreamincode.net/forums/topic/172141-dice-roller/

var output1 = new Array();
var output2 = new Array();

function validate () {
  if (document.getElementById('DieSides').value < 2 || document.getElementById('DieSides').value > 100) {
    alert( "Value is not within range" );
  } else {
    DieRoll(document.getElementById('DieRolls').value);
  }
  return false;
}

function DieRoll(Rolls) {
  var dsides = document.getElementById('DieSides').value;
  var rolled_value1;
  var rolled_value2;

  output1 = [];
  output2 = [];

  for (var j = 1; j <= Rolls ; j++){
    rolled_value1 = Math.floor((Math.random() * 1000) % dsides);
    rolled_value2 = Math.floor((Math.random() * 1000) % dsides);
    output1.push( rolled_value1);
    output2.push( rolled_value2);
  }
//  alert('output1: '+output1.join(',') + '\noutput2: '+output2.join(','));  // for testing purposes only

  display_output();
}

function display_output () {
  var total = 0;
  var total2 = new Array( )
  for (var x = 0; x < output1.length; x++){
    total = output1[x] + output2[x];
//    total2[total] = 1 + (total2[total]);	// have not idea what this is supposed to represent
    total2.push(total);				// my guess ???
  }
  
  var roll = document.getElementById('DieRolls').value;	// ??? to many 'roll' definitions to be sure in original
  var div1 = output1.join(' :&nbsp;<br>');
  var div2 = '';
  var percent = 0;

  for (x = 0; x < output1.length; x++){
    percent = (total2[x])/roll * 100;  		// alert(x+' : '+total2[x]+' : '+roll+' = '+percent);
    div2 += percent.toFixed(2)+'<br>';
  }
  document.getElementById( "rolled").innerHTML = div1;
  document.getElementById ("percentage").innerHTML = div2;
}

</script>
</head>
<body>
<h1> Roll The Dice! </h1>
<form name = "diceRoller" method = "get" action="" onsubmit="return validate()" />
  <p><b>Number of sides for your dice (2 - 100):</b>
     <input type="text" name="DieSides" id="DieSides" value="6" size="5" /></b></p>
  <p><b>Rolling your dice:</b>
     <input disabled name= "DieRolls" id = "DieRolls" value = "6" /></p>
  <p><input type = "submit" value = "Roll My Dice"></p>
  </br>
<div id="rolled" style="float:left"></div>
<div id="percentage" style="float:left"></div>
<br style="clear:both">
</form>
</body>
</html>



You still had a lot of syntax errors and invalid references. I don't see the purpose of using the same or similar variable names in so many places. I confused me so i don't know how your computer comprehends it! :dozingoff:

May not be what you want, but without a lot more comments and a description of what you are trying to do, this is just my guess. :blink:

Good Luck!
:bananaman:
Was This Post Helpful? 2
  • +
  • -

#11 dispatch4599  Icon User is offline

  • New D.I.C Head

Reputation: 1
  • View blog
  • Posts: 19
  • Joined: 21-February 10

Re: Dice Roller

Posted 06 May 2010 - 03:47 PM

HEY! Getting closer!!!! Let's see if this makes sense to you. I want to roll two dice 36000 times and keep track of the number of times each total for the two dice occur. My text should involve 2 columns. 1 will be the total number of times that each total was rolled and the other should show that total as a percentage.

For example: If a 4 sided dice was rolled the 36000 times it would show something like:

2: 2313
3: 4490
4: 6666
5: 9180 etc....... All these should total the 36000

the next column should be the percentage

2: 6.6%
3: 12.50% etc... (these are not real numbers, just what I am looking to do.

You have been so helpful though and I truly appreciate it. :punk: :punk:
Was This Post Helpful? 0
  • +
  • -

#12 JMRKER  Icon User is offline

  • D.I.C Addict

Reputation: 128
  • View blog
  • Posts: 826
  • Joined: 25-October 08

Re: Dice Roller

Posted 06 May 2010 - 07:19 PM

One last try ...
<html>
<head>
<title>Dice Roller</title>
<script type="text/javascript">
// From: http://www.dreamincode.net/forums/topic/172141-dice-roller/

var output1 = new Array(100);
var output2 = new Array(100);

function validate () {
  if (document.getElementById('DieSides').value < 2
   || document.getElementById('DieSides').value > 100) {
    alert( "Value is not within range" );
  } else {
    DieRoll();
  }
  return false;
}

function DieRoll() {
  var Rolls = document.getElementById('DieRolls').value;
  var dsides = document.getElementById('DieSides').value;
  for (var i=0; i<100; i++) { output1[i] = 0; output2[i] = 0; }
  for (var j=0; j<Rolls; j++){
    die1 = Math.floor(Math.random()*dsides);  output1[die1]++;
    die2 = Math.floor(Math.random()*dsides);  output2[die2]++;
  }
  
  var roll = Rolls*1;
  var str = '<table border="1" width="30%">';
  str += '<tr><th colspan="3">Die #1</th>';
  str += '<th colspan="3">Die #2</th></tr>';
  str += '<tr><th width="15%">Side</th><th width="15%">Sum</th><th width="15%">Percent</th>';   
  str += '<th width="15%">Side</th><th width="15%">Sum</th><th width="15%">Percent</th></tr>';   
  for (var x=0; x<dsides; x++){
	str += '<tr><td>'+(x+1)+'</td>';
	str += '<td>'+output1[x]+'</td>';
	str += '<td>'+(output1[x]/Rolls*100).toFixed(2)+'</td>';
	str += '<td>'+(x+1)+'</td>';
	str += '<td>'+output2[x]+'</td>';
	str += '<td>'+(output2[x]/Rolls*100).toFixed(2)+'</td></tr>';
  }
  str += '</table>';
  document.getElementById( "Display").innerHTML = str;
}

</script>
<style type="text/css">
td { text-align:right; }
</style>

</head>
<body>
<h1> Roll The Dice! </h1>
<form name = "diceRoller" method = "get" action="" onsubmit="return validate()" />
  <p><b>Number of sides for your dice (2 - 100):</b>
     <input type="text" name="DieSides" id="DieSides" value="6" size="5" /></b></p>
  <p><b>Rolling your dice:</b>
     <input name="DieRolls" id="DieRolls" value="36000" size="6" /> times
     <input type = "submit" value = "Roll My Dice"></p>
  </br>
<div id="Display"></div>
<br>
</form>
</body>
</html>


:bananaman:
Was This Post Helpful? 1
  • +
  • -

#13 dispatch4599  Icon User is offline

  • New D.I.C Head

Reputation: 1
  • View blog
  • Posts: 19
  • Joined: 21-February 10

Re: Dice Roller

Posted 06 May 2010 - 07:41 PM

LOL!!! You crack me up with your dancing banana, but nope still not what I'm trying to achieve. SO very close though. I'm looking for the total of both of the die together. 2 rows of text. One for the rolls list the other for the percentage list. I'm still always ending up with errors, or no data. So you are doing MUCH better than me. GEESSSHHHH!!!
Was This Post Helpful? 0
  • +
  • -

#14 JMRKER  Icon User is offline

  • D.I.C Addict

Reputation: 128
  • View blog
  • Posts: 826
  • Joined: 25-October 08

Re: Dice Roller

Posted 06 May 2010 - 08:45 PM

I've solved it by adding 5 lines of code.

:gun_bandana: Let's see your attempt at changing the last post.
Was This Post Helpful? 0
  • +
  • -

#15 dispatch4599  Icon User is offline

  • New D.I.C Head

Reputation: 1
  • View blog
  • Posts: 19
  • Joined: 21-February 10

Re: Dice Roller

Posted 06 May 2010 - 08:55 PM

and you got the numbers that were close to what I showed you? (That was for rolling 4 sided die)

I'm working on it! LOL!!!
Was This Post Helpful? 0
  • +
  • -

  • (2 Pages)
  • +
  • 1
  • 2