JavaScript - *resolved* Dice Roller For Classroom: Reading Double-digits Error
So far I've logged forty hours in total trying to locate and fix the major problems in this code. I've worked with two other forums and a pay-by-minute guru to no avail. I am hopeful that the good folks here at CodingForums will be able to take this code the final distance. I'll try to be verbose without boring anyone.
Summary: This code was written in 2005/2007 by "Wonder" at ProBoards. I teach a fourth grade game design and applied mathematics class to home-schoolers on a ProBoards forum. It is placed in the global footer of the forum to allow forum members to roll dice in their posts. The code was incomplete. I worked with "Jordan" at ProBoards to fix the parts that were incomplete. A problem with the code resulted. Primary resolution I'm seeking: Right now the code does everything I could possibly want. However, it is mistakenly reading double-digit numbers (XY) as X = sides of die and Y = a negative modifier. Once this issue is fixed, I can take the roller back to my students and they can game together. Secondary resolutions I'm seeking: (1) I've been told twice that the code should be "tabbed out." Not sure what that means but I guess it makes it less messy. (2) When clicking the "Add Tag" button the code generates, it automatically inserts [dice=6] into a forum post. Would love this to simply be [dice=X] The original code from "Wonder": Code: <style type="text/css"> .dicebg {background-color: FFFFFF;border:solid 2px #000000;} .dicefont {background-color: FFFFFF;color: 000000; font-weight:bold;} </style> <script> //Dice Rolls In Posts v1.1 updated 31 October 2008 //Copyright 4-23-2007 ~Wonder //May be reposted anywhere as long as this header remains in tact //Do you want the dice to line of horizontally(true) or vertically(false) diceAlignment=true; //Enter URL of the image you want to appear as the dice ubbc button UBBCdiceImage="http://img100.imageshack.us/img100/6118/diceicon9rx.gif"; //Enter the default # of sides defaultSides=6; //Enable dice in preview? true or false enablePreview=true; rs="";mainForm=""; if(document.postForm) { mainForm=document.postForm; if(location.href.match(/action\=modifypost/)){enablePreview=true;} mainForm.color.parentNode.innerHTML+="<a href=javascript:add(\"[dice="+defaultSides+"]\",\"\")><img src=\""+UBBCdiceImage+"\" alt=\"Insert Dice Roll\" border=\"0\"></a>"; mainForm.onsubmit=addRand; mainForm.message.value=mainForm.message.value.replace(/(\[rand\=\d+\])/ig,""); rs=RegExp.$1; rs=(/\[rand\=/.test(rs))?rs:""; if(location.href.match(/quote\=\d+/)) { mainForm.message.value=mainForm.message.value.replace(/(\[dice\=\d+\])/ig,""); rs=""; } } else if(location.href.match(/action\=display/)) { ta=document.getElementsByTagName("textarea"); if(ta.length>0 && ta[0].name=="message") { mainForm=ta[0].parentNode; mainForm.onsubmit=addRand; } } /////////////////////// if(location.href.match(/action\=(display|pmview|recent|userrecentposts|gotopost|search|calendarview)/) || (!location.href.match(/action\=/) && document.postForm && enablePreview)) { hr=document.getElementsByTagName("hr"); for(i=0;i<hr.length;i++) { if(typeof(hr[i].parentNode)!="undefined" && hr[i].parentNode.tagName=="TD" && typeof(hr[i].parentNode.lastChild)!="undefined" && typeof(hr[i].parentNode.lastChild.lastChild)!="undefined" && hr[i].parentNode.lastChild.lastChild.nodeType!=1) { n=hr[i].parentNode.lastChild; rand=n.innerHTML.match(/\[rand\=\d+\]/); if(rand!=null) { n.innerHTML=n.innerHTML.replace(rand[0],""); rand=rand[0].replace(/[^\d]/g,""); dice=n.innerHTML.match(/\[dice\=\d+(\+\d+)?\]/ig); if(dice!=null) { for(k=0;k<dice.length;k++) { numb=dice[k].match(/\d+(\+\d+)?/); numb=numb[0].split("+"); addon=numb.length>1?parseInt(numb[1],10):0; numb=parseInt(numb[0],10); roll=Math.round((parseFloat(rand.substring(k,k+2)+"."+rand.substring(k+2,rand.length))/100)*(numb-1))+1+addon; n.innerHTML=n.innerHTML.replace(dice[k],"<table "+(diceAlignment?"style=\"display:inline\"":"")+" border=0 cellpadding=0 cellspacing=0><tr><td><table class=dicebg cellpadding=1 cellspacing=0><tr><td><center><font class=dicefont size=\"+1\"><b>"+roll+"</b><br><font size=\"1\">"+numb+" sides"+(addon>0?"+"+addon:"")+"</font></font></center></td></tr></table></td></tr></table> "); } } } } } } function addRand() { mainForm.message.value=mainForm.message.value.replace(/(\[rand\=\d+\])/ig,""); if((rs.length==0 && mainForm.message.value.match(/(\[dice\=\d+(\+\d+)?\])/)) && (enablePreview==true || (enablePreview==false && mainForm.nextaction.value=="post"))) { mainForm.message.value+="[rand="+(Math.random()+"").replace(/0\./,"")+(Math.random()+"").replace(/0\./,"")+(Math.random()+"").replace(/0\./,"")+( Math.random()+"").replace(/0\./,"")+"]"; } else { mainForm.message.value+=rs; } disable(mainForm); } </script> The altered code from "Jordan": Code: <style type="text/css"> .dicebg {background-color: FFFFFF;border:solid 2px #000000;} .dicefont {background-color: FFFFFF;color: 000000; font-weight:bold;} </style> <script> //Dice Rolls In Posts v1.1 updated by Jordan October 2009 //Copyright 4-23-2007 ~Wonder //May be reposted anywhere as long as this header remains in tact //Do you want the dice to line of horizontally(true) or vertically(false) diceAlignment=true; //Enter URL of the image you want to appear as the dice ubbc button UBBCdiceImage="http://img100.imageshack.us/img100/6118/diceicon9rx.gif"; //Enter the default # of sides defaultSides=6; //Enable dice in preview? true or false enablePreview=true; rs="";mainForm=""; if(document.postForm) { mainForm=document.postForm; if(location.href.match(/action\=modifypost/)){enablePreview=true;} mainForm.color.parentNode.innerHTML+="<a href=javascript:add(\"[dice="+defaultSides+"]\",\"\")><img src=\""+UBBCdiceImage+"\" alt=\"Insert Dice Roll\" border=\"0\"></a>"; mainForm.onsubmit=addRand; mainForm.message.value=mainForm.message.value.replace(/(\[rand\=\d+\])/ig,""); rs=RegExp.$1; rs=(/\[rand\=/.test(rs))?rs:""; if(location.href.match(/quote\=\d+/)) { mainForm.message.value=mainForm.message.value.replace(/(\[dice\=\d+\])/ig,""); rs=""; } } else if(location.href.match(/action\=display/)) { ta=document.getElementsByTagName("textarea"); if(ta.length>0 && ta[0].name=="message") { mainForm=ta[0].parentNode; mainForm.onsubmit=addRand; } } /////////////////////// if(location.href.match(/action\=(display|pmview|recent|userrecentposts|gotopost|search|calendarview)/) || (!location.href.match(/action\=/) && document.postForm && enablePreview)) { hr=document.getElementsByTagName("hr"); for(i=0;i<hr.length;i++) { if(typeof(hr[i].parentNode)!="undefined" && hr[i].parentNode.tagName=="TD" && typeof(hr[i].parentNode.lastChild)!="undefined" && typeof(hr[i].parentNode.lastChild.lastChild)!="undefined" && hr[i].parentNode.lastChild.lastChild.nodeType!=1) { n=hr[i].parentNode.lastChild; rand=n.innerHTML.match(/\[rand\=\d+\]/); if(rand!=null) { n.innerHTML=n.innerHTML.replace(rand[0],""); rand=rand[0].replace(/[^\d]/g,""); dice=n.innerHTML.match(/\[dice\=\d+((\+|\-)\d+)?\]/ig); if(dice!=null) { for(k=0;k<dice.length;k++) { numb=dice[k].match(/\d+((\+|\-)\d+)?/); numb=numb[0].split(RegExp.$2); unsigned = (RegExp.$2 == "+") ? true : false; addon=numb.length>1?parseInt(numb[1],10):0; if(!unsigned)addon = addon - addon * 2; numb=parseInt(numb[0],10); roll=Math.round((parseFloat(rand.substring(k,k+2)+"."+rand.substring(k+2,rand.length))/100)*(numb-1))+1+addon; n.innerHTML=n.innerHTML.replace(dice[k],"<table "+(diceAlignment?"style=\"display:inline\"":"")+" border=0 cellpadding=0 cellspacing=0><tr><td><table class=dicebg cellpadding=1 cellspacing=0><tr><td><center><font class=dicefont size=\"+1\"><b>"+roll+"</b><br><font size=\"1\">"+numb+" sides"+(addon>0?"+"+addon:addon)+"</font></font></center></td></tr></table></td></tr></table> "); } } } } } } function addRand() { mainForm.message.value=mainForm.message.value.replace(/(\[rand\=\d+\])/ig,""); if((rs.length==0 && mainForm.message.value.match(/(\[dice\=\d+((\+|\-)\d+)?\])/)) && (enablePreview==true || (enablePreview==false && mainForm.nextaction.value=="post"))) { mainForm.message.value+="[rand="+(Math.random()+"").replace(/0\./,"")+(Math.random()+"").replace(/0\./,"")+(Math.random()+"").replace(/0\./,"")+( Math.random()+"").replace(/0\./,"")+"]"; } else { mainForm.message.value+=rs; } disable(mainForm); } </script> My incredibly detailed account of my last few weeks with this code: Back in 2005, a user named "Wonder" wrote a nifty piece of code that fits into any ole ProBoard's global footer. Once installed on a forum, it allows users to type the command [dice=X] where X is the number of sides for the single die they want to roll and it gives them a random result that's very attractive (a small white box with a black border and a bold, large result with smaller text below that reads: Xsides) and not "easy" to change/alter/cheat. To roll more than one die, you simply string the command like [dice=X][dice=X][dice=X][dice=X]. The code also allows for positive modifiers (bonuses) such as [dice=X+Y] where the result has the same compact, attractive format and the small text reads: Xsides+Y Wonder posted that his code would also allow negative modifiers (penalties) but, actually, no one seems to have ever tested that part... until September 2009 when along came pesky me. I went over to the ProBoards support forum because Wonder's code is included in their official database. I posted the problem and a user named Jordan tweaked the code several times, each time getting it closer to providing the correct result. The correct result being that when a user types the command [dice=X-Y] the result is the attractive box, the larger number above and the smaller text below that reads Xsides-Y (in addition to continuing to accept [dice=X] and [dice=X+Y] and offer the same format of results). Jordan's version of the code now does all this. But when I started testing it I realized that whenever a user types a command that gives the die double-digit sides (10, 12, 20, etc), the code now reads it like this: [dice=10] results in 1sides-0 or [dice=12] results in 1sides-2. So double-digit numbers are being read as the number of sides and a negative modifier *sigh* Very bad news. Jordan needed to pass on further work on the code because (understandably) it was taking too much time and it was "messy." Since I am not a coder myself, most JavaScript looks messy to me but I believe Jordan. I then took the code to a pay-by-minute help website but was gently told that the code was so messy that it would take too long to debug and it wouldn't be worth the charge since the roller is being used for a non-profit classroom project for my fourth graders. I thought that was very thoughtful... but I'm back at square one, really. I have attached everything I have: The very original code from Wonder (the one that doesn't read negative modifiers at all) and the latest from Jordan (that reads double-digits incorrectly). The only other cute/attractive thing about the code that I'll point out (so you don't see it in the code and wonder, "What the heck is that?" is: When you install the code into a forum, it adds a tiny die-shaped button to the Add Tags menu. Users can click the little thing and the code automatically inserts [dice=6] for them. Personally, this doesn't help my students and I would love it if the button just inserted [dice=X] but that's fine. *deep breath* Whew! That's about it. Thank you for putting up with my blather. I sincerely appreciate any help you can offer. I know your time is valuable and I've taken quite a bit just posting my full report... I just wanted to try to be verbose :) Jennifer Similar TutorialsHello, I am a hobbyist coder making a basic website for a friend, and I have a small problem. On an image slideshow, there is a counter at the bottom showing what image it is up to (ie 7/15), I'm not entirely sure how to change this into double digits (ie 07/15) I've found this thread (http://www.codingforums.com/showthread.php?t=212321) but am unsure how to integrate it into the slideshow I'm using, which is a different one. Here is the part from my JS I think that needs modifying: Code: if (setting.displaymode.type=="manual" && !setting.displaymode.wraparound){ this.paginatecontrol() } if (setting.$status) //if status container defined setting.$status.html(setting.curimage+1 + " / " + totalimages) Is this the right bit of code? If more of the code is needed to solve this please let me know. Any help is greatly appreciated! I am working on my personal portfolio site, and am using a code that will make each portfolio piece appear in a new div when the name of the piece is clicked on. The problem is, JS does not seem to recognize double digits. I am not familiar with JS at all, I just got comfortable with CSS/HTML a few weeks ago! I am in over my head. It would really, really help if someone could show me how to change the code so that I could make about 15 to 20 divs instead of 9. Here is the code: Code: <script language="JavaScript"> numdivs=9 IE5=NN4=NN6=false if(document.all)IE5=true else if(document.layers)NN4=true else if(document.getElementById)NN6=true function init() { showDiv(0) } function showDiv( which ) { for(i=0;i<numdivs;i++) { if(NN4) eval("document.div"+i+".visibility='hidden'") if(IE5) eval("document.all.div"+i+".style.visibility='hidden'") if(NN6) eval("document.getElementById('div"+i+"').style.visibility='hidden'") } if(NN4) eval("document.div"+which+".visibility='visible'") if(IE5) eval("document.all.div"+which+".style.visibility='visible'") if(NN6) eval("document.getElementById('div"+which+"').style.visibility='visible'") } </script> Thank you for taking the time to read this! Hopefully someone can help. I am using a great js gallery script from ....http://coffeescripter.com/code/ad-gallery/ they have a counter for the number of images shown, the number changes as user clicks on next bottom. from looking at the script, the counter is anchor to .ad-info and the counter code from the JS is ..... _afterShow: function() { this.gallery_info.html((this.current_index + 1) + ' / '+ this.images.length); if(!this.settings.cycle) { Can anyone help make the number show double digits only for the numbers 1,2,3,4,5,6,7,8,9 (example- 03/07 or 09/28 or 03/58).. etc..etc thanks for looking. everything in this dice rolling game is fine until line 69 where i get TypeError:actuals[i] undefined. Any help would be appreciated. http://pastebin.com/bVmgMcbB Hi I'm reading a text file, manipulating the string that I've read, and then writing to a new text file called temp. The error that I am getting is basically reading past the end of the file. function SpaceFileEntries() { fso = new ActiveXObject("Scripting.FileSystemObject"); filename = "NDELPROF.txt"; path1 = document.getElementById("lblDataOutputDirectory").innerText + "\\" + filename; path2 = document.getElementById("lblDataOutputDirectory").innerText + "\\temp.txt"; s = fso.OpenTextFile(path1); j = fso.CreateTextFile(path2 , true); do { text = s.readLine(); partOne = text.substring(0,34); lastPart = text.substring(35, 54); space = " "; j.write(partOne); j.write(space); j.writeline(lastPart); } while ( text != null ) s.Close(); j.Close(); } Can someone please help me find this bug in the code. I know it's got to do with the while statement, but can't think or find good alternatives. Thanks. Daniel Hello, searched these forums + multiple tutorials, and found various solutions but weren't able to make any of them work... First of all, I'm really a handicap what comes to Javascript; dont know anything about it, in state of learning it with my first script -lines... So, I think will get multiple post's like "this case is so dealed way too many times..." but, still a humble question how I should do this... Full HTML -code is he Code: <!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>TEMP</title> <style type="text/css"> <!-- .back { background-color: #FF0000; background-position:center; background-repeat: no-repeat; } .td1 { padding-left: 40px; padding-right: 40px; } --> </style> <SCRIPT language="JavaScript"> <!-- //preload images: if (document.images) { intro_off = new Image(161,145); intro_off.src = "../intro/intro1.png"; intro_on = new Image(161,145); intro_on.src = "../intro/intro2.png"; enter_off = new Image(161,145); enter_off.src = "../intro/enter1.png"; enter_on = new Image(161,145); enter_on.src = "../intro/enter2.png"; } function on(imgName) { if (document.images) { imgOn=eval(imgName + "_on.src"); document[imgName].src= imgOn; } } function off(imgName) { if (document.images) { imgOff=eval(imgName + "_off.src"); document[imgName].src= imgOff; } } //--> </script> </head> <body style="background-color:#000000;"> <div> <table cellpadding="0" cellspacing="0" width="1024px" height="768px" border="0px" align="center" class="back"> <tr> <td class="td1"> <a href="link_doesnt_exist.php" target="_self" onMouseOver="on('intro')" onMouseOut="off('intro')"> <img name="intro" src="../images/intro1.png" border="0" width="161" height="145" align="left"></a> <a href="link_doesnt_exist.php" target="_self" onMouseOver="on('enter')" onMouseOut="off('enter')"> <img name="enter" src="../images/enter1.png" border="0" width="161" height="145" align="right"></a> </td> </tr> </table> </div> </body> </html> What this does, here : http://www.finrecon.net/temp2.php Why my images doesnt preload there? Only placeholders/empty area depending on browser/settings? Could someone give exact code how this could be solved, thanks! Hi I have written the following code to read contents of a text file using FileReader object of HTML 5 for Google Chrome. Quote: <script> function handle_files(files) { var i; if (checkBrowser("Chrome")) { for (i = 0; i < files.length; i++) { file = files[i]; var reader = new FileReader(); ret = []; reader.onload = function (e) { console.log(e.target.result) } reader.onerror = function (stuff) { console.log("error", stuff) console.log(stuff.getMessage()) } text = reader.readAsText(file[i]); alert(text); } } } </script> ---------------------- <input type="file" multiple="multiple" onchange="handle_files(this.files)"> Unfortunately, the variable text always displays as undefined. Everything above the line text = reader.readAsText(file[0]); works fine. How can I fix it?. Or is there any other solution to read a text file using HTML5/JavaScript on Chrome? Thanks in advance. Hi ,, im trying to access cells in the excel , but when iam using variabel inActiveSheet.Cells(1,k) im getting error "Expected :". Could you please help me. Big Thanks 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=windows-1250" /> <script> function CreateExcel() { var ExcelSheet; var i=0; var ExcelApp = new ActiveXObject("Excel.Application"); //ExcelSheet = new ActiveXObject("Excel.Sheet"); //ExcelSheet.Application.Visible = true; //ExcelSheet.ActiveSheet.Cells(1,1).Value = "C11"; //ExcelSheet.ActiveSheet.Cells(1,2).Value = "C12"; //ExcelSheet.SaveAs("C:\\Book1.xls"); ExcelApp.Visible = false; var i=1; for(i=0;i<10;i++) { var k=i; document.write(ExcelApp.Workbooks.Open("C:\\wiki estimation.xls").ActiveSheet.Cells(1,k).Value); } ExcelApp.Quit(); //ExcelSheet.Application.Quit(); } </script> <input type=button name=mybutton value=ExcelSheet onclick="CreateExcel()"> </head> <body> </body> </html> Hi everyone, I'm curious if this is something simple. I'm working on a wordpress site using a plugin that is based off of the code from javascript kit called "highlighter scroller script". The plugin js is almost identical: http://javascriptkit.com/script/cut57.shtml What is causing it to wipe from left to right? I'm racking my brains trying to figure it out (and googling unsuccessfully it seems). All I'm trying to do is make it wipe instead from right to left. I'm sure it's something simple, but I don't know which variable to change. Can anyone point me in the right direction? THANKS! Hi! I am studying webdesign and we also go through a chapter of javascript-programming. Our first assignment is to create a dice game. I have written a code and in the beginning it worked, except that all the dices showed the same random number. I tried to fix that and now I do not know what I have done! In the game, you shall click on a link and the three dices will show random numbers. Here is my code: Code: <?xml version="1.0" encoding="UTF-8"?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> <head> <title>Tärningsspel</title> <script type="text/javascript" language="javascript"> function showDice(imgNr) { if (imgNr == 1) var imgUrl = "1.gif"; else if (imgNr == 2) var imgUrl = "2.gif"; else if (imgNr == 3) var imgUrl = "3.gif"; else if (imgNr == 4) var imgUrl = "4.gif"; else if (imgNr == 5) var imgUrl = "5.gif"; else if (imgNr == 6) var imgUrl = "6.gif"; document.tarning1.src = imgUrl; document.tarning2.src = imgUrl; document.tarning3.src = imgUrl; } function randomInteger() { var randNumber = Math.random(); var randNumber = Math.floor(5*randNumber)+2; return randNumber; } function showRandomPict() { var imgNr = randomInteger(6); showDice(imgNr); var imgName = "tarning1" + imgNr; var imgName = "tarning2" + imgNr; var imgName = "tarning3" + imgNr; } function PlayAll(){ diceSwitch('tarning1', 'text1'); diceSwitch('tarning2', 'text2'); diceSwitch('tarning3', 'text3'); } function diceSwitch(randNumber,textRuta){ var randNumber = randomInteger(); } </script> </head> <body> <p><b>Tärning 1:</b><br /><span id="text1">1</span></p> <p><b>Tärning 2:</b><br /><span id="text2">2</span></p> <p><b>Tärning 3:</b><br /><span id="text3">3</span></p> <img src="1.gif" name="tarning1" onclick="javascript:diceSwitch('tarning1', 'text1')" /> <img src="2.gif" name="tarning2" onclick="javascript:diceSwitch('tarning2', 'text2')" /> <img src="3.gif" name="tarning3" onclick="javascript:diceSwitch('tarning3', 'text3')" /> <p><a href="javascript:PlayAll()">Spela alla!</a></p> </body> </html> Thank you! guys im trying to make a dice game and i don't know nothing so can you guys help me with the code? This is what i am trying to do. i need help how to get started n stuff Something that will create a random number b/w 1 n 6 and decide if the user is a winner. He will win only if the #s are equal so i want a text box for the first number and text box for the second. a button to click to play the game(roll the dice) button to start over and reset all values textbox to display the # of tries(rolls) textbox 2 display the # of wins. Also i want toKeep track of the number of times the user rolls the dice and display this in the appropriate textbox and the number of times the user wins the game and display this in the appropriate textbox. Well my friend helped me with this but he made 2 player i only want one player and i want the number of tries and win the user wins if the #s are equal and i want a start over button that resets everything. Also the max number i want is 6 and only one roll the dice button but 2 textboxes so if you get same # you win it should appear in alert and text box for tries and wins. Also, i am gonna have 2 pics one for the first textbox the other for the second both of the pics are gonna be dice and i am gonna have 12 pics but only 2 appear at a time so if a guy gets 5 the dice with the #5 appears and the other text gets 4 the dice with the # 4 appears Code: <html> <HEAD> <SCRIPT LANGUAGE="JavaScript"> var die = 6; var dice = 2; var ary=[]; function dice_roll(die, dice,nu) { var txt=document.form.text; for (var roll=0,loop=0; loop < dice; loop++) { roll = roll + Math.round(Math.random() * die) % die + 1; } if (ary.length==0&&nu==0){ txt[0].value =ary[0]= roll; txt[1].value = 0; } if (ary.length==1&&nu==1){ txt[1].value = ary[1]= roll; if (ary[0]==ary[1]){ alert('Draw'); } else if (ary[0]>ary[1]){ alert('Player 1 Wins'); } else { alert('Player 2 Wins'); } ary=[]; } } // End --> </script> <body> <form name=form> <table border=2 cellpadding=5> <tr> <td colspan=2 align=middle>No. of sides/dice</td> </tr> <tr> <td valign=top align=middle> <p><input type=radio checked name=sides onClick="die = 6">6 Sided </td> <td valign=top align=middle> <p><input name=number type=radio onClick="dice = 2" checked> 2 </td> </tr> <tr> <td colspan=2 > Player 1 </td> </tr> <tr> <td align=middle colspan=4> <input type=button value="Roll Dice" name=button onClick="dice_roll(die, dice,0)"> <input type=text size=10 name=text value="0" disabled="disabled" > </td> </tr> <tr> <td colspan=2 > Player 2 </td> </tr> <tr> <td align=middle colspan=4> <input type=button value="Roll Dice" name=button onClick="dice_roll(die, dice,1)"> <input type=text size=10 name=text value="0" disabled="disabled" > </td> </tr> </table> </form> </center> </body> </html Hi, I'm trying to make a dice game, as well as making it two player. I need to be able to have a scoreboard displayed (eg. player 1 has won 7 times and player 2 has won 4) and I need to be able to prompt the user on if they want to play the game again. So far I have the following: Code: <html> <HEAD> <SCRIPT LANGUAGE="JavaScript"> <!-- Dice Game --> <!-- player 1 var die = 6; var dice = 2; var player1 = 0; var player2 = 0; function dice_roll(die, dice) { var roll = 0; for (loop=0; loop < dice; loop++) { roll = roll + Math.round(Math.random() * die) % die + 1; } document.form.text.value = roll; } player1 = roll; // End --> <!-- player 2 function dice_roll2(die, dice) { var roll = 0; for (loop=0; loop < dice; loop++) { roll = roll + Math.round(Math.random() * die) % die + 1; } document.form.text.value = roll; } player2 = roll; // End --> if player_1 = player_2 alert("DRAW!") else if player_1 > player_2 alert("Player 1 is the winner!") else if player_1 < player_2 alert("Player 2 is the winner!") </script> <body> <form name=form> <table border=2 cellpadding=5> <tr> <td colspan=2 align=middle>No. of sides/dice</td> </tr> <tr> <td valign=top align=middle> <p><input type=radio checked name=sides onClick="die = 6">6 Sided </td> <td valign=top align=middle> <p><input name=number type=radio onClick="dice = 2" checked> 2 </td> </tr> <tr> <td align=middle colspan=4> <input type=button value="Roll Dice" name=button onClick="dice_roll(die, dice)"> <input type=text size=10 name=text> </td> </tr> </table> </form> </center> </body> </html ^^ I basically just tried duplicating the original function that adds up the 'dice'. But it doesn't work, I've tried playing around with if/else statements etc to get it to display messages and so fourth, but I have failed. Any help would be appreciated. I only started javascript last week and my teacher isn't really helping explain lots of it. Thanks in advance. Create a game where 6 dice are 'rolled' by you and 6 dice are 'rolled' by the player (simulated by the click of a button). Add up both rolls. The goal is to come as close to a score of 100 as possible, without passing 100. Have a STOP button to signify when you are ready to stop rolling and compute the winner. The highest score under 100 wins. Display the number of times you win and the number of times the computer wins using javascript. So far I have the following code, however, my dice images are not working(they display as little broken symbols when I run the game). The game itself is running just fine but I can't figure out how to get the game to do the "Add up both rolls" step and beyond. If anyone can help it would be much appreciated. Thanks. Code: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> <head> <title>Dice Game</title> <link href="Dicegame.css" type="text/css" rel="stylesheet" /> </head> <body> <div id='human' class='playerArea'> <h3>Human</h3> <div id='humanDice'> </div> <p id='humanTotal' class='total'></p> </div> <div id='computer' class='playerArea'> <h3>Computer</h3> <div id='computerDice'> </div> <p id='computerTotal' class='total'></p> </div> <div id='roll'> <a href='#' onclick='play(); return false;'>Roll</a> </div> <script type='text/javascript' src='lib.js'></script> <script type='text/javascript' src='dicegame.js'></script> </body> </html> *the external links are as follows* *Dicegame.css* body { background-color: #004400; } div.playerArea { position: absolute; top: 100px; bottom: 200px; width: 300px; background-color: #0996FF; border: 3px solid #0027C6; padding: 0 1em; } div#human { left: 100px; } div#computer { right: 100px; } div#roll { position: absolute; bottom: 50px; left: 100px; right: 100px; height: 100px; background-color: #FFFF00; border: 3px solid #FFBE00; } div#roll:hover { background-color: #FFFF99; } div#roll a { display: block; position: absolute; top: 0px; bottom: 0px; width: 100%; color: #004400; text-align: center; font-size: 90px; text-decoration: none; } div#roll a:hover { color: #FF0000; } p.total { margin: 10px; font-weight: bold; font-size: 8em; text-align: center; } p.winner { color: #00CC00; } p.loser { color: #CC0000; }[/CODE] *dicegame.js* Code: window.onload=function(){ Nifty("div.playerArea", "big"); } function roll() { var result = 0; result = Math.floor((Math.random() * 6) + 1); return result; } function play() { // create dice array var humanDice = new Array(); var computerDice = new Array(); // totals var humanTotal = 0; var computerTotal = 0; // output var out = ""; // roll the dice for (var i = 0; i < 6; i++) { humanDice[i] = roll(); humanTotal += humanDice[i]; computerDice[i] = roll(); computerTotal += computerDice[i]; } // display human dice out = displayDice(humanDice); document.getElementById('humanDice').innerHTML = out; // display computer dice out = displayDice(computerDice); document.getElementById('computerDice').innerHTML = out; document.getElementById('humanTotal').innerHTML = humanTotal; document.getElementById('computerTotal').innerHTML = computerTotal; if (humanTotal > computerTotal) { document.getElementById('humanTotal').className = 'total winner'; document.getElementById('computerTotal').className = 'total loser'; } else if (computerTotal > humanTotal) { document.getElementById('humanTotal').className = 'total loser'; document.getElementById('computerTotal').className = 'total winner'; } else { document.getElementById('humanTotal').className = 'total'; document.getElementById('computerTotal').className = 'total'; } } function displayDice(dice) { var out = ""; for (var i = 0; i < dice.length; i++) { out += "<img src='die" + dice[i] + ".png'/>"; } return out; } *lib.js* Code: function output(text, tag) { document.write("<" + tag + ">" + text + "</" + tag + ">"); } Ooook so this is probably the stupidest question ever. I know in java you can take advantage of a number being an int (not double) and divide by something without getting a remainder. But in javascript you dont declare what kind of variable something is. So my problem is: Given any double or triple digit number, how do i get all but the last digit. Like if i have 13, I need to make an int with 1. If it's 103 i need one with 10. Thanks!! Is it possible to convert the getTime() result into an actual number or text type format where the length function can be used to return only the last 2 digits of the number in a text or number format that is NOT a date format? I have spent quite a bit of time hunting for this and suspect that I am attempting the impossible ?? Thanx Disregard - I believe I have figured it out finally!! Hello all I'm trying to get this function to check for 10 digits only but alert shows regardless of less / more or exactly 10 digits --- what am I missing? any help on sorting this greatly appreciated. Code: function validate(form) { if (document.forms[0].callme.checked) { var phone = document.forms[0].mobile.value; // assign value to var phone = phone.replace( /[^\d]/g, "" ); // zap all non-digit characters if ( document.forms[0].mobile.length != 10 ) // chk for 10 digits{ alert("Enter 10 numbers"); return false; } else { alert("Yahoo"); } } low tech hi, i'm trying to keep a copy of a variable at 4 digits.. this is what i came up with.. it's working but i'm only a noob, so i would very like to know is there any other simpler and/or elegant way to do this.. also i would appreciate it if you could point out any bad syntax or something.. Code: page = 100 function makeit4digits(){ page4digit = page if (page<10) { page4digit = "000"+ page } else if (page<100) { page4digit = "00"+ page } else if (page<1000) { page4digit = "0"+ page } } I have a number var number = 1,235.326232 I need to display it like following with the last 4 numbers in red. 1,235.32 6232 I have tried number.slice(0,-4)+"<font color='red'>"+number.substr(number.length-5,4); however it keeps messing up the comma and decimal placement. |