www.webdeveloper.com
Results 1 to 4 of 4

Thread: Need help with writeGuess() function in javascript

  1. #1
    Join Date
    Aug 2012
    Posts
    10

    Need help with writeGuess() function in javascript

    Please help i am new to javascript and have been stuck on this one function in my code for days and i
    havent been able to find any good references in my book or online. The particular function i am having trouble with is a function named writeGuess(). the purpose of the function is to write the letter typed by the user into the current Cell and then to change the background color of that cell to indicate whether the user typed the correct letter. after the letter has been written the current cell should move either to the right or down, depending on the direction(as indicated in the across variable. The function should do the following:
    1. use thefromCharCode string method to extract the letteer corresponding to the value of the keyNum variable and store the letter in a variable named OutChar.
    2. use the toUpperCase() string method to change the outChar variable to an uppercase letter.
    3. use the writeText() function to write outChar to the current cell.

    these are the parts of the function i am unable to get to work the rest of my function im pretty sure is correct.
    i am using a free javascript editor and when i run the debugger i get no errors. However when i run the script debugger in IE i get a string is undefined error for line 121 where im using the toUpperCase method. im not sure what i woudl do as teh string when the user woudl be inputting a charcode. i have provided my code below. please help in any way possible i really need to get this figured out. Let me know if i need to include my other scripts or if you can see my mistake from the function itself.




    <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">
    var handImage=new Array();
    handImage[0]=new Image();
    handImage[1]=new Image();
    handImage[0].src="across.gif";//source of the first image
    handImage[1].src="down.gif"; // source of the second image

    var IE=document.attachEvent ? true:false; //determines whether the users browser supports IE event model
    var DOM=document.addEventListener ? true:false;//determines whether the users browser supports the DOM event model

    var currentX=0; //indicates current row number
    var currentY=0;//indicates current column number
    var currentCell;//=document.getElementById("grid" + "currentX" + "currentY");//points to the currently highlighted cell in puzzle
    var currentColor="white";//stores the color of the current cell
    var across=true;//indiates the direction of teh users typing across or down
    var keyNum;//stores the key code number of a pressed key

    function init() {
    writeClues();
    var currentCell=document.getElementById("grid00");
    currentCell.style.backgroundColor="yellow";//turns the background of the current cell to yellow
    }
    /* The purpose of the getKey funciton is to capture the key code of the pressed key and call the appropriate function for that key.
    */
    function getKey(e){
    String.fromCharCode(keyNum); //retrieves the key code value of the pressed key and stores it in a var named keyNum

    if(keyNum==32)toggleDirection;
    else if(keyNum==37) moveLeft();
    else if(keyNum==38) moveUp();
    else if(keyNum==39) moveRight();
    else if(keyNum==40) moveDown();
    writeGuess();
    return false;
    }
    /* purpose of the toggleDirection function is to allow a user to press the spacebar to toggle the typing direction from across to down and vice versa. it will also swap the pointin ghand image on the page to match the typing direction.
    */
    function toggleDirection(){
    if (across == true) {
    across = false;
    document.images[1].src="down.gif";
    } else {
    if (across == false) {
    across=true;
    document.images[0].src="across.gif";
    }
    }
    }
    function moveLeft(){
    var currentX=-1;
    if (currentX < 0){
    currentX==4;
    }
    }
    function moveRight(){
    var currentX=++1;
    if (currentX >4){
    currentX==0;
    }
    }
    function moveUp(){
    var currentY=-1;
    if (currentY <0){
    currentY==4;
    }
    }
    function moveDown(){
    var currentY=++1;
    if (currentY >4){
    currentY==0;
    }
    }
    /*
    the purpose of the moveCursor function is to move the active cell in response to a user pressing the arrow keys on the keyboard.
    */
    function moveCursor(){
    currentCell.style.backgroundColor=currentColor;
    if(keyNum==37)moveLeft();
    if(keyNum==38){
    moveUp();
    }
    if(keyNum==39){
    moveRight();
    }
    if(keyNum==40){
    moveDown;
    }
    currentCell=document.getElementById("grid" + currentX + currentY);
    currentColor=currentCell.style.backgroundColor();
    currentCell.style.backgroundColor="yellow";
    }
    /* the purpose of the writeGuess function is to write the letter typed by the user into the current cell and then to change the background color of that cell to indicate whether the user typed the correct letter. after the letter is written the current cell should move either to the right or down, depening on the typing direction(as indicated by the across variable)
    */

    function writeGuess(){
    String.fromCharCode(keyNum);//extracts the letter corresponding to the value of the keyNum variable.
    var outChar=keyNum;//stores the letter in a variable named outChar
    currentCell=document.getElementById("grid" + currentX + currentY);
    currentColor=currentCell.style.backgroundColor;
    currentCell.style.backgroundColor = "yellow";
    string.toUpperCase; //change the outChar variable to an uppercase letter
    document.write(String(outChar)); // i think this is the line i am having trouble with. I am supposed to use the writeText fucniton to write outChar to teh current Cell.
    if (words[(currentY * 5) + currentX] == outChar) {
    currentCell.style.backgroundColor="lightgreen";
    } else {
    currentCell.style.backgroundColor="pink";
    }
    if(across==true){
    moveRight();
    }else{
    moveDown();
    }
    }
    </script>
    </head>
    <body onload="init()" onkeydown="writeGuess()">
    <div id="head"><img src="pcglogo.jpg" alt="The Park City Gazette" /></div>

    <div id="intro">
    <h2>Today's Puzzle</h2>
    <p>Type the correct answer for each clue. A green square
    indicates a correct answer; a red square means that the letter is not
    correct.</p>
    <p>The pointing hand indicates the current typing direction of the
    puzzle. To switch between typing across and down, press the space bar.
    Move to different cells by pressing the arrow keys on your
    keyboard.</p>
    <p>Click the <b>Reveal Answer</b> button to see the correct answers.</p>
    </div>

    <div id="direction"><img src="across.gif" alt="down.gif" /></div>

    <div class="grid" id="grid00"> </div>
    <div class="grid" id="grid10"> </div>
    <div class="grid" id="grid20"> </div>
    <div class="grid" id="grid30"> </div>
    <div class="grid" id="grid40"> </div>

    <div class="grid" id="grid01"> </div>
    <div class="grid" id="grid11"> </div>
    <div class="grid" id="grid21"> </div>
    <div class="grid" id="grid31"> </div>
    <div class="grid" id="grid41"> </div>

    <div class="grid" id="grid02"> </div>
    <div class="grid" id="grid12"> </div>
    <div class="grid" id="grid22"> </div>
    <div class="grid" id="grid32"> </div>
    <div class="grid" id="grid42"> </div>

    <div class="grid" id="grid03"> </div>
    <div class="grid" id="grid13"> </div>
    <div class="grid" id="grid23"> </div>
    <div class="grid" id="grid33"> </div>
    <div class="grid" id="grid43"> </div>

    <div class="grid" id="grid04"> </div>
    <div class="grid" id="grid14"> </div>
    <div class="grid" id="grid24"> </div>
    <div class="grid" id="grid34"> </div>
    <div class="grid" id="grid44"> </div>

    <div id="reveal" onclick="showAns()" style="cursorointer">Reveal Answer</div>

    <div id="rowhead">Rows</div>
    <div id="across1" class="clue"> </div>
    <div id="across2" class="clue"> </div>
    <div id="across3" class="clue"> </div>
    <div id="across4" class="clue"> </div>
    <div id="across5" class="clue"> </div>

    <div id="colhead">Columns</div>
    <div id="down1" class="clue"> </div>
    <div id="down2" class="clue"> </div>
    <div id="down3" class="clue"> </div>
    <div id="down4" class="clue"> </div>
    <div id="down5" class="clue"> </div>
    </body>
    </html>

  2. #2
    Join Date
    Nov 2006
    Location
    Oakland
    Posts
    500
    In your writeGuess function the statement String.fromCharCode(keyNum); does not assign its return value to any variable.
    Further down "string.toUpperCase;" in this synopsis the "string" is the actual string: in this case outChar to which the method toUpperCase() is applied to.


    function writeGuess(event){
    var e = event || window.event;
    var outChar = e.charCode || e.keyCode;
    currentCell=document.getElementById("grid" + currentX + currentY);
    currentColor=currentCell.style.backgroundColor;
    currentCell.style.backgroundColor = "yellow";
    outChar.toUpperCase(); //change the outChar variable to an uppercase letter
    document.write(String(outChar)); // i think this is the line i am having trouble with. I am supposed to use the writeText fucniton to write outChar to teh current Cell.
    if (words[(currentY * 5) + currentX] == outChar) {
    currentCell.style.backgroundColor="lightgreen";
    } else {
    currentCell.style.backgroundColor="pink";
    }
    if(across==true){
    moveRight();
    }else{
    moveDown();
    }
    }
    Last edited by holyhttp; 09-11-2012 at 09:47 PM.

  3. #3
    Join Date
    Aug 2012
    Posts
    10

    toUpperCase method

    Thank you for the assistance i do see how i missed the event. In regards to the toUpperCase method, i have tried entering outChar.toUpperCase(); however when i do this i get the error

    Line: 141
    Error: Object doesn't support property or method 'toUpperCase'

    wouldnt outChar be a variable and the currentCell be the object?

  4. #4
    Join Date
    Nov 2006
    Location
    Oakland
    Posts
    500
    Actually I should have written:
    var keyNum= e.charCode || e.keyCode;
    var outChar =String.fromCharCode(keyNum);

    From then on the outChar variable is an actual text character.
    You therefore not longer need to use String(outChar) but instead you would write:
    document.write(outChar);

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Tags for this Thread

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
HTML5 Development Center



Recent Articles