37
Changelog.md
Normal file
37
Changelog.md
Normal file
@@ -0,0 +1,37 @@
|
||||
# Changelog
|
||||
|
||||
## 1.0.1 (12/4/2021)
|
||||
|
||||
### UI Enhancements:
|
||||
- Hotkeys/improved zoom controls: [#47](https://github.com/MaxRobinsonTheGreat/LifeEngine/pull/47)
|
||||
- `A` reset view
|
||||
- `S/middle mouse button` pan
|
||||
- `D` drop walls
|
||||
- `F` drop food
|
||||
- `G` click to kill
|
||||
- `H` headless rendering toggle
|
||||
- `Spacebar/J` pause/play toggle
|
||||
- `Z` select organism
|
||||
- `X` edit organism
|
||||
- `C` drop organism
|
||||
- `V` toggle hud
|
||||
- `B` destroy all walls
|
||||
- `Q` min/max control panel
|
||||
- Improved mutation probability controls: [#43](https://github.com/MaxRobinsonTheGreat/LifeEngine/pull/43)
|
||||
- Ability to edit individual organism's mutability: [#46](https://github.com/MaxRobinsonTheGreat/LifeEngine/pull/46)
|
||||
- Added clear button and improved reset warnings: [#64](https://github.com/MaxRobinsonTheGreat/LifeEngine/pull/64)
|
||||
- Control Panel is minimized by default: [#64](https://github.com/MaxRobinsonTheGreat/LifeEngine/pull/64)
|
||||
|
||||
### Simulation Enhancements:
|
||||
- Default food prodcution probability increased from 4->5
|
||||
|
||||
### Bug Fixes:
|
||||
- Fixed actual FPS display: [#45](https://github.com/MaxRobinsonTheGreat/LifeEngine/pull/45)
|
||||
- Fixed slow down/crash on very long runs: [#63](https://github.com/MaxRobinsonTheGreat/LifeEngine/pull/63)
|
||||
- Spelling Fix: [#31](https://github.com/MaxRobinsonTheGreat/LifeEngine/pull/31)
|
||||
|
||||
|
||||
Thanks to contributors: @TrevorSayre @EvaisaGiac @Chrispykins
|
||||
|
||||
## 1.0.0
|
||||
Initial release.
|
||||
12
dist/css/style.css
vendored
12
dist/css/style.css
vendored
@@ -37,7 +37,7 @@ body{
|
||||
bottom: 0;
|
||||
position: fixed;
|
||||
background-color: #3a4b68;
|
||||
display: grid;
|
||||
display: none;
|
||||
grid-template-columns: repeat(3, 1fr);
|
||||
/* opacity: 0.8; */
|
||||
}
|
||||
@@ -79,6 +79,9 @@ button {
|
||||
button:hover{
|
||||
background-color: #81d2c7;
|
||||
}
|
||||
button:active{
|
||||
background-color: #595e77;
|
||||
}
|
||||
|
||||
.icon-links {
|
||||
font-size: 35px;
|
||||
@@ -163,10 +166,7 @@ button:hover{
|
||||
height: 30px;
|
||||
margin-top: 5px;
|
||||
}
|
||||
.edit-mode-btn:hover{
|
||||
background-color: #81d2c7;
|
||||
}
|
||||
.edit-mode-btn#drag-view {
|
||||
.edit-mode-btn.selected {
|
||||
background-color: #81d2c7;
|
||||
}
|
||||
#clear-walls {
|
||||
@@ -236,7 +236,7 @@ button:hover{
|
||||
position: fixed;
|
||||
bottom: 10px;
|
||||
padding-left: 10px;
|
||||
display: none;
|
||||
/* display: none; */
|
||||
}
|
||||
|
||||
#headless-notification {
|
||||
|
||||
58
dist/index.html
vendored
58
dist/index.html
vendored
@@ -19,25 +19,26 @@
|
||||
<div class='control-panel'>
|
||||
<div id='speed-controller' class='control-set'>
|
||||
<div class='vertical-buttons'>
|
||||
<button class="reset-view" title="Reset View"><i class="fa fa-video-camera"></i></button>
|
||||
<button class="edit-mode-btn" id="drag-view" title="Drag View"><i class="fa fa-arrows"></i></button>
|
||||
<button class="edit-mode-btn" id="wall-drop" title="Drop/Remove Wall"><i class="fa fa-square"></i></button>
|
||||
<button class="edit-mode-btn" id="food-drop" title="Drop/Remove Food"><i class="fa fa-cutlery"></i></button>
|
||||
<button class="edit-mode-btn" id="click-kill" title="Click to kill"><i class="fa fa-bolt"></i></button>
|
||||
<button id="clear-walls" title="Clear All Walls"><i class="fa fa-window-close"></i></button>
|
||||
<button class="reset-view" title="Reset View. Hotkey: A"><i class="fa fa-video-camera"></i></button>
|
||||
<button class="edit-mode-btn drag-view" id="drag-view" title="Drag View. Hotkey: S"><i class="fa fa-arrows"></i></button>
|
||||
<button class="edit-mode-btn wall-drop" id="wall-drop" title="Drop/Remove Wall. Hotkey: D"><i class="fa fa-square"></i></button>
|
||||
<button class="edit-mode-btn food-drop selected" id="food-drop" title="Drop/Remove Food. Hotkey: F"><i class="fa fa-cutlery"></i></button>
|
||||
<button class="edit-mode-btn click-kill" id="click-kill" title="Click to kill. Hotkey: G"><i class="fa fa-bolt"></i></button>
|
||||
<button id="clear-walls" title="Clear All Walls. Hotkey: B"><i class="fa fa-window-close"></i></button>
|
||||
</div>
|
||||
<h2>Simulation Speed</h2>
|
||||
<input id="slider" type="range" min="1" max="300" value="60">
|
||||
<button class='pause-button'><i class="fa fa-pause"></i></button>
|
||||
<button class="headless" title="Toggle rendering"><i class="fa fa-eye-slash"></i></button>
|
||||
<button class='pause-button' title="Play/Pause. Hotkey: Spacebar"><i class="fa fa-pause"></i></button>
|
||||
<button class="headless" title="Toggle rendering. Hotkey: H"><i class="fa fa-eye-slash"></i></button>
|
||||
<p id='fps'>Target FPS: 60</p>
|
||||
<p id='fps-actual'></p>
|
||||
<button id='reset-env'>Reset Environment</button>
|
||||
<label for="auto-reset">Auto Reset</label>
|
||||
<button id='reset-env' title='Restarts simulation with default organism.'>Reset</button>
|
||||
<button id='clear-env' title="Removes all organisms and walls. Will disable 'reset on extinction'"">Clear</button>
|
||||
<br>
|
||||
<label for="auto-reset">Reset on total extinction</label>
|
||||
<input type="checkbox" id="auto-reset" checked>
|
||||
<br>
|
||||
<p id='reset-count'>Auto reset count: </p>
|
||||
<br>
|
||||
<h3>Grid Size</h3>
|
||||
<label for="cell-size">Cell Size:</label>
|
||||
<input type="number" id="cell-size" min="1" max="100" value=5 step="1">
|
||||
@@ -46,7 +47,6 @@
|
||||
<div class='col-row-input'>
|
||||
<label for="col-input">Columns:</label>
|
||||
<input type="number" id="col-input" min="1" value=100 step="1">
|
||||
<br>
|
||||
<label for="row-input">Rows:</label>
|
||||
<input type="number" id="row-input" min="1" value=100 step="1">
|
||||
</div>
|
||||
@@ -62,7 +62,7 @@
|
||||
<p class='tabnav-item' id='hyperparameters'>Simulation Controls</p>
|
||||
<p class='tabnav-item' id='stats'>Stats</p>
|
||||
<p class='tabnav-item' id='challenges'>Challenges</p>
|
||||
<button id="minimize" title="Minimze Control Panel"><i class="fa fa-minus-square"></i></button>
|
||||
<button id="minimize" title="Minimze Control Panel."><i class="fa fa-minus-square"></i></button>
|
||||
</div>
|
||||
|
||||
<div id='about' class='tab'>
|
||||
@@ -78,7 +78,7 @@
|
||||
<div class='cell-legend-type' id='mouth' title="Mouth: Eats adjacent food."></div>
|
||||
<div class='cell-legend-type' id='producer' title="Producer: Produces adjacent food."></div>
|
||||
<div class='cell-legend-type' id='mover' title="Mover: Allows for movement and rotation."></div>
|
||||
<div class='cell-legend-type' id='killer' title="Killer: Harms oranisms in adjacent cells."></div>
|
||||
<div class='cell-legend-type' id='killer' title="Killer: Harms organisms in adjacent cells."></div>
|
||||
<div class='cell-legend-type' id='armor' title="Armor: Negates affects of killer cell."></div>
|
||||
<div class='cell-legend-type' id='eye' title="Eye: Observes cells and decides movement."></div>
|
||||
<div class='cell-legend-type' id='food' title="Food: Not part of an organism. Once an organism has eaten enough food, it will reproduce."></div>
|
||||
@@ -98,9 +98,9 @@
|
||||
<div id='editor' class='tab'>
|
||||
<div class='left-half' id='editor-panel'>
|
||||
<div class='editor-buttons'>
|
||||
<button class="edit-mode-btn" id="select" title="Select organism from world"><i class="fa fa-hand-pointer-o"></i></button>
|
||||
<button class="edit-mode-btn" id="edit" title="Edit organism"><i class="fa fa-pencil"></i></button>
|
||||
<button class="edit-mode-btn" id="drop-org" title="Drop organism in world"><i class="fa fa-plus"></i></button>
|
||||
<button class="edit-mode-btn select" id="select" title="Select organism from world. Hotkey: Z"><i class="fa fa-hand-pointer-o"></i></button>
|
||||
<button class="edit-mode-btn edit" id="edit" title="Edit organism. Hotkey: X"><i class="fa fa-pencil"></i></button>
|
||||
<button class="edit-mode-btn drop-org" id="drop-org" title="Drop organism in world. Hotkey: C"><i class="fa fa-plus"></i></button>
|
||||
</div>
|
||||
<div id='editor-env'>
|
||||
<canvas id='editor-canvas'></canvas>
|
||||
@@ -112,7 +112,7 @@
|
||||
<div class='cell-type' id='mover' title="Mover: Allows for movement and rotation."></div>
|
||||
</div>
|
||||
<div style='grid-column: 2;'>
|
||||
<div class='cell-type' id='killer' title="Killer: Harms oranisms in adjacent cells."></div>
|
||||
<div class='cell-type' id='killer' title="Killer: Harms organisms in adjacent cells."></div>
|
||||
<div class='cell-type' id='armor' title="Armor: Negates affects of killer cell."></div>
|
||||
<div class='cell-type' id='eye' title="Eye: Looks for cells to move away from or towards. Click again on a placed cell to rotate"></div>
|
||||
</div>
|
||||
@@ -143,6 +143,10 @@
|
||||
<label for="move-range-edit" title='The number of cells to move before randomly changing direction. Overriden by brain decisions.'>Move Range:</label>
|
||||
<input type="number" id="move-range-edit" min="1" max="100" value=3 step="1">
|
||||
</div>
|
||||
<div id='mutation-rate-cont'>
|
||||
<label for="mutation-rate-edit" title='Probability that offspring of this organism will mutate'>Mutation Rate:</label>
|
||||
<input type="number" id="mutation-rate-edit" min="1" max="100" value=3 step="1">
|
||||
</div>
|
||||
<br>
|
||||
<div class='brain-details'>
|
||||
<h4>Brain</h4>
|
||||
@@ -261,20 +265,20 @@
|
||||
</div>
|
||||
</div>
|
||||
<div class='hot-controls'>
|
||||
<button class="reset-view" title="Reset View"><i class="fa fa-video-camera"></i></button>
|
||||
<button class="edit-mode-btn" id="drag-view" title="Drag View"><i class="fa fa-arrows"></i></button>
|
||||
<button class="edit-mode-btn" id="wall-drop" title="Drop/Remove Wall"><i class="fa fa-square"></i></button>
|
||||
<button class="edit-mode-btn" id="food-drop" title="Drop/Remove Food"><i class="fa fa-cutlery"></i></button>
|
||||
<button class="edit-mode-btn" id="click-kill" title="Click to kill"><i class="fa fa-bolt"></i></button>
|
||||
<button class='pause-button'><i class="fa fa-pause"></i></button>
|
||||
<button class="headless" title="Toggle rendering"><i class="fa fa-eye-slash"></i></button>
|
||||
<button class="reset-view" title="Reset View. Hotkey: A"><i class="fa fa-video-camera"></i></button>
|
||||
<button class="edit-mode-btn drag-view" id="drag-view" title="Drag View. Hotkey: S"><i class="fa fa-arrows"></i></button>
|
||||
<button class="edit-mode-btn wall-drop" id="wall-drop" title="Drop/Remove Wall. Hotkey: D"><i class="fa fa-square"></i></button>
|
||||
<button class="edit-mode-btn food-drop selected" id="food-drop" title="Drop/Remove Food. Hotkey: F"><i class="fa fa-cutlery"></i></button>
|
||||
<button class="edit-mode-btn click-kill" id="click-kill" title="Click to kill. Hotkey: G"><i class="fa fa-bolt"></i></button>
|
||||
<button class="headless" title="Toggle rendering. Hotkey: H"><i class="fa fa-eye-slash"></i></button>
|
||||
<button class='pause-button' title="Play/Pause. Hotkey: Spacebar"><i class="fa fa-pause"></i></button>
|
||||
</div>
|
||||
<div id="headless-notification">
|
||||
<i class="fa fa-eye-slash" ></i>
|
||||
</div>
|
||||
<div id='maximize-hot-control' class='hot-controls'>
|
||||
<button id="maximize" title="Show Control Panel"><i class="fa fa-plus-square"></i></button>
|
||||
<button id="maximize" title="Show Control Panel."><i class="fa fa-plus-square"></i></button>
|
||||
</div>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
</html>
|
||||
|
||||
@@ -9,6 +9,7 @@ class CanvasController{
|
||||
this.mouse_c;
|
||||
this.mouse_r;
|
||||
this.left_click = false;
|
||||
this.middle_click = false;
|
||||
this.right_click = false;
|
||||
this.cur_cell = null;
|
||||
this.cur_org = null;
|
||||
@@ -30,16 +31,21 @@ class CanvasController{
|
||||
evt.preventDefault();
|
||||
this.updateMouseLocation(evt.offsetX, evt.offsetY)
|
||||
this.mouseUp();
|
||||
this.left_click=false;
|
||||
this.right_click=false;
|
||||
if (evt.button == 0)
|
||||
this.left_click = false;
|
||||
if (evt.button == 1)
|
||||
this.middle_click = false;
|
||||
if (evt.button == 2)
|
||||
this.right_click = false;
|
||||
}.bind(this));
|
||||
|
||||
this.canvas.addEventListener('mousedown', function(evt) {
|
||||
evt.preventDefault();
|
||||
this.updateMouseLocation(evt.offsetX, evt.offsetY)
|
||||
if (evt.button == 0) {
|
||||
if (evt.button == 0)
|
||||
this.left_click = true;
|
||||
}
|
||||
if (evt.button == 1)
|
||||
this.middle_click = true;
|
||||
if (evt.button == 2)
|
||||
this.right_click = true;
|
||||
this.mouseDown();
|
||||
@@ -50,11 +56,25 @@ class CanvasController{
|
||||
});
|
||||
|
||||
this.canvas.addEventListener('mouseleave', function(){
|
||||
this.right_click = false;
|
||||
this.left_click = false;
|
||||
this.left_click = false;
|
||||
this.middle_click = false;
|
||||
this.right_click = false;
|
||||
this.env.renderer.clearAllHighlights(true);
|
||||
}.bind(this));
|
||||
|
||||
this.canvas.addEventListener('mouseenter', function(evt) {
|
||||
|
||||
this.left_click = !!(evt.buttons & 1);
|
||||
this.right_click = !!(evt.buttons & 2);
|
||||
this.middle_click = !!(evt.buttons & 4);
|
||||
|
||||
this.updateMouseLocation(evt.offsetX, evt.offsetY);
|
||||
this.start_x = this.mouse_x;
|
||||
this.start_y = this.mouse_y;
|
||||
|
||||
|
||||
}.bind(this))
|
||||
|
||||
}
|
||||
|
||||
updateMouseLocation(offsetX, offsetY) {
|
||||
|
||||
@@ -6,6 +6,7 @@ class ControlPanel {
|
||||
constructor(engine) {
|
||||
this.engine = engine;
|
||||
this.defineMinMaxControls();
|
||||
this.defineHotkeys();
|
||||
this.defineEngineSpeedControls();
|
||||
this.defineGridSizeControls();
|
||||
this.defineTabNavigation();
|
||||
@@ -22,6 +23,7 @@ class ControlPanel {
|
||||
this.headless_opacity = 1;
|
||||
this.opacity_change_rate = -0.8;
|
||||
this.paused=false;
|
||||
this.setHyperparamDefaults();
|
||||
}
|
||||
|
||||
defineMinMaxControls(){
|
||||
@@ -41,38 +43,72 @@ class ControlPanel {
|
||||
this.stats_panel.startAutoRender();
|
||||
}
|
||||
});
|
||||
const V_KEY = 118;
|
||||
$('body').keypress( (e) => {
|
||||
if (e.which === V_KEY) {
|
||||
if (this.no_hud) {
|
||||
let control_panel_display = this.control_panel_active ? 'grid' : 'none';
|
||||
let hot_control_display = !this.control_panel_active ? 'block' : 'none';
|
||||
if (this.control_panel_active && this.tab_id == 'stats') {
|
||||
this.stats_panel.startAutoRender();
|
||||
};
|
||||
$('.control-panel').css('display', control_panel_display);
|
||||
$('.hot-controls').css('display', hot_control_display);
|
||||
}
|
||||
else {
|
||||
$('.control-panel').css('display', 'none');
|
||||
$('.hot-controls').css('display', 'none');
|
||||
}
|
||||
this.no_hud = !this.no_hud;
|
||||
}
|
||||
|
||||
defineHotkeys() {
|
||||
$('body').keydown( (e) => {
|
||||
switch (e.key.toLowerCase()) {
|
||||
// hot bar controls
|
||||
case 'a':
|
||||
$('.reset-view')[0].click();
|
||||
break;
|
||||
case 's':
|
||||
$('#drag-view').click();
|
||||
break;
|
||||
case 'd':
|
||||
$('#wall-drop').click();
|
||||
break;
|
||||
case 'f':
|
||||
$('#food-drop').click();
|
||||
break;
|
||||
case 'g':
|
||||
$('#click-kill').click();
|
||||
break;
|
||||
case 'h':
|
||||
$('.headless')[0].click();
|
||||
break;
|
||||
case 'j':
|
||||
case ' ':
|
||||
e.preventDefault();
|
||||
$('.pause-button')[0].click();
|
||||
break;
|
||||
// miscellaneous hotkeys
|
||||
case 'q': // minimize/maximize control panel
|
||||
e.preventDefault();
|
||||
if (this.control_panel_active)
|
||||
$('#minimize').click();
|
||||
else
|
||||
$('#maximize').click();
|
||||
break;
|
||||
case 'z':
|
||||
$('#select').click();
|
||||
break;
|
||||
case 'x':
|
||||
$('#edit').click();
|
||||
break;
|
||||
case 'c':
|
||||
$('#drop-org').click();
|
||||
break;
|
||||
case 'v': // toggle hud
|
||||
if (this.no_hud) {
|
||||
let control_panel_display = this.control_panel_active ? 'grid' : 'none';
|
||||
let hot_control_display = !this.control_panel_active ? 'block' : 'none';
|
||||
if (this.control_panel_active && this.tab_id == 'stats') {
|
||||
this.stats_panel.startAutoRender();
|
||||
};
|
||||
$('.control-panel').css('display', control_panel_display);
|
||||
$('.hot-controls').css('display', hot_control_display);
|
||||
}
|
||||
else {
|
||||
$('.control-panel').css('display', 'none');
|
||||
$('.hot-controls').css('display', 'none');
|
||||
}
|
||||
this.no_hud = !this.no_hud;
|
||||
break;
|
||||
case 'b':
|
||||
$('#clear-walls').click();
|
||||
}
|
||||
});
|
||||
// var self = this;
|
||||
// $('#minimize').click ( function() {
|
||||
// $('.control-panel').css('display', 'none');
|
||||
// $('.hot-controls').css('display', 'block');
|
||||
|
||||
// }.bind(this));
|
||||
// $('#maximize').click ( function() {
|
||||
// $('.control-panel').css('display', 'grid');
|
||||
// $('.hot-controls').css('display', 'none');
|
||||
// if (self.tab_id == 'stats') {
|
||||
// self.stats_panel.startAutoRender();
|
||||
// }
|
||||
// });
|
||||
}
|
||||
|
||||
defineEngineSpeedControls(){
|
||||
@@ -143,9 +179,12 @@ class ControlPanel {
|
||||
$(tab).css('display', 'grid');
|
||||
self.engine.organism_editor.is_active = (this.id == 'editor');
|
||||
self.stats_panel.stopAutoRender();
|
||||
if (this.id == 'stats') {
|
||||
if (this.id === 'stats') {
|
||||
self.stats_panel.startAutoRender();
|
||||
}
|
||||
else if (this.id === 'editor') {
|
||||
self.editor_controller.refreshDetailsPanel();
|
||||
}
|
||||
self.tab_id = this.id;
|
||||
});
|
||||
}
|
||||
@@ -192,15 +231,12 @@ class ControlPanel {
|
||||
switch(this.id){
|
||||
case "add-prob":
|
||||
Hyperparams.addProb = this.value;
|
||||
Hyperparams.balanceMutationProbs(1);
|
||||
break;
|
||||
case "change-prob":
|
||||
Hyperparams.changeProb = this.value;
|
||||
Hyperparams.balanceMutationProbs(2);
|
||||
break;
|
||||
case "remove-prob":
|
||||
Hyperparams.removeProb = this.value;
|
||||
Hyperparams.balanceMutationProbs(3);
|
||||
break;
|
||||
}
|
||||
$('#add-prob').val(Math.floor(Hyperparams.addProb));
|
||||
@@ -213,33 +249,37 @@ class ControlPanel {
|
||||
$('#food-blocks').change( function() {
|
||||
Hyperparams.foodBlocksReproduction = this.checked;
|
||||
});
|
||||
$('#reset-rules').click( function() {
|
||||
Hyperparams.setDefaults();
|
||||
$('#food-prod-prob').val(Hyperparams.foodProdProb);
|
||||
$('#lifespan-multiplier').val(Hyperparams.lifespanMultiplier);
|
||||
$('#mover-rot').prop('checked', Hyperparams.moversCanRotate);
|
||||
$('#offspring-rot').prop('checked', Hyperparams.offspringRotate);
|
||||
$('#insta-kill').prop('checked', Hyperparams.instaKill);
|
||||
$('#evolved-mutation').prop('checked', !Hyperparams.useGlobalMutability);
|
||||
$('#add-prob').val(Hyperparams.addProb);
|
||||
$('#change-prob').val(Hyperparams.changeProb);
|
||||
$('#remove-prob').val(Hyperparams.removeProb);
|
||||
$('#movers-produce').prop('checked', Hyperparams.moversCanProduce);
|
||||
$('#food-blocks').prop('checked', Hyperparams.foodBlocksReproduction);
|
||||
$('#food-drop-rate').val(Hyperparams.foodDropProb);
|
||||
$('#look-range').val(Hyperparams.lookRange);
|
||||
|
||||
if (!Hyperparams.useGlobalMutability) {
|
||||
$('.global-mutation-in').css('display', 'none');
|
||||
$('#avg-mut').css('display', 'block');
|
||||
}
|
||||
else {
|
||||
$('.global-mutation-in').css('display', 'block');
|
||||
$('#avg-mut').css('display', 'none');
|
||||
}
|
||||
$('#reset-rules').click(() => {
|
||||
this.setHyperparamDefaults();
|
||||
});
|
||||
}
|
||||
|
||||
setHyperparamDefaults() {
|
||||
Hyperparams.setDefaults();
|
||||
$('#food-prod-prob').val(Hyperparams.foodProdProb);
|
||||
$('#lifespan-multiplier').val(Hyperparams.lifespanMultiplier);
|
||||
$('#mover-rot').prop('checked', Hyperparams.moversCanRotate);
|
||||
$('#offspring-rot').prop('checked', Hyperparams.offspringRotate);
|
||||
$('#insta-kill').prop('checked', Hyperparams.instaKill);
|
||||
$('#evolved-mutation').prop('checked', !Hyperparams.useGlobalMutability);
|
||||
$('#add-prob').val(Hyperparams.addProb);
|
||||
$('#change-prob').val(Hyperparams.changeProb);
|
||||
$('#remove-prob').val(Hyperparams.removeProb);
|
||||
$('#movers-produce').prop('checked', Hyperparams.moversCanProduce);
|
||||
$('#food-blocks').prop('checked', Hyperparams.foodBlocksReproduction);
|
||||
$('#food-drop-rate').val(Hyperparams.foodDropProb);
|
||||
$('#look-range').val(Hyperparams.lookRange);
|
||||
|
||||
if (!Hyperparams.useGlobalMutability) {
|
||||
$('.global-mutation-in').css('display', 'none');
|
||||
$('#avg-mut').css('display', 'block');
|
||||
}
|
||||
else {
|
||||
$('.global-mutation-in').css('display', 'block');
|
||||
$('#avg-mut').css('display', 'none');
|
||||
}
|
||||
}
|
||||
|
||||
defineModeControls() {
|
||||
var self = this;
|
||||
$('.edit-mode-btn').click( function() {
|
||||
@@ -261,20 +301,15 @@ class ControlPanel {
|
||||
break;
|
||||
case "edit":
|
||||
self.setMode(Modes.Edit);
|
||||
self.editor_controller.setEditorPanel();
|
||||
break;
|
||||
case "drop-org":
|
||||
self.setMode(Modes.Clone);
|
||||
self.env_controller.org_to_clone = self.engine.organism_editor.getCopyOfOrg();
|
||||
self.env_controller.add_new_species = self.editor_controller.new_species;
|
||||
self.editor_controller.new_species = false;
|
||||
// console.log(self.env_controller.add_new_species)
|
||||
break;
|
||||
case "drag-view":
|
||||
self.setMode(Modes.Drag);
|
||||
}
|
||||
$('.edit-mode-btn').css('background-color', '#9099c2');
|
||||
$('#'+this.id).css('background-color', '#81d2c7');
|
||||
$('.edit-mode-btn').removeClass('selected');
|
||||
$('.'+this.id).addClass('selected');
|
||||
});
|
||||
|
||||
$('.reset-view').click( function(){
|
||||
@@ -283,21 +318,34 @@ class ControlPanel {
|
||||
|
||||
var env = this.engine.env;
|
||||
$('#reset-env').click( function() {
|
||||
this.engine.env.reset();
|
||||
env.reset();
|
||||
this.stats_panel.reset();
|
||||
}.bind(this));
|
||||
$('#clear-env').click( () => {
|
||||
env.reset(true, false);
|
||||
this.stats_panel.reset();
|
||||
env.auto_reset = false;
|
||||
$('#auto-reset').prop('checked', false);;
|
||||
});
|
||||
$('#auto-reset').change(function() {
|
||||
env.auto_reset = this.checked;
|
||||
});
|
||||
$('#clear-walls').click( function() {
|
||||
if (confirm("Are you sure you want to clear all the walls?")) {
|
||||
this.engine.env.clearWalls();
|
||||
}
|
||||
this.engine.env.clearWalls();
|
||||
}.bind(this));
|
||||
$('#clear-editor').click( function() {
|
||||
this.engine.organism_editor.clear();
|
||||
this.editor_controller.setEditorPanel();
|
||||
}.bind(this));
|
||||
}.bind(this))
|
||||
|
||||
window.onbeforeunload = function (e) {
|
||||
e = e || window.event;
|
||||
let return_str = 'this will cause a confirmation on page close'
|
||||
if (e) {
|
||||
e.returnValue = return_str;
|
||||
}
|
||||
return return_str;
|
||||
};
|
||||
}
|
||||
|
||||
defineChallenges() {
|
||||
@@ -310,6 +358,17 @@ class ControlPanel {
|
||||
setMode(mode) {
|
||||
this.env_controller.mode = mode;
|
||||
this.editor_controller.mode = mode;
|
||||
|
||||
if (mode == Modes.Edit) {
|
||||
this.editor_controller.setEditorPanel();
|
||||
}
|
||||
|
||||
if (mode == Modes.Clone) {
|
||||
this.env_controller.org_to_clone = this.engine.organism_editor.getCopyOfOrg();
|
||||
this.env_controller.add_new_species = this.editor_controller.new_species;
|
||||
this.editor_controller.new_species = false;
|
||||
// console.log(this.env_controller.add_new_species)
|
||||
}
|
||||
}
|
||||
|
||||
setEditorOrganism(org) {
|
||||
@@ -319,17 +378,17 @@ class ControlPanel {
|
||||
}
|
||||
|
||||
changeEngineSpeed(change_val) {
|
||||
this.engine.stop();
|
||||
this.engine.start(change_val)
|
||||
this.engine.restart(change_val)
|
||||
this.fps = this.engine.fps;
|
||||
}
|
||||
|
||||
updateHeadlessIcon(delta_time) {
|
||||
if (this.paused)
|
||||
return;
|
||||
const min_opacity = 0.4;
|
||||
var op = this.headless_opacity + (this.opacity_change_rate*delta_time/1000);
|
||||
if (op <= 0.4){
|
||||
op=0.4;
|
||||
if (op <= min_opacity){
|
||||
op=min_opacity;
|
||||
this.opacity_change_rate = -this.opacity_change_rate;
|
||||
}
|
||||
else if (op >= 1){
|
||||
|
||||
@@ -93,6 +93,10 @@ class EditorController extends CanvasController{
|
||||
$('#move-range-edit').change ( function() {
|
||||
this.env.organism.move_range = parseInt($('#move-range-edit').val());
|
||||
}.bind(this));
|
||||
|
||||
$('#mutation-rate-edit').change ( function() {
|
||||
this.env.organism.mutability = parseInt($('#mutation-rate-edit').val());
|
||||
}.bind(this));
|
||||
$('#observation-type-edit').change ( function() {
|
||||
this.setBrainEditorValues($('#observation-type-edit').val());
|
||||
this.setBrainDetails();
|
||||
@@ -110,6 +114,13 @@ class EditorController extends CanvasController{
|
||||
$('#edit-organism-details').css('display', 'none');
|
||||
}
|
||||
|
||||
refreshDetailsPanel() {
|
||||
if (this.mode === Modes.Edit)
|
||||
this.setEditorPanel();
|
||||
else
|
||||
this.setDetailsPanel();
|
||||
}
|
||||
|
||||
setDetailsPanel() {
|
||||
this.clearDetailsPanel();
|
||||
var org = this.env.organism;
|
||||
@@ -117,7 +128,8 @@ class EditorController extends CanvasController{
|
||||
$('.cell-count').text("Cell count: "+org.anatomy.cells.length);
|
||||
$('#move-range').text("Move Range: "+org.move_range);
|
||||
$('#mutation-rate').text("Mutation Rate: "+org.mutability);
|
||||
if (Hyperparams.useGlobalMutability) {
|
||||
|
||||
if (Hyperparams.useGlobalMutability) {
|
||||
$('#mutation-rate').css('display', 'none');
|
||||
}
|
||||
else {
|
||||
@@ -141,6 +153,14 @@ class EditorController extends CanvasController{
|
||||
if (this.setMoveRangeVisibility()){
|
||||
$('#move-range-edit').val(org.move_range);
|
||||
}
|
||||
|
||||
$('#mutation-rate-edit').val(org.mutability);
|
||||
if (Hyperparams.useGlobalMutability) {
|
||||
$('#mutation-rate-cont').css('display', 'none');
|
||||
}
|
||||
else {
|
||||
$('#mutation-rate-cont').css('display', 'block');
|
||||
}
|
||||
|
||||
if (this.setBrainPanelVisibility()){
|
||||
this.setBrainEditorValues($('#observation-type-edit').val());
|
||||
|
||||
@@ -9,7 +9,7 @@ const Hyperparams = require("../Hyperparameters");
|
||||
class EnvironmentController extends CanvasController{
|
||||
constructor(env, canvas) {
|
||||
super(env, canvas);
|
||||
this.mode = Modes.Drag;
|
||||
this.mode = Modes.FoodDrop;
|
||||
this.org_to_clone = null;
|
||||
this.add_new_species = false;
|
||||
this.defineZoomControls();
|
||||
@@ -28,22 +28,14 @@ class EnvironmentController extends CanvasController{
|
||||
// Restrict scale
|
||||
scale = Math.max(0.5, this.scale+(sign*zoom_speed));
|
||||
|
||||
if (scale != 0.5) {
|
||||
var cur_top = parseInt($('#env-canvas').css('top'));
|
||||
var cur_left = parseInt($('#env-canvas').css('left'));
|
||||
if (sign == 1) {
|
||||
// If we're zooming in, zoom towards wherever the mouse is
|
||||
var diff_x = ((this.canvas.width/2-cur_left/this.scale) - this.mouse_x)*this.scale/1.5;
|
||||
var diff_y = ((this.canvas.height/2-cur_top/this.scale) - this.mouse_y)*this.scale/1.5;
|
||||
}
|
||||
else {
|
||||
// If we're zooming out, zoom out towards the center
|
||||
var diff_x = -cur_left/scale;
|
||||
var diff_y = -cur_top/scale;
|
||||
}
|
||||
$('#env-canvas').css('top', (cur_top+diff_y)+'px');
|
||||
$('#env-canvas').css('left', (cur_left+diff_x)+'px');
|
||||
}
|
||||
var cur_top = parseInt($('#env-canvas').css('top'));
|
||||
var cur_left = parseInt($('#env-canvas').css('left'));
|
||||
|
||||
var diff_x = (this.canvas.width/2 - this.mouse_x) * (scale - this.scale);
|
||||
var diff_y = (this.canvas.height/2 - this.mouse_y) * (scale - this.scale);
|
||||
|
||||
$('#env-canvas').css('top', (cur_top+diff_y)+'px');
|
||||
$('#env-canvas').css('left', (cur_left+diff_x)+'px');
|
||||
|
||||
// Apply scale transform
|
||||
el.style.transform = `scale(${scale})`;
|
||||
@@ -149,6 +141,15 @@ class EnvironmentController extends CanvasController{
|
||||
break;
|
||||
}
|
||||
}
|
||||
else if (this.middle_click) {
|
||||
//drag on middle click
|
||||
var cur_top = parseInt($('#env-canvas').css('top'), 10);
|
||||
var cur_left = parseInt($('#env-canvas').css('left'), 10);
|
||||
var new_top = cur_top + ((this.mouse_y - this.start_y)*this.scale);
|
||||
var new_left = cur_left + ((this.mouse_x - this.start_x)*this.scale);
|
||||
$('#env-canvas').css('top', new_top+'px');
|
||||
$('#env-canvas').css('left', new_left+'px');
|
||||
}
|
||||
}
|
||||
|
||||
dropCellType(col, row, state, killBlocking=false) {
|
||||
|
||||
@@ -3,7 +3,9 @@ const ControlPanel = require('./Controllers/ControlPanel');
|
||||
const OrganismEditor = require('./Environments/OrganismEditor');
|
||||
const ColorScheme = require('./Rendering/ColorScheme');
|
||||
|
||||
const render_speed = 60;
|
||||
// If the simulation speed is below this value, a new interval will be created to handle ui rendering
|
||||
// at a reasonable speed. If it is above, the simulation interval will be used to update the ui.
|
||||
const min_render_speed = 60;
|
||||
|
||||
class Engine {
|
||||
constructor(){
|
||||
@@ -14,8 +16,13 @@ class Engine {
|
||||
this.colorscheme = new ColorScheme(this.env, this.organism_editor);
|
||||
this.colorscheme.loadColorScheme();
|
||||
this.env.OriginOfLife();
|
||||
this.last_update = Date.now();
|
||||
this.delta_time = 0;
|
||||
|
||||
this.sim_last_update = Date.now();
|
||||
this.sim_delta_time = 0;
|
||||
|
||||
this.ui_last_update = Date.now();
|
||||
this.ui_delta_time = 0;
|
||||
|
||||
this.actual_fps = 0;
|
||||
this.running = false;
|
||||
}
|
||||
@@ -24,40 +31,57 @@ class Engine {
|
||||
if (fps <= 0)
|
||||
fps = 1;
|
||||
this.fps = fps;
|
||||
this.game_loop = setInterval(function(){this.updateDeltaTime();this.environmentUpdate();}.bind(this), 1000/fps);
|
||||
this.sim_loop = setInterval(()=>{
|
||||
this.updateSimDeltaTime();
|
||||
this.environmentUpdate();
|
||||
}, 1000/fps);
|
||||
this.running = true;
|
||||
if (this.fps >= render_speed) {
|
||||
if (this.render_loop != null) {
|
||||
clearInterval(this.render_loop);
|
||||
this.render_loop = null;
|
||||
if (this.fps >= min_render_speed) {
|
||||
if (this.ui_loop != null) {
|
||||
clearInterval(this.ui_loop);
|
||||
this.ui_loop = null;
|
||||
}
|
||||
}
|
||||
else
|
||||
this.setRenderLoop();
|
||||
this.setUiLoop();
|
||||
}
|
||||
|
||||
stop() {
|
||||
clearInterval(this.game_loop);
|
||||
clearInterval(this.sim_loop);
|
||||
this.running = false;
|
||||
this.setRenderLoop();
|
||||
this.setUiLoop();
|
||||
}
|
||||
|
||||
setRenderLoop() {
|
||||
if (this.render_loop == null) {
|
||||
this.render_loop = setInterval(function(){this.updateDeltaTime();this.necessaryUpdate();}.bind(this), 1000/render_speed);
|
||||
restart(fps) {
|
||||
clearInterval(this.sim_loop);
|
||||
this.start(fps);
|
||||
}
|
||||
|
||||
setUiLoop() {
|
||||
if (!this.ui_loop) {
|
||||
this.ui_loop = setInterval(()=> {
|
||||
this.updateUIDeltaTime();
|
||||
this.necessaryUpdate();
|
||||
}, 1000/min_render_speed);
|
||||
}
|
||||
}
|
||||
|
||||
updateDeltaTime() {
|
||||
this.delta_time = Date.now() - this.last_update;
|
||||
this.last_update = Date.now();
|
||||
updateSimDeltaTime() {
|
||||
this.sim_delta_time = Date.now() - this.sim_last_update;
|
||||
this.sim_last_update = Date.now();
|
||||
if (!this.ui_loop) // if the ui loop isn't running, use the sim delta time
|
||||
this.ui_delta_time = this.sim_delta_time;
|
||||
}
|
||||
|
||||
updateUIDeltaTime() {
|
||||
this.ui_delta_time = Date.now() - this.ui_last_update;
|
||||
this.ui_last_update = Date.now();
|
||||
}
|
||||
|
||||
environmentUpdate() {
|
||||
this.env.update(this.delta_time);
|
||||
this.actual_fps = 1/this.delta_time*1000;
|
||||
if(this.render_loop == null){
|
||||
this.actual_fps = (1000/this.sim_delta_time);
|
||||
this.env.update(this.sim_delta_time);
|
||||
if(this.ui_loop == null) {
|
||||
this.necessaryUpdate();
|
||||
}
|
||||
|
||||
@@ -65,7 +89,7 @@ class Engine {
|
||||
|
||||
necessaryUpdate() {
|
||||
this.env.render();
|
||||
this.controlpanel.update(this.delta_time);
|
||||
this.controlpanel.update(this.ui_delta_time);
|
||||
this.organism_editor.update();
|
||||
}
|
||||
|
||||
|
||||
@@ -64,7 +64,7 @@ class WorldEnvironment extends Environment{
|
||||
}
|
||||
if (this.organisms.length == 0 && this.auto_reset){
|
||||
this.reset_count++;
|
||||
this.reset();
|
||||
this.reset(false);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -130,14 +130,19 @@ class WorldEnvironment extends Environment{
|
||||
}
|
||||
}
|
||||
|
||||
reset() {
|
||||
reset(confirm_reset=true, reset_life=true) {
|
||||
if (confirm_reset && !confirm('The current environment will be lost. Proceed?'))
|
||||
return;
|
||||
|
||||
this.organisms = [];
|
||||
this.grid_map.fillGrid(CellStates.empty);
|
||||
this.renderer.renderFullGrid(this.grid_map.grid);
|
||||
this.total_mutability = 0;
|
||||
this.total_ticks = 0;
|
||||
FossilRecord.clear_record();
|
||||
this.OriginOfLife();
|
||||
if (reset_life)
|
||||
this.OriginOfLife();
|
||||
|
||||
}
|
||||
|
||||
resizeGridColRow(cell_size, cols, rows) {
|
||||
|
||||
@@ -5,8 +5,7 @@ const Hyperparams = {
|
||||
this.headless = false;
|
||||
|
||||
this.lifespanMultiplier = 100;
|
||||
this.foodProdProb = 4;
|
||||
this.foodProdProbScalar = 4;
|
||||
this.foodProdProb = 5;
|
||||
this.killableNeighbors = Neighbors.adjacent;
|
||||
this.edibleNeighbors = Neighbors.adjacent;
|
||||
this.growableNeighbors = Neighbors.adjacent;
|
||||
@@ -29,24 +28,6 @@ const Hyperparams = {
|
||||
|
||||
this.foodDropProb = 0;
|
||||
},
|
||||
|
||||
balanceMutationProbs : function(choice) {
|
||||
if (choice == 1) {
|
||||
var remaining = 100 - this.addProb;
|
||||
this.changeProb = remaining/2;
|
||||
this.removeProb = remaining/2;
|
||||
}
|
||||
else if (choice == 2) {
|
||||
var remaining = 100 - this.changeProb;
|
||||
this.addProb = remaining/2;
|
||||
this.removeProb = remaining/2;
|
||||
}
|
||||
else {
|
||||
var remaining = 100 - this.removeProb;
|
||||
this.changeProb = remaining/2;
|
||||
this.addProb = remaining/2;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
Hyperparams.setDefaults();
|
||||
|
||||
@@ -123,42 +123,37 @@ class Organism {
|
||||
}
|
||||
|
||||
mutate() {
|
||||
var choice = Math.floor(Math.random() * 100);
|
||||
var mutated = false;
|
||||
if (choice <= Hyperparams.addProb) {
|
||||
// add cell
|
||||
// console.log("add cell")
|
||||
|
||||
var branch = this.anatomy.getRandomCell();
|
||||
var state = CellStates.getRandomLivingType();//branch.state;
|
||||
var growth_direction = Neighbors.all[Math.floor(Math.random() * Neighbors.all.length)]
|
||||
var c = branch.loc_col+growth_direction[0];
|
||||
var r = branch.loc_row+growth_direction[1];
|
||||
let mutated = false;
|
||||
if (this.calcRandomChance(Hyperparams.addProb)) {
|
||||
let branch = this.anatomy.getRandomCell();
|
||||
let state = CellStates.getRandomLivingType();//branch.state;
|
||||
let growth_direction = Neighbors.all[Math.floor(Math.random() * Neighbors.all.length)]
|
||||
let c = branch.loc_col+growth_direction[0];
|
||||
let r = branch.loc_row+growth_direction[1];
|
||||
if (this.anatomy.canAddCellAt(c, r)){
|
||||
mutated = true;
|
||||
this.anatomy.addRandomizedCell(state, c, r);
|
||||
}
|
||||
}
|
||||
else if (choice <= Hyperparams.addProb + Hyperparams.changeProb){
|
||||
// change cell
|
||||
var cell = this.anatomy.getRandomCell();
|
||||
var state = CellStates.getRandomLivingType();
|
||||
// console.log("change cell", state)
|
||||
if (this.calcRandomChance(Hyperparams.changeProb)){
|
||||
let cell = this.anatomy.getRandomCell();
|
||||
let state = CellStates.getRandomLivingType();
|
||||
this.anatomy.replaceCell(state, cell.loc_col, cell.loc_row);
|
||||
mutated = true;
|
||||
}
|
||||
else if (choice <= Hyperparams.addProb + Hyperparams.changeProb + Hyperparams.removeProb){
|
||||
// remove cell
|
||||
// console.log("remove cell")
|
||||
|
||||
if (this.calcRandomChance(Hyperparams.removeProb)){
|
||||
if(this.anatomy.cells.length > 1) {
|
||||
var cell = this.anatomy.getRandomCell();
|
||||
let cell = this.anatomy.getRandomCell();
|
||||
mutated = this.anatomy.removeCell(cell.loc_col, cell.loc_row);
|
||||
}
|
||||
}
|
||||
return mutated;
|
||||
}
|
||||
|
||||
calcRandomChance(prob) {
|
||||
return (Math.random() * 100) < prob;
|
||||
}
|
||||
|
||||
attemptMove() {
|
||||
var direction = Directions.scalars[this.direction];
|
||||
var direction_c = direction[0];
|
||||
|
||||
@@ -105,8 +105,4 @@ class Renderer {
|
||||
}
|
||||
}
|
||||
|
||||
// $("body").mousemove(function(e) {
|
||||
// console.log("hello");
|
||||
// });
|
||||
|
||||
module.exports = Renderer;
|
||||
|
||||
@@ -41,7 +41,9 @@ const FossilRecord = {
|
||||
if (species.cumulative_pop < this.min_pop) {
|
||||
return false;
|
||||
}
|
||||
this.extinct_species.push(s);
|
||||
// disabled for now, causes memory problems on long runs
|
||||
// this.extinct_species.push(s);
|
||||
|
||||
// console.log("Extant species:", this.extant_species.length)
|
||||
// console.log("Extinct species:", this.extinct_species.length)
|
||||
return true;
|
||||
|
||||
@@ -3,17 +3,11 @@ const CellStates = require("../Organism/Cell/CellStates");
|
||||
class Species {
|
||||
constructor(anatomy, ancestor, start_tick) {
|
||||
this.anatomy = anatomy;
|
||||
this.ancestor = ancestor;
|
||||
// this.ancestor = ancestor; // garbage collect ancestors to avoid memory problems
|
||||
this.population = 1;
|
||||
this.cumulative_pop = 1;
|
||||
this.start_tick = start_tick;
|
||||
this.end_tick = -1;
|
||||
this.color = Math.floor(Math.random()*16777215).toString(16);
|
||||
if (ancestor != null) {
|
||||
// needs to be reworked, maybe removed
|
||||
var mutator = Math.floor(Math.random()*16777215)-8000000;
|
||||
this.color = (mutator + parseInt(ancestor.color, 16)).toString(16);
|
||||
}
|
||||
this.name = '_' + Math.random().toString(36).substr(2, 9);
|
||||
this.extinct = false;
|
||||
this.calcAnatomyDetails();
|
||||
|
||||
Reference in New Issue
Block a user