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