Editors to react
This commit is contained in:
parent
67082c9cd3
commit
a8f6fa9dc6
@ -1,7 +1,7 @@
|
|||||||
import scientifik.fx
|
import scientifik.fx
|
||||||
import scientifik.serialization
|
import scientifik.serialization
|
||||||
|
|
||||||
val dataforgeVersion by extra("0.1.5")
|
val dataforgeVersion by extra("0.1.6-dev")
|
||||||
|
|
||||||
plugins {
|
plugins {
|
||||||
val toolsVersion = "0.4.0"
|
val toolsVersion = "0.4.0"
|
||||||
|
@ -3,11 +3,13 @@ package hep.dataforge.vis
|
|||||||
import hep.dataforge.meta.Laminate
|
import hep.dataforge.meta.Laminate
|
||||||
import hep.dataforge.meta.Meta
|
import hep.dataforge.meta.Meta
|
||||||
import hep.dataforge.meta.MetaItem
|
import hep.dataforge.meta.MetaItem
|
||||||
|
import hep.dataforge.meta.descriptors.NodeDescriptor
|
||||||
import hep.dataforge.meta.scheme.Configurable
|
import hep.dataforge.meta.scheme.Configurable
|
||||||
import hep.dataforge.names.Name
|
import hep.dataforge.names.Name
|
||||||
import hep.dataforge.names.asName
|
import hep.dataforge.names.asName
|
||||||
import hep.dataforge.names.toName
|
import hep.dataforge.names.toName
|
||||||
import hep.dataforge.provider.Type
|
import hep.dataforge.provider.Type
|
||||||
|
import hep.dataforge.values.ValueType
|
||||||
import hep.dataforge.vis.VisualObject.Companion.TYPE
|
import hep.dataforge.vis.VisualObject.Companion.TYPE
|
||||||
import kotlinx.serialization.Transient
|
import kotlinx.serialization.Transient
|
||||||
|
|
||||||
|
@ -1,6 +1,5 @@
|
|||||||
package hep.dataforge.vis.editor
|
package hep.dataforge.vis.editor
|
||||||
|
|
||||||
import hep.dataforge.js.initState
|
|
||||||
import hep.dataforge.meta.*
|
import hep.dataforge.meta.*
|
||||||
import hep.dataforge.meta.descriptors.NodeDescriptor
|
import hep.dataforge.meta.descriptors.NodeDescriptor
|
||||||
import hep.dataforge.meta.descriptors.defaultItem
|
import hep.dataforge.meta.descriptors.defaultItem
|
||||||
@ -14,8 +13,12 @@ import kotlinx.html.classes
|
|||||||
import kotlinx.html.js.onChangeFunction
|
import kotlinx.html.js.onChangeFunction
|
||||||
import kotlinx.html.js.onClickFunction
|
import kotlinx.html.js.onClickFunction
|
||||||
import org.w3c.dom.Element
|
import org.w3c.dom.Element
|
||||||
import react.*
|
import org.w3c.dom.events.Event
|
||||||
|
import react.RBuilder
|
||||||
|
import react.RComponent
|
||||||
|
import react.RProps
|
||||||
import react.dom.*
|
import react.dom.*
|
||||||
|
import react.setState
|
||||||
|
|
||||||
interface ConfigEditorProps : RProps {
|
interface ConfigEditorProps : RProps {
|
||||||
/**
|
/**
|
||||||
@ -61,6 +64,13 @@ class ConfigEditorComponent : RComponent<ConfigEditorProps, TreeState>() {
|
|||||||
props.root.removeListener(this)
|
props.root.removeListener(this)
|
||||||
}
|
}
|
||||||
|
|
||||||
|
private val onClick: (Event) -> Unit = {
|
||||||
|
setState {
|
||||||
|
expanded = !expanded
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
override fun RBuilder.render() {
|
override fun RBuilder.render() {
|
||||||
val item = props.root[props.name]
|
val item = props.root[props.name]
|
||||||
val descriptorItem = props.descriptor?.get(props.name)
|
val descriptorItem = props.descriptor?.get(props.name)
|
||||||
@ -81,11 +91,7 @@ class ConfigEditorComponent : RComponent<ConfigEditorProps, TreeState>() {
|
|||||||
if (state.expanded) {
|
if (state.expanded) {
|
||||||
classes += "rotate"
|
classes += "rotate"
|
||||||
}
|
}
|
||||||
onClickFunction = {
|
onClickFunction = onClick
|
||||||
setState {
|
|
||||||
expanded = !expanded
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -1,14 +1,17 @@
|
|||||||
package hep.dataforge.vis.editor
|
package hep.dataforge.vis.editor
|
||||||
|
|
||||||
import hep.dataforge.js.initState
|
|
||||||
import hep.dataforge.meta.Meta
|
import hep.dataforge.meta.Meta
|
||||||
import hep.dataforge.meta.MetaItem
|
import hep.dataforge.meta.MetaItem
|
||||||
import hep.dataforge.meta.descriptors.NodeDescriptor
|
import hep.dataforge.meta.descriptors.NodeDescriptor
|
||||||
import hep.dataforge.names.NameToken
|
import hep.dataforge.names.NameToken
|
||||||
import kotlinx.html.classes
|
import kotlinx.html.classes
|
||||||
import kotlinx.html.js.onClickFunction
|
import kotlinx.html.js.onClickFunction
|
||||||
import react.*
|
import org.w3c.dom.events.Event
|
||||||
|
import react.RBuilder
|
||||||
|
import react.RComponent
|
||||||
|
import react.RProps
|
||||||
import react.dom.*
|
import react.dom.*
|
||||||
|
import react.setState
|
||||||
|
|
||||||
interface MetaViewerProps : RProps {
|
interface MetaViewerProps : RProps {
|
||||||
var name: NameToken
|
var name: NameToken
|
||||||
@ -22,21 +25,21 @@ class MetaViewerComponent : RComponent<MetaViewerProps, TreeState>() {
|
|||||||
expanded = false
|
expanded = false
|
||||||
}
|
}
|
||||||
|
|
||||||
|
private val onClick: (Event) -> Unit = {
|
||||||
|
setState {
|
||||||
|
expanded = !expanded
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
override fun RBuilder.render() {
|
override fun RBuilder.render() {
|
||||||
div("d-inline-block text-truncate") {
|
div("d-inline-block text-truncate") {
|
||||||
if (props.meta.items.isNotEmpty()) {
|
if (props.meta.items.isNotEmpty()) {
|
||||||
span("objTree-caret") {
|
span("objTree-caret") {
|
||||||
attrs {
|
attrs {
|
||||||
classes = if (state.expanded) {
|
if (state.expanded) {
|
||||||
setOf("objTree-caret", "objTree-caret-down")
|
classes += "objTree-caret-down"
|
||||||
} else {
|
|
||||||
setOf("objTree-caret")
|
|
||||||
}
|
|
||||||
onClickFunction = {
|
|
||||||
setState {
|
|
||||||
expanded = !expanded
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
onClickFunction = onClick
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -8,6 +8,7 @@ import hep.dataforge.vis.isEmpty
|
|||||||
import kotlinx.html.classes
|
import kotlinx.html.classes
|
||||||
import kotlinx.html.js.onClickFunction
|
import kotlinx.html.js.onClickFunction
|
||||||
import org.w3c.dom.Element
|
import org.w3c.dom.Element
|
||||||
|
import org.w3c.dom.events.Event
|
||||||
import react.*
|
import react.*
|
||||||
import react.dom.*
|
import react.dom.*
|
||||||
|
|
||||||
@ -27,6 +28,12 @@ class ObjectTreeComponent : RComponent<ObjectTreeProps, TreeState>() {
|
|||||||
expanded = false
|
expanded = false
|
||||||
}
|
}
|
||||||
|
|
||||||
|
private val onClick: (Event) -> Unit = {
|
||||||
|
setState {
|
||||||
|
expanded = !expanded
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
override fun RBuilder.render() {
|
override fun RBuilder.render() {
|
||||||
val token = props.name.last()?.toString() ?: "World"
|
val token = props.name.last()?.toString() ?: "World"
|
||||||
val obj = props.obj
|
val obj = props.obj
|
||||||
@ -36,16 +43,10 @@ class ObjectTreeComponent : RComponent<ObjectTreeProps, TreeState>() {
|
|||||||
div("d-inline-block text-truncate") {
|
div("d-inline-block text-truncate") {
|
||||||
span("objTree-caret") {
|
span("objTree-caret") {
|
||||||
attrs {
|
attrs {
|
||||||
classes = if (state.expanded) {
|
if (state.expanded) {
|
||||||
setOf("objTree-caret", "objTree-caret-down")
|
classes += "objTree-caret-down"
|
||||||
} else {
|
|
||||||
setOf("objTree-caret")
|
|
||||||
}
|
|
||||||
onClickFunction = {
|
|
||||||
setState {
|
|
||||||
expanded = !expanded
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
onClickFunction = onClick
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
label("objTree-label") {
|
label("objTree-label") {
|
||||||
|
@ -2,6 +2,7 @@ package hep.dataforge.vis.editor
|
|||||||
|
|
||||||
import hep.dataforge.meta.Meta
|
import hep.dataforge.meta.Meta
|
||||||
import hep.dataforge.meta.MetaBuilder
|
import hep.dataforge.meta.MetaBuilder
|
||||||
|
import hep.dataforge.meta.descriptors.NodeDescriptor
|
||||||
import hep.dataforge.names.Name
|
import hep.dataforge.names.Name
|
||||||
import hep.dataforge.names.isEmpty
|
import hep.dataforge.names.isEmpty
|
||||||
import hep.dataforge.vis.VisualObject
|
import hep.dataforge.vis.VisualObject
|
||||||
@ -74,8 +75,10 @@ import kotlin.collections.set
|
|||||||
fun RBuilder.visualPropertyEditor(
|
fun RBuilder.visualPropertyEditor(
|
||||||
path: Name,
|
path: Name,
|
||||||
item: VisualObject,
|
item: VisualObject,
|
||||||
|
descriptor: NodeDescriptor? = item.descriptor,
|
||||||
|
title: String = "Properties",
|
||||||
default: MetaBuilder.() -> Unit = {}
|
default: MetaBuilder.() -> Unit = {}
|
||||||
): ReactElement = card("Properties") {
|
): ReactElement = card(title) {
|
||||||
if (!path.isEmpty()) {
|
if (!path.isEmpty()) {
|
||||||
nav {
|
nav {
|
||||||
attrs {
|
attrs {
|
||||||
@ -90,13 +93,15 @@ fun RBuilder.visualPropertyEditor(
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
configEditor(item.config, item.descriptor, Meta(default))
|
configEditor(item.config, descriptor, Meta(default))
|
||||||
}
|
}
|
||||||
|
|
||||||
fun Element.visualPropertyEditor(
|
fun Element.visualPropertyEditor(
|
||||||
path: Name,
|
path: Name,
|
||||||
item: VisualObject,
|
item: VisualObject,
|
||||||
|
descriptor: NodeDescriptor? = item.descriptor,
|
||||||
|
title: String = "Properties",
|
||||||
default: MetaBuilder.() -> Unit = {}
|
default: MetaBuilder.() -> Unit = {}
|
||||||
) = render(this) {
|
) = render(this) {
|
||||||
visualPropertyEditor(path, item, default)
|
visualPropertyEditor(path, item, descriptor, title, default)
|
||||||
}
|
}
|
@ -3,10 +3,13 @@
|
|||||||
package hep.dataforge.vis.spatial
|
package hep.dataforge.vis.spatial
|
||||||
|
|
||||||
import hep.dataforge.meta.*
|
import hep.dataforge.meta.*
|
||||||
|
import hep.dataforge.meta.descriptors.NodeDescriptor
|
||||||
|
import hep.dataforge.meta.scheme.node
|
||||||
import hep.dataforge.meta.scheme.setProperty
|
import hep.dataforge.meta.scheme.setProperty
|
||||||
import hep.dataforge.names.asName
|
import hep.dataforge.names.asName
|
||||||
import hep.dataforge.names.plus
|
import hep.dataforge.names.plus
|
||||||
import hep.dataforge.output.Renderer
|
import hep.dataforge.output.Renderer
|
||||||
|
import hep.dataforge.values.ValueType
|
||||||
import hep.dataforge.values.asValue
|
import hep.dataforge.values.asValue
|
||||||
import hep.dataforge.vis.VisualObject
|
import hep.dataforge.vis.VisualObject
|
||||||
import hep.dataforge.vis.spatial.VisualObject3D.Companion.DETAIL_KEY
|
import hep.dataforge.vis.spatial.VisualObject3D.Companion.DETAIL_KEY
|
||||||
@ -26,7 +29,8 @@ interface VisualObject3D : VisualObject {
|
|||||||
companion object {
|
companion object {
|
||||||
|
|
||||||
val VISIBLE_KEY = "visible".asName()
|
val VISIBLE_KEY = "visible".asName()
|
||||||
// val SELECTED_KEY = "selected".asName()
|
|
||||||
|
// val SELECTED_KEY = "selected".asName()
|
||||||
val DETAIL_KEY = "detail".asName()
|
val DETAIL_KEY = "detail".asName()
|
||||||
val LAYER_KEY = "layer".asName()
|
val LAYER_KEY = "layer".asName()
|
||||||
val IGNORE_KEY = "ignore".asName()
|
val IGNORE_KEY = "ignore".asName()
|
||||||
@ -56,6 +60,20 @@ interface VisualObject3D : VisualObject {
|
|||||||
val xScale = scale + x
|
val xScale = scale + x
|
||||||
val yScale = scale + y
|
val yScale = scale + y
|
||||||
val zScale = scale + z
|
val zScale = scale + z
|
||||||
|
|
||||||
|
val descriptor = NodeDescriptor {
|
||||||
|
defineValue(VISIBLE_KEY) {
|
||||||
|
type(ValueType.BOOLEAN)
|
||||||
|
default(true)
|
||||||
|
}
|
||||||
|
|
||||||
|
defineItem(Material3D.MATERIAL_KEY, Material3D.descriptor)
|
||||||
|
|
||||||
|
// Material3D.MATERIAL_COLOR_KEY put "#ffffff"
|
||||||
|
// Material3D.MATERIAL_OPACITY_KEY put 1.0
|
||||||
|
// Material3D.MATERIAL_WIREFRAME_KEY put false
|
||||||
|
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -106,7 +124,7 @@ var VisualObject.visible: Boolean?
|
|||||||
* Property is not inherited.
|
* Property is not inherited.
|
||||||
*/
|
*/
|
||||||
var VisualObject.ignore: Boolean?
|
var VisualObject.ignore: Boolean?
|
||||||
get() = getProperty(IGNORE_KEY,false).boolean
|
get() = getProperty(IGNORE_KEY, false).boolean
|
||||||
set(value) = setProperty(IGNORE_KEY, value?.asValue())
|
set(value) = setProperty(IGNORE_KEY, value?.asValue())
|
||||||
|
|
||||||
//var VisualObject.selected: Boolean?
|
//var VisualObject.selected: Boolean?
|
||||||
|
Loading…
Reference in New Issue
Block a user