Actually remove controls, switch to a global "constants" array

This commit is contained in:
shoe 2025-03-21 21:49:58 +00:00
parent 158cb0627a
commit f3ae7860a5

View File

@ -1,42 +1,9 @@
/****************************************************************************
* GUI Setup *
****************************************************************************/
window.onload = function() {
var gui = new dat.GUI({
closed: false,
remembered: {
undefined: {
"0": {},
},
},
folders: {},
load: JSON,
width: 400,
autoPlace: false,
});
gui.add(controls, "step_time", 50, 1000).name("step time ms").step(50);
gui.add(controls, "fadeout", 0, 20).name("trail fadeout length (0 to disable)").step(1);
//gui.add(controls, "cell_size", 10, 100).name("cell size").step(1);
gui.addColor(controls, "color").name("guy color");
gui.add(controls, "restart_button").name("start again");
var customContainer = document.getElementById("controls-container");
customContainer.append(gui.domElement);
var constants = {
step_time: 200,
cell_size: 22,
color: "#FFB000",
};
var controls = new(function() {
this.step_time = 200;
this.fadeout = 10;
this.cell_size = 22;
this.color = "#FFB000";
this.restart_button = function() {
ctx.clearRect(0, 0, canvas.width, canvas.height)
init_walk();
}
})()
/****************************************************************************
* TODO: CATEOGORIZE THESE BULLSHITS *
@ -64,7 +31,7 @@ function init_walk() {
// Draw a grid of boxes on the canvas
setInterval(draw, 20);
// TODO: it would be cool to have this changable, but I may just ... not
setInterval(move_walker, controls.step_time);
setInterval(move_walker, constants.step_time);
}
// check if the trails array has a position.
@ -161,10 +128,10 @@ function draw() {
if (old_width !== canvas.width || old_height != canvas.height) {
var old_n_rows = n_rows;
var old_n_cols = n_cols;
n_rows = canvas.height.div(controls.cell_size);
n_cols = canvas.width.div(controls.cell_size);
offset_h = (canvas.width - (controls.cell_size * n_cols)).div(2);
offset_v = (canvas.height - (controls.cell_size * n_rows)).div(2);
n_rows = canvas.height.div(constants.cell_size);
n_cols = canvas.width.div(constants.cell_size);
offset_h = (canvas.width - (constants.cell_size * n_cols)).div(2);
offset_v = (canvas.height - (constants.cell_size * n_rows)).div(2);
offset = {h: offset_h, v: offset_v};
// TODO: for every walker and every trail, adjust their position to the new canvas size
// we wanna just mod it, probably. that way if you shrink it you don't
@ -190,10 +157,10 @@ function draw_grid_square(row, col, color) {
var margin = 2;
ctx.fillStyle = color;
var pos_h = offset.h + (controls.cell_size * col) + margin;
var pos_v = offset.v + (controls.cell_size * row) + margin;
var pos_h = offset.h + (constants.cell_size * col) + margin;
var pos_v = offset.v + (constants.cell_size * row) + margin;
ctx.fillRect(pos_h, pos_v, controls.cell_size - (2*margin), controls.cell_size - (2*margin));
ctx.fillRect(pos_h, pos_v, constants.cell_size - (2*margin), constants.cell_size - (2*margin));
}
/****************************************************************************
@ -207,13 +174,13 @@ canvas.width = window.innerWidth;
canvas.height = window.innerHeight;
// compute the initial rows and columns
var n_rows = canvas.height.div(controls.cell_size);
var n_cols = canvas.width.div(controls.cell_size);
var offset_h = (canvas.width - (controls.cell_size * n_cols)).div(2);
var offset_v = (canvas.height - (controls.cell_size * n_rows)).div(2);
var n_rows = canvas.height.div(constants.cell_size);
var n_cols = canvas.width.div(constants.cell_size);
var offset_h = (canvas.width - (constants.cell_size * n_cols)).div(2);
var offset_v = (canvas.height - (constants.cell_size * n_rows)).div(2);
var offset = {h: offset_h, v: offset_v};
// set start position of walker and start the random walk
var walker = {row: n_rows.div(2), col: n_cols.div(2), color: controls.color};
var walker = {row: n_rows.div(2), col: n_cols.div(2), color: constants.color};
trails = []
init_walk();