JSFiddle - React, Tailwind, and code Playground

by not important

HTML

<script src="https://code.createjs.com/easeljs-0.8.0.min.js"></script>
<canvas id="canvas" width="512" height="512"></canvas>

CoffeeScript

utils =
    clamp: (index, size) ->
        Math.abs(index % size)

    elevationColor: (elevation, elevationMin, elevationMax) ->
        elevationRange = Math.abs(elevationMin) + Math.abs(elevationMax)
        scale = (Math.abs(elevationMin) + elevation) / elevationRange
        r = 255 - ~~(255 * scale)
        g = 255 - ~~(255 * scale)
        b = 255 - ~~(255 * scale)
        "rgba(#{r}, #{g}, #{b}, 255)"

class FloodFill
    constructor: (@gridData) ->
        @width = @gridData[0].length
        @height = @gridData.length

    parseGridData: ->
        data = []
        for row, y in @gridData
            for cell, x in row
                index = y * @width + x
                node =
                    open: true
                    visited: false
                    elevation: cell
                    index: 0
                    x: x
                    y: y
                data[index] = node
        data

    beginFill: (x, y, elevation) ->
        @startPosition = [x, y]
        @reset()
        @closeNode x, y, elevation
        @addNeighbors x, y, elevation
        while @open.length
            @nextStep elevation

    nextStep: (elevation) ->
        [x, y] = @iToC @open.shift()
        @closeNode x, y, elevation
        @addNeighbors x, y, elevation

    addNeighbors: (x, y, targetElevation) ->
        {index, elevation} = @data[@cToI x, y]
        @addOpen utils.clamp(x + 1, @width), y, index, elevation, targetElevation
        @addOpen utils.clamp(x - 1, @width), y, index, elevation, targetElevation
        @addOpen x, utils.clamp(y + 1, @height), index, elevation, targetElevation
        @addOpen x, utils.clamp(y - 1, @height), index, elevation, targetElevation
        @addOpen utils.clamp(x - 1, @width), utils.clamp(y - 1, @height), index, elevation, targetElevation
        @addOpen utils.clamp(x - 1, @width), utils.clamp(y + 1, @height), index, elevation, targetElevation
        @addOpen utils.clamp(x + 1, @width), utils.clamp(y - 1,...