Code Monkey home page Code Monkey logo

connect-4's Introduction

CONNECT FOUR

DESCRIPTION

A two player game to connect four chips of the same color in a row. Connect Four was created in 1974 and has been enjoyed by thousands of families since.


IMAGES


TECHNOLOGY

HTML CSS JavaScript Imgur


GETTING STARTED

https://raga4905.github.io/Connect-4/

Initialize function: Set the values of the table array to null and create an array of arrays to represent the columns.

HandleDropCoin function: When the player clicks the drop button, each button should be associated with an array. It should loop through the array and get to the index of null. If the column is full, it'll stop adding coins.

Winning logic:

Horizontal win: Need to loop through board start bottom left to right. Add one to the column. Need to stop at row 6 and column 4 so it doesn't go past the board. Math: if board[1][0] + board[2][0] + board[3][0] + board[4][0] === 4

Vertical win: Need to loop through board start bottom left to right. Add one to row to go up the column chosen. Has to stop at four (because 0-5 rows). Column has to stop at 7 cause 0-6 columns. Needs to go through all columns.

Diagonal Up win: Need to loop through board start bottom left to right. Add one to both row and column, both starting at zero. Starting at the left-most column: rowIdx cellIdx, + colIdx + 1 to move over cell to right (as long as you leave row idx the same)

Diagonal Down win: Need to loop through board starting at highest row. Board needs to stop at column index four and start at row index 2. Then you need to add one to go across the columns and subtract to go down the rows.


NEXT STEPS

Add sound to coin drop

Add animation on winner message

connect-4's People

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.