Tic Tac Toe

Week 4 2 Day Project at Epicodus, 11.1.2018

  • HTML Form and CSS to gather user information.
  • Manipulate user input using DOM and JQuery for front end logic
  • Use JavaScript Loops, Arrays, Object Constructors and Prototypes to create business logic

Created By

  • Paige Williams and Tanvi Garg

Description

  • Accepts a number type user input and returns all number from 0 - usernumber with certain numbers containing 0,1 or divisible by 3 replaced with predefined strings for each condition.
  • Conditions are in the order of least to most importance.

Specifications

  • Draw boxes with each having an X and Y coordinate.
  • Top left box has coordinates 0,0
  • Example: Start new game and boxes are empty
  • Assign player 1 symbol X and player 2 symbol 0.
  • Player N clicks on board and their assigned symbol appears
  • Input: Player clicks on middle box
  • Output: Respective symbol would appear in the middle box.
  • Player 1 = Active Player clicks and their assigned symbol appears. Then Player 2 = Active Player and can now click on the box to place their assigned symbol.Player 1 cannot play at this time. Turn taking continues through the game
  • Input: Player 1 places X in a box. Their turn is over.
  • Output: Now its Player 2's turn. And so on.
  • Once one player marks three boxes in a row, either horizontal, vertical or diagonal, the game is over and the player with three in a row wins.
  • Example input: Player N marks three in a row.
  • Example output: Player N wins and game is over.
  • Player N can not click on a box that already has been marked.
  • Input: Player N clicks on a box that has been marked previously.
  • Output: Mark can not be placed and the user would be prompted to click in an empty box.
  • When game is over board is cleared and the next game can begin.
  • Input: Game is over.
  • Output: Board is cleared.
  • If neither player has three in a row and all boxes are marked, there is a draw.
  • Input: All boxes are marked and none are three in a row.
  • Output: There is a draw.

Complete setup/installation instructions

  1. Go to GitHub profile and project @ paigewilliams and TanviCodeLife
  2. Use #git clone command to pull it to a local repository in your Home directory.
  3. Go to project folder beep-boop and open the index.html file in your browser.
  4. Input any number and click submit
  5. Beep Boop Output will be displayed

Technologies used

  1. Bootstrap and custom CSS
  2. JQuery and JavaScript
  3. HTML5
  4. Atom
  5. Command Line
  6. GitHub

Known Bugs

No known bugs.

Contact information

tanvi.garg23@gmail.com

Support

  • For issues, please contact authors at the provided contact information above.

MIT License

Copyright (c) 2018 Tanvi Garg