An open API service indexing awesome lists of open source software.

https://github.com/samsamskies/tictactoe-engine

You provide the moves and this module will handle the tictactoe game logic
https://github.com/samsamskies/tictactoe-engine

Last synced: 11 months ago
JSON representation

You provide the moves and this module will handle the tictactoe game logic

Awesome Lists containing this project

README

          

# tictactoe-engine

You provide the moves and this module will handle the game logic.

## Installation
NPM
```
$ npm install tictactoe-engine --save
```

## Rules
* There are 2 players 'x' and 'o'
* 'x' always goes first

## Usage
ES6 Module
```js
import { playRound } from 'tictactoe-engine';

playRound([[0, 0]])
// => { currentPlayer: 'x', isWinner: false }

playRound([[0, 0], [1, 1]])
// => { currentPlayer: 'o', isWinner: false }

playRound([[0, 0], [1, 1], [0, 1]])
// => { currentPlayer: 'x', isWinner: false }

playRound([[0, 0], [1, 1], [0, 1], [1, 0]])
// => { currentPlayer: 'o', isWinner: false }

playRound([[0, 0], [1, 1], [0, 1], [1, 0], [0, 2]])
// => { currentPlayer: 'x', isWinner: true }
```

Node
```js
const { playRound } = require('tictactoe-engine');

playRound([[0, 0]])
// => { currentPlayer: 'x', isWinner: false }

playRound([[0, 0], [1, 1]])
// => { currentPlayer: 'o', isWinner: false }

playRound([[0, 0], [1, 1], [0, 1]])
// => { currentPlayer: 'x', isWinner: false }

playRound([[0, 0], [1, 1], [0, 1], [1, 0]])
// => { currentPlayer: 'o', isWinner: false }

playRound([[0, 0], [1, 1], [0, 1], [1, 0], [0, 2]])
// => { currentPlayer: 'x', isWinner: true }
```

Script Tag
```html

const { playRound } = window.ticTacToeEngine;

playRound([[0, 0]])
// => { currentPlayer: 'x', isWinner: false }

playRound([[0, 0], [1, 1]])
// => { currentPlayer: 'o', isWinner: false }

playRound([[0, 0], [1, 1], [0, 1]])
// => { currentPlayer: 'x', isWinner: false }

playRound([[0, 0], [1, 1], [0, 1], [1, 0]])
// => { currentPlayer: 'o', isWinner: false }

playRound([[0, 0], [1, 1], [0, 1], [1, 0], [0, 2]])
// => { currentPlayer: 'x', isWinner: true }

```

Example of Using Logic to Build an HTML TicTacToe Game

Demo: https://samsamskies.github.io/tictactoe-engine/
```html




Tic Tac Toe

body {
display: flex;
align-items: center;
justify-content: center;
height: 100vh;
}

.row {
display: flex;
}

.cell {
width: 200px;
height: 200px;
border: 2px solid black;
font-size: 200px;
text-align: center;
line-height: 160px;
cursor: pointer;
}




















const { playRound } = window.ticTacToeEngine;

startGame();

function startGame () {
let moves = [];

document.querySelector('.board').addEventListener('click', (e) => {
const move = convertCellToCoordinates(e.target);

if (checkIfMoveWasAlreadyMade(moves, move)) {
return;
}

moves.push(move);

const { currentPlayer, winner } = playRound(moves);

updateCellContents(e.target, currentPlayer);

if (winner === '') {
return;
}

// Give DOM time to update before showing
setTimeout(() => {
alert(`winner is ${winner}`);
window.location.reload();
}, 100);
});
}

function checkIfMoveWasAlreadyMade (moves, [moveX, moveY]) {
return moves.find(([x, y]) => moveX === x && moveY === y);
}

function convertCellToCoordinates (cellNode) {
const x = parseInt(cellNode.closest('.row').getAttribute('data-row'));
const y = parseInt(cellNode.getAttribute('data-column'));

return [x, y];
}

function updateCellContents (cellNode, currentPlayer) {
cellNode.innerHTML = currentPlayer;
}

```