+ //
+ // JS 3D Console. for help, type "help"
+ //
+ //
+ //
+ //
+ //
+ //
+ // `)
+
+ }
+
+ async execCommand(event){
+ console.log('cmd:', this.ouputs.caommands)
}
async onChangeAgent(event){
@@ -86,7 +91,6 @@ 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
- this.kfArena.highlighted3DObjects.length = 0
this.currentlySelectedAid = null
}
}
@@ -105,13 +109,13 @@ class KeyframeView extends WindozDomContent {
onclickAgent(obj3D){
const aid = obj3D.name
- this.kfArena.highlighted3DObjects.length = 0 //truncate but keep the ref !
if(this.currentlySelectedAid == aid){ // Deselect
+ this.kfArena.clearHighlight3DObj(obj3D, this.kfArena.scene)
this.currentlySelectedAid = null
} else { // Select
this.currentlySelectedAid = aid
if(this.kfArena.agents[aid]) {
- this.kfArena.highlighted3DObjects.push(obj3D)
+ this.kfArena.highlight3DObj(obj3D, this.kfArena.scene)
this.fillAgentProperties(aid, this.kfArena.agents[aid].props, this.kfArena.agents[aid].values)
this.notUserChange = true
this.outputs.agentsSelector.value = this.kfArena.agents[aid].type
diff --git a/app/views/editors/modules/agentPreview.module.js b/app/views/editors/modules/agentPreview.module.js
index 02367da..233a41d 100644
--- a/app/views/editors/modules/agentPreview.module.js
+++ b/app/views/editors/modules/agentPreview.module.js
@@ -1,4 +1,4 @@
-import * as THREE from '/app/thirdparty/Three/three.module.js'
+import * as THREE from 'three' //'/app/thirdparty/Three/three.module.js'
export class AgentPreview{
diff --git a/app/views/editors/modules/kfArena.module.js b/app/views/editors/modules/kfArena.module.js
index 34faa54..53b2435 100644
--- a/app/views/editors/modules/kfArena.module.js
+++ b/app/views/editors/modules/kfArena.module.js
@@ -1,6 +1,6 @@
-import * as THREE from '/app/thirdparty/Three/three.module.js'
-import { OrbitControls } from '/app/thirdparty/Three/OrbitControls.module.js'
-import * as TWEEN from '/app/thirdparty/Three/tween.module.js'
+import * as THREE from 'three' // '/app/thirdparty/Three/three.module.js'
+import { OrbitControls } from 'three/examples/jsm/controls/OrbitControls.js' // '/app/thirdparty/Three/OrbitControls.module.js'
+import * as TWEEN from 'three/examples/jsm/libs/tween.module.js' //'/app/thirdparty/Three/tween.module.js'
export class kfArena{
@@ -56,15 +56,13 @@ export class kfArena{
this.axes.layers.set(2)
this.scene.add(this.axes)
- this.renderer = new THREE.WebGLRenderer({ antialias: true, canvas: this.canvasEl })
- this.init3DHighlighter({
- edgeStrength: 3,
- visibleEdgeColor: 0xffff00,
- edgeGlow: 1,
- edgeThickness: 4,
- pulsePeriod: 2,
- })
- this.canvasEl.addEventListener('click', this.onSceneClick.bind(this))
+ this.renderer = new THREE.WebGLRenderer({ antialias: true, canvas: this.canvasEl, stencil: true })
+ // this.renderer.physicallyCorrectLights = true
+ // this.renderer.outputColorSpace = THREE.SRGBColorSpace
+ // this.renderer.toneMapping = THREE.ACESFilmicToneMapping
+ // this.renderer.toneMappingExposure = 1
+
+ this.canvasEl.addEventListener('click', this.onSceneClick.bind(this))
}
startRendering(){
@@ -74,9 +72,8 @@ export class kfArena{
render() {
TWEEN.update()
- this.resizeRendererToDisplaySize()
- if(this.composer) this.composer.render()
- else this.renderer.render(this.scene, this.camera)
+ const resized = this.resizeRendererToDisplaySize()
+ this.renderer.render(this.scene, this.camera)
requestAnimationFrame(this.render.bind(this))
}
diff --git a/index.html b/index.html
index 91d3afa..7b3eea1 100644
--- a/index.html
+++ b/index.html
@@ -8,14 +8,25 @@
+
+