First, run the lite-server to start the development server:
npm run devThe page auto-updates as you edit the file.
[X] Will handle the structure of the gameboard
[X] Will have 4 sections based on the mockups by Ana:
->1st stage gameboard
-triggered on page load
-intro gameboard
-displays the game title & player modes
->2nd stage gameboard
-triggered when a player chooses an opponent
-displays an input player name notification window
-notification window has an input field for the player(s) name
and a start button
->3rd stage gameboard
-triggered when a player clicks start
-displays an empty gameboard with player name(s) below X and O
-random player starts at this point
->4th stage gameboard
-triggered when a player wins or draws
-gameboard is full of X and O at this point
-displays notification window with the winner or draw
-notification window also has a 'play again' & 'back to menu'
[X] Will have a night/day mode button
[X] Will connect objects to the DOM (majority of the event listeners etc)
[X] Will initiate game instances depending on player opponent choice
[X] Will handle swithcing between different gameboard states
[X] Will control dark/light mode
[X] Will control mouse hover actions
[X] The gameboard is made up of 9 indidivual cells/squares
[X] No need to render the board since index.html handles the structure
->target each individual cell/square on the gameboard
[X] Will connect the DOM to individual cells
[X] Each cell will hold a reference to a token
[X] Will check to see if a player "owns" a cell and returns the "owner"
->will return null if no token is associated otherwise return "owner"
->will mark a cell as occupied
*** I believe that frankRose gave each player 5 tokens coz those are the
max moves a single player can ever make on the board **
[X] Will keep track of the token position
[X] Will render the token 'X' or 'O' on the gameboard
[X] Will keep track of the players moves
[X] Will create the player tokens
[X] Will keep track of the player tokens
->Will keep track of which tokens haven't been played
->Will select the next token for the player to use
[X] Will create a computer player
->Will make random computer moves depending on available empty cells/squares
[X] Will initialize the game once the player clicks start
[X] Will create the players once the player(s) enter their name(s)
[X] Will monitor game play state
->Will determine whose turn it is; player or computer
->Will keep track of players turns.
->Will switch players after each play/click.
->Will actively check for a 'draw' or a 'win' and update game state
->Will display game results in the DOM. 'draw' or 'win'
[X] Will handle various board game-play effects
->Will toggle player token during hover depending on game state
->Will update and mark gameboard cells
|--README.md
|--index.html
|--package.json
|----assets
|-fonts
|-mockups
|----js
|-boardCell.js
|-gameBoard.js
|-gameLogic.js
|-main.js
|-player.js
|-playerToken.js
|----stylesheet
|-mediaqueries.css
|-mediaqueries.scss
|-mixins.css
|-mixins.scss
|-normalize.css
|-stylesheet.css
|-stylesheet.scss