From f9da6ac81f35842ac08ec0cbbed75d115877aca2 Mon Sep 17 00:00:00 2001 From: M4YX0R Date: Sat, 11 Dec 2021 09:33:12 +0300 Subject: [PATCH 01/14] Organic looking random walls using noise start --- dist/index.html | 2 ++ src/Controllers/ControlPanel.js | 3 +++ src/Controllers/EnvironmentController.js | 20 ++++++++++++++++++++ src/Environments/WorldEnvironment.js | 6 +++--- 4 files changed, 28 insertions(+), 3 deletions(-) diff --git a/dist/index.html b/dist/index.html index 99fba39..d698074 100644 --- a/dist/index.html +++ b/dist/index.html @@ -35,6 +35,8 @@
+ +

diff --git a/src/Controllers/ControlPanel.js b/src/Controllers/ControlPanel.js index 5396a9e..fcbe8b3 100644 --- a/src/Controllers/ControlPanel.js +++ b/src/Controllers/ControlPanel.js @@ -327,6 +327,9 @@ class ControlPanel { env.auto_reset = false; $('#auto-reset').prop('checked', false);; }); + $('#random-walls').click( function() { + this.env_controller.randomizeWalls(); + }.bind(this)); $('#auto-reset').change(function() { env.auto_reset = this.checked; }); diff --git a/src/Controllers/EnvironmentController.js b/src/Controllers/EnvironmentController.js index 828fe08..2eeb27c 100644 --- a/src/Controllers/EnvironmentController.js +++ b/src/Controllers/EnvironmentController.js @@ -51,6 +51,26 @@ class EnvironmentController extends CanvasController{ this.scale = 1; } + /* + Iterate over grid from 0,0 to env.num_cols,env.num_rows and create random walls using perlin noise to create a more organic shape. + */ + randomizeWalls(thickness=1) { + var noise_scale = 0.05; + var noise_offset = 0.5; + var noise_threshold = 0.5; + var noise_multiplier = 0.5; + var noise_offset_x = this.env.num_cols/2; + var noise_offset_y = this.env.num_rows/2; + for (var r = 0; r < this.env.num_rows; r++) { + for (var c = 0; c < this.env.num_cols; c++) { + var noise = noise_multiplier * noise_offset + noise_scale * noise_offset * Math.sin(noise_scale * (c + noise_offset_x) + noise_scale * (r + noise_offset_y)); + if (noise > noise_threshold && noise < noise_threshold + thickness/10) { + this.dropCellType(c, r, CellStates.wall, true); + } + } + } + } + updateMouseLocation(offsetX, offsetY){ super.updateMouseLocation(offsetX, offsetY); diff --git a/src/Environments/WorldEnvironment.js b/src/Environments/WorldEnvironment.js index 1da6c73..039fcad 100644 --- a/src/Environments/WorldEnvironment.js +++ b/src/Environments/WorldEnvironment.js @@ -12,9 +12,9 @@ class WorldEnvironment extends Environment{ super(); this.renderer = new Renderer('env-canvas', 'env', cell_size); this.controller = new EnvironmentController(this, this.renderer.canvas); - var grid_rows = Math.ceil(this.renderer.height / cell_size); - var grid_cols = Math.ceil(this.renderer.width / cell_size); - this.grid_map = new GridMap(grid_cols, grid_rows, cell_size); + this.num_rows = Math.ceil(this.renderer.height / cell_size); + this.num_cols = Math.ceil(this.renderer.width / cell_size); + this.grid_map = new GridMap(num_cols, num_rows, cell_size); this.organisms = []; this.walls = []; this.total_mutability = 0; From efe93e258d469f71623faa4b77261c954d30223d Mon Sep 17 00:00:00 2001 From: M4YX0R Date: Sat, 11 Dec 2021 09:38:56 +0300 Subject: [PATCH 02/14] simple bug fix, this. --- src/Environments/WorldEnvironment.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/Environments/WorldEnvironment.js b/src/Environments/WorldEnvironment.js index 039fcad..a57293e 100644 --- a/src/Environments/WorldEnvironment.js +++ b/src/Environments/WorldEnvironment.js @@ -14,7 +14,7 @@ class WorldEnvironment extends Environment{ this.controller = new EnvironmentController(this, this.renderer.canvas); this.num_rows = Math.ceil(this.renderer.height / cell_size); this.num_cols = Math.ceil(this.renderer.width / cell_size); - this.grid_map = new GridMap(num_cols, num_rows, cell_size); + this.grid_map = new GridMap(this.num_cols, this.num_rows, cell_size); this.organisms = []; this.walls = []; this.total_mutability = 0; From 566a9feca45502a5dd76ef30089d361832222f41 Mon Sep 17 00:00:00 2001 From: M4YX0R Date: Sat, 11 Dec 2021 09:51:52 +0300 Subject: [PATCH 03/14] typo fix --- dist/index.html | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/dist/index.html b/dist/index.html index d698074..5585f26 100644 --- a/dist/index.html +++ b/dist/index.html @@ -35,7 +35,7 @@
- +
From 575207df8352b7f436d63a537d457e290d8a37a8 Mon Sep 17 00:00:00 2001 From: M4YX0R Date: Sat, 11 Dec 2021 09:55:34 +0300 Subject: [PATCH 04/14] Better look for random walls button --- dist/index.html | 1 + 1 file changed, 1 insertion(+) diff --git a/dist/index.html b/dist/index.html index 5585f26..62d700e 100644 --- a/dist/index.html +++ b/dist/index.html @@ -35,6 +35,7 @@
+

From 61a6bf9eea2f42f508036b5981b08d8b1fcc79b4 Mon Sep 17 00:00:00 2001 From: M4YX0R Date: Sat, 11 Dec 2021 09:57:40 +0300 Subject: [PATCH 05/14] Better look --- dist/css/style.css | 1 + 1 file changed, 1 insertion(+) diff --git a/dist/css/style.css b/dist/css/style.css index 3b15873..a0624dc 100644 --- a/dist/css/style.css +++ b/dist/css/style.css @@ -75,6 +75,7 @@ button { display: inline-block; font-size: 16px; min-width: 30px; + margin: 2px; } button:hover{ background-color: #81d2c7; From b24159539ef70696f56304cd935987cc0f4f9ce0 Mon Sep 17 00:00:00 2001 From: M4YX0R Date: Sat, 11 Dec 2021 09:59:12 +0300 Subject: [PATCH 06/14] Remove hr tag. --- dist/index.html | 1 - 1 file changed, 1 deletion(-) diff --git a/dist/index.html b/dist/index.html index 62d700e..5585f26 100644 --- a/dist/index.html +++ b/dist/index.html @@ -35,7 +35,6 @@
-

From 0b5209ad31baa2bdea13d00989d5e19f90dd683a Mon Sep 17 00:00:00 2001 From: M4YX0R Date: Sat, 11 Dec 2021 10:26:55 +0300 Subject: [PATCH 07/14] Better noise than stripes :D --- src/Controllers/EnvironmentController.js | 13 +++---- src/Utils/Perlin.js | 46 ++++++++++++++++++++++++ 2 files changed, 53 insertions(+), 6 deletions(-) create mode 100644 src/Utils/Perlin.js diff --git a/src/Controllers/EnvironmentController.js b/src/Controllers/EnvironmentController.js index 2eeb27c..c36571f 100644 --- a/src/Controllers/EnvironmentController.js +++ b/src/Controllers/EnvironmentController.js @@ -5,6 +5,7 @@ const CellStates = require("../Organism/Cell/CellStates"); const Neighbors = require("../Grid/Neighbors"); const FossilRecord = require("../Stats/FossilRecord"); const Hyperparams = require("../Hyperparameters"); +const Perlin = require("../Utils/Perlin"); class EnvironmentController extends CanvasController{ constructor(env, canvas) { @@ -55,20 +56,20 @@ class EnvironmentController extends CanvasController{ Iterate over grid from 0,0 to env.num_cols,env.num_rows and create random walls using perlin noise to create a more organic shape. */ randomizeWalls(thickness=1) { - var noise_scale = 0.05; - var noise_offset = 0.5; var noise_threshold = 0.5; - var noise_multiplier = 0.5; - var noise_offset_x = this.env.num_cols/2; - var noise_offset_y = this.env.num_rows/2; + var avg_noise = 0; + for (var r = 0; r < this.env.num_rows; r++) { for (var c = 0; c < this.env.num_cols; c++) { - var noise = noise_multiplier * noise_offset + noise_scale * noise_offset * Math.sin(noise_scale * (c + noise_offset_x) + noise_scale * (r + noise_offset_y)); + var noise = Perlin.get(c, r); + avg_noise += noise/(this.env.num_rows*this.env.num_cols); if (noise > noise_threshold && noise < noise_threshold + thickness/10) { this.dropCellType(c, r, CellStates.wall, true); } } } + + console.log("Average noise: " + avg_noise); } updateMouseLocation(offsetX, offsetY){ diff --git a/src/Utils/Perlin.js b/src/Utils/Perlin.js new file mode 100644 index 0000000..ab9b5ca --- /dev/null +++ b/src/Utils/Perlin.js @@ -0,0 +1,46 @@ +let perlin = { + rand_vect: function(){ + let theta = Math.random() * 2 * Math.PI; + return {x: Math.cos(theta), y: Math.sin(theta)}; + }, + dot_prod_grid: function(x, y, vx, vy){ + let g_vect; + let d_vect = {x: x - vx, y: y - vy}; + if (this.gradients[[vx,vy]]){ + g_vect = this.gradients[[vx,vy]]; + } else { + g_vect = this.rand_vect(); + this.gradients[[vx, vy]] = g_vect; + } + return d_vect.x * g_vect.x + d_vect.y * g_vect.y; + }, + smootherstep: function(x){ + return 6*x**5 - 15*x**4 + 10*x**3; + }, + interp: function(x, a, b){ + return a + this.smootherstep(x) * (b-a); + }, + seed: function(){ + this.gradients = {}; + this.memory = {}; + }, + get: function(x, y) { + if (this.memory.hasOwnProperty([x,y])) + return this.memory[[x,y]]; + let xf = Math.floor(x); + let yf = Math.floor(y); + //interpolate + let tl = this.dot_prod_grid(x, y, xf, yf); + let tr = this.dot_prod_grid(x, y, xf+1, yf); + let bl = this.dot_prod_grid(x, y, xf, yf+1); + let br = this.dot_prod_grid(x, y, xf+1, yf+1); + let xt = this.interp(x-xf, tl, tr); + let xb = this.interp(x-xf, bl, br); + let v = this.interp(y-yf, xt, xb); + this.memory[[x,y]] = v; + return v; + } +} +perlin.seed(); + +module.exports = perlin; \ No newline at end of file From 75d5b85953cdddfb8bf8c2e3433a4b9c058bed6a Mon Sep 17 00:00:00 2001 From: M4YX0R Date: Sat, 11 Dec 2021 10:38:27 +0300 Subject: [PATCH 08/14] Better noise and tweaks --- src/Controllers/EnvironmentController.js | 8 +++++--- 1 file changed, 5 insertions(+), 3 deletions(-) diff --git a/src/Controllers/EnvironmentController.js b/src/Controllers/EnvironmentController.js index c36571f..d1ef2f8 100644 --- a/src/Controllers/EnvironmentController.js +++ b/src/Controllers/EnvironmentController.js @@ -56,14 +56,16 @@ class EnvironmentController extends CanvasController{ Iterate over grid from 0,0 to env.num_cols,env.num_rows and create random walls using perlin noise to create a more organic shape. */ randomizeWalls(thickness=1) { - var noise_threshold = 0.5; + this.env.clearWalls(); + var noise_threshold = -0.27399911269163185; var avg_noise = 0; + Perlin.seed(); for (var r = 0; r < this.env.num_rows; r++) { for (var c = 0; c < this.env.num_cols; c++) { - var noise = Perlin.get(c, r); + var noise = Perlin.get(c/this.env.num_cols, r/this.env.num_rows); avg_noise += noise/(this.env.num_rows*this.env.num_cols); - if (noise > noise_threshold && noise < noise_threshold + thickness/10) { + if (noise > noise_threshold && noise < noise_threshold + thickness/100) { this.dropCellType(c, r, CellStates.wall, true); } } From 8fcf5f2251f49a0dce591f4c41a77a0b0c9fdf17 Mon Sep 17 00:00:00 2001 From: M4YX0R Date: Sat, 11 Dec 2021 11:04:32 +0300 Subject: [PATCH 09/14] Better walls! Really better! --- src/Controllers/EnvironmentController.js | 12 ++++++++---- 1 file changed, 8 insertions(+), 4 deletions(-) diff --git a/src/Controllers/EnvironmentController.js b/src/Controllers/EnvironmentController.js index d1ef2f8..bb19cc9 100644 --- a/src/Controllers/EnvironmentController.js +++ b/src/Controllers/EnvironmentController.js @@ -57,16 +57,20 @@ class EnvironmentController extends CanvasController{ */ randomizeWalls(thickness=1) { this.env.clearWalls(); - var noise_threshold = -0.27399911269163185; + var noise_threshold = -0.017; var avg_noise = 0; Perlin.seed(); for (var r = 0; r < this.env.num_rows; r++) { for (var c = 0; c < this.env.num_cols; c++) { - var noise = Perlin.get(c/this.env.num_cols, r/this.env.num_rows); + var noise = Perlin.get(c/this.env.num_cols*(20/this.env.renderer.cell_size), r/this.env.num_rows*(20/this.env.renderer.cell_size)); avg_noise += noise/(this.env.num_rows*this.env.num_cols); - if (noise > noise_threshold && noise < noise_threshold + thickness/100) { - this.dropCellType(c, r, CellStates.wall, true); + if (noise > noise_threshold && noise < noise_threshold + thickness/(4*this.env.renderer.cell_size)) { + var cell = this.env.grid_map.cellAt(c, r); + if (cell != null) { + if(cell.owner != null) cell.owner.die(); + this.env.changeCell(c, r, CellStates.wall, null); + } } } } From 95cf6b90b428db3b8460a93d155d7cb8f5e9b60a Mon Sep 17 00:00:00 2001 From: M4YX0R Date: Sat, 11 Dec 2021 11:06:21 +0300 Subject: [PATCH 10/14] Cell size based resize fix --- src/Environments/WorldEnvironment.js | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/src/Environments/WorldEnvironment.js b/src/Environments/WorldEnvironment.js index a57293e..3db4c31 100644 --- a/src/Environments/WorldEnvironment.js +++ b/src/Environments/WorldEnvironment.js @@ -154,9 +154,9 @@ class WorldEnvironment extends Environment{ resizeFillWindow(cell_size) { this.renderer.cell_size = cell_size; this.renderer.fillWindow('env'); - var cols = Math.ceil(this.renderer.width / cell_size); - var rows = Math.ceil(this.renderer.height / cell_size); - this.grid_map.resize(cols, rows, cell_size); + this.num_cols = Math.ceil(this.renderer.width / cell_size); + this.num_rows = Math.ceil(this.renderer.height / cell_size); + this.grid_map.resize(this.num_cols, this.num_rows, cell_size); } } From 224ab1728c12bbf605f76b413666009d7df3ab68 Mon Sep 17 00:00:00 2001 From: M4YX0R Date: Sat, 11 Dec 2021 11:29:56 +0300 Subject: [PATCH 11/14] Wall gen screen w/h ratio and clearWalls null fix --- src/Controllers/EnvironmentController.js | 7 +++++-- src/Environments/WorldEnvironment.js | 3 ++- 2 files changed, 7 insertions(+), 3 deletions(-) diff --git a/src/Controllers/EnvironmentController.js b/src/Controllers/EnvironmentController.js index bb19cc9..7f96b00 100644 --- a/src/Controllers/EnvironmentController.js +++ b/src/Controllers/EnvironmentController.js @@ -59,13 +59,16 @@ class EnvironmentController extends CanvasController{ this.env.clearWalls(); var noise_threshold = -0.017; var avg_noise = 0; + var resolution = 20; Perlin.seed(); for (var r = 0; r < this.env.num_rows; r++) { for (var c = 0; c < this.env.num_cols; c++) { - var noise = Perlin.get(c/this.env.num_cols*(20/this.env.renderer.cell_size), r/this.env.num_rows*(20/this.env.renderer.cell_size)); + var xval = c/this.env.num_cols*(resolution/this.env.renderer.cell_size*(this.env.num_cols/this.env.num_rows)); + var yval = r/this.env.num_rows*(resolution/this.env.renderer.cell_size*(this.env.num_rows/this.env.num_cols)); + var noise = Perlin.get(xval, yval); avg_noise += noise/(this.env.num_rows*this.env.num_cols); - if (noise > noise_threshold && noise < noise_threshold + thickness/(4*this.env.renderer.cell_size)) { + if (noise > noise_threshold && noise < noise_threshold + thickness/100*this.env.renderer.cell_size) { var cell = this.env.grid_map.cellAt(c, r); if (cell != null) { if(cell.owner != null) cell.owner.die(); diff --git a/src/Environments/WorldEnvironment.js b/src/Environments/WorldEnvironment.js index 3db4c31..791fc66 100644 --- a/src/Environments/WorldEnvironment.js +++ b/src/Environments/WorldEnvironment.js @@ -104,7 +104,8 @@ class WorldEnvironment extends Environment{ clearWalls() { for(var wall of this.walls){ - if (this.grid_map.cellAt(wall.col, wall.row).state == CellStates.wall) + var wcell = this.grid_map.cellAt(wall.col, wall.row); + if (wcell && wcell.state == CellStates.wall) this.changeCell(wall.col, wall.row, CellStates.empty, null); } } From 6d58a83a5e9bd5f9c4de179c83c4f1f31ad4faf3 Mon Sep 17 00:00:00 2001 From: M4YX0R Date: Sat, 11 Dec 2021 12:34:38 +0300 Subject: [PATCH 12/14] Noise theresold tweak for different cell sizes --- src/Controllers/EnvironmentController.js | 4 +--- 1 file changed, 1 insertion(+), 3 deletions(-) diff --git a/src/Controllers/EnvironmentController.js b/src/Controllers/EnvironmentController.js index 7f96b00..8a75175 100644 --- a/src/Controllers/EnvironmentController.js +++ b/src/Controllers/EnvironmentController.js @@ -68,7 +68,7 @@ class EnvironmentController extends CanvasController{ var yval = r/this.env.num_rows*(resolution/this.env.renderer.cell_size*(this.env.num_rows/this.env.num_cols)); var noise = Perlin.get(xval, yval); avg_noise += noise/(this.env.num_rows*this.env.num_cols); - if (noise > noise_threshold && noise < noise_threshold + thickness/100*this.env.renderer.cell_size) { + if (noise > noise_threshold && noise < noise_threshold + thickness/resolution*(5/this.env.renderer.cell_size)) { var cell = this.env.grid_map.cellAt(c, r); if (cell != null) { if(cell.owner != null) cell.owner.die(); @@ -77,8 +77,6 @@ class EnvironmentController extends CanvasController{ } } } - - console.log("Average noise: " + avg_noise); } updateMouseLocation(offsetX, offsetY){ From 957385d9bf500d3d75513aaf0e3ddc768b7ccefc Mon Sep 17 00:00:00 2001 From: M4YX0R Date: Sat, 11 Dec 2021 12:42:09 +0300 Subject: [PATCH 13/14] Wall thickness tweak for different cell_size vals --- src/Controllers/EnvironmentController.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/Controllers/EnvironmentController.js b/src/Controllers/EnvironmentController.js index 8a75175..db47cfc 100644 --- a/src/Controllers/EnvironmentController.js +++ b/src/Controllers/EnvironmentController.js @@ -68,7 +68,7 @@ class EnvironmentController extends CanvasController{ var yval = r/this.env.num_rows*(resolution/this.env.renderer.cell_size*(this.env.num_rows/this.env.num_cols)); var noise = Perlin.get(xval, yval); avg_noise += noise/(this.env.num_rows*this.env.num_cols); - if (noise > noise_threshold && noise < noise_threshold + thickness/resolution*(5/this.env.renderer.cell_size)) { + if (noise > noise_threshold && noise < noise_threshold + thickness/resolution) { var cell = this.env.grid_map.cellAt(c, r); if (cell != null) { if(cell.owner != null) cell.owner.die(); From 002d04958dbeade201a12b8a997262d2e5634c8b Mon Sep 17 00:00:00 2001 From: MaxRobinsonTheGreat Date: Fri, 17 Dec 2021 19:01:06 -0600 Subject: [PATCH 14/14] var -> let --- src/Controllers/EnvironmentController.js | 19 +++++++++---------- src/Environments/WorldEnvironment.js | 2 +- 2 files changed, 10 insertions(+), 11 deletions(-) diff --git a/src/Controllers/EnvironmentController.js b/src/Controllers/EnvironmentController.js index db47cfc..75b903d 100644 --- a/src/Controllers/EnvironmentController.js +++ b/src/Controllers/EnvironmentController.js @@ -57,19 +57,19 @@ class EnvironmentController extends CanvasController{ */ randomizeWalls(thickness=1) { this.env.clearWalls(); - var noise_threshold = -0.017; - var avg_noise = 0; - var resolution = 20; + const noise_threshold = -0.017; + let avg_noise = 0; + let resolution = 20; Perlin.seed(); - for (var r = 0; r < this.env.num_rows; r++) { - for (var c = 0; c < this.env.num_cols; c++) { - var xval = c/this.env.num_cols*(resolution/this.env.renderer.cell_size*(this.env.num_cols/this.env.num_rows)); - var yval = r/this.env.num_rows*(resolution/this.env.renderer.cell_size*(this.env.num_rows/this.env.num_cols)); - var noise = Perlin.get(xval, yval); + for (let r = 0; r < this.env.num_rows; r++) { + for (let c = 0; c < this.env.num_cols; c++) { + let xval = c/this.env.num_cols*(resolution/this.env.renderer.cell_size*(this.env.num_cols/this.env.num_rows)); + let yval = r/this.env.num_rows*(resolution/this.env.renderer.cell_size*(this.env.num_rows/this.env.num_cols)); + let noise = Perlin.get(xval, yval); avg_noise += noise/(this.env.num_rows*this.env.num_cols); if (noise > noise_threshold && noise < noise_threshold + thickness/resolution) { - var cell = this.env.grid_map.cellAt(c, r); + let cell = this.env.grid_map.cellAt(c, r); if (cell != null) { if(cell.owner != null) cell.owner.die(); this.env.changeCell(c, r, CellStates.wall, null); @@ -80,7 +80,6 @@ class EnvironmentController extends CanvasController{ } updateMouseLocation(offsetX, offsetY){ - super.updateMouseLocation(offsetX, offsetY); } diff --git a/src/Environments/WorldEnvironment.js b/src/Environments/WorldEnvironment.js index 791fc66..fdf48c3 100644 --- a/src/Environments/WorldEnvironment.js +++ b/src/Environments/WorldEnvironment.js @@ -104,7 +104,7 @@ class WorldEnvironment extends Environment{ clearWalls() { for(var wall of this.walls){ - var wcell = this.grid_map.cellAt(wall.col, wall.row); + let wcell = this.grid_map.cellAt(wall.col, wall.row); if (wcell && wcell.state == CellStates.wall) this.changeCell(wall.col, wall.row, CellStates.empty, null); }