kscience/visionforge
8
1
Fork 1
Code Issues Pull Requests Packages Projects Releases 3 Wiki Activity

Design update

Browse Source
This commit is contained in:
Alexander Nozik 2020-04-18 21:57:15 +03:00
parent 28ca287ccd
commit 38db0e30ed
2 changed files with 43 additions and 26 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

43
dataforge-vis-common/src/jsMain/kotlin/hep/dataforge/vis/editor/ConfigEditorComponent.kt
View File

@ -7,6 +7,7 @@ import hep.dataforge.names.NameToken
import hep.dataforge.names.plus import hep.dataforge.names.plus
import hep.dataforge.values.* import hep.dataforge.values.*
import hep.dataforge.vis.widgetType import hep.dataforge.vis.widgetType
import kotlinx.html.ButtonType
import kotlinx.html.InputType import kotlinx.html.InputType
import kotlinx.html.classes import kotlinx.html.classes
import kotlinx.html.js.onChangeFunction import kotlinx.html.js.onChangeFunction
@ -94,12 +95,14 @@ class ConfigEditorComponent : RComponent<ConfigEditorProps, TreeState>() {
private fun RBuilder.valueChooser(value: Value, descriptor: ValueDescriptor?) { private fun RBuilder.valueChooser(value: Value, descriptor: ValueDescriptor?) {
val type = descriptor?.type?.firstOrNull() val type = descriptor?.type?.firstOrNull()
when { when {
type == ValueType.BOOLEAN -> input(type = InputType.checkBox, classes = "float-right") { type == ValueType.BOOLEAN -> {
input(type = InputType.checkBox, classes = "float-right") {
attrs { attrs {
defaultChecked = value.boolean defaultChecked = value.boolean
onChangeFunction = onValueChange onChangeFunction = onValueChange
} }
} }
}
type == ValueType.NUMBER -> input(type = InputType.number, classes = "float-right") { type == ValueType.NUMBER -> input(type = InputType.number, classes = "float-right") {
attrs { attrs {
descriptor.attributes["step"].string?.let { descriptor.attributes["step"].string?.let {
@ -152,7 +155,7 @@ class ConfigEditorComponent : RComponent<ConfigEditorProps, TreeState>() {
when (actualItem) { when (actualItem) {
is MetaItem.NodeItem -> { is MetaItem.NodeItem -> {
div("d-block text-truncate") { div {
span("tree-caret") { span("tree-caret") {
attrs { attrs {
if (state.expanded) { if (state.expanded) {
@ -184,8 +187,8 @@ class ConfigEditorComponent : RComponent<ConfigEditorProps, TreeState>() {
li("tree-item") { li("tree-item") {
child(ConfigEditorComponent::class) { child(ConfigEditorComponent::class) {
attrs { attrs {
root = props.root this.root = props.root
name = props.name + token this.name = props.name + token
this.default = props.default this.default = props.default
this.descriptor = props.descriptor this.descriptor = props.descriptor
} }
@ -196,7 +199,7 @@ class ConfigEditorComponent : RComponent<ConfigEditorProps, TreeState>() {
} }
} }
is MetaItem.ValueItem -> { is MetaItem.ValueItem -> {
div("d-block text-truncate") { div {
div("row") { div("row") {
div("col") { div("col") {
p("tree-label") { p("tree-label") {
@ -208,22 +211,36 @@ class ConfigEditorComponent : RComponent<ConfigEditorProps, TreeState>() {
} }
} }
} }
if (item != null) { div("col") {
div("col-auto") { valueChooser(actualItem.value, descriptorItem as? ValueDescriptor)
button(classes = "btn btn-default") {
span("glyphicon glyphicon-remove") {
attrs {
attributes["aria-hidden"] = "true"
} }
div("col-auto") {
div("dropleft p-0") {
button(classes = "btn btn-outline-primary") {
attrs {
type = ButtonType.button
attributes["data-toggle"] = "dropdown"
attributes["aria-haspopup"] = "true"
attributes["aria-expanded"] = "false"
attributes["data-boundary"] = "viewport"
}
+"\u22ee"
}
div(classes = "dropdown-menu") {
button(classes = "btn btn-outline dropdown-item") {
+"Info"
}
if (item != null) {
button(classes = "btn btn-outline dropdown-item") {
+"""Clear"""
} }
attrs { attrs {
onClickFunction = removeValue onClickFunction = removeValue
} }
} }
} }
} }
div("col") {
valueChooser(actualItem.value, descriptorItem as? ValueDescriptor)
} }
} }
} }

8
dataforge-vis-common/src/jsMain/kotlin/hep/dataforge/vis/editor/ObjectTree.kt
View File

@ -50,7 +50,7 @@ private fun RBuilder.objectTree(props: ObjectTreeProps): Unit {
//display as node if any child is visible //display as node if any child is visible
if (obj is VisualGroup) { if (obj is VisualGroup) {
div("d-inline-block text-truncate") { div("d-block text-truncate") {
if (obj.children.any { !it.key.body.startsWith("@") }) { if (obj.children.any { !it.key.body.startsWith("@") }) {
span("tree-caret") { span("tree-caret") {
attrs { attrs {
@ -72,10 +72,10 @@ private fun RBuilder.objectTree(props: ObjectTreeProps): Unit {
li("tree-item") { li("tree-item") {
child(ObjectTree) { child(ObjectTree) {
attrs { attrs {
name = props.name + childToken this.name = props.name + childToken
this.obj = child this.obj = child
this.selected = props.selected this.selected = props.selected
clickCallback = props.clickCallback this.clickCallback = props.clickCallback
} }
} }
} }
@ -83,7 +83,7 @@ private fun RBuilder.objectTree(props: ObjectTreeProps): Unit {
} }
} }
} else { } else {
div("d-inline-block text-truncate") { div("d-block text-truncate") {
span("tree-leaf") {} span("tree-leaf") {}
treeLabel(token) treeLabel(token)
} }