starting KF Editor
This commit is contained in:
STEINNI
@@ -66,19 +66,19 @@
|
||||
{
|
||||
"label": "Keyframe editor",
|
||||
"icon": "icon-camera1",
|
||||
"route": "/records/editor",
|
||||
"route": "/editors/keyframe",
|
||||
"access": ["*"]
|
||||
},
|
||||
{
|
||||
"label": "Sprites editor",
|
||||
"icon": "icon-spaceinvaders",
|
||||
"route": "/records/stats",
|
||||
"route": "/editors/sprites",
|
||||
"access": ["*"]
|
||||
},
|
||||
{
|
||||
"label": "Event-map editor",
|
||||
"label": "Event-maps editor",
|
||||
"icon": "icon-link",
|
||||
"route": "/records/editor",
|
||||
"route": "/editors/eventmaps",
|
||||
"access": ["*"]
|
||||
}
|
||||
]
|
||||
|
||||
@@ -16,7 +16,12 @@
|
||||
"role": [ "*" ],
|
||||
"controller" : "/live/DashboardsController"
|
||||
},
|
||||
{
|
||||
{
|
||||
"url": "/editors",
|
||||
"role": [ "*" ],
|
||||
"controller" : "/editors/EditorsController"
|
||||
},
|
||||
{
|
||||
"url": "/system",
|
||||
"role": "*",
|
||||
"controller" : "/system/systemController"
|
||||
|
||||
@@ -0,0 +1,81 @@
|
||||
class EditorsController extends EICController {
|
||||
|
||||
constructor(params) {
|
||||
super(params)
|
||||
this.arenaConfig = app.Assets.Store.json.arenaConfig
|
||||
this.agentDefs = app.Assets.Store.json.agentDefs
|
||||
this.eventsMapping = app.Assets.Store.json.eventsMapping
|
||||
}
|
||||
|
||||
|
||||
async keyframe() {
|
||||
const models = {
|
||||
agents : new AgentsModel('/agents')
|
||||
}
|
||||
|
||||
// const ttb = new app.LoadedModules.Threetobus({
|
||||
// eventsMapping: this.eventsMapping,
|
||||
// sceneSize: this.arenaConfig.arenaSize,
|
||||
// })
|
||||
// ttb.initScene({
|
||||
// axes: true,
|
||||
// grid: true,
|
||||
// })
|
||||
|
||||
// this.agentDefs = await models.agents.getSprites('Basic 3D')
|
||||
// const a1 = ttb.agentFromJSON('agent42', this.agentDefs.nocode1)
|
||||
// const a2 = ttb.agentFromJSON('agent42', this.agentDefs.nocode2)
|
||||
// ttb.scene.add(a1)
|
||||
// ttb.scene.add(a2)
|
||||
|
||||
//TODO: eventsMapping: address child by suffix in assignations
|
||||
|
||||
|
||||
this.loadWindow(
|
||||
'editors/SpaceView',
|
||||
{
|
||||
title: '<i class="icon-edit"></i> Keyframe edito 3D view',
|
||||
static: true,
|
||||
expanded: false,
|
||||
withSettings: true,
|
||||
windowStyle: this._boxFromPrefs('live.spaceview.3D', { x: 50, y:100, w:600, h:400 }),
|
||||
},
|
||||
{
|
||||
models: models,
|
||||
agentDefs: this.agentDefs,
|
||||
rendererId:'3drenderer',
|
||||
mode: '3D',
|
||||
ttb: ttb,
|
||||
}
|
||||
)
|
||||
|
||||
|
||||
this.loadWindow(
|
||||
'editors/SpaceView',
|
||||
{
|
||||
title: '<i class="icon-edit"></i> Keyframe editor 2D View',
|
||||
static: true,
|
||||
expanded: false,
|
||||
withSettings: true,
|
||||
windowStyle: this._boxFromPrefs('live.spaceview.2D', { x: 500, y:100, w:600, h:400 }),
|
||||
},
|
||||
{
|
||||
models: models,
|
||||
agentDefs: this.agentDefs,
|
||||
rendererId:'2drenderer',
|
||||
mode: '2D',
|
||||
ttb: ttb,
|
||||
}
|
||||
)
|
||||
}
|
||||
|
||||
async sprites() {
|
||||
|
||||
}
|
||||
|
||||
async eventmaps(){
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
app.registerClass('EditorsController', EditorsController);
|
||||
@@ -0,0 +1,46 @@
|
||||
{
|
||||
"routes": [
|
||||
{
|
||||
"url": "/keyframe",
|
||||
"role": [ "*" ],
|
||||
"controller" : "/editors/EditorsController",
|
||||
"method": "keyframe"
|
||||
},
|
||||
{
|
||||
"url": "/sprites",
|
||||
"role": [ "*" ],
|
||||
"controller" : "/editors/EditorsController",
|
||||
"method": "sprites"
|
||||
},
|
||||
{
|
||||
"url": "/eventmaps",
|
||||
"role": [ "*" ],
|
||||
"controller" : "/editors/EditorsController",
|
||||
"method": "eventmaps"
|
||||
}
|
||||
],
|
||||
"models": [
|
||||
"AgentsModel"
|
||||
],
|
||||
"views": [
|
||||
"editors/KeyframeView"
|
||||
],
|
||||
"controllerDependencies": [
|
||||
"/helpers/basicDialogs",
|
||||
"/helpers/validators",
|
||||
"/helpers/activeAttributes",
|
||||
"/thirdparty/Threetobus/three.module",
|
||||
"/thirdparty/Threetobus/OrbitControls.module",
|
||||
"/thirdparty/Threetobus/tween.module",
|
||||
"/thirdparty/Threetobus/threetobus.module"
|
||||
],
|
||||
"assets": {
|
||||
"styles": [
|
||||
],
|
||||
"html": [
|
||||
{ "id":"sapceViewSetting", "name": "sapceViewSetting.html"}
|
||||
],
|
||||
"json": [
|
||||
]
|
||||
}
|
||||
}
|
||||
@@ -39,7 +39,7 @@ class DashboardsController extends EICController {
|
||||
this.loadWindow(
|
||||
'visualisers/SpaceView',
|
||||
{
|
||||
title: '3D view',
|
||||
title: '<i class="icon-bolt"></i> Live arena 3D view',
|
||||
static: true,
|
||||
expanded: false,
|
||||
withSettings: true,
|
||||
@@ -58,7 +58,7 @@ class DashboardsController extends EICController {
|
||||
this.loadWindow(
|
||||
'visualisers/SpaceView',
|
||||
{
|
||||
title: '2D View',
|
||||
title: '<i class="icon-bolt"></i> Live arena 2D View',
|
||||
static: true,
|
||||
expanded: false,
|
||||
withSettings: true,
|
||||
@@ -74,25 +74,7 @@ class DashboardsController extends EICController {
|
||||
)
|
||||
}
|
||||
|
||||
_boxFromPrefs(viewName, defaults){
|
||||
function getPref(path) {
|
||||
return path.split('.').reduce(
|
||||
(acc, key) => acc?.[key],
|
||||
app.User.preferences.windows
|
||||
)
|
||||
}
|
||||
const box = getPref(viewName)
|
||||
let left = box.x ? box.x : defaults.x
|
||||
let top = box.y ? box.y : defaults.y
|
||||
let width = box.w ? box.w : defaults.w
|
||||
let height = box.x ? box.h : defaults.h
|
||||
return({
|
||||
width: `${width}px`,
|
||||
height: `${height}px`,
|
||||
left: `${left}px`,
|
||||
top: `${top}px`,
|
||||
})
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
app.registerClass('DashboardsController', DashboardsController);
|
||||
@@ -0,0 +1,8 @@
|
||||
<style>
|
||||
canvas[data-output="kfeCanvas"]{
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
</style>
|
||||
|
||||
<canvas data-output="kfeCanvas"></canvas>
|
||||
@@ -0,0 +1,50 @@
|
||||
class KeyframeView extends EICDomContent {
|
||||
|
||||
constructor() {
|
||||
super()
|
||||
Object.assign(this, app.helpers.activeAttributes)
|
||||
//this.tileMarkup = app.Assets.Store.html['/app/assets/html/mailing/tile.html']
|
||||
}
|
||||
|
||||
DOMContentFocused(options) {
|
||||
if(this.wasBlured){ // Avoid 2nd refesh on DomContentLoaded
|
||||
//this.refreshyoustuff()
|
||||
}
|
||||
this.wasBlured = false
|
||||
}
|
||||
|
||||
DOMContentBlured(options) { this.wasBlured = true }
|
||||
|
||||
DOMContentLoaded(options) {
|
||||
this.windowPrefsId = `editors.keyframeview.${options.mode}`
|
||||
for(let model in options.models) this[model] = options.models[model]
|
||||
this.kfe = options.kfe
|
||||
const components = ui.eicfy(this.el)
|
||||
this.setupTriggers(components)
|
||||
this.setupRefs(components)
|
||||
this.renderingEngine = this.kfe.startRendering(this.outputs.kfeCanvas, options.mode)
|
||||
this.output('settingsMenu',app.Assets.Store.html.sapceViewSetting)
|
||||
this.outputs.settingsMenu.querySelectorAll('input[type="toggler"]').forEach(el => {
|
||||
const tog = new InputToggler(el)
|
||||
if(this.kfe[tog._el.name].layers){
|
||||
tog.value = this.renderingEngine.camera.layers.test(this.kfe[tog._el.name].layers) ? 'yes' : 'no'
|
||||
}
|
||||
tog.onToggle = this.settingsToggle.bind(this)
|
||||
})
|
||||
}
|
||||
|
||||
settingsToggle(value, object){
|
||||
if(['grid','axes'].includes(object._el.name)){
|
||||
const layerId = {'grid':1,'axes':2}[object._el.name]
|
||||
if(value=='yes'){
|
||||
this.renderingEngine.camera.layers.enable(layerId)
|
||||
} else {
|
||||
this.renderingEngine.camera.layers.disable(layerId)
|
||||
}
|
||||
}
|
||||
//TODO save & restore in prefs
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
app.registerClass('KeyframeView', KeyframeView)
|
||||
@@ -1,9 +1,4 @@
|
||||
<style>
|
||||
article.mainDashboard{ height:100%; }
|
||||
article.mainDashboard>section:first-of-type{
|
||||
height:100%;
|
||||
background-color: #333;
|
||||
}
|
||||
canvas[data-output="ttbCanvas"]{
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
|
||||
Reference in New Issue
Block a user