Add Trapezioid and scaled to root converter

This commit is contained in:
Alexander Nozik 2021-09-14 14:02:36 +03:00
parent 44c4356794
commit 0ec9033702
29 changed files with 153 additions and 27004 deletions

View File

@ -1,7 +1,7 @@
plugins { plugins {
id("ru.mipt.npm.gradle.project") id("ru.mipt.npm.gradle.project")
kotlin("multiplatform") version "1.5.30" apply false // kotlin("multiplatform") version "1.5.30" apply false
kotlin("js") version "1.5.30" apply false // kotlin("js") version "1.5.30" apply false
} }
val dataforgeVersion by extra("0.5.1") val dataforgeVersion by extra("0.5.1")

View File

@ -85,13 +85,23 @@ public class DGeoVolume(meta: Meta, refCache: DObjectCache) : DNamed(meta, refCa
public val fFillColor: Int? by meta.int() public val fFillColor: Int? by meta.int()
override val name: Name by lazy { Name.parse(fName.ifEmpty { "volume[${meta.hashCode().toUInt()}]" }) } override val name: Name by lazy { Name.parse(fName.ifEmpty { "volume[${meta.hashCode().toUInt()}]" }) }
public val numberOfChildren: Int by lazy {
fNodes.sumOf { (it.fVolume?.numberOfChildren ?: 0) + 1 }
}
} }
public class DGeoNode(meta: Meta, refCache: DObjectCache) : DNamed(meta, refCache) { public class DGeoNode(meta: Meta, refCache: DObjectCache) : DNamed(meta, refCache) {
public val fVolume: DGeoVolume? by dObject(::DGeoVolume) public val fVolume: DGeoVolume? by dObject(::DGeoVolume)
} }
public class DGeoMatrix(meta: Meta, refCache: DObjectCache) : DNamed(meta, refCache) { public open class DGeoMatrix(meta: Meta, refCache: DObjectCache) : DNamed(meta, refCache)
public open class DGeoScale(meta: Meta, refCache: DObjectCache) : DGeoMatrix(meta, refCache) {
public val fScale: DoubleArray by meta.doubleArray(1.0, 1.0, 1.0)
public val x: Double get() = fScale[0]
public val y: Double get() = fScale[1]
public val z: Double get() = fScale[2]
} }

View File

