atum/examples/Game-Of-Life/Game-Of-Life.js

A Procedural Graph Based Javascript Library

"use strict";

var poisson = Atum.Utility.PointDistribution.poisson;
var square = Atum.Utility.PointDistribution.square;
var Rectangle = Atum.Geometry.Rectangle;
var Vector = Atum.Geometry.Vector;
var Map = Atum.Graph.Map;
var Rand = Atum.Utility.Rand;

var width;
var height;
var graph;

var pointDensity = 40;

var params = {
    random: initGameOfLife,
    clear: clear,
    play: true,
    fps: 3
};

//---- Main Set Up Function ----

function setup() {
    width = document.body.clientWidth || window.innerWidth;
    height = document.body.clientHeight || window.innerHeight;

    createCanvas(width, height);
    frameRate(params.fps);

    setUpGui();

    createAndRender();
}

//---- Other Setup Functions

function setUpGui() {
    var gui = new dat.GUI();

    gui.add(params, "random").name("Randomize").onChange(draw);
    gui.add(params, "clear").name("Clear").onChange(draw);
    gui.add(params, "play").name("Play");
    gui.add(params, "fps", 1, 10).name("Frame Rate Per Sec").onChange(setFrameRate);
}

function setFrameRate() {
    frameRate(params.fps);
}

function createAndRender() {
    // Create
    Rand.setSeed(10);
    createGraph();
    initGameOfLife();

    // Render
    background("#303030");
    drawGraph();
}

//---- Creation Functions

function createGraph() {
    var bbox = new Rectangle(Vector.zero(), width, height);
    var points = poisson(bbox, pointDensity);
    graph = new Map(points, bbox);
}

function initGameOfLife() {
    for (var center of graph.centers) {
        center.data.alive = Rand.rand() < 0.4;
    }
}

function clear() {
    for (var center of graph.centers) {
        center.data.alive = false;
    }
}

function gameOfLifeRules(center) {
    var n = center.neighbors.map(el => el.data.alive).reduce((n, val) => n + val);

    return {
        alive: center.data.alive && (n === 2 || n === 3) ||
            !center.data.alive && n === 3
    };
}

//---- The Main Draw Function ----

function draw() {
    if (params.play) {
        graph.generate(gameOfLifeRules);
        drawGraph();
    }
}

//---- Draw the voronoi graph

function drawGraph() {


    noStroke();
    for (var center of graph.centers) {
        if (center.data.alive) {
            fill("#AA7539");
        } else {
            fill("#303030");
        }

        polygon(center);
    }

    stroke("#393939");
    strokeWeight(2);
    for (var edge of graph.edges) {
        line(edge.v0.x, edge.v0.y, edge.v1.x, edge.v1.y);
    }
    strokeWeight(1);
}

//---- Draw polygon from triangles

function polygon(center) {
    noSmooth();
    var corners = center.corners;
    for (var i = 0; i < corners.length; i++) {
        var c1 = corners[i];
        var c2 = corners[(i + 1) % corners.length];
        triangle(c1.x, c1.y, c2.x, c2.y, center.x, center.y);
    }
    smooth();
}