# tictactoe-engine

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

Latest version **1.1.3** (published 2016-08-16) · MIT license · 0 weekly downloads

## Install

```sh
npm install tictactoe-engine
pnpm add tictactoe-engine
yarn add tictactoe-engine
bun add tictactoe-engine
```

## Health

**Score 15/100 (F)** — status: abandoned.

Positive: no vulnerabilities.

Warnings: low downloads; no types; no esm support.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 1.1.3 |
| Published | 2016-08-16 |
| First published | 2016-08-15 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 0 |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 0 |
| Author | Sam Samskies |
| Maintainers | samsamskies |
| Keywords | tictactoe, game |

## Links

- npm: https://www.npmjs.com/package/tictactoe-engine
- Repository: https://github.com/SamSamskies/tictactoe-engine
- Homepage: https://github.com/SamSamskies/tictactoe-engine#readme
- Issues: https://github.com/SamSamskies/tictactoe-engine/issues
- npm.io page: https://npm.io/package/tictactoe-engine

## Recent versions

- 1.1.3 (latest) — 2016-08-16
- 1.1.2 — 2016-08-16
- 1.1.1 — 2016-08-15
- 1.1.0 — 2016-08-15
- 1.0.0 — 2016-08-15

## 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
<script src="node_modules/tictactoe-engine/dist/ticTacToeEngine.js"></script>
<script>
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 }
</script>
```

Example of Using Logic to Build an HTML TicTacToe Game

Demo: https://samsamskies.github.io/tictactoe-engine/
```html
<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport"
          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Tic Tac Toe</title>
    <style>
        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;
        }
    </style>
</head>
<body>
    <div class="board">
        <div class="row" data-row="0">
            <div class="cell" data-column="0"></div>
            <div class="cell" data-column="1"></div>
            <div class="cell" data-column="2"></div>
        </div>
        <div class="row" data-row="1">
            <div class="cell" data-column="0"></div>
            <div class="cell" data-column="1"></div>
            <div class="cell" data-column="2"></div>
        </div>
        <div class="row" data-row="2">
            <div class="cell" data-column="0"></div>
            <div class="cell" data-column="1"></div>
            <div class="cell" data-column="2"></div>
        </div>
    </div>
    <script src="node_modules/tictactoe-engine/dist/ticTacToeEngine.js"></script>
    <script>
        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;
        }
    </script>
</body>
</html>
```

---
_Source: https://npm.io/package/tictactoe-engine · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._
