vue-game-of-life

    1.0.15 • Public • Published

    A Vue component to render a John Conway's Game of Life

    Demo

    Game of life

    Install

    npm install vue-game-of-life --save
    

    How to use

    Import and register the plugin as usual

    import GameOfLife from 'vue-game-of-life'
     
    Vue.use(GameOfLife);

    Then use it as you would with any component

    <game-of-life></game-of-life>

    Configuration

    The following props can be sent to the component:

    Name Type Default Desctiption
    cols Number 100 Number of columns
    rows Number 100 Number of rows
    cellWidth Number 5 Width of each cell
    tickInterval Number 100 Time between each 'tick' in milliseconds
    color String #ddd Color to display the alive cells
    alivePercent Number 10 Initial percent of alive cells

    Getting data out

    You can also get some data out of the component, such as number of ticks, cells alive and dead cells.

    Do that using a slot scope

    example:

    <GameOfLife v-slot:default="{ ticks, cellsAlive, cellsDead }">
        Tick: {{ ticks }}, Alive: {{ cellsAlive }}, Dead: {{ cellsDead }}
    </GameOfLife>

    Install

    npm i vue-game-of-life

    DownloadsWeekly Downloads

    16

    Version

    1.0.15

    License

    MIT

    Unpacked Size

    235 kB

    Total Files

    11

    Last publish

    Collaborators

    • iak