Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 2 of 2
  1. #1
    New to the CF scene
    Join Date
    Mar 2013
    Posts
    2
    Thanks
    1
    Thanked 0 Times in 0 Posts

    Post Need some assistance with color program

    Hello,

    I am a new Computer Science student and I am having a hard time working on an at home assignment meant to help me better learn html coding. He set up most of it and we are to practice writing the coding for 7 specifications and rules he set for this game. I have little to none experience in html coding, I know what I am supposed to do with it but I don't even know how to start. Here is the program code :

    Code:
    <HTML>
    
    <HEAD><TITLE>GridSquares</TITLE></HEAD>
    
    <SCRIPT>
    
    function getBoardSquareColor(row, col)
    {
       grid = document.getElementById("gridTable");
    
       cell = grid.rows[row].cells[col];
       
       return cell.style.backgroundColor;
    }
    
    function passTestBoards()
    {
        // MORE TESTS FORTHCOMING
    
        generateBoard(["teal", "blue", "green", "orange", "gold", "yellow", "blue", "teal",
                       "gold", "gold","gold", "gold","gold", "gold","gold", "gold",
                       "red", "red", "red", "red", "black", "black", "black", "black",
                       "gold", "gold","gold", "gold","gold", "gold","gold", "gold",
                       "gold", "gold","gold", "gold","gold", "gold","gold", "gold",
                       "gold", "gold","gold", "gold","gold", "gold","gold", "gold",
                       "gold", "gold","gold", "gold","gold", "gold","gold", "gold",
                       "teal", "silver", "gold", "gold", "gold", "gold", "gold", "teal"]);
    
        if(!isGoodBoard())
        {
            alert("Does not accept board that's okay.");
            return false;
        }
    
        generateBoard(["teal", "blue", "green", "orange", "gold", "yellow", "blue", "teal",
                       "gold", "gold","gold", "gold","gold", "gold","gold", "gold",
                       "red", "red", "red", "red", "black", "black", "black", "black",
                       "gold", "gold","gold", "gold","gold", "gold","gold", "gold",
                       "gold", "gold","white", "gold","gold", "gold","gold", "gold",
                       "gold", "gold","gold", "gold","gold", "gold","gold", "gold",
                       "gold", "gold","gold", "gold","gold", "gold","gold", "gold",
                       "teal", "silver", "gold", "gold", "gold", "gold", "gold", "teal"]);
    
        if(isGoodBoard())
        {
            alert("Does not check test 1 correctly.");
            //return false;
        }
    
    
        generateBoard(["teal", "blue", "green", "orange", "gold", "yellow", "blue", "teal",
                       "gold", "gold","gold", "gold","gold", "gold","gold", "gold",
                       "red", "red", "red", "red", "black", "black", "black", "red",
                       "gold", "gold","gold", "gold","gold", "gold","gold", "gold",
                       "gold", "gold","red", "gold","gold", "gold","gold", "gold",
                       "gold", "gold","gold", "gold","gold", "gold","gold", "gold",
                       "gold", "gold","gold", "gold","gold", "gold","gold", "gold",
                       "teal", "silver", "gold", "gold", "gold", "gold", "gold", "teal"]);
    
        if(isGoodBoard())
        {
            alert("Does not check test 2 correctly.");
            //return false;
        }
    
    
        generateBoard(["teal", "blue", "green", "orange", "gold", "yellow", "blue", "orange",
                       "gold", "gold","gold", "gold","gold", "gold","gold", "gold",
                       "red", "red", "red", "red", "black", "black", "black", "black",
                       "gold", "gold","gold", "gold","gold", "gold","gold", "gold",
                       "gold", "gold","gold", "gold","gold", "gold","gold", "gold",
                       "gold", "gold","gold", "gold","gold", "gold","gold", "gold",
                       "gold", "gold","gold", "gold","gold", "gold","gold", "gold",
                       "teal", "silver", "gold", "gold", "gold", "gold", "gold", "teal"]);
    
        if(isGoodBoard())
        {
            alert("Does not check test 3 correctly.");
            //return false;
        }
    
        generateBoard(["teal", "blue", "green", "orange", "gold", "yellow", "blue", "teal",
                       "gold", "gold","gold", "gold","gold", "gold","gold", "gold",
                       "red", "red", "black", "red", "black", "black", "black", "black",
                       "gold", "gold","gold", "gold","gold", "gold","gold", "gold",
                       "gold", "gold","gold", "gold","gold", "gold","gold", "gold",
                       "gold", "gold","gold", "gold","gold", "gold","gold", "gold",
                       "gold", "gold","gold", "gold","gold", "gold","gold", "gold",
                       "teal", "silver", "gold", "gold", "gold", "gold", "gold", "teal"]);
    
        if(isGoodBoard())
        {
            alert("Does not check test 4 correctly.");
            //return false;
        }
    
        generateBoard(["teal", "blue", "green", "orange", "gold", "yellow", "blue", "teal",
                       "gold", "gold","gold", "gold","gold", "gold","gold", "gold",
                       "red", "red", "red", "red", "black", "black", "black", "black",
                       "gold", "gold","gold", "gold","gold", "gold","gold", "gold",
                       "gold", "gold","gold", "gold","gold", "gold","green", "green",
                       "gold", "gold","gold", "gold","gold", "gold","green", "gold",
                       "gold", "gold","gold", "gold","gold", "gold","green", "green",
                       "teal", "silver", "gold", "gold", "gold", "gold", "gold", "teal"]);
    
        if(isGoodBoard())
        {
            alert("Does not check test 5 correctly.");
            //return false;
        }
    
        generateBoard(["teal", "purple", "green", "orange", "gold", "yellow", "purple", "teal",
                       "gold", "gold","gold", "gold","gold", "gold","gold", "gold",
                       "red", "red", "red", "red", "black", "black", "black", "black",
                       "gold", "gold","gold", "gold","gold", "gold","gold", "gold",
                       "gold", "gold","gold", "gold","gold", "gold","green", "green",
                       "gold", "gold","gold", "gold","gold", "gold","gold", "gold",
                       "gold", "gold","gold", "gold","gold", "gold","green", "green",
                       "teal", "silver", "gold", "gold", "gold", "gold", "gold", "teal"]);
    
        if(isGoodBoard())
        {
            alert("Does not check test 6 correctly.");
            //return false;
        }
    
        generateBoard(["teal", "blue", "orange", "orange", "blue", "blue", "blue", "teal",
                       "gold", "gold","gold", "gold","gold", "gold","gold", "gold",
                       "red", "red", "red", "red", "black", "black", "black", "black",
                       "gold", "gold","gold", "gold","gold", "gold","gold", "gold",
                       "gold", "gold","gold", "gold","gold", "gold","green", "green",
                       "gold", "gold","gold", "gold","gold", "gold","gold", "gold",
                       "gold", "gold","gold", "gold","gold", "gold","green", "green",
                       "teal", "blue", "gold", "gold", "gold", "gold", "gold", "teal"]);
    
        if(isGoodBoard())
        {
            alert("Does not check test 7 correctly.");
            //return false;
        }
    
        generateBoard(["teal", "blue", "blue", "blue", "blue", "blue", "blue", "teal",
                       "gold", "gold","gold", "gold","gold", "gold","gold", "gold",
                       "red", "red", "red", "red", "black", "black", "black", "black",
                       "gold", "gold","gold", "gold","gold", "gold","gold", "gold",
                       "gold", "gold","gold", "gold","gold", "gold","green", "green",
                       "gold", "gold","gold", "gold","gold", "gold","gold", "gold",
                       "gold", "gold","gold", "gold","gold", "gold","green", "green",
                       "teal", "silver", "gold", "gold", "gold", "gold", "gold", "teal"]);
    
        if(!isGoodBoard())
        {
            alert("Does not accept board that's okay.");
            //return false;
        }
    }
    
    function isGold(rgbColor)
    {
        return rgbColor == "rgb(255, 215, 0)";
    }
    
    function isWhite(rgbColor)
    {
        return rgbColor == "rgb(255, 255, 255)" || rgbColor.search(/white/i) != -1;
    }
    
    function isBlack(rgbColor)
    {
        return rgbColor == "rgb(0, 0, 0)"  || rgbColor.search(/black/i) != -1;
    }
    
    function isRed(rgbColor)
    {
        return rgbColor == "rgb(255, 0, 0)" || rgbColor.search(/red/i) != -1;
    }
    
    function isBlue(rgbColor)
    {
        return rgbColor == "rgb(0, 0, 255)" || rgbColor.search(/blue/i) != -1;
    }
    
    function isOrange(rgbColor)
    {
        return rgbColor == "rgb(255, 165, 0)" || rgbColor.search(/orange/i) != -1;
    }
    
    function isGoodBoard()
    {
    
        // CODE FOR TEST 1 BELOW: All grid squares should have a nonwhite color - return false if not before test 2
    	
    	
    
        // CODE FOR TEST 2 BELOW: Some border square should be black. - return false otherwise before test 3
    
    
        // CODE FOR TEST 3 BELOW: All corner grid squares should be the same color - return false otherwise before test 4
    
    
        // CODE FOR TEST 4 BELOW: There should exist at least four grid squares that are red. - return false otherwise before test 5
    
    
        // CODE FOR TEST 5 BELOW: No matter what grid square is chosen, there should be a neighboring one (horizontally, vertically, or diagonally) that's gold. - return false otherwise before test 6
    
    
        // CODE FOR TEST 6 BELOW: If there's an orange square on the board, then there will need to be a blue square as well. (But the board can have a blue square without having an orange one.) - return false otherwise before test 7
    
    
        // CODE FOR TEST 7 BELOW: There needs to exist a square whose color is different from every other square's color. - return false otherwise
      
    
        return true;
    }
    
    
    
    
    
    function generateRandomColor()
    
    {
    
        return "#" + Math.floor(Math.random()*Math.pow(256,3)).toString(16);
    
    }
    
    function generateBoard(boardColors)
    {
        var grid = document.getElementById("gridTable");
    
        var numOfRows = grid.rows.length;
    
        var numOfCols = 8;
    
    
        var numOfSpecifiedColors = boardColors.length;
        var index = 0;
        var r;
        var c;
    
        for(r = 0; r < numOfRows; r++)
    
        {
    
            for(c = 0; c < numOfCols; c++)
    
            {
    
                cell = grid.rows[r].cells[c];
                
                if(index < numOfSpecifiedColors)
                    cell.style.backgroundColor = boardColors[index];
    
                else
                    cell.style.backgroundColor = generateRandomColor();
    
                index++;
                //cell.style.backgroundColor = "gold";
    
            }
    
        }
    
    //alert(isGold(getBoardSquareColor(0, 0)));
    
    }
    
    </SCRIPT>
    
    <BODY BGCOLOR = "#FFFFFF">
    
    <TABLE BORDER = "1">
    <TR>
    
    <TD>
    
    <TABLE BORDER = "1" CELLPADDING = "1" id = "gridTable">
    <TR>
    <TD HEIGHT = "50" WIDTH = "50" onClick = "alert(this.cellIndex)"></TD>
    <TD HEIGHT = "50" WIDTH = "50"  onClick = "alert(this.cellIndex)"></TD>
    <TD HEIGHT = "50" WIDTH = "50"></TD>
    <TD HEIGHT = "50" WIDTH = "50"></TD>
    <TD HEIGHT = "50" WIDTH = "50"></TD>
    <TD HEIGHT = "50" WIDTH = "50"></TD>
    <TD HEIGHT = "50" WIDTH = "50"></TD>
    <TD HEIGHT = "50" WIDTH = "50"></TD>
    </TR>
    <TR>
    <TD HEIGHT = "50" WIDTH = "50" onClick = "alert(this.cellIndex)"></TD>
    <TD HEIGHT = "50" WIDTH = "50"></TD>
    <TD HEIGHT = "50" WIDTH = "50"></TD>
    <TD HEIGHT = "50" WIDTH = "50"></TD>
    <TD HEIGHT = "50" WIDTH = "50"></TD>
    <TD HEIGHT = "50" WIDTH = "50"></TD>
    <TD HEIGHT = "50" WIDTH = "50"></TD>
    <TD HEIGHT = "50" WIDTH = "50"></TD>
    </TR>
    <TR>
    <TD HEIGHT = "50" WIDTH = "50"></TD>
    <TD HEIGHT = "50" WIDTH = "50"></TD>
    <TD HEIGHT = "50" WIDTH = "50"></TD>
    <TD HEIGHT = "50" WIDTH = "50"></TD>
    <TD HEIGHT = "50" WIDTH = "50"></TD>
    <TD HEIGHT = "50" WIDTH = "50"></TD>
    <TD HEIGHT = "50" WIDTH = "50"></TD>
    <TD HEIGHT = "50" WIDTH = "50"></TD>
    </TR>
    <TR>
    <TD HEIGHT = "50" WIDTH = "50"></TD>
    <TD HEIGHT = "50" WIDTH = "50"></TD>
    <TD HEIGHT = "50" WIDTH = "50"></TD>
    <TD HEIGHT = "50" WIDTH = "50"></TD>
    <TD HEIGHT = "50" WIDTH = "50"></TD>
    <TD HEIGHT = "50" WIDTH = "50"></TD>
    <TD HEIGHT = "50" WIDTH = "50"></TD>
    <TD HEIGHT = "50" WIDTH = "50"></TD>
    </TR>
    <TR>
    <TD HEIGHT = "50" WIDTH = "50"></TD>
    <TD HEIGHT = "50" WIDTH = "50"></TD>
    <TD HEIGHT = "50" WIDTH = "50"></TD>
    <TD HEIGHT = "50" WIDTH = "50"></TD>
    <TD HEIGHT = "50" WIDTH = "50"></TD>
    <TD HEIGHT = "50" WIDTH = "50"></TD>
    <TD HEIGHT = "50" WIDTH = "50"></TD>
    <TD HEIGHT = "50" WIDTH = "50"></TD>
    </TR>
    <TR>
    <TD HEIGHT = "50" WIDTH = "50"></TD>
    <TD HEIGHT = "50" WIDTH = "50"></TD>
    <TD HEIGHT = "50" WIDTH = "50"></TD>
    <TD HEIGHT = "50" WIDTH = "50"></TD>
    <TD HEIGHT = "50" WIDTH = "50"></TD>
    <TD HEIGHT = "50" WIDTH = "50"></TD>
    <TD HEIGHT = "50" WIDTH = "50"></TD>
    <TD HEIGHT = "50" WIDTH = "50"></TD>
    </TR>
    <TR>
    <TD HEIGHT = "50" WIDTH = "50"></TD>
    <TD HEIGHT = "50" WIDTH = "50"></TD>
    <TD HEIGHT = "50" WIDTH = "50"></TD>
    <TD HEIGHT = "50" WIDTH = "50"></TD>
    <TD HEIGHT = "50" WIDTH = "50"></TD>
    <TD HEIGHT = "50" WIDTH = "50"></TD>
    <TD HEIGHT = "50" WIDTH = "50"></TD>
    <TD HEIGHT = "50" WIDTH = "50"></TD>
    </TR>
    <TR>
    <TD HEIGHT = "50" WIDTH = "50"></TD>
    <TD HEIGHT = "50" WIDTH = "50"></TD>
    <TD HEIGHT = "50" WIDTH = "50"></TD>
    <TD HEIGHT = "50" WIDTH = "50"></TD>
    <TD HEIGHT = "50" WIDTH = "50"></TD>
    <TD HEIGHT = "50" WIDTH = "50"></TD>
    <TD HEIGHT = "50" WIDTH = "50"></TD>
    <TD HEIGHT = "50" WIDTH = "50"></TD>
    </TR>
    </TABLE>
    
    </TD>
    
    <TD WIDTH = "500">
    <FONT FACE = "VERDANA"><B>Directions from your Team Leader</B>: We're considering different 8 X 8 multicolor boards for our new game GridSquares.  But the board needs to meet some specifications outlined below to fit our game rules.  I want you to write a function to make sure that our candidate board designs meet these specifications.  Can you do this by <B>the end of the day on Thurs., March 10, 2013</B>?  Thanks.
    <OL>
    <LI>All grid squares should have a nonwhite color.
    <LI>Some border square should be black.
    <LI>All corner grid squares should be the same color.
    <LI>There should exist at least four grid squares that are red.
    <LI>No matter what grid square is chosen, there should be a neighboring one (horizontally, vertically, or diagonally) that's gold.
    <LI>If there's an orange square on the board, then there will need to be a blue square as well.  (But the board can have a blue square without having an orange one.)
    <LI>There needs to exist a square whose color is different from every other square's color.
    </OL>
    </FONT>
    <CENTER>
    <INPUT TYPE = "BUTTON" onClick = "generateBoard([])" VALUE = "Generate Random Board!">
    <INPUT TYPE = "BUTTON" onClick = "passTestBoards([])" VALUE = "Test Boards (Does NOT Guarantee Correctness)!">
    </CENTER>
    </TD>
    </TR>
    </TABLE>
    
    </BODY>
    
    </HTML>
    As you can see towards the middle the he uses comments where the code for tests 1-7 are supposed to go. Obviously he makes it clear what we are supposed to accomplish in the coding but as I mentioned before I am having a hard time even starting because I am not too familiar with the terms and functions needed to even start the process. Any help/guidance/tips would be very appreciated. Thank you!

  • #2
    Senior Coder Arbitrator's Avatar
    Join Date
    Mar 2006
    Location
    Splendora, Texas, United States of America
    Posts
    3,302
    Thanks
    28
    Thanked 276 Times in 270 Posts
    Quote Originally Posted by Codo View Post
    I have little to none experience in html coding, I know what I am supposed to do with it but I don't even know how to start.
    This assignment only requires that you code JavaScript, not HTML. (Therefore, this post is in the wrong forum.)

    Quote Originally Posted by Codo View Post
    Any help/guidance/tips would be very appreciated. Thank you!
    For the first test, use two loops with one nested within the other. The outer one should iterate through the table rows, and the inner one should iterate through the cells of the current row. For each cell, use a conditional statement to test whether or not the background color of that cell is white via the isWhite function. If at any point that condition proves true, invoke return false.

    If you need more help than that, then you should at least post an attempt. Per the forum rules, we can't do your homework for you:

    1.5) No homework assignments - Do not post your entire homework assignment and request that other members do it for you. This is considered cheating, and your thread may even be used by your school to prove your guilt. Now, you may ask for advice or help on a specific aspect of your assignment that you're having trouble with. Use common sense as far as what's acceptable in terms of soliciting help with homework assignments.
    For every complex problem, there is an answer that is clear, simple, and wrong.

  • Users who have thanked Arbitrator for this post:

    Codo (03-08-2013)


  •  

    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
    •