Hi! I'm new to JavaScript and I'm having trouble getting my program to work. Could someone take at a look at my code and help me try to figure out what the problem is?
EDIT: I guess I shouldn't post my entire code so I'll revise it. I'll post where I think I'm having issues.
This program is supposed to generate an online crossword puzzle for a newspaper. I cannot get any of my functions to work and would greatly appreciate some help figuring out what is going on. Users should be able to directly type their answers into the puzzle and navigate the puzzle by pressing the arrow keys on their keyboard. Typing a letter should move the cursor to the next cell. A user should also be able to toggle whether typing is entered vertically or horizontally by pressing the spacebar. The current cell in the puzzle should be yellow. If a user enters a correct letter into a cell, the background should be changed to light green. If an incorrect letter is entered, a light red background should be displayed. Blank puzzle cells should be displayed with a white background.
Here is the main part of the code. If anyone needs the other files, let me know;
EDIT: I guess I shouldn't post my entire code so I'll revise it. I'll post where I think I'm having issues.
This program is supposed to generate an online crossword puzzle for a newspaper. I cannot get any of my functions to work and would greatly appreciate some help figuring out what is going on. Users should be able to directly type their answers into the puzzle and navigate the puzzle by pressing the arrow keys on their keyboard. Typing a letter should move the cursor to the next cell. A user should also be able to toggle whether typing is entered vertically or horizontally by pressing the spacebar. The current cell in the puzzle should be yellow. If a user enters a correct letter into a cell, the background should be changed to light green. If an incorrect letter is entered, a light red background should be displayed. Blank puzzle cells should be displayed with a white background.
Here is the main part of the code. If anyone needs the other files, let me know;
Code:
<html>
<head>
<!--
Filename: cross.htm
Supporting files: across.gif, down.gif, functions.js, makepuzzle.js,
pcglogo.jpg, styles.css
-->
<title>Crossword Puzzle</title>
<link href="styles.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="makepuzzle.js"></script>
<script type="text/javascript" src="functions.js"></script>
<script type="text/javascript">
//capture the key code of the pressed key and then call the appropriate function for that key
function getKey(e){
if (IE) keyNum=event.keyCode;
else if (DOM) keyNum=e.keyCode;
if (keyNum = 32)
toggleDirection(); //if the user presses the spacebar run the toggleDirection function
//if the user presses one of the four arrow keys run the moveCursor function
if (keyNum = 37) {
moveCursor(); }
if (keyNum = 38){
moveCursor(); }
if (keyNum = 39) {
moveCursor(); }
if (keyNum = 40) {
moveCursor();
} else {
writeGuess();
} //otherwise run the writeGuess function
//return the value false from the function so that the safari browssers treats the arrows keys as single keystrokes
}
//allow a user to press the spacebar to toggle the typing direction from across to down and vice versa, swap the point hand image on the page
//to match the typing direction
function toggleDirection() {
//if across = true change the value to false, change the second image in the document to the source of the first image in the handImage array
//if across = false change the value to true, change the second image in the document to the source of the first image in the handImage array
if (across == true) {
across = false;
document.images[1]=handImage[1].src;
} else {
if (across == false) {
across=true;
document.images[1]=hamdImage[0].src;
}
}
//next four function will be used to update the values of the currentX and currentY variables as the cursor moves around the puzzle grid
//decrease the value of currentX by one, if currentX is less than zero change the value to four
function moveLeft() {
curentX--;
if (currentX < 0) {
currentX = 4
}
}
//increase the value of currentX by one, if currentX is greater than four change the value to zero
function moveRight() {
currentX++;
if (currentX > 4) {
currentX = 0;
}
}
//decrease the value of currentY by one, if currentY is less than zero change value to four
function moveUp() {
currentY--;
if (currentY< 0) {
currentY = 4;
}
}
//increase the value of currentY by one, if currentY is greater than four change the value to zero
function moveDown() {
currentY++;
if (currentY > 4) {
currentY = 0;
}
}
//move the active cell in response to a user presing the arrow keys on the keyboard
function moveCursor() {
currentCell.style.backgroundColor = currentColor; //set the background color of the currentCell to the value of the currentColor variable
if (keyNum = 37)
moveLeft(); //if the value of the keyNum indicates a left arrow run the moveLeft function
if (keyNum = 38)
moveUp(); //if the value of the keyNum indicates an up arrow run the moveUp function
if (keyNum = 39)
moveRight(); //if the value of the keyNum indicates a right arrow run the moveRight function
if (keyNum =40)
moveDown(); //if the value of the keyNum indicates a down arrow run the moveDown function
currentCell = document.getElementById("grid" + currentX + currentY);
currentColor = currentCell.style.backgroundColor; //store the background color of the currentCell in the currentColor variable
currentCell.style.backgroundColor = "yellow"; //change the background color of the currentCell to yellow
}
//write the lettr typed by the user into the current cell and change the background color to indicate whether the user typed a correct letter
//after the letter has been written teh current cell should move either to the right or down
function writeGuess() {
var outChar = String.fromCharCode(keyNum); //use the fromCharCode method to extract the letter corresponding to the value of the keyNum variable
outChar = string.toUpperCase(); //use the toUpperCase function to change the outChar variable to an uppercase letter
document.write(writeText(outChar)); //use the writeText function to write outChart to the current cell
if (words[(currentY * 5) + currentX] == outChar) {
currentCell.style.backgroundColor="lightgreen";
} else {
currentCell.style.backgroundColor="pink";
}
//if across equals true run the moveRight function else run the moveDown function
if (across == true) {
moveRight();
} else {
moveDown();
}
//point the currentCell object to the element with the id gridxy, where x is the value of currentX and y is the value of currenY
currentCell = document.getElementById("grid" + currentX + currentY);
currentColor = currentCell.style.backgroundColor; //store the value of the current cell background color in currentColor
currentCell.style.backgroundColor = "yellow"; //change the background color of the current cell to yellow
}
</script>
Comment