From ae4072735e6cd450ad7af6d6644b1731195e3482 Mon Sep 17 00:00:00 2001 From: Reed Date: Thu, 10 Dec 2015 13:38:55 -0800 Subject: [PATCH] first commit --- index.html | 39 +++++ selecting_neighbors.js | 33 ++++ sketch.js | 334 +++++++++++++++++++++++++++++++++++++++++ style.css | 56 +++++++ 4 files changed, 462 insertions(+) create mode 100644 index.html create mode 100644 selecting_neighbors.js create mode 100644 sketch.js create mode 100644 style.css diff --git a/index.html b/index.html new file mode 100644 index 0000000..a4c3b2a --- /dev/null +++ b/index.html @@ -0,0 +1,39 @@ + + + + + + + + + + + + +
+
+

Info

+

% Cells Alive :

+

% Cells Dead :

+

Generations :

+

What is even going on?

+
+
+

Neighborhood

+ + + + + + +
+
+
+

Click on grid to inverse cell state

+

N - New Rule

+

R - Restart Current Rule

+

S - Scramble Current Rule

+

Click cells to include in neighborhood

+
+ + \ No newline at end of file diff --git a/selecting_neighbors.js b/selecting_neighbors.js new file mode 100644 index 0000000..cbe6ebe --- /dev/null +++ b/selecting_neighbors.js @@ -0,0 +1,33 @@ +$(function() { + + $('#neighborhood').attr("data-neighbors", pad(baseConvert(HashString['n'], 63, 2), 25)); + var vals = $('#neighborhood').data('neighbors'); + $('#neighborhood td').each( function(index, element){ + if (vals[index] == 1) + $(this).addClass("selected"); + }); + + $('#neighborhood td').click(function() { + if(!$(this).hasClass("selected")) { + if($('#neighborhood td.selected').length == 9) { + alert('Max of 8 classes, this is for your own good trust me :)') + return; + } + $(this).addClass("selected"); + } + else + $(this).removeClass("selected"); + + var new_neighbor_string = ''; + $('#neighborhood td').each( function(index, element){ + if($(this).hasClass("selected")) + new_neighbor_string += '1' + else + new_neighbor_string += '0' + }); + + // Set the new hash and set the new neighboorhood in the sketch + $('#neighborhood').attr("data-neighbors", pad(baseConvert(new_neighbor_string, 63, 2), 25)); + set_new_neighborhood_and_rules(new_neighbor_string); + }); +}); \ No newline at end of file diff --git a/sketch.js b/sketch.js new file mode 100644 index 0000000..653861a --- /dev/null +++ b/sketch.js @@ -0,0 +1,334 @@ +var grid; +var cube_size = 15; +var states = 2; + +function setup() { + var myCanvas = createCanvas(window.innerWidth, window.innerHeight - 100); + myCanvas.parent('sketch'); + + grid = new Grid(); + noStroke(); + smooth(); +} + +function draw() { + grid.step(); + update_info(); + + if (mouseIsPressed) + turnCellOn(); +} + +// Grid Class +function Grid() { + this.size = cube_size; + this.x = Math.round(width/this.size); + this.y = Math.round(height/this.size); + this.grid = set2dArrayToZero(createArray(this.x, this.y)); + this.temp_grid = set2dArrayToZero(createArray(this.x, this.y)); + this.steps = 0; + this.cells_alive = 0; + + // Optionally turn on middle cell + this.grid[Math.round(this.x/2)][Math.round(this.y/2)] = 1; + + this.step = function() { + this.temp_grid = createArray(this.x, this.y); + this.cells_alive = 0; + // Loop through the 2d array and match the interger result of the neighbors to find the rule + // Since drawing takes a long time, don't redraw if the cell state doesn't change + for (x=0; x= 0 && x + a < this.x && y + b >= 0 && y + b < this.y) + result += this.grid[x+a][y+b]; + else + result += 0; + } + + current = this.grid[x][y]; + this.temp_grid[x][y] = ruleset.rule[parseInt(result, states)]; + + //Count alive cells + if (this.temp_grid[x][y] == 1) + this.cells_alive +=1; + + // Take care of the drawing here + if (current != this.temp_grid[x][y] || this.steps == 0) { + if (this.temp_grid[x][y] == 0 ) { + fill(58, 71, 80); + rect(x*this.size, y*this.size, this.size, this.size); + } + else { + fill(33, 133, 213); + rect(x*this.size, y*this.size, this.size, this.size); + } + } + + }//End 2d array looping + + this.grid = this.temp_grid; + this.steps++; + } +}; //End of class grid + +function RuleSet() { + this.rule = []; + + this.newRules = function() { + this.rule = []; + for (x=0; x 1) { + var args = Array.prototype.slice.call(arguments, 1); + while(i--) arr[length-1 - i] = createArray.apply(this, args); + } + + return arr; +} + +/* Not being used, but good reference +function sortNeighbors(a, b) { + if (a[1] < b[1]) + return -1; + if (a[1] == b[1]) + if (a[0] < b[0]) + return -1; + return 1; +} */ + +function mouseClicked() { + turnCellOn(); +} + +function mouseDragged() { + turnCellOn(); +} + +function mousePressed() { + turnCellOn(); +} + +function windowResized() { + resizeSketch(); +} + +function resizeSketch() { + resizeCanvas(window.innerWidth, window.innerHeight - 100); + grid = new Grid(); +} + +function turnCellOn() { + var x = Math.round(mouseX/cube_size); + var y = Math.round(mouseY/cube_size); + + if (x >= 0 && x < grid.x && y >= 0 && y < grid.y) + grid.grid[x][y] = 1 ^ grid.grid[x][y]; +} + +function keyPressed() { + // N for new ruleset + if (keyCode == 78) { + grid = new Grid(); + grid.grid[Math.round(grid.x/2)][Math.round(grid.y/2)] = 1; + ruleset.newRules(); + window.location.hash = 'n=' + HashString['n'] + '&r=' + baseConvert(ruleset.rule.join(''), 2, 63); + } + + // R for restart + if (keyCode == 82) { + fill(58, 71, 80); + rect(0, 0, width, height); + grid.grid = set2dArrayToZero(grid.grid) + } + + // S for scramble + if (keyCode == 83) { + grid.grid = set2dArrayRandom(grid.grid); + } +} + +Array.prototype.equals = function (array) { + if (!array) + return false; + + if (this.length != array.length) + return false; + + for (var i = 0, l=this.length; i < l; i++) { + if (this[i] instanceof Array && array[i] instanceof Array) { + if (!this[i].equals(array[i])) + return false; + } + else if (this[i] != array[i]) { + return false; + } + } + return true; +} + +function pad(n, width, z) { + z = z || '0'; + n = n + ''; + return n.length >= width ? n : new Array(width - n.length + 1).join(z) + n; +} + +function set_new_neighborhood_and_rules(binary_neighbors) { + neighborhood = new_neighborhood(binary_neighbors); + rule_size = Math.pow(states, neighborhood.length); + ruleset.newRules(); + var base63neighbors = baseConvert(binary_neighbors, 2, 63); + window.location.hash = 'n=' + base63neighbors + '&r=' + baseConvert(ruleset.rule.join(''), 2, 63); + HashString.n = base63neighbors; +} + +function new_neighborhood(binary_neighbors) { + var temp = []; + for (var x = 0; x src_symbol_table.length || to_base > dest_symbol_table.length) + { + console.warn("Can't convert", src, "to base", to_base, "greater than symbol table length. src-table:", src_symbol_table.length, "dest-table:", dest_symbol_table.length); + return false; + } + + // First convert to base 10 + var val = bigInt(0); + for (var i = 0; i < src.length; i ++) + { + val = val.multiply(from_base).add(src_symbol_table.indexOf(src.charAt(i))); + } + if (val.lesser(0)) + { + return 0; + } + + // Then covert to any base + var r = val.mod(to_base); + var res = dest_symbol_table.charAt(r); + var q = val.divide(to_base); + while(!q.equals(0)) + { + r = q.mod(to_base); + q = q.divide(to_base); + res = dest_symbol_table.charAt(r) + res; + } + + return res; +} + +// Set the hash if there is none, okay not to check for overwrite. +window.location.hash = 'n=' + HashString['n'] + '&r=' + baseConvert(ruleset.rule.join(''), 2, 63); \ No newline at end of file diff --git a/style.css b/style.css new file mode 100644 index 0000000..ddc7a24 --- /dev/null +++ b/style.css @@ -0,0 +1,56 @@ +body { + padding: 0; margin: 0; + background-color: rgb(48, 56, 65); +} + +td { + width: 10px; + height: 12px; + background-color: rgb(243, 243, 243); +} + +td:hover { + background-color: rgb(160, 160, 160); +} + +td.selected { + background-color: rgb(33, 133, 213); +} + +#info { + float: left; + margin-left: 33%; +} + +#neighborhood { + width: 73px ; + margin: auto; + float: left; + margin-left:6%; +} + +#controls { + float: left; + margin-left:7.5%; +} + +#info p{ + color: white; + margin: 0px; +} + +#neighborhood p{ + color: white; + margin: 0px; + padding-left: 2px; + margin-left: -11px; +} + +#controls p{ + color:white; + margin: 0px; +} + +#info a{ + color: rgb(33, 133, 213); +} \ No newline at end of file