var canvasSize = 800;
var drawLength = 600;
var padding = 100;

function setup()
{
    let canvas = createCanvas(canvasSize, canvasSize).elt;
    document.getElementById('here').appendChild(canvas);
    windowResized()
}

var colors = [
    // '#000000',
	// '#0000AA',
	// '#00AA00',
	// '#00AAAA',
	// '#AA0000',
	// '#AA00AA',
	// '#FFAA00',
	// '#AAAAAA',
	// '#555555',
	'#5555FF',
	'#55FF55',
	'#55FFFF',
	'#FF5555',
	'#FF55FF',
	'#FFFF55',
	// '#FFFFFF'
]

var points = []
var colorMap = []
var colorGrid = null

function draw()
{
    clear();

    let scale = canvasSize / Math.max(paramInputs[0].value, paramInputs[1].value)
    
    for(let i = 0; i < paramInputs[0].value; i++)
    {
        line(i * scale, 0, i * scale, scale * paramInputs[1].value);
    }

    for(let i = 0; i < paramInputs[1].value; i++)
    {
        line(0, i * scale, paramInputs[0].value * scale, i * scale);
    }
    
    if(colorGrid != null)
    {
        for(let i = 0; i < paramInputs[0].value; i++)
        {
            for(let j = 0; j < paramInputs[1].value; j++)
            {
                fill(colorGrid[j][i])
                square(i * scale, j * scale, scale)
            }
        }
    }
                
    points.forEach((x) => {
        circle(scale * x[0], scale * x[1], 5)
    })
}

function windowResized()
{
    let c = windowWidth >= 992 ? 9 / 12 : 1
    let p = 50
    canvasSize = windowWidth * c - p
    resizeCanvas(canvasSize, canvasSize)
}

function poisson(width, height, radius)
{
    let points = []
    let gridstep = radius / Math.sqrt(2)
    let cols = Math.ceil(width / gridstep)
    let rows = Math.ceil(height / gridstep)
    let grid = []
    for(let i = 0; i < rows; i++)
    {
        let line = []
        for(let j = 0; j < cols; j++)
        {
            line.push(-1)
            // points.push([j, i])
        }
        grid.push(line)
    }

    let samples = [[Math.random() * width, Math.random() * height]]
    points = [samples[0]]
    safe = 200
    while(samples.length && safe)
    {
        safe--
        let p = samples.pop()
        for(let i = 0; i < 20; i++)
        {
            let t = Math.random() * 2 * Math.PI
            let r = 1 + Math.random()
            let x = p[0] + radius * r * Math.cos(t);
            let y = p[1] + radius * r * Math.sin(t);
            let ok = true;
            if(x < 0) continue
            if(y < 0) continue
            if(x >= width) continue
            if(y >= height) continue
            points.forEach((o) => {
                if(Math.pow(o[0] - x, 2) + Math.pow(o[1] - y, 2) <= radius * radius) ok = false
            })
            if(!ok) continue;
            // grid[Math.floor(y)][Math.floor(x)] = points.length
            points.push([x, y])
            samples.push([x, y])
        }
    }

    return points //, grid, gridstep
}

// sqrt(min(points.map((a) => min(points.map((b) => (a == b ? 10000000 : Math.pow(a[0]-b[0], 2) + Math.pow(a[1]-b[1], 2)))))))

function random(width, height, radius)
{
    var points = []
    for(let i = 0; i < 100; i++)
    {
        points.push([Math.random() * width, Math.random() * height])
    }
    return points
}

function run()
{
    points = poisson(paramInputs[0].value, paramInputs[1].value, paramInputs[2].value)
    colorMap = points.map((x) => colors[Math.floor(Math.random() * colors.length)])
    colorGrid = []
    for(let i = 0; i < height; i++)
    {
        let line = []
        for(let j = 0; j < width; j++)
        {
            let clostest = 999999999, col
            points.forEach((x, pos) => {
                let d = Math.pow(x[0] - j - 0.5, 2) + Math.pow(x[1] - i - 0.5, 2)
                if(d < clostest)
                {
                    clostest = d
                    col = colorMap[pos]
                }
            })
            line.push(col)
            // points.push([j, i])
        }
        colorGrid.push(line)
    }
    draw()
}

run()