74 lines
1.5 KiB
JavaScript
74 lines
1.5 KiB
JavaScript
|
import render from "./modules/langton-renderer-canvas2d";
|
||
|
|
import Ant from "./modules/Ant.js";
|
||
|
|
|
||
|
|
|
||
|
|
const options = {
|
||
|
|
antStateColors : ['red','yellow'],
|
||
|
|
tileStateColors : ['white','black'],
|
||
|
|
tileSize : 10
|
||
|
|
};
|
||
|
|
|
||
|
|
|
||
|
|
// For the view
|
||
|
|
|
||
|
|
const STEP_INTERVAL = 5;
|
||
|
|
const BTN_AUTOPLAY_ID = 'autoplay';
|
||
|
|
const BTN_NEXT_MOVE_ID = 'next-move';
|
||
|
|
const BTN_RESET_ID = 'reset';
|
||
|
|
const MOVE_VAL_ID = 'move-value';
|
||
|
|
const BTN_PLUS_100_ID = 'plus-100';
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
let autoplayInterval;
|
||
|
|
let auto=false;
|
||
|
|
let canvas = document.querySelector("canvas");
|
||
|
|
|
||
|
|
|
||
|
|
canvas.width = window.innerWidth ;
|
||
|
|
canvas.height = window.innerHeight;
|
||
|
|
|
||
|
|
let ant = new Ant(Math.floor(canvas.width / options.tileSize),Math.floor(canvas.height/options.tileSize));
|
||
|
|
|
||
|
|
function boucle() {
|
||
|
|
ant.moveForward();
|
||
|
|
updateView(ant,canvas,options)
|
||
|
|
if (auto === true){
|
||
|
|
setTimeout(boucle, STEP_INTERVAL);
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
document.getElementById(BTN_AUTOPLAY_ID).addEventListener('click', () => {
|
||
|
|
auto = !auto;
|
||
|
|
boucle();
|
||
|
|
});
|
||
|
|
|
||
|
|
|
||
|
|
document.getElementById(BTN_PLUS_100_ID).addEventListener('click', () => {
|
||
|
|
for (let i=0; i<100; i++){
|
||
|
|
ant.moveForward();
|
||
|
|
}
|
||
|
|
updateView(ant,canvas,options)
|
||
|
|
});
|
||
|
|
|
||
|
|
document.getElementById(BTN_NEXT_MOVE_ID).addEventListener('click', () => {
|
||
|
|
ant.moveForward();
|
||
|
|
updateView(ant,canvas,options)
|
||
|
|
})
|
||
|
|
|
||
|
|
document.getElementById(BTN_RESET_ID).addEventListener('click', () => {
|
||
|
|
ant.reset();
|
||
|
|
updateView(ant,canvas,options)
|
||
|
|
})
|
||
|
|
|
||
|
|
|
||
|
|
function updateView(ant,canvas,options)
|
||
|
|
{
|
||
|
|
document.getElementById(MOVE_VAL_ID).textContent = `${ant.move}`;
|
||
|
|
render(ant,canvas,options);
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
updateView(ant,canvas,options,1)
|