JavaScript - Ducci's Game. Functions + Arrays
Ok so im stuck (again) and going to try another late night getting this program to do what I want.
I assume many of you have heard of ducci's game, then here is a link which will probably make it a bit more obvious http://demonstrations.wolfram.com/TheFourNumberGame/ so basically making a program that can do that, there is obviously many easy-er ways to go about doing this including... Code: function difference(numberArray) { var numLen=numberArray.length var iteration=0 var diffArray var zero document.writeln(numberArray+'<br>') do { diffArray=[] for (var i=0;i<numLen;i++) diffArray.push(Math.abs(numberArray[i]-numberArray[(i+1)%numLen])) numberArray=diffArray zero=true for (var i=0;i<numLen;i++) if (numberArray[i]) zero=false document.writeln(numberArray+'<br>') iteration++ } while (!zero) document.writeln('Iterations taken : '+iteration+'<br>') } difference([24,44,81,149]) so that codedoes everything CORRECTLY and displays it all properly... but not how I'm allowed to do it according to the question as that just has everything done under one function in one easy go ... the way I have been told to do it is by utilising 3 functions In the code below you can see how it is meant to be set out, with the comment explaining/saying what each function should do. Code: <script type="text/javascript"> //will tell you the difference between firstNumber and SecondNumber. // Number returned will always be ABOVE or Equal to 0 so will need to subtract from the higher number. function difference () var firstNumber; secondNumber; document.writeln(numberArray+'<br>') { } //will calculate the total of numbers in the array to see if they equal 0 and display total //The iteration from each square to the next square must continue until all the numbers are zero. //use function sum() that calculate the total of the numbers //If the value returned by this function is 0 then all the individual values must be zero because none of them is negative. // Write the function sum(), which should accept an array numberArray and return the sum of the numbers. function sum(numberArray) {} //makes a new array containing the differences between the pairs of numbers and then display it. //code the process that calculates a new array containing //the differences between all the pairs of adjacent numbers, using the difference() function you have already written. function calculateDifferences(numberArray) var difference; {} //Array which holds the numbers at the four corners of the square. var numberArray = [24,44,81,149];//Edit this line to change the starting numbers document.write(numberArray +'<BR>'); </SCRIPT> as im not allowed to use the first code and have to have it this long way I cant really work out how to do it :/ (im being stupid) like always i'd like to say I do want to learn so push me in the right direction and hint rather then tell me the answer as i'd prefer to make mistakes and learn to get around them etc (im currently NOT at home aswell so dont have any of my textbooks due to family issues arising and I do need to get this done so everything will be done online including research etc.) so where should I start as tbh the way it's done in the first example is well.. correct :/ and im not sure how to get it to use the 2 arguements to calculate each and every difference from in the array (and then looping around again from the last number onwards.. Similar TutorialsHi, new to this forum but have a quick question about arrays, I've been working on this all night, and I'm at a loss. I'm trying to calculate the gpa of a user by using arrays and functions. Everything seems to be working besides two things.
The array that contains the class names (className[]) always includes an extra two variables: my sentinel value which is finish, and "undefined"
The arrays at the end won't produce a number when multiplied together. creditData[] and qualityPoints[].
Also, if you have any suggestions on my code, I'd appreciate it. <script type="text/javascript"> <!-- /**************************************************************** ** PrintExplanation - prints a message containing instructions to the user without ** any variable needed. ** Inputs:None ** Outputs:None ****************************************************************/ function PrintExplanation() { alert("This program will calculate your Grade Point Average for any given semester. Please enter only graded classes, no Pass/Fail Classes."); } /**************************************************************** ** GetValidNumberInput - Error checks a number between two constraints. ** Inputs: promptString - allows the user to insert a string in order to be asked. ** lowerNum - the lower constraint you want to be compared. ** upperNum - the higher constraint you want to be compared. ** Outputs: numCredits ****************************************************************/ function GetValidNumberInput(promptString, lowerNum, upperNum) { var promptString; var lowerNum; var upperNum; var numCredits; numCredits=prompt(promptString); while(numCredits<lowerNum || numCredits>upperNum) { numCredits=prompt(promptString); } numCredits=parseFloat(numCredits) return numCredits } /**************************************************************** ** CalculateGPA - Calculates the users GPA ** Inputs: totalCredits: The total amount of credits determined by the user. ** totalQualityPoints: The total amount of quality points determined by the user. ** Outputs: gpa - the users final grade point average. ****************************************************************/ function CalculateGPA(totalCredits, totalQualityPoints) { var totalCredits; var totalQualityPoints; var gpa; gpa=totalQualityPoints/totalCredits return gpa; } function GenerateGPAReport(totalCredits, totalQualityPoints) { } /**************************************************************** ** ConvertGradeToPoints - Converts a letter given by the user into a number corresponding to grade points. ** Inputs: grade - the letter of the grade the student recieved in the course. ** Outputs: points - the number value of the grade that was input by the user. ****************************************************************/ function ConvertGradeToPoints(grade) { var grade; var points; if(grade == "A" || grade== "a") { points=4 } else if(grade == "B" || grade == "b") { points=3 } else if(grade == "C" || grade == "c") { points=2 } else if(grade == "D" || grade == "d") { points=1 } else if(grade == "F" || grade == "f") { points=0 } points=parseFloat(points); return points; } //--> </script> </head> <body> <script type="text/javascript"> var promptString; /*Declares Variables*/ var className; var numOfClasses; var grade; var semester; var numCredits; var lowerNum=1; var upperNum=4; var class1; var i=0; var counter=0; var totalCredits=0; var totalPoints=0; var grade; var counterCredits=0; var counterGrade=0; var points; var gpa; var qualityPoints; var creditData; var gradeData; var x=0; var totalQualityPoints=0; PrintExplanation(); var className = new Array(i); semester=prompt("Please enter the semester you would like to calculate your GPA for."); document.write("Grade report for " + semester + "<br />"); while(class1!="finish") /*Stores the names of the classes taken into an array*/ { class1=prompt("Enter the Class name, or finish to end"); className[i]=class1 i++ } while(counter<=i) /*writes the classes in the array from top to bottom*/ { document.write(className[counter] + "<br />"); counter++ } var creditData = new Array(i) while(counterCredits<=i) /*counts the total number of credits for all the classes*/ { numCredits=GetValidNumberInput("How many credits is " + className[counterCredits] + " class worth?",1,4) creditData[counterCredits]=numCredits totalCredits=totalCredits + numCredits counterCredits++ totalCredits=parseFloat(totalCredits); } var gradeData = new Array(i) /*collects information about grades in an array*/ while(counterGrade<i=) { points=prompt("What grade did you recieve in " + className[counterGrade] + "?"); points=ConvertGradeToPoints(points) gradeData[counterCredits]=points totalPoints=totalPoints+points counterGrade++ } while(x<=i) { qualityPoints=creditData[x]*gradeData[x] totalQualityPoints=totalQualityPoints + qualityPoints x++ } gpa=CalculateGPA(totalCredits, qualityPoints) document.write(gpa); </script> </body> I've now got to form an average of snowfall inputs, taken from looped prompts, however I'm not allowed to use arrays or functions... Almost every example I see uses arrays, such as this one he http://www.codingforums.com/showthread.php?t=4313 Is it possible to not use arrays to form the average? Please describe how to do this in general terms, as was highlighted in that link ^^^ I want to learn, not copy, although one can be derived from the other... What I haveso far, assume all vars have been announced. Code: for (var d=1; d<=numofinputs; d=d+1) { input = prompt("Enter a data input" + d) } Is it possible I'm attempting this in too general a manner? ie, running before I can walk. I need to loop the alphabet and numbers 0-9 to initialize a few thousand arrays. This is for my site and is truly needed. http://www.thefreemenu.com I currently have every array written out and it takes up to much space in my .js file. The majority of my variables are empty but necessary and need to be there (including empty) for my site to work properly. Question is the last part Here's where I'm at. Code: var NewVarLetterOrNum = "a"; eval("_oneofseveralnames_" + NewVarLetterOrNum + "='this part works';"); alert(_oneofseveralnames_a); This creates the variable _oneofseveralnames_a='this part works' Code: var newArrayLetterOrNum = "a"; eval("_oneofseveralnames_" + newArrayLetterOrNum + "= new Array();"); alert(_oneofseveralnames_a) This creates the Array _oneofseveralnames_a=new Array(); and all the values in the array are null, but, now a variable like _nl_a[1]='something' can be used elsewhere because the array exists. This is all that is necessary for now because I can probably set all the variables to be blank with something like Code: i=1 while(i<=20){ _oneofseveralnames_a[i]="1-20"; i++ } alert(_oneofseveralnames_[20]); So now you have what I came to understand in the first few hours. Now to the hard part : ( I can't make multiple array's dynamically. I dont' know if its because I don't understand loops or arrays or what and its very fustrating. As for any answer you might be so kind as to provide, if you could dumb it down that would be greatly appreciated. Code: var newArray =new Array('a','b','c','d','e','f','g','h','i','j','k','l','m','n','o','p','q','r','s','t','u','v','w','x','y','z') i=1 while(i<=26){ eval("_nl_" + newArray[i] + "= new Array();"); i++ } alert(newArray[1]) // Is b, but alert(_nl_b) //I can't get _nl_b to exist, I tried everything including taking away the quotes around the letters in every test */ var _nl_a =new Array() var _img_a =new Array() var _h_a =new Array() var _r_a =new Array() var _m_a =new Array() var _yt_a =new Array() var _i_a =new Array() The above arrays are all the array _name_ parts I need but for example, a has 10 parts, a,p2_a,p3_a,.. p10_a. I need 10 pages for each letter of the alphabet and numbers 0-9 and a special all1, p2_all1 ... p10_all1. Overall 2200 arrays that need to be declared. Currently they are all written out. /* This is a simple basic game i want to make. Its a "What Am I" Riddle... The questions is (In HTML which i already know): I'm as light as a feather but no man can hold me for long. What am I? the answer is: Your Breath. (This is where the JAVASCRIPT comes in) Lets say they guess a rock, have a pop up say: Wrong Answer. Please try again. Lets say they guess Your breath -OR- Breath, have a pop up say: Correct! I want a text field where you can enter your answer, and if they choose ANYTHING but the 2 correct answers above, it will display please try again. Can anyone code this please? Thanks for reading. Ok so i want to work on an EASY basic game. As simple as Guess what number... But there are some twist... Ok So here is my example... (HTML, i know this.)I'm Guessing a number 1-99. What is it? (java) Lets say its 66 and they guess 53, have the text rusult be in a pop up window be: Too low! (java) Lets say they guess 78, have the text rusult be in a pop up window be: Too high! (java) Lets say they guess 100+, have the text rusult be in a pop up window be: Out of range! (java)But lets say they guess 66, have a text result be in a pop up window be: You've won! (java) I want a text field where you can enter your answer, and it will do the actions above. Can anyone code this? Thanks for reading! Hi, I have written a number of functions designed to return frequency data on 1000 randomly chosen numbers using different math functions for the rounding. I would like to include all of these functions within the wrapper of another function so that only one call is needed to get returns from all of the 'inner' functions. However, while each of the functions works in isolation, the moment I wrap them in another function they stop working. The following code is one of the functions 'frequencyWrapperOne' that has been wrapped in the function 'testWrapper'. A call to testWrapper does nothing. Can anyone see what I'm doing wrong? Code: function testWrapper() { function frequencyWrapperOne() { var numberArrayOne = new Array(0,0,0); for (var i = 0; i < 1000; i = i + 1) { var chosenNumber = Math.floor(Math.random() * 3); if (chosenNumber == 0) { numberArrayOne[0] = numberArrayOne[0] + 1; } if (chosenNumber == 1) { numberArrayOne[1] = numberArrayOne[1] + 1; } if (chosenNumber == 2) { numberArrayOne[2] = numberArrayOne[2] + 1; } } return window.alert(numberArrayOne.join(',')); } } testWrapper(); Thanks. Is there a way to activate a function from another function? It has to be in the script tag, it can't be in the HTML section. Can I use something similar to this following code? If not, can anyone give me some help? I have tried to do it various ways, and have looked it up a few times, but to no avail. Can I use something similar to this following code? If not, can anyone give me some help? if (condition) {activate functionname();} Any help I can get would be appreciated. Thanks a lot to anyone who can help. Ok here is what I have so far, my ending part of my Call Function I think is ok. for my main function. I think I misplaced the { and } I will show you all the codes I have for my main function this is what I have I think I did misplace something but I can not pin point where that one small things should be Code: unction showResults(race,name,party,votes) { // script element to display the results of a particular race var totalV = totalVotes(votes); document.write("<h2>" + race + "</h2>"); document.write("<table cellspacing='0'>"); document.write("<tr>"); document.write("<th>Candidate</th>"); document.write("<th class ='num'>Votes</th>"); document.write("<th class='num'>%</th>"); document.write("</tr>"); } for (var i=0; i < name.length; i++) { document.write("<tr>"); document.write("<td>" name[i] + "(" + party[i] + ")</td>"); document.write("td class='num'>" + votes[i] + "</td>"); var percent=calcPercent(votes[i], totalV) document.write("<td class='num'>(" + percent +"%)</td>"); createBar(party[i],percent) document.write("</tr>"); } document.write("</table>"); } </script> Just wondering if i misplaced any ; or { or } anywhere suggestions? Here is my call function Code: <script type="text/javascript"> showResults(race[0],name1,party1,votes1); showResults(race[1],name2,party2,votes2); showResults(race[2],name3,party3,votes3); showResults(race[3],name4,party4,votes4); showResults(race[4],name5,party5,votes5); </script> I been going over this, I can not seem to figure out what { i might be missing? Thanks I have a game page on my site and I am trying to protect direct access to it by .htaccess .htpasswd but is not accepting user name and password? .htaccess: AuthUserFile /home/vhosts/kandcoentertainment.freetzi.com/.htpasswd AuthType Basic AuthName "game1" <Files "cookietest.html"> Require valid-user </Files> .htpasswd test:8888 Any suggestions on why it is not working? What I would like to do is have apay and play once setup but as I am a novice and dont have a clue HELP PLEASE!!! What I have been told is - protect the files, add a client side cookie to game page then upon url payment return validate cookie giving single access and when played the user cannot replay by refresh or just typing in url because cookie expired ? I have tried to write the scripts up with no success. Hi guys I need some help with a 2d game that i am making. i am almost done i need only a loading screen but its not working i got this javascript file thats getting an error about : assetsloader is not defined. Maybe you guys can help me. Here is the code: Code: // awesome goblin game // assetLoader /** * Ensure all assets are loaded before using them * @param {number} dic - Dictionary name ('imgs', 'sounds', 'fonts') * @param {number} name - Asset name in the dictionary */ function assetLoaded(dic, name) { // don't count assets that have already loaded if (this[dic][name].status !== 'loading') { return; } this[dic][name].status = 'loaded'; assetsLoaded++; // progress callback if (typeof this.progress === 'function') { this.progress(assetsLoaded, this.totalAssest); } // finished callback if (assetsLoaded === this.totalAssest && typeof this.finished === 'function') { this.finished(); } } // before assetLoader.finished() /** * Show asset loading progress * @param {integer} progress - Number of assets loaded * @param {integer} total - Total number of assets */ assetLoader.progress = function(progress, total) { var pBar = document.getElementById('progress-bar'); pBar.value = progress / total; document.getElementById('p').innerHTML = Math.round(pBar.value * 100) + "%"; } /** * Show the main menu after loading all assets */ // Create the canvas var canvas = document.createElement("canvas"); var ctx = canvas.getContext("2d"); canvas.width = 512; canvas.height = 480; document.body.appendChild(canvas); function mainMenu() { $('#progress').hide(); $('#main').show(); $('#menu').addClass('main'); } // Background image var bgReady = false; var bgImage = new Image(); bgImage.onload = function () { bgReady = true; }; bgImage.src = "images/background.png"; // Hero image var heroReady = false; var heroImage = new Image(); heroImage.onload = function () { heroReady = true; }; heroImage.src = "images/hero_sheet.png"; // Treasure image var treasureReady = false; var treasureImage = new Image(); treasureImage.onload = function () { treasureReady = true; }; treasureImage.src = "images/treasure.png"; // Monster image var monsterReady = false; var monsterImage = new Image(); monsterImage.onload = function () { monsterReady = true; }; monsterImage.src = "images/monster.png"; // Game objects var backgrounder = { speed: 0, x: 0, y: 0 }; var hero = { speed: 256, // movement in pixels per second x: 0, y: 0 }; var monster = { speed: 256, x: 0, y: 0 }; var treasure = { x:0, y:0 }; var treasureCaught = 0; var treasureTimer= 0; var treasureTime= 50; var monstersCaught = 0; var delta = 0; var lives = 3; var directionMonster = 0; var directionDuration = 20; var goThisWay = 1; // Handle keyboard controls var keysDown = {}; addEventListener("keydown", function (e) { keysDown[e.keyCode] = true; }, false); addEventListener("keyup", function (e) { delete keysDown[e.keyCode]; }, false); // Reset the game when the player catches a monster var reset = function () { hero.x = canvas.width / 2; hero.y = canvas.height / 2; // Throw the monster somewhere on the screen randomly monster.x = 32 + (Math.random() * (canvas.width - 64)); monster.y = 32 + (Math.random() * (canvas.height - 64)); }; //restart the game var restartGame = function (){ //when you die screen turns black ctx.fillStyle="#000000";//color ctx.fillRect(32,32,canvas.width-64,canvas.height-64);//draw rectangle with the bushes still in place //show that you're dead ctx.fillStyle = "rgb(250, 250, 250)"; ctx.textAlign = "center"; ctx.fillText("GameOver Press R to reset",canvas.width/2, canvas.height/2); //R to reset pressed if (82 in keysDown){ //reset assets lives = 3; treasureCaught = 0; } }; // Update game objects var update = function (modifier) { if (38 in keysDown) { // Player holding up //check if hero walks from screen if (hero.y <= 32){ //if hero walks from screen top, stay at exact y axle hero.y = hero.y; } else{ //move hero up hero.y -= hero.speed * modifier; } // end of upmovement } if (40 in keysDown) { // Player holding down //check if hero walks from screen if (hero.y >= canvas.height -64){ //if hero walks from screen bottom, stay at exact y axle hero.y = hero.y; } else{ //move hero down hero.y += hero.speed * modifier; }// end of downmovement } if (37 in keysDown) { // Player holding left //check if hero walks from screen if (hero.x <= 32){ //if hero walks from screen left, stay at exact x axle hero.x = hero.x; } else{ //move hero left hero.x -= hero.speed * modifier; }//end of left movement } if (39 in keysDown) { // Player holding right //check if hero walks from screen if (hero.x >= canvas.width -64){ //if hero walks from screen right, stay at exact x axle hero.x=hero.x; } else{ //move hero right hero.x += hero.speed * modifier; }//end of right movement } // Are they touching? MONSTER if ( hero.x <= (monster.x + 32) && monster.x <= (hero.x + 32) && hero.y <= (monster.y + 32) && monster.y <= (hero.y + 32) ) { --lives; reset(); } // Are they touching? TREASURE if ( hero.x <= (treasure.x + 32) && treasure.x <= (hero.x + 32) && hero.y <= (treasure.y + 32) && treasure.y <= (hero.y + 32) ) { treasureTimer = treasureTime; ++treasureCaught; } }; //make our monster move :) var monsterMove = function (modifier){ ++directionMonster; if (directionMonster <= directionDuration){ //bewegingen //rechts => links if (goThisWay == 1) { monster.x = monster.x - (monster.speed * modifier); if (monster.x <= 32){ goThisWay = 2; } } //links => rechts if (goThisWay == 2) { monster.x = monster.x + (monster.speed * modifier); if (monster.x >= canvas.width-64){ goThisWay=1; } } //boven => onderen if (goThisWay == 3) { monster.y = monster.y + (monster.speed * modifier); if (monster.y >= canvas.height-64){ goThisWay=4; } } //onderen => boven if (goThisWay == 4) { monster.y = monster.y - (monster.speed * modifier); if (monster.y <= 32){ goThisWay=3; } } //bepalen welke richting if (directionMonster ==directionDuration){ directionMonster = 0; goThisWay = Math.floor((Math.random() * 4) + 1); //console.log (goThisWay); } } }; // Draw everything var render = function () { if (bgReady) { //backgrounder.x = backgrounder.x +1; backgrounder.x = 0; ctx.drawImage(bgImage, backgrounder.x, 0); } if (heroReady) { ctx.drawImage(heroImage, hero.x, hero.y); } if (monsterReady) { ctx.drawImage(monsterImage, monster.x, monster.y); } if (treasureReady) { ctx.drawImage(treasureImage, treasure.x, treasure.y); } // Score ctx.fillStyle = "rgb(250, 250, 250)"; ctx.font = "24px Helvetica"; ctx.textAlign = "left"; ctx.textBaseline = "top"; ctx.fillText("Treasure caught: " + treasureCaught, 32, canvas.height-64); ctx.fillText("Lives: " + lives, 32, 32); }; var spawnTreasure = function(){ if (treasureTimer >= treasureTime){ treasure.x = 32 + (Math.random() * (canvas.width - 64)); treasure.y = 32 + (Math.random() * (canvas.height - 64)); treasureTimer = 0; } ++treasureTimer; }; // The main game loop var main = function () { var now = Date.now(); delta = now - then; if (lives > 0){ update(delta / 1000); render(); monsterMove(delta / 1000); spawnTreasure(); } else { restartGame(); } then = now; // Request to do this again ASAP requestAnimationFrame(main); }; // Cross-browser support for requestAnimationFrame var w = window; requestAnimationFrame = w.requestAnimationFrame || w.webkitRequestAnimationFrame || w.msRequestAnimationFrame || w.mozRequestAnimationFrame; // Let's play this game! var then = Date.now(); reset(); main(); Reply With Quote 01-14-2015, 10:11 PM #2 felgall View Profile View Forum Posts Visit Homepage Master Coder Join Date Sep 2005 Location Sydney, Australia Posts 6,745 Thanks 0 Thanked 666 Times in 655 Posts In the code you posted there are no references to assetsLoader at all. There is exactly one reference to assetLoader (without the 's') and that is to add a progress() function to every occurrence of the assetLoader object that you haven't defined (at least not in the code you posted). What I'm trying to achieve is it initialises a number between 1-2000 randomly. When the submit button is clicked it simply returns if the number that is in putted is higher or lower than the randomly initialised number. External JavaScript: Html Code: <html> <head> <script type="text/javascript" src="jsscri.js"></script> </head> <body onload="initialisation ()"> <form name="exampleform"> <h3> Number: <input name="number" type="text" onchange='checkNumber( this.value );'> </h3> <p> <input name="submit" type="button" value="Guess" onclick= 'checkValue()';/> </p> </body> </html> If you load this onto a webpage you'll see what i'm trying to do. I tried deleting the rest of the code to keep the size of the code down. A newbie here can you please help me with my javascript game. I cant seem to make it work. Quote: <!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-Language" content="en-us" /> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Play</title> <script type='text/javascript'> function win(x, z){ if(x == z) return "It's a draw"; draw.value++; { if(x == "Fire")&&(z == "Air") return "You Lose, Fire beats Air!"; loss.value++; else if(x == "Fire")&&(z == "Earth") return "It's a draw!"; draw.value++; else if(x == "Fire")&&(z == "Water") return "You Win, Fire is beaten by Water!"; win.value++; } { if(x == "Air")&&(z == "Earth") return "You win, Air beats Earth"; win.value++; else if(x == "Air")&&(z == "Water") return "It's a draw!"; draw.value++; else if(x == "Air")&&(z == "Fire") return "You lose, Air is beaten by Fire!") loss.value++ } { if(x == "Earth")&&(z == "Air") return "You Lose, Earth is beaten by Air" loss.value++; else if(x == "Earth")&&(z == "Water") return "You Win, Earth beats Water"; win.value++; else if(x == "Earth")&&(z == "Fire") return "It's a draw!"; draw.value++; } { if(x == "Water")&&(z == "Fire") return "You win, Water beats Fire"; win.value++; else if(x == "Water")&&(z == "Air") return "It's a draw!"; draw.value++; else if(x == "Water")&&(z == "Earth") return "You lose, Water is beaten by Earth" loss.value++; } } function ran(){ var gen = Math.random(); if(gen <= 0.25) var com = "Fire"; if((gen > 0.25)&&(gen<= 0.50)) var com = "Earth"; if(gen > 0.50)&&(gen<= 0.75)) var com = "Water"; if(gen > 0.75) var com = "Air"; if(document.c.game[0].checked) var use = "Fire"; if(document.c.game[1].checked) var use = "Earth"; if(document.c.game[2].checked) var use = "Water"; if(document.c.game[3].checked) var use = "Air"; alert ("The computer played: " + com +". You played: " + use + ". " + win(com,use)); } </script> <style type="text/css"> body {background-color:#7f9527;} .style1 { color: #FFFFFF; } .style2 { font-family: "After Disaster"; } .style3 { font-family: "After Disaster"; font-size: 30pt; color: #FFFFFF; margin-left: 160px; } .style4 { font-size: xx-large; } .style5 { color: #FFFFFF; font-size: large; } .style6 { color: #FFFFFF; font-family: "After Disaster"; font-size: large; } .style7 { margin-top: 0px; } .style8 { color: #FFFFFF; font-family: "After Disaster"; font-size: xx-large; margin-left: 280px; } .style9 { font-size: large; } .style10 { margin-top: 12px; } </style> </head> <body> <p class="style3" style="width: 581px">Avatar The Last Air bender: Element Fight</p> <p class="style8" style="width: 340px"> <img alt="" src="Avatar_Aang_by_Shira_chan.jpg" width="339" height="244" class="style7" /></p> <p class="style6">Select Your Attack</p> <form name="c" method="post" class="style2"> <span class="style4"><span class="style9"> <input name="game" type="radio" value="Fire" /></span></span><span class="style5">Fire</span><span class="style9"><br /> </span><span class="style4"><span class="style9"> <input name="game" type="radio" value="Earth" /></span></span><span class="style5">Earth</span><span class="style9"><br /> </span><span class="style4"><span class="style9"> <input name="game" type="radio" value="Water" /></span></span><span class="style1"><span class="style9">Water<br /> <span class="style4"> <input name="game" type="radio" value="Air" /></span>Air</span><br /></span> <tr> <td colspan="4" align=center> <span class="style2"> <input type="text" name= "win" readonly="readonly" value="0" size="2"> Wins </input> <input type="text" name= "loss" readonly="readonly" value="0" size="2"> Losses</input> <input type="text" name= "draw" readonly="readonly" value="0" size="2"> Draws</input> </span> </td> </tr> </form> <form method="post"> <br /> <input name="Play" type="button" value="Play" onClick="ran()" style="width: 189px; height: 39px" /> <a href="Instructions.htm"> <input name="Button1" type="button" value="Instructions" style="width: 189px; height: 39px" class="style10" /></a></form> </body> </html> Hello everyone. I have a tic tac toe game I am working on and I managed to make it so you can place X's and O's respectively. My next problem is making a win condition so it checks to see if the X's won the game or the O's did. Here is what I have so far. Edit fiddle - JSFiddle What I am basically thinking is that when you are clicking I want whatever letter it is that is placed to be saved and then I can check to see if all 3 are equal to that letter. It is a bit hard to explain. Essentially I want to make a win condition. If anyone could throw some assistance my way that would be great. I know for sure it requires a lot of checks because there are so many different ways of winning, I just need to know that initial one. Thank you very much. sorry this post is duplicated, the original post:http://www.codingforums.com/showthread.php?t=261488
Hello all, * I'm very new to javascript and working on a quiz game. Theres a set of code im working on but i need help, and greatly appreciate any help. * After every questions, there is a tick or wrong animation/image that should pop over the answer card. I created the gif file one for a tick and one for a wrong: http://www.freeimagehosting.net/cqn91 http://www.freeimagehosting.net/v74v6 *By right the user should not be able to click on the answer cards anymore after finishing the quiz. For now the score keeps going up although the quiz is done. And after the quiz is done, a button should direct the user to the DetailedResult page, instead of the popup. *How to change the popup into a Html(DetailedResult) page, and instead of a text eg.(resent.jpg), how can I make the real image show, and if the qn is correct, how can I place a tick and if the qn is wrong how can I place a wrong image. Ive created both images. tick image==>http://i1069.photobucket.com/albums/...ttica/tick.jpg wrong image==>http://i1069.photobucket.com/albums/...ca/wrong-1.jpg *Suppose at the bottom of the html page, should have a button for the user to retry only wrong answers. *And how do i keep updating the user score for each attempt he tries on the table. Below are a set of code i'm working on, and another set of Html layout(DetailedResult) which i intend to achieve. Code: <!DOCTYPE HTML> <html> <head> <title> Card Test </title> <style> img { margin:7px; } #Question { text-align:left; font-family:"Vladimir Script"; font-size:40px; } </style> <script type="text/javascript"> // For: http://www.codingforums.com/private....pm&pmid=124136 var baseURL = 'http://s1069.photobucket.com/albums/u475/felettica/'; var questions = [ // format [pic,[image1,imag2,image3]], ['happy.jpg', ['*|delight.jpg','|sad.jpg','|confuse.jpg']], // 0 ['angry.jpg', ['|sad.jpg','*|resent.jpg','|joyful.jpg']], // 1 ['father.jpg',['|sister.jpg','|mum.jpg','*|dad.jpg']], // 2 ['sports.jpg',['|crying.jpg','*|soccer.jpg','|sleep.jpg']], // 1 ['fruit.jpg', ['*|apple.jpg','|meat.jpg','|bacon.jpg']], // 0 ]; var qNo = 0; var correct = []; function $_(IDS) { return document.getElementById(IDS); } function NextQuestion(IDS) { var response; switch (IDS) { case 'image1' : response = 0; break; case 'image2' : response = 1; break; case 'image3' : response = 2; break; } if (response == currentQuestion[4]) { correct[0]++; alert('Well Done'); } else { alert('Wrong Answer'); } correct.push(currentQuestion.join('|')+'|'+response); // alert(correct.join('\n')); qNo++; if (qNo < questions.length) { $_('score').innerHTML = 'Sco '+correct[0]; showImages(qNo); $_('Question').innerHTML = 'Question: '+(qNo+1); } else { $_('score').innerHTML = 'You had '+correct[0]+' correct answers for '+questions.length+' questions'; DisplayQuizResults(); // alert('End of quizi\n\n'+correct.join('\n')); return; } // I created a two .gif animation of a tick and a wrong // but unsure how to place it so that it appears on the // correct answer image instead of the alertbox. // Tick animation Url==> http://www.freeimagehosting.net/cqn91 // Wrong animation Url==>http://www.freeimagehosting.net/v74v6 // I tried to add a button to direct to the DetailedResult page // which shows the correct and wrong questions but it didnt appear. // It should appear after the alert('End of quiz'); pops up. } var currentQuestion = []; function showImages(ptr) { var tarr = []; var tmp = ''; currentQuestion = []; currentQuestion.push(questions[ptr][0]); // 0 temp_questions = questions[ptr][1].slice(); temp_questions.sort(randOrd); for (var i=0; i<3; i++) { tarr = temp_questions[i].split('|') if (tarr[0] != '') { tmp = i; } // save correct answer currentQuestion.push(tarr[1]); // 1,2,3 // save response order } currentQuestion.push(tmp); // 4 $_("Pic").src=baseURL+currentQuestion[0]; $_("image1").src=baseURL+currentQuestion[1]; $_("image2").src=baseURL+currentQuestion[2]; $_("image3").src=baseURL+currentQuestion[3]; } function randOrd() { return (Math.round(Math.random())-0.5); } window.onload = function() { correct = []; correct.push(0); questions = questions.sort(randOrd); showImages(0); } // Following from: http://www.yourhtmlsource.com/javascript/popupwindows.html function DisplayQuizResults() { var generator=window.open('','name','height=400,width=500'); generator.document.write('<html><head><title>Popup</title>'); generator.document.write('<link rel="stylesheet" href="style.css">'); generator.document.write('</head><body>'); var str = ''; var tarr = []; // correct array format: item +|+ question +|+ answer +|+ response var str = '<h1> Your Results</h1>'; for (var i=1; i<correct.length; i++) { tarr = correct[i].split('|'); // item|img1|img2|img3|ans|resp str += 'Question #'+i; str += ' was: '+tarr[0]; str += '<br>Correct answer was: '+tarr[4] +'('+tarr[tarr[4]*1+1]+')'; if (tarr[4] != tarr[5]) { str += ' but your answer was: '+tarr[5] +'('+tarr[tarr[5]*1+1]+')'; } str += '<p>'; } generator.document.write('<p>'+str+'<p>'); generator.document.write('<p><a href="java_script:self.close()">Close</a> the popup.</p>'); generator.document.write('</body></html>'); generator.document.close(); } </script> </head> <body> <div id="Question">Question: 1</div> <div align="center"> <img id="Pic" src="" height="220" width="321"> <p> <img id="image1" src="" width="269" height="171" onclick="NextQuestion(this.id)"> <img id="image2" src="" width="269" height="171" onclick="NextQuestion(this.id)"> <img id="image3" src="" width="269" height="171" onclick="NextQuestion(this.id)"> <p> <span id="score">Sco </span> <p></div> </body> </html> ================================================ Instead of the popup, instead i thought having it on a Html page (DetailedResult), the layout below ================================================ Code: <!DOCTYPE HTML> <html> <head> <meta charset="utf-8"> <title>Untitled Document</title> <style type="text/css"> Table{ position:absolute; left:632px; top:97px; width: 408px; border:1px solid black; } table, td, th { border:1px solid green; } th { background-color:green; color:white; } </style> </head> <body> <table width="472" border="0" cellspacing="0" cellpadding="0"> <!--In the table,the scores of the user should appear for the the current attempt and previous attempts so that the user can track his scores--> <tr> <th width="227" scope="row"><strong>My Attempts</strong></th> <td width="181"> <div align="center">My sco </div></td> </tr> <tr> <th height="19" scope="row">1st Attempt</th> <td><div align="center">4/5</div></td> </tr> <tr> <th scope="row">2nd Attempt</th> <td> </td> </tr> <tr> <th scope="row">3rd Attempt</th> <td> </td> </tr> </table> <h1> My Current Attempt </h1> <p> </p> <p>Question 1: "code to get Qn 1 image" "either tick image or wrong image" </p> <!-- For each qn, its picture will appear and either a tick or wrong image next to it. If the user answer it correctly, then a tick will appear or other wise. The image of the question would be smaller. --> <p>Question 2: "code to get Qn 1 image" "either tick image or wrong image"</p> <p>Question 3: "code to get Qn 1 image" "either tick image or wrong image"</p> <p>Question 4: "code to get Qn 1 image" "either tick image or wrong image"</p> <p>Question 5: "code to get Qn 1 image" "either tick image or wrong image"</p> <p><button type="button">Retry Wrong Question</button><p> <!-- direct page to retry wrong qns once more --> <!-- tick image URL:http://i1069.photobucket.com/albums/...ttica/tick.jpg wrong image URL http://i1069.photobucket.com/albums/...ca/wrong-1.jpg baseURL:http://s1069.photobucket.com/albums/u475/felettica/ --> </body> </html> Hi every1! Got a task in university to make a memory game (card matching game). Thats what i've got so far: Code: var selected = 0; var choiceOne; var choiceTwo; var matches = 0; var numOfTries = 0; var interval = 700; var gamePlace = document.getElementById("wrap"); var backcard="img/memoryBg.png"; var timeStart; var timeFinish; var time; function nameEnter(){ var name = prompt("Please enter your name"); if (name != null){ document.title = "Welcome " + name + "!"; } } function game(){ var nOfPairs = document.getElementById("nPairs").value; timeStart = new Date().getTime(); if (nOfPairs==1){ var cards=[]; cards[0] = 'img/card1.png'; cards[1] = 'img/card1.png'; } if (nOfPairs==2){ var cards=[]; cards[0] = 'img/card1.png'; cards[1] = 'img/card1.png'; cards[2] = 'img/card2.png'; cards[3] = 'img/card2.png'; cards.sort(function shuffle(){ return Math.random() - 0.5;}); } if (nOfPairs==3){ var cards=[]; cards[0] = 'img/card1.png'; cards[1] = 'img/card1.png'; cards[2] = 'img/card2.png'; cards[3] = 'img/card2.png'; cards[4] = 'img/card3.png'; cards[5] = 'img/card3.png'; cards.sort(function shuffle(){ return Math.random() - 0.5;}); } if (nOfPairs==4){ var cards=[]; cards[0] = 'img/card1.png'; cards[1] = 'img/card1.png'; cards[2] = 'img/card2.png'; cards[3] = 'img/card2.png'; cards[4] = 'img/card3.png'; cards[5] = 'img/card3.png'; cards[6] = 'img/card4.png'; cards[7] = 'img/card4.png'; cards.sort(function shuffle(){ return Math.random() - 0.5;}); } if (nOfPairs==5){ var cards=[]; cards[0] = 'img/card1.png'; cards[1] = 'img/card1.png'; cards[2] = 'img/card2.png'; cards[3] = 'img/card2.png'; cards[4] = 'img/card3.png'; cards[5] = 'img/card3.png'; cards[6] = 'img/card4.png'; cards[7] = 'img/card4.png'; cards[8] = 'img/card5.png'; cards[9] = 'img/card5.png'; cards.sort(function shuffle(){ return Math.random() - 0.5;}); } if (nOfPairs==6){ var cards=[]; cards[0] = 'img/card1.png'; cards[1] = 'img/card1.png'; cards[2] = 'img/card2.png'; cards[3] = 'img/card2.png'; cards[4] = 'img/card3.png'; cards[5] = 'img/card3.png'; cards[6] = 'img/card4.png'; cards[7] = 'img/card4.png'; cards[8] = 'img/card5.png'; cards[9] = 'img/card5.png'; cards[10] = 'img/card6.png'; cards[11] = 'img/card6.png'; cards.sort(function shuffle() { return Math.random() - 0.5;}); } if (nOfPairs==7){ var cards=[]; cards[0] = 'img/card1.png'; cards[1] = 'img/card1.png'; cards[2] = 'img/card2.png'; cards[3] = 'img/card2.png'; cards[4] = 'img/card3.png'; cards[5] = 'img/card3.png'; cards[6] = 'img/card4.png'; cards[7] = 'img/card4.png'; cards[8] = 'img/card5.png'; cards[9] = 'img/card5.png'; cards[10] = 'img/card6.png'; cards[11] = 'img/card6.png'; cards[12] = 'img/card7.png'; cards[13] = 'img/card7.png'; cards.sort(function shuffle(){ return Math.random() - 0.5;}); } if (nOfPairs==8){ var cards=[]; cards[0] = 'img/card1.png'; cards[1] = 'img/card1.png'; cards[2] = 'img/card2.png'; cards[3] = 'img/card2.png'; cards[4] = 'img/card3.png'; cards[5] = 'img/card3.png'; cards[6] = 'img/card4.png'; cards[7] = 'img/card4.png'; cards[8] = 'img/card5.png'; cards[9] = 'img/card5.png'; cards[10] = 'img/card6.png'; cards[11] = 'img/card6.png'; cards[12] = 'img/card7.png'; cards[13] = 'img/card7.png'; cards[14] = 'img/card8.png'; cards[15] = 'img/card8.png'; cards.sort(function shuffle(){ return Math.random() - 0.5;}); } if(nOfPairs>8||nOfPairs<1){ alert("Please enter the number from 1 to 8"); }else{ for(i = 0; i<=nOfPairs*2-1; i++){ var cardDiv = document.createElement("div"); cardDiv.setAttribute("id",""+i+""); cardDiv.style.height="65px"; cardDiv.style.width="65px"; cardDiv.style.float='left'; gamePlace.appendChild(cardDiv); document.getElementById(""+i+"").innerHTML='<img src="img/memoryBg.png">'; cardDiv.onclick=function(){cardClick(this.id);}; } } function cardClick(card){ if (selected==2){ return ; } if (selected==0){ choiceOne=card; document.images[card].src = cards[card]; selected = 1; }else { selected = 2; choiceTwo = card; document.images[card].src =cards[card]; var timer=setInterval(checking,interval); } function checking() { clearInterval(timer); numOfTries++; document.getElementById("tries").innerHTML = numOfTries; if (cards[choiceTwo]==cards[choiceOne]){ matches++; document.images[choiceOne].src = "img/memoryBgI.png"; document.images[choiceTwo].src = "img/memoryBgI.png"; //choiceTwo.onclick=null; } else { document.images[choiceOne].src = "img/memoryBg.png"; document.images[choiceTwo].src = "img/memoryBg.png"; selected = 0; return ; } if (matches == nOfPairs){ timeFinish = new Date().getTime(); time = Math.round (((timeFinish - timeStart)/1000)); alert("Congrats! You needed " + numOfTries + " tries, and " + time + " seconds."); } selected = 0; return ; } } } so the problem is, that I can just click 2 times on one card and it will look like a coincidence. My second problem is that when I have a real coincidence, I can still click on that card (by "real coincidence" i mean two same pics. so when i find them, they have to be not active, and when im clicking on them, they should just simply do nothing.). Can someone help me? 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! Can someone guide me to what I am doing wrong. My book does not show how to do this. This is what I have to far.I am just getting more and more confused. I am suppose to have a button there asking write a timeout that asks users if they want to stop the game if they do not press the Guess button within 10 seconds. They are suppose to pick a number between 1-100. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html> <head> <meta http-equiv="content-type" content="text/html; charset=utf-8" /> <title>Guessing Game</title> <script type="text/javascript"> while (runAgain == 'y' || runAgain == 'Y') { guessedNumber = reader.readDouble("Please pick a number between 1 and 100: "); while (guessedNumber != randomNumber) { if (guessedNumber < randomNumber) System.out.println("Too low!\nGuess again!"); else if (guessedNumber > randomNumber) System.out.println("Too high\nGuess again!"); else if (guessedNumber == randomNumber) System.out.println("You got it!"); } runAgain = reader.readChar("Play again (y/n)? "); } </script> </head> <body> <div id="content"> <h2>JavaScript Guessing Game</h2> <p>Enter a number between 1 and 100, then press the Guess button.</p> <form action="myForm" method="post"> <p><input type="text" name="guessgame" /> <input type="hidden" name="eGame" value="1"/> <input type="submit" value=" Guess" name="submit"/></p> </form> </body> </html> How hard would it be to make a 2d game similar to super smash bros? Basically I want to have a scrolling position (instead of a static image, where the background is always the same) where when the user moves his character object, the area of vision moves with him. Also, will it work with using keyboard keys? I have to integrate it into a database and I know quite a bit of javascript so I am hoping it is possible. Thanks! Max |