const canvas = document.querySelector('canvas')
const c = canvas.getContext('2d')

canvas.width = 2048
canvas.height = 1152

const tileSize = 2

function Vector(){
return {x: 0, y: 0}
}

function CreateTile(tile){
const randomNumber = Math.random()
const lineStart = new Vector()
const lineEnd = new Vector()

if (randomNumber > 0.75) {
    lineStart.x = tile.x
    lineStart.y = tile.y + tileSize
    lineEnd.x = tile.x + tileSize
    lineEnd.y = tile.y
} else if ( randomNumber > 0.5 && randomNumber < 0.75){
    lineStart.x = tile.x
    lineStart.y = tile.y
    lineEnd.x = tile.x + tileSize
    lineEnd.y = tile.y + tileSize
} else if ( randomNumber > 0.25 && randomNumber < 0.5){
    lineStart.x = tile.x
    lineStart.y = tile.y
    lineEnd.x = tile.x
    lineEnd.y = tile.y + tileSize
} else {
    lineStart.x = tile.x
    lineStart.y = tile.y
    lineEnd.x = tile.x + tileSize
    lineEnd.y = tile.y
}
//drawLine (lineStart.x, lineStart.y, lineEnd.x, lineEnd.y)
c.beginPath(); 
c.moveTo(lineStart.x,lineStart.y);
  c.lineTo(lineEnd.x,lineEnd.y);
  c.stroke();

}

function CreateArt(){
	for (let i = 0; i < canvas.width; i += tileSize) {
		for (let j = 0; j < canvas.height; j += tileSize){
			const tile = new Vector()
			tile.x = i
			tile.y = j
			CreateTile(tile)
		}
	}
}

CreateArt()