@ -182,6 +182,7 @@ private fun SolidGroup.addShape(
} }
} }
"TGeoPgon" -> { "TGeoPgon" -> {
//TODO add a inner polygone layer
val fDphi by shape.meta.double(0.0) val fDphi by shape.meta.double(0.0)
val fNz by shape.meta.int(2) val fNz by shape.meta.int(2)
val fPhi1 by shape.meta.double(360.0) val fPhi1 by shape.meta.double(360.0)
@ -219,6 +220,44 @@ private fun SolidGroup.addShape(
"TGeoBBox" -> { "TGeoBBox" -> {
box(shape.fDX * 2, shape.fDY * 2, shape.fDZ * 2, name = name, block = block) box(shape.fDX * 2, shape.fDY * 2, shape.fDZ * 2, name = name, block = block)
} }
"TGeoTrap" -> {
val fTheta by shape.meta.double(0.0)
val fPhi by shape.meta.double(0.0)
val fAlpha1 by shape.meta.double(0.0)
val fAlpha2 by shape.meta.double(0.0)
if (fAlpha1 != 0.0 || fAlpha2 != 0.0 || fTheta != 0.0 || fPhi != 0.0) {
TODO("Angled trapezoid not implemented")
}
val fH1 by shape.meta.double(0.0)
val fBl1 by shape.meta.double(0.0)
val fTl1 by shape.meta.double(0.0)
val fH2 by shape.meta.double(0.0)
val fBl2 by shape.meta.double(0.0)
val fTl2 by shape.meta.double(0.0)
val fDz by shape.meta.double(0.0)
//TODO check proper node order
val node1 = Point3D(-fBl1, -fH1, -fDz)
val node2 = Point3D(fBl1, -fH1, -fDz)
val node3 = Point3D(fTl1, fH1, -fDz)
val node4 = Point3D(-fTl1, fH1, -fDz)
val node5 = Point3D(-fBl2, -fH2, fDz)
val node6 = Point3D(fBl2, -fH2, fDz)
val node7 = Point3D(fTl2, fH2, fDz)
val node8 = Point3D(-fTl2, fH2, fDz)
hexagon(node1, node2, node3, node4, node5, node6, node7, node8, name)
}
"TGeoScaledShape" -> {
val fShape by shape.dObject(::DGeoShape)
val fScale by shape.dObject(::DGeoScale)
fShape?.let { scaledShape ->
group(name?.let { Name.parse(it) }) {
scale = Point3D(fScale?.x ?: 1.0, fScale?.y ?: 1.0, fScale?.z ?: 1.0)
addShape(scaledShape, context)
apply(block)
}
}
}
else -> { else -> {
TODO("A shape with type ${shape.typename} not implemented") TODO("A shape with type ${shape.typename} not implemented")
} }

View File

@ -6,8 +6,8 @@ package drop
import org.w3c.dom.DragEvent import org.w3c.dom.DragEvent
import org.w3c.files.FileList import org.w3c.files.FileList
import react.Component import react.Component
import react.RProps import react.Props
import react.RState import react.State
external enum class DropEffects { external enum class DropEffects {
copy, copy,
@ -16,7 +16,7 @@ external enum class DropEffects {
none none
} }
external interface FileDropProps: RProps { external interface FileDropProps: Props {
var className: String? var className: String?
var targetClassName: String? var targetClassName: String?
var draggingOverFrameClassName: String? var draggingOverFrameClassName: String?
@ -32,7 +32,7 @@ external interface FileDropProps: RProps {
var dropEffect: DropEffects? var dropEffect: DropEffects?
} }
external interface FileDropState: RState { external interface FileDropState: State {
var draggingOverFrame: Boolean var draggingOverFrame: Boolean
var draggingOverTarget: Boolean var draggingOverTarget: Boolean
} }

View File

@ -7,8 +7,11 @@ import kotlinx.css.*
import org.w3c.files.File import org.w3c.files.File
import org.w3c.files.FileReader import org.w3c.files.FileReader
import org.w3c.files.get import org.w3c.files.get
import react.* import react.RProps
import react.dom.h2 import react.dom.h2
import react.functionComponent
import react.useMemo
import react.useState
import space.kscience.dataforge.context.Context import space.kscience.dataforge.context.Context
import space.kscience.dataforge.context.fetch import space.kscience.dataforge.context.fetch
import space.kscience.dataforge.names.Name import space.kscience.dataforge.names.Name
@ -31,7 +34,7 @@ external interface GDMLAppProps : RProps {
} }
@JsExport @JsExport
val GDMLApp = functionalComponent<GDMLAppProps>("GDMLApp") { props -> val GDMLApp = functionComponent<GDMLAppProps>("GDMLApp") { props ->
val visionManager = useMemo(props.context) { props.context.fetch(Solids).visionManager } val visionManager = useMemo(props.context) { props.context.fetch(Solids).visionManager }
var deferredVision: Deferred<Solid?> by useState { var deferredVision: Deferred<Solid?> by useState {
CompletableDeferred(props.vision) CompletableDeferred(props.vision)

View File

@ -3,8 +3,7 @@ import kotlinx.coroutines.isActive
import kotlinx.coroutines.launch import kotlinx.coroutines.launch
import kotlinx.css.* import kotlinx.css.*
import react.RProps import react.RProps
import react.child import react.functionComponent
import react.functionalComponent
import space.kscience.dataforge.context.Context import space.kscience.dataforge.context.Context
import space.kscience.plotly.layout import space.kscience.plotly.layout
import space.kscience.plotly.models.Trace import space.kscience.plotly.models.Trace
@ -21,7 +20,7 @@ external interface DemoProps : RProps {
var context: Context var context: Context
} }
val GravityDemo = functionalComponent<DemoProps> { props -> val GravityDemo = functionComponent<DemoProps> { props ->
val velocityTrace = Trace{ val velocityTrace = Trace{
name = "velocity" name = "velocity"
} }

View File

@ -7,7 +7,7 @@ import org.intellij.markdown.flavours.gfm.GFMFlavourDescriptor
import org.w3c.dom.Element import org.w3c.dom.Element
import org.w3c.dom.HTMLElement import org.w3c.dom.HTMLElement
import react.RProps import react.RProps
import react.functionalComponent import react.functionComponent
import react.useEffect import react.useEffect
import react.useRef import react.useRef
import space.kscience.visionforge.markup.VisionOfMarkup import space.kscience.visionforge.markup.VisionOfMarkup
@ -20,7 +20,7 @@ external interface MarkupProps : RProps {
var markup: VisionOfMarkup? var markup: VisionOfMarkup?
} }
val Markup = functionalComponent<MarkupProps>("Markup") { props -> val Markup = functionComponent<MarkupProps>("Markup") { props ->
val elementRef = useRef<Element>(null) val elementRef = useRef<Element>(null)
useEffect(props.markup, elementRef) { useEffect(props.markup, elementRef) {

View File

@ -14,7 +14,7 @@ external interface PlotlyProps : RProps {
} }
val Plotly = functionalComponent<PlotlyProps>("Plotly") { props -> val Plotly = functionComponent<PlotlyProps>("Plotly") { props ->
val elementRef = useRef<Element>(null) val elementRef = useRef<Element>(null)
useEffect(props.plot, elementRef) { useEffect(props.plot, elementRef) {

View File

@ -7,10 +7,13 @@ import kotlinx.coroutines.DelicateCoroutinesApi
import kotlinx.coroutines.launch import kotlinx.coroutines.launch
import kotlinx.css.* import kotlinx.css.*
import kotlinx.html.js.onClickFunction import kotlinx.html.js.onClickFunction
import react.* import react.RProps
import react.dom.attrs import react.dom.attrs
import react.dom.button import react.dom.button
import react.dom.p import react.dom.p
import react.functionComponent
import react.useMemo
import react.useState
import space.kscience.dataforge.context.Context import space.kscience.dataforge.context.Context
import space.kscience.dataforge.names.Name import space.kscience.dataforge.names.Name
import space.kscience.visionforge.react.flexColumn import space.kscience.visionforge.react.flexColumn
@ -34,7 +37,7 @@ external interface MMAppProps : RProps {
@OptIn(DelicateCoroutinesApi::class) @OptIn(DelicateCoroutinesApi::class)
@JsExport @JsExport
val MMApp = functionalComponent<MMAppProps>("Muon monitor") { props -> val MMApp = functionComponent<MMAppProps>("Muon monitor") { props ->
val mmOptions = useMemo { val mmOptions = useMemo {
Canvas3DOptions { Canvas3DOptions {

View File

@ -10,6 +10,7 @@ import space.kscience.dataforge.meta.isLeaf
import space.kscience.dataforge.values.string import space.kscience.dataforge.values.string
import space.kscience.visionforge.solid.Solids import space.kscience.visionforge.solid.Solids
import java.nio.file.Paths import java.nio.file.Paths
import java.util.zip.ZipInputStream
import kotlin.io.path.writeText import kotlin.io.path.writeText
@ -25,8 +26,11 @@ fun main() {
plugin(Solids) plugin(Solids)
} }
val string = TGeoManager::class.java.getResourceAsStream("/root/BM@N.root.json")!!
.readAllBytes().decodeToString() val string = ZipInputStream(TGeoManager::class.java.getResourceAsStream("/root/BM@N_geometry.zip")!!).use {
it.nextEntry
it.readAllBytes().decodeToString()
}
val geo = DGeoManager.parse(string) val geo = DGeoManager.parse(string)
@ -50,7 +54,6 @@ fun main() {
} }
/* SolidGroup { /* SolidGroup {
set( set(
"Coil", "Coil",

File diff suppressed because it is too large Load Diff

View File

@ -1,8 +1,9 @@
pluginManagement { pluginManagement {
val toolsVersion = "0.10.2" val toolsVersion = "0.10.3"
repositories { repositories {
mavenLocal()
maven("https://repo.kotlin.link") maven("https://repo.kotlin.link")
mavenCentral() mavenCentral()
gradlePluginPortal() gradlePluginPortal()
@ -19,6 +20,7 @@ pluginManagement {
rootProject.name = "visionforge" rootProject.name = "visionforge"
enableFeaturePreview("TYPESAFE_PROJECT_ACCESSORS") enableFeaturePreview("TYPESAFE_PROJECT_ACCESSORS")
enableFeaturePreview("VERSION_CATALOGS")
include( include(
// ":ui", // ":ui",

View File

@ -9,9 +9,12 @@ import kotlinx.html.js.onClickFunction
import org.w3c.dom.events.Event import org.w3c.dom.events.Event
import org.w3c.files.Blob import org.w3c.files.Blob
import org.w3c.files.BlobPropertyBag import org.w3c.files.BlobPropertyBag
import react.* import react.FunctionComponent
import react.RBuilder
import react.RProps
import react.dom.attrs import react.dom.attrs
import react.dom.button import react.dom.button
import react.functionComponent
import space.kscience.dataforge.meta.withDefault import space.kscience.dataforge.meta.withDefault
import space.kscience.visionforge.Vision import space.kscience.visionforge.Vision
import space.kscience.visionforge.encodeToString import space.kscience.visionforge.encodeToString
@ -30,8 +33,8 @@ private fun saveData(event: Event, fileName: String, mimeType: String = "text/pl
fileSaver.saveAs(blob, fileName) fileSaver.saveAs(blob, fileName)
} }
public fun RBuilder.canvasControls(canvasOptions: Canvas3DOptions, vision: Vision?): ReactElement { public fun RBuilder.canvasControls(canvasOptions: Canvas3DOptions, vision: Vision?) {
return child(CanvasControls) { child(CanvasControls) {
attrs { attrs {
this.canvasOptions = canvasOptions this.canvasOptions = canvasOptions
this.vision = vision this.vision = vision
@ -44,7 +47,7 @@ public external interface CanvasControlsProps : RProps {
public var vision: Vision? public var vision: Vision?
} }
public val CanvasControls: FunctionComponent<CanvasControlsProps> = functionalComponent("CanvasControls") { props -> public val CanvasControls: FunctionComponent<CanvasControlsProps> = functionComponent("CanvasControls") { props ->
flexColumn { flexColumn {
flexRow { flexRow {
css { css {

View File

@ -5,7 +5,6 @@ import kotlinx.html.DIV
import kotlinx.html.id import kotlinx.html.id
import kotlinx.html.js.onClickFunction import kotlinx.html.js.onClickFunction
import react.RBuilder import react.RBuilder
import react.ReactElement
import react.dom.* import react.dom.*
import space.kscience.dataforge.names.Name import space.kscience.dataforge.names.Name
import space.kscience.dataforge.names.NameToken import space.kscience.dataforge.names.NameToken
@ -16,7 +15,7 @@ import styled.styledDiv
import styled.styledNav import styled.styledNav
public inline fun RBuilder.card(title: String, crossinline block: StyledDOMBuilder<DIV>.() -> Unit): ReactElement = public inline fun RBuilder.card(title: String, crossinline block: StyledDOMBuilder<DIV>.() -> Unit): Unit =
styledDiv { styledDiv {
css { css {
+"card" +"card"
@ -36,7 +35,7 @@ public inline fun RBuilder.card(title: String, crossinline block: StyledDOMBuild
public fun RBuilder.accordion( public fun RBuilder.accordion(
id: String, id: String,
elements: List<Pair<String, StyledDOMBuilder<DIV>.() -> Unit>>, elements: List<Pair<String, StyledDOMBuilder<DIV>.() -> Unit>>,
): ReactElement = styledDiv { ): Unit = styledDiv {
css { css {
+"accordion" +"accordion"
//+"p-1" //+"p-1"
@ -82,7 +81,7 @@ public fun RBuilder.accordion(
} }
public fun RBuilder.nameCrumbs(name: Name?, rootTitle: String, link: (Name) -> Unit): ReactElement = styledNav { public fun RBuilder.nameCrumbs(name: Name?, rootTitle: String, link: (Name) -> Unit): Unit = styledNav {
css { css {
+"p-0" +"p-0"
} }
@ -127,9 +126,9 @@ public fun RSectionsBuilder.entry(title: String, builder: StyledDOMBuilder<DIV>.
add(title to builder) add(title to builder)
} }
public fun RBuilder.accordion(id: String, builder: RSectionsBuilder.() -> Unit): ReactElement { public fun RBuilder.accordion(id: String, builder: RSectionsBuilder.() -> Unit): Unit {
val list = ArrayList<Pair<String, StyledDOMBuilder<DIV>.() -> Unit>>().apply(builder) val list = ArrayList<Pair<String, StyledDOMBuilder<DIV>.() -> Unit>>().apply(builder)
return accordion(id, list) accordion(id, list)
} }
public enum class ContainerSize(public val suffix: String) { public enum class ContainerSize(public val suffix: String) {
@ -144,7 +143,7 @@ public enum class ContainerSize(public val suffix: String) {
public inline fun RBuilder.container( public inline fun RBuilder.container(
size: ContainerSize = ContainerSize.FLUID, size: ContainerSize = ContainerSize.FLUID,
block: StyledDOMBuilder<DIV>.() -> Unit, block: StyledDOMBuilder<DIV>.() -> Unit,
): ReactElement = styledDiv { ): Unit = styledDiv {
css { css {
classes.add("container${size.suffix}") classes.add("container${size.suffix}")
} }
@ -164,7 +163,7 @@ public inline fun RBuilder.gridColumn(
weight: Int? = null, weight: Int? = null,
maxSize: GridMaxSize = GridMaxSize.NONE, maxSize: GridMaxSize = GridMaxSize.NONE,
block: StyledDOMBuilder<DIV>.() -> Unit, block: StyledDOMBuilder<DIV>.() -> Unit,
): ReactElement = styledDiv { ): Unit = styledDiv {
val weightSuffix = weight?.let { "-$it" } ?: "" val weightSuffix = weight?.let { "-$it" } ?: ""
css { css {
classes.add("col${maxSize.suffix}$weightSuffix") classes.add("col${maxSize.suffix}$weightSuffix")
@ -174,7 +173,7 @@ public inline fun RBuilder.gridColumn(
public inline fun RBuilder.gridRow( public inline fun RBuilder.gridRow(
block: StyledDOMBuilder<DIV>.() -> Unit, block: StyledDOMBuilder<DIV>.() -> Unit,
): ReactElement = styledDiv { ): Unit = styledDiv {
css { css {
classes.add("row") classes.add("row")
} }

View File

@ -12,22 +12,22 @@ import space.kscience.visionforge.react.flexColumn
import styled.StyledDOMBuilder import styled.StyledDOMBuilder
import styled.styledDiv import styled.styledDiv
public external class TabProps : RProps { public external interface TabProps : PropsWithChildren {
public var id: String public var id: String
public var title: String? public var title: String?
} }
@JsExport @JsExport
public val Tab: FunctionComponent<TabProps> = functionalComponent { props -> public val Tab: FunctionComponent<TabProps> = functionComponent { props ->
props.children() props.children()
} }
public external class TabPaneProps : RProps { public external interface TabPaneProps : PropsWithChildren {
public var activeTab: String? public var activeTab: String?
} }
@JsExport @JsExport
public val TabPane: FunctionComponent<TabPaneProps> = functionalComponent("TabPane") { props -> public val TabPane: FunctionComponent<TabPaneProps> = functionComponent("TabPane") { props ->
var activeTab: String? by useState(props.activeTab) var activeTab: String? by useState(props.activeTab)
val children: Array<out ReactElement?> = Children.map(props.children) { val children: Array<out ReactElement?> = Children.map(props.children) {

View File

@ -2,8 +2,11 @@ package space.kscience.visionforge.bootstrap
import kotlinx.css.* import kotlinx.css.*
import kotlinx.css.properties.border import kotlinx.css.properties.border
import react.* import react.FunctionComponent
import react.RBuilder
import react.RProps
import react.dom.h2 import react.dom.h2
import react.functionComponent
import space.kscience.dataforge.names.Name import space.kscience.dataforge.names.Name
import space.kscience.dataforge.names.isEmpty import space.kscience.dataforge.names.isEmpty
import space.kscience.visionforge.Vision import space.kscience.visionforge.Vision
@ -21,7 +24,7 @@ public external interface ThreeControlsProps : RProps {
} }
@JsExport @JsExport
public val ThreeControls: FunctionComponent<ThreeControlsProps> = functionalComponent { props -> public val ThreeControls: FunctionComponent<ThreeControlsProps> = functionComponent { props ->
tabPane(if (props.selected != null) "Properties" else null) { tabPane(if (props.selected != null) "Properties" else null) {
tab("Canvas") { tab("Canvas") {
card("Canvas configuration") { card("Canvas configuration") {
@ -67,7 +70,7 @@ public fun RBuilder.threeControls(
selected: Name?, selected: Name?,
onSelect: (Name) -> Unit = {}, onSelect: (Name) -> Unit = {},
builder: TabBuilder.() -> Unit = {}, builder: TabBuilder.() -> Unit = {},
): ReactElement = child(ThreeControls) { ): Unit = child(ThreeControls) {
attrs { attrs {
this.canvasOptions = canvasOptions this.canvasOptions = canvasOptions
this.vision = vision this.vision = vision

View File

@ -42,7 +42,7 @@ public external interface MetaViewerProps : RProps {
public var descriptor: MetaDescriptor? public var descriptor: MetaDescriptor?
} }
private val MetaViewerItem: FunctionComponent<MetaViewerProps> = functionalComponent("MetaViewerItem") { props -> private val MetaViewerItem: FunctionComponent<MetaViewerProps> = functionComponent("MetaViewerItem") { props ->
metaViewerItem(props) metaViewerItem(props)
} }
@ -127,8 +127,7 @@ private fun RBuilder.metaViewerItem(props: MetaViewerProps) {
} }
@JsExport @JsExport
public val MetaViewer: FunctionComponent<MetaViewerProps> = public val MetaViewer: FunctionComponent<MetaViewerProps> = functionComponent("MetaViewer") { props ->
functionalComponent<MetaViewerProps>("MetaViewer") { props ->
child(MetaViewerItem) { child(MetaViewerItem) {
attrs { attrs {
this.key = "" this.key = ""

View File

@ -9,14 +9,14 @@ import react.FunctionComponent
import react.dom.attrs import react.dom.attrs
import react.dom.option import react.dom.option
import react.dom.select import react.dom.select
import react.functionalComponent import react.functionComponent
import space.kscience.dataforge.meta.descriptors.allowedValues import space.kscience.dataforge.meta.descriptors.allowedValues
import space.kscience.dataforge.values.asValue import space.kscience.dataforge.values.asValue
import space.kscience.dataforge.values.string import space.kscience.dataforge.values.string
@JsExport @JsExport
public val MultiSelectChooser: FunctionComponent<ValueChooserProps> = public val MultiSelectChooser: FunctionComponent<ValueChooserProps> =
functionalComponent("MultiSelectChooser") { props -> functionComponent("MultiSelectChooser") { props ->
val onChange: (Event) -> Unit = { event: Event -> val onChange: (Event) -> Unit = { event: Event ->
val newSelected = (event.target as HTMLSelectElement).selectedOptions.asList() val newSelected = (event.target as HTMLSelectElement).selectedOptions.asList()
.map { (it as HTMLOptionElement).value.asValue() } .map { (it as HTMLOptionElement).value.asValue() }

View File

@ -48,7 +48,7 @@ public external interface PropertyEditorProps : RProps {
} }
private val PropertyEditorItem: FunctionComponent<PropertyEditorProps> = private val PropertyEditorItem: FunctionComponent<PropertyEditorProps> =
functionalComponent("PropertyEditorItem") { props -> functionComponent("PropertyEditorItem") { props ->
propertyEditorItem(props) propertyEditorItem(props)
} }
@ -193,7 +193,7 @@ private fun RBuilder.propertyEditorItem(props: PropertyEditorProps) {
} }
@JsExport @JsExport
public val PropertyEditor: FunctionComponent<PropertyEditorProps> = functionalComponent("PropertyEditor") { props -> public val PropertyEditor: FunctionComponent<PropertyEditorProps> = functionComponent("PropertyEditor") { props ->
child(PropertyEditorItem) { child(PropertyEditorItem) {
attrs { attrs {
this.key = "" this.key = ""

View File

@ -8,7 +8,7 @@ import org.w3c.dom.HTMLInputElement
import org.w3c.dom.events.Event import org.w3c.dom.events.Event
import react.FunctionComponent import react.FunctionComponent
import react.dom.attrs import react.dom.attrs
import react.functionalComponent import react.functionComponent
import react.useState import react.useState
import space.kscience.dataforge.meta.descriptors.ValueRequirement import space.kscience.dataforge.meta.descriptors.ValueRequirement
import space.kscience.dataforge.meta.double import space.kscience.dataforge.meta.double
@ -20,7 +20,7 @@ import styled.styledInput
@JsExport @JsExport
public val RangeValueChooser: FunctionComponent<ValueChooserProps> = public val RangeValueChooser: FunctionComponent<ValueChooserProps> =
functionalComponent("RangeValueChooser") { props -> functionComponent("RangeValueChooser") { props ->
var innerValue by useState(props.actual.double) var innerValue by useState(props.actual.double)
var rangeDisabled: Boolean by useState(props.meta.value == null) var rangeDisabled: Boolean by useState(props.meta.value == null)

View File

@ -21,7 +21,7 @@ public external interface ThreeCanvasProps : RProps {
public var selected: Name? public var selected: Name?
} }
public val ThreeCanvasComponent: FunctionComponent<ThreeCanvasProps> = functionalComponent( public val ThreeCanvasComponent: FunctionComponent<ThreeCanvasProps> = functionComponent(
"ThreeCanvasComponent" "ThreeCanvasComponent"
) { props -> ) { props ->
val elementRef = useRef<Element>(null) val elementRef = useRef<Element>(null)

View File

@ -28,7 +28,7 @@ public external interface ObjectTreeProps : RProps {
public var clickCallback: (Name) -> Unit public var clickCallback: (Name) -> Unit
} }
private val TreeLabel = functionalComponent<ObjectTreeProps> { props -> private val TreeLabel = functionComponent<ObjectTreeProps> { props ->
val token = useMemo(props.name) { props.name.lastOrNull()?.toString() ?: "World" } val token = useMemo(props.name) { props.name.lastOrNull()?.toString() ?: "World" }
styledSpan { styledSpan {
css { css {
@ -107,7 +107,7 @@ private fun RBuilder.visionTree(props: ObjectTreeProps): Unit {
} }
@JsExport @JsExport
public val ObjectTree: FunctionComponent<ObjectTreeProps> = functionalComponent("ObjectTree") { props -> public val ObjectTree: FunctionComponent<ObjectTreeProps> = functionComponent("ObjectTree") { props ->
visionTree(props) visionTree(props)
} }

View File

@ -6,14 +6,13 @@ import kotlinx.css.display
import kotlinx.css.flexDirection import kotlinx.css.flexDirection
import kotlinx.html.DIV import kotlinx.html.DIV
import react.RBuilder import react.RBuilder
import react.ReactElement
import styled.StyledDOMBuilder import styled.StyledDOMBuilder
import styled.css import styled.css
import styled.styledDiv import styled.styledDiv
public inline fun RBuilder.flexColumn( public inline fun RBuilder.flexColumn(
block: StyledDOMBuilder<DIV>.() -> Unit block: StyledDOMBuilder<DIV>.() -> Unit
): ReactElement = styledDiv { ): Unit = styledDiv {
css { css {
display = Display.flex display = Display.flex
flexDirection = FlexDirection.column flexDirection = FlexDirection.column
@ -23,7 +22,7 @@ public inline fun RBuilder.flexColumn(
public inline fun RBuilder.flexRow( public inline fun RBuilder.flexRow(
block: StyledDOMBuilder<DIV>.() -> Unit block: StyledDOMBuilder<DIV>.() -> Unit
): ReactElement = styledDiv { ): Unit = styledDiv {
css { css {
display = Display.flex display = Display.flex
flexDirection = FlexDirection.row flexDirection = FlexDirection.row

View File

@ -10,9 +10,12 @@ import kotlinx.html.js.onKeyDownFunction
import org.w3c.dom.HTMLInputElement import org.w3c.dom.HTMLInputElement
import org.w3c.dom.HTMLSelectElement import org.w3c.dom.HTMLSelectElement
import org.w3c.dom.events.Event import org.w3c.dom.events.Event
import react.* import react.FunctionComponent
import react.RProps
import react.dom.attrs import react.dom.attrs
import react.dom.option import react.dom.option
import react.functionComponent
import react.useState
import space.kscience.dataforge.meta.* import space.kscience.dataforge.meta.*
import space.kscience.dataforge.meta.descriptors.MetaDescriptor import space.kscience.dataforge.meta.descriptors.MetaDescriptor
import space.kscience.dataforge.meta.descriptors.allowedValues import space.kscience.dataforge.meta.descriptors.allowedValues
@ -34,7 +37,7 @@ public external interface ValueChooserProps : RProps {
@JsExport @JsExport
public val StringValueChooser: FunctionComponent<ValueChooserProps> = public val StringValueChooser: FunctionComponent<ValueChooserProps> =
functionalComponent("StringValueChooser") { props -> functionComponent("StringValueChooser") { props ->
var value by useState(props.actual.string ?: "") var value by useState(props.actual.string ?: "")
val keyDown: (Event) -> Unit = { event -> val keyDown: (Event) -> Unit = { event ->
if (event.type == "keydown" && event.asDynamic().key == "Enter") { if (event.type == "keydown" && event.asDynamic().key == "Enter") {
@ -59,7 +62,7 @@ public val StringValueChooser: FunctionComponent<ValueChooserProps> =
@JsExport @JsExport
public val BooleanValueChooser: FunctionComponent<ValueChooserProps> = public val BooleanValueChooser: FunctionComponent<ValueChooserProps> =
functionalComponent("BooleanValueChooser") { props -> functionComponent("BooleanValueChooser") { props ->
val handleChange: (Event) -> Unit = { val handleChange: (Event) -> Unit = {
val newValue = (it.target as HTMLInputElement).checked val newValue = (it.target as HTMLInputElement).checked
props.meta.value = newValue.asValue() props.meta.value = newValue.asValue()
@ -78,7 +81,7 @@ public val BooleanValueChooser: FunctionComponent<ValueChooserProps> =
@JsExport @JsExport
public val NumberValueChooser: FunctionComponent<ValueChooserProps> = public val NumberValueChooser: FunctionComponent<ValueChooserProps> =
functionalComponent("NumberValueChooser") { props -> functionComponent("NumberValueChooser") { props ->
var innerValue by useState(props.actual.string ?: "") var innerValue by useState(props.actual.string ?: "")
val keyDown: (Event) -> Unit = { event -> val keyDown: (Event) -> Unit = { event ->
if (event.type == "keydown" && event.asDynamic().key == "Enter") { if (event.type == "keydown" && event.asDynamic().key == "Enter") {
@ -117,7 +120,7 @@ public val NumberValueChooser: FunctionComponent<ValueChooserProps> =
@JsExport @JsExport
public val ComboValueChooser: FunctionComponent<ValueChooserProps> = public val ComboValueChooser: FunctionComponent<ValueChooserProps> =
functionalComponent("ComboValueChooser") { props -> functionComponent("ComboValueChooser") { props ->
var selected by useState(props.actual.string ?: "") var selected by useState(props.actual.string ?: "")
val handleChange: (Event) -> Unit = { val handleChange: (Event) -> Unit = {
selected = (it.target as HTMLSelectElement).value selected = (it.target as HTMLSelectElement).value
@ -142,7 +145,7 @@ public val ComboValueChooser: FunctionComponent<ValueChooserProps> =
@JsExport @JsExport
public val ColorValueChooser: FunctionComponent<ValueChooserProps> = public val ColorValueChooser: FunctionComponent<ValueChooserProps> =
functionalComponent("ColorValueChooser") { props -> functionComponent("ColorValueChooser") { props ->
val handleChange: (Event) -> Unit = { val handleChange: (Event) -> Unit = {
props.meta.value = (it.target as HTMLInputElement).value.asValue() props.meta.value = (it.target as HTMLInputElement).value.asValue()
} }
@ -162,7 +165,7 @@ public val ColorValueChooser: FunctionComponent<ValueChooserProps> =
} }
@JsExport @JsExport
public val ValueChooser: FunctionComponent<ValueChooserProps> = functionalComponent("ValueChooser") { props -> public val ValueChooser: FunctionComponent<ValueChooserProps> = functionComponent("ValueChooser") { props ->
val rawInput by useState(false) val rawInput by useState(false)
val descriptor = props.descriptor val descriptor = props.descriptor

View File

@ -4,10 +4,11 @@
package ringui package ringui
import react.ComponentClass import react.ComponentClass
import react.dom.WithClassName import react.PropsWithClassName
// https://github.com/JetBrains/ring-ui/blob/master/components/loader/loader.js // https://github.com/JetBrains/ring-ui/blob/master/components/loader/loader.js
public external interface LoaderProps : WithClassName { public external interface LoaderProps : PropsWithClassName {
public var size: Number public var size: Number
public var colors: Array<String> public var colors: Array<String>
public var message: String public var message: String

View File

@ -4,10 +4,10 @@
package ringui package ringui
import react.ComponentClass import react.ComponentClass
import react.dom.WithClassName import react.PropsWithClassName
// https://github.com/JetBrains/ring-ui/blob/master/components/loader-screen/loader-screen.js // https://github.com/JetBrains/ring-ui/blob/master/components/loader-screen/loader-screen.js
public external interface LoaderScreenProps : WithClassName { public external interface LoaderScreenProps : PropsWithClassName {
public var containerClassName: String public var containerClassName: String
public var message: String public var message: String
} }

View File

@ -43,7 +43,7 @@ public fun ThreeCanvasWithControlsProps.tab(title: String, block: RBuilder.() ->
} }
public fun RBuilder.nameCrumbs(name: Name?, link: (Name) -> Unit): ReactElement = styledDiv { public fun RBuilder.nameCrumbs(name: Name?, link: (Name) -> Unit): Unit = styledDiv {
div { div {
Link { Link {
attrs { attrs {
@ -77,7 +77,7 @@ public fun RBuilder.nameCrumbs(name: Name?, link: (Name) -> Unit): ReactElement
@JsExport @JsExport
public val ThreeCanvasWithControls: FunctionComponent<ThreeCanvasWithControlsProps> = public val ThreeCanvasWithControls: FunctionComponent<ThreeCanvasWithControlsProps> =
functionalComponent("ThreeViewWithControls") { props -> functionComponent("ThreeViewWithControls") { props ->
var selected by useState { props.selected } var selected by useState { props.selected }
var solid: Solid? by useState(null) var solid: Solid? by useState(null)

View File

@ -9,9 +9,12 @@ import kotlinx.html.js.onClickFunction
import org.w3c.dom.events.Event import org.w3c.dom.events.Event
import org.w3c.files.Blob import org.w3c.files.Blob
import org.w3c.files.BlobPropertyBag import org.w3c.files.BlobPropertyBag
import react.* import react.FunctionComponent
import react.RBuilder
import react.RProps
import react.dom.attrs import react.dom.attrs
import react.dom.button import react.dom.button
import react.functionComponent
import ringui.Island import ringui.Island
import ringui.SmartTabs import ringui.SmartTabs
import ringui.Tab import ringui.Tab
@ -35,8 +38,8 @@ internal fun saveData(event: Event, fileName: String, mimeType: String = "text/p
fileSaver.saveAs(blob, fileName) fileSaver.saveAs(blob, fileName)
} }
internal fun RBuilder.canvasControls(options: Canvas3DOptions, vision: Vision?): ReactElement { internal fun RBuilder.canvasControls(options: Canvas3DOptions, vision: Vision?): Unit {
return child(CanvasControls) { child(CanvasControls) {
attrs { attrs {
this.options = options this.options = options
this.vision = vision this.vision = vision
@ -49,7 +52,7 @@ internal external interface CanvasControlsProps : RProps {
public var vision: Vision? public var vision: Vision?
} }
internal val CanvasControls: FunctionComponent<CanvasControlsProps> = functionalComponent("CanvasControls") { props -> internal val CanvasControls: FunctionComponent<CanvasControlsProps> = functionComponent("CanvasControls") { props ->
flexColumn { flexColumn {
flexRow { flexRow {
css { css {
@ -91,7 +94,7 @@ public external interface ThreeControlsProps : RProps {
} }
@JsExport @JsExport
public val ThreeControls: FunctionComponent<ThreeControlsProps> = functionalComponent { props -> public val ThreeControls: FunctionComponent<ThreeControlsProps> = functionComponent { props ->
SmartTabs("Tree") { SmartTabs("Tree") {
props.vision?.let { props.vision?.let {
Tab("Tree") { Tab("Tree") {
@ -119,7 +122,7 @@ public fun RBuilder.ringThreeControls(
selected: Name?, selected: Name?,
onSelect: (Name?) -> Unit = {}, onSelect: (Name?) -> Unit = {},
additionalTabs: Map<String, RBuilder.() -> Unit>? = null additionalTabs: Map<String, RBuilder.() -> Unit>? = null
): ReactElement = child(ThreeControls) { ): Unit = child(ThreeControls) {
attrs { attrs {
this.canvasOptions = canvasOptions this.canvasOptions = canvasOptions
this.vision = vision this.vision = vision