highlight wobelling + started console exec

app/views/editors/KeyframeView.html

@@ -124,12 +124,12 @@
             <canvas data-output="kfArenaCanvas"></canvas> 
             <bz-slidepane side="bottom" data-output="console">
                 <div class="inner-console">
-                    <div class="results">
+                    <div class="results" data-output="results">
                         JS 3D Console. for help, type "help"
                     </div>
                     <div class="cols-2 commandline">
                         <textarea type="text" data-output="commands"></textarea>   
-                        <button class="icon-play" data-trigger="execCommand"></button>
+                        <button eicbutton class="icon-play" data-trigger="execCommand"></button>
                     </div>      
                 </div>                
             </bz-slidepane>

app/views/editors/KeyframeView.js

@@ -63,22 +63,18 @@ class KeyframeView extends WindozDomContent {
         this.outputs.btnSaveKF.disabled = true  
         this.outputs.kfName.addEventListener('keyup', this.updateKfButtons.bind(this))
         this.currentlySelectedAid = null
-        // this.output('console',`
-        //     <div class="inner-console">
-        //         <div class="results">
-        //             JS 3D Console. for help, type "help"
-        //         </div>
-        //         <div class="cols-2 commandline">
-        //             <textarea type="text" style="" data-output="commands"></textarea>   
-        //             <button class="icon-play" data-trigger="execCommand"></button>
-        //         </div>      
-        //     </div>
-        // `)
-
     }
 
     async execCommand(event){
-        console.log('cmd:', this.ouputs.caommands)
+        console.log('cmd:', this.outputs.commands)
+        if(this.outputs.commands.trim()=='help'){
+            this.outputs.results.innerHTML = `
+                Type any javascript at your own risks.
+                To create an agent : this.newAgent(type, properties)
+            `
+        } else {
+            this.kfArena.evalCmd(this.outputs.commands)
+        }
     }
 
     async onChangeAgent(event){
@@ -91,6 +87,9 @@ class KeyframeView extends WindozDomContent {
             this.currentAgentType = await this.models.agents.getProperties(this.outputs.agentsSelector.value)
             this.fillAgentProperties('', this.currentAgentType.atp_props)
             // Deselect any on-scene selection
+            if(this.currentlySelectedAid){
+                this.kfArena.clearHighlight3DObj(this.kfArena.scene.getObjectByName(this.currentlySelectedAid), this.kfArena.scene)
+            }
             this.currentlySelectedAid = null
         }
     }
@@ -113,7 +112,11 @@ class KeyframeView extends WindozDomContent {
             this.kfArena.clearHighlight3DObj(obj3D, this.kfArena.scene)
             this.currentlySelectedAid = null
         } else { // Select
-            this.currentlySelectedAid = aid
+            if(this.currentlySelectedAid){
+                this.kfArena.clearHighlight3DObj(this.kfArena.scene.getObjectByName(this.currentlySelectedAid), this.kfArena.scene)
+            }
+
+            this.currentlySelectedAid = aid            
             if(this.kfArena.agents[aid]) {
                 this.kfArena.highlight3DObj(obj3D, this.kfArena.scene)
                 this.fillAgentProperties(aid, this.kfArena.agents[aid].props, this.kfArena.agents[aid].values)
@@ -127,13 +130,19 @@ class KeyframeView extends WindozDomContent {
 
     onAddAgent(event){
         //TODO prevent collisions !
-        const aid = crypto.randomUUIDv7()
-        this.output('agentId', `ID: ${aid}`)
         const AgentValues = this.getFieldsValues('div[data-output="agentProperties"]')
-        this.kfArena.addAgent(this.outputs.agentsSelector.value, aid, this.currentAgentType.atp_props , AgentValues)
+        const aid = this.newAgent(this.outputs.agentsSelector.value, AgentValues)
+        this.output('agentId', `ID: ${aid}`)
         this.updateKfButtons()
     }
 
+    newAgent(aType, AgentValues){
+        const aid = crypto.randomUUIDv7()
+        this.kfArena.addAgent(aType, aid, this.currentAgentType.atp_props , AgentValues)
+        return(aid)
+    }
+
+
     updateKfButtons(){
         if((Object.keys(this.kfArena.agents).length > 0) && (this.outputs.kfName.value.length > 5)) { this.outputs.btnSaveKF.disabled = false  }
         else { this.outputs.btnSaveKF.disabled = true  }

app/views/editors/modules/kfArena.module.js

@@ -72,11 +72,13 @@ export class kfArena{
     
     render() {
         TWEEN.update()
+        this.animateHighlight3DObj()
         const resized = this.resizeRendererToDisplaySize()
         this.renderer.render(this.scene, this.camera)
         requestAnimationFrame(this.render.bind(this))
     }
     
+
     
     resizeRendererToDisplaySize() {
         const width = this.canvasEl.clientWidth
@@ -206,6 +208,7 @@ export class kfArena{
         }
     }
 
+
     // getAllAgents(){
     //     const agents = []
     //     scene.traverse(o => o.name && names.push(o.name))