Merge pull request #169 from MaxRobinsonTheGreat/develop

Develop

Changelog.md

@@ -1,5 +1,13 @@
 # Changelog
 
+## 1.0.6 (ongoing)
+
+### UI Enhancements:
+- Added ability to change species name via UI
+
+### Simulation Enhancements:
+- 
+
 ## 1.0.5 (4/23/2023)
 
 ### UI Enhancements:

dist/css/style.css

@@ -203,7 +203,6 @@ input:hover,input:active {
 .edit-mode-btn {
     width: 30px;
     height: 30px;
-    margin-top: 5px;
 }
 .edit-mode-btn.selected {
     background-color: var(--btn-hover);
@@ -233,9 +232,8 @@ input:hover,input:active {
 #unnatural-org-warning {
     color: red;
     text-align: center;
-    font-size: 22px;
+    font-size: 15px;
     border-radius: 10px;
-    margin: 2px;
     border: 2px solid red;
 }
 #unnatural-org-warning:hover {
@@ -326,10 +324,6 @@ input:hover,input:active {
     padding-bottom: 0;
 }
 
-#reset-with-editor-org {
-    margin-top: 5px;
-}
-
 .load-panel {
     width: 800px;
     background-color: var(--panel-bg);

dist/index.html

@@ -84,6 +84,7 @@
 							<button class="edit-mode-btn drop-org" id="drop-org" title="Drop organism in world. Hotkey: C"><i class="fa fa-plus"></i></button>
 							<button id="save-org" title="Save Organism"><i class="fa fa-save"></i></button>
 							<button id="load-org" title="Load Organism"><i class="fa fa-upload"></i></button>
+							<button id="reset-with-editor-org" title="Reset Environment with this Organism"><i class="fa fa-seedling"></i></button>
 							<b id="unnatural-org-warning" title="Unnatural Organism: It has overlapping cells or genetic changes that cannot evolve naturally"><i class="fa fa-biohazard"></i></i></b>
 						</div>
 						<div id='editor-env'>
@@ -125,6 +126,10 @@
 
 						<div id='edit-organism-details' style="display:none;">
 							<h3>Edit Organism</h3>
+							<div id='species-name-cont'>
+								<label for="species-name-edit">Species Name:</label>
+								<input type="text" id="species-name-edit">
+							</div>
 							<p class='cell-count'>Cell count: </p>
 							<div id='move-range-cont'>
 								<label for="move-range-edit" title='The number of cells to move before randomly changing direction. Overriden by brain decisions.'>Move Range:</label>
@@ -159,8 +164,6 @@
 								<p class='retreat-types'>Move Away From: killer</p>
 							</div>
 						</div>
-						
-						<button id='reset-with-editor-org' title='Reset the environment with the organism in the editor'>Reset with Editor Organism</button>
 					</div>
 				</div>
 				<div id='world-controls' class='tab'>

package.json

@@ -22,7 +22,7 @@
   "homepage": "https://github.com/MaxRobinsonTheGreat/EvolutionSimulatorV2#readme",
   "devDependencies": {
     "webpack": "^5.89.0",
-    "webpack-cli": "^3.3.12"
+    "webpack-cli": "^5.1.4"
   },
   "dependencies": {
     "glob-parent": "^6.0.2",

src/Controllers/EditorController.js

@@ -5,6 +5,7 @@ const Directions = require("../Organism/Directions");
 const Hyperparams = require("../Hyperparameters");
 const Species = require("../Stats/Species");
 const LoadController = require("./LoadController");
+const FossilRecord = require("../Stats/FossilRecord");
 
 class EditorController extends CanvasController{
     constructor(env, canvas) {
@@ -98,6 +99,13 @@ class EditorController extends CanvasController{
 
         this.decision_names = ["ignore", "move away", "move towards"];
 
+        $('#species-name-edit').on('focusout', function() {
+            const new_name = $('#species-name-edit').val();
+            if (new_name === '' || new_name === this.env.organism.species.name)
+                return;
+            FossilRecord.changeSpeciesName(this.env.organism.species, new_name);
+        }.bind(this));
+
         $('#move-range-edit').change ( function() {
             this.env.organism.move_range = parseInt($('#move-range-edit').val());
         }.bind(this));
@@ -123,7 +131,8 @@ class EditorController extends CanvasController{
             let data = "data:text/json;charset=utf-8," + encodeURIComponent(JSON.stringify(org));
             let downloadEl = document.getElementById('download-el');
             downloadEl.setAttribute("href", data);
-            downloadEl.setAttribute("download", "organism.json");
+            const name = this.env.organism.species.name ? this.env.organism.species.name : "organism";
+            downloadEl.setAttribute("download", name+".json");
             downloadEl.click();
         });
         $('#load-org').click(() => {
@@ -188,6 +197,7 @@ class EditorController extends CanvasController{
         this.clearDetailsPanel();
         var org = this.env.organism;
 
+        $('#species-name-edit').val(org.species.name);
         $('.cell-count').text("Cell count: "+org.anatomy.cells.length);
         if (this.setMoveRangeVisibility()){
             $('#move-range-edit').val(org.move_range);

src/Controllers/EnvironmentController.js

@@ -18,15 +18,18 @@ class EnvironmentController extends CanvasController{
 
     defineZoomControls() {
           var scale = 1;
-          var zoom_speed = 0.5;
+          var zoom_speed = 0.7;
           const el = document.querySelector('#env-canvas');
           el.onwheel = function zoom(event) {
             event.preventDefault();
 
-            var sign = -Math.sign(event.deltaY);
+            var sign = Math.sign(event.deltaY);
-
+          
-            // Restrict scale
+            scale *= Math.pow(zoom_speed, sign);
-            scale = Math.max(0.5, this.scale+(sign*zoom_speed));
+          
+            const MAX = 32;
+            const MIN = Math.pow(2, -3);
+            scale = Math.min(MAX, Math.max(MIN, scale));
 
             var cur_top = parseInt($('#env-canvas').css('top'));
             var cur_left = parseInt($('#env-canvas').css('left'));
@@ -154,8 +157,8 @@ class EnvironmentController extends CanvasController{
     }
 
     dragScreen() {
-        var cur_top = parseInt($('#env-canvas').css('top'), 10);
+        var cur_top = parseInt($('#env-canvas').css('top'));
-        var cur_left = parseInt($('#env-canvas').css('left'), 10);
+        var cur_left = parseInt($('#env-canvas').css('left'));
         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');

src/Stats/FossilRecord.js

@@ -34,6 +34,16 @@ const FossilRecord = {
         return species;
     },
 
+    changeSpeciesName: function(species, new_name) {
+        if (this.extant_species[new_name]) {
+            console.warn('Tried to change species name to an existing species name. Change failed.');
+            return;
+        }
+        delete this.extant_species[species.name];
+        species.name = new_name;
+        this.extant_species[new_name] = species;
+    },
+
     numExtantSpecies() {return Object.values(this.extant_species).length},
     numExtinctSpecies() {return Object.values(this.extinct_species).length},
     speciesIsExtant(species_name) {return !!this.extant_species[species_name]},