josh/lifeEngine
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merge branch 'develop' into random-orgs

Browse Source
This commit is contained in:
Max Robinson
2021-12-19 11:31:19 -06:00
committed by GitHub
parent 0bdea0843c 5ee5bc2bce
commit ce7b38c028
19 changed files with 662 additions and 312 deletions
Download Patch File Download Diff File Expand all files Collapse all files

308
src/Controllers/ControlPanel.js
View File

@@ -2,15 +2,17 @@ const Hyperparams = require("../Hyperparameters");
const Modes = require("./ControlModes");
const StatsPanel = require("../Stats/StatsPanel");
const RandomOrganismGenerator = require("../Organism/RandomOrganismGenerator")
const WorldConfig = require("../WorldConfig");
class ControlPanel {
constructor(engine) {
this.engine = engine;
this.defineMinMaxControls();
this.defineHotkeys();
this.defineEngineSpeedControls();
this.defineGridSizeControls();
this.defineTabNavigation();
this.defineHyperparameterControls();
this.defineWorldControls();
this.defineModeControls();
this.defineChallenges();
this.fps = engine.fps;
@@ -22,7 +24,8 @@ class ControlPanel {
this.stats_panel = new StatsPanel(this.engine.env);
this.headless_opacity = 1;
this.opacity_change_rate = -0.8;
//this.paused=false;
this.paused=false;
this.setHyperparamDefaults();
}
defineMinMaxControls(){
@@ -42,48 +45,85 @@ 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(){
this.slider = document.getElementById("slider");
this.slider.oninput = function() {
this.fps = this.slider.value
const max_fps = 300;
this.fps = this.slider.value;
if (this.fps>=max_fps) this.fps = 1000;
if (this.engine.running) {
this.changeEngineSpeed(this.fps);
}
$('#fps').text("Target FPS: "+this.fps);
let text = this.fps >= max_fps ? 'MAX' : this.fps;
$('#fps').text("Target FPS: "+text);
}.bind(this);
$('.pause-button').click(function() {
@@ -94,18 +134,39 @@ class ControlPanel {
$('.headless').click(function() {
$('.headless').find("i").toggleClass("fa fa-eye");
$('.headless').find("i").toggleClass("fa fa-eye-slash");
if (Hyperparams.headless){
if (WorldConfig.headless){
$('#headless-notification').css('display', 'none');
this.engine.env.renderFull();
}
else {
$('#headless-notification').css('display', 'block');
}
Hyperparams.headless = !Hyperparams.headless;
WorldConfig.headless = !WorldConfig.headless;
}.bind(this));
}
defineGridSizeControls() {
defineTabNavigation() {
this.tab_id = 'about';
var self = this;
$('.tabnav-item').click(function() {
$('.tab').css('display', 'none');
var tab = '#'+this.id+'.tab';
$(tab).css('display', 'grid');
$('.tabnav-item').removeClass('open-tab')
$('#'+this.id+'.tabnav-item').addClass('open-tab');
self.engine.organism_editor.is_active = (this.id == 'editor');
self.stats_panel.stopAutoRender();
if (this.id === 'stats') {
self.stats_panel.startAutoRender();
}
else if (this.id === 'editor') {
self.editor_controller.refreshDetailsPanel();
}
self.tab_id = this.id;
});
}
defineWorldControls() {
$('#fill-window').change(function() {
if (this.checked)
$('.col-row-input').css('display' ,'none');
@@ -128,22 +189,20 @@ class ControlPanel {
this.stats_panel.reset();
}.bind(this));
}
defineTabNavigation() {
this.tab_id = 'about';
var self = this;
$('.tabnav-item').click(function() {
$('.tab').css('display', 'none');
var tab = '#'+this.id+'.tab';
$(tab).css('display', 'grid');
self.engine.organism_editor.is_active = (this.id == 'editor');
self.stats_panel.stopAutoRender();
if (this.id == 'stats') {
self.stats_panel.startAutoRender();
}
self.tab_id = this.id;
$('#auto-reset').change(function() {
WorldConfig.auto_reset = this.checked;
});
$('#auto-pause').change(function() {
WorldConfig.auto_pause = this.checked;
});
$('#clear-walls-reset').change(function() {
WorldConfig.clear_walls_on_reset = this.checked;
})
$('#start-state').change ( function() {
WorldConfig.start_state = $("#start-state").val();
}.bind(this));
}
defineHyperparameterControls() {
@@ -154,11 +213,8 @@ class ControlPanel {
Hyperparams.lifespanMultiplier = $('#lifespan-multiplier').val();
}.bind(this));
$('#mover-rot').change(function() {
Hyperparams.moversCanRotate = this.checked;
});
$('#offspring-rot').change(function() {
Hyperparams.offspringRotate = this.checked;
$('#rot-enabled').change(function() {
Hyperparams.rotationEnabled = this.checked;
});
$('#insta-kill').change(function() {
Hyperparams.instaKill = this.checked;
@@ -169,6 +225,10 @@ class ControlPanel {
$('#food-drop-rate').change(function() {
Hyperparams.foodDropProb = $('#food-drop-rate').val();
});
$('#extra-mover-cost').change(function() {
console.log(parseInt($('#extra-mover-cost').val()))
Hyperparams.extraMoverFoodCost = parseInt($('#extra-mover-cost').val());
});
$('#evolved-mutation').change( function() {
if (this.checked) {
@@ -188,15 +248,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));
@@ -209,31 +266,62 @@ 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();
});
$('#save-controls').click(() => {
let data = "data:text/json;charset=utf-8," + encodeURIComponent(JSON.stringify(Hyperparams));
let downloadEl = document.getElementById('download-el');
downloadEl.setAttribute("href", data);
downloadEl.setAttribute("download", "controls.json");
downloadEl.click();
});
$('#load-controls').click(() => {
$('#upload-el').click();
});
$('#upload-el').change((e)=>{
let files = e.target.files;
if (!files.length) {return;};
let reader = new FileReader();
reader.onload = (e) => {
let result=JSON.parse(e.target.result);
Hyperparams.loadJsonObj(result);
this.updateHyperparamUIValues();
// have to clear the value so change() will be triggered if the same file is uploaded again
$('#upload-el')[0].value = '';
};
reader.readAsText(files[0]);
});
}
setHyperparamDefaults() {
Hyperparams.setDefaults();
this.updateHyperparamUIValues();
}
updateHyperparamUIValues(){
$('#food-prod-prob').val(Hyperparams.foodProdProb);
$('#lifespan-multiplier').val(Hyperparams.lifespanMultiplier);
$('#rot-enabled').prop('checked', Hyperparams.rotationEnabled);
$('#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);
$('#extra-mover-cost').val(Hyperparams.extraMoverFoodCost);
$('#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() {
@@ -257,23 +345,18 @@ class ControlPanel {
break;
case "edit":
self.setMode(Modes.Edit);
self.editor_controller.setEditorPanel();
break;
case "randomize":
self.setMode(Modes.Randomize);
self.editor_controller.setRandomizePanel();
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(){
@@ -282,16 +365,18 @@ class ControlPanel {
var env = this.engine.env;
$('#reset-env').click( function() {
this.engine.env.reset();
env.reset();
this.stats_panel.reset();
}.bind(this));
$('#auto-reset').change(function() {
env.auto_reset = this.checked;
$('#clear-env').click( () => {
env.reset(true, false);
this.stats_panel.reset();
});
$('#random-walls').click( function() {
this.env_controller.randomizeWalls();
}.bind(this));
$('#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();
@@ -315,6 +400,16 @@ class ControlPanel {
this.setPaused(true);
this.engine.organism_editor.createRandomWorld(this.engine.env);
}.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() {
@@ -345,6 +440,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) {
@@ -354,17 +460,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.engine.running)
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){
@@ -379,7 +485,7 @@ class ControlPanel {
$('#fps-actual').text("Actual FPS: " + Math.floor(this.engine.actual_fps));
$('#reset-count').text("Auto reset count: " + this.engine.env.reset_count);
this.stats_panel.updateDetails();
if (Hyperparams.headless)
if (WorldConfig.headless)
this.updateHeadlessIcon(delta_time);
}