STEINNI
132 lines
4.3 KiB
JavaScript
132 lines
4.3 KiB
JavaScript
class KeyframeView extends WindozDomContent {
|
|
|
|
constructor() {
|
|
super()
|
|
Object.assign(this, app.helpers.activeAttributes)
|
|
Object.assign(this, app.helpers.formBuilder)
|
|
}
|
|
|
|
DOMContentFocused(options) {
|
|
if(this.wasBlured){ // Avoid 2nd refesh on DomContentLoaded
|
|
//this.refreshyoustuff()
|
|
}
|
|
this.wasBlured = false
|
|
}
|
|
|
|
DOMContentBlured(options) { this.wasBlured = true }
|
|
|
|
async DOMContentLoaded(options) {
|
|
this.windowPrefsId = `editors.keyframeview`
|
|
this.models = options.models
|
|
const components = ui.eicfy(this.el)
|
|
this.setupTriggers(components)
|
|
this.setupRefs(components)
|
|
|
|
const [sprites, types] = await Promise.all([
|
|
this.models.agents.getSprites('Basic 3D'),
|
|
this.models.agents.getTypes('Test agents')
|
|
])
|
|
|
|
this.agentSprites = sprites
|
|
this.agentTypes = types
|
|
|
|
|
|
this.outputs.agentsSelector.fillOptions( this.agentTypes.map(item => {
|
|
return({ markup: `<i class="icon-${item.atp_hascode ? 'bug' : 'atom1'}"></i>${item.atp_name}`, value: item.atp_id})
|
|
}))
|
|
this.outputs.agentsSelector.addEventListener('change',this.onChangeAgent.bind(this))
|
|
|
|
this.agentPreview = new app.LoadedModules.AgentPreview(this.outputs.agentSampleCanvas, this.agentSprites)
|
|
this.onChangeAgent()
|
|
this.agentPreview.startRendering()
|
|
this.agentPreview.animation = true
|
|
|
|
this.kfArena = new app.LoadedModules.kfArena(this.outputs.kfArenaCanvas, this.agentSprites)
|
|
this.kfArena.onclickAgent = this.onclickAgent.bind(this)
|
|
this.kfArena.startRendering()
|
|
|
|
this.outputs.btnAddAgent.disabled = true
|
|
this.outputs.btnRemoveAgent.disabled = true
|
|
this.outputs.btnSaveKF.disabled = true
|
|
}
|
|
|
|
async onChangeAgent(event){
|
|
if(this.outputs.agentsSelector.value) this.agentPreview.setAgent(this.outputs.agentsSelector.value)
|
|
if(!this.outputs.agentsSelector.value) return
|
|
const agent = await this.models.agents.getProperties(this.outputs.agentsSelector.value)
|
|
this.fillAgentProperties('', agent.atp_props)
|
|
}
|
|
|
|
onclickAgent(aid){
|
|
console.log('Agent clicked:', aid)
|
|
this.updateKfButtons()
|
|
}
|
|
|
|
onAddAgent(event){
|
|
//TODO prevent collisions !
|
|
|
|
const aid = crypto.randomUUIDv7()
|
|
this.output('agentId', `ID: ${aid}`)
|
|
this.kfArena.addAgent(this.outputs.agentsSelector.value, aid, {
|
|
position: {
|
|
x: document.querySelector('[name="position.x"]').value,
|
|
y: document.querySelector('[name="position.y"]').value,
|
|
z: document.querySelector('[name="position.z"]').value,
|
|
}
|
|
})
|
|
this.updateKfButtons()
|
|
}
|
|
|
|
updateKfButtons(){
|
|
if(this.kfArena.agents.length > 0) this.outputs.btnSaveKF.disabled = false
|
|
}
|
|
|
|
fillAgentProperties(aid, agentProps){
|
|
this.outputs.agentProperties.innerHTML = `
|
|
<div data-output="agentId">ID: ${aid}</div>
|
|
`
|
|
this.outputs.agentProperties.append(...this.fieldsFromJSON(agentProps, 'Internal properties'))
|
|
this.outputs.agentProperties.append(...this.fieldsFromJSON({
|
|
"position.x": {
|
|
label: "Position X",
|
|
type: "number",
|
|
default: "0"
|
|
},
|
|
"position.y": {
|
|
label: "Position Y",
|
|
type: "number",
|
|
default: "0"
|
|
},
|
|
"position.z": {
|
|
label: "Position Z",
|
|
type: "number",
|
|
default: "0"
|
|
},
|
|
}, 'Coordinates'))
|
|
this.outputs.agentProperties.append(...this.fieldsFromJSON({
|
|
"speed.x": {
|
|
label: "Speed X",
|
|
type: "number",
|
|
default: "0"
|
|
},
|
|
"speed.y": {
|
|
label: "Speed Y",
|
|
type: "number",
|
|
default: "0"
|
|
},
|
|
"speed.z": {
|
|
label: "Speed Z",
|
|
type: "number",
|
|
default: "0"
|
|
},
|
|
}, 'Speed vector'))
|
|
this.outputs.btnAddAgent.disabled = false
|
|
this.setupRefs()
|
|
}
|
|
|
|
|
|
}
|
|
|
|
app.registerClass('KeyframeView', KeyframeView)
|
|
|