diff --git a/README.md b/README.md
index dbddf3f7..6e94454f 100644
--- a/README.md
+++ b/README.md
@@ -1,4 +1,6 @@
-# DataForge Plugins for Visualisation
+[![JetBrains Research](https://jb.gg/badges/research.svg)](https://confluence.jetbrains.com/display/ALL/JetBrains+on+GitHub)
+
+# DataForge plugins for visualisation
 
 This repository contains [DataForge](http://npm.mipt.ru/dataforge/) 
 (also [here](https://github.com/mipt-npm/dataforge-core)) components useful for visualization in
diff --git a/build.gradle.kts b/build.gradle.kts
index 48899168..0378807d 100644
--- a/build.gradle.kts
+++ b/build.gradle.kts
@@ -1,8 +1,10 @@
-val dataforgeVersion by extra("0.1.3")
+import scientifik.useSerialization
+
+val dataforgeVersion by extra("0.1.5-dev-6")
 
 plugins {
-    val kotlinVersion = "1.3.50"
-    val toolsVersion = "0.2.0"
+    val kotlinVersion = "1.3.61"
+    val toolsVersion = "0.3.2"
 
     kotlin("jvm") version kotlinVersion apply false
     id("kotlin-dce-js") version kotlinVersion apply false
@@ -15,14 +17,22 @@ plugins {
 
 allprojects {
     repositories {
+        mavenLocal()
         maven("https://dl.bintray.com/pdvrieze/maven")
         maven("http://maven.jzy3d.org/releases")
+        maven("https://kotlin.bintray.com/js-externals")
+//        maven("https://dl.bintray.com/gbaldeck/kotlin")
+//        maven("https://dl.bintray.com/rjaros/kotlin")
     }
 
     group = "hep.dataforge"
     version = "0.1.0-dev"
 }
 
+subprojects{
+    this.useSerialization()
+}
+
 val githubProject by extra("dataforge-vis")
 val bintrayRepo by extra("dataforge")
 
diff --git a/dataforge-vis-common/build.gradle.kts b/dataforge-vis-common/build.gradle.kts
index 678a9e72..548c1be5 100644
--- a/dataforge-vis-common/build.gradle.kts
+++ b/dataforge-vis-common/build.gradle.kts
@@ -1,27 +1,50 @@
+import org.openjfx.gradle.JavaFXOptions
+import scientifik.useSerialization
+
 plugins {
     id("scientifik.mpp")
-}
-
-scientifik{
-    withSerialization()
+    id("org.openjfx.javafxplugin")
 }
 
 val dataforgeVersion: String by rootProject.extra
+//val kvisionVersion: String by rootProject.extra("2.0.0-M1")
+
+useSerialization()
 
 kotlin {
+    jvm{
+        withJava()
+    }
+
     sourceSets {
-        val commonMain by getting {
+        commonMain{
             dependencies {
                 api("hep.dataforge:dataforge-output:$dataforgeVersion")
             }
         }
-        val jsMain by getting {
+        jvmMain{
+            dependencies {
+                api("no.tornado:tornadofx:1.7.19")
+                //api("no.tornado:tornadofx-controlsfx:0.1.1")
+                api("de.jensd:fontawesomefx-fontawesome:4.7.0-11"){
+                    exclude(group = "org.openjfx")
+                }
+                api("de.jensd:fontawesomefx-commons:11.0"){
+                    exclude(group = "org.openjfx")
+                }
+            }
+        }
+        jsMain{
             dependencies {
                 api("hep.dataforge:dataforge-output-html:$dataforgeVersion")
-                api(npm("text-encoding"))
-                api("org.jetbrains:kotlin-extensions:1.0.1-pre.83-kotlin-1.3.50")
-                api(npm("core-js"))
+                api(npm("bootstrap","4.4.1"))
+                implementation(npm("jsoneditor"))
+                implementation(npm("file-saver"))
             }
         }
     }
-}
\ No newline at end of file
+}
+
+configure<JavaFXOptions> {
+    modules("javafx.controls")
+}
diff --git a/dataforge-vis-common/src/commonMain/kotlin/hep/dataforge/vis/common/AbstractVisualGroup.kt b/dataforge-vis-common/src/commonMain/kotlin/hep/dataforge/vis/common/AbstractVisualGroup.kt
index 38ddf19f..889cb0dc 100644
--- a/dataforge-vis-common/src/commonMain/kotlin/hep/dataforge/vis/common/AbstractVisualGroup.kt
+++ b/dataforge-vis-common/src/commonMain/kotlin/hep/dataforge/vis/common/AbstractVisualGroup.kt
@@ -1,7 +1,5 @@
 package hep.dataforge.vis.common
 
-import hep.dataforge.meta.Meta
-import hep.dataforge.meta.MetaBuilder
 import hep.dataforge.meta.MetaItem
 import hep.dataforge.names.*
 import kotlinx.serialization.Transient
@@ -17,46 +15,7 @@ abstract class AbstractVisualGroup : AbstractVisualObject(), MutableVisualGroup
     /**
      * A map of top level named children
      */
-    abstract override val children: Map<NameToken, VisualObject> //get() = _children
-
-    /**
-     * Styles, defined in this group. A style could be defined but not applied
-     * TODO replace by custom object with get/set functionality
-     */
-    protected abstract val styleSheet: MutableMap<Name, Meta>
-
-    override fun getStyle(name: Name): Meta? = styleSheet[name]
-
-    override fun addStyle(name: Name, meta: Meta, apply: Boolean) {
-        fun VisualObject.applyStyle(name: Name, meta: Meta) {
-            if (styles.contains(name)) {
-                //full update
-                //TODO do a fine grained update
-                if (this is AbstractVisualObject) {
-                    styleChanged()
-                } else {
-                    propertyChanged(EmptyName)
-                }
-            }
-            if (this is VisualGroup) {
-                this.children.forEach { (_, child) ->
-                    child.applyStyle(name, meta)
-                }
-            }
-        }
-        styleSheet[name] = meta
-        if (apply) {
-            applyStyle(name, meta)
-        }
-    }
-
-
-//    init {
-//        //Do after deserialization
-//        children.values.forEach {
-//            it.parent = this
-//        }
-//    }
+    abstract override val children: Map<NameToken, VisualObject>
 
     override fun propertyChanged(name: Name, before: MetaItem<*>?, after: MetaItem<*>?) {
         super.propertyChanged(name, before, after)
@@ -114,7 +73,7 @@ abstract class AbstractVisualGroup : AbstractVisualObject(), MutableVisualGroup
     protected abstract fun createGroup(name: Name): MutableVisualGroup
 
     /**
-     * Add named or unnamed child to the group. If key is [null] the child is considered unnamed. Both key and value are not
+     * Add named or unnamed child to the group. If key is null the child is considered unnamed. Both key and value are not
      * allowed to be null in the same time. If name is present and [child] is null, the appropriate element is removed.
      */
     override fun set(name: Name, child: VisualObject?) {
@@ -141,22 +100,13 @@ abstract class AbstractVisualGroup : AbstractVisualObject(), MutableVisualGroup
         structureChangeListeners.forEach { it.callback(name, child) }
     }
 
-    operator fun set(key: String, child: VisualObject?) = if (key.isBlank()) {
-        child?.let { addStatic(child) }
-    } else {
-        set(key.asName(), child)
-    }
-
-//    operator fun set(key: String?, child: VisualObject?) = set(key ?: "", child)
-
-    protected fun MetaBuilder.updateChildren() {
-        //adding named children
-        children.forEach {
-            "children[${it.key}]" to it.value.toMeta()
+    operator fun set(key: String, child: VisualObject?): Unit {
+        if (key.isBlank()) {
+            if(child!= null) {
+                addStatic(child)
+            }
+        } else {
+            set(key.toName(), child)
         }
     }
-
-    override fun MetaBuilder.updateMeta() {
-        updateChildren()
-    }
 }
\ No newline at end of file
diff --git a/dataforge-vis-common/src/commonMain/kotlin/hep/dataforge/vis/common/AbstractVisualObject.kt b/dataforge-vis-common/src/commonMain/kotlin/hep/dataforge/vis/common/AbstractVisualObject.kt
index e63382ca..7701eb1c 100644
--- a/dataforge-vis-common/src/commonMain/kotlin/hep/dataforge/vis/common/AbstractVisualObject.kt
+++ b/dataforge-vis-common/src/commonMain/kotlin/hep/dataforge/vis/common/AbstractVisualObject.kt
@@ -1,9 +1,8 @@
 package hep.dataforge.vis.common
 
 import hep.dataforge.meta.*
-import hep.dataforge.names.EmptyName
 import hep.dataforge.names.Name
-import hep.dataforge.names.toName
+import hep.dataforge.names.asName
 import hep.dataforge.vis.common.VisualObject.Companion.STYLE_KEY
 import kotlinx.serialization.Transient
 
@@ -17,15 +16,25 @@ abstract class AbstractVisualObject : VisualObject {
     @Transient
     override var parent: VisualObject? = null
 
-    abstract override var properties: Config?
+    protected abstract var properties: Config?
 
-    override var styles: List<Name>
-        get() = properties?.get(STYLE_KEY).stringList.map(String::toName)
+    override var styles: List<String>
+        get() = properties?.get(STYLE_KEY).stringList
         set(value) {
-            setProperty(STYLE_KEY, value.map { it.toString() })
-            styleChanged()
+            //val allStyles = (field + value).distinct()
+            setProperty(STYLE_KEY, value)
+            updateStyles(value)
         }
 
+    protected fun updateStyles(names: List<String>) {
+        names.mapNotNull { findStyle(it) }.asSequence()
+            .flatMap { it.items.asSequence() }
+            .distinctBy { it.key }
+            .forEach {
+                propertyChanged(it.key.asName(), null, it.value)
+            }
+    }
+
     /**
      * The config is initialized and assigned on-demand.
      * To avoid unnecessary allocations, one should access [properties] via [getProperty] instead.
@@ -39,8 +48,10 @@ abstract class AbstractVisualObject : VisualObject {
     private val listeners = HashSet<PropertyListener>()
 
     override fun propertyChanged(name: Name, before: MetaItem<*>?, after: MetaItem<*>?) {
-        for (l in listeners) {
-            l.action(name, before, after)
+        if (before != after) {
+            for (l in listeners) {
+                l.action(name, before, after)
+            }
         }
     }
 
@@ -52,10 +63,6 @@ abstract class AbstractVisualObject : VisualObject {
         listeners.removeAll { it.owner == owner }
     }
 
-    override fun setProperty(name: Name, value: Any?) {
-        config[name] = value
-    }
-
     private var styleCache: Meta? = null
 
     /**
@@ -66,14 +73,7 @@ abstract class AbstractVisualObject : VisualObject {
             styleCache = it
         }
 
-
-    /**
-     * Helper to reset style cache
-     */
-    protected fun styleChanged() {
-        styleCache = null
-        propertyChanged(EmptyName)
-    }
+    override fun allProperties(): Laminate = Laminate(properties, mergedStyles)
 
     override fun getProperty(name: Name, inherit: Boolean): MetaItem<*>? {
         return if (inherit) {
@@ -82,20 +82,12 @@ abstract class AbstractVisualObject : VisualObject {
             properties?.get(name) ?: mergedStyles[name]
         }
     }
-
-    protected open fun MetaBuilder.updateMeta() {}
-
-    override fun toMeta(): Meta = buildMeta {
-        "type" to this::class.simpleName
-        "properties" to properties
-        updateMeta()
-    }
 }
 
-fun VisualObject.findStyle(styleName: Name): Meta? {
-    if (this is VisualGroup) {
-        val style = getStyle(styleName)
-        if (style != null) return style
-    }
-    return parent?.findStyle(styleName)
-}
\ No newline at end of file
+//fun VisualObject.findStyle(styleName: Name): Meta? {
+//    if (this is VisualGroup) {
+//        val style = resolveStyle(styleName)
+//        if (style != null) return style
+//    }
+//    return parent?.findStyle(styleName)
+//}
\ No newline at end of file
diff --git a/dataforge-vis-common/src/commonMain/kotlin/hep/dataforge/vis/common/Colors.kt b/dataforge-vis-common/src/commonMain/kotlin/hep/dataforge/vis/common/Colors.kt
index 2e77fa45..3335c086 100644
--- a/dataforge-vis-common/src/commonMain/kotlin/hep/dataforge/vis/common/Colors.kt
+++ b/dataforge-vis-common/src/commonMain/kotlin/hep/dataforge/vis/common/Colors.kt
@@ -1,5 +1,8 @@
 package hep.dataforge.vis.common
 
+import hep.dataforge.meta.*
+import hep.dataforge.values.ValueType
+import hep.dataforge.values.int
 import kotlin.math.max
 
 /**
@@ -178,6 +181,33 @@ object Colors {
     const val yellow = 0xFFFF00
     const val yellowgreen = 0x9ACD32
 
+    const val RED_KEY = "red"
+    const val GREEN_KEY = "green"
+    const val BLUE_KEY = "blue"
+
+    /**
+     * Convert color represented as Meta to string of format #rrggbb
+     */
+    fun fromMeta(item: MetaItem<*>): String {
+        return when (item) {
+            is MetaItem.NodeItem<*> -> {
+                val node = item.node
+                rgbToString(
+                    node[RED_KEY].number?.toByte()?.toUByte() ?: 0u,
+                    node[GREEN_KEY].number?.toByte()?.toUByte() ?: 0u,
+                    node[BLUE_KEY].number?.toByte()?.toUByte() ?: 0u
+                )
+            }
+            is MetaItem.ValueItem -> {
+                if (item.value.type == ValueType.NUMBER) {
+                    rgbToString(item.value.int)
+                } else {
+                    item.value.string
+                }
+            }
+        }
+    }
+
     /**
      * Convert Int color to string of format #rrggbb
      */
@@ -190,8 +220,8 @@ object Colors {
      * Convert three bytes representing color to string of format #rrggbb
      */
     fun rgbToString(red: UByte, green: UByte, blue: UByte): String {
-        fun colorToString(color: UByte): String{
-            return color.toString(16).padStart(2,'0')
+        fun colorToString(color: UByte): String {
+            return color.toString(16).padStart(2, '0')
         }
         return buildString {
             append("#")
@@ -200,4 +230,13 @@ object Colors {
             append(colorToString(blue))
         }
     }
+
+    /**
+     * Convert three bytes representing color to Meta
+     */
+    fun rgbToMeta(r: UByte, g: UByte, b: UByte): Meta = buildMeta {
+        RED_KEY put r.toInt()
+        GREEN_KEY put g.toInt()
+        BLUE_KEY put b.toInt()
+    }
 }
\ No newline at end of file
diff --git a/dataforge-vis-common/src/commonMain/kotlin/hep/dataforge/vis/common/StyleSheet.kt b/dataforge-vis-common/src/commonMain/kotlin/hep/dataforge/vis/common/StyleSheet.kt
new file mode 100644
index 00000000..fce0b422
--- /dev/null
+++ b/dataforge-vis-common/src/commonMain/kotlin/hep/dataforge/vis/common/StyleSheet.kt
@@ -0,0 +1,63 @@
+@file:UseSerializers(MetaSerializer::class)
+
+package hep.dataforge.vis.common
+
+import hep.dataforge.io.serialization.MetaSerializer
+import hep.dataforge.meta.*
+import hep.dataforge.names.Name
+import hep.dataforge.names.asName
+import kotlinx.serialization.Serializable
+import kotlinx.serialization.Transient
+import kotlinx.serialization.UseSerializers
+
+@Serializable
+class StyleSheet() {
+    @Transient
+    internal var owner: VisualObject? = null
+
+    constructor(owner: VisualObject) : this() {
+        this.owner = owner
+    }
+
+    private val styleMap = HashMap<String, Meta>()
+
+    val items: Map<String, Meta> get() = styleMap
+
+    operator fun get(key: String): Meta? {
+        return styleMap[key] ?: (owner?.parent as? VisualGroup)?.styleSheet?.get(key)
+    }
+
+    /**
+     * Define a style without notifying
+     */
+    fun define(key: String, style: Meta?) {
+        if (style == null) {
+            styleMap.remove(key)
+        } else {
+            styleMap[key] = style
+        }
+    }
+
+    operator fun set(key: String, style: Meta?) {
+        val oldStyle = styleMap[key]
+        define(key, style)
+        owner?.styleChanged(key, oldStyle, style)
+    }
+
+    operator fun set(key: String, builder: MetaBuilder.() -> Unit) {
+        val newStyle = get(key)?.let { buildMeta(it, builder) } ?: buildMeta(builder)
+        set(key, newStyle.seal())
+    }
+}
+
+private fun VisualObject.styleChanged(key: String, oldStyle: Meta?, newStyle: Meta?) {
+    if (styles.contains(key)) {
+        //TODO optimize set concatenation
+        val tokens: Collection<Name> = ((oldStyle?.items?.keys ?: emptySet()) + (newStyle?.items?.keys ?: emptySet()))
+            .map { it.asName() }
+        tokens.forEach { parent?.propertyChanged(it, oldStyle?.get(it), newStyle?.get(it)) }
+    }
+    if (this is VisualGroup) {
+        this.forEach { it.styleChanged(key, oldStyle, newStyle) }
+    }
+}
\ No newline at end of file
diff --git a/dataforge-vis-common/src/commonMain/kotlin/hep/dataforge/vis/common/MutableVisualGroup.kt b/dataforge-vis-common/src/commonMain/kotlin/hep/dataforge/vis/common/VisualGroup.kt
similarity index 72%
rename from dataforge-vis-common/src/commonMain/kotlin/hep/dataforge/vis/common/MutableVisualGroup.kt
rename to dataforge-vis-common/src/commonMain/kotlin/hep/dataforge/vis/common/VisualGroup.kt
index 761c0b20..467616c3 100644
--- a/dataforge-vis-common/src/commonMain/kotlin/hep/dataforge/vis/common/MutableVisualGroup.kt
+++ b/dataforge-vis-common/src/commonMain/kotlin/hep/dataforge/vis/common/VisualGroup.kt
@@ -1,6 +1,5 @@
 package hep.dataforge.vis.common
 
-import hep.dataforge.meta.Meta
 import hep.dataforge.names.*
 import hep.dataforge.provider.Provider
 
@@ -15,6 +14,8 @@ interface VisualGroup : Provider, Iterable<VisualObject>, VisualObject {
 
     override val defaultTarget: String get() = VisualObject.TYPE
 
+    val styleSheet: StyleSheet?
+
     override fun provideTop(target: String): Map<Name, Any> =
         when (target) {
             VisualObject.TYPE -> children.flatMap { (key, value) ->
@@ -25,7 +26,7 @@ interface VisualGroup : Provider, Iterable<VisualObject>, VisualObject {
                 }
                 res.entries
             }.associate { it.toPair() }
-            //TODO add styles
+            STYLE_TARGET -> styleSheet?.items?.mapKeys { it.key.toName() } ?: emptyMap()
             else -> emptyMap()
         }
 
@@ -35,17 +36,6 @@ interface VisualGroup : Provider, Iterable<VisualObject>, VisualObject {
      */
     override fun iterator(): Iterator<VisualObject> = children.values.iterator()
 
-    /**
-     * Resolve style by its name
-     * TODO change to Config?
-     */
-    fun getStyle(name: Name): Meta?
-
-    /**
-     * Add or replace style with given name
-     */
-    fun addStyle(name: Name, meta: Meta, apply: Boolean = true)
-
     operator fun get(name: Name): VisualObject? {
         return when {
             name.isEmpty() -> this
@@ -53,8 +43,27 @@ interface VisualGroup : Provider, Iterable<VisualObject>, VisualObject {
             else -> (children[name.first()!!] as? VisualGroup)?.get(name.cutFirst())
         }
     }
+
+    /**
+     * A fix for serialization bug that writes all proper parents inside the tree after deserialization
+     */
+    fun attachChildren() {
+        styleSheet?.owner = this
+        this.children.values.forEach {
+            it.parent = this
+            (it as? VisualGroup)?.attachChildren()
+        }
+    }
+
+    companion object {
+        const val STYLE_TARGET = "style"
+    }
 }
 
+data class StyleRef(val group: VisualGroup, val styleName: Name)
+
+val VisualGroup.isEmpty: Boolean get() = this.children.isEmpty()
+
 /**
  * Mutable version of [VisualGroup]
  */
@@ -75,4 +84,6 @@ interface MutableVisualGroup : VisualGroup {
     operator fun set(name: Name, child: VisualObject?)
 }
 
-operator fun VisualGroup.get(str: String?) = get(str?.toName() ?: EmptyName)
\ No newline at end of file
+operator fun VisualGroup.get(str: String?) = get(str?.toName() ?: Name.EMPTY)
+
+fun MutableVisualGroup.removeAll() = children.keys.map { it.asName() }.forEach { this[it] = null }
\ No newline at end of file
diff --git a/dataforge-vis-common/src/commonMain/kotlin/hep/dataforge/vis/common/VisualObject.kt b/dataforge-vis-common/src/commonMain/kotlin/hep/dataforge/vis/common/VisualObject.kt
index 7bc3b262..0d94087c 100644
--- a/dataforge-vis-common/src/commonMain/kotlin/hep/dataforge/vis/common/VisualObject.kt
+++ b/dataforge-vis-common/src/commonMain/kotlin/hep/dataforge/vis/common/VisualObject.kt
@@ -15,7 +15,7 @@ import kotlinx.serialization.Transient
  * A root type for display hierarchy
  */
 @Type(TYPE)
-interface VisualObject : MetaRepr, Configurable {
+interface VisualObject : Configurable {
 
     /**
      * The parent object of this one. If null, this one is a root.
@@ -24,14 +24,16 @@ interface VisualObject : MetaRepr, Configurable {
     var parent: VisualObject?
 
     /**
-     * Direct properties access
+     * All properties including styles and prototypes if present, but without inheritance
      */
-    val properties: Config?
+    fun allProperties(): Laminate
 
     /**
      * Set property for this object
      */
-    fun setProperty(name: Name, value: Any?)
+    fun setProperty(name: Name, value: Any?) {
+        config[name] = value
+    }
 
     /**
      * Get property including or excluding parent properties
@@ -39,9 +41,11 @@ interface VisualObject : MetaRepr, Configurable {
     fun getProperty(name: Name, inherit: Boolean = true): MetaItem<*>?
 
     /**
-     * Manually trigger property changed event. If [name] is empty, notify that the whole object is changed
+     * Trigger property invalidation event. If [name] is empty, notify that the whole object is changed
      */
-    fun propertyChanged(name: Name, before: MetaItem<*>? = null, after: MetaItem<*>? = null): Unit
+    fun propertyChanged(name: Name, before: MetaItem<*>?, after: MetaItem<*>?): Unit
+
+    fun propertyInvalidated(name: Name) = propertyChanged(name, null, null)
 
     /**
      * Add listener triggering on property change
@@ -54,11 +58,9 @@ interface VisualObject : MetaRepr, Configurable {
     fun removeChangeListener(owner: Any?)
 
     /**
-     * List of names of styles applied to this object
+     * List of names of styles applied to this object. Order matters. Not inherited
      */
-    var styles: List<Name>
-
-    fun findAllStyles(): Laminate = Laminate(styles.distinct().mapNotNull(::findStyle))
+    var styles: List<String>
 
     companion object {
         const val TYPE = "visual"
@@ -66,6 +68,7 @@ interface VisualObject : MetaRepr, Configurable {
 
         //const val META_KEY = "@meta"
         //const val TAGS_KEY = "@tags"
+
     }
 }
 
@@ -80,8 +83,33 @@ fun VisualObject.getProperty(key: String, inherit: Boolean = true): MetaItem<*>?
 fun VisualObject.setProperty(key: String, value: Any?) = setProperty(key.toName(), value)
 
 /**
- *  Apply style to [VisualObject] by adding it to the [style] list
+ * Add style name to the list of styles to be resolved later. The style with given name does not necessary exist at the moment.
  */
-fun VisualObject.applyStyle(name: String) {
-    styles = styles + name.toName()
-}
\ No newline at end of file
+fun VisualObject.useStyle(name: String) {
+    styles = styles + name
+}
+
+//private tailrec fun VisualObject.topGroup(): VisualGroup? {
+//    val parent = this.parent
+//    return if (parent == null) {
+//        this as? VisualGroup
+//    }
+//    else {
+//        parent.topGroup()
+//    }
+//}
+//
+///**
+// * Add or update given style on a top-most reachable parent group and apply it to this object
+// */
+//fun VisualObject.useStyle(name: String, builder: MetaBuilder.() -> Unit) {
+//    val styleName = name.toName()
+//    topGroup()?.updateStyle(styleName, builder) ?: error("Can't find parent group for $this")
+//    useStyle(styleName)
+//}
+
+tailrec fun VisualObject.findStyle(name: String): Meta? =
+    (this as? VisualGroup)?.styleSheet?.get(name) ?: parent?.findStyle(name)
+
+fun VisualObject.findAllStyles(): Laminate = Laminate(styles.mapNotNull(::findStyle))
+
diff --git a/dataforge-vis-common/src/commonMain/kotlin/hep/dataforge/vis/common/VisualPlugin.kt b/dataforge-vis-common/src/commonMain/kotlin/hep/dataforge/vis/common/VisualPlugin.kt
index 933e4736..39a1abc0 100644
--- a/dataforge-vis-common/src/commonMain/kotlin/hep/dataforge/vis/common/VisualPlugin.kt
+++ b/dataforge-vis-common/src/commonMain/kotlin/hep/dataforge/vis/common/VisualPlugin.kt
@@ -30,7 +30,8 @@ class VisualPlugin(meta: Meta) : AbstractPlugin(meta) {
     companion object : PluginFactory<VisualPlugin> {
         override val tag: PluginTag = PluginTag(name = "visual", group = PluginTag.DATAFORGE_GROUP)
         override val type: KClass<out VisualPlugin> = VisualPlugin::class
-        override fun invoke(meta: Meta): VisualPlugin = VisualPlugin(meta)
+
+        override fun invoke(meta: Meta, context: Context): VisualPlugin = VisualPlugin(meta)
 
         const val VISUAL_FACTORY_TYPE = "visual.factory"
     }
diff --git a/dataforge-vis-common/src/jsMain/kotlin/hep/dataforge/vis/HMR.kt b/dataforge-vis-common/src/jsMain/kotlin/hep/dataforge/js/Application.kt
similarity index 63%
rename from dataforge-vis-common/src/jsMain/kotlin/hep/dataforge/vis/HMR.kt
rename to dataforge-vis-common/src/jsMain/kotlin/hep/dataforge/js/Application.kt
index 5353fb03..53734c31 100644
--- a/dataforge-vis-common/src/jsMain/kotlin/hep/dataforge/vis/HMR.kt
+++ b/dataforge-vis-common/src/jsMain/kotlin/hep/dataforge/js/Application.kt
@@ -1,14 +1,10 @@
-package hep.dataforge.vis
+package hep.dataforge.js
 
 import kotlin.browser.document
 import kotlin.dom.hasClass
 
 external val module: Module
 
-external interface Module {
-    val hot: Hot?
-}
-
 external interface Hot {
     val data: dynamic
 
@@ -19,17 +15,31 @@ external interface Hot {
     fun dispose(callback: (data: dynamic) -> Unit)
 }
 
-external fun require(name: String): dynamic
-
-abstract class ApplicationBase {
-    open val stateKeys: List<String> get() = emptyList()
-
-    abstract fun start(state: Map<String, Any>)
-    open fun dispose(): Map<String, Any> = emptyMap()
+external interface Module {
+    val hot: Hot?
 }
 
-fun startApplication(builder: () -> ApplicationBase) {
-    fun start(state: dynamic): ApplicationBase? {
+/**
+ * Base interface for applications.
+ *
+ * Base interface for applications supporting Hot Module Replacement (HMR).
+ */
+interface Application {
+    /**
+     * Starting point for an application.
+     * @param state Initial state between Hot Module Replacement (HMR).
+     */
+    fun start(state: Map<String, Any>)
+
+    /**
+     * Ending point for an application.
+     * @return final state for Hot Module Replacement (HMR).
+     */
+    fun dispose(): Map<String, Any> = emptyMap()
+}
+
+fun startApplication(builder: () -> Application) {
+    fun start(state: dynamic): Application? {
         return if (document.body?.hasClass("testApp") == true) {
             val application = builder()
 
@@ -42,7 +52,7 @@ fun startApplication(builder: () -> ApplicationBase) {
         }
     }
 
-    var application: ApplicationBase? = null
+    var application: Application? = null
 
     val state: dynamic = module.hot?.let { hot ->
         hot.accept()
diff --git a/dataforge-vis-common/src/jsMain/kotlin/hep/dataforge/vis/jsExtra.kt b/dataforge-vis-common/src/jsMain/kotlin/hep/dataforge/js/jsExtra.kt
similarity index 85%
rename from dataforge-vis-common/src/jsMain/kotlin/hep/dataforge/vis/jsExtra.kt
rename to dataforge-vis-common/src/jsMain/kotlin/hep/dataforge/js/jsExtra.kt
index 56751272..6354a61c 100644
--- a/dataforge-vis-common/src/jsMain/kotlin/hep/dataforge/vis/jsExtra.kt
+++ b/dataforge-vis-common/src/jsMain/kotlin/hep/dataforge/js/jsExtra.kt
@@ -1,4 +1,7 @@
-package hep.dataforge.vis
+package hep.dataforge.js
+
+@JsName("require")
+external fun requireJS(name: String): dynamic
 
 inline fun <T : Any> jsObject(builder: T.() -> Unit): T {
     val obj: T = js("({})") as T
diff --git a/dataforge-vis-spatial/src/jsMain/kotlin/hep/dataforge/vis/spatial/editor/bootstrap.kt b/dataforge-vis-common/src/jsMain/kotlin/hep/dataforge/vis/js/editor/bootstrap.kt
similarity index 89%
rename from dataforge-vis-spatial/src/jsMain/kotlin/hep/dataforge/vis/spatial/editor/bootstrap.kt
rename to dataforge-vis-common/src/jsMain/kotlin/hep/dataforge/vis/js/editor/bootstrap.kt
index 7be121b1..2f1e4595 100644
--- a/dataforge-vis-spatial/src/jsMain/kotlin/hep/dataforge/vis/spatial/editor/bootstrap.kt
+++ b/dataforge-vis-common/src/jsMain/kotlin/hep/dataforge/vis/js/editor/bootstrap.kt
@@ -1,4 +1,4 @@
-package hep.dataforge.vis.spatial.editor
+package hep.dataforge.vis.js.editor
 
 import kotlinx.html.TagConsumer
 import kotlinx.html.js.div
diff --git a/dataforge-vis-common/src/jsMain/kotlin/hep/dataforge/vis/js/editor/jsTree.kt b/dataforge-vis-common/src/jsMain/kotlin/hep/dataforge/vis/js/editor/jsTree.kt
new file mode 100644
index 00000000..f45727b9
--- /dev/null
+++ b/dataforge-vis-common/src/jsMain/kotlin/hep/dataforge/vis/js/editor/jsTree.kt
@@ -0,0 +1,74 @@
+package hep.dataforge.vis.js.editor
+
+import hep.dataforge.names.NameToken
+import hep.dataforge.vis.common.VisualGroup
+import hep.dataforge.vis.common.VisualObject
+import hep.dataforge.vis.common.isEmpty
+import kotlinx.html.TagConsumer
+import kotlinx.html.dom.append
+import kotlinx.html.js.*
+import org.w3c.dom.Element
+import org.w3c.dom.HTMLElement
+import org.w3c.dom.HTMLSpanElement
+import kotlin.dom.clear
+
+fun Element.objectTree(
+    token: NameToken,
+    obj: VisualObject,
+    clickCallback: (VisualObject) -> Unit = {}
+) {
+    clear()
+    append {
+        card("Object tree") {
+            subTree(token, obj, clickCallback)
+        }
+    }
+}
+
+private fun TagConsumer<HTMLElement>.subTree(
+    token: NameToken,
+    obj: VisualObject,
+    clickCallback: (VisualObject) -> Unit
+) {
+
+    if (obj is VisualGroup && !obj.isEmpty) {
+        lateinit var toggle: HTMLSpanElement
+        div("d-inline-block text-truncate") {
+            toggle = span("objTree-caret")
+            label("objTree-label") {
+                +token.toString()
+                onClickFunction = { clickCallback(obj) }
+            }
+        }
+        val subtree = ul("objTree-subtree")
+        toggle.onclick = {
+            toggle.classList.toggle("objTree-caret-down")
+            subtree.apply {
+                if (toggle.classList.contains("objTree-caret-down")) {
+                    obj.children.entries
+                        .filter { !it.key.toString().startsWith("@") }
+                        .sortedBy { (it.value as? VisualGroup)?.isEmpty ?: true }
+                        .forEach { (token, child) ->
+                            append {
+                                li().apply {
+                                    subTree(token, child, clickCallback)
+                                }
+                            }
+                        }
+                } else {
+                    this.clear()
+                }
+            }
+            //jQuery(subtree).asDynamic().collapse("toggle")
+        }
+    } else {
+        div("d-inline-block text-truncate") {
+            span("objTree-leaf")
+            label("objTree-label") {
+                +token.toString()
+                onClickFunction = { clickCallback(obj) }
+            }
+        }
+    }
+}
+
diff --git a/dataforge-vis-common/src/jsMain/kotlin/hep/dataforge/vis/js/editor/jsoneditor.kt b/dataforge-vis-common/src/jsMain/kotlin/hep/dataforge/vis/js/editor/jsoneditor.kt
new file mode 100644
index 00000000..8bfaf93a
--- /dev/null
+++ b/dataforge-vis-common/src/jsMain/kotlin/hep/dataforge/vis/js/editor/jsoneditor.kt
@@ -0,0 +1,185 @@
+@file:Suppress(
+    "INTERFACE_WITH_SUPERCLASS",
+    "OVERRIDING_FINAL_MEMBER",
+    "RETURN_TYPE_MISMATCH_ON_OVERRIDE",
+    "CONFLICTING_OVERLOADS",
+    "EXTERNAL_DELEGATION"
+)
+
+package hep.dataforge.vis.js.editor
+
+import org.w3c.dom.HTMLElement
+
+external interface Node {
+    var field: String
+    var value: String? get() = definedExternally; set(value) = definedExternally
+    var path: dynamic
+}
+
+external interface NodeName {
+    var path: Array<String>
+    var type: dynamic /* 'object' | 'array' */
+    var size: Number
+}
+
+external interface ValidationError {
+    var path: dynamic
+    var message: String
+}
+
+external interface Template {
+    var text: String
+    var title: String
+    var className: String? get() = definedExternally; set(value) = definedExternally
+    var field: String
+    var value: Any
+}
+
+external interface `T$6` {
+    var startFrom: Number
+    var options: Array<String>
+}
+
+external interface AutoCompleteOptions {
+    var confirmKeys: Array<Number>? get() = definedExternally; set(value) = definedExternally
+    var caseSensitive: Boolean? get() = definedExternally; set(value) = definedExternally
+//    var getOptions: AutoCompleteOptionsGetter? get() = definedExternally; set(value) = definedExternally
+}
+
+external interface SelectionPosition {
+    var row: Number
+    var column: Number
+}
+
+external interface SerializableNode {
+    var value: Any
+    var path: dynamic
+}
+
+external interface Color {
+    var rgba: Array<Number>
+    var hsla: Array<Number>
+    var rgbString: String
+    var rgbaString: String
+    var hslString: String
+    var hslaString: String
+    var hex: String
+}
+
+//external interface `T$0` {
+//    var field: Boolean
+//    var value: Boolean
+//}
+//
+//external interface `T$1` {
+//    @nativeGetter
+//    operator fun get(key: String): String?
+//
+//    @nativeSetter
+//    operator fun set(key: String, value: String)
+//}
+
+//external interface Languages {
+//    @nativeGetter
+//    operator fun get(lang: String): `T$1`?
+//
+//    @nativeSetter
+//    operator fun set(lang: String, value: `T$1`)
+//}
+
+external interface JSONEditorOptions {
+//    var ace: AceAjax.Ace? get() = definedExternally; set(value) = definedExternally
+//    var ajv: Ajv? get() = definedExternally; set(value) = definedExternally
+    var onChange: (() -> Unit)? get() = definedExternally; set(value) = definedExternally
+    var onChangeJSON: ((json: Any) -> Unit)? get() = definedExternally; set(value) = definedExternally
+    var onChangeText: ((jsonString: String) -> Unit)? get() = definedExternally; set(value) = definedExternally
+    var onEditable: ((node: Node) -> dynamic)? get() = definedExternally; set(value) = definedExternally
+    var onError: ((error: Error) -> Unit)? get() = definedExternally; set(value) = definedExternally
+    var onModeChange: ((newMode: dynamic /* 'tree' | 'view' | 'form' | 'code' | 'text' */, oldMode: dynamic /* 'tree' | 'view' | 'form' | 'code' | 'text' */) -> Unit)? get() = definedExternally; set(value) = definedExternally
+    var onNodeName: ((nodeName: NodeName) -> String?)? get() = definedExternally; set(value) = definedExternally
+    var onValidate: ((json: Any) -> dynamic)? get() = definedExternally; set(value) = definedExternally
+    var escapeUnicode: Boolean? get() = definedExternally; set(value) = definedExternally
+    var sortObjectKeys: Boolean? get() = definedExternally; set(value) = definedExternally
+    var history: Boolean? get() = definedExternally; set(value) = definedExternally
+    var mode: dynamic /* 'tree' | 'view' | 'form' | 'code' | 'text' */
+    var modes: Array<dynamic /* 'tree' | 'view' | 'form' | 'code' | 'text' */>? get() = definedExternally; set(value) = definedExternally
+    var name: String? get() = definedExternally; set(value) = definedExternally
+    var schema: Any? get() = definedExternally; set(value) = definedExternally
+    var schemaRefs: Any? get() = definedExternally; set(value) = definedExternally
+    var search: Boolean? get() = definedExternally; set(value) = definedExternally
+    var indentation: Number? get() = definedExternally; set(value) = definedExternally
+    var theme: String? get() = definedExternally; set(value) = definedExternally
+    var templates: Array<Template>? get() = definedExternally; set(value) = definedExternally
+    var autocomplete: AutoCompleteOptions? get() = definedExternally; set(value) = definedExternally
+    var mainMenuBar: Boolean? get() = definedExternally; set(value) = definedExternally
+    var navigationBar: Boolean? get() = definedExternally; set(value) = definedExternally
+    var statusBar: Boolean? get() = definedExternally; set(value) = definedExternally
+    var onTextSelectionChange: ((start: SelectionPosition, end: SelectionPosition, text: String) -> Unit)? get() = definedExternally; set(value) = definedExternally
+    var onSelectionChange: ((start: SerializableNode, end: SerializableNode) -> Unit)? get() = definedExternally; set(value) = definedExternally
+    var onEvent: ((node: Node, event: String) -> Unit)? get() = definedExternally; set(value) = definedExternally
+    var colorPicker: Boolean? get() = definedExternally; set(value) = definedExternally
+    var onColorPicker: ((parent: HTMLElement, color: String, onChange: (color: Color) -> Unit) -> Unit)? get() = definedExternally; set(value) = definedExternally
+    var timestampTag: Boolean? get() = definedExternally; set(value) = definedExternally
+    var language: String? get() = definedExternally; set(value) = definedExternally
+    //var languages: Languages? get() = definedExternally; set(value) = definedExternally
+    var modalAnchor: HTMLElement? get() = definedExternally; set(value) = definedExternally
+    var enableSort: Boolean? get() = definedExternally; set(value) = definedExternally
+    var enableTransform: Boolean? get() = definedExternally; set(value) = definedExternally
+    var maxVisibleChilds: Number? get() = definedExternally; set(value) = definedExternally
+}
+
+external interface JsonPath {
+    var path: dynamic
+}
+
+external interface EditorSelection {
+    var start: SerializableNode
+    var end: SerializableNode
+}
+
+external interface TextSelection {
+    var start: SelectionPosition
+    var end: SelectionPosition
+    var text: String
+}
+
+@JsModule("jsoneditor")
+@JsNonModule
+external open class JSONEditor(
+    container: HTMLElement,
+    options: JSONEditorOptions? = definedExternally /* null */,
+    json: dynamic = definedExternally /* null */
+) {
+    open fun collapseAll()
+    open fun destroy()
+    open fun expandAll()
+    open fun focus()
+    open fun get(): Any
+    open fun getMode(): dynamic /* 'tree' | 'view' | 'form' | 'code' | 'text' */
+    open fun getName(): String?
+    open fun getNodesByRange(start: JsonPath, end: JsonPath): Array<SerializableNode>
+    open fun getSelection(): EditorSelection
+    open fun getText(): String
+    open fun getTextSelection(): TextSelection
+    open fun refresh()
+    open fun set(json: Any)
+    open fun setMode(mode: String /* 'tree' */)
+    open fun setMode(mode: String /* 'view' */)
+    open fun setMode(mode: String /* 'form' */)
+    open fun setMode(mode: String /* 'code' */)
+    open fun setMode(mode: String /* 'text' */)
+    open fun setName(name: String? = definedExternally /* null */)
+    open fun setSchema(schema: Any?, schemaRefs: Any? = definedExternally /* null */)
+    open fun setSelection(start: JsonPath, end: JsonPath)
+    open fun setText(jsonString: String)
+    open fun setTextSelection(start: SelectionPosition, end: SelectionPosition)
+    open fun update(json: Any)
+    open fun updateText(jsonString: String)
+
+    companion object {
+        var VALID_OPTIONS: Array<String>
+//        var ace: AceAjax.Ace
+//        var Ajv: Ajv
+        var VanillaPicker: Any
+    }
+}
\ No newline at end of file
diff --git a/dataforge-vis-spatial/src/jsMain/kotlin/hep/dataforge/vis/spatial/editor/propertyEditor.kt b/dataforge-vis-common/src/jsMain/kotlin/hep/dataforge/vis/js/editor/propertyEditor.kt
similarity index 55%
rename from dataforge-vis-spatial/src/jsMain/kotlin/hep/dataforge/vis/spatial/editor/propertyEditor.kt
rename to dataforge-vis-common/src/jsMain/kotlin/hep/dataforge/vis/js/editor/propertyEditor.kt
index d718127e..e2cdfcaa 100644
--- a/dataforge-vis-spatial/src/jsMain/kotlin/hep/dataforge/vis/spatial/editor/propertyEditor.kt
+++ b/dataforge-vis-common/src/jsMain/kotlin/hep/dataforge/vis/js/editor/propertyEditor.kt
@@ -1,17 +1,12 @@
-package hep.dataforge.vis.spatial.editor
+package hep.dataforge.vis.js.editor
 
 import hep.dataforge.io.toJson
-import hep.dataforge.meta.*
+import hep.dataforge.js.jsObject
+import hep.dataforge.meta.DynamicMeta
+import hep.dataforge.meta.Meta
+import hep.dataforge.meta.update
 import hep.dataforge.vis.common.VisualObject
 import hep.dataforge.vis.common.findStyle
-import hep.dataforge.vis.jsObject
-import hep.dataforge.vis.spatial.Material3D.Companion.COLOR_KEY
-import hep.dataforge.vis.spatial.Material3D.Companion.OPACITY_KEY
-import hep.dataforge.vis.spatial.VisualObject3D.Companion.VISIBLE_KEY
-import hep.dataforge.vis.spatial.color
-import hep.dataforge.vis.spatial.opacity
-import hep.dataforge.vis.spatial.prototype
-import hep.dataforge.vis.spatial.visible
 import kotlinx.html.dom.append
 import kotlinx.html.js.div
 import kotlinx.html.js.h4
@@ -21,19 +16,13 @@ import kotlin.dom.clear
 //FIXME something rotten in JS-Meta converter
 fun Meta.toDynamic() = JSON.parse<dynamic>(toJson().toString())
 
-
-fun Element.propertyEditor(item: VisualObject?, name: String?) {
+//TODO add node descriptor instead of configuring property selector
+fun Element.propertyEditor(item: VisualObject?, propertySelector: (VisualObject) -> Meta = { it.config }) {
     clear()
     if (item != null) {
         append {
             card("Properties") {
-                val config = (item.properties ?: item.prototype?.properties) ?: EmptyMeta
-                val metaToEdit = config.builder().apply {
-                    VISIBLE_KEY to (item.visible ?: true)
-                    COLOR_KEY to (item.color ?: "#ffffff")
-                    OPACITY_KEY to (item.opacity ?: 1.0)
-                }
-                val dMeta: dynamic = metaToEdit.toDynamic()
+                val dMeta: dynamic = propertySelector(item).toDynamic()
                 val options: JSONEditorOptions = jsObject {
                     mode = "form"
                     onChangeJSON = { item.config.update(DynamicMeta(it.asDynamic())) }
@@ -46,13 +35,17 @@ fun Element.propertyEditor(item: VisualObject?, name: String?) {
                 card("Styles") {
                     item.styles.forEach { style ->
                         val styleMeta = item.findStyle(style)
-                        h4("container") { +style.toString() }
+                        h4("container") { +style }
                         if (styleMeta != null) {
                             div("container").apply {
                                 val options: JSONEditorOptions = jsObject {
                                     mode = "view"
                                 }
-                                JSONEditor(this, options, styleMeta.toDynamic())
+                                JSONEditor(
+                                    this,
+                                    options,
+                                    styleMeta.toDynamic()
+                                )
                             }
                         }
                     }
@@ -60,4 +53,4 @@ fun Element.propertyEditor(item: VisualObject?, name: String?) {
             }
         }
     }
-}
+}
\ No newline at end of file
diff --git a/dataforge-vis-common/src/jsMain/resources/css/common.css b/dataforge-vis-common/src/jsMain/resources/css/common.css
new file mode 100644
index 00000000..c5efcd40
--- /dev/null
+++ b/dataforge-vis-common/src/jsMain/resources/css/common.css
@@ -0,0 +1,23 @@
+/* Remove default bullets */
+ul, .objTree-subtree {
+    list-style-type: none;
+}
+
+/* Style the caret/arrow */
+.objTree-caret {
+    cursor: pointer;
+    user-select: none; /* Prevent text selection */
+}
+
+/* Create the caret/arrow with a unicode, and style it */
+.objTree-caret::before {
+    content: "\25B6";
+    color: black;
+    display: inline-block;
+    margin-right: 6px;
+}
+
+/* Rotate the caret/arrow icon when clicked on (using JavaScript) */
+.objTree-caret-down::before {
+    transform: rotate(90deg);
+}
diff --git a/dataforge-vis-fx/src/main/kotlin/hep/dataforge/vis/fx/FXPlugin.kt b/dataforge-vis-common/src/jvmMain/kotlin/hep/dataforge/vis/fx/FXPlugin.kt
similarity index 97%
rename from dataforge-vis-fx/src/main/kotlin/hep/dataforge/vis/fx/FXPlugin.kt
rename to dataforge-vis-common/src/jvmMain/kotlin/hep/dataforge/vis/fx/FXPlugin.kt
index 12e9c4a3..ffe2ef64 100644
--- a/dataforge-vis-fx/src/main/kotlin/hep/dataforge/vis/fx/FXPlugin.kt
+++ b/dataforge-vis-common/src/jvmMain/kotlin/hep/dataforge/vis/fx/FXPlugin.kt
@@ -96,7 +96,7 @@ class FXPlugin(meta: Meta = EmptyMeta) : AbstractPlugin(meta) {
     companion object : PluginFactory<FXPlugin> {
         override val type: KClass<out FXPlugin> = FXPlugin::class
         override val tag: PluginTag = PluginTag("vis.fx", group = PluginTag.DATAFORGE_GROUP)
-        override fun invoke(meta: Meta): FXPlugin = FXPlugin(meta)
+        override fun invoke(meta: Meta, context: Context): FXPlugin = FXPlugin(meta)
     }
 
 }
diff --git a/dataforge-vis-fx/src/main/kotlin/hep/dataforge/vis/fx/values/ColorValueChooser.kt b/dataforge-vis-common/src/jvmMain/kotlin/hep/dataforge/vis/fx/editor/ColorValueChooser.kt
similarity index 80%
rename from dataforge-vis-fx/src/main/kotlin/hep/dataforge/vis/fx/values/ColorValueChooser.kt
rename to dataforge-vis-common/src/jvmMain/kotlin/hep/dataforge/vis/fx/editor/ColorValueChooser.kt
index e0e0f94a..0dac4f8d 100644
--- a/dataforge-vis-fx/src/main/kotlin/hep/dataforge/vis/fx/values/ColorValueChooser.kt
+++ b/dataforge-vis-common/src/jvmMain/kotlin/hep/dataforge/vis/fx/editor/ColorValueChooser.kt
@@ -1,6 +1,8 @@
-package hep.dataforge.vis.fx.values
+package hep.dataforge.vis.fx.editor
 
 import hep.dataforge.meta.Meta
+import hep.dataforge.names.Name
+import hep.dataforge.names.asName
 import hep.dataforge.values.Null
 import hep.dataforge.values.Value
 import hep.dataforge.values.asValue
@@ -39,9 +41,10 @@ class ColorValueChooser : ValueChooserBase<ColorPicker>() {
         return node
     }
 
-    companion object: ValueChooser.Factory{
-        override val name: String = "color"
+    companion object : ValueChooser.Factory {
+        override val name: Name = "color".asName()
 
-        override fun invoke(meta: Meta): ValueChooser = ColorValueChooser()
+        override fun invoke(meta: Meta): ValueChooser =
+            ColorValueChooser()
     }
 }
diff --git a/dataforge-vis-fx/src/main/kotlin/hep/dataforge/vis/fx/values/ComboBoxValueChooser.kt b/dataforge-vis-common/src/jvmMain/kotlin/hep/dataforge/vis/fx/editor/ComboBoxValueChooser.kt
similarity index 86%
rename from dataforge-vis-fx/src/main/kotlin/hep/dataforge/vis/fx/values/ComboBoxValueChooser.kt
rename to dataforge-vis-common/src/jvmMain/kotlin/hep/dataforge/vis/fx/editor/ComboBoxValueChooser.kt
index 0f6460e0..a3643099 100644
--- a/dataforge-vis-fx/src/main/kotlin/hep/dataforge/vis/fx/values/ComboBoxValueChooser.kt
+++ b/dataforge-vis-common/src/jvmMain/kotlin/hep/dataforge/vis/fx/editor/ComboBoxValueChooser.kt
@@ -3,11 +3,13 @@
  * To change this template file, choose Tools | Templates
  * and open the template in the editor.
  */
-package hep.dataforge.vis.fx.values
+package hep.dataforge.vis.fx.editor
 
 import hep.dataforge.meta.Meta
 import hep.dataforge.meta.get
 import hep.dataforge.meta.value
+import hep.dataforge.names.Name
+import hep.dataforge.names.asName
 import hep.dataforge.values.Value
 import hep.dataforge.values.parseValue
 import javafx.collections.FXCollections
@@ -50,9 +52,10 @@ class ComboBoxValueChooser(val values: Collection<Value>? = null) : ValueChooser
     }
 
     companion object : ValueChooser.Factory {
-        override val name: String = "combo"
+        override val name: Name = "combo".asName()
 
-        override fun invoke(meta: Meta): ValueChooser = ComboBoxValueChooser(meta["values"].value?.list)
+        override fun invoke(meta: Meta): ValueChooser =
+            ComboBoxValueChooser(meta["values"].value?.list)
     }
 
 }
diff --git a/dataforge-vis-fx/src/main/kotlin/hep/dataforge/vis/fx/meta/ConfigEditor.kt b/dataforge-vis-common/src/jvmMain/kotlin/hep/dataforge/vis/fx/editor/ConfigEditor.kt
similarity index 90%
rename from dataforge-vis-fx/src/main/kotlin/hep/dataforge/vis/fx/meta/ConfigEditor.kt
rename to dataforge-vis-common/src/jvmMain/kotlin/hep/dataforge/vis/fx/editor/ConfigEditor.kt
index da961fdb..93af2df4 100644
--- a/dataforge-vis-fx/src/main/kotlin/hep/dataforge/vis/fx/meta/ConfigEditor.kt
+++ b/dataforge-vis-common/src/jvmMain/kotlin/hep/dataforge/vis/fx/editor/ConfigEditor.kt
@@ -3,20 +3,22 @@
  * To change this template file, choose Tools | Templates
  * and open the template in the editor.
  */
-package hep.dataforge.vis.fx.meta
+package hep.dataforge.vis.fx.editor
 
+import de.jensd.fx.glyphs.fontawesome.FontAwesomeIcon
+import de.jensd.fx.glyphs.fontawesome.FontAwesomeIconView
 import hep.dataforge.context.Global
 import hep.dataforge.descriptors.NodeDescriptor
 import hep.dataforge.meta.Config
 import hep.dataforge.names.NameToken
 import hep.dataforge.vis.fx.dfIconView
-import hep.dataforge.vis.fx.values.ValueChooser
+import javafx.scene.Node
 import javafx.scene.control.*
 import javafx.scene.control.cell.TextFieldTreeTableCell
+import javafx.scene.layout.HBox
 import javafx.scene.layout.Priority
 import javafx.scene.paint.Color
 import javafx.scene.text.Text
-import org.controlsfx.glyphfont.Glyph
 import tornadofx.*
 
 /**
@@ -29,8 +31,9 @@ class ConfigEditor(
     val allowNew: Boolean = true,
     title: String = "Configuration editor"
 ) : Fragment(title = title, icon = dfIconView) {
+    //TODO replace parameters by properties
 
-    constructor(config: Config, descriptor: NodeDescriptor, title: String = "Configuration editor") :
+    constructor(config: Config, descriptor: NodeDescriptor?, title: String = "Configuration editor") :
             this(FXMeta.root(config, descriptor = descriptor), title = title)
 
     override val root = borderpane {
@@ -133,8 +136,9 @@ class ConfigEditor(
                         is FXMetaNode<Config> -> {
                             if (allowNew) {
                                 text = null
-                                graphic = hbox {
-                                    button("node", Glyph("FontAwesome", "PLUS_CIRCLE")) {
+                                graphic = HBox().apply {
+                                    val glyph: Node = FontAwesomeIconView(FontAwesomeIcon.PLUS_CIRCLE)
+                                    button("node", graphic = glyph) {
                                         hgrow = Priority.ALWAYS
                                         maxWidth = Double.POSITIVE_INFINITY
                                         action {
@@ -143,7 +147,7 @@ class ConfigEditor(
                                             }
                                         }
                                     }
-                                    button("value", Glyph("FontAwesome", "PLUS_SQUARE")) {
+                                    button("value", graphic = FontAwesomeIconView(FontAwesomeIcon.PLUS_SQUARE)) {
                                         hgrow = Priority.ALWAYS
                                         maxWidth = Double.POSITIVE_INFINITY
                                         action {
diff --git a/dataforge-vis-fx/src/main/kotlin/hep/dataforge/vis/fx/meta/FXMeta.kt b/dataforge-vis-common/src/jvmMain/kotlin/hep/dataforge/vis/fx/editor/FXMeta.kt
similarity index 96%
rename from dataforge-vis-fx/src/main/kotlin/hep/dataforge/vis/fx/meta/FXMeta.kt
rename to dataforge-vis-common/src/jvmMain/kotlin/hep/dataforge/vis/fx/editor/FXMeta.kt
index 82d48491..2eb14215 100644
--- a/dataforge-vis-fx/src/main/kotlin/hep/dataforge/vis/fx/meta/FXMeta.kt
+++ b/dataforge-vis-common/src/jvmMain/kotlin/hep/dataforge/vis/fx/editor/FXMeta.kt
@@ -1,4 +1,4 @@
-package hep.dataforge.vis.fx.meta
+package hep.dataforge.vis.fx.editor
 
 import hep.dataforge.descriptors.ItemDescriptor
 import hep.dataforge.descriptors.NodeDescriptor
@@ -84,7 +84,7 @@ class FXMetaNode<M : MetaNode<M>>(
     override val hasValue: ObservableBooleanValue = nodeProperty.booleanBinding { it != null }
 
     private val filter: (FXMeta<M>) -> Boolean = { cfg ->
-        !(cfg.descriptor?.tags?.contains(ConfigEditor.NO_CONFIGURATOR_TAG) ?: false)
+        !(cfg.descriptor?.attributes?.get(ConfigEditor.NO_CONFIGURATOR_TAG)?.boolean ?: false)
     }
 
     val children = object : ListBinding<FXMeta<M>>() {
@@ -172,7 +172,7 @@ fun <M : MutableMeta<M>> FXMetaNode<M>.remove(name: NameToken) {
 private fun <M : MutableMeta<M>> M.createEmptyNode(token: NameToken, append: Boolean): M {
     return if (append && token.index.isNotEmpty()) {
         val name = token.asName()
-        val index = (getAll(name).keys.mapNotNull { it.toIntOrNull() }.max() ?: -1) + 1
+        val index = (getIndexed(name).keys.mapNotNull { it.toIntOrNull() }.max() ?: -1) + 1
         val newName = name.withIndex(index.toString())
         set(newName, EmptyMeta)
         get(newName).node!!
diff --git a/dataforge-vis-fx/src/main/kotlin/hep/dataforge/vis/fx/meta/MetaViewer.kt b/dataforge-vis-common/src/jvmMain/kotlin/hep/dataforge/vis/fx/editor/MetaViewer.kt
similarity index 98%
rename from dataforge-vis-fx/src/main/kotlin/hep/dataforge/vis/fx/meta/MetaViewer.kt
rename to dataforge-vis-common/src/jvmMain/kotlin/hep/dataforge/vis/fx/editor/MetaViewer.kt
index 99026620..1120ebf4 100644
--- a/dataforge-vis-fx/src/main/kotlin/hep/dataforge/vis/fx/meta/MetaViewer.kt
+++ b/dataforge-vis-common/src/jvmMain/kotlin/hep/dataforge/vis/fx/editor/MetaViewer.kt
@@ -14,7 +14,7 @@
  *  limitations under the License.
  */
 
-package hep.dataforge.vis.fx.meta
+package hep.dataforge.vis.fx.editor
 
 import hep.dataforge.meta.Meta
 import hep.dataforge.vis.fx.dfIconView
diff --git a/dataforge-vis-fx/src/main/kotlin/hep/dataforge/vis/fx/values/TextValueChooser.kt b/dataforge-vis-common/src/jvmMain/kotlin/hep/dataforge/vis/fx/editor/TextValueChooser.kt
similarity index 92%
rename from dataforge-vis-fx/src/main/kotlin/hep/dataforge/vis/fx/values/TextValueChooser.kt
rename to dataforge-vis-common/src/jvmMain/kotlin/hep/dataforge/vis/fx/editor/TextValueChooser.kt
index b273b71f..92e59acf 100644
--- a/dataforge-vis-fx/src/main/kotlin/hep/dataforge/vis/fx/values/TextValueChooser.kt
+++ b/dataforge-vis-common/src/jvmMain/kotlin/hep/dataforge/vis/fx/editor/TextValueChooser.kt
@@ -3,9 +3,11 @@
  * To change this template file, choose Tools | Templates
  * and open the template in the editor.
  */
-package hep.dataforge.vis.fx.values
+package hep.dataforge.vis.fx.editor
 
 import hep.dataforge.meta.Meta
+import hep.dataforge.names.Name
+import hep.dataforge.names.asName
 import hep.dataforge.values.*
 import javafx.beans.value.ObservableValue
 import javafx.scene.control.TextField
@@ -100,7 +102,8 @@ class TextValueChooser : ValueChooserBase<TextField>() {
     }
 
     companion object : ValueChooser.Factory {
-        override val name: String = "text"
-        override fun invoke(meta: Meta): ValueChooser = TextValueChooser()
+        override val name: Name = "text".asName()
+        override fun invoke(meta: Meta): ValueChooser =
+            TextValueChooser()
     }
 }
diff --git a/dataforge-vis-fx/src/main/kotlin/hep/dataforge/vis/fx/values/ValueCallback.kt b/dataforge-vis-common/src/jvmMain/kotlin/hep/dataforge/vis/fx/editor/ValueCallback.kt
similarity index 94%
rename from dataforge-vis-fx/src/main/kotlin/hep/dataforge/vis/fx/values/ValueCallback.kt
rename to dataforge-vis-common/src/jvmMain/kotlin/hep/dataforge/vis/fx/editor/ValueCallback.kt
index c327ab22..bf7cdb7b 100644
--- a/dataforge-vis-fx/src/main/kotlin/hep/dataforge/vis/fx/values/ValueCallback.kt
+++ b/dataforge-vis-common/src/jvmMain/kotlin/hep/dataforge/vis/fx/editor/ValueCallback.kt
@@ -3,7 +3,7 @@
  * To change this template file, choose Tools | Templates
  * and open the template in the editor.
  */
-package hep.dataforge.vis.fx.values
+package hep.dataforge.vis.fx.editor
 
 import hep.dataforge.values.Value
 
diff --git a/dataforge-vis-fx/src/main/kotlin/hep/dataforge/vis/fx/values/ValueChooser.kt b/dataforge-vis-common/src/jvmMain/kotlin/hep/dataforge/vis/fx/editor/ValueChooser.kt
similarity index 87%
rename from dataforge-vis-fx/src/main/kotlin/hep/dataforge/vis/fx/values/ValueChooser.kt
rename to dataforge-vis-common/src/jvmMain/kotlin/hep/dataforge/vis/fx/editor/ValueChooser.kt
index 77ec9f28..f8946a4a 100644
--- a/dataforge-vis-fx/src/main/kotlin/hep/dataforge/vis/fx/values/ValueChooser.kt
+++ b/dataforge-vis-common/src/jvmMain/kotlin/hep/dataforge/vis/fx/editor/ValueChooser.kt
@@ -3,13 +3,14 @@
  * To change this template file, choose Tools | Templates
  * and open the template in the editor.
  */
-package hep.dataforge.vis.fx.values
+package hep.dataforge.vis.fx.editor
 
 import hep.dataforge.context.Context
 import hep.dataforge.context.Named
 import hep.dataforge.descriptors.ValueDescriptor
 import hep.dataforge.meta.EmptyMeta
 import hep.dataforge.meta.Meta
+import hep.dataforge.names.toName
 import hep.dataforge.provider.Type
 import hep.dataforge.provider.provideByType
 import hep.dataforge.values.Null
@@ -71,7 +72,7 @@ interface ValueChooser {
     companion object {
 
         private fun findWidgetByType(context: Context, type: String): Factory? {
-            return when (type) {
+            return when (type.toName()) {
                 TextValueChooser.name -> TextValueChooser
                 ColorValueChooser.name -> ColorValueChooser
                 ComboBoxValueChooser.name -> ComboBoxValueChooser
@@ -86,7 +87,10 @@ interface ValueChooser {
                 val widgetType = descriptor.widgetType
                 val chooser: ValueChooser = when {
                     widgetType != null -> {
-                        findWidgetByType(context, widgetType)?.invoke(
+                        findWidgetByType(
+                            context,
+                            widgetType
+                        )?.invoke(
                             descriptor.widget
                         ) ?: TextValueChooser()
                     }
@@ -104,7 +108,8 @@ interface ValueChooser {
             descriptor: ValueDescriptor? = null,
             setter: (Value) -> Unit
         ): ValueChooser {
-            val chooser = build(context, descriptor)
+            val chooser =
+                build(context, descriptor)
             chooser.setDisplayValue(value.value ?: Null)
             value.onChange {
                 chooser.setDisplayValue(it ?: Null)
@@ -114,7 +119,11 @@ interface ValueChooser {
                     setter(result)
                     ValueCallbackResponse(true, result, "OK")
                 } else {
-                    ValueCallbackResponse(false, value.value ?: Null, "Not allowed")
+                    ValueCallbackResponse(
+                        false,
+                        value.value ?: Null,
+                        "Not allowed"
+                    )
                 }
             }
             return chooser
diff --git a/dataforge-vis-fx/src/main/kotlin/hep/dataforge/vis/fx/values/ValueChooserBase.kt b/dataforge-vis-common/src/jvmMain/kotlin/hep/dataforge/vis/fx/editor/ValueChooserBase.kt
similarity index 98%
rename from dataforge-vis-fx/src/main/kotlin/hep/dataforge/vis/fx/values/ValueChooserBase.kt
rename to dataforge-vis-common/src/jvmMain/kotlin/hep/dataforge/vis/fx/editor/ValueChooserBase.kt
index a9e2fc01..7cbbcc1f 100644
--- a/dataforge-vis-fx/src/main/kotlin/hep/dataforge/vis/fx/values/ValueChooserBase.kt
+++ b/dataforge-vis-common/src/jvmMain/kotlin/hep/dataforge/vis/fx/editor/ValueChooserBase.kt
@@ -3,7 +3,7 @@
  * To change this template file, choose Tools | Templates
  * and open the template in the editor.
  */
-package hep.dataforge.vis.fx.values
+package hep.dataforge.vis.fx.editor
 
 import hep.dataforge.descriptors.ValueDescriptor
 import hep.dataforge.values.Null
diff --git a/dataforge-vis-common/src/jvmMain/kotlin/hep/dataforge/vis/fx/editor/VisualObjectEditorFragment.kt b/dataforge-vis-common/src/jvmMain/kotlin/hep/dataforge/vis/fx/editor/VisualObjectEditorFragment.kt
new file mode 100644
index 00000000..fd52d64c
--- /dev/null
+++ b/dataforge-vis-common/src/jvmMain/kotlin/hep/dataforge/vis/fx/editor/VisualObjectEditorFragment.kt
@@ -0,0 +1,74 @@
+package hep.dataforge.vis.fx.editor
+
+import hep.dataforge.descriptors.NodeDescriptor
+import hep.dataforge.meta.Config
+import hep.dataforge.meta.Meta
+import hep.dataforge.meta.update
+import hep.dataforge.vis.common.VisualObject
+import hep.dataforge.vis.common.findStyle
+import javafx.beans.binding.Binding
+import javafx.beans.property.SimpleObjectProperty
+import javafx.scene.Node
+import javafx.scene.Parent
+import javafx.scene.layout.VBox
+import tornadofx.*
+
+class VisualObjectEditorFragment(val selector: (VisualObject) -> Meta) : Fragment() {
+
+    val itemProperty = SimpleObjectProperty<VisualObject>()
+    var item: VisualObject? by itemProperty
+    val descriptorProperty = SimpleObjectProperty<NodeDescriptor>()
+
+    constructor(
+        item: VisualObject?,
+        descriptor: NodeDescriptor?,
+        selector: (VisualObject) -> Config = { it.config }
+    ) : this(selector) {
+        this.item = item
+        this.descriptorProperty.set(descriptor)
+    }
+
+    private var currentConfig: Config? = null
+
+    private val configProperty: Binding<Config?> = itemProperty.objectBinding { visualObject ->
+        if (visualObject == null) return@objectBinding null
+        val meta = selector(visualObject)
+        val config = Config().apply {
+            update(meta)
+            onChange(this@VisualObjectEditorFragment) { key, _, after ->
+                visualObject.setProperty(key, after)
+            }
+        }
+        //remember old config reference to cleanup listeners
+        currentConfig?.removeListener(this)
+        currentConfig = config
+        config
+    }
+
+    private val configEditorProperty: Binding<Node?> = configProperty.objectBinding(descriptorProperty) {
+        it?.let {
+            ConfigEditor(it, descriptorProperty.get()).root
+        }
+    }
+
+    private val styleBoxProperty: Binding<Node?> = configProperty.objectBinding() {
+        VBox().apply {
+            item?.styles?.forEach { styleName ->
+                val styleMeta = item?.findStyle(styleName)
+                if (styleMeta != null) {
+                    titledpane(styleName, node = MetaViewer(styleMeta).root)
+                }
+            }
+        }
+    }
+
+    override val root: Parent = vbox {
+        titledpane("Properties", collapsible = false) {
+            contentProperty().bind(configEditorProperty)
+        }
+        titledpane("Styles", collapsible = false) {
+            visibleWhen(itemProperty.booleanBinding { it?.styles?.isNotEmpty() ?: false })
+            contentProperty().bind(styleBoxProperty)
+        }
+    }
+}
\ No newline at end of file
diff --git a/dataforge-vis-common/src/jvmMain/kotlin/hep/dataforge/vis/fx/editor/VisualObjectTreeFragment.kt b/dataforge-vis-common/src/jvmMain/kotlin/hep/dataforge/vis/fx/editor/VisualObjectTreeFragment.kt
new file mode 100644
index 00000000..4f27ef87
--- /dev/null
+++ b/dataforge-vis-common/src/jvmMain/kotlin/hep/dataforge/vis/fx/editor/VisualObjectTreeFragment.kt
@@ -0,0 +1,55 @@
+package hep.dataforge.vis.fx.editor
+
+import hep.dataforge.vis.common.VisualGroup
+import hep.dataforge.vis.common.VisualObject
+import javafx.beans.property.SimpleObjectProperty
+import javafx.scene.control.SelectionMode
+import javafx.scene.control.TreeItem
+import tornadofx.*
+
+private fun toTreeItem(visualObject: VisualObject, title: String): TreeItem<Pair<String, VisualObject>> {
+    return object : TreeItem<Pair<String, VisualObject>>(title to visualObject) {
+        init {
+            if (visualObject is VisualGroup) {
+                //lazy populate the tree
+                expandedProperty().onChange { expanded ->
+                    if (expanded && children.isEmpty()) {
+                        children.setAll(visualObject.children.map {
+                            toTreeItem(it.value, it.key.toString())
+                        })
+                    }
+                }
+            }
+        }
+
+        override fun isLeaf(): Boolean {
+            return !(visualObject is VisualGroup && visualObject.children.isNotEmpty())
+        }
+    }
+}
+
+
+class VisualObjectTreeFragment : Fragment() {
+    val itemProperty = SimpleObjectProperty<VisualObject>()
+    var item: VisualObject? by itemProperty
+
+    val selectedProperty = SimpleObjectProperty<VisualObject>()
+
+    override val root = vbox {
+        titledpane("Object tree", collapsible = false) {
+            treeview<Pair<String, VisualObject>> {
+                cellFormat {
+                    text = item.first
+                }
+                itemProperty.onChange { rootObject ->
+                    if (rootObject != null) {
+                        root = toTreeItem(rootObject, "world")
+                    }
+                }
+                selectionModel.selectionMode = SelectionMode.SINGLE
+                val selectedValue = selectionModel.selectedItemProperty().objectBinding { it?.value?.second }
+                selectedProperty.bind(selectedValue)
+            }
+        }
+    }
+}
\ No newline at end of file
diff --git a/dataforge-vis-fx/src/main/resources/img/df.png b/dataforge-vis-common/src/jvmMain/resources/img/df.png
similarity index 100%
rename from dataforge-vis-fx/src/main/resources/img/df.png
rename to dataforge-vis-common/src/jvmMain/resources/img/df.png
diff --git a/dataforge-vis-fx/src/main/kotlin/hep/dataforge/vis/fx/demo/MetaEditorDemo.kt b/dataforge-vis-common/src/jvmTest/kotlin/hep/dataforge/vis/fx/demo/MetaEditorDemo.kt
similarity index 78%
rename from dataforge-vis-fx/src/main/kotlin/hep/dataforge/vis/fx/demo/MetaEditorDemo.kt
rename to dataforge-vis-common/src/jvmTest/kotlin/hep/dataforge/vis/fx/demo/MetaEditorDemo.kt
index 6ced3e79..09ec35fc 100644
--- a/dataforge-vis-fx/src/main/kotlin/hep/dataforge/vis/fx/demo/MetaEditorDemo.kt
+++ b/dataforge-vis-common/src/jvmTest/kotlin/hep/dataforge/vis/fx/demo/MetaEditorDemo.kt
@@ -4,9 +4,9 @@ import hep.dataforge.descriptors.NodeDescriptor
 import hep.dataforge.meta.buildMeta
 import hep.dataforge.meta.toConfig
 import hep.dataforge.values.ValueType
-import hep.dataforge.vis.fx.meta.ConfigEditor
-import hep.dataforge.vis.fx.meta.FXMeta
-import hep.dataforge.vis.fx.meta.MetaViewer
+import hep.dataforge.vis.fx.editor.ConfigEditor
+import hep.dataforge.vis.fx.editor.FXMeta
+import hep.dataforge.vis.fx.editor.MetaViewer
 import javafx.geometry.Orientation
 import tornadofx.*
 
@@ -16,16 +16,16 @@ class MetaEditorDemoApp : App(MetaEditorDemo::class)
 class MetaEditorDemo : View("Meta editor demo") {
 
     val meta = buildMeta {
-        "aNode" to {
-            "innerNode" to {
-                "innerValue" to true
+        "aNode" put {
+            "innerNode" put {
+                "innerValue" put true
             }
-            "b" to 223
-            "c" to "StringValue"
+            "b" put 223
+            "c" put "StringValue"
         }
     }.toConfig()
 
-    val descriptor = NodeDescriptor.build {
+    val descriptor = NodeDescriptor {
         node("aNode") {
             info = "A root demo node"
             value("b") {
diff --git a/dataforge-vis-fx/build.gradle.kts b/dataforge-vis-fx/build.gradle.kts
deleted file mode 100644
index 6408a4ab..00000000
--- a/dataforge-vis-fx/build.gradle.kts
+++ /dev/null
@@ -1,23 +0,0 @@
-import org.jetbrains.kotlin.gradle.tasks.KotlinCompile
-import org.openjfx.gradle.JavaFXOptions
-
-plugins {
-    id("scientifik.jvm")
-    id("org.openjfx.javafxplugin")
-}
-
-dependencies {
-    api(project(":dataforge-vis-common"))
-    api("no.tornado:tornadofx:1.7.19")
-    api("no.tornado:tornadofx-controlsfx:0.1")
-}
-
-configure<JavaFXOptions> {
-    modules("javafx.controls")
-}
-
-tasks.withType<KotlinCompile> {
-    kotlinOptions{
-        jvmTarget = "1.8"
-    }
-}
\ No newline at end of file
diff --git a/dataforge-vis-jsroot/src/main/kotlin/hep/dataforge/vis/jsroot/JSRootDemoApp.kt b/dataforge-vis-jsroot/src/main/kotlin/hep/dataforge/vis/jsroot/JSRootDemoApp.kt
index aa6eb542..9775dbb7 100644
--- a/dataforge-vis-jsroot/src/main/kotlin/hep/dataforge/vis/jsroot/JSRootDemoApp.kt
+++ b/dataforge-vis-jsroot/src/main/kotlin/hep/dataforge/vis/jsroot/JSRootDemoApp.kt
@@ -74,5 +74,5 @@ class JSRootDemoApp : ApplicationBase() {
         }
     }
 
-    override fun dispose() = emptyMap<String, Any>()//mapOf("lines" to presenter.dispose())
+    override fun dispose() = emptyMap<String, Any>()//mapOf("lines" put presenter.dispose())
 }
\ No newline at end of file
diff --git a/dataforge-vis-jsroot/src/main/kotlin/hep/dataforge/vis/jsroot/JSRootGeometry.kt b/dataforge-vis-jsroot/src/main/kotlin/hep/dataforge/vis/jsroot/JSRootGeometry.kt
index c23546a1..f4ee6c42 100644
--- a/dataforge-vis-jsroot/src/main/kotlin/hep/dataforge/vis/jsroot/JSRootGeometry.kt
+++ b/dataforge-vis-jsroot/src/main/kotlin/hep/dataforge/vis/jsroot/JSRootGeometry.kt
@@ -15,37 +15,37 @@ class JSRootGeometry(parent: VisualObject?, meta: Meta) : DisplayLeaf(parent, me
     var facesLimit by int(0)
 
     fun box(xSize: Number, ySize: Number, zSize: Number) = buildMeta {
-        "_typename" to "TGeoBBox"
-        "fDX" to xSize
-        "fDY" to ySize
-        "fDZ" to zSize
+        "_typename" put "TGeoBBox"
+        "fDX" put xSize
+        "fDY" put ySize
+        "fDZ" put zSize
     }
 
     /**
      * Create a GDML union
      */
     operator fun Meta.plus(other: Meta) = buildMeta {
-        "fNode.fLeft" to this
-        "fNode.fRight" to other
-        "fNode._typename" to "TGeoUnion"
+        "fNode.fLeft" put this
+        "fNode.fRight" put other
+        "fNode._typename" put "TGeoUnion"
     }
 
     /**
      * Create a GDML subtraction
      */
     operator fun Meta.minus(other: Meta)  = buildMeta {
-        "fNode.fLeft" to this
-        "fNode.fRight" to other
-        "fNode._typename" to "TGeoSubtraction"
+        "fNode.fLeft" put this
+        "fNode.fRight" put other
+        "fNode._typename" put "TGeoSubtraction"
     }
 
     /**
      * Intersect two GDML geometries
      */
     infix fun Meta.intersect(other: Meta) = buildMeta {
-        "fNode.fLeft" to this
-        "fNode.fRight" to other
-        "fNode._typename" to "TGeoIntersection"
+        "fNode.fLeft" put this
+        "fNode.fRight" put other
+        "fNode._typename" put "TGeoIntersection"
     }
 
     companion object {
diff --git a/dataforge-vis-spatial-gdml/build.gradle.kts b/dataforge-vis-spatial-gdml/build.gradle.kts
index af7f99ad..2d8a4200 100644
--- a/dataforge-vis-spatial-gdml/build.gradle.kts
+++ b/dataforge-vis-spatial-gdml/build.gradle.kts
@@ -2,10 +2,6 @@ plugins {
     id("scientifik.mpp")
 }
 
-scientifik{
-    withSerialization()
-}
-
 kotlin {
     sourceSets {
         val commonMain by getting {
@@ -14,11 +10,11 @@ kotlin {
                 api("scientifik:gdml:0.1.4")
             }
         }
-        val jsMain by getting {
-            dependencies {
-                api(project(":dataforge-vis-spatial"))
-                //api("kotlin.js.externals:kotlin-js-jquery:3.2.0-0")
-            }
-        }
     }
-}
\ No newline at end of file
+}
+
+//tasks{
+//    val jsBrowserWebpack by getting(KotlinWebpack::class) {
+//        sourceMaps = false
+//    }
+//}
\ No newline at end of file
diff --git a/dataforge-vis-spatial-gdml/src/commonMain/kotlin/hep/dataforge/vis/spatial/gdml/GDMLTransformer.kt b/dataforge-vis-spatial-gdml/src/commonMain/kotlin/hep/dataforge/vis/spatial/gdml/GDMLTransformer.kt
index ee646f7a..9d664aff 100644
--- a/dataforge-vis-spatial-gdml/src/commonMain/kotlin/hep/dataforge/vis/spatial/gdml/GDMLTransformer.kt
+++ b/dataforge-vis-spatial-gdml/src/commonMain/kotlin/hep/dataforge/vis/spatial/gdml/GDMLTransformer.kt
@@ -5,20 +5,15 @@ import hep.dataforge.meta.MetaBuilder
 import hep.dataforge.meta.buildMeta
 import hep.dataforge.names.Name
 import hep.dataforge.names.toName
-import hep.dataforge.vis.common.Colors
-import hep.dataforge.vis.common.VisualObject
-import hep.dataforge.vis.common.applyStyle
-import hep.dataforge.vis.spatial.Material3D.Companion.COLOR_KEY
-import hep.dataforge.vis.spatial.RotationOrder
-import hep.dataforge.vis.spatial.VisualGroup3D
-import hep.dataforge.vis.spatial.VisualObject3D
-import hep.dataforge.vis.spatial.rotationOrder
+import hep.dataforge.vis.common.useStyle
+import hep.dataforge.vis.spatial.*
+import hep.dataforge.vis.spatial.Material3D.Companion.MATERIAL_COLOR_KEY
 import scientifik.gdml.*
 import kotlin.random.Random
 
 class GDMLTransformer(val root: GDML) {
-    private val materialCache = HashMap<GDMLMaterial, Meta>()
-    private val random = Random(111)
+    //private val materialCache = HashMap<GDMLMaterial, Meta>()
+    private val random = Random(222)
 
     enum class Action {
         ACCEPT,
@@ -29,7 +24,7 @@ class GDMLTransformer(val root: GDML) {
     /**
      * A special group for local templates
      */
-    val templates by lazy { VisualGroup3D() }
+    val proto by lazy { VisualGroup3D() }
     private val styleCache = HashMap<Name, Meta>()
 
     var lUnit: LUnit = LUnit.MM
@@ -38,13 +33,20 @@ class GDMLTransformer(val root: GDML) {
     var volumeAction: (GDMLGroup) -> Action = { Action.CACHE }
 
 
-    var solidConfiguration: VisualObject3D.(parent: GDMLVolume, solid: GDMLSolid) -> Unit = { _, _ -> }
+    var solidConfiguration: VisualObject3D.(parent: GDMLVolume, solid: GDMLSolid) -> Unit = { parent, _ ->
+        lUnit = LUnit.CM
+        if (parent.physVolumes.isNotEmpty()) {
+            useStyle("opaque") {
+                Material3D.MATERIAL_OPACITY_KEY put 0.3
+            }
+        }
+    }
 
-    fun VisualObject.useStyle(name: String, builder: MetaBuilder.() -> Unit) {
-        styleCache.getOrPut(name.toName()){
+    fun VisualObject3D.useStyle(name: String, builder: MetaBuilder.() -> Unit) {
+        styleCache.getOrPut(name.toName()) {
             buildMeta(builder)
         }
-        applyStyle(name)
+        useStyle(name)
     }
 
     internal fun configureSolid(obj: VisualObject3D, parent: GDMLVolume, solid: GDMLSolid) {
@@ -52,9 +54,9 @@ class GDMLTransformer(val root: GDML) {
 
         val styleName = "material[${material.name}]"
 
-        obj.useStyle(styleName){
-            COLOR_KEY to Colors.rgbToString(random.nextInt(0, Int.MAX_VALUE))
-            "gdml.material" to material.name
+        obj.useStyle(styleName) {
+            MATERIAL_COLOR_KEY put random.nextInt(16777216)
+            "gdml.material" put material.name
         }
 
         obj.solidConfiguration(parent, solid)
@@ -67,13 +69,15 @@ class GDMLTransformer(val root: GDML) {
     var onFinish: GDMLTransformer.() -> Unit = {}
 
     internal fun finalize(final: VisualGroup3D): VisualGroup3D {
-        final.templates = templates
+        final.prototypes = proto
         styleCache.forEach {
-            final.addStyle(it.key, it.value, false)
+            final.styleSheet {
+                define(it.key.toString(), it.value)
+            }
         }
         final.rotationOrder = RotationOrder.ZXY
         onFinish(this@GDMLTransformer)
         return final
     }
 
-}
+}
\ No newline at end of file
diff --git a/dataforge-vis-spatial-gdml/src/commonMain/kotlin/hep/dataforge/vis/spatial/gdml/visualGDML.kt b/dataforge-vis-spatial-gdml/src/commonMain/kotlin/hep/dataforge/vis/spatial/gdml/visualGDML.kt
index 3271fe38..8fc395e1 100644
--- a/dataforge-vis-spatial-gdml/src/commonMain/kotlin/hep/dataforge/vis/spatial/gdml/visualGDML.kt
+++ b/dataforge-vis-spatial-gdml/src/commonMain/kotlin/hep/dataforge/vis/spatial/gdml/visualGDML.kt
@@ -1,10 +1,13 @@
 package hep.dataforge.vis.spatial.gdml
 
-import hep.dataforge.names.EmptyName
+
+import hep.dataforge.names.Name
 import hep.dataforge.names.asName
 import hep.dataforge.names.plus
 import hep.dataforge.vis.common.get
 import hep.dataforge.vis.spatial.*
+import hep.dataforge.vis.spatial.World.ONE
+import hep.dataforge.vis.spatial.World.ZERO
 import scientifik.gdml.*
 import kotlin.math.cos
 import kotlin.math.sin
@@ -12,25 +15,28 @@ import kotlin.math.sin
 
 private fun VisualObject3D.withPosition(
     lUnit: LUnit,
-    pos: GDMLPosition? = null,
-    rotation: GDMLRotation? = null,
-    scale: GDMLScale? = null
+    newPos: GDMLPosition? = null,
+    newRotation: GDMLRotation? = null,
+    newScale: GDMLScale? = null
 ): VisualObject3D = apply {
-    pos?.let {
-        this@withPosition.x = pos.x(lUnit)
-        this@withPosition.y = pos.y(lUnit)
-        this@withPosition.z = pos.z(lUnit)
+    newPos?.let {
+        val point = Point3D(it.x(lUnit), it.y(lUnit), it.z(lUnit))
+        if (position != null || point != ZERO) {
+            position = point
+        }
     }
-    rotation?.let {
-        this@withPosition.rotationX = rotation.x()
-        this@withPosition.rotationY = rotation.y()
-        this@withPosition.rotationZ = rotation.z()
+    newRotation?.let {
+        val point = Point3D(it.x(), it.y(), it.z())
+        if (rotation != null || point != ZERO) {
+            rotation = point
+        }
         //this@withPosition.rotationOrder = RotationOrder.ZXY
     }
-    scale?.let {
-        this@withPosition.scaleX = scale.x.toFloat()
-        this@withPosition.scaleY = scale.y.toFloat()
-        this@withPosition.scaleZ = scale.z.toFloat()
+    newScale?.let {
+        val point = Point3D(it.x, it.y, it.z)
+        if (scale != null || point != ONE) {
+            scale = point
+        }
     }
     //TODO convert units if needed
 }
@@ -161,8 +167,8 @@ private fun VisualGroup3D.addPhysicalVolume(
         }
         GDMLTransformer.Action.CACHE -> {
             val fullName = volumesName + volume.name.asName()
-            if (context.templates[fullName] == null) {
-                context.templates[fullName] = volume(context, volume)
+            if (context.proto[fullName] == null) {
+                context.proto[fullName] = volume(context, volume)
             }
 
             this[physVolume.name ?: ""] = Proxy(fullName).apply {
@@ -189,7 +195,7 @@ private fun VisualGroup3D.addDivisionVolume(
 
     //TODO add divisions
     set(
-        EmptyName,
+        Name.EMPTY,
         volume(
             context,
             volume
@@ -215,8 +221,8 @@ private fun volume(
                     }
                 }
                 GDMLTransformer.Action.CACHE -> {
-                    if (context.templates[solid.name] == null) {
-                        context.templates.addSolid(context, solid, solid.name) {
+                    if (context.proto[solid.name] == null) {
+                        context.proto.addSolid(context, solid, solid.name) {
                             context.configureSolid(this, group, solid)
                         }
                     }
@@ -244,4 +250,13 @@ fun GDML.toVisual(block: GDMLTransformer.() -> Unit = {}): VisualGroup3D {
     val context = GDMLTransformer(this).apply(block)
 
     return context.finalize(volume(context, world))
+}
+
+/**
+ * Append gdml node to the group
+ */
+fun VisualGroup3D.gdml(gdml: GDML, key: String = "", transformer: GDMLTransformer.() -> Unit = {}) {
+    val visual = gdml.toVisual(transformer)
+    //println(Visual3DPlugin.json.stringify(VisualGroup3D.serializer(), visual))
+    set(key, visual)
 }
\ No newline at end of file
diff --git a/dataforge-vis-spatial-gdml/src/jsMain/web/css/inspire-tree-dark.min.css b/dataforge-vis-spatial-gdml/src/jsMain/web/css/inspire-tree-dark.min.css
deleted file mode 100644
index ab9837b9..00000000
--- a/dataforge-vis-spatial-gdml/src/jsMain/web/css/inspire-tree-dark.min.css
+++ /dev/null
@@ -1 +0,0 @@
-.inspire-tree .btn{background-color:#fff;border:1px solid rgba(0,0,0,.2);border-radius:3px;display:inline-block;height:20px;transition:all .15s linear;width:20px}.inspire-tree .btn:hover{box-shadow:0 2px 3px rgba(0,0,0,.1)}.inspire-tree .btn+.btn{margin-left:5px}.inspire-tree .btn.icon{position:relative}.inspire-tree .btn.icon:before{display:block;height:14px;left:50%;position:absolute;top:50%;transform:translate(-50%,-50%);width:14px}.inspire-tree .btn-group{display:inline-block;height:25px;line-height:25px}.itree-menu{background:#ddd;border:1px solid #c4c4c4;border-radius:3px;font-family:sans-serif;list-style:none;margin:0;min-width:150px;padding:0;position:absolute;z-index:4}.itree-menu a{display:block;padding:3px 8px}.itree-menu a:hover{background:hsla(0,0%,39%,.5);color:rgba(74,110,116,.5)}.inspire-tree{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.inspire-tree:focus{outline:none}.inspire-tree,.inspire-tree *{box-sizing:border-box}.inspire-tree ol{list-style:none;margin:0;padding:0}.inspire-tree ol ol{padding-left:20px}.inspire-tree .collapsed>ol,.inspire-tree .hidden{display:none}.inspire-tree li>.title-wrap{min-height:25px;position:relative;z-index:2}.inspire-tree .toggle{height:25px;left:0;position:absolute;top:0;width:25px;z-index:2}.inspire-tree .toggle:before{display:block;left:50%;position:absolute;top:50%;transform:translate(-50%,-50%)}.inspire-tree [type=checkbox]{left:18px;position:absolute;top:4px;vertical-align:middle;width:20px;z-index:2}.inspire-tree .title{cursor:default;display:block;height:25px;line-height:25px;overflow:hidden;padding-left:42px;position:relative;text-overflow:ellipsis;vertical-align:middle;white-space:nowrap;z-index:1}.inspire-tree .title.load-more{color:#476cb8;cursor:pointer}.inspire-tree .title.load-more:hover{text-decoration:underline}.inspire-tree .title:before{left:24px;position:absolute;top:50%;transform:translateY(-50%);vertical-align:top}.inspire-tree .title:focus{outline:none}.inspire-tree.drag-and-drop li:not(.drop-target){opacity:.5}.drag-targeting.drag-targeting-insert.inspire-tree,.drag-targeting.drag-targeting-insert>.title-wrap>.title{border:1px solid #2dadc5}.drag-targeting.drag-targeting-above>.title-wrap>.title{border-top:3px solid #2dadc5}.drag-targeting.drag-targeting-below>.title-wrap>.title{border-bottom:3px solid #2dadc5}.inspire-tree .editable form{display:inline-block;height:25px;line-height:25px;padding-top:2px}.inspire-tree .editable form input{height:20px}.inspire-tree .editable form .btn,.inspire-tree .editable form input{vertical-align:top}.inspire-tree .editable>.btn-group{display:none;padding-top:2px;position:absolute;right:10px;z-index:3}.inspire-tree .editable:hover>.btn-group{display:block}.inspire-tree input+.btn-group{margin-left:10px}.inspire-tree>.btn.icon{margin-left:2px}.inspire-tree>ol>.folder:first-child:not(:only-child){background-position:11px 13px}.inspire-tree .folder:last-child:not(:only-child),.inspire-tree>ol>.folder:first-child:not(:only-child),.inspire-tree li .folder:last-child{background-image:url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAAMCAYAAACji9dXAAAAFUlEQVQIW2M8d+HSf0YGBgYGRpJZAJ2uFKcp4HfpAAAAAElFTkSuQmCC");background-repeat:no-repeat}.inspire-tree .folder:last-child:not(:only-child),.inspire-tree li .folder:last-child{background-position:11px 0}.inspire-tree.editable-add>ol>.folder:last-child:not(:only-child){background-image:url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAAYCAYAAAA7zJfaAAAAFUlEQVQIW2M8d+HSf0YGBgYGRrqyABKeKU0SV+t2AAAAAElFTkSuQmCC");background-repeat:repeat-y}.inspire-tree>ol .expanded:not(:last-child):not(:first-child),.inspire-tree li:not(:last-child){background-repeat:no-repeat}.inspire-tree>ol .expanded:not(:last-child):not(:first-child),.inspire-tree li.expanded:not(:last-child)>ol,.inspire-tree li:not(:last-child){background-image:url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAAYCAYAAAA7zJfaAAAAFUlEQVQIW2M8d+HSf0YGBgYGRrqyABKeKU0SV+t2AAAAAElFTkSuQmCC");background-position:11px 0}.inspire-tree li.expanded:not(:last-child)>ol{background-repeat:repeat-y}.inspire-tree li.expanded.folder:not(.loading)>.title-wrap{background-image:url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAAMCAYAAACji9dXAAAAFUlEQVQIW2M8d+HSf0YGBgYGRpJZAJ2uFKcp4HfpAAAAAElFTkSuQmCC");background-position:31px 13px;background-repeat:no-repeat}.inspire-tree .leaf:not(:last-child):not(.detached){background-image:url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA0AAAAYCAYAAAAh8HdUAAAAN0lEQVQ4T2M8d+HSfyMDPUYGEgBJimHmMo7aBAmK0dCDJgl4ioClDGLo0dBDDz0SMu5o2oMFFgBXbEeI0XwYIwAAAABJRU5ErkJgggAA");background-position:11px 0;background-repeat:no-repeat}.inspire-tree .leaf:last-child{background-image:url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA0AAAANCAYAAABy6+R8AAAAKklEQVQoU2M8d+HSfyMDPUYGEgBJimHmMo7aBAmK0dCDJgl4ioClDGJoAGUZM32Z0U8tAAAAAElFTkSuQmCC");background-position:11px 0;background-repeat:no-repeat}.inspire-tree .leaf.detached:last-child{background-image:url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAAMCAYAAACji9dXAAAAFUlEQVQIW2M8d+HSf0YGBgYGRpJZAJ2uFKcp4HfpAAAAAElFTkSuQmCC");background-position:11px 0;background-repeat:no-repeat}.inspire-tree.editable-add>ol>.leaf:last-child{background-image:url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA0AAAAYCAYAAAAh8HdUAAAAN0lEQVQ4T2M8d+HSfyMDPUYGEgBJimHmMo7aBAmK0dCDJgl4ioClDGLo0dBDDz0SMu5o2oMFFgBXbEeI0XwYIwAAAABJRU5ErkJgggAA")}.inspire-tree .icon:before{background-position:0 0;background-repeat:no-repeat;content:"";display:inline-block;height:14px;width:14px}.inspire-tree .icon-check:before{background-image:url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20version%3D%221.1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20width%3D%22100%25%22%20height%3D%22100%25%22%20viewBox%3D%220%200%2032%2032%22%3E%3Cpath%20fill%3D%22%236a6a6a%22%20d%3D%22M27%204l-15%2015-7-7-5%205%2012%2012%2020-20z%22%3E%3C%2Fpath%3E%3C%2Fsvg%3E")}.inspire-tree .icon-check:hover:before{background-image:url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20version%3D%221.1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20width%3D%22100%25%22%20height%3D%22100%25%22%20viewBox%3D%220%200%2032%2032%22%3E%3Cpath%20fill%3D%22%230ccc0a%22%20d%3D%22M27%204l-15%2015-7-7-5%205%2012%2012%2020-20z%22%3E%3C%2Fpath%3E%3C%2Fsvg%3E")}.inspire-tree .icon-collapse:before{background-image:url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20version%3D%221.1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20width%3D%22100%25%22%20height%3D%22100%25%22%20viewBox%3D%220%200%2024%2024%22%3E%3Cpath%20fill%3D%22%23aaa%22%20d%3D%22M4%201h16q1.242%200%202.121%200.879t0.879%202.121v16q0%201.242-0.879%202.121t-2.121%200.879h-16q-1.242%200-2.121-0.879t-0.879-2.121v-16q0-1.242%200.879-2.121t2.121-0.879zM20%203h-16q-0.414%200-0.707%200.293t-0.293%200.707v16q0%200.414%200.293%200.707t0.707%200.293h16q0.414%200%200.707-0.293t0.293-0.707v-16q0-0.414-0.293-0.707t-0.707-0.293zM8%2011h8q0.414%200%200.707%200.293t0.293%200.707-0.293%200.707-0.707%200.293h-8q-0.414%200-0.707-0.293t-0.293-0.707%200.293-0.707%200.707-0.293z%22%3E%3C%2Fpath%3E%3C%2Fsvg%3E");background-color:#000;border-radius:3px;margin-left:-1px}.inspire-tree .icon-cross:before{background-image:url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20version%3D%221.1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20width%3D%22100%25%22%20height%3D%22100%25%22%20viewBox%3D%220%200%2032%2032%22%3E%3Cpath%20fill%3D%22%236a6a6a%22%20d%3D%22M31.708%2025.708c-0-0-0-0-0-0l-9.708-9.708%209.708-9.708c0-0%200-0%200-0%200.105-0.105%200.18-0.227%200.229-0.357%200.133-0.356%200.057-0.771-0.229-1.057l-4.586-4.586c-0.286-0.286-0.702-0.361-1.057-0.229-0.13%200.048-0.252%200.124-0.357%200.228%200%200-0%200-0%200l-9.708%209.708-9.708-9.708c-0-0-0-0-0-0-0.105-0.104-0.227-0.18-0.357-0.228-0.356-0.133-0.771-0.057-1.057%200.229l-4.586%204.586c-0.286%200.286-0.361%200.702-0.229%201.057%200.049%200.13%200.124%200.252%200.229%200.357%200%200%200%200%200%200l9.708%209.708-9.708%209.708c-0%200-0%200-0%200-0.104%200.105-0.18%200.227-0.229%200.357-0.133%200.355-0.057%200.771%200.229%201.057l4.586%204.586c0.286%200.286%200.702%200.361%201.057%200.229%200.13-0.049%200.252-0.124%200.357-0.229%200-0%200-0%200-0l9.708-9.708%209.708%209.708c0%200%200%200%200%200%200.105%200.105%200.227%200.18%200.357%200.229%200.356%200.133%200.771%200.057%201.057-0.229l4.586-4.586c0.286-0.286%200.362-0.702%200.229-1.057-0.049-0.13-0.124-0.252-0.229-0.357z%22%3E%3C%2Fpath%3E%3C%2Fsvg%3E")}.inspire-tree .icon-cross:hover:before{background-image:url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20version%3D%221.1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20width%3D%22100%25%22%20height%3D%22100%25%22%20viewBox%3D%220%200%2032%2032%22%3E%3Cpath%20fill%3D%22%23c00%22%20d%3D%22M31.708%2025.708c-0-0-0-0-0-0l-9.708-9.708%209.708-9.708c0-0%200-0%200-0%200.105-0.105%200.18-0.227%200.229-0.357%200.133-0.356%200.057-0.771-0.229-1.057l-4.586-4.586c-0.286-0.286-0.702-0.361-1.057-0.229-0.13%200.048-0.252%200.124-0.357%200.228%200%200-0%200-0%200l-9.708%209.708-9.708-9.708c-0-0-0-0-0-0-0.105-0.104-0.227-0.18-0.357-0.228-0.356-0.133-0.771-0.057-1.057%200.229l-4.586%204.586c-0.286%200.286-0.361%200.702-0.229%201.057%200.049%200.13%200.124%200.252%200.229%200.357%200%200%200%200%200%200l9.708%209.708-9.708%209.708c-0%200-0%200-0%200-0.104%200.105-0.18%200.227-0.229%200.357-0.133%200.355-0.057%200.771%200.229%201.057l4.586%204.586c0.286%200.286%200.702%200.361%201.057%200.229%200.13-0.049%200.252-0.124%200.357-0.229%200-0%200-0%200-0l9.708-9.708%209.708%209.708c0%200%200%200%200%200%200.105%200.105%200.227%200.18%200.357%200.229%200.356%200.133%200.771%200.057%201.057-0.229l4.586-4.586c0.286-0.286%200.362-0.702%200.229-1.057-0.049-0.13-0.124-0.252-0.229-0.357z%22%3E%3C%2Fpath%3E%3C%2Fsvg%3E")}.inspire-tree .icon-expand:before{background-image:url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20version%3D%221.1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20width%3D%22100%25%22%20height%3D%22100%25%22%20viewBox%3D%220%200%2024%2024%22%3E%3Cpath%20fill%3D%22%23aaa%22%20d%3D%22M4%201h16q1.242%200%202.121%200.879t0.879%202.121v16q0%201.242-0.879%202.121t-2.121%200.879h-16q-1.242%200-2.121-0.879t-0.879-2.121v-16q0-1.242%200.879-2.121t2.121-0.879zM20%203h-16q-0.414%200-0.707%200.293t-0.293%200.707v16q0%200.414%200.293%200.707t0.707%200.293h16q0.414%200%200.707-0.293t0.293-0.707v-16q0-0.414-0.293-0.707t-0.707-0.293zM12%207q0.414%200%200.707%200.293t0.293%200.707v3h3q0.414%200%200.707%200.293t0.293%200.707-0.293%200.707-0.707%200.293h-3v3q0%200.414-0.293%200.707t-0.707%200.293-0.707-0.293-0.293-0.707v-3h-3q-0.414%200-0.707-0.293t-0.293-0.707%200.293-0.707%200.707-0.293h3v-3q0-0.414%200.293-0.707t0.707-0.293z%22%3E%3C%2Fpath%3E%3C%2Fsvg%3E");background-color:#000;border-radius:3px;margin-left:-1px}.inspire-tree .icon-file-empty:before{background-image:url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20version%3D%221.1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20width%3D%22100%25%22%20height%3D%22100%25%22%20viewBox%3D%220%200%2032%2032%22%3E%3Cpath%20fill%3D%22%23a5a5a5%22%20d%3D%22M28.681%207.159c-0.694-0.947-1.662-2.053-2.724-3.116s-2.169-2.030-3.116-2.724c-1.612-1.182-2.393-1.319-2.841-1.319h-15.5c-1.378%200-2.5%201.121-2.5%202.5v27c0%201.378%201.122%202.5%202.5%202.5h23c1.378%200%202.5-1.122%202.5-2.5v-19.5c0-0.448-0.137-1.23-1.319-2.841zM24.543%205.457c0.959%200.959%201.712%201.825%202.268%202.543h-4.811v-4.811c0.718%200.556%201.584%201.309%202.543%202.268zM28%2029.5c0%200.271-0.229%200.5-0.5%200.5h-23c-0.271%200-0.5-0.229-0.5-0.5v-27c0-0.271%200.229-0.5%200.5-0.5%200%200%2015.499-0%2015.5%200v7c0%200.552%200.448%201%201%201h7v19.5z%22%3E%3C%2Fpath%3E%3C%2Fsvg%3E")}.inspire-tree .icon-folder:before{background-image:url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20version%3D%221.1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20width%3D%22100%25%22%20height%3D%22100%25%22%20viewBox%3D%220%200%2032%2032%22%3E%3Cpath%20fill%3D%22%236a6a6a%22%20d%3D%22M14%204l4%204h14v22h-32v-26z%22%3E%3C%2Fpath%3E%3C%2Fsvg%3E")}.inspire-tree .icon-folder-open:before{background-image:url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20version%3D%221.1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20width%3D%22100%25%22%20height%3D%22100%25%22%20viewBox%3D%220%200%2032%2032%22%3E%3Cpath%20fill%3D%22%236a6a6a%22%20d%3D%22M26%2030l6-16h-26l-6%2016zM4%2012l-4%2018v-26h9l4%204h13v4z%22%3E%3C%2Fpath%3E%3C%2Fsvg%3E%0A")}.inspire-tree .icon-minus:before{background-image:url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20version%3D%221.1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20width%3D%22100%25%22%20height%3D%22100%25%22%20viewBox%3D%220%200%2032%2032%22%3E%3Cpath%20fill%3D%22%236a6a6a%22%20d%3D%22M0%2013v6c0%200.552%200.448%201%201%201h30c0.552%200%201-0.448%201-1v-6c0-0.552-0.448-1-1-1h-30c-0.552%200-1%200.448-1%201z%22%3E%3C%2Fpath%3E%3C%2Fsvg%3E")}.inspire-tree .icon-minus:hover:before{background-image:url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20version%3D%221.1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20width%3D%22100%25%22%20height%3D%22100%25%22%20viewBox%3D%220%200%2032%2032%22%3E%3Cpath%20fill%3D%22%23c00%22%20d%3D%22M0%2013v6c0%200.552%200.448%201%201%201h30c0.552%200%201-0.448%201-1v-6c0-0.552-0.448-1-1-1h-30c-0.552%200-1%200.448-1%201z%22%3E%3C%2Fpath%3E%3C%2Fsvg%3E")}.inspire-tree .icon-more:before{background-image:url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20version%3D%221.1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20width%3D%22100%25%22%20height%3D%22100%25%22%20viewBox%3D%220%200%2024%2024%22%3E%3Cpath%20fill%3D%22%236a6a6a%22%20d%3D%22M12%209.984c1.078%200%202.016%200.938%202.016%202.016s-0.938%202.016-2.016%202.016-2.016-0.938-2.016-2.016%200.938-2.016%202.016-2.016zM18%209.984c1.078%200%202.016%200.938%202.016%202.016s-0.938%202.016-2.016%202.016-2.016-0.938-2.016-2.016%200.938-2.016%202.016-2.016zM6%209.984c1.078%200%202.016%200.938%202.016%202.016s-0.938%202.016-2.016%202.016-2.016-0.938-2.016-2.016%200.938-2.016%202.016-2.016z%22%3E%3C%2Fpath%3E%3C%2Fsvg%3E")}.inspire-tree .icon-pencil:before{background-image:url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20version%3D%221.1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20width%3D%22100%25%22%20height%3D%22100%25%22%20viewBox%3D%220%200%2032%2032%22%3E%3Cpath%20fill%3D%22%236a6a6a%22%20d%3D%22M27%200c2.761%200%205%202.239%205%205%200%201.126-0.372%202.164-1%203l-2%202-7-7%202-2c0.836-0.628%201.874-1%203-1zM2%2023l-2%209%209-2%2018.5-18.5-7-7-18.5%2018.5zM22.362%2011.362l-14%2014-1.724-1.724%2014-14%201.724%201.724z%22%3E%3C%2Fpath%3E%3C%2Fsvg%3E%0A")}.inspire-tree .icon-pencil:hover:before{background-image:url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20version%3D%221.1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20width%3D%22100%25%22%20height%3D%22100%25%22%20viewBox%3D%220%200%2032%2032%22%3E%3Cpath%20fill%3D%22%230ccc0a%22%20d%3D%22M27%200c2.761%200%205%202.239%205%205%200%201.126-0.372%202.164-1%203l-2%202-7-7%202-2c0.836-0.628%201.874-1%203-1zM2%2023l-2%209%209-2%2018.5-18.5-7-7-18.5%2018.5zM22.362%2011.362l-14%2014-1.724-1.724%2014-14%201.724%201.724z%22%3E%3C%2Fpath%3E%3C%2Fsvg%3E%0A")}.inspire-tree .icon-plus:before{background-image:url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20version%3D%221.1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20width%3D%22100%25%22%20height%3D%22100%25%22%20viewBox%3D%220%200%2032%2032%22%3E%3Cpath%20fill%3D%22%236a6a6a%22%20d%3D%22M31%2012h-11v-11c0-0.552-0.448-1-1-1h-6c-0.552%200-1%200.448-1%201v11h-11c-0.552%200-1%200.448-1%201v6c0%200.552%200.448%201%201%201h11v11c0%200.552%200.448%201%201%201h6c0.552%200%201-0.448%201-1v-11h11c0.552%200%201-0.448%201-1v-6c0-0.552-0.448-1-1-1z%22%3E%3C%2Fpath%3E%3C%2Fsvg%3E")}.inspire-tree .icon-plus:hover:before{background-image:url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20version%3D%221.1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20width%3D%22100%25%22%20height%3D%22100%25%22%20viewBox%3D%220%200%2032%2032%22%3E%3Cpath%20fill%3D%22%230ccc0a%22%20d%3D%22M31%2012h-11v-11c0-0.552-0.448-1-1-1h-6c-0.552%200-1%200.448-1%201v11h-11c-0.552%200-1%200.448-1%201v6c0%200.552%200.448%201%201%201h11v11c0%200.552%200.448%201%201%201h6c0.552%200%201-0.448%201-1v-11h11c0.552%200%201-0.448%201-1v-6c0-0.552-0.448-1-1-1z%22%3E%3C%2Fpath%3E%3C%2Fsvg%3E")}.inspire-tree .selected>.title-wrap .icon-folder:before{background-image:url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20version%3D%221.1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20width%3D%22100%25%22%20height%3D%22100%25%22%20viewBox%3D%220%200%2032%2032%22%3E%3Cpath%20fill%3D%22%2366a0a9%22%20d%3D%22M14%204l4%204h14v22h-32v-26z%22%3E%3C%2Fpath%3E%3C%2Fsvg%3E")}.inspire-tree .selected>.title-wrap .icon-folder-open:before{background-image:url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20version%3D%221.1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20width%3D%22100%25%22%20height%3D%22100%25%22%20viewBox%3D%220%200%2032%2032%22%3E%3Cpath%20fill%3D%22%2366a0a9%22%20d%3D%22M26%2030l6-16h-26l-6%2016zM4%2012l-4%2018v-26h9l4%204h13v4z%22%3E%3C%2Fpath%3E%3C%2Fsvg%3E%0A")}.inspire-tree .selected>.title-wrap .icon-file-empty:before{background-image:url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20version%3D%221.1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20width%3D%22100%25%22%20height%3D%22100%25%22%20viewBox%3D%220%200%2032%2032%22%3E%3Cpath%20fill%3D%22%2366a0a9%22%20d%3D%22M28.681%207.159c-0.694-0.947-1.662-2.053-2.724-3.116s-2.169-2.030-3.116-2.724c-1.612-1.182-2.393-1.319-2.841-1.319h-15.5c-1.378%200-2.5%201.121-2.5%202.5v27c0%201.378%201.122%202.5%202.5%202.5h23c1.378%200%202.5-1.122%202.5-2.5v-19.5c0-0.448-0.137-1.23-1.319-2.841zM24.543%205.457c0.959%200.959%201.712%201.825%202.268%202.543h-4.811v-4.811c0.718%200.556%201.584%201.309%202.543%202.268zM28%2029.5c0%200.271-0.229%200.5-0.5%200.5h-23c-0.271%200-0.5-0.229-0.5-0.5v-27c0-0.271%200.229-0.5%200.5-0.5%200%200%2015.499-0%2015.5%200v7c0%200.552%200.448%201%201%201h7v19.5z%22%3E%3C%2Fpath%3E%3C%2Fsvg%3E")}.inspire-tree .loading>.title-wrap input{display:none}.inspire-tree .loading>.title-wrap .title:before{background-image:url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20width%3D%2714px%27%20height%3D%2714px%27%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20100%20100%22%20preserveAspectRatio%3D%22xMidYMid%22%20class%3D%22uil-ring%22%3E%3Crect%20x%3D%220%22%20y%3D%220%22%20width%3D%22100%22%20height%3D%22100%22%20fill%3D%22none%22%20class%3D%22bk%22%3E%3C%2Frect%3E%3Cdefs%3E%3Cfilter%20id%3D%22uil-ring-shadow%22%20x%3D%22-100%25%22%20y%3D%22-100%25%22%20width%3D%22300%25%22%20height%3D%22300%25%22%3E%3CfeOffset%20result%3D%22offOut%22%20in%3D%22SourceGraphic%22%20dx%3D%220%22%20dy%3D%220%22%3E%3C%2FfeOffset%3E%3CfeGaussianBlur%20result%3D%22blurOut%22%20in%3D%22offOut%22%20stdDeviation%3D%220%22%3E%3C%2FfeGaussianBlur%3E%3CfeBlend%20in%3D%22SourceGraphic%22%20in2%3D%22blurOut%22%20mode%3D%22normal%22%3E%3C%2FfeBlend%3E%3C%2Ffilter%3E%3C%2Fdefs%3E%3Cpath%20d%3D%22M10%2C50c0%2C0%2C0%2C0.5%2C0.1%2C1.4c0%2C0.5%2C0.1%2C1%2C0.2%2C1.7c0%2C0.3%2C0.1%2C0.7%2C0.1%2C1.1c0.1%2C0.4%2C0.1%2C0.8%2C0.2%2C1.2c0.2%2C0.8%2C0.3%2C1.8%2C0.5%2C2.8%20c0.3%2C1%2C0.6%2C2.1%2C0.9%2C3.2c0.3%2C1.1%2C0.9%2C2.3%2C1.4%2C3.5c0.5%2C1.2%2C1.2%2C2.4%2C1.8%2C3.7c0.3%2C0.6%2C0.8%2C1.2%2C1.2%2C1.9c0.4%2C0.6%2C0.8%2C1.3%2C1.3%2C1.9%20c1%2C1.2%2C1.9%2C2.6%2C3.1%2C3.7c2.2%2C2.5%2C5%2C4.7%2C7.9%2C6.7c3%2C2%2C6.5%2C3.4%2C10.1%2C4.6c3.6%2C1.1%2C7.5%2C1.5%2C11.2%2C1.6c4-0.1%2C7.7-0.6%2C11.3-1.6%20c3.6-1.2%2C7-2.6%2C10-4.6c3-2%2C5.8-4.2%2C7.9-6.7c1.2-1.2%2C2.1-2.5%2C3.1-3.7c0.5-0.6%2C0.9-1.3%2C1.3-1.9c0.4-0.6%2C0.8-1.3%2C1.2-1.9%20c0.6-1.3%2C1.3-2.5%2C1.8-3.7c0.5-1.2%2C1-2.4%2C1.4-3.5c0.3-1.1%2C0.6-2.2%2C0.9-3.2c0.2-1%2C0.4-1.9%2C0.5-2.8c0.1-0.4%2C0.1-0.8%2C0.2-1.2%20c0-0.4%2C0.1-0.7%2C0.1-1.1c0.1-0.7%2C0.1-1.2%2C0.2-1.7C90%2C50.5%2C90%2C50%2C90%2C50s0%2C0.5%2C0%2C1.4c0%2C0.5%2C0%2C1%2C0%2C1.7c0%2C0.3%2C0%2C0.7%2C0%2C1.1%20c0%2C0.4-0.1%2C0.8-0.1%2C1.2c-0.1%2C0.9-0.2%2C1.8-0.4%2C2.8c-0.2%2C1-0.5%2C2.1-0.7%2C3.3c-0.3%2C1.2-0.8%2C2.4-1.2%2C3.7c-0.2%2C0.7-0.5%2C1.3-0.8%2C1.9%20c-0.3%2C0.7-0.6%2C1.3-0.9%2C2c-0.3%2C0.7-0.7%2C1.3-1.1%2C2c-0.4%2C0.7-0.7%2C1.4-1.2%2C2c-1%2C1.3-1.9%2C2.7-3.1%2C4c-2.2%2C2.7-5%2C5-8.1%2C7.1%20c-0.8%2C0.5-1.6%2C1-2.4%2C1.5c-0.8%2C0.5-1.7%2C0.9-2.6%2C1.3L66%2C87.7l-1.4%2C0.5c-0.9%2C0.3-1.8%2C0.7-2.8%2C1c-3.8%2C1.1-7.9%2C1.7-11.8%2C1.8L47%2C90.8%20c-1%2C0-2-0.2-3-0.3l-1.5-0.2l-0.7-0.1L41.1%2C90c-1-0.3-1.9-0.5-2.9-0.7c-0.9-0.3-1.9-0.7-2.8-1L34%2C87.7l-1.3-0.6%20c-0.9-0.4-1.8-0.8-2.6-1.3c-0.8-0.5-1.6-1-2.4-1.5c-3.1-2.1-5.9-4.5-8.1-7.1c-1.2-1.2-2.1-2.7-3.1-4c-0.5-0.6-0.8-1.4-1.2-2%20c-0.4-0.7-0.8-1.3-1.1-2c-0.3-0.7-0.6-1.3-0.9-2c-0.3-0.7-0.6-1.3-0.8-1.9c-0.4-1.3-0.9-2.5-1.2-3.7c-0.3-1.2-0.5-2.3-0.7-3.3%20c-0.2-1-0.3-2-0.4-2.8c-0.1-0.4-0.1-0.8-0.1-1.2c0-0.4%2C0-0.7%2C0-1.1c0-0.7%2C0-1.2%2C0-1.7C10%2C50.5%2C10%2C50%2C10%2C50z%22%20fill%3D%22%23013138%22%20filter%3D%22url(%23uil-ring-shadow)%22%3E%3CanimateTransform%20attributeName%3D%22transform%22%20type%3D%22rotate%22%20from%3D%220%2050%2050%22%20to%3D%22360%2050%2050%22%20repeatCount%3D%22indefinite%22%20dur%3D%221s%22%3E%3C%2FanimateTransform%3E%3C%2Fpath%3E%3C%2Fsvg%3E");content:"";height:14px;width:14px}.inspire-tree>ol{position:relative}.inspire-tree .wholerow{height:25px;left:0;margin-top:-25px;position:absolute;width:100%;z-index:1}.inspire-tree .focused>.wholerow{border:1px dotted #fff}.inspire-tree .title-wrap:hover+.wholerow,.inspire-tree .wholerow:hover{background-color:hsla(0,0%,39%,.5)}.inspire-tree .selected>.title-wrap:hover+.wholerow,.inspire-tree .selected>.wholerow,.inspire-tree .selected>.wholerow:hover{background-color:rgba(74,110,116,.5)}.inspire-tree .matched>.title-wrap:hover+.wholerow,.inspire-tree .matched>.wholerow,.inspire-tree .matched>.wholerow:hover{background-color:rgba(247,255,170,.5)}
\ No newline at end of file
diff --git a/dataforge-vis-spatial-gdml/src/jsMain/web/css/inspire-tree-light.min.css b/dataforge-vis-spatial-gdml/src/jsMain/web/css/inspire-tree-light.min.css
deleted file mode 100644
index 2b6d5f51..00000000
--- a/dataforge-vis-spatial-gdml/src/jsMain/web/css/inspire-tree-light.min.css
+++ /dev/null
@@ -1 +0,0 @@
-.inspire-tree .btn{background-color:hsla(0,0%,100%,.4);border:1px solid rgba(0,0,0,.2);border-radius:3px;display:inline-block;height:20px;transition:all .15s linear;width:20px}.inspire-tree .btn:hover{box-shadow:0 2px 3px rgba(0,0,0,.1)}.inspire-tree .btn+.btn{margin-left:5px}.inspire-tree .btn.icon{position:relative}.inspire-tree .btn.icon:before{display:block;height:14px;left:50%;position:absolute;top:50%;transform:translate(-50%,-50%);width:14px}.inspire-tree .btn-group{display:inline-block;height:25px;line-height:25px}.itree-menu{background:#ddd;border:1px solid #c4c4c4;border-radius:3px;font-family:sans-serif;list-style:none;margin:0;min-width:150px;padding:0;position:absolute;z-index:4}.itree-menu a{display:block;padding:3px 8px}.itree-menu a:hover{background:rgba(218,250,255,.5);color:rgba(164,234,245,.5)}.inspire-tree{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.inspire-tree:focus{outline:none}.inspire-tree,.inspire-tree *{box-sizing:border-box}.inspire-tree ol{list-style:none;margin:0;padding:0}.inspire-tree ol ol{padding-left:20px}.inspire-tree .collapsed>ol,.inspire-tree .hidden{display:none}.inspire-tree li>.title-wrap{min-height:25px;position:relative;z-index:2}.inspire-tree .toggle{height:25px;left:0;position:absolute;top:0;width:25px;z-index:2}.inspire-tree .toggle:before{display:block;left:50%;position:absolute;top:50%;transform:translate(-50%,-50%)}.inspire-tree [type=checkbox]{left:18px;position:absolute;top:4px;vertical-align:middle;width:20px;z-index:2}.inspire-tree .title{cursor:default;display:block;height:25px;line-height:25px;overflow:hidden;padding-left:42px;position:relative;text-overflow:ellipsis;vertical-align:middle;white-space:nowrap;z-index:1}.inspire-tree .title.load-more{color:#476cb8;cursor:pointer}.inspire-tree .title.load-more:hover{text-decoration:underline}.inspire-tree .title:before{left:24px;position:absolute;top:50%;transform:translateY(-50%);vertical-align:top}.inspire-tree .title:focus{outline:none}.inspire-tree.drag-and-drop li:not(.drop-target){opacity:.5}.drag-targeting.drag-targeting-insert.inspire-tree,.drag-targeting.drag-targeting-insert>.title-wrap>.title{border:1px solid #2dadc5}.drag-targeting.drag-targeting-above>.title-wrap>.title{border-top:3px solid #2dadc5}.drag-targeting.drag-targeting-below>.title-wrap>.title{border-bottom:3px solid #2dadc5}.inspire-tree .editable form{display:inline-block;height:25px;line-height:25px;padding-top:2px}.inspire-tree .editable form input{height:20px}.inspire-tree .editable form .btn,.inspire-tree .editable form input{vertical-align:top}.inspire-tree .editable>.btn-group{display:none;padding-top:2px;position:absolute;right:10px;z-index:3}.inspire-tree .editable:hover>.btn-group{display:block}.inspire-tree input+.btn-group{margin-left:10px}.inspire-tree>.btn.icon{margin-left:2px}.inspire-tree>ol>.folder:first-child:not(:only-child){background-position:11px 13px}.inspire-tree .folder:last-child:not(:only-child),.inspire-tree>ol>.folder:first-child:not(:only-child),.inspire-tree li .folder:last-child{background-image:url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAAMCAYAAACji9dXAAAAFUlEQVQIW2M8d+HSf0YGBgYGRpJZAJ2uFKcp4HfpAAAAAElFTkSuQmCC");background-repeat:no-repeat}.inspire-tree .folder:last-child:not(:only-child),.inspire-tree li .folder:last-child{background-position:11px 0}.inspire-tree.editable-add>ol>.folder:last-child:not(:only-child){background-image:url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAAYCAYAAAA7zJfaAAAAFUlEQVQIW2M8d+HSf0YGBgYGRrqyABKeKU0SV+t2AAAAAElFTkSuQmCC");background-repeat:repeat-y}.inspire-tree>ol .expanded:not(:last-child):not(:first-child),.inspire-tree li:not(:last-child){background-repeat:no-repeat}.inspire-tree>ol .expanded:not(:last-child):not(:first-child),.inspire-tree li.expanded:not(:last-child)>ol,.inspire-tree li:not(:last-child){background-image:url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAAYCAYAAAA7zJfaAAAAFUlEQVQIW2M8d+HSf0YGBgYGRrqyABKeKU0SV+t2AAAAAElFTkSuQmCC");background-position:11px 0}.inspire-tree li.expanded:not(:last-child)>ol{background-repeat:repeat-y}.inspire-tree li.expanded.folder:not(.loading)>.title-wrap{background-image:url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAAMCAYAAACji9dXAAAAFUlEQVQIW2M8d+HSf0YGBgYGRpJZAJ2uFKcp4HfpAAAAAElFTkSuQmCC");background-position:31px 13px;background-repeat:no-repeat}.inspire-tree .leaf:not(:last-child):not(.detached){background-image:url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA0AAAAYCAYAAAAh8HdUAAAAN0lEQVQ4T2M8d+HSfyMDPUYGEgBJimHmMo7aBAmK0dCDJgl4ioClDGLo0dBDDz0SMu5o2oMFFgBXbEeI0XwYIwAAAABJRU5ErkJgggAA");background-position:11px 0;background-repeat:no-repeat}.inspire-tree .leaf:last-child{background-image:url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA0AAAANCAYAAABy6+R8AAAAKklEQVQoU2M8d+HSfyMDPUYGEgBJimHmMo7aBAmK0dCDJgl4ioClDGJoAGUZM32Z0U8tAAAAAElFTkSuQmCC");background-position:11px 0;background-repeat:no-repeat}.inspire-tree .leaf.detached:last-child{background-image:url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAAMCAYAAACji9dXAAAAFUlEQVQIW2M8d+HSf0YGBgYGRpJZAJ2uFKcp4HfpAAAAAElFTkSuQmCC");background-position:11px 0;background-repeat:no-repeat}.inspire-tree.editable-add>ol>.leaf:last-child{background-image:url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA0AAAAYCAYAAAAh8HdUAAAAN0lEQVQ4T2M8d+HSfyMDPUYGEgBJimHmMo7aBAmK0dCDJgl4ioClDGLo0dBDDz0SMu5o2oMFFgBXbEeI0XwYIwAAAABJRU5ErkJgggAA")}.inspire-tree .icon:before{background-position:0 0;background-repeat:no-repeat;content:"";display:inline-block;height:14px;width:14px}.inspire-tree .icon-check:before{background-image:url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20version%3D%221.1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20width%3D%22100%25%22%20height%3D%22100%25%22%20viewBox%3D%220%200%2032%2032%22%3E%3Cpath%20fill%3D%22%236a6a6a%22%20d%3D%22M27%204l-15%2015-7-7-5%205%2012%2012%2020-20z%22%3E%3C%2Fpath%3E%3C%2Fsvg%3E")}.inspire-tree .icon-check:hover:before{background-image:url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20version%3D%221.1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20width%3D%22100%25%22%20height%3D%22100%25%22%20viewBox%3D%220%200%2032%2032%22%3E%3Cpath%20fill%3D%22%230ccc0a%22%20d%3D%22M27%204l-15%2015-7-7-5%205%2012%2012%2020-20z%22%3E%3C%2Fpath%3E%3C%2Fsvg%3E")}.inspire-tree .icon-collapse:before{background-image:url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20version%3D%221.1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20width%3D%22100%25%22%20height%3D%22100%25%22%20viewBox%3D%220%200%2024%2024%22%3E%3Cpath%20fill%3D%22%23aaa%22%20d%3D%22M4%201h16q1.242%200%202.121%200.879t0.879%202.121v16q0%201.242-0.879%202.121t-2.121%200.879h-16q-1.242%200-2.121-0.879t-0.879-2.121v-16q0-1.242%200.879-2.121t2.121-0.879zM20%203h-16q-0.414%200-0.707%200.293t-0.293%200.707v16q0%200.414%200.293%200.707t0.707%200.293h16q0.414%200%200.707-0.293t0.293-0.707v-16q0-0.414-0.293-0.707t-0.707-0.293zM8%2011h8q0.414%200%200.707%200.293t0.293%200.707-0.293%200.707-0.707%200.293h-8q-0.414%200-0.707-0.293t-0.293-0.707%200.293-0.707%200.707-0.293z%22%3E%3C%2Fpath%3E%3C%2Fsvg%3E");background-color:#fff;border-radius:3px;margin-left:-1px}.inspire-tree .icon-cross:before{background-image:url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20version%3D%221.1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20width%3D%22100%25%22%20height%3D%22100%25%22%20viewBox%3D%220%200%2032%2032%22%3E%3Cpath%20fill%3D%22%236a6a6a%22%20d%3D%22M31.708%2025.708c-0-0-0-0-0-0l-9.708-9.708%209.708-9.708c0-0%200-0%200-0%200.105-0.105%200.18-0.227%200.229-0.357%200.133-0.356%200.057-0.771-0.229-1.057l-4.586-4.586c-0.286-0.286-0.702-0.361-1.057-0.229-0.13%200.048-0.252%200.124-0.357%200.228%200%200-0%200-0%200l-9.708%209.708-9.708-9.708c-0-0-0-0-0-0-0.105-0.104-0.227-0.18-0.357-0.228-0.356-0.133-0.771-0.057-1.057%200.229l-4.586%204.586c-0.286%200.286-0.361%200.702-0.229%201.057%200.049%200.13%200.124%200.252%200.229%200.357%200%200%200%200%200%200l9.708%209.708-9.708%209.708c-0%200-0%200-0%200-0.104%200.105-0.18%200.227-0.229%200.357-0.133%200.355-0.057%200.771%200.229%201.057l4.586%204.586c0.286%200.286%200.702%200.361%201.057%200.229%200.13-0.049%200.252-0.124%200.357-0.229%200-0%200-0%200-0l9.708-9.708%209.708%209.708c0%200%200%200%200%200%200.105%200.105%200.227%200.18%200.357%200.229%200.356%200.133%200.771%200.057%201.057-0.229l4.586-4.586c0.286-0.286%200.362-0.702%200.229-1.057-0.049-0.13-0.124-0.252-0.229-0.357z%22%3E%3C%2Fpath%3E%3C%2Fsvg%3E")}.inspire-tree .icon-cross:hover:before{background-image:url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20version%3D%221.1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20width%3D%22100%25%22%20height%3D%22100%25%22%20viewBox%3D%220%200%2032%2032%22%3E%3Cpath%20fill%3D%22%23c00%22%20d%3D%22M31.708%2025.708c-0-0-0-0-0-0l-9.708-9.708%209.708-9.708c0-0%200-0%200-0%200.105-0.105%200.18-0.227%200.229-0.357%200.133-0.356%200.057-0.771-0.229-1.057l-4.586-4.586c-0.286-0.286-0.702-0.361-1.057-0.229-0.13%200.048-0.252%200.124-0.357%200.228%200%200-0%200-0%200l-9.708%209.708-9.708-9.708c-0-0-0-0-0-0-0.105-0.104-0.227-0.18-0.357-0.228-0.356-0.133-0.771-0.057-1.057%200.229l-4.586%204.586c-0.286%200.286-0.361%200.702-0.229%201.057%200.049%200.13%200.124%200.252%200.229%200.357%200%200%200%200%200%200l9.708%209.708-9.708%209.708c-0%200-0%200-0%200-0.104%200.105-0.18%200.227-0.229%200.357-0.133%200.355-0.057%200.771%200.229%201.057l4.586%204.586c0.286%200.286%200.702%200.361%201.057%200.229%200.13-0.049%200.252-0.124%200.357-0.229%200-0%200-0%200-0l9.708-9.708%209.708%209.708c0%200%200%200%200%200%200.105%200.105%200.227%200.18%200.357%200.229%200.356%200.133%200.771%200.057%201.057-0.229l4.586-4.586c0.286-0.286%200.362-0.702%200.229-1.057-0.049-0.13-0.124-0.252-0.229-0.357z%22%3E%3C%2Fpath%3E%3C%2Fsvg%3E")}.inspire-tree .icon-expand:before{background-image:url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20version%3D%221.1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20width%3D%22100%25%22%20height%3D%22100%25%22%20viewBox%3D%220%200%2024%2024%22%3E%3Cpath%20fill%3D%22%23aaa%22%20d%3D%22M4%201h16q1.242%200%202.121%200.879t0.879%202.121v16q0%201.242-0.879%202.121t-2.121%200.879h-16q-1.242%200-2.121-0.879t-0.879-2.121v-16q0-1.242%200.879-2.121t2.121-0.879zM20%203h-16q-0.414%200-0.707%200.293t-0.293%200.707v16q0%200.414%200.293%200.707t0.707%200.293h16q0.414%200%200.707-0.293t0.293-0.707v-16q0-0.414-0.293-0.707t-0.707-0.293zM12%207q0.414%200%200.707%200.293t0.293%200.707v3h3q0.414%200%200.707%200.293t0.293%200.707-0.293%200.707-0.707%200.293h-3v3q0%200.414-0.293%200.707t-0.707%200.293-0.707-0.293-0.293-0.707v-3h-3q-0.414%200-0.707-0.293t-0.293-0.707%200.293-0.707%200.707-0.293h3v-3q0-0.414%200.293-0.707t0.707-0.293z%22%3E%3C%2Fpath%3E%3C%2Fsvg%3E");background-color:#fff;border-radius:3px;margin-left:-1px}.inspire-tree .icon-file-empty:before{background-image:url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20version%3D%221.1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20width%3D%22100%25%22%20height%3D%22100%25%22%20viewBox%3D%220%200%2032%2032%22%3E%3Cpath%20fill%3D%22%23a5a5a5%22%20d%3D%22M28.681%207.159c-0.694-0.947-1.662-2.053-2.724-3.116s-2.169-2.030-3.116-2.724c-1.612-1.182-2.393-1.319-2.841-1.319h-15.5c-1.378%200-2.5%201.121-2.5%202.5v27c0%201.378%201.122%202.5%202.5%202.5h23c1.378%200%202.5-1.122%202.5-2.5v-19.5c0-0.448-0.137-1.23-1.319-2.841zM24.543%205.457c0.959%200.959%201.712%201.825%202.268%202.543h-4.811v-4.811c0.718%200.556%201.584%201.309%202.543%202.268zM28%2029.5c0%200.271-0.229%200.5-0.5%200.5h-23c-0.271%200-0.5-0.229-0.5-0.5v-27c0-0.271%200.229-0.5%200.5-0.5%200%200%2015.499-0%2015.5%200v7c0%200.552%200.448%201%201%201h7v19.5z%22%3E%3C%2Fpath%3E%3C%2Fsvg%3E")}.inspire-tree .icon-folder:before{background-image:url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20version%3D%221.1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20width%3D%22100%25%22%20height%3D%22100%25%22%20viewBox%3D%220%200%2032%2032%22%3E%3Cpath%20fill%3D%22%236a6a6a%22%20d%3D%22M14%204l4%204h14v22h-32v-26z%22%3E%3C%2Fpath%3E%3C%2Fsvg%3E")}.inspire-tree .icon-folder-open:before{background-image:url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20version%3D%221.1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20width%3D%22100%25%22%20height%3D%22100%25%22%20viewBox%3D%220%200%2032%2032%22%3E%3Cpath%20fill%3D%22%236a6a6a%22%20d%3D%22M26%2030l6-16h-26l-6%2016zM4%2012l-4%2018v-26h9l4%204h13v4z%22%3E%3C%2Fpath%3E%3C%2Fsvg%3E%0A")}.inspire-tree .icon-minus:before{background-image:url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20version%3D%221.1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20width%3D%22100%25%22%20height%3D%22100%25%22%20viewBox%3D%220%200%2032%2032%22%3E%3Cpath%20fill%3D%22%236a6a6a%22%20d%3D%22M0%2013v6c0%200.552%200.448%201%201%201h30c0.552%200%201-0.448%201-1v-6c0-0.552-0.448-1-1-1h-30c-0.552%200-1%200.448-1%201z%22%3E%3C%2Fpath%3E%3C%2Fsvg%3E")}.inspire-tree .icon-minus:hover:before{background-image:url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20version%3D%221.1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20width%3D%22100%25%22%20height%3D%22100%25%22%20viewBox%3D%220%200%2032%2032%22%3E%3Cpath%20fill%3D%22%23c00%22%20d%3D%22M0%2013v6c0%200.552%200.448%201%201%201h30c0.552%200%201-0.448%201-1v-6c0-0.552-0.448-1-1-1h-30c-0.552%200-1%200.448-1%201z%22%3E%3C%2Fpath%3E%3C%2Fsvg%3E")}.inspire-tree .icon-more:before{background-image:url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20version%3D%221.1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20width%3D%22100%25%22%20height%3D%22100%25%22%20viewBox%3D%220%200%2024%2024%22%3E%3Cpath%20fill%3D%22%236a6a6a%22%20d%3D%22M12%209.984c1.078%200%202.016%200.938%202.016%202.016s-0.938%202.016-2.016%202.016-2.016-0.938-2.016-2.016%200.938-2.016%202.016-2.016zM18%209.984c1.078%200%202.016%200.938%202.016%202.016s-0.938%202.016-2.016%202.016-2.016-0.938-2.016-2.016%200.938-2.016%202.016-2.016zM6%209.984c1.078%200%202.016%200.938%202.016%202.016s-0.938%202.016-2.016%202.016-2.016-0.938-2.016-2.016%200.938-2.016%202.016-2.016z%22%3E%3C%2Fpath%3E%3C%2Fsvg%3E")}.inspire-tree .icon-pencil:before{background-image:url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20version%3D%221.1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20width%3D%22100%25%22%20height%3D%22100%25%22%20viewBox%3D%220%200%2032%2032%22%3E%3Cpath%20fill%3D%22%236a6a6a%22%20d%3D%22M27%200c2.761%200%205%202.239%205%205%200%201.126-0.372%202.164-1%203l-2%202-7-7%202-2c0.836-0.628%201.874-1%203-1zM2%2023l-2%209%209-2%2018.5-18.5-7-7-18.5%2018.5zM22.362%2011.362l-14%2014-1.724-1.724%2014-14%201.724%201.724z%22%3E%3C%2Fpath%3E%3C%2Fsvg%3E%0A")}.inspire-tree .icon-pencil:hover:before{background-image:url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20version%3D%221.1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20width%3D%22100%25%22%20height%3D%22100%25%22%20viewBox%3D%220%200%2032%2032%22%3E%3Cpath%20fill%3D%22%230ccc0a%22%20d%3D%22M27%200c2.761%200%205%202.239%205%205%200%201.126-0.372%202.164-1%203l-2%202-7-7%202-2c0.836-0.628%201.874-1%203-1zM2%2023l-2%209%209-2%2018.5-18.5-7-7-18.5%2018.5zM22.362%2011.362l-14%2014-1.724-1.724%2014-14%201.724%201.724z%22%3E%3C%2Fpath%3E%3C%2Fsvg%3E%0A")}.inspire-tree .icon-plus:before{background-image:url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20version%3D%221.1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20width%3D%22100%25%22%20height%3D%22100%25%22%20viewBox%3D%220%200%2032%2032%22%3E%3Cpath%20fill%3D%22%236a6a6a%22%20d%3D%22M31%2012h-11v-11c0-0.552-0.448-1-1-1h-6c-0.552%200-1%200.448-1%201v11h-11c-0.552%200-1%200.448-1%201v6c0%200.552%200.448%201%201%201h11v11c0%200.552%200.448%201%201%201h6c0.552%200%201-0.448%201-1v-11h11c0.552%200%201-0.448%201-1v-6c0-0.552-0.448-1-1-1z%22%3E%3C%2Fpath%3E%3C%2Fsvg%3E")}.inspire-tree .icon-plus:hover:before{background-image:url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20version%3D%221.1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20width%3D%22100%25%22%20height%3D%22100%25%22%20viewBox%3D%220%200%2032%2032%22%3E%3Cpath%20fill%3D%22%230ccc0a%22%20d%3D%22M31%2012h-11v-11c0-0.552-0.448-1-1-1h-6c-0.552%200-1%200.448-1%201v11h-11c-0.552%200-1%200.448-1%201v6c0%200.552%200.448%201%201%201h11v11c0%200.552%200.448%201%201%201h6c0.552%200%201-0.448%201-1v-11h11c0.552%200%201-0.448%201-1v-6c0-0.552-0.448-1-1-1z%22%3E%3C%2Fpath%3E%3C%2Fsvg%3E")}.inspire-tree .selected>.title-wrap .icon-folder:before{background-image:url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20version%3D%221.1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20width%3D%22100%25%22%20height%3D%22100%25%22%20viewBox%3D%220%200%2032%2032%22%3E%3Cpath%20fill%3D%22%23179bb9%22%20d%3D%22M14%204l4%204h14v22h-32v-26z%22%3E%3C%2Fpath%3E%3C%2Fsvg%3E")}.inspire-tree .selected>.title-wrap .icon-folder-open:before{background-image:url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20version%3D%221.1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20width%3D%22100%25%22%20height%3D%22100%25%22%20viewBox%3D%220%200%2032%2032%22%3E%3Cpath%20fill%3D%22%23179bb9%22%20d%3D%22M26%2030l6-16h-26l-6%2016zM4%2012l-4%2018v-26h9l4%204h13v4z%22%3E%3C%2Fpath%3E%3C%2Fsvg%3E%0A")}.inspire-tree .selected>.title-wrap .icon-file-empty:before{background-image:url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20version%3D%221.1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20width%3D%22100%25%22%20height%3D%22100%25%22%20viewBox%3D%220%200%2032%2032%22%3E%3Cpath%20fill%3D%22%23179bb9%22%20d%3D%22M28.681%207.159c-0.694-0.947-1.662-2.053-2.724-3.116s-2.169-2.030-3.116-2.724c-1.612-1.182-2.393-1.319-2.841-1.319h-15.5c-1.378%200-2.5%201.121-2.5%202.5v27c0%201.378%201.122%202.5%202.5%202.5h23c1.378%200%202.5-1.122%202.5-2.5v-19.5c0-0.448-0.137-1.23-1.319-2.841zM24.543%205.457c0.959%200.959%201.712%201.825%202.268%202.543h-4.811v-4.811c0.718%200.556%201.584%201.309%202.543%202.268zM28%2029.5c0%200.271-0.229%200.5-0.5%200.5h-23c-0.271%200-0.5-0.229-0.5-0.5v-27c0-0.271%200.229-0.5%200.5-0.5%200%200%2015.499-0%2015.5%200v7c0%200.552%200.448%201%201%201h7v19.5z%22%3E%3C%2Fpath%3E%3C%2Fsvg%3E")}.inspire-tree .loading>.title-wrap input{display:none}.inspire-tree .loading>.title-wrap .title:before{background-image:url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20width%3D%2714px%27%20height%3D%2714px%27%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20100%20100%22%20preserveAspectRatio%3D%22xMidYMid%22%20class%3D%22uil-ring%22%3E%3Crect%20x%3D%220%22%20y%3D%220%22%20width%3D%22100%22%20height%3D%22100%22%20fill%3D%22none%22%20class%3D%22bk%22%3E%3C%2Frect%3E%3Cdefs%3E%3Cfilter%20id%3D%22uil-ring-shadow%22%20x%3D%22-100%25%22%20y%3D%22-100%25%22%20width%3D%22300%25%22%20height%3D%22300%25%22%3E%3CfeOffset%20result%3D%22offOut%22%20in%3D%22SourceGraphic%22%20dx%3D%220%22%20dy%3D%220%22%3E%3C%2FfeOffset%3E%3CfeGaussianBlur%20result%3D%22blurOut%22%20in%3D%22offOut%22%20stdDeviation%3D%220%22%3E%3C%2FfeGaussianBlur%3E%3CfeBlend%20in%3D%22SourceGraphic%22%20in2%3D%22blurOut%22%20mode%3D%22normal%22%3E%3C%2FfeBlend%3E%3C%2Ffilter%3E%3C%2Fdefs%3E%3Cpath%20d%3D%22M10%2C50c0%2C0%2C0%2C0.5%2C0.1%2C1.4c0%2C0.5%2C0.1%2C1%2C0.2%2C1.7c0%2C0.3%2C0.1%2C0.7%2C0.1%2C1.1c0.1%2C0.4%2C0.1%2C0.8%2C0.2%2C1.2c0.2%2C0.8%2C0.3%2C1.8%2C0.5%2C2.8%20c0.3%2C1%2C0.6%2C2.1%2C0.9%2C3.2c0.3%2C1.1%2C0.9%2C2.3%2C1.4%2C3.5c0.5%2C1.2%2C1.2%2C2.4%2C1.8%2C3.7c0.3%2C0.6%2C0.8%2C1.2%2C1.2%2C1.9c0.4%2C0.6%2C0.8%2C1.3%2C1.3%2C1.9%20c1%2C1.2%2C1.9%2C2.6%2C3.1%2C3.7c2.2%2C2.5%2C5%2C4.7%2C7.9%2C6.7c3%2C2%2C6.5%2C3.4%2C10.1%2C4.6c3.6%2C1.1%2C7.5%2C1.5%2C11.2%2C1.6c4-0.1%2C7.7-0.6%2C11.3-1.6%20c3.6-1.2%2C7-2.6%2C10-4.6c3-2%2C5.8-4.2%2C7.9-6.7c1.2-1.2%2C2.1-2.5%2C3.1-3.7c0.5-0.6%2C0.9-1.3%2C1.3-1.9c0.4-0.6%2C0.8-1.3%2C1.2-1.9%20c0.6-1.3%2C1.3-2.5%2C1.8-3.7c0.5-1.2%2C1-2.4%2C1.4-3.5c0.3-1.1%2C0.6-2.2%2C0.9-3.2c0.2-1%2C0.4-1.9%2C0.5-2.8c0.1-0.4%2C0.1-0.8%2C0.2-1.2%20c0-0.4%2C0.1-0.7%2C0.1-1.1c0.1-0.7%2C0.1-1.2%2C0.2-1.7C90%2C50.5%2C90%2C50%2C90%2C50s0%2C0.5%2C0%2C1.4c0%2C0.5%2C0%2C1%2C0%2C1.7c0%2C0.3%2C0%2C0.7%2C0%2C1.1%20c0%2C0.4-0.1%2C0.8-0.1%2C1.2c-0.1%2C0.9-0.2%2C1.8-0.4%2C2.8c-0.2%2C1-0.5%2C2.1-0.7%2C3.3c-0.3%2C1.2-0.8%2C2.4-1.2%2C3.7c-0.2%2C0.7-0.5%2C1.3-0.8%2C1.9%20c-0.3%2C0.7-0.6%2C1.3-0.9%2C2c-0.3%2C0.7-0.7%2C1.3-1.1%2C2c-0.4%2C0.7-0.7%2C1.4-1.2%2C2c-1%2C1.3-1.9%2C2.7-3.1%2C4c-2.2%2C2.7-5%2C5-8.1%2C7.1%20c-0.8%2C0.5-1.6%2C1-2.4%2C1.5c-0.8%2C0.5-1.7%2C0.9-2.6%2C1.3L66%2C87.7l-1.4%2C0.5c-0.9%2C0.3-1.8%2C0.7-2.8%2C1c-3.8%2C1.1-7.9%2C1.7-11.8%2C1.8L47%2C90.8%20c-1%2C0-2-0.2-3-0.3l-1.5-0.2l-0.7-0.1L41.1%2C90c-1-0.3-1.9-0.5-2.9-0.7c-0.9-0.3-1.9-0.7-2.8-1L34%2C87.7l-1.3-0.6%20c-0.9-0.4-1.8-0.8-2.6-1.3c-0.8-0.5-1.6-1-2.4-1.5c-3.1-2.1-5.9-4.5-8.1-7.1c-1.2-1.2-2.1-2.7-3.1-4c-0.5-0.6-0.8-1.4-1.2-2%20c-0.4-0.7-0.8-1.3-1.1-2c-0.3-0.7-0.6-1.3-0.9-2c-0.3-0.7-0.6-1.3-0.8-1.9c-0.4-1.3-0.9-2.5-1.2-3.7c-0.3-1.2-0.5-2.3-0.7-3.3%20c-0.2-1-0.3-2-0.4-2.8c-0.1-0.4-0.1-0.8-0.1-1.2c0-0.4%2C0-0.7%2C0-1.1c0-0.7%2C0-1.2%2C0-1.7C10%2C50.5%2C10%2C50%2C10%2C50z%22%20fill%3D%22%23013138%22%20filter%3D%22url(%23uil-ring-shadow)%22%3E%3CanimateTransform%20attributeName%3D%22transform%22%20type%3D%22rotate%22%20from%3D%220%2050%2050%22%20to%3D%22360%2050%2050%22%20repeatCount%3D%22indefinite%22%20dur%3D%221s%22%3E%3C%2FanimateTransform%3E%3C%2Fpath%3E%3C%2Fsvg%3E");content:"";height:14px;width:14px}.inspire-tree>ol{position:relative}.inspire-tree .wholerow{height:25px;left:0;margin-top:-25px;position:absolute;width:100%;z-index:1}.inspire-tree .focused>.wholerow{border:1px dotted #000}.inspire-tree .title-wrap:hover+.wholerow,.inspire-tree .wholerow:hover{background-color:rgba(218,250,255,.5)}.inspire-tree .selected>.title-wrap:hover+.wholerow,.inspire-tree .selected>.wholerow,.inspire-tree .selected>.wholerow:hover{background-color:rgba(164,234,245,.5)}.inspire-tree .matched>.title-wrap:hover+.wholerow,.inspire-tree .matched>.wholerow,.inspire-tree .matched>.wholerow:hover{background-color:rgba(247,255,170,.5)}
\ No newline at end of file
diff --git a/dataforge-vis-spatial-gdml/src/jsMain/web/css/jsoneditor.min.css b/dataforge-vis-spatial-gdml/src/jsMain/web/css/jsoneditor.min.css
deleted file mode 100644
index e436fb54..00000000
--- a/dataforge-vis-spatial-gdml/src/jsMain/web/css/jsoneditor.min.css
+++ /dev/null
@@ -1,6 +0,0 @@
-.jsoneditor .search input{height:auto;border:inherit;border:none;box-shadow:none}.jsoneditor table{border-collapse:collapse;width:auto}.jsoneditor td,.jsoneditor th{padding:0;display:table-cell;text-align:left;vertical-align:inherit;border-radius:inherit}.jsoneditor{color:#1a1a1a;border:thin solid #3883fa;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box;width:100%;height:100%;position:relative;padding:0;line-height:100%}div.jsoneditor-default,div.jsoneditor-field,div.jsoneditor-readonly,div.jsoneditor-value{border:1px solid transparent;min-height:16px;min-width:32px;padding:2px;margin:1px;word-wrap:break-word;float:left}div.jsoneditor-field p,div.jsoneditor-value p{margin:0}div.jsoneditor-value{word-break:break-word}div.jsoneditor-value.jsoneditor-empty::after{content:"value"}div.jsoneditor-value.jsoneditor-string{color:#006000}div.jsoneditor-value.jsoneditor-number{color:#ee422e}div.jsoneditor-value.jsoneditor-boolean{color:#ff8c00}div.jsoneditor-value.jsoneditor-null{color:#004ed0}div.jsoneditor-value.jsoneditor-invalid{color:#000}div.jsoneditor-readonly{min-width:16px;color:grey}div.jsoneditor-empty{border-color:#d3d3d3;border-style:dashed;border-radius:2px}div.jsoneditor-field.jsoneditor-empty::after{content:"field"}div.jsoneditor td{vertical-align:top}div.jsoneditor td.jsoneditor-separator{padding:3px 0;vertical-align:top;color:grey}div.jsoneditor td.jsoneditor-tree{vertical-align:top}div.jsoneditor div.jsoneditor-anchor{cursor:pointer}div.jsoneditor div.jsoneditor-anchor .picker_wrapper.popup.popup_bottom{top:28px;left:-10px}div.jsoneditor.busy pre.jsoneditor-preview{background:#f5f5f5;color:grey}div.jsoneditor.busy div.jsoneditor-busy{display:inherit}div.jsoneditor code.jsoneditor-preview{background:0 0}div.jsoneditor.jsoneditor-mode-preview pre.jsoneditor-preview{width:100%;height:100%;box-sizing:border-box;overflow:auto;padding:2px;margin:0;white-space:pre-wrap;word-break:break-all}div.jsoneditor-default{color:grey;padding-left:10px}div.jsoneditor-tree{width:100%;height:100%;position:relative;overflow:auto}div.jsoneditor-tree button.jsoneditor-button{width:24px;height:24px;padding:0;margin:0;border:none;cursor:pointer;background:transparent url(img/jsoneditor-icons.svg)}div.jsoneditor-tree button.jsoneditor-button:focus{background-color:#f5f5f5;outline:#e5e5e5 solid 1px}div.jsoneditor-tree button.jsoneditor-collapsed{background-position:0 -48px}div.jsoneditor-tree button.jsoneditor-expanded{background-position:0 -72px}div.jsoneditor-tree button.jsoneditor-contextmenu{background-position:-48px -72px}div.jsoneditor-tree button.jsoneditor-invisible{visibility:hidden;background:0 0}div.jsoneditor-tree button.jsoneditor-dragarea{background:url(img/jsoneditor-icons.svg) -72px -72px;cursor:move}div.jsoneditor-tree :focus{outline:0}div.jsoneditor-tree div.jsoneditor-show-more{display:inline-block;padding:3px 4px;margin:2px 0;background-color:#e5e5e5;border-radius:3px;color:grey;font-family:arial,sans-serif;font-size:10pt}div.jsoneditor-tree div.jsoneditor-show-more a{display:inline-block;color:grey}div.jsoneditor-tree div.jsoneditor-color{display:inline-block;width:12px;height:12px;margin:4px;border:1px solid grey;cursor:pointer}div.jsoneditor-tree div.jsoneditor-date{background:#a1a1a1;color:#fff;font-family:arial,sans-serif;border-radius:3px;display:inline-block;padding:3px;margin:0 3px}div.jsoneditor-tree table.jsoneditor-tree{border-collapse:collapse;border-spacing:0;width:100%}div.jsoneditor-tree .jsoneditor-button.jsoneditor-schema-error{width:24px;height:24px;padding:0;margin:0 4px 0 0;background:url(img/jsoneditor-icons.svg) -168px -48px}div.jsoneditor-outer{position:static;width:100%;height:100%;margin:0;padding:0;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box}div.jsoneditor-outer.has-nav-bar{margin-top:-26px;padding-top:26px}div.jsoneditor-outer.has-nav-bar.has-main-menu-bar{margin-top:-61px;padding-top:61px}div.jsoneditor-outer.has-status-bar{margin-bottom:-26px;padding-bottom:26px}div.jsoneditor-outer.has-main-menu-bar{margin-top:-35px;padding-top:35px}div.jsoneditor-busy{position:absolute;top:15%;left:0;box-sizing:border-box;width:100%;text-align:center;display:none}div.jsoneditor-busy span{background-color:#ffffab;border:1px solid #fe0;border-radius:3px;padding:5px 15px;box-shadow:0 0 5px rgba(0,0,0,.4)}div.jsoneditor-field.jsoneditor-empty::after,div.jsoneditor-value.jsoneditor-empty::after{pointer-events:none;color:#d3d3d3;font-size:8pt}a.jsoneditor-value.jsoneditor-url,div.jsoneditor-value.jsoneditor-url{color:#006000;text-decoration:underline}a.jsoneditor-value.jsoneditor-url{display:inline-block;padding:2px;margin:2px}a.jsoneditor-value.jsoneditor-url:focus,a.jsoneditor-value.jsoneditor-url:hover{color:#ee422e}div.jsoneditor-field.jsoneditor-highlight,div.jsoneditor-field[contenteditable=true]:focus,div.jsoneditor-field[contenteditable=true]:hover,div.jsoneditor-value.jsoneditor-highlight,div.jsoneditor-value[contenteditable=true]:focus,div.jsoneditor-value[contenteditable=true]:hover{background-color:#ffffab;border:1px solid #fe0;border-radius:2px}div.jsoneditor-field.jsoneditor-highlight-active,div.jsoneditor-field.jsoneditor-highlight-active:focus,div.jsoneditor-field.jsoneditor-highlight-active:hover,div.jsoneditor-value.jsoneditor-highlight-active,div.jsoneditor-value.jsoneditor-highlight-active:focus,div.jsoneditor-value.jsoneditor-highlight-active:hover{background-color:#fe0;border:1px solid #ffc700;border-radius:2px}div.jsoneditor-value.jsoneditor-array,div.jsoneditor-value.jsoneditor-object{min-width:16px}div.jsoneditor-mode-form tr.jsoneditor-expandable td.jsoneditor-tree,div.jsoneditor-mode-view tr.jsoneditor-expandable td.jsoneditor-tree{cursor:pointer}div.jsoneditor-tree button.jsoneditor-contextmenu.jsoneditor-selected,div.jsoneditor-tree button.jsoneditor-contextmenu:focus,div.jsoneditor-tree button.jsoneditor-contextmenu:hover,tr.jsoneditor-selected.jsoneditor-first button.jsoneditor-contextmenu{background-position:-48px -48px}div.jsoneditor-tree div.jsoneditor-show-more a:focus,div.jsoneditor-tree div.jsoneditor-show-more a:hover{color:#ee422e}.ace-jsoneditor,textarea.jsoneditor-text{min-height:150px}textarea.jsoneditor-text{width:100%;height:100%;margin:0;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box;outline-width:0;border:none;background-color:#fff;resize:none}tr.jsoneditor-highlight,tr.jsoneditor-selected{background-color:#d3d3d3}tr.jsoneditor-selected button.jsoneditor-contextmenu,tr.jsoneditor-selected button.jsoneditor-dragarea{visibility:hidden}tr.jsoneditor-selected.jsoneditor-first button.jsoneditor-contextmenu,tr.jsoneditor-selected.jsoneditor-first button.jsoneditor-dragarea{visibility:visible}div.jsoneditor-tree button.jsoneditor-dragarea:focus,div.jsoneditor-tree button.jsoneditor-dragarea:hover,tr.jsoneditor-selected.jsoneditor-first button.jsoneditor-dragarea{background-position:-72px -48px}div.jsoneditor td,div.jsoneditor th,div.jsoneditor tr{padding:0;margin:0}.jsoneditor-popover,.jsoneditor-schema-error,div.jsoneditor td,div.jsoneditor textarea,div.jsoneditor th,div.jsoneditor-field,div.jsoneditor-value,pre.jsoneditor-preview{font-family:"dejavu sans mono","droid sans mono",consolas,monaco,"lucida console","courier new",courier,monospace,sans-serif;font-size:10pt;color:#1a1a1a}.jsoneditor-schema-error{cursor:default;display:inline-block;height:24px;line-height:24px;position:relative;text-align:center;width:24px}.jsoneditor-popover{background-color:#4c4c4c;border-radius:3px;box-shadow:0 0 5px rgba(0,0,0,.4);color:#fff;padding:7px 10px;position:absolute;cursor:auto;width:200px;z-index:999}.jsoneditor-popover.jsoneditor-above{bottom:32px;left:-98px}.jsoneditor-popover.jsoneditor-above:before{border-top:7px solid #4c4c4c;bottom:-7px}.jsoneditor-popover.jsoneditor-below{top:32px;left:-98px}.jsoneditor-popover.jsoneditor-below:before{border-bottom:7px solid #4c4c4c;top:-7px}.jsoneditor-popover.jsoneditor-left{top:-7px;right:32px}.jsoneditor-popover.jsoneditor-left:before{border-left:7px solid #4c4c4c;border-top:7px solid transparent;border-bottom:7px solid transparent;content:"";top:19px;right:-14px;left:inherit;margin-left:inherit;margin-top:-7px;position:absolute}.jsoneditor-popover.jsoneditor-right{top:-7px;left:32px}.jsoneditor-popover.jsoneditor-right:before{border-right:7px solid #4c4c4c;border-top:7px solid transparent;border-bottom:7px solid transparent;content:"";top:19px;left:-14px;margin-left:inherit;margin-top:-7px;position:absolute}.jsoneditor-popover:before{border-right:7px solid transparent;border-left:7px solid transparent;content:"";display:block;left:50%;margin-left:-7px;position:absolute}.jsoneditor-text-errors tr.jump-to-line:hover{text-decoration:underline;cursor:pointer}.jsoneditor-schema-error:focus .jsoneditor-popover,.jsoneditor-schema-error:hover .jsoneditor-popover{display:block;animation:fade-in .3s linear 1,move-up .3s linear 1}@keyframes fade-in{from{opacity:0}to{opacity:1}}.jsoneditor .jsoneditor-validation-errors-container{max-height:130px;overflow-y:auto}.jsoneditor .jsoneditor-validation-errors{width:100%;overflow:hidden}.jsoneditor .jsoneditor-additional-errors{position:absolute;margin:auto;bottom:31px;left:calc(50% - 92px);color:grey;background-color:#ebebeb;padding:7px 15px;border-radius:8px}.jsoneditor .jsoneditor-additional-errors.visible{visibility:visible;opacity:1;transition:opacity 2s linear}.jsoneditor .jsoneditor-additional-errors.hidden{visibility:hidden;opacity:0;transition:visibility 0s 2s,opacity 2s linear}.jsoneditor .jsoneditor-text-errors{width:100%;border-collapse:collapse;border-top:1px solid #ffc700}.jsoneditor .jsoneditor-text-errors td{padding:3px 6px;vertical-align:middle}.jsoneditor .jsoneditor-text-errors td pre{margin:0;white-space:normal}.jsoneditor .jsoneditor-text-errors tr{background-color:#ffffab}.jsoneditor .jsoneditor-text-errors tr.parse-error{background-color:#ee2e2e70}.jsoneditor-text-errors .jsoneditor-schema-error{border:none;width:24px;height:24px;padding:0;margin:0 4px 0 0;cursor:pointer}.jsoneditor-text-errors tr .jsoneditor-schema-error{background:url(img/jsoneditor-icons.svg) -168px -48px}.jsoneditor-text-errors tr.parse-error .jsoneditor-schema-error{background:url(img/jsoneditor-icons.svg) -25px 0}.fadein{-webkit-animation:fadein .3s;animation:fadein .3s;-moz-animation:fadein .3s;-o-animation:fadein .3s}@keyframes fadein{0%{opacity:0}100%{opacity:1}}.jsoneditor-contextmenu-root{position:relative;width:0;height:0}.jsoneditor-contextmenu{position:absolute;box-sizing:content-box;z-index:99}.jsoneditor-contextmenu .jsoneditor-menu{position:relative;left:0;top:0;width:128px;height:auto;background:#fff;border:1px solid #d3d3d3;box-shadow:2px 2px 12px rgba(128,128,128,.3);list-style:none;margin:0;padding:0}.jsoneditor-contextmenu .jsoneditor-menu button{position:relative;padding:0 4px 0 0;margin:0;width:128px;height:auto;border:none;cursor:pointer;color:#4d4d4d;background:0 0;font-size:10pt;font-family:arial,sans-serif;box-sizing:border-box;text-align:left}.jsoneditor-contextmenu .jsoneditor-menu button::-moz-focus-inner{padding:0;border:0}.jsoneditor-contextmenu .jsoneditor-menu button.jsoneditor-default{width:96px}.jsoneditor-contextmenu .jsoneditor-menu button.jsoneditor-expand{float:right;width:32px;height:24px;border-left:1px solid #e5e5e5}.jsoneditor-contextmenu .jsoneditor-menu li{overflow:hidden}.jsoneditor-contextmenu .jsoneditor-menu li ul{display:none;position:relative;left:-10px;top:0;border:none;box-shadow:inset 0 0 10px rgba(128,128,128,.5);padding:0 10px;-webkit-transition:all .3s ease-out;-moz-transition:all .3s ease-out;-o-transition:all .3s ease-out;transition:all .3s ease-out}.jsoneditor-contextmenu .jsoneditor-menu li ul .jsoneditor-icon{margin-left:24px}.jsoneditor-contextmenu .jsoneditor-menu li ul li button{padding-left:24px;animation:all ease-in-out 1s}.jsoneditor-contextmenu .jsoneditor-menu li button .jsoneditor-expand{position:absolute;top:0;right:0;width:24px;height:24px;padding:0;margin:0 4px 0 0;background:url(img/jsoneditor-icons.svg) 0 -72px}.jsoneditor-contextmenu .jsoneditor-icon{position:absolute;top:0;left:0;width:24px;height:24px;border:none;padding:0;margin:0;background-image:url(img/jsoneditor-icons.svg)}.jsoneditor-contextmenu .jsoneditor-text{padding:4px 0 4px 24px;word-wrap:break-word}.jsoneditor-contextmenu .jsoneditor-text.jsoneditor-right-margin{padding-right:24px}.jsoneditor-contextmenu .jsoneditor-separator{height:0;border-top:1px solid #e5e5e5;padding-top:5px;margin-top:5px}.jsoneditor-contextmenu button.jsoneditor-remove .jsoneditor-icon{background-position:-24px 0}.jsoneditor-contextmenu button.jsoneditor-append .jsoneditor-icon{background-position:0 0}.jsoneditor-contextmenu button.jsoneditor-insert .jsoneditor-icon{background-position:0 0}.jsoneditor-contextmenu button.jsoneditor-duplicate .jsoneditor-icon{background-position:-48px 0}.jsoneditor-contextmenu button.jsoneditor-sort-asc .jsoneditor-icon{background-position:-168px 0}.jsoneditor-contextmenu button.jsoneditor-sort-desc .jsoneditor-icon{background-position:-192px 0}.jsoneditor-contextmenu button.jsoneditor-transform .jsoneditor-icon{background-position:-216px 0}.jsoneditor-contextmenu button.jsoneditor-extract .jsoneditor-icon{background-position:0 -24px}.jsoneditor-contextmenu button.jsoneditor-type-string .jsoneditor-icon{background-position:-144px 0}.jsoneditor-contextmenu button.jsoneditor-type-auto .jsoneditor-icon{background-position:-120px 0}.jsoneditor-contextmenu button.jsoneditor-type-object .jsoneditor-icon{background-position:-72px 0}.jsoneditor-contextmenu button.jsoneditor-type-array .jsoneditor-icon{background-position:-96px 0}.jsoneditor-contextmenu button.jsoneditor-type-modes .jsoneditor-icon{background-image:none;width:6px}.jsoneditor-contextmenu li,.jsoneditor-contextmenu ul{box-sizing:content-box;position:relative}.jsoneditor-contextmenu .jsoneditor-menu button:focus,.jsoneditor-contextmenu .jsoneditor-menu button:hover{color:#1a1a1a;background-color:#f5f5f5;outline:0}.jsoneditor-contextmenu .jsoneditor-menu li button.jsoneditor-selected,.jsoneditor-contextmenu .jsoneditor-menu li button.jsoneditor-selected:focus,.jsoneditor-contextmenu .jsoneditor-menu li button.jsoneditor-selected:hover{color:#fff;background-color:#ee422e}.jsoneditor-contextmenu .jsoneditor-menu li ul li button:focus,.jsoneditor-contextmenu .jsoneditor-menu li ul li button:hover{background-color:#f5f5f5}.jsoneditor-modal{max-width:95%;border-radius:2px!important;padding:45px 15px 15px 15px!important;box-shadow:2px 2px 12px rgba(128,128,128,.3);color:#4d4d4d;line-height:1.3em}.jsoneditor-modal.jsoneditor-modal-transform{width:600px!important}.jsoneditor-modal .pico-modal-header{position:absolute;box-sizing:border-box;top:0;left:0;width:100%;padding:0 10px;height:30px;line-height:30px;font-family:arial,sans-serif;font-size:11pt;background:#3883fa;color:#fff}.jsoneditor-modal table{width:100%}.jsoneditor-modal table td{padding:3px 0}.jsoneditor-modal table td.jsoneditor-modal-input{text-align:right;padding-right:0;white-space:nowrap}.jsoneditor-modal table td.jsoneditor-modal-actions{padding-top:15px}.jsoneditor-modal table th{vertical-align:middle}.jsoneditor-modal p:first-child{margin-top:0}.jsoneditor-modal a{color:#3883fa}.jsoneditor-modal .jsoneditor-jmespath-block{margin-bottom:10px}.jsoneditor-modal .pico-close{background:0 0!important;font-size:24px!important;top:7px!important;right:7px!important;color:#fff}.jsoneditor-modal input{padding:4px}.jsoneditor-modal input[type=text]{cursor:inherit}.jsoneditor-modal input[disabled]{background:#d3d3d3;color:grey}.jsoneditor-modal .jsoneditor-select-wrapper{position:relative;display:inline-block}.jsoneditor-modal .jsoneditor-select-wrapper:after{content:"";width:0;height:0;border-left:5px solid transparent;border-right:5px solid transparent;border-top:6px solid #666;position:absolute;right:8px;top:14px;pointer-events:none}.jsoneditor-modal select{padding:3px 24px 3px 10px;min-width:180px;max-width:350px;-webkit-appearance:none;-moz-appearance:none;appearance:none;text-indent:0;text-overflow:"";font-size:10pt;line-height:1.5em}.jsoneditor-modal select::-ms-expand{display:none}.jsoneditor-modal .jsoneditor-button-group input{padding:4px 10px;margin:0;border-radius:0;border-left-style:none}.jsoneditor-modal .jsoneditor-button-group input.jsoneditor-button-first{border-top-left-radius:3px;border-bottom-left-radius:3px;border-left-style:solid}.jsoneditor-modal .jsoneditor-button-group input.jsoneditor-button-last{border-top-right-radius:3px;border-bottom-right-radius:3px}.jsoneditor-modal .jsoneditor-transform-preview{background:#f5f5f5;height:200px}.jsoneditor-modal .jsoneditor-transform-preview.jsoneditor-error{color:#ee422e}.jsoneditor-modal .jsoneditor-jmespath-wizard{line-height:1.2em;width:100%;padding:0;border-radius:3px}.jsoneditor-modal .jsoneditor-jmespath-label{font-weight:700;color:#1e90ff;margin-top:20px;margin-bottom:5px}.jsoneditor-modal .jsoneditor-jmespath-wizard-table{width:100%}.jsoneditor-modal .jsoneditor-jmespath-wizard-label{font-style:italic;margin:4px 0 2px 0}.jsoneditor-modal .jsoneditor-inline{position:relative;display:inline-block;width:100%;padding-top:2px;padding-bottom:2px}.jsoneditor-modal .jsoneditor-inline:not(:last-child){padding-right:2px}.jsoneditor-modal .jsoneditor-jmespath-filter{display:flex;flex-wrap:wrap}.jsoneditor-modal .jsoneditor-jmespath-filter-field{width:180px}.jsoneditor-modal .jsoneditor-jmespath-filter-relation{width:100px}.jsoneditor-modal .jsoneditor-jmespath-filter-value{min-width:180px;flex:1}.jsoneditor-modal .jsoneditor-jmespath-sort-field{width:170px}.jsoneditor-modal .jsoneditor-jmespath-sort-order{width:150px}.jsoneditor-modal .jsoneditor-jmespath-select-fields{width:100%}.jsoneditor-modal .selectr-selected{border-color:#d3d3d3;padding:4px 28px 4px 8px}.jsoneditor-modal .selectr-selected .selectr-tag{background-color:#3883fa;border-radius:5px}.jsoneditor-modal table td,.jsoneditor-modal table th{text-align:left;vertical-align:top;font-weight:400;color:#4d4d4d;border-spacing:0;border-collapse:collapse}.jsoneditor-modal #query,.jsoneditor-modal input,.jsoneditor-modal select,.jsoneditor-modal textarea{background:#fff;border:1px solid #d3d3d3;color:#4d4d4d;border-radius:3px;padding:4px}.jsoneditor-modal,.jsoneditor-modal #query,.jsoneditor-modal input,.jsoneditor-modal option,.jsoneditor-modal select,.jsoneditor-modal table td,.jsoneditor-modal table th,.jsoneditor-modal textarea{font-size:10.5pt;font-family:arial,sans-serif}.jsoneditor-modal #query,.jsoneditor-modal .jsoneditor-transform-preview{font-family:"dejavu sans mono","droid sans mono",consolas,monaco,"lucida console","courier new",courier,monospace,sans-serif;font-size:10pt;width:100%;box-sizing:border-box}.jsoneditor-modal input[type=button],.jsoneditor-modal input[type=submit]{background:#f5f5f5;padding:4px 20px}.jsoneditor-modal input,.jsoneditor-modal select{cursor:pointer}.jsoneditor-modal .jsoneditor-button-group.jsoneditor-button-group-value-asc input.jsoneditor-button-asc,.jsoneditor-modal .jsoneditor-button-group.jsoneditor-button-group-value-desc input.jsoneditor-button-desc{background:#3883fa;border-color:#3883fa;color:#fff}.jsoneditor-menu{width:100%;height:35px;padding:2px;margin:0;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box;color:#fff;background-color:#3883fa;border-bottom:1px solid #3883fa}.jsoneditor-menu>.jsoneditor-modes>button,.jsoneditor-menu>button{width:26px;height:26px;margin:2px;padding:0;border-radius:2px;border:1px solid transparent;background:transparent url(img/jsoneditor-icons.svg);color:#fff;opacity:.8;font-family:arial,sans-serif;font-size:10pt;float:left}.jsoneditor-menu>.jsoneditor-modes>button:hover,.jsoneditor-menu>button:hover{background-color:rgba(255,255,255,.2);border:1px solid rgba(255,255,255,.4)}.jsoneditor-menu>.jsoneditor-modes>button:active,.jsoneditor-menu>.jsoneditor-modes>button:focus,.jsoneditor-menu>button:active,.jsoneditor-menu>button:focus{background-color:rgba(255,255,255,.3)}.jsoneditor-menu>.jsoneditor-modes>button:disabled,.jsoneditor-menu>button:disabled{opacity:.5;background-color:transparent;border:none}.jsoneditor-menu>button.jsoneditor-collapse-all{background-position:0 -96px}.jsoneditor-menu>button.jsoneditor-expand-all{background-position:0 -120px}.jsoneditor-menu>button.jsoneditor-sort{background-position:-120px -96px}.jsoneditor-menu>button.jsoneditor-transform{background-position:-144px -96px}.jsoneditor.jsoneditor-mode-form>.jsoneditor-menu>button.jsoneditor-sort,.jsoneditor.jsoneditor-mode-form>.jsoneditor-menu>button.jsoneditor-transform,.jsoneditor.jsoneditor-mode-view>.jsoneditor-menu>button.jsoneditor-sort,.jsoneditor.jsoneditor-mode-view>.jsoneditor-menu>button.jsoneditor-transform{display:none}.jsoneditor-menu>button.jsoneditor-undo{background-position:-24px -96px}.jsoneditor-menu>button.jsoneditor-undo:disabled{background-position:-24px -120px}.jsoneditor-menu>button.jsoneditor-redo{background-position:-48px -96px}.jsoneditor-menu>button.jsoneditor-redo:disabled{background-position:-48px -120px}.jsoneditor-menu>button.jsoneditor-compact{background-position:-72px -96px}.jsoneditor-menu>button.jsoneditor-format{background-position:-72px -120px}.jsoneditor-menu>button.jsoneditor-repair{background-position:-96px -96px}.jsoneditor-menu>.jsoneditor-modes{display:inline-block;float:left}.jsoneditor-menu>.jsoneditor-modes>button{background-image:none;width:auto;padding-left:6px;padding-right:6px}.jsoneditor-menu>.jsoneditor-modes>button.jsoneditor-separator,.jsoneditor-menu>button.jsoneditor-separator{margin-left:10px}.jsoneditor-menu a{font-family:arial,sans-serif;font-size:10pt;color:#fff;opacity:.8;vertical-align:middle}.jsoneditor-menu a:hover{opacity:1}.jsoneditor-menu a.jsoneditor-poweredBy{font-size:8pt;position:absolute;right:0;top:0;padding:10px}.jsoneditor-search{font-family:arial,sans-serif;position:absolute;right:4px;top:4px;border-collapse:collapse;border-spacing:0;display:flex}.jsoneditor-search input{color:#1a1a1a;width:120px;border:none;outline:0;margin:1px;line-height:20px}.jsoneditor-search button{width:16px;height:24px;padding:0;margin:0;border:none;background:url(img/jsoneditor-icons.svg);vertical-align:top}.jsoneditor-search button:hover{background-color:transparent}.jsoneditor-search button.jsoneditor-refresh{width:18px;background-position:-99px -73px}.jsoneditor-search button.jsoneditor-next{cursor:pointer;background-position:-124px -73px}.jsoneditor-search button.jsoneditor-next:hover{background-position:-124px -49px}.jsoneditor-search button.jsoneditor-previous{cursor:pointer;background-position:-148px -73px;margin-right:2px}.jsoneditor-search button.jsoneditor-previous:hover{background-position:-148px -49px}.jsoneditor-results{font-family:arial,sans-serif;color:#fff;padding-right:5px;line-height:26px}.jsoneditor-frame{border:1px solid transparent;background-color:#fff;padding:0 2px;margin:0}.jsoneditor .autocomplete.dropdown{position:absolute;background:#fff;box-shadow:2px 2px 12px rgba(128,128,128,.3);border:1px solid #d3d3d3;z-index:100;overflow-x:hidden;overflow-y:auto;cursor:default;margin:0;padding:5px;text-align:left;outline:0;font-family:"dejavu sans mono","droid sans mono",consolas,monaco,"lucida console","courier new",courier,monospace,sans-serif;font-size:10pt}.jsoneditor .autocomplete.dropdown .item{color:#333}.jsoneditor .autocomplete.dropdown .item.hover{background-color:#ddd}.jsoneditor .autocomplete.hint{color:#aaa;top:4px;left:4px}.jsoneditor-treepath{padding:0 5px;overflow:hidden;white-space:nowrap;outline:0}.jsoneditor-treepath.show-all{word-wrap:break-word;white-space:normal;position:absolute;background-color:#ebebeb;z-index:999;box-shadow:2px 2px 12px rgba(128,128,128,.3)}.jsoneditor-treepath.show-all span.jsoneditor-treepath-show-all-btn{display:none}.jsoneditor-treepath div.jsoneditor-contextmenu-root{position:absolute;left:0}.jsoneditor-treepath .jsoneditor-treepath-show-all-btn{position:absolute;background-color:#ebebeb;left:0;height:20px;padding:0 3px;cursor:pointer}.jsoneditor-treepath .jsoneditor-treepath-element{margin:1px;font-family:arial,sans-serif;font-size:10pt}.jsoneditor-treepath .jsoneditor-treepath-seperator{margin:2px;font-size:9pt;font-family:arial,sans-serif}.jsoneditor-treepath span.jsoneditor-treepath-element:hover,.jsoneditor-treepath span.jsoneditor-treepath-seperator:hover{cursor:pointer;text-decoration:underline}.jsoneditor-statusbar{line-height:26px;height:26px;color:grey;background-color:#ebebeb;border-top:1px solid #d3d3d3;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box;font-size:10pt}.jsoneditor-statusbar>.jsoneditor-curserinfo-val{margin-right:12px}.jsoneditor-statusbar>.jsoneditor-curserinfo-count{margin-left:4px}.jsoneditor-statusbar>.jsoneditor-validation-error-icon{float:right;width:24px;height:24px;padding:0;margin-top:1px;background:url(img/jsoneditor-icons.svg) -168px -48px;cursor:pointer}.jsoneditor-statusbar>.jsoneditor-validation-error-count{float:right;margin:0 4px 0 0;cursor:pointer}.jsoneditor-statusbar>.jsoneditor-parse-error-icon{float:right;width:24px;height:24px;padding:0;margin:1px;background:url(img/jsoneditor-icons.svg) -25px 0}.jsoneditor-statusbar .jsoneditor-array-info a{color:inherit}div.jsoneditor-statusbar>.jsoneditor-curserinfo-label,div.jsoneditor-statusbar>.jsoneditor-size-info{margin:0 4px}.jsoneditor-navigation-bar{width:100%;height:26px;line-height:26px;padding:0;margin:0;border-bottom:1px solid #d3d3d3;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box;color:grey;background-color:#ebebeb;overflow:hidden;font-family:arial,sans-serif;font-size:10pt}/*!
- * Selectr 2.4.0
- * https://github.com/Mobius1/Selectr
- *
- * Released under the MIT license
- */.selectr-container{position:relative}.selectr-container li{list-style:none}.selectr-hidden{position:absolute;overflow:hidden;clip:rect(0,0,0,0);width:1px;height:1px;margin:-1px;padding:0;border:0 none}.selectr-visible{position:absolute;left:0;top:0;width:100%;height:100%;opacity:0;z-index:11}.selectr-desktop.multiple .selectr-visible{display:none}.selectr-desktop.multiple.native-open .selectr-visible{top:100%;min-height:200px!important;height:auto;opacity:1;display:block}.selectr-container.multiple.selectr-mobile .selectr-selected{z-index:0}.selectr-selected{position:relative;z-index:1;box-sizing:border-box;width:100%;padding:7px 28px 7px 14px;cursor:pointer;border:1px solid #999;border-radius:3px;background-color:#fff}.selectr-selected::before{position:absolute;top:50%;right:10px;width:0;height:0;content:'';-o-transform:rotate(0) translate3d(0,-50%,0);-ms-transform:rotate(0) translate3d(0,-50%,0);-moz-transform:rotate(0) translate3d(0,-50%,0);-webkit-transform:rotate(0) translate3d(0,-50%,0);transform:rotate(0) translate3d(0,-50%,0);border-width:4px 4px 0 4px;border-style:solid;border-color:#6c7a86 transparent transparent}.selectr-container.native-open .selectr-selected::before,.selectr-container.open .selectr-selected::before{border-width:0 4px 4px 4px;border-style:solid;border-color:transparent transparent #6c7a86}.selectr-label{display:none;overflow:hidden;width:100%;white-space:nowrap;text-overflow:ellipsis}.selectr-placeholder{color:#6c7a86}.selectr-tags{margin:0;padding:0;white-space:normal}.has-selected .selectr-tags{margin:0 0 -2px}.selectr-tag{list-style:none;position:relative;float:left;padding:2px 25px 2px 8px;margin:0 2px 2px 0;cursor:default;color:#fff;border:medium none;border-radius:10px;background:#acb7bf none repeat scroll 0 0}.selectr-container.multiple.has-selected .selectr-selected{padding:5px 28px 5px 5px}.selectr-options-container{position:absolute;z-index:10000;top:calc(100% - 1px);left:0;display:none;box-sizing:border-box;width:100%;border-width:0 1px 1px;border-style:solid;border-color:transparent #999 #999;border-radius:0 0 3px 3px;background-color:#fff}.selectr-container.open .selectr-options-container{display:block}.selectr-input-container{position:relative;display:none}.selectr-clear,.selectr-input-clear,.selectr-tag-remove{position:absolute;top:50%;right:22px;width:20px;height:20px;padding:0;cursor:pointer;-o-transform:translate3d(0,-50%,0);-ms-transform:translate3d(0,-50%,0);-moz-transform:translate3d(0,-50%,0);-webkit-transform:translate3d(0,-50%,0);transform:translate3d(0,-50%,0);border:medium none;background-color:transparent;z-index:11}.selectr-clear,.selectr-input-clear{display:none}.selectr-container.has-selected .selectr-clear,.selectr-input-container.active .selectr-input-clear{display:block}.selectr-selected .selectr-tag-remove{right:2px}.selectr-clear::after,.selectr-clear::before,.selectr-input-clear::after,.selectr-input-clear::before,.selectr-tag-remove::after,.selectr-tag-remove::before{position:absolute;top:5px;left:9px;width:2px;height:10px;content:' ';background-color:#6c7a86}.selectr-tag-remove::after,.selectr-tag-remove::before{top:4px;width:3px;height:12px;background-color:#fff}.selectr-clear:before,.selectr-input-clear::before,.selectr-tag-remove::before{-o-transform:rotate(45deg);-ms-transform:rotate(45deg);-moz-transform:rotate(45deg);-webkit-transform:rotate(45deg);transform:rotate(45deg)}.selectr-clear:after,.selectr-input-clear::after,.selectr-tag-remove::after{-o-transform:rotate(-45deg);-ms-transform:rotate(-45deg);-moz-transform:rotate(-45deg);-webkit-transform:rotate(-45deg);transform:rotate(-45deg)}.selectr-input-container.active,.selectr-input-container.active .selectr-clear{display:block}.selectr-input{top:5px;left:5px;box-sizing:border-box;width:calc(100% - 30px);margin:10px 15px;padding:7px 30px 7px 9px;border:1px solid #999;border-radius:3px}.selectr-notice{display:none;box-sizing:border-box;width:100%;padding:8px 16px;border-top:1px solid #999;border-radius:0 0 3px 3px;background-color:#fff}.selectr-container.notice .selectr-notice{display:block}.selectr-container.notice .selectr-selected{border-radius:3px 3px 0 0}.selectr-options{position:relative;top:calc(100% + 2px);display:none;overflow-x:auto;overflow-y:scroll;max-height:200px;margin:0;padding:0}.selectr-container.notice .selectr-options-container,.selectr-container.open .selectr-input-container,.selectr-container.open .selectr-options{display:block}.selectr-option{position:relative;display:block;padding:5px 20px;list-style:outside none none;cursor:pointer;font-weight:400}.selectr-options.optgroups>.selectr-option{padding-left:25px}.selectr-optgroup{font-weight:700;padding:0}.selectr-optgroup--label{font-weight:700;margin-top:10px;padding:5px 15px}.selectr-match{text-decoration:underline}.selectr-option.selected{background-color:#ddd}.selectr-option.active{color:#fff;background-color:#5897fb}.selectr-option.disabled{opacity:.4}.selectr-option.excluded{display:none}.selectr-container.open .selectr-selected{border-color:#999 #999 transparent #999;border-radius:3px 3px 0 0}.selectr-container.open .selectr-selected::after{-o-transform:rotate(180deg) translate3d(0,50%,0);-ms-transform:rotate(180deg) translate3d(0,50%,0);-moz-transform:rotate(180deg) translate3d(0,50%,0);-webkit-transform:rotate(180deg) translate3d(0,50%,0);transform:rotate(180deg) translate3d(0,50%,0)}.selectr-disabled{opacity:.6}.has-selected .selectr-placeholder,.selectr-empty{display:none}.has-selected .selectr-label{display:block}.taggable .selectr-selected{padding:4px 28px 4px 4px}.taggable .selectr-selected::after{display:table;content:" ";clear:both}.taggable .selectr-label{width:auto}.taggable .selectr-tags{float:left;display:block}.taggable .selectr-placeholder{display:none}.input-tag{float:left;min-width:90px;width:auto}.selectr-tag-input{border:medium none;padding:3px 10px;width:100%;font-family:inherit;font-weight:inherit;font-size:inherit}.selectr-input-container.loading::after{position:absolute;top:50%;right:20px;width:20px;height:20px;content:'';-o-transform:translate3d(0,-50%,0);-ms-transform:translate3d(0,-50%,0);-moz-transform:translate3d(0,-50%,0);-webkit-transform:translate3d(0,-50%,0);transform:translate3d(0,-50%,0);-o-transform-origin:50% 0 0;-ms-transform-origin:50% 0 0;-moz-transform-origin:50% 0 0;-webkit-transform-origin:50% 0 0;transform-origin:50% 0 0;-moz-animation:.5s linear 0s normal forwards infinite running spin;-webkit-animation:.5s linear 0s normal forwards infinite running spin;animation:.5s linear 0s normal forwards infinite running spin;border-width:3px;border-style:solid;border-color:#aaa #ddd #ddd;border-radius:50%}@-webkit-keyframes spin{0%{-webkit-transform:rotate(0) translate3d(0,-50%,0);transform:rotate(0) translate3d(0,-50%,0)}100%{-webkit-transform:rotate(360deg) translate3d(0,-50%,0);transform:rotate(360deg) translate3d(0,-50%,0)}}@keyframes spin{0%{-webkit-transform:rotate(0) translate3d(0,-50%,0);transform:rotate(0) translate3d(0,-50%,0)}100%{-webkit-transform:rotate(360deg) translate3d(0,-50%,0);transform:rotate(360deg) translate3d(0,-50%,0)}}.selectr-container.open.inverted .selectr-selected{border-color:transparent #999 #999;border-radius:0 0 3px 3px}.selectr-container.inverted .selectr-options-container{border-width:1px 1px 0;border-color:#999 #999 transparent;border-radius:3px 3px 0 0;background-color:#fff}.selectr-container.inverted .selectr-options-container{top:auto;bottom:calc(100% - 1px)}.selectr-container ::-webkit-input-placeholder{color:#6c7a86;opacity:1}.selectr-container ::-moz-placeholder{color:#6c7a86;opacity:1}.selectr-container :-ms-input-placeholder{color:#6c7a86;opacity:1}.selectr-container ::placeholder{color:#6c7a86;opacity:1}
\ No newline at end of file
diff --git a/dataforge-vis-spatial-gdml/src/jsMain/web/css/main.css b/dataforge-vis-spatial-gdml/src/jsMain/web/css/main.css
deleted file mode 100644
index b2bb1e78..00000000
--- a/dataforge-vis-spatial-gdml/src/jsMain/web/css/main.css
+++ /dev/null
@@ -1,13 +0,0 @@
-.loader {
-    border: 16px solid #f3f3f3; /* Light grey */
-    border-top: 16px solid #3498db; /* Blue */
-    border-radius: 50%;
-    width: 120px;
-    height: 120px;
-    animation: spin 2s linear infinite;
-}
-
-@keyframes spin {
-    0% { transform: rotate(0deg); }
-    100% { transform: rotate(360deg); }
-}
diff --git a/dataforge-vis-spatial-gdml/src/jvmMain/kotlin/hep/dataforge/vis/spatial/gdml/generateSchema.kt b/dataforge-vis-spatial-gdml/src/jvmMain/kotlin/hep/dataforge/vis/spatial/gdml/generateSchema.kt
new file mode 100644
index 00000000..628a8651
--- /dev/null
+++ b/dataforge-vis-spatial-gdml/src/jvmMain/kotlin/hep/dataforge/vis/spatial/gdml/generateSchema.kt
@@ -0,0 +1,169 @@
+package hep.dataforge.vis.spatial.gdml
+
+import hep.dataforge.meta.Meta
+import hep.dataforge.vis.spatial.*
+import kotlinx.serialization.*
+import kotlinx.serialization.json.*
+import kotlinx.serialization.modules.SerialModule
+import kotlinx.serialization.modules.SerialModuleCollector
+import kotlin.reflect.KClass
+
+internal val SerialDescriptor.jsonType
+    get() = when (this.kind) {
+        StructureKind.LIST -> "array"
+        PrimitiveKind.BYTE, PrimitiveKind.SHORT, PrimitiveKind.INT, PrimitiveKind.LONG,
+        PrimitiveKind.FLOAT, PrimitiveKind.DOUBLE -> "number"
+        PrimitiveKind.STRING, PrimitiveKind.CHAR, UnionKind.ENUM_KIND -> "string"
+        PrimitiveKind.BOOLEAN -> "boolean"
+        else -> "object"
+    }
+
+
+private fun SerialModule.enumerate(type: KClass<*>): Sequence<SerialDescriptor> {
+    val list = ArrayList<SerialDescriptor>()
+    fun send(descriptor: SerialDescriptor) = list.add(descriptor)
+
+    val enumerator = object : SerialModuleCollector {
+        override fun <T : Any> contextual(kClass: KClass<T>, serializer: KSerializer<T>) {
+            if (kClass == type) {
+                send(serializer.descriptor)
+            }
+        }
+
+        override fun <Base : Any, Sub : Base> polymorphic(
+            baseClass: KClass<Base>,
+            actualClass: KClass<Sub>,
+            actualSerializer: KSerializer<Sub>
+        ) {
+            if (baseClass == type) {
+                send(actualSerializer.descriptor)
+            }
+        }
+
+    }
+    dumpTo(enumerator)
+    return list.asSequence()
+}
+
+/**
+ * Creates an [JsonObject] which contains Json Schema of given [descriptor].
+ *
+ * Schema can contain following fields:
+ * `description`, `type` for all descriptors;
+ * `properties` and `required` for objects;
+ * `enum` for enums;
+ * `items` for arrays.
+ *
+ * User can modify this schema to add additional validation keywords
+ * (as per [https://json-schema.org/latest/json-schema-validation.html])
+ * if they want.
+ */
+private fun jsonSchema(descriptor: SerialDescriptor, context: SerialModule): JsonObject {
+
+    if (descriptor.name in arrayOf(
+            "hep.dataforge.vis.spatial.Point3D",
+            "hep.dataforge.vis.spatial.Point2D",
+            Meta::class.qualifiedName
+        )
+    ) return json {
+        "\$ref" to "#/definitions/${descriptor.name}"
+    }
+
+
+    val properties: MutableMap<String, JsonObject> = mutableMapOf()
+    val requiredProperties: MutableSet<String> = mutableSetOf()
+    val isEnum = descriptor.kind == UnionKind.ENUM_KIND
+    val isPolymorphic = descriptor.kind is PolymorphicKind
+
+
+    if (!isEnum && !isPolymorphic) descriptor.elementDescriptors().forEachIndexed { index, child ->
+        val elementName = descriptor.getElementName(index)
+
+        properties[elementName] = when (elementName) {
+            "templates" ->  json {
+                "\$ref" to "#/definitions/hep.dataforge.vis.spatial.VisualGroup3D"
+            }
+            "properties" ->  json {
+                "\$ref" to "#/definitions/${Meta::class.qualifiedName}"
+            }
+            "first", "second" -> json{
+                "\$ref" to "#/definitions/children"
+            }
+            "styleSheet" -> json {
+                "type" to "object"
+                "additionalProperties" to json {
+                    "\$ref" to "#/definitions/${Meta::class.qualifiedName}"
+                }
+            }
+            in arrayOf("children") ->  json {
+                "type" to "object"
+                "additionalProperties" to json {
+                    "\$ref" to "#/definitions/children"
+                }
+            }
+            else -> jsonSchema(child, context)
+        }
+
+        if (!descriptor.isElementOptional(index)) requiredProperties.add(elementName)
+    }
+
+    val jsonType = descriptor.jsonType
+    val objectData: MutableMap<String, JsonElement> = mutableMapOf(
+        "description" to JsonLiteral(descriptor.name),
+        "type" to JsonLiteral(jsonType)
+    )
+    if (isEnum) {
+        val allElementNames = (0 until descriptor.elementsCount).map(descriptor::getElementName)
+        objectData += "enum" to JsonArray(allElementNames.map(::JsonLiteral))
+    }
+    when (jsonType) {
+        "object" -> {
+            objectData["properties"] = JsonObject(properties)
+            val required = requiredProperties.map { JsonLiteral(it) }
+            if (required.isNotEmpty()) {
+                objectData["required"] = JsonArray(required)
+            }
+        }
+        "array" -> objectData["items"] = properties.values.let {
+            check(it.size == 1) { "Array descriptor has returned inconsistent number of elements: expected 1, found ${it.size}" }
+            it.first()
+        }
+        else -> { /* no-op */
+        }
+    }
+    return JsonObject(objectData)
+}
+
+fun main() {
+    val context = Visual3DPlugin.serialModule
+    val definitions = json {
+        "children" to json {
+            "anyOf" to jsonArray {
+                context.enumerate(VisualObject3D::class).forEach {
+                    if (it.name == "hep.dataforge.vis.spatial.VisualGroup3D") {
+                        +json {
+                            "\$ref" to "#/definitions/${it.name}"
+                        }
+                    } else {
+                        +jsonSchema(it, context)
+                    }
+                }
+            }
+        }
+        "hep.dataforge.vis.spatial.Point3D" to jsonSchema(Point3DSerializer.descriptor, context)
+        "hep.dataforge.vis.spatial.Point2D" to jsonSchema(Point2DSerializer.descriptor, context)
+        "hep.dataforge.vis.spatial.VisualGroup3D" to jsonSchema(VisualGroup3D.serializer().descriptor, context)
+
+    }
+
+    println(
+        Json.indented.stringify(
+            JsonObjectSerializer,
+            json {
+                "definitions" to definitions
+                "\$ref" to "#/definitions/hep.dataforge.vis.spatial.VisualGroup3D"
+            }
+        )
+    )
+}
+
diff --git a/dataforge-vis-spatial-gdml/src/jvmMain/kotlin/hep/dataforge/vis/spatial/gdml/testCoil.kt b/dataforge-vis-spatial-gdml/src/jvmMain/kotlin/hep/dataforge/vis/spatial/gdml/testCoil.kt
deleted file mode 100644
index 567f0e7c..00000000
--- a/dataforge-vis-spatial-gdml/src/jvmMain/kotlin/hep/dataforge/vis/spatial/gdml/testCoil.kt
+++ /dev/null
@@ -1,26 +0,0 @@
-package hep.dataforge.vis.spatial.gdml
-
-import hep.dataforge.vis.spatial.Visual3DPlugin
-import hep.dataforge.vis.spatial.VisualGroup3D
-import nl.adaptivity.xmlutil.StAXReader
-import scientifik.gdml.GDML
-import java.io.File
-
-
-fun main() {
-    val file = File("D:\\Work\\Projects\\gdml.kt\\gdml-source\\BM@N_coil.gdml")
-
-    val xmlReader = StAXReader(file.inputStream(), "UTF-8")
-    val xml = GDML.format.parse(GDML.serializer(), xmlReader)
-    val visual = xml.toVisual {
-        lUnit = LUnit.CM
-    }
-
-    //val meta = visual.toMeta()
-
-    val str = Visual3DPlugin.json.stringify(VisualGroup3D.serializer(), visual)
-
-    println(str)
-
-    //println(Json.indented.stringify(meta.toJson()))
-}
\ No newline at end of file
diff --git a/dataforge-vis-spatial-gdml/src/jvmMain/kotlin/hep/dataforge/vis/spatial/gdml/testCubes.kt b/dataforge-vis-spatial-gdml/src/jvmMain/kotlin/hep/dataforge/vis/spatial/gdml/testCubes.kt
deleted file mode 100644
index b0ff5b38..00000000
--- a/dataforge-vis-spatial-gdml/src/jvmMain/kotlin/hep/dataforge/vis/spatial/gdml/testCubes.kt
+++ /dev/null
@@ -1,40 +0,0 @@
-package hep.dataforge.vis.spatial.gdml
-
-import hep.dataforge.vis.spatial.Material3D
-import hep.dataforge.vis.spatial.Visual3DPlugin
-import hep.dataforge.vis.spatial.VisualGroup3D
-import hep.dataforge.vis.spatial.VisualObject3D
-import hep.dataforge.vis.spatial.transform.RemoveSingleChild
-import hep.dataforge.vis.spatial.transform.UnRef
-import nl.adaptivity.xmlutil.StAXReader
-import scientifik.gdml.GDML
-import java.io.File
-
-fun main() {
-    val file = File("D:\\Work\\Projects\\gdml.kt\\gdml-source\\cubes.gdml")
-
-    val xmlReader = StAXReader(file.inputStream(), "UTF-8")
-    val xml = GDML.format.parse(GDML.serializer(), xmlReader)
-    val visual = xml.toVisual {
-        lUnit = LUnit.CM
-
-        solidConfiguration = { parent, solid ->
-            if (parent.physVolumes.isNotEmpty()) {
-                useStyle("opaque") {
-                    Material3D.OPACITY_KEY to 0.3
-                    VisualObject3D.LAYER_KEY to 2
-                }
-            }
-        }
-    }
-
-    (visual as? VisualGroup3D)?.let { UnRef(it) }?.let { RemoveSingleChild(it) }
-
-    val string = Visual3DPlugin.json.stringify(VisualGroup3D.serializer(), visual)
-
-    val tmpFile = File.createTempFile("dataforge-visual", ".json")
-
-    tmpFile.writeText(string)
-
-    println(tmpFile.canonicalPath)
-}
\ No newline at end of file
diff --git a/dataforge-vis-spatial-gdml/src/jvmMain/kotlin/hep/dataforge/vis/spatial/gdml/testMain.kt b/dataforge-vis-spatial-gdml/src/jvmMain/kotlin/hep/dataforge/vis/spatial/gdml/testMain.kt
deleted file mode 100644
index 7ef8a918..00000000
--- a/dataforge-vis-spatial-gdml/src/jvmMain/kotlin/hep/dataforge/vis/spatial/gdml/testMain.kt
+++ /dev/null
@@ -1,62 +0,0 @@
-package hep.dataforge.vis.spatial.gdml
-
-import hep.dataforge.vis.spatial.Material3D
-import hep.dataforge.vis.spatial.Visual3DPlugin
-import hep.dataforge.vis.spatial.VisualGroup3D
-import hep.dataforge.vis.spatial.opacity
-import hep.dataforge.vis.spatial.transform.RemoveSingleChild
-import hep.dataforge.vis.spatial.transform.UnRef
-import nl.adaptivity.xmlutil.StAXReader
-import scientifik.gdml.GDML
-import java.io.File
-
-fun main() {
-    val file = File("D:\\Work\\Projects\\gdml.kt\\gdml-source\\BM@N.gdml")
-
-    val xmlReader = StAXReader(file.inputStream(), "UTF-8")
-    val xml = GDML.format.parse(GDML.serializer(), xmlReader)
-    val visual = xml.toVisual {
-        lUnit = LUnit.CM
-
-        volumeAction = { volume ->
-            when {
-                volume.name.startsWith("ecal01lay") -> GDMLTransformer.Action.REJECT
-                else -> GDMLTransformer.Action.CACHE
-            }
-        }
-
-        solidConfiguration = { parent, solid ->
-            if (parent.physVolumes.isNotEmpty()
-                || solid.name.startsWith("Coil")
-                || solid.name.startsWith("Yoke")
-                || solid.name.startsWith("Magnet")
-                || solid.name.startsWith("Pole")
-            ) {
-                useStyle("opaque") {
-                    Material3D.OPACITY_KEY to 0.3
-                }
-            }
-        }
-    }
-
-  //  (visual as? VisualGroup3D)?.let { UnRef(it) }?.let { RemoveSingleChild(it) }
-
-    val string = Visual3DPlugin.json.stringify(VisualGroup3D.serializer(), visual)
-
-    val tmpFile = File.createTempFile("dataforge-visual", ".json")
-
-    tmpFile.writeText(string)
-
-    println(tmpFile.canonicalPath)
-
-//    val template = visual.getTemplate("volumes.ecal01mod".toName())
-//    println(template)
-//    visual.flatMap { (it as? VisualGroup3D) ?: listOf(it) }.forEach {
-//        if(it.parent==null) error("")
-//    }
-    //readLine()
-    //val meta = visual.toMeta()
-//    val tmpFile = File.createTempFile("dataforge-visual", "json")
-    //tmpFile.writeText(meta.toString())
-    //println(tmpFile.absoluteFile)
-}
\ No newline at end of file
diff --git a/dataforge-vis-spatial-gdml/src/jvmMain/kotlin/hep/dataforge/vis/spatial/gdml/visualGDMLJvm.kt b/dataforge-vis-spatial-gdml/src/jvmMain/kotlin/hep/dataforge/vis/spatial/gdml/visualGDMLJvm.kt
new file mode 100644
index 00000000..ae1904f5
--- /dev/null
+++ b/dataforge-vis-spatial-gdml/src/jvmMain/kotlin/hep/dataforge/vis/spatial/gdml/visualGDMLJvm.kt
@@ -0,0 +1,18 @@
+package hep.dataforge.vis.spatial.gdml
+
+import hep.dataforge.vis.spatial.VisualGroup3D
+import nl.adaptivity.xmlutil.StAXReader
+import scientifik.gdml.GDML
+import java.nio.file.Files
+import java.nio.file.Path
+
+fun GDML.Companion.readFile(file: Path): GDML {
+    val xmlReader = StAXReader(Files.newInputStream(file), "UTF-8")
+    return GDML.format.parse(GDML.serializer(), xmlReader)
+}
+
+fun VisualGroup3D.gdml(file: Path, key: String = "", transformer: GDMLTransformer.() -> Unit = {}) {
+    val gdml = GDML.readFile(file)
+    gdml(gdml, key, transformer)
+}
+
diff --git a/dataforge-vis-spatial/build.gradle.kts b/dataforge-vis-spatial/build.gradle.kts
index 41672aee..2fe2ac14 100644
--- a/dataforge-vis-spatial/build.gradle.kts
+++ b/dataforge-vis-spatial/build.gradle.kts
@@ -1,13 +1,12 @@
 import org.openjfx.gradle.JavaFXOptions
+import scientifik.useSerialization
 
 plugins {
     id("scientifik.mpp")
     id("org.openjfx.javafxplugin")
 }
 
-scientifik {
-    withSerialization()
-}
+useSerialization()
 
 kotlin {
     jvm {
@@ -21,13 +20,18 @@ kotlin {
         }
         jvmMain {
             dependencies {
-                implementation(project(":dataforge-vis-fx"))
-                implementation("org.fxyz3d:fxyz3d:0.5.2")
+                implementation("org.fxyz3d:fxyz3d:0.5.2") {
+                    exclude(module = "slf4j-simple")
+                }
+                api("org.jetbrains.kotlinx:kotlinx-coroutines-javafx:${Scientifik.coroutinesVersion}")
+                implementation("eu.mihosoft.vrl.jcsg:jcsg:0.5.7") {
+                    exclude(module = "slf4j-simple")
+                }
             }
         }
         jsMain {
             dependencies {
-                api(project(":wrappers"))
+//                api(project(":wrappers"))
                 implementation(npm("three", "0.106.2"))
                 implementation(npm("@hi-level/three-csg", "1.0.6"))
             }
diff --git a/dataforge-vis-spatial/src/commonMain/kotlin/hep/dataforge/vis/spatial/Box.kt b/dataforge-vis-spatial/src/commonMain/kotlin/hep/dataforge/vis/spatial/Box.kt
index 4d0f05be..fd6358a2 100644
--- a/dataforge-vis-spatial/src/commonMain/kotlin/hep/dataforge/vis/spatial/Box.kt
+++ b/dataforge-vis-spatial/src/commonMain/kotlin/hep/dataforge/vis/spatial/Box.kt
@@ -2,16 +2,21 @@
 package hep.dataforge.vis.spatial
 
 import hep.dataforge.context.Context
-import hep.dataforge.io.ConfigSerializer
-import hep.dataforge.meta.*
+import hep.dataforge.io.serialization.ConfigSerializer
+import hep.dataforge.meta.Config
+import hep.dataforge.meta.Meta
+import hep.dataforge.meta.float
+import hep.dataforge.meta.get
 import hep.dataforge.vis.common.AbstractVisualObject
 import hep.dataforge.vis.common.VisualFactory
 import hep.dataforge.vis.common.VisualObject
+import kotlinx.serialization.SerialName
 import kotlinx.serialization.Serializable
 import kotlinx.serialization.UseSerializers
 import kotlin.reflect.KClass
 
 @Serializable
+@SerialName("3d.box")
 class Box(
     val xSize: Float,
     val ySize: Float,
@@ -27,9 +32,9 @@ class Box(
 
     //TODO add helper for color configuration
     override fun <T : Any> toGeometry(geometryBuilder: GeometryBuilder<T>) {
-        val dx = xSize.toFloat() / 2
-        val dy = ySize.toFloat() / 2
-        val dz = zSize.toFloat() / 2
+        val dx = xSize / 2
+        val dy = ySize / 2
+        val dz = zSize / 2
         val node1 = Point3D(-dx, -dy, -dz)
         val node2 = Point3D(dx, -dy, -dz)
         val node3 = Point3D(dx, dy, -dz)
@@ -46,17 +51,6 @@ class Box(
         geometryBuilder.face4(node8, node5, node6, node7)
     }
 
-    override fun MetaBuilder.updateMeta() {
-        "xSize" to xSize
-        "ySize" to ySize
-        "zSize" to ySize
-        updatePosition()
-    }
-
-//    override fun toMeta(): Meta {
-//        return (Visual3DPlugin.json.toJson(Box.serializer(), this) as JsonObject).toMeta()
-//    }
-
     companion object : VisualFactory<Box> {
         const val TYPE = "geometry.3d.box"
 
diff --git a/dataforge-vis-spatial/src/commonMain/kotlin/hep/dataforge/vis/spatial/Composite.kt b/dataforge-vis-spatial/src/commonMain/kotlin/hep/dataforge/vis/spatial/Composite.kt
index 31f6f915..ed6f087b 100644
--- a/dataforge-vis-spatial/src/commonMain/kotlin/hep/dataforge/vis/spatial/Composite.kt
+++ b/dataforge-vis-spatial/src/commonMain/kotlin/hep/dataforge/vis/spatial/Composite.kt
@@ -1,9 +1,9 @@
 @file:UseSerializers(Point3DSerializer::class)
+
 package hep.dataforge.vis.spatial
 
-import hep.dataforge.io.ConfigSerializer
+import hep.dataforge.io.serialization.ConfigSerializer
 import hep.dataforge.meta.Config
-import hep.dataforge.meta.MetaBuilder
 import hep.dataforge.meta.update
 import hep.dataforge.vis.common.AbstractVisualObject
 import kotlinx.serialization.Serializable
@@ -33,13 +33,6 @@ class Composite(
 
     @Serializable(ConfigSerializer::class)
     override var properties: Config? = null
-
-    override fun MetaBuilder.updateMeta() {
-        "compositeType" to compositeType
-        "first" to first.toMeta()
-        "second" to second.toMeta()
-        updatePosition()
-    }
 }
 
 inline fun VisualGroup3D.composite(
@@ -51,13 +44,18 @@ inline fun VisualGroup3D.composite(
     val children = group.filterIsInstance<VisualObject3D>()
     if (children.size != 2) error("Composite requires exactly two children")
     return Composite(type, children[0], children[1]).also {
-        if (group.properties != null) {
-            it.config.update(group.config)
-            it.material = group.material
+        it.config.update(group.config)
+        //it.material = group.material
+
+        if(group.position!=null) {
+            it.position = group.position
+        }
+        if(group.rotation!=null) {
+            it.rotation = group.rotation
+        }
+        if(group.scale!=null) {
+            it.scale = group.scale
         }
-        it.position = group.position
-        it.rotation = group.rotation
-        it.scale = group.scale
         set(name, it)
     }
 }
diff --git a/dataforge-vis-spatial/src/commonMain/kotlin/hep/dataforge/vis/spatial/ConeSegment.kt b/dataforge-vis-spatial/src/commonMain/kotlin/hep/dataforge/vis/spatial/ConeSegment.kt
index 26d4942f..9aa090ef 100644
--- a/dataforge-vis-spatial/src/commonMain/kotlin/hep/dataforge/vis/spatial/ConeSegment.kt
+++ b/dataforge-vis-spatial/src/commonMain/kotlin/hep/dataforge/vis/spatial/ConeSegment.kt
@@ -2,11 +2,13 @@
 
 package hep.dataforge.vis.spatial
 
-import hep.dataforge.io.ConfigSerializer
+import hep.dataforge.io.serialization.ConfigSerializer
 import hep.dataforge.meta.Config
 import hep.dataforge.vis.common.AbstractVisualObject
 import kotlinx.serialization.Serializable
 import kotlinx.serialization.UseSerializers
+import kotlin.math.cos
+import kotlin.math.sin
 
 /**
  * A cylinder or cut cone segment
@@ -18,7 +20,7 @@ class ConeSegment(
     var upperRadius: Float,
     var startAngle: Float = 0f,
     var angle: Float = PI2
-) : AbstractVisualObject(), VisualObject3D {
+) : AbstractVisualObject(), VisualObject3D, Shape {
 
     @Serializable(ConfigSerializer::class)
     override var properties: Config? = null
@@ -26,6 +28,49 @@ class ConeSegment(
     override var position: Point3D? = null
     override var rotation: Point3D? = null
     override var scale: Point3D? = null
+
+    override fun <T : Any> toGeometry(geometryBuilder: GeometryBuilder<T>) {
+        val segments = detail ?: 8
+        require(segments >= 4) { "The number of segments in cone segment is too small" }
+        val angleStep = angle / (segments - 1)
+
+        fun shape(r: Float, z: Float): List<Point3D> {
+            return (0 until segments).map { i ->
+                Point3D(r * cos(startAngle + angleStep * i), r * sin(startAngle + angleStep * i), z)
+            }
+        }
+
+        geometryBuilder.apply {
+
+            //creating shape in x-y plane with z = 0
+            val bottomOuterPoints = shape(upperRadius, -height / 2)
+            val upperOuterPoints = shape(radius, height / 2)
+            //outer face
+            (1 until segments).forEach {
+                face4(bottomOuterPoints[it - 1], bottomOuterPoints[it], upperOuterPoints[it], upperOuterPoints[it - 1])
+            }
+
+            if (angle == PI2) {
+                face4(bottomOuterPoints.last(), bottomOuterPoints[0], upperOuterPoints[0], upperOuterPoints.last())
+            }
+
+            val zeroBottom = Point3D(0f, 0f, 0f)
+            val zeroTop = Point3D(0f, 0f, height)
+            (1 until segments).forEach {
+                face(bottomOuterPoints[it - 1], zeroBottom, bottomOuterPoints[it])
+                face(upperOuterPoints[it - 1], upperOuterPoints[it], zeroTop)
+            }
+            if (angle == PI2) {
+                face(bottomOuterPoints.last(), zeroBottom, bottomOuterPoints[0])
+                face(upperOuterPoints.last(), upperOuterPoints[0], zeroTop)
+            } else {
+                face4(zeroTop, zeroBottom, bottomOuterPoints[0], upperOuterPoints[0])
+                face4(zeroTop, zeroBottom, bottomOuterPoints.last(), upperOuterPoints.last())
+            }
+
+        }
+    }
+
 }
 
 inline fun VisualGroup3D.cylinder(
diff --git a/dataforge-vis-spatial/src/commonMain/kotlin/hep/dataforge/vis/spatial/Convex.kt b/dataforge-vis-spatial/src/commonMain/kotlin/hep/dataforge/vis/spatial/Convex.kt
index 56062ca8..1ca46886 100644
--- a/dataforge-vis-spatial/src/commonMain/kotlin/hep/dataforge/vis/spatial/Convex.kt
+++ b/dataforge-vis-spatial/src/commonMain/kotlin/hep/dataforge/vis/spatial/Convex.kt
@@ -2,9 +2,8 @@
 
 package hep.dataforge.vis.spatial
 
-import hep.dataforge.io.ConfigSerializer
+import hep.dataforge.io.serialization.ConfigSerializer
 import hep.dataforge.meta.Config
-import hep.dataforge.meta.MetaBuilder
 import hep.dataforge.vis.common.AbstractVisualObject
 import kotlinx.serialization.Serializable
 import kotlinx.serialization.UseSerializers
@@ -19,13 +18,6 @@ class Convex(val points: List<Point3D>) : AbstractVisualObject(), VisualObject3D
     override var rotation: Point3D? = null
     override var scale: Point3D? = null
 
-    override fun MetaBuilder.updateMeta() {
-        "points" to {
-            "point" to points.map { it.toMeta() }
-        }
-        updatePosition()
-    }
-
     companion object {
         const val TYPE = "geometry.3d.convex"
     }
diff --git a/dataforge-vis-spatial/src/commonMain/kotlin/hep/dataforge/vis/spatial/Extruded.kt b/dataforge-vis-spatial/src/commonMain/kotlin/hep/dataforge/vis/spatial/Extruded.kt
index 6ae1f917..18dac3d0 100644
--- a/dataforge-vis-spatial/src/commonMain/kotlin/hep/dataforge/vis/spatial/Extruded.kt
+++ b/dataforge-vis-spatial/src/commonMain/kotlin/hep/dataforge/vis/spatial/Extruded.kt
@@ -1,7 +1,7 @@
 @file:UseSerializers(Point2DSerializer::class, Point3DSerializer::class)
 package hep.dataforge.vis.spatial
 
-import hep.dataforge.io.ConfigSerializer
+import hep.dataforge.io.serialization.ConfigSerializer
 import hep.dataforge.meta.Config
 import hep.dataforge.vis.common.AbstractVisualObject
 import kotlinx.serialization.Serializable
diff --git a/dataforge-vis-spatial/src/commonMain/kotlin/hep/dataforge/vis/spatial/Label3D.kt b/dataforge-vis-spatial/src/commonMain/kotlin/hep/dataforge/vis/spatial/Label3D.kt
new file mode 100644
index 00000000..01ff005e
--- /dev/null
+++ b/dataforge-vis-spatial/src/commonMain/kotlin/hep/dataforge/vis/spatial/Label3D.kt
@@ -0,0 +1,30 @@
+@file:UseSerializers(Point3DSerializer::class)
+
+package hep.dataforge.vis.spatial
+
+import hep.dataforge.io.serialization.ConfigSerializer
+import hep.dataforge.meta.Config
+import hep.dataforge.vis.common.AbstractVisualObject
+import kotlinx.serialization.Serializable
+import kotlinx.serialization.UseSerializers
+
+@Serializable
+class Label3D(var text: String, var fontSize: Double, var fontFamily: String) : AbstractVisualObject(),
+    VisualObject3D {
+    @Serializable(ConfigSerializer::class)
+    override var properties: Config? = null
+
+    override var position: Point3D? = null
+    override var rotation: Point3D? = null
+    override var scale: Point3D? = null
+
+}
+
+fun VisualGroup3D.label(
+    text: String,
+    fontSize: Number = 20,
+    fontFamily: String = "Arial",
+    name: String = "",
+    action: Label3D.() -> Unit = {}
+) =
+    Label3D(text, fontSize.toDouble(), fontFamily).apply(action).also { set(name, it) }
\ No newline at end of file
diff --git a/dataforge-vis-spatial/src/commonMain/kotlin/hep/dataforge/vis/spatial/Material3D.kt b/dataforge-vis-spatial/src/commonMain/kotlin/hep/dataforge/vis/spatial/Material3D.kt
index aea1ed4c..342016cb 100644
--- a/dataforge-vis-spatial/src/commonMain/kotlin/hep/dataforge/vis/spatial/Material3D.kt
+++ b/dataforge-vis-spatial/src/commonMain/kotlin/hep/dataforge/vis/spatial/Material3D.kt
@@ -1,56 +1,96 @@
 package hep.dataforge.vis.spatial
 
+import hep.dataforge.descriptors.NodeDescriptor
 import hep.dataforge.meta.*
 import hep.dataforge.names.asName
 import hep.dataforge.names.plus
+import hep.dataforge.values.ValueType
 import hep.dataforge.vis.common.Colors
-import hep.dataforge.vis.common.VisualObject
-import hep.dataforge.vis.spatial.Material3D.Companion.COLOR_KEY
-import hep.dataforge.vis.spatial.Material3D.Companion.MATERIAL_KEY
-import hep.dataforge.vis.spatial.Material3D.Companion.OPACITY_KEY
+import hep.dataforge.vis.spatial.Material3D.Companion.MATERIAL_COLOR_KEY
+import hep.dataforge.vis.spatial.Material3D.Companion.MATERIAL_OPACITY_KEY
 
 class Material3D(override val config: Config) : Specific {
 
-    val color by string()
+    var color by string(key = COLOR_KEY)
 
-    val opacity by float(1f)
+    var specularColor by string()
+
+    var opacity by float(1f, key = OPACITY_KEY)
+
+    var wireframe by boolean(false, WIREFRAME_KEY)
 
     companion object : Specification<Material3D> {
         override fun wrap(config: Config): Material3D = Material3D(config)
 
         val MATERIAL_KEY = "material".asName()
-        val COLOR_KEY = MATERIAL_KEY + "color"
-        val OPACITY_KEY = MATERIAL_KEY + "opacity"
+        internal val COLOR_KEY = "color".asName()
+        val MATERIAL_COLOR_KEY = MATERIAL_KEY + COLOR_KEY
+        val SPECULAR_COLOR = "specularColor".asName()
+        internal val OPACITY_KEY = "opacity".asName()
+        val MATERIAL_OPACITY_KEY = MATERIAL_KEY + OPACITY_KEY
+        internal val WIREFRAME_KEY = "wireframe".asName()
+        val MATERIAL_WIREFRAME_KEY = MATERIAL_KEY + WIREFRAME_KEY
 
-    }
-}
-
-fun VisualObject.color(rgb: String) {
-    setProperty(COLOR_KEY, rgb)
-}
-
-fun VisualObject.color(rgb: Int) = color(Colors.rgbToString(rgb))
-
-fun VisualObject.color(r: UByte, g: UByte, b: UByte) = color( Colors.rgbToString(r,g,b))
-
-var VisualObject.color: String?
-    get() = getProperty(COLOR_KEY).string
-    set(value) {
-        if (value != null) {
-            color(value)
+        val descriptor = NodeDescriptor {
+            value(VisualObject3D.VISIBLE_KEY) {
+                type(ValueType.BOOLEAN)
+                default(true)
+            }
+            node(MATERIAL_KEY) {
+                value(COLOR_KEY) {
+                    type(ValueType.STRING, ValueType.NUMBER)
+                    default("#ffffff")
+                }
+                value(OPACITY_KEY) {
+                    type(ValueType.NUMBER)
+                    default(1.0)
+                }
+                value(WIREFRAME_KEY) {
+                    type(ValueType.BOOLEAN)
+                    default(false)
+                }
+            }
         }
     }
-
-var VisualObject.material: Material3D?
-    get() = getProperty(MATERIAL_KEY).node?.let { Material3D.wrap(it) }
-    set(value) = setProperty(MATERIAL_KEY, value?.config)
-
-fun VisualObject.material(builder: Material3D.() -> Unit) {
-    material = Material3D.build(builder)
 }
 
-var VisualObject.opacity: Double?
-    get() = getProperty(OPACITY_KEY).double
+fun VisualObject3D.color(rgb: String) {
+    setProperty(MATERIAL_COLOR_KEY, rgb)
+}
+
+fun VisualObject3D.color(rgb: Int) {
+    setProperty(MATERIAL_COLOR_KEY, rgb)
+}
+
+fun VisualObject3D.color(r: UByte, g: UByte, b: UByte) = setProperty(
+    MATERIAL_COLOR_KEY,
+    Colors.rgbToMeta(r, g, b)
+)
+
+/**
+ * Web colors representation of the color in `#rrggbb` format or HTML name
+ */
+var VisualObject3D.color: String?
+    get() = getProperty(MATERIAL_COLOR_KEY)?.let { Colors.fromMeta(it) }
     set(value) {
-        setProperty(OPACITY_KEY, value)
+        setProperty(MATERIAL_COLOR_KEY, value)
+    }
+
+//var VisualObject3D.material: Material3D?
+//    get() = getProperty(MATERIAL_KEY).node?.let { Material3D.wrap(it) }
+//    set(value) = setProperty(MATERIAL_KEY, value?.config)
+
+fun VisualObject3D.material(builder: Material3D.() -> Unit) {
+    val node = config[Material3D.MATERIAL_KEY].node
+    if (node != null) {
+        Material3D.update(node, builder)
+    } else {
+        config[Material3D.MATERIAL_KEY] = Material3D(builder)
+    }
+}
+
+var VisualObject3D.opacity: Double?
+    get() = getProperty(MATERIAL_OPACITY_KEY).double
+    set(value) {
+        setProperty(MATERIAL_OPACITY_KEY, value)
     }
\ No newline at end of file
diff --git a/dataforge-vis-spatial/src/commonMain/kotlin/hep/dataforge/vis/spatial/PolyLine.kt b/dataforge-vis-spatial/src/commonMain/kotlin/hep/dataforge/vis/spatial/PolyLine.kt
index eb8b4699..75d00ab4 100644
--- a/dataforge-vis-spatial/src/commonMain/kotlin/hep/dataforge/vis/spatial/PolyLine.kt
+++ b/dataforge-vis-spatial/src/commonMain/kotlin/hep/dataforge/vis/spatial/PolyLine.kt
@@ -2,7 +2,7 @@
 
 package hep.dataforge.vis.spatial
 
-import hep.dataforge.io.ConfigSerializer
+import hep.dataforge.io.serialization.ConfigSerializer
 import hep.dataforge.meta.Config
 import hep.dataforge.vis.common.AbstractVisualObject
 import hep.dataforge.vis.common.number
@@ -20,6 +20,7 @@ class PolyLine(var points: List<Point3D>) : AbstractVisualObject(), VisualObject
 
     //var lineType by string()
     var thickness by number(1.0, key = "material.thickness")
+
 }
 
 fun VisualGroup3D.polyline(vararg points: Point3D, name: String = "", action: PolyLine.() -> Unit = {}) =
diff --git a/dataforge-vis-spatial/src/commonMain/kotlin/hep/dataforge/vis/spatial/Proxy.kt b/dataforge-vis-spatial/src/commonMain/kotlin/hep/dataforge/vis/spatial/Proxy.kt
index e4125590..62d7b5c0 100644
--- a/dataforge-vis-spatial/src/commonMain/kotlin/hep/dataforge/vis/spatial/Proxy.kt
+++ b/dataforge-vis-spatial/src/commonMain/kotlin/hep/dataforge/vis/spatial/Proxy.kt
@@ -2,18 +2,20 @@
 
 package hep.dataforge.vis.spatial
 
-import hep.dataforge.io.ConfigSerializer
-import hep.dataforge.io.NameSerializer
-import hep.dataforge.meta.*
+import hep.dataforge.io.serialization.ConfigSerializer
+import hep.dataforge.io.serialization.NameSerializer
+import hep.dataforge.meta.Config
+import hep.dataforge.meta.Laminate
+import hep.dataforge.meta.MetaItem
+import hep.dataforge.meta.get
 import hep.dataforge.names.Name
 import hep.dataforge.names.NameToken
 import hep.dataforge.names.asName
 import hep.dataforge.names.plus
-import hep.dataforge.vis.common.AbstractVisualObject
-import hep.dataforge.vis.common.MutableVisualGroup
-import hep.dataforge.vis.common.VisualGroup
-import hep.dataforge.vis.common.VisualObject
+import hep.dataforge.vis.common.*
+import kotlinx.serialization.SerialName
 import kotlinx.serialization.Serializable
+import kotlinx.serialization.Transient
 import kotlinx.serialization.UseSerializers
 import kotlin.collections.component1
 import kotlin.collections.component2
@@ -23,6 +25,7 @@ import kotlin.collections.set
  * A proxy [VisualObject3D] to reuse a template object
  */
 @Serializable
+@SerialName("3d.proxy")
 class Proxy(val templateName: Name) : AbstractVisualObject(), VisualGroup, VisualObject3D {
 
     override var position: Point3D? = null
@@ -36,22 +39,18 @@ class Proxy(val templateName: Name) : AbstractVisualObject(), VisualGroup, Visua
      * Recursively search for defined template in the parent
      */
     val prototype: VisualObject3D
-        get() = (parent as? VisualGroup3D)?.getTemplate(templateName)
+        get() = (parent as? VisualGroup3D)?.getPrototype(templateName)
             ?: error("Template with name $templateName not found in $parent")
 
-    override fun getStyle(name: Name): Meta? = (parent as VisualGroup?)?.getStyle(name)
-
-    override fun addStyle(name: Name, meta: Meta, apply: Boolean) {
-        (parent as VisualGroup?)?.addStyle(name, meta, apply)
-        //do nothing
-    }
+    override val styleSheet: StyleSheet
+        get() = (parent as? VisualGroup)?.styleSheet ?: StyleSheet(this)
 
     override fun getProperty(name: Name, inherit: Boolean): MetaItem<*>? {
         return if (inherit) {
             properties?.get(name)
                 ?: mergedStyles[name]
-                ?: prototype.getProperty(name, false)
-                ?: parent?.getProperty(name, inherit)
+                ?: prototype.getProperty(name)
+                ?: parent?.getProperty(name)
         } else {
             properties?.get(name)
                 ?: mergedStyles[name]
@@ -59,41 +58,35 @@ class Proxy(val templateName: Name) : AbstractVisualObject(), VisualGroup, Visua
         }
     }
 
-    override fun MetaBuilder.updateMeta() {
-        //TODO add reference to child
-        updatePosition()
-    }
-
     override val children: Map<NameToken, ProxyChild>
-        get() = (prototype as? MutableVisualGroup)?.children?.mapValues {
-            ProxyChild(it.key.asName())
-        } ?: emptyMap()
+        get() = (prototype as? MutableVisualGroup)?.children
+            ?.filter { !it.key.toString().startsWith("@") }
+            ?.mapValues {
+                ProxyChild(it.key.asName())
+            } ?: emptyMap()
 
+    @Transient
     private val propertyCache: HashMap<Name, Config> = HashMap()
 
     fun childPropertyName(childName: Name, propertyName: Name): Name {
         return NameToken(PROXY_CHILD_PROPERTY_PREFIX, childName.toString()) + propertyName
     }
 
-    private fun prototypeFor(name: Name): VisualObject =
-        (prototype as? VisualGroup)?.get(name)
-            ?: error("Prototype with name $name not found in ${this@Proxy}")
+    private fun prototypeFor(name: Name): VisualObject {
+        return (prototype as? VisualGroup)?.get(name)
+            ?: error("Prototype with name $name not found in $this")
+    }
 
-
-    override var styles: List<Name>
-        get() = super.styles + prototype.styles
-        set(value) {
-            setProperty(VisualObject.STYLE_KEY, value.map { it.toString() })
-            styleChanged()
-        }
+    override fun allProperties(): Laminate = Laminate(properties, mergedStyles, prototype.allProperties())
 
     //override fun findAllStyles(): Laminate = Laminate((styles + prototype.styles).mapNotNull { findStyle(it) })
 
+    @Serializable
     inner class ProxyChild(val name: Name) : AbstractVisualObject(), VisualGroup {
 
-        val prototype: VisualObject by lazy {
-            prototypeFor(name)
-        }
+        val prototype: VisualObject get() = prototypeFor(name)
+
+        override val styleSheet: StyleSheet get() = this@Proxy.styleSheet
 
         override val children: Map<NameToken, VisualObject>
             get() = (prototype as? VisualGroup)?.children?.mapValues { (key, _) ->
@@ -102,12 +95,6 @@ class Proxy(val templateName: Name) : AbstractVisualObject(), VisualGroup, Visua
                 )
             } ?: emptyMap()
 
-        override fun getStyle(name: Name): Meta? = this@Proxy.getStyle(name)
-
-        override fun addStyle(name: Name, meta: Meta, apply: Boolean) {
-            this@Proxy.addStyle(name, meta, apply)
-        }
-
         override var properties: Config?
             get() = propertyCache[name]
             set(value) {
@@ -129,15 +116,18 @@ class Proxy(val templateName: Name) : AbstractVisualObject(), VisualGroup, Visua
             return if (inherit) {
                 properties?.get(name)
                     ?: mergedStyles[name]
-                    ?: prototype.getProperty(name, inherit)
-                    ?: parent?.getProperty(name, inherit)
+                    ?: prototype.getProperty(name)
+                    ?: parent?.getProperty(name)
             } else {
                 properties?.get(name)
                     ?: mergedStyles[name]
-                    ?: prototype.getProperty(name, inherit)
+                    ?: prototype.getProperty(name, false)
             }
         }
 
+
+        override fun allProperties(): Laminate = Laminate(properties, mergedStyles, prototype.allProperties())
+
     }
 
     companion object {
@@ -145,15 +135,36 @@ class Proxy(val templateName: Name) : AbstractVisualObject(), VisualGroup, Visua
     }
 }
 
-val VisualObject.prototype: VisualObject?
+val VisualObject.prototype: VisualObject
     get() = when (this) {
         is Proxy -> prototype
         is Proxy.ProxyChild -> prototype
-        else -> null
+        else -> this
     }
 
+/**
+ * Create ref for existing prototype
+ */
 inline fun VisualGroup3D.ref(
     templateName: Name,
     name: String = "",
-    action: Proxy.() -> Unit = {}
-) = Proxy(templateName).apply(action).also { set(name, it) }
+    block: Proxy.() -> Unit = {}
+) = Proxy(templateName).apply(block).also { set(name, it) }
+
+/**
+ * Add new proxy wrapping given object and automatically adding it to the prototypes
+ */
+fun VisualGroup3D.proxy(
+    templateName: Name,
+    obj: VisualObject3D,
+    name: String = "",
+    block: Proxy.() -> Unit = {}
+): Proxy {
+    val existing = getPrototype(templateName)
+    if (existing == null) {
+        setPrototype(templateName, obj)
+    } else if (existing != obj) {
+        error("Can't add different prototype on top of existing one")
+    }
+    return ref(templateName, name, block)
+}
diff --git a/dataforge-vis-spatial/src/commonMain/kotlin/hep/dataforge/vis/spatial/Sphere.kt b/dataforge-vis-spatial/src/commonMain/kotlin/hep/dataforge/vis/spatial/Sphere.kt
index 7cc2c411..26a9e820 100644
--- a/dataforge-vis-spatial/src/commonMain/kotlin/hep/dataforge/vis/spatial/Sphere.kt
+++ b/dataforge-vis-spatial/src/commonMain/kotlin/hep/dataforge/vis/spatial/Sphere.kt
@@ -2,7 +2,7 @@
 
 package hep.dataforge.vis.spatial
 
-import hep.dataforge.io.ConfigSerializer
+import hep.dataforge.io.serialization.ConfigSerializer
 import hep.dataforge.meta.Config
 import hep.dataforge.vis.common.AbstractVisualObject
 import kotlinx.serialization.Serializable
@@ -16,7 +16,7 @@ class Sphere(
     var phi: Float = PI2,
     var thetaStart: Float = 0f,
     var theta: Float = PI.toFloat()
-) : AbstractVisualObject(), VisualObject3D {
+) : AbstractVisualObject(), VisualObject3D, Shape {
 
     @Serializable(ConfigSerializer::class)
     override var properties: Config? = null
@@ -24,6 +24,19 @@ class Sphere(
     override var position: Point3D? = null
     override var rotation: Point3D? = null
     override var scale: Point3D? = null
+
+    override fun <T : Any> toGeometry(geometryBuilder: GeometryBuilder<T>) {
+        TODO("not implemented")
+//        val segments = this.detail ?: 8
+//        require(segments >= 4) { "The detail for sphere must be >= 4" }
+//        val phiStep = phi / segments
+//        val thetaStep = theta / segments
+//        for (i in 1 until segments - 1) {
+//            for (j in 0 until segments - 1) {
+//                val point1 = Point3D()
+//            }
+//        }
+    }
 }
 
 inline fun VisualGroup3D.sphere(
diff --git a/dataforge-vis-spatial/src/commonMain/kotlin/hep/dataforge/vis/spatial/Tube.kt b/dataforge-vis-spatial/src/commonMain/kotlin/hep/dataforge/vis/spatial/Tube.kt
index 77f707ee..248fbfce 100644
--- a/dataforge-vis-spatial/src/commonMain/kotlin/hep/dataforge/vis/spatial/Tube.kt
+++ b/dataforge-vis-spatial/src/commonMain/kotlin/hep/dataforge/vis/spatial/Tube.kt
@@ -1,7 +1,7 @@
 @file:UseSerializers(Point3DSerializer::class)
 package hep.dataforge.vis.spatial
 
-import hep.dataforge.io.ConfigSerializer
+import hep.dataforge.io.serialization.ConfigSerializer
 import hep.dataforge.meta.Config
 import hep.dataforge.vis.common.AbstractVisualObject
 import kotlinx.serialization.Serializable
@@ -123,6 +123,7 @@ class Tube(
             }
         }
     }
+
 }
 
 inline fun VisualGroup3D.tube(
diff --git a/dataforge-vis-spatial/src/commonMain/kotlin/hep/dataforge/vis/spatial/Visual3DPlugin.kt b/dataforge-vis-spatial/src/commonMain/kotlin/hep/dataforge/vis/spatial/Visual3DPlugin.kt
index 02886ed9..b09e2ea2 100644
--- a/dataforge-vis-spatial/src/commonMain/kotlin/hep/dataforge/vis/spatial/Visual3DPlugin.kt
+++ b/dataforge-vis-spatial/src/commonMain/kotlin/hep/dataforge/vis/spatial/Visual3DPlugin.kt
@@ -1,11 +1,12 @@
 package hep.dataforge.vis.spatial
 
 import hep.dataforge.context.AbstractPlugin
+import hep.dataforge.context.Context
 import hep.dataforge.context.PluginFactory
 import hep.dataforge.context.PluginTag
-import hep.dataforge.io.ConfigSerializer
-import hep.dataforge.io.MetaSerializer
-import hep.dataforge.io.NameSerializer
+import hep.dataforge.io.serialization.ConfigSerializer
+import hep.dataforge.io.serialization.MetaSerializer
+import hep.dataforge.io.serialization.NameSerializer
 import hep.dataforge.meta.*
 import hep.dataforge.names.Name
 import hep.dataforge.vis.common.VisualObject
@@ -30,14 +31,14 @@ class Visual3DPlugin(meta: Meta) : AbstractPlugin(meta) {
     companion object : PluginFactory<Visual3DPlugin> {
         override val tag: PluginTag = PluginTag(name = "visual.spatial", group = PluginTag.DATAFORGE_GROUP)
         override val type: KClass<out Visual3DPlugin> = Visual3DPlugin::class
-        override fun invoke(meta: Meta): Visual3DPlugin = Visual3DPlugin(meta)
+        override fun invoke(meta: Meta, context: Context): Visual3DPlugin = Visual3DPlugin(meta)
 
         val serialModule = SerializersModule {
             contextual(Point3DSerializer)
             contextual(Point2DSerializer)
             contextual(NameSerializer)
             contextual(NameTokenSerializer)
-            contextual(Meta::class, MetaSerializer)
+            contextual(MetaSerializer)
             contextual(ConfigSerializer)
 
             polymorphic(VisualObject::class, VisualObject3D::class) {
@@ -47,7 +48,8 @@ class Visual3DPlugin(meta: Meta) : AbstractPlugin(meta) {
                 Tube::class with Tube.serializer()
                 Box::class with Box.serializer()
                 Convex::class with Convex.serializer()
-                addSubclass(Extruded.serializer())
+                Extruded::class with Extruded.serializer()
+                addSubclass(Label3D.serializer())
             }
         }
 
diff --git a/dataforge-vis-spatial/src/commonMain/kotlin/hep/dataforge/vis/spatial/VisualGroup3D.kt b/dataforge-vis-spatial/src/commonMain/kotlin/hep/dataforge/vis/spatial/VisualGroup3D.kt
index 410b9365..44717f4d 100644
--- a/dataforge-vis-spatial/src/commonMain/kotlin/hep/dataforge/vis/spatial/VisualGroup3D.kt
+++ b/dataforge-vis-spatial/src/commonMain/kotlin/hep/dataforge/vis/spatial/VisualGroup3D.kt
@@ -8,19 +8,16 @@
 
 package hep.dataforge.vis.spatial
 
-import hep.dataforge.io.ConfigSerializer
-import hep.dataforge.io.MetaSerializer
-import hep.dataforge.io.NameSerializer
+import hep.dataforge.io.serialization.ConfigSerializer
+import hep.dataforge.io.serialization.MetaSerializer
+import hep.dataforge.io.serialization.NameSerializer
 import hep.dataforge.meta.Config
-import hep.dataforge.meta.Meta
-import hep.dataforge.meta.MetaBuilder
-import hep.dataforge.meta.set
 import hep.dataforge.names.Name
 import hep.dataforge.names.NameToken
 import hep.dataforge.names.asName
 import hep.dataforge.names.isEmpty
 import hep.dataforge.vis.common.AbstractVisualGroup
-import hep.dataforge.vis.common.VisualGroup
+import hep.dataforge.vis.common.StyleSheet
 import hep.dataforge.vis.common.VisualObject
 import kotlinx.serialization.SerialName
 import kotlinx.serialization.Serializable
@@ -31,19 +28,23 @@ import kotlin.collections.set
  * Represents 3-dimensional Visual Group
  */
 @Serializable
+@SerialName("group.3d")
 class VisualGroup3D : AbstractVisualGroup(), VisualObject3D {
     /**
      * A container for templates visible inside this group
      */
-    var templates: VisualGroup3D? = null
+    @SerialName(PROTOTYPES_KEY)
+    var prototypes: VisualGroup3D? = null
         set(value) {
             value?.parent = this
             field = value
         }
 
+    override var styleSheet: StyleSheet? = null
+        private set
+
     //FIXME to be lifted to AbstractVisualGroup after https://github.com/Kotlin/kotlinx.serialization/issues/378 is fixed
     override var properties: Config? = null
-    override val styleSheet = HashMap<Name, Meta>()
 
     override var position: Point3D? = null
     override var rotation: Point3D? = null
@@ -53,6 +54,19 @@ class VisualGroup3D : AbstractVisualGroup(), VisualObject3D {
     private val _children = HashMap<NameToken, VisualObject>()
     override val children: Map<NameToken, VisualObject> get() = _children
 
+    init {
+        //Do after deserialization
+        attachChildren()
+    }
+
+    /**
+     * Update or create stylesheet
+     */
+    fun styleSheet(block: StyleSheet.() -> Unit) {
+        val res = this.styleSheet ?: StyleSheet(this).also { this.styleSheet = it }
+        res.block()
+    }
+
     override fun removeChild(token: NameToken) {
         _children.remove(token)
         childrenChanged(token.asName(), null)
@@ -88,36 +102,42 @@ class VisualGroup3D : AbstractVisualGroup(), VisualObject3D {
         }
     }
 
-    fun getTemplate(name: Name): VisualObject3D? =
-        templates?.get(name) as? VisualObject3D
-            ?: (parent as? VisualGroup3D)?.getTemplate(name)
-
-    override fun MetaBuilder.updateMeta() {
-        set(TEMPLATES_KEY, templates?.toMeta())
-        updatePosition()
-        updateChildren()
+    override fun attachChildren() {
+        super.attachChildren()
+        prototypes?.run {
+            parent = this
+            attachChildren()
+        }
     }
 
     companion object {
-        const val TEMPLATES_KEY = "templates"
+        const val PROTOTYPES_KEY = "templates"
     }
 }
 
 /**
- * A fix for serialization bug that writes all proper parents inside the tree after deserialization
+ * Ger a prototype redirecting the request to the parent if prototype is not found
  */
-fun VisualGroup.attachChildren() {
-    this.children.values.forEach {
-        it.parent = this
-        (it as? VisualGroup)?.attachChildren()
-    }
-    if (this is VisualGroup3D) {
-        templates?.also {
-            it.parent = this
-            it.attachChildren()
-        }
-    }
+fun VisualGroup3D.getPrototype(name: Name): VisualObject3D? =
+    prototypes?.get(name) as? VisualObject3D ?: (parent as? VisualGroup3D)?.getPrototype(name)
+
+/**
+ * Defined a prototype inside current group
+ */
+fun VisualGroup3D.setPrototype(name: Name, obj: VisualObject3D) {
+    (prototypes ?: VisualGroup3D().also { this.prototypes = it })[name] = obj
 }
 
+/**
+ * Define a group with given [key], attach it to this parent and return it.
+ */
 fun VisualGroup3D.group(key: String = "", action: VisualGroup3D.() -> Unit = {}): VisualGroup3D =
     VisualGroup3D().apply(action).also { set(key, it) }
+
+/**
+ * Create or edit prototype node as a group
+ */
+inline fun VisualGroup3D.prototypes(builder: VisualGroup3D.() -> Unit): Unit {
+    (prototypes ?: VisualGroup3D().also { this.prototypes = it }).run(builder)
+}
+
diff --git a/dataforge-vis-spatial/src/commonMain/kotlin/hep/dataforge/vis/spatial/VisualObject3D.kt b/dataforge-vis-spatial/src/commonMain/kotlin/hep/dataforge/vis/spatial/VisualObject3D.kt
index fb34174e..0f0efee9 100644
--- a/dataforge-vis-spatial/src/commonMain/kotlin/hep/dataforge/vis/spatial/VisualObject3D.kt
+++ b/dataforge-vis-spatial/src/commonMain/kotlin/hep/dataforge/vis/spatial/VisualObject3D.kt
@@ -2,15 +2,15 @@
 
 package hep.dataforge.vis.spatial
 
-import hep.dataforge.io.NameSerializer
+import hep.dataforge.io.serialization.NameSerializer
 import hep.dataforge.meta.*
 import hep.dataforge.names.asName
 import hep.dataforge.names.plus
-import hep.dataforge.output.Output
+import hep.dataforge.output.Renderer
 import hep.dataforge.vis.common.VisualObject
 import hep.dataforge.vis.spatial.VisualObject3D.Companion.DETAIL_KEY
-import hep.dataforge.vis.spatial.VisualObject3D.Companion.LAYER_KEY
 import hep.dataforge.vis.spatial.VisualObject3D.Companion.IGNORE_KEY
+import hep.dataforge.vis.spatial.VisualObject3D.Companion.LAYER_KEY
 import hep.dataforge.vis.spatial.VisualObject3D.Companion.SELECTED_KEY
 import hep.dataforge.vis.spatial.VisualObject3D.Companion.VISIBLE_KEY
 import kotlinx.serialization.UseSerializers
@@ -43,7 +43,7 @@ interface VisualObject3D : VisualObject {
         val LAYER_KEY = "layer".asName()
         val IGNORE_KEY = "ignore".asName()
 
-        val GEOMETRY_KEY = "geometey".asName()
+        val GEOMETRY_KEY = "geometry".asName()
 
         val x = "x".asName()
         val y = "y".asName()
@@ -80,7 +80,7 @@ var VisualObject3D.layer: Int
         setProperty(LAYER_KEY, value)
     }
 
-fun Output<VisualObject3D>.render(meta: Meta = EmptyMeta, action: VisualGroup3D.() -> Unit) =
+fun Renderer<VisualObject3D>.render(meta: Meta = EmptyMeta, action: VisualGroup3D.() -> Unit) =
     render(VisualGroup3D().apply(action), meta)
 
 // Common properties
@@ -132,21 +132,21 @@ var VisualObject3D.x: Number
     get() = position?.x ?: 0f
     set(value) {
         position().x = value.toDouble()
-        propertyChanged(VisualObject3D.xPos)
+        propertyInvalidated(VisualObject3D.xPos)
     }
 
 var VisualObject3D.y: Number
     get() = position?.y ?: 0f
     set(value) {
         position().y = value.toDouble()
-        propertyChanged(VisualObject3D.yPos)
+        propertyInvalidated(VisualObject3D.yPos)
     }
 
 var VisualObject3D.z: Number
     get() = position?.z ?: 0f
     set(value) {
         position().z = value.toDouble()
-        propertyChanged(VisualObject3D.zPos)
+        propertyInvalidated(VisualObject3D.zPos)
     }
 
 private fun VisualObject3D.rotation(): Point3D =
@@ -156,21 +156,21 @@ var VisualObject3D.rotationX: Number
     get() = rotation?.x ?: 0f
     set(value) {
         rotation().x = value.toDouble()
-        propertyChanged(VisualObject3D.xRotation)
+        propertyInvalidated(VisualObject3D.xRotation)
     }
 
 var VisualObject3D.rotationY: Number
     get() = rotation?.y ?: 0f
     set(value) {
         rotation().y = value.toDouble()
-        propertyChanged(VisualObject3D.yRotation)
+        propertyInvalidated(VisualObject3D.yRotation)
     }
 
 var VisualObject3D.rotationZ: Number
     get() = rotation?.z ?: 0f
     set(value) {
         rotation().z = value.toDouble()
-        propertyChanged(VisualObject3D.zRotation)
+        propertyInvalidated(VisualObject3D.zRotation)
     }
 
 private fun VisualObject3D.scale(): Point3D =
@@ -180,19 +180,19 @@ var VisualObject3D.scaleX: Number
     get() = scale?.x ?: 1f
     set(value) {
         scale().x = value.toDouble()
-        propertyChanged(VisualObject3D.xScale)
+        propertyInvalidated(VisualObject3D.xScale)
     }
 
 var VisualObject3D.scaleY: Number
     get() = scale?.y ?: 1f
     set(value) {
         scale().y = value.toDouble()
-        propertyChanged(VisualObject3D.yScale)
+        propertyInvalidated(VisualObject3D.yScale)
     }
 
 var VisualObject3D.scaleZ: Number
     get() = scale?.z ?: 1f
     set(value) {
         scale().z = value.toDouble()
-        propertyChanged(VisualObject3D.zScale)
+        propertyInvalidated(VisualObject3D.zScale)
     }
\ No newline at end of file
diff --git a/dataforge-vis-spatial/src/commonMain/kotlin/hep/dataforge/vis/spatial/World.kt b/dataforge-vis-spatial/src/commonMain/kotlin/hep/dataforge/vis/spatial/World.kt
index 0743357d..bc946987 100644
--- a/dataforge-vis-spatial/src/commonMain/kotlin/hep/dataforge/vis/spatial/World.kt
+++ b/dataforge-vis-spatial/src/commonMain/kotlin/hep/dataforge/vis/spatial/World.kt
@@ -3,12 +3,8 @@ package hep.dataforge.vis.spatial
 import kotlin.math.PI
 
 object World {
-    const val CAMERA_INITIAL_DISTANCE = -500.0
-    const val CAMERA_INITIAL_X_ANGLE = -50.0
-    const val CAMERA_INITIAL_Y_ANGLE = 0.0
-    const val CAMERA_INITIAL_Z_ANGLE = -210.0
-    const val CAMERA_NEAR_CLIP = 0.1
-    const val CAMERA_FAR_CLIP = 10000.0
+    val ZERO = Point3D(0.0, 0.0, 0.0)
+    val ONE = Point3D(1.0, 1.0, 1.0)
 }
 
 const val PI2: Float = 2 * PI.toFloat()
\ No newline at end of file
diff --git a/dataforge-vis-spatial/src/commonMain/kotlin/hep/dataforge/vis/spatial/geometry.kt b/dataforge-vis-spatial/src/commonMain/kotlin/hep/dataforge/vis/spatial/geometry.kt
index 4ef1510c..75336e60 100644
--- a/dataforge-vis-spatial/src/commonMain/kotlin/hep/dataforge/vis/spatial/geometry.kt
+++ b/dataforge-vis-spatial/src/commonMain/kotlin/hep/dataforge/vis/spatial/geometry.kt
@@ -14,8 +14,8 @@ operator fun Point2D.component1() = x
 operator fun Point2D.component2() = y
 
 fun Point2D.toMeta() = buildMeta {
-    VisualObject3D.x to x
-    VisualObject3D.y to y
+    VisualObject3D.x put x
+    VisualObject3D.y put y
 }
 
 fun Meta.point2D() = Point2D(this["x"].number ?: 0, this["y"].number ?: 0)
@@ -26,23 +26,7 @@ expect class Point3D(x: Number, y: Number, z: Number) {
     var z: Double
 }
 
-operator fun Point3D?.plus(other: Point3D?): Point3D? {
-    return when {
-        this == null && other == null -> null
-        this == null -> other
-        other == null -> this
-        else -> Point3D(x + other.x, y + other.y, z + other.z)
-    }
-}
-
-operator fun Point3D?.minus(other: Point3D?): Point3D? {
-    return when {
-        this == null && other == null -> null
-        this == null -> Point3D(-other!!.x, -other.y, -other.z)
-        other == null -> this
-        else -> Point3D(x - other.x, y - other.y, z - other.z)
-    }
-}
+expect operator fun Point3D.plus(other: Point3D): Point3D
 
 operator fun Point3D.component1() = x
 operator fun Point3D.component2() = y
@@ -50,10 +34,8 @@ operator fun Point3D.component3() = z
 
 fun Meta.point3D() = Point3D(this["x"].number ?: 0, this["y"].number ?: 0, this["y"].number ?: 0)
 
-val zero = Point3D(0, 0, 0)
-
 fun Point3D.toMeta() = buildMeta {
-    VisualObject3D.x to x
-    VisualObject3D.y to y
-    VisualObject3D.z to z
+    VisualObject3D.x put x
+    VisualObject3D.y put y
+    VisualObject3D.z put z
 }
\ No newline at end of file
diff --git a/dataforge-vis-spatial/src/commonMain/kotlin/hep/dataforge/vis/spatial/serilization.kt b/dataforge-vis-spatial/src/commonMain/kotlin/hep/dataforge/vis/spatial/serilization.kt
index c7b3cbfa..b4f87d39 100644
--- a/dataforge-vis-spatial/src/commonMain/kotlin/hep/dataforge/vis/spatial/serilization.kt
+++ b/dataforge-vis-spatial/src/commonMain/kotlin/hep/dataforge/vis/spatial/serilization.kt
@@ -1,45 +1,97 @@
 package hep.dataforge.vis.spatial
 
+import hep.dataforge.io.serialization.descriptor
 import hep.dataforge.names.NameToken
 import hep.dataforge.names.toName
 import kotlinx.serialization.*
+import kotlinx.serialization.internal.DoubleSerializer
 import kotlinx.serialization.internal.StringDescriptor
+import kotlinx.serialization.internal.nullable
 
-@Serializable
-private data class Point2DSerial(val x: Double, val y: Double)
+inline fun <R> Decoder.decodeStructure(
+    desc: SerialDescriptor,
+    vararg typeParams: KSerializer<*> = emptyArray(),
+    crossinline block:  CompositeDecoder.() -> R
+): R {
+    val decoder = beginStructure(desc, *typeParams)
+    val res = decoder.block()
+    decoder.endStructure(desc)
+    return res
+}
 
-@Serializable
-private data class Point3DSerial(val x: Double, val y: Double, val z: Double)
+inline fun Encoder.encodeStructure(
+    desc: SerialDescriptor,
+    vararg typeParams: KSerializer<*> = emptyArray(),
+    block: CompositeEncoder.() -> Unit
+) {
+    val encoder = beginStructure(desc, *typeParams)
+    encoder.block()
+    encoder.endStructure(desc)
+}
 
 @Serializer(Point3D::class)
 object Point3DSerializer : KSerializer<Point3D> {
-    private val serializer = Point3DSerial.serializer()
-    override val descriptor: SerialDescriptor get() = serializer.descriptor
+    override val descriptor: SerialDescriptor = descriptor("hep.dataforge.vis.spatial.Point3D") {
+        double("x", true)
+        double("y", true)
+        double("z", true)
+    }
 
     override fun deserialize(decoder: Decoder): Point3D {
-        return serializer.deserialize(decoder).let {
-            Point3D(it.x, it.y, it.z)
+        var x: Double? = null
+        var y: Double? = null
+        var z: Double? = null
+        decoder.decodeStructure(descriptor) {
+            loop@ while (true) {
+                when (val i = decodeElementIndex(descriptor)) {
+                    CompositeDecoder.READ_DONE -> break@loop
+                    0 -> x = decodeNullableSerializableElement(descriptor, 0, DoubleSerializer.nullable) ?: 0.0
+                    1 -> y = decodeNullableSerializableElement(descriptor, 0, DoubleSerializer.nullable) ?: 0.0
+                    2 -> z = decodeNullableSerializableElement(descriptor, 0, DoubleSerializer.nullable) ?: 0.0
+                    else -> throw SerializationException("Unknown index $i")
+                }
+            }
         }
+        return Point3D(x?:0.0, y?:0.0, z?:0.0)
     }
 
     override fun serialize(encoder: Encoder, obj: Point3D) {
-        serializer.serialize(encoder, Point3DSerial(obj.x, obj.y, obj.z))
+        encoder.encodeStructure(descriptor) {
+            if (obj.x != 0.0) encodeDoubleElement(descriptor, 0, obj.x)
+            if (obj.y != 0.0) encodeDoubleElement(descriptor, 1, obj.y)
+            if (obj.z != 0.0) encodeDoubleElement(descriptor, 2, obj.z)
+        }
     }
 }
 
 @Serializer(Point2D::class)
 object Point2DSerializer : KSerializer<Point2D> {
-    private val serializer = Point2DSerial.serializer()
-    override val descriptor: SerialDescriptor get() = serializer.descriptor
+    override val descriptor: SerialDescriptor = descriptor("hep.dataforge.vis.spatial.Point2D") {
+        double("x", true)
+        double("y", true)
+    }
 
     override fun deserialize(decoder: Decoder): Point2D {
-        return serializer.deserialize(decoder).let {
-            Point2D(it.x, it.y)
+        var x: Double? = null
+        var y: Double? = null
+        decoder.decodeStructure(descriptor) {
+            loop@ while (true) {
+                when (val i = decodeElementIndex(descriptor)) {
+                    CompositeDecoder.READ_DONE -> break@loop
+                    0 -> x = decodeNullableSerializableElement(descriptor, 0, DoubleSerializer.nullable) ?: 0.0
+                    1 -> y = decodeNullableSerializableElement(descriptor, 0, DoubleSerializer.nullable) ?: 0.0
+                    else -> throw SerializationException("Unknown index $i")
+                }
+            }
         }
+        return Point2D(x?:0.0, y?:0.0)
     }
 
     override fun serialize(encoder: Encoder, obj: Point2D) {
-        serializer.serialize(encoder, Point2DSerial(obj.x, obj.y))
+        encoder.encodeStructure(descriptor) {
+            if (obj.x != 0.0) encodeDoubleElement(descriptor, 0, obj.x)
+            if (obj.y != 0.0) encodeDoubleElement(descriptor, 1, obj.y)
+        }
     }
 }
 
diff --git a/dataforge-vis-spatial/src/commonMain/kotlin/hep/dataforge/vis/spatial/specifications/AxesSpec.kt b/dataforge-vis-spatial/src/commonMain/kotlin/hep/dataforge/vis/spatial/specifications/AxesSpec.kt
new file mode 100644
index 00000000..b46b9f4d
--- /dev/null
+++ b/dataforge-vis-spatial/src/commonMain/kotlin/hep/dataforge/vis/spatial/specifications/AxesSpec.kt
@@ -0,0 +1,17 @@
+package hep.dataforge.vis.spatial.specifications
+
+import hep.dataforge.meta.*
+
+class AxesSpec(override val config: Config) : Specific {
+    var visible by boolean(!config.isEmpty())
+    var size by double(AXIS_SIZE)
+    var width by double(AXIS_WIDTH)
+
+    companion object : Specification<AxesSpec> {
+        override fun wrap(config: Config): AxesSpec = AxesSpec(config)
+
+        const val AXIS_SIZE = 1000.0
+        const val AXIS_WIDTH = 3.0
+
+    }
+}
\ No newline at end of file
diff --git a/dataforge-vis-spatial/src/commonMain/kotlin/hep/dataforge/vis/spatial/specifications/CameraSpec.kt b/dataforge-vis-spatial/src/commonMain/kotlin/hep/dataforge/vis/spatial/specifications/CameraSpec.kt
new file mode 100644
index 00000000..eb23472f
--- /dev/null
+++ b/dataforge-vis-spatial/src/commonMain/kotlin/hep/dataforge/vis/spatial/specifications/CameraSpec.kt
@@ -0,0 +1,26 @@
+package hep.dataforge.vis.spatial.specifications
+
+import hep.dataforge.meta.*
+import kotlin.math.PI
+
+class CameraSpec(override val config: Config) : Specific {
+    var fov by int(FIELD_OF_VIEW)
+    //var aspect by double(1.0)
+    var nearClip by double(NEAR_CLIP)
+    var farClip by double(FAR_CLIP)
+
+    var distance by double(INITIAL_DISTANCE)
+    var azimuth by double(INITIAL_AZIMUTH)
+    var latitude by double(INITIAL_LATITUDE)
+    val zenith: Double get() = PI / 2 - latitude
+
+    companion object : Specification<CameraSpec> {
+        override fun wrap(config: Config): CameraSpec = CameraSpec(config)
+        const val INITIAL_DISTANCE = 300.0
+        const val INITIAL_AZIMUTH = 0.0
+        const val INITIAL_LATITUDE = PI/6
+        const val NEAR_CLIP = 0.1
+        const val FAR_CLIP = 10000.0
+        const val FIELD_OF_VIEW = 75
+    }
+}
\ No newline at end of file
diff --git a/dataforge-vis-spatial/src/commonMain/kotlin/hep/dataforge/vis/spatial/specifications/CanvasSpec.kt b/dataforge-vis-spatial/src/commonMain/kotlin/hep/dataforge/vis/spatial/specifications/CanvasSpec.kt
new file mode 100644
index 00000000..d9cbded6
--- /dev/null
+++ b/dataforge-vis-spatial/src/commonMain/kotlin/hep/dataforge/vis/spatial/specifications/CanvasSpec.kt
@@ -0,0 +1,15 @@
+package hep.dataforge.vis.spatial.specifications
+
+import hep.dataforge.meta.*
+
+class CanvasSpec(override val config: Config) : Specific {
+    var axes by spec(AxesSpec)
+    var camera by spec(CameraSpec)
+    var controls by spec(ControlsSpec)
+    var minSize by int(300)
+
+    companion object: Specification<CanvasSpec>{
+        override fun wrap(config: Config): CanvasSpec = CanvasSpec(config)
+
+    }
+}
\ No newline at end of file
diff --git a/dataforge-vis-spatial/src/commonMain/kotlin/hep/dataforge/vis/spatial/specifications/ControlsSpec.kt b/dataforge-vis-spatial/src/commonMain/kotlin/hep/dataforge/vis/spatial/specifications/ControlsSpec.kt
new file mode 100644
index 00000000..2a828766
--- /dev/null
+++ b/dataforge-vis-spatial/src/commonMain/kotlin/hep/dataforge/vis/spatial/specifications/ControlsSpec.kt
@@ -0,0 +1,11 @@
+package hep.dataforge.vis.spatial.specifications
+
+import hep.dataforge.meta.Config
+import hep.dataforge.meta.Specific
+import hep.dataforge.meta.Specification
+
+class ControlsSpec(override val config: Config) : Specific {
+    companion object : Specification<ControlsSpec> {
+        override fun wrap(config: Config): ControlsSpec = ControlsSpec(config)
+    }
+}
\ No newline at end of file
diff --git a/dataforge-vis-spatial/src/commonMain/kotlin/hep/dataforge/vis/spatial/transform/RemoveSingleChild.kt b/dataforge-vis-spatial/src/commonMain/kotlin/hep/dataforge/vis/spatial/transform/RemoveSingleChild.kt
index e8135dc3..70db5c75 100644
--- a/dataforge-vis-spatial/src/commonMain/kotlin/hep/dataforge/vis/spatial/transform/RemoveSingleChild.kt
+++ b/dataforge-vis-spatial/src/commonMain/kotlin/hep/dataforge/vis/spatial/transform/RemoveSingleChild.kt
@@ -10,11 +10,13 @@ import hep.dataforge.vis.spatial.*
 internal fun mergeChild(parent: VisualGroup, child: VisualObject): VisualObject {
     return child.apply {
 
-        parent.properties?.let { config.update(it) }
+        config.update(parent.config)
+
+        //parent.properties?.let { config.update(it) }
 
         if (this is VisualObject3D && parent is VisualObject3D) {
-            position += parent.position
-            rotation += parent.rotation
+            position = (position ?: World.ZERO) + (parent.position ?: World.ZERO)
+            rotation = (parent.rotation ?: World.ZERO) + (parent.rotation ?: World.ZERO)
             scale = when {
                 scale == null && parent.scale == null -> null
                 scale == null -> parent.scale
@@ -49,7 +51,7 @@ object RemoveSingleChild : VisualTreeTransform<VisualGroup3D>() {
         }
 
         replaceChildren()
-        templates?.replaceChildren()
+        prototypes?.replaceChildren()
     }
 
     override fun VisualGroup3D.clone(): VisualGroup3D {
diff --git a/dataforge-vis-spatial/src/commonMain/kotlin/hep/dataforge/vis/spatial/transform/UnRef.kt b/dataforge-vis-spatial/src/commonMain/kotlin/hep/dataforge/vis/spatial/transform/UnRef.kt
index b09561e4..12681b24 100644
--- a/dataforge-vis-spatial/src/commonMain/kotlin/hep/dataforge/vis/spatial/transform/UnRef.kt
+++ b/dataforge-vis-spatial/src/commonMain/kotlin/hep/dataforge/vis/spatial/transform/UnRef.kt
@@ -24,7 +24,7 @@ object UnRef : VisualTreeTransform<VisualGroup3D>() {
     }
 
     private fun MutableVisualGroup.unref(name: Name) {
-        (this as? VisualGroup3D)?.templates?.set(name, null)
+        (this as? VisualGroup3D)?.prototypes?.set(name, null)
         children.filter { (it.value as? Proxy)?.templateName == name }.forEach { (key, value) ->
             val proxy = value as Proxy
             val newChild = mergeChild(proxy, proxy.prototype)
diff --git a/dataforge-vis-spatial/src/commonTest/kotlin/hep/dataforge/vis/spatial/ConvexTest.kt b/dataforge-vis-spatial/src/commonTest/kotlin/hep/dataforge/vis/spatial/ConvexTest.kt
index beba580c..3358fe84 100644
--- a/dataforge-vis-spatial/src/commonTest/kotlin/hep/dataforge/vis/spatial/ConvexTest.kt
+++ b/dataforge-vis-spatial/src/commonTest/kotlin/hep/dataforge/vis/spatial/ConvexTest.kt
@@ -1,9 +1,8 @@
 package hep.dataforge.vis.spatial
 
-import hep.dataforge.meta.get
-import hep.dataforge.meta.getAll
-import hep.dataforge.meta.node
-import hep.dataforge.names.toName
+import hep.dataforge.io.toMeta
+import hep.dataforge.meta.MetaItem
+import hep.dataforge.meta.getIndexed
 import kotlin.test.Test
 import kotlin.test.assertEquals
 
@@ -26,12 +25,11 @@ class ConvexTest {
 
         val convex = group.first() as Convex
 
-        val meta = convex.toMeta()
+        val json = Visual3DPlugin.json.toJson(Convex.serializer(), convex)
+        val meta = json.toMeta()
 
-        val pointsNode = convex.toMeta()["points"].node
-
-        assertEquals(8, pointsNode?.items?.count())
-        val points = pointsNode?.getAll("point".toName())
+        val points = meta.getIndexed("points").values.map { (it as MetaItem.NodeItem<*>).node.point3D()}
+        assertEquals(8, points.count())
 
         assertEquals(8, convex.points.size)
     }
diff --git a/dataforge-vis-spatial/src/commonTest/kotlin/hep/dataforge/vis/spatial/GroupTest.kt b/dataforge-vis-spatial/src/commonTest/kotlin/hep/dataforge/vis/spatial/GroupTest.kt
index c1e81721..2608b53a 100644
--- a/dataforge-vis-spatial/src/commonTest/kotlin/hep/dataforge/vis/spatial/GroupTest.kt
+++ b/dataforge-vis-spatial/src/commonTest/kotlin/hep/dataforge/vis/spatial/GroupTest.kt
@@ -18,8 +18,8 @@ class GroupTest {
                 }
                 box(100, 100, 100)
                 material {
-                    "color" to Colors.lightgreen
-                    "opacity" to 0.3
+                    color(Colors.lightgreen)
+                    opacity = 0.3f
                 }
             }
             intersect("intersect") {
@@ -46,6 +46,6 @@ class GroupTest {
 
         assertEquals(3, group.count())
         assertEquals(300.0, (group["intersect"] as VisualObject3D).y.toDouble())
-        assertEquals(-300.0, (group["subtract"]  as VisualObject3D).y.toDouble())
+        assertEquals(-300.0, (group["subtract"] as VisualObject3D).y.toDouble())
     }
 }
\ No newline at end of file
diff --git a/dataforge-vis-spatial/src/commonTest/kotlin/hep/dataforge/vis/spatial/PropertyTest.kt b/dataforge-vis-spatial/src/commonTest/kotlin/hep/dataforge/vis/spatial/PropertyTest.kt
new file mode 100644
index 00000000..fa15b905
--- /dev/null
+++ b/dataforge-vis-spatial/src/commonTest/kotlin/hep/dataforge/vis/spatial/PropertyTest.kt
@@ -0,0 +1,79 @@
+package hep.dataforge.vis.spatial
+
+import hep.dataforge.meta.int
+import hep.dataforge.meta.set
+import hep.dataforge.names.asName
+import hep.dataforge.vis.common.useStyle
+import kotlin.test.Test
+import kotlin.test.assertEquals
+
+class PropertyTest {
+    @Test
+    fun testInheritedProperty() {
+        var box: Box? = null
+        val group = VisualGroup3D().apply {
+            config["test"] = 22
+            group {
+                box = box(100, 100, 100)
+            }
+        }
+        assertEquals(22, box?.getProperty("test".asName()).int)
+    }
+
+    @Test
+    fun testStyleProperty() {
+        var box: Box? = null
+        val group = VisualGroup3D().apply {
+            styleSheet {
+                set("testStyle") {
+                    "test" put 22
+                }
+            }
+            group {
+                box = box(100, 100, 100).apply {
+                    useStyle("testStyle")
+                }
+            }
+        }
+        assertEquals(22, box?.getProperty("test".asName()).int)
+    }
+
+    @Test
+    fun testColor() {
+        var box: Box? = null
+        val group = VisualGroup3D().apply {
+            styleSheet {
+                set("testStyle") {
+                    Material3D.MATERIAL_COLOR_KEY put "#555555"
+                }
+            }
+            group {
+                box = box(100, 100, 100) {
+                    useStyle("testStyle")
+                }
+            }
+        }
+        assertEquals("#555555", box?.color)
+    }
+
+    @Test
+    fun testProxyStyleProperty() {
+        var box: Proxy? = null
+        val group = VisualGroup3D().apply {
+            styleSheet {
+                set("testStyle") {
+                    Material3D.MATERIAL_COLOR_KEY put "#555555"
+                }
+            }
+            prototypes {
+                box(100, 100, 100, name = "box") {
+                    styles = listOf("testStyle")
+                }
+            }
+            group {
+                box = ref("box".asName())
+            }
+        }
+        assertEquals("#555555", box?.color)
+    }
+}
\ No newline at end of file
diff --git a/dataforge-vis-spatial/src/commonTest/kotlin/hep/dataforge/vis/spatial/SerializationTest.kt b/dataforge-vis-spatial/src/commonTest/kotlin/hep/dataforge/vis/spatial/SerializationTest.kt
index 09d59f29..128b507b 100644
--- a/dataforge-vis-spatial/src/commonTest/kotlin/hep/dataforge/vis/spatial/SerializationTest.kt
+++ b/dataforge-vis-spatial/src/commonTest/kotlin/hep/dataforge/vis/spatial/SerializationTest.kt
@@ -8,13 +8,15 @@ import kotlin.test.assertEquals
 class SerializationTest {
     @ImplicitReflectionSerializer
     @Test
-    fun testCubeSerialization(){
-        val cube = Box(100f,100f,100f).apply{
+    fun testCubeSerialization() {
+        val cube = Box(100f, 100f, 100f).apply {
             color(222)
+            x = 100
+            z = -100
         }
-        val string  = json.stringify(Box.serializer(),cube)
+        val string = json.stringify(Box.serializer(), cube)
         println(string)
-        val newCube = json.parse(Box.serializer(),string)
-        assertEquals(cube.toMeta(),newCube.toMeta())
+        val newCube = json.parse(Box.serializer(), string)
+        assertEquals(cube.config, newCube.config)
     }
 }
\ No newline at end of file
diff --git a/dataforge-vis-spatial/src/jsMain/kotlin/hep/dataforge/vis/spatial/editor/jsVisualTree.kt b/dataforge-vis-spatial/src/jsMain/kotlin/hep/dataforge/vis/spatial/editor/jsVisualTree.kt
deleted file mode 100644
index 0a9495d7..00000000
--- a/dataforge-vis-spatial/src/jsMain/kotlin/hep/dataforge/vis/spatial/editor/jsVisualTree.kt
+++ /dev/null
@@ -1,137 +0,0 @@
-@file:Suppress("UNCHECKED_CAST_TO_EXTERNAL_INTERFACE")
-
-package hep.dataforge.vis.spatial.editor
-
-import hep.dataforge.meta.string
-import hep.dataforge.names.EmptyName
-import hep.dataforge.names.Name
-import hep.dataforge.names.NameToken
-import hep.dataforge.vis.common.VisualGroup
-import hep.dataforge.vis.common.VisualObject
-import hep.dataforge.vis.common.getProperty
-import hep.dataforge.vis.jsObject
-import hep.dataforge.vis.spatial.Proxy
-import hep.dataforge.vis.spatial.visible
-import info.laht.threekt.loaders.Cache.clear
-import kotlinx.html.div
-import kotlinx.html.dom.append
-import org.w3c.dom.Element
-import kotlin.dom.clear
-import kotlin.js.json
-
-operator fun Name.plus(other: NameToken): Name = Name(tokens + other)
-
-
-private fun createInspireTree(block: Config.() -> Unit = {}): InspireTree {
-    val config = (json(
-        "checkbox" to json(
-            "autoCheckChildren" to false
-        )
-    ) as Config).apply(block)
-    return InspireTree(config)
-}
-
-private fun VisualObject.toTree(onFocus: (VisualObject?, String?) -> Unit = { _, _ -> }): InspireTree {
-
-    val map = HashMap<String, VisualObject>()
-
-    fun generateNodeConfig(item: VisualObject, fullName: Name): NodeConfig {
-        val title = item.getProperty("title").string ?: fullName.last()?.toString() ?: "root"
-        val className = if (item is Proxy) {
-            item.prototype::class.toString()
-        } else {
-            item::class.toString()
-        }.replace("class ", "")
-
-        val text: String = if (title.startsWith("@")) {
-            "[$className}]"
-        } else {
-            "$title[$className}]"
-        }
-
-        return json(
-            "children" to if ((item as? VisualGroup)?.children?.isEmpty() != false) {
-                emptyArray<NodeConfig>()
-            } else {
-                true
-            },
-            "text" to text,
-            "id" to fullName.toString(),
-            "itree" to json(
-                "state" to json(
-                    "checked" to (item.visible ?: true)
-                )
-            )
-        ) as NodeConfig
-
-    }
-
-    fun TreeNode.fillChildren(group: VisualObject, groupName: Name) {
-        if(group is VisualGroup) {
-            group.children.forEach { (token, obj) ->
-                if (!token.body.startsWith("@")) {
-                    val name = groupName + token
-                    val nodeConfig = generateNodeConfig(obj, name)
-                    val childNode = addChild(nodeConfig)
-                    map[childNode.id] = obj
-                    if (obj is VisualGroup) {
-                        childNode.fillChildren(obj, name)
-                    }
-                }
-            }
-        }
-    }
-
-    val inspireTree = createInspireTree {
-
-    }
-    val nodeConfig = generateNodeConfig(this, EmptyName)
-    val rootNode = inspireTree.addNode(nodeConfig)
-    map[rootNode.id] = this
-    rootNode.fillChildren(this, EmptyName)
-
-//    inspireTree.on("node.selected") { node: TreeNode, isLoadEvent: Boolean ->
-//        if (!isLoadEvent) {
-//            map[node.id]?.selected = node.selected()
-//        }
-//    }
-//
-//    inspireTree.on("node.deselect") { node: TreeNode ->
-//        map[node.id]?.selected = node.selected()
-//    }
-
-    inspireTree.on("node.checked") { node: TreeNode, isLoadEvent: Boolean ->
-        if (!isLoadEvent) {
-            map[node.id]?.visible = node.checked()
-        }
-    }
-
-    inspireTree.on("node.unchecked") { node: TreeNode ->
-        if (!node.indeterminate()) {
-            map[node.id]?.visible = node.checked()
-        }
-    }
-
-    inspireTree.on("node.focused") { node: TreeNode, isLoadEvent: Boolean ->
-        if (!isLoadEvent) {
-            onFocus(map[node.id], node.id)
-        }
-    }
-
-    inspireTree.collapseDeep()
-
-    return inspireTree
-}
-
-fun Element.visualObjectTree(group: VisualObject, onFocus: (VisualObject?, String?) -> Unit) {
-    this.clear()
-    append {
-        card("Visual object tree") {
-            val domConfig = jsObject<DomConfig> {
-                target = div()
-                showCheckboxes = false
-            }
-            InspireTreeDOM(group.toTree(onFocus), domConfig)
-        }
-    }
-}
\ No newline at end of file
diff --git a/dataforge-vis-spatial/src/jsMain/kotlin/hep/dataforge/vis/spatial/editor/outputConfig.kt b/dataforge-vis-spatial/src/jsMain/kotlin/hep/dataforge/vis/spatial/editor/outputConfig.kt
deleted file mode 100644
index f667fc99..00000000
--- a/dataforge-vis-spatial/src/jsMain/kotlin/hep/dataforge/vis/spatial/editor/outputConfig.kt
+++ /dev/null
@@ -1,37 +0,0 @@
-package hep.dataforge.vis.spatial.editor
-
-import hep.dataforge.vis.spatial.three.ThreeOutput
-import kotlinx.html.InputType
-import kotlinx.html.dom.append
-import kotlinx.html.js.div
-import kotlinx.html.js.input
-import kotlinx.html.js.label
-import org.w3c.dom.Element
-import kotlin.dom.clear
-
-fun Element.threeOutputConfig(output: ThreeOutput) {
-    clear()
-    append {
-        card("Layers"){
-            div("row") {
-                (0..11).forEach { layer ->
-                    div("col-1") {
-                        label { +layer.toString() }
-                        input(type = InputType.checkBox).apply {
-                            if (layer == 0) {
-                                checked = true
-                            }
-                            onchange = {
-                                if (checked) {
-                                    output.camera.layers.enable(layer)
-                                } else {
-                                    output.camera.layers.disable(layer)
-                                }
-                            }
-                        }
-                    }
-                }
-            }
-        }
-    }
-}
\ No newline at end of file
diff --git a/dataforge-vis-spatial/src/jsMain/kotlin/hep/dataforge/vis/spatial/geometryJs.kt b/dataforge-vis-spatial/src/jsMain/kotlin/hep/dataforge/vis/spatial/geometryJs.kt
index cacb3600..cba5d958 100644
--- a/dataforge-vis-spatial/src/jsMain/kotlin/hep/dataforge/vis/spatial/geometryJs.kt
+++ b/dataforge-vis-spatial/src/jsMain/kotlin/hep/dataforge/vis/spatial/geometryJs.kt
@@ -1,8 +1,14 @@
 package hep.dataforge.vis.spatial
 
+
 import info.laht.threekt.math.Vector2
 import info.laht.threekt.math.Vector3
+import info.laht.threekt.math.plus
 
 actual typealias Point2D = Vector2
 
-actual typealias Point3D = Vector3
\ No newline at end of file
+actual typealias Point3D = Vector3
+
+actual operator fun Point3D.plus(other: Point3D): Point3D {
+    return this.plus(other)
+}
\ No newline at end of file
diff --git a/dataforge-vis-spatial/src/jsMain/kotlin/hep/dataforge/vis/spatial/three/Materials.kt b/dataforge-vis-spatial/src/jsMain/kotlin/hep/dataforge/vis/spatial/three/Materials.kt
deleted file mode 100644
index 8e575169..00000000
--- a/dataforge-vis-spatial/src/jsMain/kotlin/hep/dataforge/vis/spatial/three/Materials.kt
+++ /dev/null
@@ -1,96 +0,0 @@
-package hep.dataforge.vis.spatial.three
-
-import hep.dataforge.meta.*
-import hep.dataforge.values.ValueType
-import hep.dataforge.vis.common.Colors
-import hep.dataforge.vis.spatial.Material3D
-import info.laht.threekt.materials.LineBasicMaterial
-import info.laht.threekt.materials.Material
-import info.laht.threekt.materials.MeshBasicMaterial
-import info.laht.threekt.materials.MeshPhongMaterial
-import info.laht.threekt.math.Color
-
-
-object Materials {
-    val DEFAULT_COLOR = Color(Colors.darkgreen)
-    val DEFAULT = MeshPhongMaterial().apply {
-        color.set(DEFAULT_COLOR)
-    }
-    val DEFAULT_LINE_COLOR = Color(Colors.black)
-    val DEFAULT_LINE = LineBasicMaterial().apply {
-        color.set(DEFAULT_LINE_COLOR)
-    }
-
-
-    private val materialCache = HashMap<Meta, Material>()
-    private val lineMaterialCache = HashMap<Meta, Material>()
-
-    fun getMaterial(meta: Meta): Material = materialCache.getOrPut(meta) {
-        MeshBasicMaterial().apply {
-            color = meta["color"]?.color() ?: DEFAULT_COLOR
-            opacity = meta["opacity"]?.double ?: 1.0
-            transparent = meta["transparent"].boolean ?: (opacity < 1.0)
-            //node["specularColor"]?.let { specular = it.color() }
-            //side = 2
-        }
-    }
-
-    fun getLineMaterial(meta: Meta): Material = lineMaterialCache.getOrPut(meta) {
-        LineBasicMaterial().apply {
-            color = meta["color"]?.color() ?: DEFAULT_LINE_COLOR
-            opacity = meta["opacity"].double ?: 1.0
-            transparent = meta["transparent"].boolean ?: (opacity < 1.0)
-            linewidth = meta["thickness"].double ?: 1.0
-        }
-    }
-
-
-}
-
-/**
- * Infer color based on meta item
- */
-fun MetaItem<*>.color(): Color {
-    return when (this) {
-        is MetaItem.ValueItem -> if (this.value.type == ValueType.STRING) {
-            Color(this.value.string)
-        } else {
-            val int = value.number.toInt()
-//            val red = int and 0x00ff0000 shr 16
-//            val green = int and 0x0000ff00 shr 8
-//            val blue = int and 0x000000ff
-            Color(int)
-        }
-        is MetaItem.NodeItem -> {
-            Color(
-                node["red"]?.int ?: 0,
-                node["green"]?.int ?: 0,
-                node["blue"]?.int ?: 0
-            )
-        }
-    }
-}
-
-/**
- * Infer Three material based on meta item
- */
-fun Meta?.jsMaterial(): Material {
-    return if (this == null) {
-        Materials.DEFAULT
-    } else {
-        Materials.getMaterial(this)
-    }
-}
-
-fun Meta?.jsLineMaterial(): Material {
-    return if (this == null) {
-        Materials.DEFAULT_LINE
-    } else{
-        Materials.getLineMaterial(this)
-    }
-}
-
-
-fun Material3D?.jsMaterial(): Material = this?.config.jsMaterial()
-fun Material3D?.jsLineMaterial(): Material = this?.config.jsLineMaterial()
-
diff --git a/dataforge-vis-spatial/src/jsMain/kotlin/hep/dataforge/vis/spatial/three/MeshThreeFactory.kt b/dataforge-vis-spatial/src/jsMain/kotlin/hep/dataforge/vis/spatial/three/MeshThreeFactory.kt
index 2b0c5d21..7c3ead15 100644
--- a/dataforge-vis-spatial/src/jsMain/kotlin/hep/dataforge/vis/spatial/three/MeshThreeFactory.kt
+++ b/dataforge-vis-spatial/src/jsMain/kotlin/hep/dataforge/vis/spatial/three/MeshThreeFactory.kt
@@ -1,6 +1,8 @@
 package hep.dataforge.vis.spatial.three
 
+import hep.dataforge.meta.Meta
 import hep.dataforge.meta.boolean
+import hep.dataforge.meta.get
 import hep.dataforge.meta.node
 import hep.dataforge.names.asName
 import hep.dataforge.names.plus
@@ -8,10 +10,10 @@ import hep.dataforge.names.startsWith
 import hep.dataforge.vis.spatial.Material3D
 import hep.dataforge.vis.spatial.VisualObject3D
 import hep.dataforge.vis.spatial.layer
-import hep.dataforge.vis.spatial.material
 import info.laht.threekt.core.BufferGeometry
 import info.laht.threekt.geometries.EdgesGeometry
 import info.laht.threekt.geometries.WireframeGeometry
+import info.laht.threekt.materials.MeshBasicMaterial
 import info.laht.threekt.objects.LineSegments
 import info.laht.threekt.objects.Mesh
 import kotlin.reflect.KClass
@@ -19,56 +21,33 @@ import kotlin.reflect.KClass
 /**
  * Basic geometry-based factory
  */
-abstract class MeshThreeFactory<T : VisualObject3D>(
-    override val type: KClass<out T>
+abstract class MeshThreeFactory<in T : VisualObject3D>(
+    override val type: KClass<in T>
 ) : ThreeFactory<T> {
     /**
      * Build a geometry for an object
      */
     abstract fun buildGeometry(obj: T): BufferGeometry
 
-    private fun Mesh.applyEdges(obj: T) {
-        children.find { it.name == "edges" }?.let { remove(it) }
-        //inherited edges definition, enabled by default
-        if (obj.getProperty(EDGES_ENABLED_KEY).boolean != false) {
-            val material = obj.getProperty(EDGES_MATERIAL_KEY).node.jsLineMaterial()
-            add(
-                LineSegments(
-                    EdgesGeometry(geometry as BufferGeometry),
-                    material
-                )
-            )
-        }
-    }
-
-    private fun Mesh.applyWireFrame(obj: T) {
-        children.find { it.name == "wireframe" }?.let { remove(it) }
-        //inherited wireframe definition, disabled by default
-        if (obj.getProperty(WIREFRAME_ENABLED_KEY).boolean == true) {
-            val material = obj.getProperty(WIREFRAME_MATERIAL_KEY).node.jsLineMaterial()
-            add(
-                LineSegments(
-                    WireframeGeometry(geometry as BufferGeometry),
-                    material
-                )
-            )
-        }
-    }
-
     override fun invoke(obj: T): Mesh {
-        //TODO add caching for geometries using templates
         val geometry = buildGeometry(obj)
 
         //JS sometimes tries to pass Geometry as BufferGeometry
         @Suppress("USELESS_IS_CHECK") if (geometry !is BufferGeometry) error("BufferGeometry expected")
 
-        val mesh = Mesh(geometry, obj.material.jsMaterial()).apply {
+        //val meshMeta: Meta = obj.properties[Material3D.MATERIAL_KEY]?.node ?: Meta.empty
+
+        val mesh = Mesh(geometry, MeshBasicMaterial()).apply {
             matrixAutoUpdate = false
             applyEdges(obj)
             applyWireFrame(obj)
+
             //set position for mesh
             updatePosition(obj)
 
+            //set color for mesh
+            updateMaterial(obj)
+
             layers.enable(obj.layer)
             children.forEach {
                 it.layers.enable(obj.layer)
@@ -78,7 +57,14 @@ abstract class MeshThreeFactory<T : VisualObject3D>(
         //add listener to object properties
         obj.onPropertyChange(this) { name, _, _ ->
             when {
-                name.startsWith(VisualObject3D.GEOMETRY_KEY) -> mesh.geometry = buildGeometry(obj)
+                name.startsWith(VisualObject3D.GEOMETRY_KEY) -> {
+                    val oldGeometry = mesh.geometry as BufferGeometry
+                    val newGeometry = buildGeometry(obj)
+                    oldGeometry.attributes = newGeometry.attributes
+                    mesh.applyWireFrame(obj)
+                    mesh.applyEdges(obj)
+                    newGeometry.dispose()
+                }
                 name.startsWith(WIREFRAME_KEY) -> mesh.applyWireFrame(obj)
                 name.startsWith(EDGES_KEY) -> mesh.applyEdges(obj)
                 else -> mesh.updateProperty(obj, name)
@@ -96,4 +82,43 @@ abstract class MeshThreeFactory<T : VisualObject3D>(
         val WIREFRAME_ENABLED_KEY = WIREFRAME_KEY + ENABLED_KEY
         val WIREFRAME_MATERIAL_KEY = WIREFRAME_KEY + Material3D.MATERIAL_KEY
     }
+}
+
+fun Mesh.applyEdges(obj: VisualObject3D) {
+    children.find { it.name == "edges" }?.let {
+        remove(it)
+        (it as LineSegments).dispose()
+    }
+    //inherited edges definition, enabled by default
+    if (obj.getProperty(MeshThreeFactory.EDGES_ENABLED_KEY).boolean != false) {
+
+        val material = ThreeMaterials.getLineMaterial(obj.getProperty(MeshThreeFactory.EDGES_MATERIAL_KEY).node)
+        add(
+            LineSegments(
+                EdgesGeometry(geometry as BufferGeometry),
+                material
+            ).apply {
+                name = "edges"
+            }
+        )
+    }
+}
+
+fun Mesh.applyWireFrame(obj: VisualObject3D) {
+    children.find { it.name == "wireframe" }?.let {
+        remove(it)
+        (it as LineSegments).dispose()
+    }
+    //inherited wireframe definition, disabled by default
+    if (obj.getProperty(MeshThreeFactory.WIREFRAME_ENABLED_KEY).boolean == true) {
+        val material = ThreeMaterials.getLineMaterial(obj.getProperty(MeshThreeFactory.WIREFRAME_MATERIAL_KEY).node)
+        add(
+            LineSegments(
+                WireframeGeometry(geometry as BufferGeometry),
+                material
+            ).apply {
+                name = "wireframe"
+            }
+        )
+    }
 }
\ No newline at end of file
diff --git a/dataforge-vis-spatial/src/jsMain/kotlin/hep/dataforge/vis/spatial/three/ThreeCanvas.kt b/dataforge-vis-spatial/src/jsMain/kotlin/hep/dataforge/vis/spatial/three/ThreeCanvas.kt
new file mode 100644
index 00000000..47695be4
--- /dev/null
+++ b/dataforge-vis-spatial/src/jsMain/kotlin/hep/dataforge/vis/spatial/three/ThreeCanvas.kt
@@ -0,0 +1,105 @@
+package hep.dataforge.vis.spatial.three
+
+import hep.dataforge.context.Context
+import hep.dataforge.meta.Meta
+import hep.dataforge.meta.get
+import hep.dataforge.meta.string
+import hep.dataforge.output.Renderer
+import hep.dataforge.vis.common.Colors
+import hep.dataforge.vis.spatial.VisualObject3D
+import hep.dataforge.vis.spatial.specifications.CameraSpec
+import hep.dataforge.vis.spatial.specifications.CanvasSpec
+import hep.dataforge.vis.spatial.specifications.ControlsSpec
+import info.laht.threekt.WebGLRenderer
+import info.laht.threekt.cameras.PerspectiveCamera
+import info.laht.threekt.external.controls.OrbitControls
+import info.laht.threekt.external.controls.TrackballControls
+import info.laht.threekt.helpers.AxesHelper
+import info.laht.threekt.scenes.Scene
+import org.w3c.dom.HTMLElement
+import org.w3c.dom.Node
+import kotlin.browser.window
+import kotlin.dom.clear
+import kotlin.math.cos
+import kotlin.math.max
+import kotlin.math.sin
+
+class ThreeCanvas(val three: ThreePlugin, val spec: CanvasSpec) : Renderer<VisualObject3D> {
+
+    override val context: Context get() = three.context
+
+    var content: VisualObject3D? = null
+        private set
+
+    val axes = AxesHelper(spec.axes.size.toInt()).apply {
+        visible = spec.axes.visible
+    }
+
+    val scene: Scene = Scene().apply {
+        add(axes)
+    }
+
+    val camera = buildCamera(spec.camera)
+
+    private fun buildCamera(spec: CameraSpec) = PerspectiveCamera(
+        spec.fov,
+        1.0,
+        spec.nearClip,
+        spec.farClip
+    ).apply {
+        translateX(spec.distance* sin(spec.zenith) * sin(spec.azimuth))
+        translateY(spec.distance* cos(spec.zenith))
+        translateZ(spec.distance * sin(spec.zenith) * cos(spec.azimuth))
+    }
+
+    private fun addControls(element: Node, controlsSpec: ControlsSpec) {
+        when (controlsSpec["type"].string) {
+            "trackball" -> TrackballControls(camera, element)
+            else -> OrbitControls(camera, element)
+        }
+    }
+
+    fun attach(element: HTMLElement) {
+        element.clear()
+
+        camera.aspect = 1.0
+
+        val renderer = WebGLRenderer { antialias = true }.apply {
+            setClearColor(Colors.skyblue, 1)
+
+        }
+
+        addControls(renderer.domElement, spec.controls)
+
+        fun animate() {
+            window.requestAnimationFrame {
+                animate()
+            }
+            renderer.render(scene, camera)
+        }
+
+        element.appendChild(renderer.domElement)
+
+        renderer.setSize(max(spec.minSize, element.offsetWidth), max(spec.minSize, element.offsetWidth))
+
+        element.onresize = {
+            renderer.setSize(element.offsetWidth, element.offsetWidth)
+            camera.updateProjectionMatrix()
+        }
+
+        animate()
+    }
+
+    override fun render(obj: VisualObject3D, meta: Meta) {
+        content = obj
+        val object3D = three.buildObject3D(obj)
+        scene.add(object3D)
+    }
+}
+
+fun ThreePlugin.output(element: HTMLElement? = null, spec: CanvasSpec = CanvasSpec.empty()): ThreeCanvas =
+    ThreeCanvas(this, spec).apply {
+        if (element != null) {
+            attach(element)
+        }
+    }
\ No newline at end of file
diff --git a/dataforge-vis-spatial/src/jsMain/kotlin/hep/dataforge/vis/spatial/three/ThreeFactory.kt b/dataforge-vis-spatial/src/jsMain/kotlin/hep/dataforge/vis/spatial/three/ThreeFactory.kt
index 94e71f5e..b3e76a20 100644
--- a/dataforge-vis-spatial/src/jsMain/kotlin/hep/dataforge/vis/spatial/three/ThreeFactory.kt
+++ b/dataforge-vis-spatial/src/jsMain/kotlin/hep/dataforge/vis/spatial/three/ThreeFactory.kt
@@ -16,9 +16,9 @@ import kotlin.reflect.KClass
  * Builder and updater for three.js object
  */
 @Type(TYPE)
-interface ThreeFactory<T : VisualObject3D> {
+interface ThreeFactory<in T : VisualObject> {
 
-    val type: KClass<out T>
+    val type: KClass<in T>
 
     operator fun invoke(obj: T): Object3D
 
@@ -30,7 +30,7 @@ interface ThreeFactory<T : VisualObject3D> {
 /**
  * Update position, rotation and visibility
  */
-internal fun Object3D.updatePosition(obj: VisualObject3D) {
+fun Object3D.updatePosition(obj: VisualObject3D) {
     visible = obj.visible ?: true
     position.set(obj.x, obj.y, obj.z)
     setRotationFromEuler(obj.euler)
@@ -38,22 +38,24 @@ internal fun Object3D.updatePosition(obj: VisualObject3D) {
     updateMatrix()
 }
 
-/**
- * Unsafe invocation of a factory
- */
-operator fun <T : VisualObject3D> ThreeFactory<T>.invoke(obj: Any): Object3D {
-    if (type.isInstance(obj)) {
-        @Suppress("UNCHECKED_CAST")
-        return invoke(obj as T)
-    } else {
-        error("The object of type ${obj::class} could not be rendered by this factory")
-    }
-}
+///**
+// * Unsafe invocation of a factory
+// */
+//operator fun <T : VisualObject3D> ThreeFactory<T>.invoke(obj: Any): Object3D {
+//    if (type.isInstance(obj)) {
+//        @Suppress("UNCHECKED_CAST")
+//        return invoke(obj as T)
+//    } else {
+//        error("The object of type ${obj::class} could not be rendered by this factory")
+//    }
+//}
 
+/**
+ * Update non-position non-geometry property
+ */
 fun Object3D.updateProperty(source: VisualObject, propertyName: Name) {
     if (this is Mesh && propertyName.startsWith(MATERIAL_KEY)) {
-        //updated material
-        material = source.material.jsMaterial()
+        updateMaterial(source)
     } else if (
         source is VisualObject3D &&
         (propertyName.startsWith(VisualObject3D.position)
diff --git a/dataforge-vis-spatial/src/jsMain/kotlin/hep/dataforge/vis/spatial/three/ThreeGeometryBuilder.kt b/dataforge-vis-spatial/src/jsMain/kotlin/hep/dataforge/vis/spatial/three/ThreeGeometryBuilder.kt
index a7a6b606..c45d6caa 100644
--- a/dataforge-vis-spatial/src/jsMain/kotlin/hep/dataforge/vis/spatial/three/ThreeGeometryBuilder.kt
+++ b/dataforge-vis-spatial/src/jsMain/kotlin/hep/dataforge/vis/spatial/three/ThreeGeometryBuilder.kt
@@ -10,6 +10,9 @@ import info.laht.threekt.core.Face3
 import info.laht.threekt.core.Geometry
 import info.laht.threekt.math.Vector3
 
+/**
+ * An implementation of geometry builder for Three.js [BufferGeometry]
+ */
 class ThreeGeometryBuilder : GeometryBuilder<BufferGeometry> {
 
     private val vertices = ArrayList<Point3D>()
diff --git a/dataforge-vis-spatial/src/jsMain/kotlin/hep/dataforge/vis/spatial/three/ThreeLabelFactory.kt b/dataforge-vis-spatial/src/jsMain/kotlin/hep/dataforge/vis/spatial/three/ThreeLabelFactory.kt
new file mode 100644
index 00000000..08699726
--- /dev/null
+++ b/dataforge-vis-spatial/src/jsMain/kotlin/hep/dataforge/vis/spatial/three/ThreeLabelFactory.kt
@@ -0,0 +1,56 @@
+package hep.dataforge.vis.spatial.three
+
+import hep.dataforge.vis.spatial.Label3D
+import hep.dataforge.vis.spatial.color
+import info.laht.threekt.DoubleSide
+import info.laht.threekt.core.Object3D
+import info.laht.threekt.geometries.PlaneBufferGeometry
+import info.laht.threekt.materials.MeshBasicMaterial
+import info.laht.threekt.objects.Mesh
+import info.laht.threekt.textures.Texture
+import org.w3c.dom.CanvasRenderingContext2D
+import org.w3c.dom.CanvasTextBaseline
+import org.w3c.dom.HTMLCanvasElement
+import org.w3c.dom.MIDDLE
+import kotlin.browser.document
+import kotlin.reflect.KClass
+
+/**
+ * Using example from http://stemkoski.github.io/Three.js/Texture-From-Canvas.html
+ */
+object ThreeLabelFactory : ThreeFactory<Label3D> {
+    override val type: KClass<in Label3D> get() = Label3D::class
+
+    override fun invoke(obj: Label3D): Object3D {
+        val canvas = document.createElement("canvas") as HTMLCanvasElement
+        val context = canvas.getContext("2d") as CanvasRenderingContext2D
+        context.font = "Bold ${obj.fontSize}pt ${obj.fontFamily}"
+        context.fillStyle = obj.color ?: "black"
+        context.textBaseline = CanvasTextBaseline.MIDDLE
+        val metrics = context.measureText(obj.text)
+        //canvas.width = metrics.width.toInt()
+
+
+        context.fillText(obj.text, (canvas.width - metrics.width)/2, 0.5*canvas.height)
+
+
+        // canvas contents will be used for a texture
+        val texture = Texture(canvas)
+        texture.needsUpdate = true
+
+        val material = MeshBasicMaterial().apply {
+            map = texture
+            side = DoubleSide
+            transparent = true
+        }
+
+        val mesh = Mesh(
+            PlaneBufferGeometry(canvas.width, canvas.height),
+            material
+        )
+
+        mesh.updatePosition(obj)
+
+        return mesh
+    }
+}
\ No newline at end of file
diff --git a/dataforge-vis-spatial/src/jsMain/kotlin/hep/dataforge/vis/spatial/three/ThreeLineFactory.kt b/dataforge-vis-spatial/src/jsMain/kotlin/hep/dataforge/vis/spatial/three/ThreeLineFactory.kt
index cb109e8b..d2e8d52e 100644
--- a/dataforge-vis-spatial/src/jsMain/kotlin/hep/dataforge/vis/spatial/three/ThreeLineFactory.kt
+++ b/dataforge-vis-spatial/src/jsMain/kotlin/hep/dataforge/vis/spatial/three/ThreeLineFactory.kt
@@ -1,27 +1,32 @@
 package hep.dataforge.vis.spatial.three
 
+import hep.dataforge.meta.node
 import hep.dataforge.vis.spatial.PolyLine
-import hep.dataforge.vis.spatial.layer
-import hep.dataforge.vis.spatial.material
+import hep.dataforge.vis.spatial.color
+import hep.dataforge.vis.spatial.three.ThreeMaterials.DEFAULT_LINE_COLOR
 import info.laht.threekt.core.Geometry
 import info.laht.threekt.core.Object3D
+import info.laht.threekt.math.Color
 import info.laht.threekt.objects.LineSegments
 import kotlin.reflect.KClass
 
 object ThreeLineFactory : ThreeFactory<PolyLine> {
-    override val type: KClass<out PolyLine> get() = PolyLine::class
+    override val type: KClass<PolyLine> get() = PolyLine::class
 
     override fun invoke(obj: PolyLine): Object3D {
         val geometry = Geometry().apply {
             vertices = obj.points.toTypedArray()
         }
 
-        val material = obj.material.jsLineMaterial()
+        val material =
+            ThreeMaterials.getLineMaterial(obj.getProperty(MeshThreeFactory.EDGES_MATERIAL_KEY).node)
+
+        material.linewidth = obj.thickness.toDouble()
+        material.color = obj.color?.let { Color(it) }?: DEFAULT_LINE_COLOR
+
         return LineSegments(geometry, material).apply {
-
             updatePosition(obj)
-            layers.enable(obj.layer)
-
+            //layers.enable(obj.layer)
             //add listener to object properties
             obj.onPropertyChange(this) { propertyName, _, _ ->
                 updateProperty(obj, propertyName)
diff --git a/dataforge-vis-spatial/src/jsMain/kotlin/hep/dataforge/vis/spatial/three/ThreeMaterials.kt b/dataforge-vis-spatial/src/jsMain/kotlin/hep/dataforge/vis/spatial/three/ThreeMaterials.kt
new file mode 100644
index 00000000..aa09b2d3
--- /dev/null
+++ b/dataforge-vis-spatial/src/jsMain/kotlin/hep/dataforge/vis/spatial/three/ThreeMaterials.kt
@@ -0,0 +1,113 @@
+package hep.dataforge.vis.spatial.three
+
+import hep.dataforge.meta.*
+import hep.dataforge.values.ValueType
+import hep.dataforge.vis.common.Colors
+import hep.dataforge.vis.common.VisualObject
+import hep.dataforge.vis.spatial.Material3D
+import info.laht.threekt.materials.LineBasicMaterial
+import info.laht.threekt.materials.MeshBasicMaterial
+import info.laht.threekt.materials.MeshPhongMaterial
+import info.laht.threekt.math.Color
+import info.laht.threekt.objects.Mesh
+
+
+object ThreeMaterials {
+    val DEFAULT_COLOR = Color(Colors.darkgreen)
+    val DEFAULT = MeshPhongMaterial().apply {
+        color.set(DEFAULT_COLOR)
+    }
+    val DEFAULT_LINE_COLOR = Color(Colors.black)
+    val DEFAULT_LINE = LineBasicMaterial().apply {
+        color.set(DEFAULT_LINE_COLOR)
+    }
+
+
+    //    private val materialCache = HashMap<Meta, Material>()
+    private val lineMaterialCache = HashMap<Meta?, LineBasicMaterial>()
+
+
+//    fun buildMaterial(meta: Meta): Material =
+//        MeshBasicMaterial().apply {
+//            color = meta["color"]?.color() ?: DEFAULT_COLOR
+//            opacity = meta["opacity"]?.double ?: 1.0
+//            transparent = meta["transparent"].boolean ?: (opacity < 1.0)
+//            //node["specularColor"]?.let { specular = it.color() }
+//            //side = 2
+//        }
+
+    fun getLineMaterial(meta: Meta?): LineBasicMaterial = lineMaterialCache.getOrPut(meta) {
+        LineBasicMaterial().apply {
+            color = meta[Material3D.COLOR_KEY]?.color() ?: DEFAULT_LINE_COLOR
+            opacity = meta[Material3D.OPACITY_KEY].double ?: 1.0
+            transparent = opacity < 1.0
+            linewidth = meta["thickness"].double ?: 1.0
+        }
+    }
+}
+
+/**
+ * Infer color based on meta item
+ */
+fun MetaItem<*>.color(): Color {
+    return when (this) {
+        is MetaItem.ValueItem -> if (this.value.type == ValueType.NUMBER) {
+            val int = value.number.toInt()
+            Color(int)
+        } else {
+            Color(this.value.string)
+        }
+        is MetaItem.NodeItem -> {
+            Color(
+                node[Colors.RED_KEY]?.int ?: 0,
+                node[Colors.GREEN_KEY]?.int ?: 0,
+                node[Colors.BLUE_KEY]?.int ?: 0
+            )
+        }
+    }
+}
+
+///**
+// * Infer Three material based on meta item
+// */
+//fun Meta?.jsMaterial(): Material {
+//    return if (this == null) {
+//        ThreeMaterials.DEFAULT
+//    } else {
+//        ThreeMaterials.buildMaterial(this)
+//    }
+//}
+//
+//fun Meta?.jsLineMaterial(): Material {
+//    return if (this == null) {
+//        ThreeMaterials.DEFAULT_LINE
+//    } else {
+//        ThreeMaterials.buildLineMaterial(this)
+//    }
+//}
+
+
+//fun Material3D?.jsMaterial(): Material = this?.config.jsMaterial()
+//fun Material3D?.jsLineMaterial(): Material = this?.config.jsLineMaterial()
+
+fun Mesh.updateMaterial(obj: VisualObject) {
+    val meta = obj.getProperty(Material3D.MATERIAL_KEY).node ?: EmptyMeta
+    material = if(meta[Material3D.SPECULAR_COLOR]!= null){
+        MeshPhongMaterial().apply {
+            color = meta[Material3D.COLOR_KEY]?.color() ?: ThreeMaterials.DEFAULT_COLOR
+            specular = meta[Material3D.SPECULAR_COLOR]!!.color()
+            opacity = meta[Material3D.OPACITY_KEY]?.double ?: 1.0
+            transparent = opacity < 1.0
+            wireframe = meta[Material3D.WIREFRAME_KEY].boolean ?: false
+            needsUpdate = true
+        }
+    }else {
+        MeshBasicMaterial().apply {
+            color = meta[Material3D.COLOR_KEY]?.color() ?: ThreeMaterials.DEFAULT_COLOR
+            opacity = meta[Material3D.OPACITY_KEY]?.double ?: 1.0
+            transparent = opacity < 1.0
+            wireframe = meta[Material3D.WIREFRAME_KEY].boolean ?: false
+            needsUpdate = true
+        }
+    }
+}
diff --git a/dataforge-vis-spatial/src/jsMain/kotlin/hep/dataforge/vis/spatial/three/ThreeOutput.kt b/dataforge-vis-spatial/src/jsMain/kotlin/hep/dataforge/vis/spatial/three/ThreeOutput.kt
deleted file mode 100644
index 0952f78e..00000000
--- a/dataforge-vis-spatial/src/jsMain/kotlin/hep/dataforge/vis/spatial/three/ThreeOutput.kt
+++ /dev/null
@@ -1,76 +0,0 @@
-package hep.dataforge.vis.spatial.three
-
-import hep.dataforge.context.Context
-import hep.dataforge.meta.*
-import hep.dataforge.output.Output
-import hep.dataforge.vis.common.Colors
-import hep.dataforge.vis.spatial.VisualObject3D
-import info.laht.threekt.WebGLRenderer
-import info.laht.threekt.helpers.AxesHelper
-import info.laht.threekt.lights.AmbientLight
-import info.laht.threekt.scenes.Scene
-import org.w3c.dom.HTMLElement
-import kotlin.browser.window
-import kotlin.dom.clear
-import kotlin.math.max
-
-class ThreeOutput(val three: ThreePlugin, val meta: Meta = EmptyMeta) : Output<VisualObject3D> {
-
-    override val context: Context get() = three.context
-
-    val axes = AxesHelper(meta["axes.size"].int ?: 50).apply { visible = false }
-
-    val scene: Scene = Scene().apply {
-        add(AmbientLight())
-        if (meta["axes.visible"].boolean == true) {
-            axes.visible = true
-        }
-        add(axes)
-    }
-
-    val camera = three.buildCamera(meta["camera"].node ?: EmptyMeta)
-
-    fun attach(element: HTMLElement) {
-        element.clear()
-
-        camera.aspect = 1.0
-
-        val renderer = WebGLRenderer { antialias = true }.apply {
-            setClearColor(Colors.skyblue, 1)
-
-        }
-
-        three.addControls(camera, renderer.domElement, meta["controls"].node ?: EmptyMeta)
-
-        fun animate() {
-            window.requestAnimationFrame {
-                animate()
-            }
-            renderer.render(scene, camera)
-        }
-
-        element.appendChild(renderer.domElement)
-
-        val minSize by meta.number(0).int
-
-        renderer.setSize(max(minSize, element.offsetWidth), max(minSize, element.offsetWidth))
-
-        element.onresize = {
-            renderer.setSize(element.offsetWidth, element.offsetWidth)
-            camera.updateProjectionMatrix()
-        }
-
-        animate()
-    }
-
-    override fun render(obj: VisualObject3D, meta: Meta) {
-        scene.add(three.buildObject3D(obj))
-    }
-}
-
-fun ThreePlugin.output(element: HTMLElement? = null, meta: Meta = EmptyMeta, override: MetaBuilder.() -> Unit = {}) =
-    ThreeOutput(this, buildMeta(meta, override)).apply {
-        if (element != null) {
-            attach(element)
-        }
-    }
\ No newline at end of file
diff --git a/dataforge-vis-spatial/src/jsMain/kotlin/hep/dataforge/vis/spatial/three/ThreePlugin.kt b/dataforge-vis-spatial/src/jsMain/kotlin/hep/dataforge/vis/spatial/three/ThreePlugin.kt
index be1f7803..037a34f2 100644
--- a/dataforge-vis-spatial/src/jsMain/kotlin/hep/dataforge/vis/spatial/three/ThreePlugin.kt
+++ b/dataforge-vis-spatial/src/jsMain/kotlin/hep/dataforge/vis/spatial/three/ThreePlugin.kt
@@ -1,21 +1,11 @@
 package hep.dataforge.vis.spatial.three
 
-import hep.dataforge.context.AbstractPlugin
-import hep.dataforge.context.PluginFactory
-import hep.dataforge.context.PluginTag
-import hep.dataforge.context.content
-import hep.dataforge.meta.*
-import hep.dataforge.names.Name
-import hep.dataforge.names.asName
-import hep.dataforge.names.isEmpty
-import hep.dataforge.names.startsWith
+import hep.dataforge.context.*
+import hep.dataforge.meta.Meta
+import hep.dataforge.names.*
+import hep.dataforge.vis.common.VisualObject
 import hep.dataforge.vis.spatial.*
-import info.laht.threekt.cameras.Camera
-import info.laht.threekt.cameras.PerspectiveCamera
 import info.laht.threekt.core.Object3D
-import info.laht.threekt.external.controls.OrbitControls
-import info.laht.threekt.external.controls.TrackballControls
-import org.w3c.dom.Node
 import kotlin.collections.set
 import kotlin.reflect.KClass
 import info.laht.threekt.objects.Group as ThreeGroup
@@ -34,26 +24,29 @@ class ThreePlugin : AbstractPlugin() {
         objectFactories[Sphere::class] = ThreeSphereFactory
         objectFactories[ConeSegment::class] = ThreeCylinderFactory
         objectFactories[PolyLine::class] = ThreeLineFactory
+        objectFactories[Label3D::class] = ThreeLabelFactory
     }
 
-    private fun findObjectFactory(type: KClass<out VisualObject3D>): ThreeFactory<*>? {
-        return objectFactories[type]
-            ?: context.content<ThreeFactory<*>>(ThreeFactory.TYPE).values.find { it.type == type }
+    @Suppress("UNCHECKED_CAST")
+    private fun findObjectFactory(type: KClass<out VisualObject>): ThreeFactory<VisualObject3D>? {
+        return (objectFactories[type]
+            ?: context.content<ThreeFactory<*>>(ThreeFactory.TYPE).values.find { it.type == type })
+                as ThreeFactory<VisualObject3D>?
     }
 
     fun buildObject3D(obj: VisualObject3D): Object3D {
         return when (obj) {
+            is ThreeVisualObject -> obj.toObject3D()
             is Proxy -> proxyFactory(obj)
             is VisualGroup3D -> {
                 val group = ThreeGroup()
-                obj.children.forEach { (name, child) ->
+                obj.children.forEach { (token, child) ->
                     if (child is VisualObject3D && child.ignore != true) {
                         try {
                             val object3D = buildObject3D(child)
-                            object3D.name = name.toString()
-                            group.add(object3D)
+                            group[token] = object3D
                         } catch (ex: Throwable) {
-                            logger.error(ex) { "Failed to render $name" }
+                            logger.error(ex) { "Failed to render $child" }
                         }
                     }
                 }
@@ -74,12 +67,37 @@ class ThreePlugin : AbstractPlugin() {
                             visible = obj.visible ?: true
                         }
                     }
+
+                    obj.onChildrenChange(this) { name, child ->
+                        if (name.isEmpty()) {
+                            logger.error { "Children change with empty namr on $group" }
+                            return@onChildrenChange
+                        }
+
+                        val parentName = name.cutLast()
+                        val childName = name.last()!!
+
+                        //removing old object
+                        findChild(name)?.let { oldChild ->
+                            oldChild.parent?.remove(oldChild)
+                        }
+
+                        //adding new object
+                        if (child != null && child is VisualObject3D) {
+                            try {
+                                val object3D = buildObject3D(child)
+                                set(name, object3D)
+                            } catch (ex: Throwable) {
+                                logger.error(ex) { "Failed to render $child" }
+                            }
+                        }
+                    }
                 }
             }
             is Composite -> compositeFactory(obj)
             else -> {
                 //find specialized factory for this type if it is present
-                val factory = findObjectFactory(obj::class)
+                val factory: ThreeFactory<VisualObject3D>? = findObjectFactory(obj::class)
                 when {
                     factory != null -> factory(obj)
                     obj is Shape -> ThreeShapeFactory(obj)
@@ -89,35 +107,41 @@ class ThreePlugin : AbstractPlugin() {
         }
     }
 
-    fun buildCamera(meta: Meta) = PerspectiveCamera(
-        meta["fov"].int ?: 75,
-        meta["aspect"].double ?: 1.0,
-        meta["nearClip"].double ?: World.CAMERA_NEAR_CLIP,
-        meta["farClip"].double ?: World.CAMERA_FAR_CLIP
-    ).apply {
-        position.setZ(World.CAMERA_INITIAL_DISTANCE)
-        rotation.set(
-            World.CAMERA_INITIAL_X_ANGLE,
-            World.CAMERA_INITIAL_Y_ANGLE,
-            World.CAMERA_INITIAL_Z_ANGLE
-        )
-    }
-
-    fun addControls(camera: Camera, element: Node, meta: Meta) {
-        when (meta["type"].string) {
-            "trackball" -> TrackballControls(camera, element)
-            else -> OrbitControls(camera, element)
-        }
-    }
-
     companion object : PluginFactory<ThreePlugin> {
         override val tag = PluginTag("visual.three", PluginTag.DATAFORGE_GROUP)
         override val type = ThreePlugin::class
-        override fun invoke(meta: Meta) = ThreePlugin()
+        override fun invoke(meta: Meta, context: Context) = ThreePlugin()
     }
 }
 
-fun Object3D.findChild(name: Name): Object3D? {
+internal operator fun Object3D.set(token: NameToken, object3D: Object3D) {
+    object3D.name = token.toString()
+    add(object3D)
+}
+
+internal fun Object3D.getOrCreateGroup(name: Name): Object3D {
+    return when {
+        name.isEmpty() -> this
+        name.length == 1 -> {
+            val token = name.first()!!
+            children.find { it.name == token.toString() } ?: info.laht.threekt.objects.Group().also { group ->
+                group.name = token.toString()
+                this.add(group)
+            }
+        }
+        else -> getOrCreateGroup(name.first()!!.asName()).getOrCreateGroup(name.cutFirst())
+    }
+}
+
+internal operator fun Object3D.set(name: Name, obj: Object3D) {
+    when (name.length) {
+        0 -> error("Can't set object with an empty name")
+        1 -> set(name.first()!!, obj)
+        else -> getOrCreateGroup(name.cutLast())[name.last()!!] = obj
+    }
+}
+
+internal fun Object3D.findChild(name: Name): Object3D? {
     return when {
         name.isEmpty() -> this
         name.length == 1 -> this.children.find { it.name == name.first()!!.toString() }
diff --git a/dataforge-vis-spatial/src/jsMain/kotlin/hep/dataforge/vis/spatial/three/ThreeVisualObject.kt b/dataforge-vis-spatial/src/jsMain/kotlin/hep/dataforge/vis/spatial/three/ThreeVisualObject.kt
new file mode 100644
index 00000000..5970a76d
--- /dev/null
+++ b/dataforge-vis-spatial/src/jsMain/kotlin/hep/dataforge/vis/spatial/three/ThreeVisualObject.kt
@@ -0,0 +1,34 @@
+@file:UseSerializers(Point3DSerializer::class)
+
+package hep.dataforge.vis.spatial.three
+
+import hep.dataforge.io.serialization.ConfigSerializer
+import hep.dataforge.meta.Config
+import hep.dataforge.vis.common.AbstractVisualObject
+import hep.dataforge.vis.spatial.Point3D
+import hep.dataforge.vis.spatial.Point3DSerializer
+import hep.dataforge.vis.spatial.VisualObject3D
+import info.laht.threekt.core.Object3D
+import kotlinx.serialization.Serializable
+import kotlinx.serialization.UseSerializers
+
+/**
+ * A custom visual object that has its own Three.js renderer
+ */
+interface ThreeVisualObject : VisualObject3D {
+    fun toObject3D(): Object3D
+}
+
+@Serializable
+class CustomThreeVisualObject(val threeFactory: ThreeFactory<VisualObject3D>) : AbstractVisualObject(),
+    ThreeVisualObject {
+    override var position: Point3D? = null
+    override var rotation: Point3D? = null
+    override var scale: Point3D? = null
+
+    @Serializable(ConfigSerializer::class)
+    override var properties: Config? = null
+
+    override fun toObject3D(): Object3D = threeFactory(this)
+
+}
\ No newline at end of file
diff --git a/dataforge-vis-spatial/src/jsMain/kotlin/hep/dataforge/vis/spatial/three/outputConfig.kt b/dataforge-vis-spatial/src/jsMain/kotlin/hep/dataforge/vis/spatial/three/outputConfig.kt
new file mode 100644
index 00000000..1c582ee2
--- /dev/null
+++ b/dataforge-vis-spatial/src/jsMain/kotlin/hep/dataforge/vis/spatial/three/outputConfig.kt
@@ -0,0 +1,87 @@
+package hep.dataforge.vis.spatial.three
+
+import hep.dataforge.js.requireJS
+import hep.dataforge.vis.js.editor.card
+import hep.dataforge.vis.spatial.Visual3DPlugin
+import hep.dataforge.vis.spatial.VisualGroup3D
+import kotlinx.html.InputType
+import kotlinx.html.TagConsumer
+import kotlinx.html.button
+import kotlinx.html.dom.append
+import kotlinx.html.js.*
+import org.w3c.dom.Element
+import org.w3c.dom.HTMLElement
+import org.w3c.dom.events.Event
+import org.w3c.files.Blob
+import org.w3c.files.BlobPropertyBag
+import kotlin.dom.clear
+
+private fun saveData(event: Event, fileName: String, mimeType: String = "text/plain", dataBuilder: () -> String) {
+    event.stopPropagation();
+    event.preventDefault();
+
+    val fileSaver = requireJS("file-saver")
+    val blob = Blob(arrayOf(dataBuilder()), BlobPropertyBag("$mimeType;charset=utf-8"))
+    fileSaver.saveAs(blob, fileName)
+}
+
+fun Element.threeSettings(canvas: ThreeCanvas, block: TagConsumer<HTMLElement>.() -> Unit = {}) {
+    clear()
+    append {
+        card("Settings") {
+            div("row") {
+                div("col-2") {
+                    label("checkbox-inline") {
+                        input(type = InputType.checkBox).apply {
+                            checked = canvas.axes.visible
+                            onChangeFunction = {
+                                canvas.axes.visible = checked
+                            }
+                        }
+                        +"Axes"
+                    }
+                }
+                div("col-1") {
+                    button {
+                        +"Export"
+                        onClickFunction = {
+                            val json = (canvas.content as? VisualGroup3D)?.let { group ->
+                                Visual3DPlugin.json.stringify(
+                                    VisualGroup3D.serializer(),
+                                    group
+                                )
+                            }
+                            if (json != null) {
+                                saveData(it, "object.json", "text/json"){
+                                    json
+                                }
+                            }
+                        }
+                    }
+                }
+            }
+        }
+        card("Layers") {
+            div("row") {
+                (0..11).forEach { layer ->
+                    div("col-1") {
+                        label { +layer.toString() }
+                        input(type = InputType.checkBox).apply {
+                            if (layer == 0) {
+                                checked = true
+                            }
+                            onChangeFunction = {
+                                if (checked) {
+                                    canvas.camera.layers.enable(layer)
+                                } else {
+                                    canvas.camera.layers.disable(layer)
+                                }
+                            }
+                        }
+                    }
+                }
+            }
+        }
+        block()
+    }
+}
\ No newline at end of file
diff --git a/dataforge-vis-spatial/src/jsMain/kotlin/hep/dataforge/vis/spatial/three/three.kt b/dataforge-vis-spatial/src/jsMain/kotlin/hep/dataforge/vis/spatial/three/three.kt
index 730e7550..9f3a7985 100644
--- a/dataforge-vis-spatial/src/jsMain/kotlin/hep/dataforge/vis/spatial/three/three.kt
+++ b/dataforge-vis-spatial/src/jsMain/kotlin/hep/dataforge/vis/spatial/three/three.kt
@@ -6,21 +6,16 @@ import hep.dataforge.meta.get
 import hep.dataforge.meta.node
 import hep.dataforge.vis.spatial.*
 import info.laht.threekt.core.BufferGeometry
+import info.laht.threekt.core.DirectGeometry
 import info.laht.threekt.core.Face3
 import info.laht.threekt.core.Geometry
-import info.laht.threekt.core.Object3D
+import info.laht.threekt.external.controls.OrbitControls
+import info.laht.threekt.materials.Material
 import info.laht.threekt.math.Euler
 import info.laht.threekt.math.Vector3
-
-/**
- * Utility methods for three.kt.
- * TODO move to three project
- */
-
-@Suppress("FunctionName")
-fun Group(children: Collection<Object3D>) = info.laht.threekt.objects.Group().apply {
-    children.forEach { this.add(it) }
-}
+import info.laht.threekt.objects.Mesh
+import info.laht.threekt.textures.Texture
+import kotlin.math.PI
 
 val VisualObject3D.euler get() = Euler(rotationX, rotationY, rotationZ, rotationOrder.name)
 
@@ -28,6 +23,8 @@ val MetaItem<*>.vector get() = Vector3(node["x"].float ?: 0f, node["y"].float ?:
 
 fun Geometry.toBufferGeometry(): BufferGeometry = BufferGeometry().apply { fromGeometry(this@toBufferGeometry) }
 
+internal fun Double.toRadians() = this * PI / 180
+
 fun CSG.toGeometry(): Geometry {
     val geom = Geometry()
 
@@ -43,7 +40,7 @@ fun CSG.toGeometry(): Geometry {
         }
 
         for (j in 3..polygon.vertices.size) {
-            val fc = Face3(v0, v0 + j - 2, v0 + j - 1, zero)
+            val fc = Face3(v0, v0 + j - 2, v0 + j - 1, World.ZERO)
             fc.vertexNormals = arrayOf(
                 Vector3().copy(pvs[0].normal),
                 Vector3().copy(pvs[j - 2].normal),
@@ -64,4 +61,19 @@ fun CSG.toGeometry(): Geometry {
     geom.computeBoundingSphere()
     geom.computeBoundingBox()
     return geom
+}
+
+internal fun Any.dispose() {
+    when (this) {
+        is Geometry -> dispose()
+        is BufferGeometry -> dispose()
+        is DirectGeometry -> dispose()
+        is Material -> dispose()
+        is Mesh -> {
+            geometry.dispose()
+            material.dispose()
+        }
+        is OrbitControls -> dispose()
+        is Texture -> dispose()
+    }
 }
\ No newline at end of file
diff --git a/dataforge-vis-spatial/src/jvmMain/kotlin/hep/dataforge/vis/spatial/fx/Canvas3D.kt b/dataforge-vis-spatial/src/jvmMain/kotlin/hep/dataforge/vis/spatial/fx/Canvas3D.kt
deleted file mode 100644
index 211c0d41..00000000
--- a/dataforge-vis-spatial/src/jvmMain/kotlin/hep/dataforge/vis/spatial/fx/Canvas3D.kt
+++ /dev/null
@@ -1,166 +0,0 @@
-package hep.dataforge.vis.spatial.fx
-
-import hep.dataforge.vis.spatial.World.CAMERA_FAR_CLIP
-import hep.dataforge.vis.spatial.World.CAMERA_INITIAL_DISTANCE
-import hep.dataforge.vis.spatial.World.CAMERA_INITIAL_X_ANGLE
-import hep.dataforge.vis.spatial.World.CAMERA_INITIAL_Y_ANGLE
-import hep.dataforge.vis.spatial.World.CAMERA_INITIAL_Z_ANGLE
-import hep.dataforge.vis.spatial.World.CAMERA_NEAR_CLIP
-import javafx.event.EventHandler
-import javafx.scene.*
-import javafx.scene.input.KeyCode
-import javafx.scene.input.KeyEvent
-import javafx.scene.input.MouseEvent
-import javafx.scene.input.ScrollEvent
-import javafx.scene.paint.Color
-import org.fxyz3d.utils.CameraTransformer
-import tornadofx.*
-
-class Canvas3D : Fragment() {
-    val world: Group = Group()
-
-    private val camera = PerspectiveCamera().apply {
-        nearClip = CAMERA_NEAR_CLIP
-        farClip = CAMERA_FAR_CLIP
-        translateZ = CAMERA_INITIAL_DISTANCE
-    }
-
-    private val cameraShift = CameraTransformer().apply {
-        val cameraFlip = CameraTransformer()
-        cameraFlip.children.add(camera)
-        cameraFlip.setRotateZ(180.0)
-        children.add(cameraFlip)
-    }
-
-    val translationXProperty get() = cameraShift.t.xProperty()
-    var translateX by translationXProperty
-    val translationYProperty get() = cameraShift.t.yProperty()
-    var translateY by translationYProperty
-    val translationZProperty get() = cameraShift.t.zProperty()
-    var translateZ by translationZProperty
-
-    private val cameraRotation = CameraTransformer().apply {
-        children.add(cameraShift)
-        ry.angle = CAMERA_INITIAL_Y_ANGLE
-        rx.angle = CAMERA_INITIAL_X_ANGLE
-        rz.angle = CAMERA_INITIAL_Z_ANGLE
-    }
-
-    val rotationXProperty get() = cameraRotation.rx.angleProperty()
-    var angleX by rotationXProperty
-    val rotationYProperty get() = cameraRotation.ry.angleProperty()
-    var angleY by rotationYProperty
-    val rotationZProperty get() = cameraRotation.rz.angleProperty()
-    var angleZ by rotationZProperty
-
-
-    override val root = borderpane {
-        center = SubScene(
-            Group(world, cameraRotation).apply { DepthTest.ENABLE },
-            1024.0,
-            768.0,
-            true,
-            SceneAntialiasing.BALANCED
-        ).apply {
-            fill = Color.GREY
-            this.camera = this@Canvas3D.camera
-            id = "canvas"
-            handleKeyboard(this)
-            handleMouse(this)
-        }
-    }
-
-
-    private fun handleKeyboard(scene: SubScene) {
-        scene.onKeyPressed = EventHandler<KeyEvent> { event ->
-            if (event.isControlDown) {
-                when (event.code) {
-                    KeyCode.Z -> {
-                        cameraShift.t.x = 0.0
-                        cameraShift.t.y = 0.0
-                        camera.translateZ = CAMERA_INITIAL_DISTANCE
-                        cameraRotation.ry.angle = CAMERA_INITIAL_Y_ANGLE
-                        cameraRotation.rx.angle = CAMERA_INITIAL_X_ANGLE
-                    }
-//                    KeyCode.X -> axisGroup.isVisible = !axisGroup.isVisible
-//                    KeyCode.S -> snapshot()
-//                    KeyCode.DIGIT1 -> pixelMap.filterKeys { it.getLayerNumber() == 1 }.values.forEach {
-//                        toggleTransparency(
-//                            it
-//                        )
-//                    }
-//                    KeyCode.DIGIT2 -> pixelMap.filterKeys { it.getLayerNumber() == 2 }.values.forEach {
-//                        toggleTransparency(
-//                            it
-//                        )
-//                    }
-//                    KeyCode.DIGIT3 -> pixelMap.filterKeys { it.getLayerNumber() == 3 }.values.forEach {
-//                        toggleTransparency(
-//                            it
-//                        )
-//                    }
-                    else -> {
-                    }//do nothing
-                }
-            }
-        }
-    }
-
-    private fun handleMouse(scene: SubScene) {
-
-        var mousePosX: Double = 0.0
-        var mousePosY: Double = 0.0
-        var mouseOldX: Double = 0.0
-        var mouseOldY: Double = 0.0
-        var mouseDeltaX: Double = 0.0
-        var mouseDeltaY: Double = 0.0
-
-        scene.onMousePressed = EventHandler<MouseEvent> { me ->
-            mousePosX = me.sceneX
-            mousePosY = me.sceneY
-            mouseOldX = me.sceneX
-            mouseOldY = me.sceneY
-        }
-
-        scene.onMouseDragged = EventHandler<MouseEvent> { me ->
-            mouseOldX = mousePosX
-            mouseOldY = mousePosY
-            mousePosX = me.sceneX
-            mousePosY = me.sceneY
-            mouseDeltaX = mousePosX - mouseOldX
-            mouseDeltaY = mousePosY - mouseOldY
-
-            val modifier = when {
-                me.isControlDown -> CONTROL_MULTIPLIER
-                me.isShiftDown -> SHIFT_MULTIPLIER
-                else -> 1.0
-            }
-
-            if (me.isPrimaryButtonDown) {
-                cameraRotation.rz.angle =
-                    cameraRotation.rz.angle + mouseDeltaX * MOUSE_SPEED * modifier * ROTATION_SPEED
-                cameraRotation.rx.angle =
-                    cameraRotation.rx.angle + mouseDeltaY * MOUSE_SPEED * modifier * ROTATION_SPEED
-            } else if (me.isSecondaryButtonDown) {
-                cameraShift.t.x = cameraShift.t.x + mouseDeltaX * MOUSE_SPEED * modifier * TRACK_SPEED
-                cameraShift.t.y = cameraShift.t.y + mouseDeltaY * MOUSE_SPEED * modifier * TRACK_SPEED
-            }
-        }
-        scene.onScroll = EventHandler<ScrollEvent> { event ->
-            val z = camera.translateZ
-            val newZ = z + MOUSE_SPEED * event.deltaY * RESIZE_SPEED
-            camera.translateZ = newZ
-        }
-    }
-
-    companion object {
-        private const val AXIS_LENGTH = 2000.0
-        private const val CONTROL_MULTIPLIER = 0.1
-        private const val SHIFT_MULTIPLIER = 10.0
-        private const val MOUSE_SPEED = 0.1
-        private const val ROTATION_SPEED = 2.0
-        private const val TRACK_SPEED = 6.0
-        private const val RESIZE_SPEED = 50.0
-        private const val LINE_WIDTH = 3.0
-    }
-}
\ No newline at end of file
diff --git a/dataforge-vis-spatial/src/jvmMain/kotlin/hep/dataforge/vis/spatial/fx/DisplayObjectFXListener.kt b/dataforge-vis-spatial/src/jvmMain/kotlin/hep/dataforge/vis/spatial/fx/DisplayObjectFXListener.kt
deleted file mode 100644
index b0d3089e..00000000
--- a/dataforge-vis-spatial/src/jvmMain/kotlin/hep/dataforge/vis/spatial/fx/DisplayObjectFXListener.kt
+++ /dev/null
@@ -1,42 +0,0 @@
-package hep.dataforge.vis.spatial.fx
-
-import hep.dataforge.meta.*
-import hep.dataforge.names.Name
-import hep.dataforge.names.toName
-import hep.dataforge.vis.common.VisualObject
-import javafx.beans.binding.ObjectBinding
-import tornadofx.*
-
-/**
- * A caching binding collection for [VisualObject] properties
- */
-class DisplayObjectFXListener(val obj: VisualObject) {
-    private val binndings = HashMap<Name, ObjectBinding<MetaItem<*>?>>()
-
-    init {
-        obj.onPropertyChange(this) { name, _, _ ->
-            binndings[name]?.invalidate()
-        }
-    }
-
-    operator fun get(key: Name): ObjectBinding<MetaItem<*>?> {
-        return binndings.getOrPut(key) {
-            object : ObjectBinding<MetaItem<*>?>() {
-                override fun computeValue(): MetaItem<*>? = obj.getProperty(key)
-            }
-        }
-    }
-
-    operator fun get(key: String) = get(key.toName())
-}
-
-fun ObjectBinding<MetaItem<*>?>.value() = this.objectBinding { it.value }
-fun ObjectBinding<MetaItem<*>?>.string() = this.stringBinding { it.string }
-fun ObjectBinding<MetaItem<*>?>.number() = this.objectBinding { it.number }
-fun ObjectBinding<MetaItem<*>?>.double() = this.objectBinding { it.double }
-fun ObjectBinding<MetaItem<*>?>.float() = this.objectBinding { it.number?.toFloat() }
-fun ObjectBinding<MetaItem<*>?>.int() = this.objectBinding { it.int }
-fun ObjectBinding<MetaItem<*>?>.long() = this.objectBinding { it.long }
-fun ObjectBinding<MetaItem<*>?>.node() = this.objectBinding { it.node }
-
-fun <T> ObjectBinding<MetaItem<*>?>.transform(transform: (MetaItem<*>) -> T) = this.objectBinding { it?.let(transform) }
diff --git a/dataforge-vis-spatial/src/jvmMain/kotlin/hep/dataforge/vis/spatial/fx/FX3DOutput.kt b/dataforge-vis-spatial/src/jvmMain/kotlin/hep/dataforge/vis/spatial/fx/FX3DOutput.kt
deleted file mode 100644
index b910b17e..00000000
--- a/dataforge-vis-spatial/src/jvmMain/kotlin/hep/dataforge/vis/spatial/fx/FX3DOutput.kt
+++ /dev/null
@@ -1,50 +0,0 @@
-package hep.dataforge.vis.spatial.fx
-
-import hep.dataforge.context.Context
-import hep.dataforge.meta.Meta
-import hep.dataforge.output.Output
-import hep.dataforge.vis.common.VisualObject
-import hep.dataforge.vis.spatial.Box
-import hep.dataforge.vis.spatial.VisualGroup3D
-import javafx.scene.Group
-import javafx.scene.Node
-import org.fxyz3d.shapes.primitives.CuboidMesh
-import tornadofx.*
-
-/**
- * https://github.com/miho/JCSG for operations
- *
- */
-class FX3DOutput(override val context: Context) : Output<VisualObject> {
-    val canvas by lazy { Canvas3D() }
-
-
-    private fun buildNode(obj: VisualObject): Node? {
-        val listener = DisplayObjectFXListener(obj)
-        val x = listener["pos.x"].float()
-        val y = listener["pos.y"].float()
-        val z = listener["pos.z"].float()
-        val center = objectBinding(x, y, z) {
-            org.fxyz3d.geometry.Point3D(x.value ?: 0f, y.value ?: 0f, z.value ?: 0f)
-        }
-        return when (obj) {
-            is VisualGroup3D -> Group(obj.map { buildNode(it) }).apply {
-                this.translateXProperty().bind(x)
-                this.translateYProperty().bind(y)
-                this.translateZProperty().bind(z)
-            }
-            is Box -> CuboidMesh(obj.xSize.toDouble(), obj.ySize.toDouble(), obj.zSize.toDouble()).apply {
-                this.centerProperty().bind(center)
-                this.materialProperty().bind(listener["color"].transform { it.material() })
-            }
-            else -> {
-                logger.error { "No renderer defined for ${obj::class}" }
-                null
-            }
-        }
-    }
-
-    override fun render(obj: VisualObject, meta: Meta) {
-        buildNode(obj)?.let { canvas.world.children.add(it) }
-    }
-}
\ No newline at end of file
diff --git a/dataforge-vis-spatial/src/jvmMain/kotlin/hep/dataforge/vis/spatial/fx/FX3DPlugin.kt b/dataforge-vis-spatial/src/jvmMain/kotlin/hep/dataforge/vis/spatial/fx/FX3DPlugin.kt
new file mode 100644
index 00000000..288174ea
--- /dev/null
+++ b/dataforge-vis-spatial/src/jvmMain/kotlin/hep/dataforge/vis/spatial/fx/FX3DPlugin.kt
@@ -0,0 +1,159 @@
+package hep.dataforge.vis.spatial.fx
+
+import hep.dataforge.context.*
+import hep.dataforge.meta.Meta
+import hep.dataforge.meta.boolean
+import hep.dataforge.provider.Type
+import hep.dataforge.vis.spatial.*
+import hep.dataforge.vis.spatial.Material3D.Companion.MATERIAL_KEY
+import hep.dataforge.vis.spatial.Material3D.Companion.MATERIAL_WIREFRAME_KEY
+import hep.dataforge.vis.spatial.fx.FX3DFactory.Companion.TYPE
+import javafx.scene.Group
+import javafx.scene.Node
+import javafx.scene.shape.CullFace
+import javafx.scene.shape.DrawMode
+import javafx.scene.shape.Shape3D
+import javafx.scene.text.Font
+import javafx.scene.text.Text
+import javafx.scene.transform.Rotate
+import org.fxyz3d.shapes.composites.PolyLine3D
+import org.fxyz3d.shapes.primitives.CuboidMesh
+import org.fxyz3d.shapes.primitives.SpheroidMesh
+import kotlin.collections.HashMap
+import kotlin.collections.component1
+import kotlin.collections.component2
+import kotlin.collections.find
+import kotlin.collections.map
+import kotlin.collections.mapNotNull
+import kotlin.collections.set
+import kotlin.math.PI
+import kotlin.reflect.KClass
+
+class FX3DPlugin : AbstractPlugin() {
+    override val tag: PluginTag get() = Companion.tag
+
+    private val objectFactories = HashMap<KClass<out VisualObject3D>, FX3DFactory<*>>()
+    private val compositeFactory = FXCompositeFactory(this)
+    private val proxyFactory = FXProxyFactory(this)
+
+    init {
+        //Add specialized factories here
+        objectFactories[Convex::class] = FXConvexFactory
+    }
+
+
+    @Suppress("UNCHECKED_CAST")
+    private fun findObjectFactory(type: KClass<out VisualObject3D>): FX3DFactory<VisualObject3D>? {
+        return (objectFactories[type] ?: context.content<FX3DFactory<*>>(TYPE).values.find { it.type == type })
+                as FX3DFactory<VisualObject3D>?
+    }
+
+    fun buildNode(obj: VisualObject3D): Node {
+        val binding = VisualObjectFXBinding(obj)
+        return when (obj) {
+            is Proxy -> proxyFactory(obj, binding)
+            is VisualGroup3D -> {
+                Group(obj.children.mapNotNull { (token, obj) ->
+                    (obj as? VisualObject3D)?.let {
+                        buildNode(it).apply {
+                            properties["name"] = token.toString()
+                        }
+                    }
+                })
+            }
+            is Composite -> compositeFactory(obj, binding)
+            is Box -> CuboidMesh(obj.xSize.toDouble(), obj.ySize.toDouble(), obj.zSize.toDouble())
+            is Sphere -> if (obj.phi == PI2 && obj.theta == PI.toFloat()) {
+                //use sphere for orb
+                SpheroidMesh(obj.detail ?: 16, obj.radius.toDouble(), obj.radius.toDouble())
+            } else {
+                FXShapeFactory(obj, binding)
+            }
+            is Label3D -> Text(obj.text).apply {
+                font = Font.font(obj.fontFamily, obj.fontSize)
+                x = -layoutBounds.width / 2
+                y = layoutBounds.height / 2
+            }
+            is PolyLine -> PolyLine3D(
+                obj.points.map { it.point },
+                obj.thickness.toFloat(),
+                obj.getProperty(Material3D.MATERIAL_COLOR_KEY)?.color()
+            ).apply {
+                this.meshView.cullFace = CullFace.FRONT
+            }
+            else -> {
+                //find specialized factory for this type if it is present
+                val factory: FX3DFactory<VisualObject3D>? = findObjectFactory(obj::class)
+                when {
+                    factory != null -> factory(obj, binding)
+                    obj is Shape -> FXShapeFactory(obj, binding)
+                    else -> error("Renderer for ${obj::class} not found")
+                }
+            }
+        }.apply {
+            translateXProperty().bind(binding[VisualObject3D.xPos].float(obj.x.toFloat()))
+            translateYProperty().bind(binding[VisualObject3D.yPos].float(obj.y.toFloat()))
+            translateZProperty().bind(binding[VisualObject3D.zPos].float(obj.z.toFloat()))
+            scaleXProperty().bind(binding[VisualObject3D.xScale].float(obj.scaleX.toFloat()))
+            scaleYProperty().bind(binding[VisualObject3D.yScale].float(obj.scaleY.toFloat()))
+            scaleZProperty().bind(binding[VisualObject3D.zScale].float(obj.scaleZ.toFloat()))
+
+            val rotateX = Rotate(0.0, Rotate.X_AXIS).apply {
+                angleProperty().bind(binding[VisualObject3D.xRotation].float(obj.rotationX.toFloat()).multiply(180.0 / PI))
+            }
+
+            val rotateY = Rotate(0.0, Rotate.Y_AXIS).apply {
+                angleProperty().bind(binding[VisualObject3D.yRotation].float(obj.rotationY.toFloat()).multiply(180.0 / PI))
+            }
+
+            val rotateZ = Rotate(0.0, Rotate.Z_AXIS).apply {
+                angleProperty().bind(binding[VisualObject3D.zRotation].float(obj.rotationZ.toFloat()).multiply(180.0 / PI))
+            }
+
+            when (obj.rotationOrder) {
+                RotationOrder.ZYX -> transforms.addAll(rotateZ, rotateY, rotateX)
+                RotationOrder.XZY -> transforms.addAll(rotateX, rotateZ, rotateY)
+                RotationOrder.YXZ -> transforms.addAll(rotateY, rotateX, rotateZ)
+                RotationOrder.YZX -> transforms.addAll(rotateY, rotateZ, rotateX)
+                RotationOrder.ZXY -> transforms.addAll(rotateZ, rotateX, rotateY)
+                RotationOrder.XYZ -> transforms.addAll(rotateX, rotateY, rotateZ)
+            }
+
+            if (this is Shape3D) {
+                materialProperty().bind(binding[MATERIAL_KEY].transform {
+                    it.material()
+                })
+
+                drawModeProperty().bind(binding[MATERIAL_WIREFRAME_KEY].transform {
+                    if (it.boolean == true) {
+                        DrawMode.LINE
+                    } else {
+                        DrawMode.FILL
+                    }
+                })
+            }
+        }
+    }
+
+    companion object : PluginFactory<FX3DPlugin> {
+        override val tag = PluginTag("visual.fx3D", PluginTag.DATAFORGE_GROUP)
+        override val type = FX3DPlugin::class
+        override fun invoke(meta: Meta, context: Context) = FX3DPlugin()
+    }
+}
+
+/**
+ * Builder and updater for three.js object
+ */
+@Type(TYPE)
+interface FX3DFactory<in T : VisualObject3D> {
+
+    val type: KClass<in T>
+
+    operator fun invoke(obj: T, binding: VisualObjectFXBinding): Node
+
+    companion object {
+        const val TYPE = "fx3DFactory"
+    }
+}
+
diff --git a/dataforge-vis-spatial/src/jvmMain/kotlin/hep/dataforge/vis/spatial/fx/FXCanvas3D.kt b/dataforge-vis-spatial/src/jvmMain/kotlin/hep/dataforge/vis/spatial/fx/FXCanvas3D.kt
new file mode 100644
index 00000000..1704eeb2
--- /dev/null
+++ b/dataforge-vis-spatial/src/jvmMain/kotlin/hep/dataforge/vis/spatial/fx/FXCanvas3D.kt
@@ -0,0 +1,86 @@
+package hep.dataforge.vis.spatial.fx
+
+import hep.dataforge.context.Context
+import hep.dataforge.context.ContextAware
+import hep.dataforge.meta.Meta
+import hep.dataforge.output.Renderer
+import hep.dataforge.vis.spatial.VisualObject3D
+import hep.dataforge.vis.spatial.specifications.CanvasSpec
+import javafx.application.Platform
+import javafx.beans.property.ObjectProperty
+import javafx.beans.property.SimpleObjectProperty
+import javafx.scene.*
+import javafx.scene.paint.Color
+import org.fxyz3d.scene.Axes
+import tornadofx.*
+
+class FXCanvas3D(val plugin: FX3DPlugin, val spec: CanvasSpec = CanvasSpec.empty()) :
+    Fragment(), Renderer<VisualObject3D>, ContextAware {
+
+    override val context: Context get() = plugin.context
+
+    val world = Group().apply {
+        //transforms.add(Rotate(180.0, Rotate.Z_AXIS))
+    }
+
+    val axes = Axes().also {
+        it.setHeight(spec.axes.size)
+        it.setRadius(spec.axes.width)
+        it.isVisible = spec.axes.visible
+        world.add(it)
+    }
+
+    val light = AmbientLight()
+
+    private val camera = PerspectiveCamera().apply {
+        nearClip = spec.camera.nearClip
+        farClip = spec.camera.farClip
+        fieldOfView = spec.camera.fov.toDouble()
+        this.add(light)
+    }
+
+    private val canvas = SubScene(
+        Group(world, camera).apply { DepthTest.ENABLE },
+        400.0,
+        400.0,
+        true,
+        SceneAntialiasing.BALANCED
+    ).also { scene ->
+        scene.fill = Color.GREY
+        scene.camera = camera
+    }
+
+    override val root = borderpane {
+        center = canvas
+    }
+
+    val controls = camera.orbitControls(canvas, spec.camera).also {
+        world.add(it.centerMarker)
+    }
+
+    val rootObjectProperty: ObjectProperty<VisualObject3D> = SimpleObjectProperty()
+    var rootObject: VisualObject3D? by rootObjectProperty
+
+    private val rootNodeProperty = rootObjectProperty.objectBinding {
+        it?.let { plugin.buildNode(it) }
+    }
+
+    init {
+        canvas.widthProperty().bind(root.widthProperty())
+        canvas.heightProperty().bind(root.heightProperty())
+        rootNodeProperty.addListener { _, oldValue: Node?, newValue: Node? ->
+            Platform.runLater {
+                if (oldValue != null) {
+                    world.children.remove(oldValue)
+                }
+                if (newValue != null) {
+                    world.children.add(newValue)
+                }
+            }
+        }
+    }
+
+    override fun render(obj: VisualObject3D, meta: Meta) {
+        rootObject = obj
+    }
+}
\ No newline at end of file
diff --git a/dataforge-vis-spatial/src/jvmMain/kotlin/hep/dataforge/vis/spatial/fx/FXCompositeFactory.kt b/dataforge-vis-spatial/src/jvmMain/kotlin/hep/dataforge/vis/spatial/fx/FXCompositeFactory.kt
new file mode 100644
index 00000000..a4af60f6
--- /dev/null
+++ b/dataforge-vis-spatial/src/jvmMain/kotlin/hep/dataforge/vis/spatial/fx/FXCompositeFactory.kt
@@ -0,0 +1,70 @@
+package hep.dataforge.vis.spatial.fx
+
+import eu.mihosoft.jcsg.CSG
+import eu.mihosoft.jcsg.Polygon
+import eu.mihosoft.vvecmath.Vector3d
+import hep.dataforge.vis.spatial.Composite
+import hep.dataforge.vis.spatial.CompositeType
+import javafx.scene.Group
+import javafx.scene.Node
+import javafx.scene.shape.MeshView
+import javafx.scene.shape.TriangleMesh
+import javafx.scene.shape.VertexFormat
+import java.util.*
+import kotlin.collections.HashMap
+import kotlin.reflect.KClass
+
+private fun MeshView.toCSG(): CSG {
+    val mesh = this.mesh as TriangleMesh
+    if (mesh.vertexFormat != VertexFormat.POINT_TEXCOORD) error("Not POINT_TEXCOORD")
+    val polygons: MutableList<Polygon> = ArrayList()
+    val faces = mesh.faces
+    val points = mesh.points
+
+    val vectorCache = HashMap<Int, Vector3d>()
+    fun getVector(index: Int) = vectorCache.getOrPut(index) {
+        Vector3d.xyz(
+            points[3 * index].toDouble(),
+            points[3 * index + 1].toDouble(),
+            points[3 * index + 2].toDouble()
+        )
+    }
+
+    for (i in 0 until faces.size() / 6) {
+        val polygon = Polygon.fromPoints(
+            getVector(faces[6 * i]),
+            getVector(faces[6 * i + 2]),
+            getVector(faces[6 * i + 4])
+        )
+        polygons.add(polygon)
+    }
+
+    return CSG.fromPolygons(polygons)
+}
+
+class FXCompositeFactory(val plugin: FX3DPlugin) : FX3DFactory<Composite> {
+    override val type: KClass<in Composite>
+        get() = Composite::class
+
+    override fun invoke(obj: Composite, binding: VisualObjectFXBinding): Node {
+        val first = plugin.buildNode(obj.first) as? MeshView ?: error("Can't build node")
+        val second = plugin.buildNode(obj.second) as? MeshView ?: error("Can't build node")
+        val firstCSG = first.toCSG()
+        val secondCSG = second.toCSG()
+        val resultCSG = when (obj.compositeType) {
+            CompositeType.UNION -> firstCSG.union(secondCSG)
+            CompositeType.INTERSECT -> firstCSG.intersect(secondCSG)
+            CompositeType.SUBTRACT -> firstCSG.difference(secondCSG)
+        }
+        return resultCSG.toNode()
+    }
+}
+
+internal fun CSG.toNode(): Node {
+    val meshes = toJavaFXMesh().asMeshViews
+    return if (meshes.size == 1) {
+        meshes.first()
+    } else {
+        Group(meshes.map { it })
+    }
+}
\ No newline at end of file
diff --git a/dataforge-vis-spatial/src/jvmMain/kotlin/hep/dataforge/vis/spatial/fx/FXConvexFactory.kt b/dataforge-vis-spatial/src/jvmMain/kotlin/hep/dataforge/vis/spatial/fx/FXConvexFactory.kt
new file mode 100644
index 00000000..aeeb2cac
--- /dev/null
+++ b/dataforge-vis-spatial/src/jvmMain/kotlin/hep/dataforge/vis/spatial/fx/FXConvexFactory.kt
@@ -0,0 +1,19 @@
+package hep.dataforge.vis.spatial.fx
+
+import eu.mihosoft.jcsg.PropertyStorage
+import eu.mihosoft.jcsg.ext.quickhull3d.HullUtil
+import eu.mihosoft.vvecmath.Vector3d
+import hep.dataforge.vis.spatial.Convex
+import javafx.scene.Node
+import kotlin.reflect.KClass
+
+
+object FXConvexFactory : FX3DFactory<Convex> {
+    override val type: KClass<in Convex> get() = Convex::class
+
+    override fun invoke(obj: Convex, binding: VisualObjectFXBinding): Node {
+        val hull = HullUtil.hull(obj.points.map { Vector3d.xyz(it.x, it.y, it.z) }, PropertyStorage())
+        return hull.toNode()
+    }
+
+}
\ No newline at end of file
diff --git a/dataforge-vis-spatial/src/jvmMain/kotlin/hep/dataforge/vis/spatial/fx/Materials.kt b/dataforge-vis-spatial/src/jvmMain/kotlin/hep/dataforge/vis/spatial/fx/FXMaterials.kt
similarity index 62%
rename from dataforge-vis-spatial/src/jvmMain/kotlin/hep/dataforge/vis/spatial/fx/Materials.kt
rename to dataforge-vis-spatial/src/jvmMain/kotlin/hep/dataforge/vis/spatial/fx/FXMaterials.kt
index 626a3594..af8cb2ee 100644
--- a/dataforge-vis-spatial/src/jvmMain/kotlin/hep/dataforge/vis/spatial/fx/Materials.kt
+++ b/dataforge-vis-spatial/src/jvmMain/kotlin/hep/dataforge/vis/spatial/fx/FXMaterials.kt
@@ -5,14 +5,16 @@ import hep.dataforge.meta.double
 import hep.dataforge.meta.get
 import hep.dataforge.meta.int
 import hep.dataforge.values.ValueType
+import hep.dataforge.vis.common.Colors
+import hep.dataforge.vis.spatial.Material3D
 import javafx.scene.paint.Color
 import javafx.scene.paint.Material
 import javafx.scene.paint.PhongMaterial
 
-object Materials {
+object FXMaterials {
     val RED = PhongMaterial().apply {
         diffuseColor = Color.DARKRED
-        specularColor = Color.RED
+        specularColor = Color.WHITE
     }
 
     val WHITE = PhongMaterial().apply {
@@ -22,7 +24,7 @@ object Materials {
 
     val GREY = PhongMaterial().apply {
         diffuseColor = Color.DARKGREY
-        specularColor = Color.GREY
+        specularColor = Color.WHITE
     }
 
     val BLUE = PhongMaterial(Color.BLUE)
@@ -30,24 +32,25 @@ object Materials {
 
 /**
  * Infer color based on meta item
+ * @param opacity default opacity
  */
-fun MetaItem<*>.color(): Color {
+fun MetaItem<*>.color(opacity: Double = 1.0): Color {
     return when (this) {
-        is MetaItem.ValueItem -> if (this.value.type == ValueType.STRING) {
-            Color.web(this.value.string)
-        } else {
+        is MetaItem.ValueItem -> if (this.value.type == ValueType.NUMBER) {
             val int = value.number.toInt()
             val red = int and 0x00ff0000 shr 16
             val green = int and 0x0000ff00 shr 8
             val blue = int and 0x000000ff
-            Color.rgb(red, green, blue)
+            Color.rgb(red, green, blue, opacity)
+        } else {
+            Color.web(this.value.string)
         }
         is MetaItem.NodeItem -> {
             Color.rgb(
-                node["red"]?.int ?: 0,
-                node["green"]?.int ?: 0,
-                node["blue"]?.int ?: 0,
-                node["opacity"]?.double ?: 1.0
+                node[Colors.RED_KEY]?.int ?: 0,
+                node[Colors.GREEN_KEY]?.int ?: 0,
+                node[Colors.BLUE_KEY]?.int ?: 0,
+                node[Material3D.OPACITY_KEY]?.double ?: opacity
             )
         }
     }
@@ -58,11 +61,12 @@ fun MetaItem<*>.color(): Color {
  */
 fun MetaItem<*>?.material(): Material {
     return when (this) {
-        null -> Materials.GREY
+        null -> FXMaterials.GREY
         is MetaItem.ValueItem -> PhongMaterial(color())
         is MetaItem.NodeItem -> PhongMaterial().apply {
-            (node["color"]?: this@material).let { diffuseColor = it.color() }
-            node["specularColor"]?.let { specularColor = it.color() }
+            val opacity = node[Material3D.OPACITY_KEY].double ?: 1.0
+            diffuseColor = node[Material3D.COLOR_KEY]?.color(opacity) ?: Color.DARKGREY
+            specularColor = node[Material3D.SPECULAR_COLOR]?.color(opacity) ?: Color.WHITE
         }
     }
 }
diff --git a/dataforge-vis-spatial/src/jvmMain/kotlin/hep/dataforge/vis/spatial/fx/FXProxyFactory.kt b/dataforge-vis-spatial/src/jvmMain/kotlin/hep/dataforge/vis/spatial/fx/FXProxyFactory.kt
new file mode 100644
index 00000000..6cdb6610
--- /dev/null
+++ b/dataforge-vis-spatial/src/jvmMain/kotlin/hep/dataforge/vis/spatial/fx/FXProxyFactory.kt
@@ -0,0 +1,47 @@
+package hep.dataforge.vis.spatial.fx
+
+import hep.dataforge.names.Name
+import hep.dataforge.names.isEmpty
+import hep.dataforge.names.toName
+import hep.dataforge.vis.common.VisualObject
+import hep.dataforge.vis.spatial.Proxy
+import javafx.scene.Group
+import javafx.scene.Node
+import kotlin.reflect.KClass
+
+class FXProxyFactory(val plugin: FX3DPlugin) : FX3DFactory<Proxy> {
+    override val type: KClass<in Proxy> get() = Proxy::class
+
+    override fun invoke(obj: Proxy, binding: VisualObjectFXBinding): Node {
+        val template = obj.prototype
+        val node = plugin.buildNode(template)
+
+        obj.onPropertyChange(this) { name, _, _ ->
+            if (name.first()?.body == Proxy.PROXY_CHILD_PROPERTY_PREFIX) {
+                val childName = name.first()?.index?.toName() ?: error("Wrong syntax for proxy child property: '$name'")
+                val propertyName = name.cutFirst()
+                val proxyChild = obj[childName] ?: error("Proxy child with name '$childName' not found")
+                val child = node.findChild(childName) ?: error("Object child with name '$childName' not found")
+                child.updateProperty(proxyChild, propertyName)
+            }
+        }
+        return node
+    }
+}
+
+private fun Node.findChild(name: Name): Node? {
+    return if (name.isEmpty()) {
+        this
+    } else {
+        (this as? Group)
+            ?.children
+            ?.find { it.properties["name"] as String == name.first()?.toString() }
+            ?.findChild(name.cutFirst())
+    }
+}
+
+private fun Node.updateProperty(obj: VisualObject, propertyName: Name) {
+//    if (propertyName.startsWith(Material3D.MATERIAL_KEY)) {
+//        (this as? Shape3D)?.let { it.material = obj.getProperty(Material3D.MATERIAL_KEY).material() }
+//    }
+}
\ No newline at end of file
diff --git a/dataforge-vis-spatial/src/jvmMain/kotlin/hep/dataforge/vis/spatial/fx/FXShapeFactory.kt b/dataforge-vis-spatial/src/jvmMain/kotlin/hep/dataforge/vis/spatial/fx/FXShapeFactory.kt
new file mode 100644
index 00000000..0dd58c45
--- /dev/null
+++ b/dataforge-vis-spatial/src/jvmMain/kotlin/hep/dataforge/vis/spatial/fx/FXShapeFactory.kt
@@ -0,0 +1,61 @@
+package hep.dataforge.vis.spatial.fx
+
+import hep.dataforge.meta.Meta
+import hep.dataforge.vis.spatial.GeometryBuilder
+import hep.dataforge.vis.spatial.Point3D
+import hep.dataforge.vis.spatial.Shape
+import javafx.scene.shape.Mesh
+import javafx.scene.shape.MeshView
+import javafx.scene.shape.TriangleMesh
+import javafx.scene.shape.VertexFormat
+import org.fxyz3d.geometry.Face3
+import kotlin.reflect.KClass
+
+object FXShapeFactory : FX3DFactory<Shape> {
+    override val type: KClass<in Shape> get() = Shape::class
+
+    override fun invoke(obj: Shape, binding: VisualObjectFXBinding): MeshView {
+        val mesh = FXGeometryBuilder().apply { obj.toGeometry(this) }.build()
+        return MeshView(mesh)
+    }
+}
+
+private class FXGeometryBuilder : GeometryBuilder<Mesh> {
+    val vertices = ArrayList<Point3D>()
+    val faces = ArrayList<Face3>()
+    private val vertexCache = HashMap<Point3D, Int>()
+
+    private fun append(vertex: Point3D): Int {
+        val index = vertexCache[vertex] ?: -1//vertices.indexOf(vertex)
+        return if (index > 0) {
+            index
+        } else {
+            vertices.add(vertex)
+            vertexCache[vertex] = vertices.size - 1
+            vertices.size - 1
+        }
+    }
+
+    override fun face(vertex1: Point3D, vertex2: Point3D, vertex3: Point3D, normal: Point3D?, meta: Meta) {
+        //adding vertices
+        val face = Face3(append(vertex1), append(vertex2), append(vertex3))
+        faces.add(face)
+    }
+
+    override fun build(): Mesh {
+        val mesh = TriangleMesh(VertexFormat.POINT_TEXCOORD)
+        vertices.forEach {
+            //TODO optimize copy
+            mesh.points.addAll(it.x.toFloat(), it.y.toFloat(), it.z.toFloat())
+        }
+
+        mesh.texCoords.addAll(0f, 0f)
+
+        faces.forEach {
+            mesh.faces.addAll(it.p0, 0, it.p1, 0, it.p2, 0)
+        }
+        return mesh
+    }
+
+}
+
diff --git a/dataforge-vis-spatial/src/jvmMain/kotlin/hep/dataforge/vis/spatial/fx/OrbitControls.kt b/dataforge-vis-spatial/src/jvmMain/kotlin/hep/dataforge/vis/spatial/fx/OrbitControls.kt
new file mode 100644
index 00000000..aaa90ee9
--- /dev/null
+++ b/dataforge-vis-spatial/src/jvmMain/kotlin/hep/dataforge/vis/spatial/fx/OrbitControls.kt
@@ -0,0 +1,179 @@
+package hep.dataforge.vis.spatial.fx
+
+import hep.dataforge.vis.spatial.specifications.CameraSpec
+import javafx.beans.InvalidationListener
+import javafx.beans.property.SimpleDoubleProperty
+import javafx.event.EventHandler
+import javafx.geometry.Point3D
+import javafx.scene.Camera
+import javafx.scene.Node
+import javafx.scene.SubScene
+import javafx.scene.input.MouseEvent
+import javafx.scene.input.ScrollEvent
+import javafx.scene.shape.Sphere
+import javafx.scene.transform.Rotate
+import javafx.scene.transform.Translate
+import tornadofx.*
+import kotlin.math.*
+
+
+class OrbitControls internal constructor(camera: Camera, canvas: SubScene, spec: CameraSpec) {
+
+    val distanceProperty = SimpleDoubleProperty(spec.distance)
+    var distance by distanceProperty
+
+    val azimuthProperty = SimpleDoubleProperty(spec.azimuth)
+    var azimuth by azimuthProperty
+
+    val zenithProperty = SimpleDoubleProperty(PI / 2 - spec.latitude)
+    var zenith by zenithProperty
+
+    val latitudeProperty = zenithProperty.unaryMinus().plus(PI / 2)
+    val latitude by latitudeProperty
+
+    val baseXProperty = SimpleDoubleProperty(0.0)
+    var x by baseXProperty
+    val baseYProperty = SimpleDoubleProperty(0.0)
+    var y by baseYProperty
+    val baseZProperty = SimpleDoubleProperty(0.0)
+    var z by baseZProperty
+
+    private val baseTranslate = Translate()
+
+//    val basePositionProperty: ObjectBinding<Point3D> =
+//        nonNullObjectBinding(baseXProperty, baseYProperty, baseZProperty) {
+//            Point3D(x, y, z)
+//        }
+//
+//    val basePosition by basePositionProperty
+
+    val centerMarker by lazy {
+        Sphere(10.0).also {
+            it.transforms.setAll(baseTranslate)
+        }
+    }
+
+    //private val center = Translate()
+
+    private val rx = Rotate(0.0, Rotate.X_AXIS)
+
+    private val ry = Rotate(0.0, Rotate.Y_AXIS)
+
+    private val translate = Translate()
+
+    //private val rz = Rotate(180.0, Rotate.Z_AXIS)
+
+
+    init {
+        camera.transforms.setAll(ry, rx, translate)
+        update()
+        val listener = InvalidationListener {
+            update()
+        }
+        distanceProperty.addListener(listener)
+        azimuthProperty.addListener(listener)
+        zenithProperty.addListener(listener)
+        baseXProperty.addListener(listener)
+        baseYProperty.addListener(listener)
+        baseZProperty.addListener(listener)
+
+        canvas.apply {
+//            center.xProperty().bind(widthProperty().divide(2))
+//            center.zProperty().bind(heightProperty().divide(2))
+            handleMouse()
+        }
+//        coordinateContainer?.vbox {
+//            label(distanceProperty.asString())
+//            label(azimuthProperty.asString())
+//            label(zenithProperty.asString())
+//        }
+    }
+
+    private fun update() {
+        val spherePosition = Point3D(
+            sin(zenith) * sin(azimuth),
+            cos(zenith),
+            sin(zenith) * cos(azimuth)
+        ).times(distance)
+        val basePosition = Point3D(x, y, z)
+        baseTranslate.x = x
+        baseTranslate.y = y
+        baseTranslate.z = z
+        //Create direction vector
+        val cameraPosition = basePosition + spherePosition
+        val camDirection: Point3D = (-spherePosition).normalize()
+
+        val xRotation = Math.toDegrees(asin(-camDirection.y))
+        val yRotation = Math.toDegrees(atan2(camDirection.x, camDirection.z))
+
+        rx.pivotX = cameraPosition.x
+        rx.pivotY = cameraPosition.y
+        rx.pivotZ = cameraPosition.z
+        rx.angle = xRotation
+
+        ry.pivotX = cameraPosition.x
+        ry.pivotY = cameraPosition.y
+        ry.pivotZ = cameraPosition.z
+        ry.angle = yRotation
+
+        translate.x = cameraPosition.x
+        translate.y = cameraPosition.y
+        translate.z = cameraPosition.z
+    }
+
+
+    private fun Node.handleMouse() {
+
+        var mousePosX = 0.0
+        var mousePosY = 0.0
+        var mouseOldX: Double
+        var mouseOldY: Double
+        var mouseDeltaX: Double
+        var mouseDeltaY: Double
+
+        onMousePressed = EventHandler<MouseEvent> { me ->
+            mousePosX = me.sceneX
+            mousePosY = me.sceneY
+            mouseOldX = me.sceneX
+            mouseOldY = me.sceneY
+        }
+
+        onMouseDragged = EventHandler<MouseEvent> { me ->
+            mouseOldX = mousePosX
+            mouseOldY = mousePosY
+            mousePosX = me.sceneX
+            mousePosY = me.sceneY
+            mouseDeltaX = mousePosX - mouseOldX
+            mouseDeltaY = mousePosY - mouseOldY
+
+            val modifier = when {
+                me.isControlDown -> CONTROL_MULTIPLIER
+                me.isShiftDown -> SHIFT_MULTIPLIER
+                else -> 1.0
+            }
+
+            if (me.isPrimaryButtonDown) {
+                azimuth = (azimuth - mouseDeltaX * MOUSE_SPEED * modifier * ROTATION_SPEED).coerceIn(0.0, 2 * PI)
+                zenith = (zenith - mouseDeltaY * MOUSE_SPEED * modifier * ROTATION_SPEED).coerceIn(0.0,PI)
+            } else if (me.isSecondaryButtonDown) {
+                x += MOUSE_SPEED * modifier * TRACK_SPEED * (mouseDeltaX * cos(azimuth) + mouseDeltaY * sin(azimuth))
+                z += MOUSE_SPEED * modifier * TRACK_SPEED * (-mouseDeltaX * sin(azimuth) + mouseDeltaY * cos(azimuth))
+            }
+        }
+        onScroll = EventHandler<ScrollEvent> { event ->
+            distance = max(1.0, distance - MOUSE_SPEED * event.deltaY * RESIZE_SPEED)
+        }
+    }
+
+    companion object {
+        private const val CONTROL_MULTIPLIER = 0.1
+        private const val SHIFT_MULTIPLIER = 10.0
+        private const val MOUSE_SPEED = 0.1
+        private const val ROTATION_SPEED = 0.02
+        private const val TRACK_SPEED = 20.0
+        private const val RESIZE_SPEED = 10.0
+    }
+}
+
+fun Camera.orbitControls(canvas: SubScene, spec: CameraSpec) =
+    OrbitControls(this, canvas, spec)
\ No newline at end of file
diff --git a/dataforge-vis-spatial/src/jvmMain/kotlin/hep/dataforge/vis/spatial/fx/RendererDemoApp.kt b/dataforge-vis-spatial/src/jvmMain/kotlin/hep/dataforge/vis/spatial/fx/RendererDemoApp.kt
deleted file mode 100644
index cd4bc32c..00000000
--- a/dataforge-vis-spatial/src/jvmMain/kotlin/hep/dataforge/vis/spatial/fx/RendererDemoApp.kt
+++ /dev/null
@@ -1,57 +0,0 @@
-package hep.dataforge.vis.spatial.fx
-
-import hep.dataforge.context.Global
-import hep.dataforge.meta.number
-import hep.dataforge.vis.spatial.*
-import javafx.scene.Parent
-import kotlinx.coroutines.GlobalScope
-import kotlinx.coroutines.delay
-import kotlinx.coroutines.isActive
-import kotlinx.coroutines.launch
-import tornadofx.*
-import kotlin.random.Random
-
-
-class RendererDemoApp : App(RendererDemoView::class)
-
-
-class RendererDemoView : View() {
-    val renderer = FX3DOutput(Global)
-    override val root: Parent = borderpane {
-        center = renderer.canvas.root
-    }
-
-    lateinit var group: VisualGroup3D
-
-    init {
-
-        renderer.render {
-            group = group {
-                box(100,100,100)
-                box(100,100,100) {
-                    x = 110.0
-                }
-            }
-        }
-
-        var color by group.config.number(1530)
-
-        GlobalScope.launch {
-            val random = Random(111)
-            while (isActive) {
-                delay(1000)
-                color = random.nextInt(0, Int.MAX_VALUE)
-            }
-        }
-
-        renderer.canvas.apply {
-            angleY = -30.0
-            angleX = -15.0
-        }
-    }
-}
-
-
-fun main() {
-    launch<RendererDemoApp>()
-}
\ No newline at end of file
diff --git a/dataforge-vis-spatial/src/jvmMain/kotlin/hep/dataforge/vis/spatial/fx/VisualObjectFXBinding.kt b/dataforge-vis-spatial/src/jvmMain/kotlin/hep/dataforge/vis/spatial/fx/VisualObjectFXBinding.kt
new file mode 100644
index 00000000..faa7b843
--- /dev/null
+++ b/dataforge-vis-spatial/src/jvmMain/kotlin/hep/dataforge/vis/spatial/fx/VisualObjectFXBinding.kt
@@ -0,0 +1,60 @@
+package hep.dataforge.vis.spatial.fx
+
+import hep.dataforge.meta.*
+import hep.dataforge.names.Name
+import hep.dataforge.names.startsWith
+import hep.dataforge.names.toName
+import hep.dataforge.vis.common.VisualObject
+import javafx.application.Platform
+import javafx.beans.binding.ObjectBinding
+import tornadofx.*
+
+/**
+ * A caching binding collection for [VisualObject] properties
+ */
+class VisualObjectFXBinding(val obj: VisualObject) {
+    private val bindings = HashMap<Name, ObjectBinding<MetaItem<*>?>>()
+
+    init {
+        obj.onPropertyChange(this) { name, _, _ ->
+            bindings.filter { it.key.startsWith(name) }.forEach { entry ->
+                Platform.runLater {
+                    entry.value.invalidate()
+                }
+            }
+//            var currentName = name
+//            while (!currentName.isEmpty()) {
+//                //recursively update all upper level bindings
+//                bindings[currentName]?.invalidate()
+//                currentName = currentName.cutLast()
+//            }
+        }
+    }
+
+    operator fun get(key: Name): ObjectBinding<MetaItem<*>?> {
+        return bindings.getOrPut(key) {
+            object : ObjectBinding<MetaItem<*>?>() {
+                override fun computeValue(): MetaItem<*>? = obj.getProperty(key)
+            }
+        }
+    }
+
+    operator fun get(key: String) = get(key.toName())
+}
+
+fun ObjectBinding<MetaItem<*>?>.value() = objectBinding { it.value }
+fun ObjectBinding<MetaItem<*>?>.string() = stringBinding { it.string }
+fun ObjectBinding<MetaItem<*>?>.number() = objectBinding { it.number }
+fun ObjectBinding<MetaItem<*>?>.double() = objectBinding { it.double }
+fun ObjectBinding<MetaItem<*>?>.float() = objectBinding { it.float }
+fun ObjectBinding<MetaItem<*>?>.int() = objectBinding { it.int }
+fun ObjectBinding<MetaItem<*>?>.long() = objectBinding { it.long }
+fun ObjectBinding<MetaItem<*>?>.node() = objectBinding { it.node }
+
+fun ObjectBinding<MetaItem<*>?>.string(default: String) = stringBinding { it.string ?: default }
+fun ObjectBinding<MetaItem<*>?>.double(default: Double) = doubleBinding { it.double ?: default }
+fun ObjectBinding<MetaItem<*>?>.float(default: Float) = floatBinding { it.float ?: default }
+fun ObjectBinding<MetaItem<*>?>.int(default: Int) = integerBinding { it.int ?: default }
+fun ObjectBinding<MetaItem<*>?>.long(default: Long) = longBinding { it.long ?: default }
+
+fun <T> ObjectBinding<MetaItem<*>?>.transform(transform: (MetaItem<*>) -> T) = objectBinding { it?.let(transform) }
diff --git a/dataforge-vis-spatial/src/jvmMain/kotlin/hep/dataforge/vis/spatial/geometryJVM.kt b/dataforge-vis-spatial/src/jvmMain/kotlin/hep/dataforge/vis/spatial/geometryJVM.kt
index 3e56de87..396d43b2 100644
--- a/dataforge-vis-spatial/src/jvmMain/kotlin/hep/dataforge/vis/spatial/geometryJVM.kt
+++ b/dataforge-vis-spatial/src/jvmMain/kotlin/hep/dataforge/vis/spatial/geometryJVM.kt
@@ -1,12 +1,49 @@
 package hep.dataforge.vis.spatial
 
-actual class Point2D actual constructor(x: Number, y: Number) {
-    actual var x = x.toDouble()
-    actual var y = y.toDouble()
+actual data class Point2D(actual var x: Double, actual var y: Double) {
+    actual constructor(x: Number, y: Number) : this(x.toDouble(), y.toDouble())
 }
 
-actual class Point3D actual constructor(x: Number, y: Number, z: Number) {
-    actual var x = x.toDouble()
-    actual var y = y.toDouble()
-    actual var z = z.toDouble()
+actual class Point3D(val point: org.fxyz3d.geometry.Point3D) {
+    actual constructor(x: Number, y: Number, z: Number) : this(
+        org.fxyz3d.geometry.Point3D(
+            x.toFloat(),
+            y.toFloat(),
+            z.toFloat()
+        )
+    )
+
+    actual var x: Double
+        inline get() = point.x.toDouble()
+        inline set(value) {
+            point.x = value.toFloat()
+        }
+
+    actual var y: Double
+        inline get() = point.y.toDouble()
+        inline set(value) {
+            point.y = value.toFloat()
+        }
+
+    actual var z: Double
+        inline get() = point.z.toDouble()
+        inline set(value) {
+            point.z = value.toFloat()
+        }
+
+    override fun equals(other: Any?): Boolean {
+        return this.point == (other as? hep.dataforge.vis.spatial.Point3D)?.point
+    }
+
+    override fun hashCode(): Int {
+        return point.hashCode()
+    }
+
+    override fun toString(): String {
+        return point.toString()
+    }
+}
+
+actual operator fun Point3D.plus(other: Point3D): Point3D {
+    return Point3D(point.add(other.point))
 }
\ No newline at end of file
diff --git a/demo/build.gradle.kts b/demo/build.gradle.kts
new file mode 100644
index 00000000..e69de29b
diff --git a/demo/gdml/build.gradle.kts b/demo/gdml/build.gradle.kts
new file mode 100644
index 00000000..67570e1d
--- /dev/null
+++ b/demo/gdml/build.gradle.kts
@@ -0,0 +1,39 @@
+import org.openjfx.gradle.JavaFXOptions
+
+plugins {
+    id("scientifik.mpp")
+    id("org.openjfx.javafxplugin")
+    id("application")
+}
+
+kotlin {
+
+    jvm {
+        withJava()
+    }
+
+    js {
+        browser {
+            webpackTask {
+                //sourceMaps = false
+            }
+        }
+    }
+
+    sourceSets {
+        commonMain {
+            dependencies {
+                api(project(":dataforge-vis-spatial"))
+                api(project(":dataforge-vis-spatial-gdml"))
+            }
+        }
+    }
+}
+
+application {
+    mainClassName = "hep.dataforge.vis.spatial.gdml.demo.GDMLDemoAppKt"
+}
+
+configure<JavaFXOptions> {
+    modules("javafx.controls")
+}
\ No newline at end of file
diff --git a/dataforge-vis-spatial-gdml/src/jsMain/kotlin/hep/dataforge/vis/spatial/gdml/demo/GDMLDemoApp.kt b/demo/gdml/src/jsMain/kotlin/hep/dataforge/vis/spatial/gdml/demo/GDMLDemoApp.kt
similarity index 68%
rename from dataforge-vis-spatial-gdml/src/jsMain/kotlin/hep/dataforge/vis/spatial/gdml/demo/GDMLDemoApp.kt
rename to demo/gdml/src/jsMain/kotlin/hep/dataforge/vis/spatial/gdml/demo/GDMLDemoApp.kt
index cacc796b..928fd24a 100644
--- a/dataforge-vis-spatial-gdml/src/jsMain/kotlin/hep/dataforge/vis/spatial/gdml/demo/GDMLDemoApp.kt
+++ b/demo/gdml/src/jsMain/kotlin/hep/dataforge/vis/spatial/gdml/demo/GDMLDemoApp.kt
@@ -1,21 +1,27 @@
 package hep.dataforge.vis.spatial.gdml.demo
 
 import hep.dataforge.context.Global
-import hep.dataforge.vis.ApplicationBase
-import hep.dataforge.vis.spatial.Material3D.Companion.OPACITY_KEY
+import hep.dataforge.js.Application
+import hep.dataforge.vis.js.editor.objectTree
+import hep.dataforge.js.startApplication
+import hep.dataforge.meta.buildMeta
+import hep.dataforge.meta.withBottom
+import hep.dataforge.names.NameToken
+import hep.dataforge.vis.js.editor.propertyEditor
+import hep.dataforge.vis.spatial.Material3D.Companion.MATERIAL_COLOR_KEY
+import hep.dataforge.vis.spatial.Material3D.Companion.MATERIAL_OPACITY_KEY
+import hep.dataforge.vis.spatial.Material3D.Companion.MATERIAL_WIREFRAME_KEY
 import hep.dataforge.vis.spatial.Visual3DPlugin
 import hep.dataforge.vis.spatial.VisualGroup3D
 import hep.dataforge.vis.spatial.VisualObject3D
-import hep.dataforge.vis.spatial.attachChildren
-import hep.dataforge.vis.spatial.editor.propertyEditor
-import hep.dataforge.vis.spatial.editor.threeOutputConfig
-import hep.dataforge.vis.spatial.editor.visualObjectTree
+import hep.dataforge.vis.spatial.VisualObject3D.Companion.VISIBLE_KEY
 import hep.dataforge.vis.spatial.gdml.GDMLTransformer
 import hep.dataforge.vis.spatial.gdml.LUnit
 import hep.dataforge.vis.spatial.gdml.toVisual
 import hep.dataforge.vis.spatial.three.ThreePlugin
 import hep.dataforge.vis.spatial.three.output
-import hep.dataforge.vis.startApplication
+import hep.dataforge.vis.spatial.three.threeSettings
+import hep.dataforge.vis.spatial.visible
 import kotlinx.html.dom.append
 import kotlinx.html.js.p
 import org.w3c.dom.DragEvent
@@ -29,7 +35,7 @@ import kotlin.browser.document
 import kotlin.browser.window
 import kotlin.dom.clear
 
-private class GDMLDemoApp : ApplicationBase() {
+private class GDMLDemoApp : Application {
     /**
      * Handle mouse drag according to https://www.html5rocks.com/en/tutorials/file/dndfiles/
      */
@@ -46,7 +52,6 @@ private class GDMLDemoApp : ApplicationBase() {
         event.stopPropagation()
         event.preventDefault()
 
-
         val file = (event.dataTransfer?.files as FileList)[0]
             ?: throw RuntimeException("Failed to load file")
 
@@ -106,7 +111,7 @@ private class GDMLDemoApp : ApplicationBase() {
                 || parent.physVolumes.isNotEmpty()
             ) {
                 useStyle("opaque") {
-                    OPACITY_KEY to 0.3
+                    MATERIAL_OPACITY_KEY put 0.3
                 }
             }
         }
@@ -119,14 +124,14 @@ private class GDMLDemoApp : ApplicationBase() {
         val three = context.plugins.load(ThreePlugin)
         //val url = URL("https://drive.google.com/open?id=1w5e7fILMN83JGgB8WANJUYm8OW2s0WVO")
 
-        val canvas = document.getElementById("canvas") ?: error("Element with id 'canvas' not found on page")
-        val layers = document.getElementById("layers") ?: error("Element with id 'layers' not found on page")
-        val tree = document.getElementById("tree") ?: error("Element with id 'tree' not found on page")
-        val editor = document.getElementById("editor") ?: error("Element with id 'editor' not found on page")
-        canvas.clear()
+        val canvasElement = document.getElementById("canvas") ?: error("Element with id 'canvas' not found on page")
+        val configElement = document.getElementById("layers") ?: error("Element with id 'layers' not found on page")
+        val treeElement = document.getElementById("tree") ?: error("Element with id 'tree' not found on page")
+        val editorElement = document.getElementById("editor") ?: error("Element with id 'editor' not found on page")
+        canvasElement.clear()
 
         val action: (name: String, data: String) -> Unit = { name, data ->
-            canvas.clear()
+            canvasElement.clear()
             spinner(true)
             message("Loading GDML")
             val gdml = GDML.format.parse(GDML.serializer(), data)
@@ -149,11 +154,28 @@ private class GDMLDemoApp : ApplicationBase() {
             message("Rendering")
 
             //output.camera.layers.enable(1)
-            val output = three.output(canvas as HTMLElement)
+            val output = three.output(canvasElement as HTMLElement)
 
             output.camera.layers.set(0)
-            layers.threeOutputConfig(output)
-            tree.visualObjectTree(visual, editor::propertyEditor)
+            configElement.threeSettings(output)
+            //tree.visualObjectTree(visual, editor::propertyEditor)
+            treeElement.objectTree(NameToken("World"), visual) {
+                editorElement.propertyEditor(it) { item ->
+                    //val descriptorMeta = Material3D.descriptor
+
+                    val properties = item.allProperties()
+                    val bottom = buildMeta {
+                        VISIBLE_KEY put (item.visible ?: true)
+                        if (item is VisualObject3D) {
+                            MATERIAL_COLOR_KEY put "#ffffff"
+                            MATERIAL_OPACITY_KEY put 1.0
+                            MATERIAL_WIREFRAME_KEY put false
+                        }
+                    }
+                    properties.withBottom(bottom)
+                }
+            }
+
 
             output.render(visual)
             message(null)
@@ -166,10 +188,6 @@ private class GDMLDemoApp : ApplicationBase() {
         }
 
     }
-
-    override fun dispose(): Map<String, Any> {
-        return super.dispose()
-    }
 }
 
 fun main() {
diff --git a/demo/gdml/src/jsMain/web/css/jsoneditor.min.css b/demo/gdml/src/jsMain/web/css/jsoneditor.min.css
new file mode 100644
index 00000000..63190af9
--- /dev/null
+++ b/demo/gdml/src/jsMain/web/css/jsoneditor.min.css
@@ -0,0 +1,6 @@
+.jsoneditor .search input{height:auto;border:inherit;border:none;box-shadow:none}.jsoneditor table{border-collapse:collapse;width:auto}.jsoneditor td,.jsoneditor th{padding:0;display:table-cell;text-align:left;vertical-align:inherit;border-radius:inherit}.jsoneditor{color:#1a1a1a;border:thin solid #3883fa;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box;width:100%;height:100%;position:relative;padding:0;line-height:100%}div.jsoneditor-default,div.jsoneditor-field,div.jsoneditor-readonly,div.jsoneditor-value{border:1px solid transparent;min-height:16px;min-width:32px;padding:2px;margin:1px;word-wrap:break-word;float:left}div.jsoneditor-field p,div.jsoneditor-value p{margin:0}div.jsoneditor-value{word-break:break-word}div.jsoneditor-value.jsoneditor-empty::after{content:"value"}div.jsoneditor-value.jsoneditor-string{color:#006000}div.jsoneditor-value.jsoneditor-number{color:#ee422e}div.jsoneditor-value.jsoneditor-boolean{color:#ff8c00}div.jsoneditor-value.jsoneditor-null{color:#004ed0}div.jsoneditor-value.jsoneditor-invalid{color:#000}div.jsoneditor-readonly{min-width:16px;color:grey}div.jsoneditor-empty{border-color:#d3d3d3;border-style:dashed;border-radius:2px}div.jsoneditor-field.jsoneditor-empty::after{content:"field"}div.jsoneditor td{vertical-align:top}div.jsoneditor td.jsoneditor-separator{padding:3px 0;vertical-align:top;color:grey}div.jsoneditor td.jsoneditor-tree{vertical-align:top}div.jsoneditor div.jsoneditor-anchor{cursor:pointer}div.jsoneditor div.jsoneditor-anchor .picker_wrapper.popup.popup_bottom{top:28px;left:-10px}div.jsoneditor.busy pre.jsoneditor-preview{background:#f5f5f5;color:grey}div.jsoneditor.busy div.jsoneditor-busy{display:inherit}div.jsoneditor code.jsoneditor-preview{background:0 0}div.jsoneditor.jsoneditor-mode-preview pre.jsoneditor-preview{width:100%;height:100%;box-sizing:border-box;overflow:auto;padding:2px;margin:0;white-space:pre-wrap;word-break:break-all}div.jsoneditor-default{color:grey;padding-left:10px}div.jsoneditor-tree{width:100%;height:100%;position:relative;overflow:auto}div.jsoneditor-tree button.jsoneditor-button{width:24px;height:24px;padding:0;margin:0;border:none;cursor:pointer;background:transparent url(../img/jsoneditor-icons.svg)}div.jsoneditor-tree button.jsoneditor-button:focus{background-color:#f5f5f5;outline:#e5e5e5 solid 1px}div.jsoneditor-tree button.jsoneditor-collapsed{background-position:0 -48px}div.jsoneditor-tree button.jsoneditor-expanded{background-position:0 -72px}div.jsoneditor-tree button.jsoneditor-contextmenu{background-position:-48px -72px}div.jsoneditor-tree button.jsoneditor-invisible{visibility:hidden;background:0 0}div.jsoneditor-tree button.jsoneditor-dragarea{background:url(../img/jsoneditor-icons.svg) -72px -72px;cursor:move}div.jsoneditor-tree :focus{outline:0}div.jsoneditor-tree div.jsoneditor-show-more{display:inline-block;padding:3px 4px;margin:2px 0;background-color:#e5e5e5;border-radius:3px;color:grey;font-family:arial,sans-serif;font-size:10pt}div.jsoneditor-tree div.jsoneditor-show-more a{display:inline-block;color:grey}div.jsoneditor-tree div.jsoneditor-color{display:inline-block;width:12px;height:12px;margin:4px;border:1px solid grey;cursor:pointer}div.jsoneditor-tree div.jsoneditor-date{background:#a1a1a1;color:#fff;font-family:arial,sans-serif;border-radius:3px;display:inline-block;padding:3px;margin:0 3px}div.jsoneditor-tree table.jsoneditor-tree{border-collapse:collapse;border-spacing:0;width:100%}div.jsoneditor-tree .jsoneditor-button.jsoneditor-schema-error{width:24px;height:24px;padding:0;margin:0 4px 0 0;background:url(../img/jsoneditor-icons.svg) -168px -48px}div.jsoneditor-outer{position:static;width:100%;height:100%;margin:0;padding:0;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box}div.jsoneditor-outer.has-nav-bar{margin-top:-26px;padding-top:26px}div.jsoneditor-outer.has-nav-bar.has-main-menu-bar{margin-top:-61px;padding-top:61px}div.jsoneditor-outer.has-status-bar{margin-bottom:-26px;padding-bottom:26px}div.jsoneditor-outer.has-main-menu-bar{margin-top:-35px;padding-top:35px}div.jsoneditor-busy{position:absolute;top:15%;left:0;box-sizing:border-box;width:100%;text-align:center;display:none}div.jsoneditor-busy span{background-color:#ffffab;border:1px solid #fe0;border-radius:3px;padding:5px 15px;box-shadow:0 0 5px rgba(0,0,0,.4)}div.jsoneditor-field.jsoneditor-empty::after,div.jsoneditor-value.jsoneditor-empty::after{pointer-events:none;color:#d3d3d3;font-size:8pt}a.jsoneditor-value.jsoneditor-url,div.jsoneditor-value.jsoneditor-url{color:#006000;text-decoration:underline}a.jsoneditor-value.jsoneditor-url{display:inline-block;padding:2px;margin:2px}a.jsoneditor-value.jsoneditor-url:focus,a.jsoneditor-value.jsoneditor-url:hover{color:#ee422e}div.jsoneditor-field.jsoneditor-highlight,div.jsoneditor-field[contenteditable=true]:focus,div.jsoneditor-field[contenteditable=true]:hover,div.jsoneditor-value.jsoneditor-highlight,div.jsoneditor-value[contenteditable=true]:focus,div.jsoneditor-value[contenteditable=true]:hover{background-color:#ffffab;border:1px solid #fe0;border-radius:2px}div.jsoneditor-field.jsoneditor-highlight-active,div.jsoneditor-field.jsoneditor-highlight-active:focus,div.jsoneditor-field.jsoneditor-highlight-active:hover,div.jsoneditor-value.jsoneditor-highlight-active,div.jsoneditor-value.jsoneditor-highlight-active:focus,div.jsoneditor-value.jsoneditor-highlight-active:hover{background-color:#fe0;border:1px solid #ffc700;border-radius:2px}div.jsoneditor-value.jsoneditor-array,div.jsoneditor-value.jsoneditor-object{min-width:16px}div.jsoneditor-mode-form tr.jsoneditor-expandable td.jsoneditor-tree,div.jsoneditor-mode-view tr.jsoneditor-expandable td.jsoneditor-tree{cursor:pointer}div.jsoneditor-tree button.jsoneditor-contextmenu.jsoneditor-selected,div.jsoneditor-tree button.jsoneditor-contextmenu:focus,div.jsoneditor-tree button.jsoneditor-contextmenu:hover,tr.jsoneditor-selected.jsoneditor-first button.jsoneditor-contextmenu{background-position:-48px -48px}div.jsoneditor-tree div.jsoneditor-show-more a:focus,div.jsoneditor-tree div.jsoneditor-show-more a:hover{color:#ee422e}.ace-jsoneditor,textarea.jsoneditor-text{min-height:150px}textarea.jsoneditor-text{width:100%;height:100%;margin:0;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box;outline-width:0;border:none;background-color:#fff;resize:none}tr.jsoneditor-highlight,tr.jsoneditor-selected{background-color:#d3d3d3}tr.jsoneditor-selected button.jsoneditor-contextmenu,tr.jsoneditor-selected button.jsoneditor-dragarea{visibility:hidden}tr.jsoneditor-selected.jsoneditor-first button.jsoneditor-contextmenu,tr.jsoneditor-selected.jsoneditor-first button.jsoneditor-dragarea{visibility:visible}div.jsoneditor-tree button.jsoneditor-dragarea:focus,div.jsoneditor-tree button.jsoneditor-dragarea:hover,tr.jsoneditor-selected.jsoneditor-first button.jsoneditor-dragarea{background-position:-72px -48px}div.jsoneditor td,div.jsoneditor th,div.jsoneditor tr{padding:0;margin:0}.jsoneditor-popover,.jsoneditor-schema-error,div.jsoneditor td,div.jsoneditor textarea,div.jsoneditor th,div.jsoneditor-field,div.jsoneditor-value,pre.jsoneditor-preview{font-family:"dejavu sans mono","droid sans mono",consolas,monaco,"lucida console","courier new",courier,monospace,sans-serif;font-size:10pt;color:#1a1a1a}.jsoneditor-schema-error{cursor:default;display:inline-block;height:24px;line-height:24px;position:relative;text-align:center;width:24px}.jsoneditor-popover{background-color:#4c4c4c;border-radius:3px;box-shadow:0 0 5px rgba(0,0,0,.4);color:#fff;padding:7px 10px;position:absolute;cursor:auto;width:200px;z-index:999}.jsoneditor-popover.jsoneditor-above{bottom:32px;left:-98px}.jsoneditor-popover.jsoneditor-above:before{border-top:7px solid #4c4c4c;bottom:-7px}.jsoneditor-popover.jsoneditor-below{top:32px;left:-98px}.jsoneditor-popover.jsoneditor-below:before{border-bottom:7px solid #4c4c4c;top:-7px}.jsoneditor-popover.jsoneditor-left{top:-7px;right:32px}.jsoneditor-popover.jsoneditor-left:before{border-left:7px solid #4c4c4c;border-top:7px solid transparent;border-bottom:7px solid transparent;content:"";top:19px;right:-14px;left:inherit;margin-left:inherit;margin-top:-7px;position:absolute}.jsoneditor-popover.jsoneditor-right{top:-7px;left:32px}.jsoneditor-popover.jsoneditor-right:before{border-right:7px solid #4c4c4c;border-top:7px solid transparent;border-bottom:7px solid transparent;content:"";top:19px;left:-14px;margin-left:inherit;margin-top:-7px;position:absolute}.jsoneditor-popover:before{border-right:7px solid transparent;border-left:7px solid transparent;content:"";display:block;left:50%;margin-left:-7px;position:absolute}.jsoneditor-text-errors tr.jump-to-line:hover{text-decoration:underline;cursor:pointer}.jsoneditor-schema-error:focus .jsoneditor-popover,.jsoneditor-schema-error:hover .jsoneditor-popover{display:block;animation:fade-in .3s linear 1,move-up .3s linear 1}@keyframes fade-in{from{opacity:0}to{opacity:1}}.jsoneditor .jsoneditor-validation-errors-container{max-height:130px;overflow-y:auto}.jsoneditor .jsoneditor-validation-errors{width:100%;overflow:hidden}.jsoneditor .jsoneditor-additional-errors{position:absolute;margin:auto;bottom:31px;left:calc(50% - 92px);color:grey;background-color:#ebebeb;padding:7px 15px;border-radius:8px}.jsoneditor .jsoneditor-additional-errors.visible{visibility:visible;opacity:1;transition:opacity 2s linear}.jsoneditor .jsoneditor-additional-errors.hidden{visibility:hidden;opacity:0;transition:visibility 0s 2s,opacity 2s linear}.jsoneditor .jsoneditor-text-errors{width:100%;border-collapse:collapse;border-top:1px solid #ffc700}.jsoneditor .jsoneditor-text-errors td{padding:3px 6px;vertical-align:middle}.jsoneditor .jsoneditor-text-errors td pre{margin:0;white-space:normal}.jsoneditor .jsoneditor-text-errors tr{background-color:#ffffab}.jsoneditor .jsoneditor-text-errors tr.parse-error{background-color:#ee2e2e70}.jsoneditor-text-errors .jsoneditor-schema-error{border:none;width:24px;height:24px;padding:0;margin:0 4px 0 0;cursor:pointer}.jsoneditor-text-errors tr .jsoneditor-schema-error{background:url(../img/jsoneditor-icons.svg) -168px -48px}.jsoneditor-text-errors tr.parse-error .jsoneditor-schema-error{background:url(../img/jsoneditor-icons.svg) -25px 0}.fadein{-webkit-animation:fadein .3s;animation:fadein .3s;-moz-animation:fadein .3s;-o-animation:fadein .3s}@keyframes fadein{0%{opacity:0}100%{opacity:1}}.jsoneditor-contextmenu-root{position:relative;width:0;height:0}.jsoneditor-contextmenu{position:absolute;box-sizing:content-box;z-index:99}.jsoneditor-contextmenu .jsoneditor-menu{position:relative;left:0;top:0;width:128px;height:auto;background:#fff;border:1px solid #d3d3d3;box-shadow:2px 2px 12px rgba(128,128,128,.3);list-style:none;margin:0;padding:0}.jsoneditor-contextmenu .jsoneditor-menu button{position:relative;padding:0 4px 0 0;margin:0;width:128px;height:auto;border:none;cursor:pointer;color:#4d4d4d;background:0 0;font-size:10pt;font-family:arial,sans-serif;box-sizing:border-box;text-align:left}.jsoneditor-contextmenu .jsoneditor-menu button::-moz-focus-inner{padding:0;border:0}.jsoneditor-contextmenu .jsoneditor-menu button.jsoneditor-default{width:96px}.jsoneditor-contextmenu .jsoneditor-menu button.jsoneditor-expand{float:right;width:32px;height:24px;border-left:1px solid #e5e5e5}.jsoneditor-contextmenu .jsoneditor-menu li{overflow:hidden}.jsoneditor-contextmenu .jsoneditor-menu li ul{display:none;position:relative;left:-10px;top:0;border:none;box-shadow:inset 0 0 10px rgba(128,128,128,.5);padding:0 10px;-webkit-transition:all .3s ease-out;-moz-transition:all .3s ease-out;-o-transition:all .3s ease-out;transition:all .3s ease-out}.jsoneditor-contextmenu .jsoneditor-menu li ul .jsoneditor-icon{margin-left:24px}.jsoneditor-contextmenu .jsoneditor-menu li ul li button{padding-left:24px;animation:all ease-in-out 1s}.jsoneditor-contextmenu .jsoneditor-menu li button .jsoneditor-expand{position:absolute;top:0;right:0;width:24px;height:24px;padding:0;margin:0 4px 0 0;background:url(../img/jsoneditor-icons.svg) 0 -72px}.jsoneditor-contextmenu .jsoneditor-icon{position:absolute;top:0;left:0;width:24px;height:24px;border:none;padding:0;margin:0;background-image:url(../img/jsoneditor-icons.svg)}.jsoneditor-contextmenu .jsoneditor-text{padding:4px 0 4px 24px;word-wrap:break-word}.jsoneditor-contextmenu .jsoneditor-text.jsoneditor-right-margin{padding-right:24px}.jsoneditor-contextmenu .jsoneditor-separator{height:0;border-top:1px solid #e5e5e5;padding-top:5px;margin-top:5px}.jsoneditor-contextmenu button.jsoneditor-remove .jsoneditor-icon{background-position:-24px 0}.jsoneditor-contextmenu button.jsoneditor-append .jsoneditor-icon{background-position:0 0}.jsoneditor-contextmenu button.jsoneditor-insert .jsoneditor-icon{background-position:0 0}.jsoneditor-contextmenu button.jsoneditor-duplicate .jsoneditor-icon{background-position:-48px 0}.jsoneditor-contextmenu button.jsoneditor-sort-asc .jsoneditor-icon{background-position:-168px 0}.jsoneditor-contextmenu button.jsoneditor-sort-desc .jsoneditor-icon{background-position:-192px 0}.jsoneditor-contextmenu button.jsoneditor-transform .jsoneditor-icon{background-position:-216px 0}.jsoneditor-contextmenu button.jsoneditor-extract .jsoneditor-icon{background-position:0 -24px}.jsoneditor-contextmenu button.jsoneditor-type-string .jsoneditor-icon{background-position:-144px 0}.jsoneditor-contextmenu button.jsoneditor-type-auto .jsoneditor-icon{background-position:-120px 0}.jsoneditor-contextmenu button.jsoneditor-type-object .jsoneditor-icon{background-position:-72px 0}.jsoneditor-contextmenu button.jsoneditor-type-array .jsoneditor-icon{background-position:-96px 0}.jsoneditor-contextmenu button.jsoneditor-type-modes .jsoneditor-icon{background-image:none;width:6px}.jsoneditor-contextmenu li,.jsoneditor-contextmenu ul{box-sizing:content-box;position:relative}.jsoneditor-contextmenu .jsoneditor-menu button:focus,.jsoneditor-contextmenu .jsoneditor-menu button:hover{color:#1a1a1a;background-color:#f5f5f5;outline:0}.jsoneditor-contextmenu .jsoneditor-menu li button.jsoneditor-selected,.jsoneditor-contextmenu .jsoneditor-menu li button.jsoneditor-selected:focus,.jsoneditor-contextmenu .jsoneditor-menu li button.jsoneditor-selected:hover{color:#fff;background-color:#ee422e}.jsoneditor-contextmenu .jsoneditor-menu li ul li button:focus,.jsoneditor-contextmenu .jsoneditor-menu li ul li button:hover{background-color:#f5f5f5}.jsoneditor-modal{max-width:95%;border-radius:2px!important;padding:45px 15px 15px 15px!important;box-shadow:2px 2px 12px rgba(128,128,128,.3);color:#4d4d4d;line-height:1.3em}.jsoneditor-modal.jsoneditor-modal-transform{width:600px!important}.jsoneditor-modal .pico-modal-header{position:absolute;box-sizing:border-box;top:0;left:0;width:100%;padding:0 10px;height:30px;line-height:30px;font-family:arial,sans-serif;font-size:11pt;background:#3883fa;color:#fff}.jsoneditor-modal table{width:100%}.jsoneditor-modal table td{padding:3px 0}.jsoneditor-modal table td.jsoneditor-modal-input{text-align:right;padding-right:0;white-space:nowrap}.jsoneditor-modal table td.jsoneditor-modal-actions{padding-top:15px}.jsoneditor-modal table th{vertical-align:middle}.jsoneditor-modal p:first-child{margin-top:0}.jsoneditor-modal a{color:#3883fa}.jsoneditor-modal .jsoneditor-jmespath-block{margin-bottom:10px}.jsoneditor-modal .pico-close{background:0 0!important;font-size:24px!important;top:7px!important;right:7px!important;color:#fff}.jsoneditor-modal input{padding:4px}.jsoneditor-modal input[type=text]{cursor:inherit}.jsoneditor-modal input[disabled]{background:#d3d3d3;color:grey}.jsoneditor-modal .jsoneditor-select-wrapper{position:relative;display:inline-block}.jsoneditor-modal .jsoneditor-select-wrapper:after{content:"";width:0;height:0;border-left:5px solid transparent;border-right:5px solid transparent;border-top:6px solid #666;position:absolute;right:8px;top:14px;pointer-events:none}.jsoneditor-modal select{padding:3px 24px 3px 10px;min-width:180px;max-width:350px;-webkit-appearance:none;-moz-appearance:none;appearance:none;text-indent:0;text-overflow:"";font-size:10pt;line-height:1.5em}.jsoneditor-modal select::-ms-expand{display:none}.jsoneditor-modal .jsoneditor-button-group input{padding:4px 10px;margin:0;border-radius:0;border-left-style:none}.jsoneditor-modal .jsoneditor-button-group input.jsoneditor-button-first{border-top-left-radius:3px;border-bottom-left-radius:3px;border-left-style:solid}.jsoneditor-modal .jsoneditor-button-group input.jsoneditor-button-last{border-top-right-radius:3px;border-bottom-right-radius:3px}.jsoneditor-modal .jsoneditor-transform-preview{background:#f5f5f5;height:200px}.jsoneditor-modal .jsoneditor-transform-preview.jsoneditor-error{color:#ee422e}.jsoneditor-modal .jsoneditor-jmespath-wizard{line-height:1.2em;width:100%;padding:0;border-radius:3px}.jsoneditor-modal .jsoneditor-jmespath-label{font-weight:700;color:#1e90ff;margin-top:20px;margin-bottom:5px}.jsoneditor-modal .jsoneditor-jmespath-wizard-table{width:100%}.jsoneditor-modal .jsoneditor-jmespath-wizard-label{font-style:italic;margin:4px 0 2px 0}.jsoneditor-modal .jsoneditor-inline{position:relative;display:inline-block;width:100%;padding-top:2px;padding-bottom:2px}.jsoneditor-modal .jsoneditor-inline:not(:last-child){padding-right:2px}.jsoneditor-modal .jsoneditor-jmespath-filter{display:flex;flex-wrap:wrap}.jsoneditor-modal .jsoneditor-jmespath-filter-field{width:180px}.jsoneditor-modal .jsoneditor-jmespath-filter-relation{width:100px}.jsoneditor-modal .jsoneditor-jmespath-filter-value{min-width:180px;flex:1}.jsoneditor-modal .jsoneditor-jmespath-sort-field{width:170px}.jsoneditor-modal .jsoneditor-jmespath-sort-order{width:150px}.jsoneditor-modal .jsoneditor-jmespath-select-fields{width:100%}.jsoneditor-modal .selectr-selected{border-color:#d3d3d3;padding:4px 28px 4px 8px}.jsoneditor-modal .selectr-selected .selectr-tag{background-color:#3883fa;border-radius:5px}.jsoneditor-modal table td,.jsoneditor-modal table th{text-align:left;vertical-align:top;font-weight:400;color:#4d4d4d;border-spacing:0;border-collapse:collapse}.jsoneditor-modal #query,.jsoneditor-modal input,.jsoneditor-modal select,.jsoneditor-modal textarea{background:#fff;border:1px solid #d3d3d3;color:#4d4d4d;border-radius:3px;padding:4px}.jsoneditor-modal,.jsoneditor-modal #query,.jsoneditor-modal input,.jsoneditor-modal option,.jsoneditor-modal select,.jsoneditor-modal table td,.jsoneditor-modal table th,.jsoneditor-modal textarea{font-size:10.5pt;font-family:arial,sans-serif}.jsoneditor-modal #query,.jsoneditor-modal .jsoneditor-transform-preview{font-family:"dejavu sans mono","droid sans mono",consolas,monaco,"lucida console","courier new",courier,monospace,sans-serif;font-size:10pt;width:100%;box-sizing:border-box}.jsoneditor-modal input[type=button],.jsoneditor-modal input[type=submit]{background:#f5f5f5;padding:4px 20px}.jsoneditor-modal input,.jsoneditor-modal select{cursor:pointer}.jsoneditor-modal .jsoneditor-button-group.jsoneditor-button-group-value-asc input.jsoneditor-button-asc,.jsoneditor-modal .jsoneditor-button-group.jsoneditor-button-group-value-desc input.jsoneditor-button-desc{background:#3883fa;border-color:#3883fa;color:#fff}.jsoneditor-menu{width:100%;height:35px;padding:2px;margin:0;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box;color:#fff;background-color:#3883fa;border-bottom:1px solid #3883fa}.jsoneditor-menu>.jsoneditor-modes>button,.jsoneditor-menu>button{width:26px;height:26px;margin:2px;padding:0;border-radius:2px;border:1px solid transparent;background:transparent url(../img/jsoneditor-icons.svg);color:#fff;opacity:.8;font-family:arial,sans-serif;font-size:10pt;float:left}.jsoneditor-menu>.jsoneditor-modes>button:hover,.jsoneditor-menu>button:hover{background-color:rgba(255,255,255,.2);border:1px solid rgba(255,255,255,.4)}.jsoneditor-menu>.jsoneditor-modes>button:active,.jsoneditor-menu>.jsoneditor-modes>button:focus,.jsoneditor-menu>button:active,.jsoneditor-menu>button:focus{background-color:rgba(255,255,255,.3)}.jsoneditor-menu>.jsoneditor-modes>button:disabled,.jsoneditor-menu>button:disabled{opacity:.5;background-color:transparent;border:none}.jsoneditor-menu>button.jsoneditor-collapse-all{background-position:0 -96px}.jsoneditor-menu>button.jsoneditor-expand-all{background-position:0 -120px}.jsoneditor-menu>button.jsoneditor-sort{background-position:-120px -96px}.jsoneditor-menu>button.jsoneditor-transform{background-position:-144px -96px}.jsoneditor.jsoneditor-mode-form>.jsoneditor-menu>button.jsoneditor-sort,.jsoneditor.jsoneditor-mode-form>.jsoneditor-menu>button.jsoneditor-transform,.jsoneditor.jsoneditor-mode-view>.jsoneditor-menu>button.jsoneditor-sort,.jsoneditor.jsoneditor-mode-view>.jsoneditor-menu>button.jsoneditor-transform{display:none}.jsoneditor-menu>button.jsoneditor-undo{background-position:-24px -96px}.jsoneditor-menu>button.jsoneditor-undo:disabled{background-position:-24px -120px}.jsoneditor-menu>button.jsoneditor-redo{background-position:-48px -96px}.jsoneditor-menu>button.jsoneditor-redo:disabled{background-position:-48px -120px}.jsoneditor-menu>button.jsoneditor-compact{background-position:-72px -96px}.jsoneditor-menu>button.jsoneditor-format{background-position:-72px -120px}.jsoneditor-menu>button.jsoneditor-repair{background-position:-96px -96px}.jsoneditor-menu>.jsoneditor-modes{display:inline-block;float:left}.jsoneditor-menu>.jsoneditor-modes>button{background-image:none;width:auto;padding-left:6px;padding-right:6px}.jsoneditor-menu>.jsoneditor-modes>button.jsoneditor-separator,.jsoneditor-menu>button.jsoneditor-separator{margin-left:10px}.jsoneditor-menu a{font-family:arial,sans-serif;font-size:10pt;color:#fff;opacity:.8;vertical-align:middle}.jsoneditor-menu a:hover{opacity:1}.jsoneditor-menu a.jsoneditor-poweredBy{font-size:8pt;position:absolute;right:0;top:0;padding:10px}.jsoneditor-search{font-family:arial,sans-serif;position:absolute;right:4px;top:4px;border-collapse:collapse;border-spacing:0;display:flex}.jsoneditor-search input{color:#1a1a1a;width:120px;border:none;outline:0;margin:1px;line-height:20px}.jsoneditor-search button{width:16px;height:24px;padding:0;margin:0;border:none;background:url(../img/jsoneditor-icons.svg);vertical-align:top}.jsoneditor-search button:hover{background-color:transparent}.jsoneditor-search button.jsoneditor-refresh{width:18px;background-position:-99px -73px}.jsoneditor-search button.jsoneditor-next{cursor:pointer;background-position:-124px -73px}.jsoneditor-search button.jsoneditor-next:hover{background-position:-124px -49px}.jsoneditor-search button.jsoneditor-previous{cursor:pointer;background-position:-148px -73px;margin-right:2px}.jsoneditor-search button.jsoneditor-previous:hover{background-position:-148px -49px}.jsoneditor-results{font-family:arial,sans-serif;color:#fff;padding-right:5px;line-height:26px}.jsoneditor-frame{border:1px solid transparent;background-color:#fff;padding:0 2px;margin:0}.jsoneditor .autocomplete.dropdown{position:absolute;background:#fff;box-shadow:2px 2px 12px rgba(128,128,128,.3);border:1px solid #d3d3d3;z-index:100;overflow-x:hidden;overflow-y:auto;cursor:default;margin:0;padding:5px;text-align:left;outline:0;font-family:"dejavu sans mono","droid sans mono",consolas,monaco,"lucida console","courier new",courier,monospace,sans-serif;font-size:10pt}.jsoneditor .autocomplete.dropdown .item{color:#333}.jsoneditor .autocomplete.dropdown .item.hover{background-color:#ddd}.jsoneditor .autocomplete.hint{color:#aaa;top:4px;left:4px}.jsoneditor-treepath{padding:0 5px;overflow:hidden;white-space:nowrap;outline:0}.jsoneditor-treepath.show-all{word-wrap:break-word;white-space:normal;position:absolute;background-color:#ebebeb;z-index:999;box-shadow:2px 2px 12px rgba(128,128,128,.3)}.jsoneditor-treepath.show-all span.jsoneditor-treepath-show-all-btn{display:none}.jsoneditor-treepath div.jsoneditor-contextmenu-root{position:absolute;left:0}.jsoneditor-treepath .jsoneditor-treepath-show-all-btn{position:absolute;background-color:#ebebeb;left:0;height:20px;padding:0 3px;cursor:pointer}.jsoneditor-treepath .jsoneditor-treepath-element{margin:1px;font-family:arial,sans-serif;font-size:10pt}.jsoneditor-treepath .jsoneditor-treepath-seperator{margin:2px;font-size:9pt;font-family:arial,sans-serif}.jsoneditor-treepath span.jsoneditor-treepath-element:hover,.jsoneditor-treepath span.jsoneditor-treepath-seperator:hover{cursor:pointer;text-decoration:underline}.jsoneditor-statusbar{line-height:26px;height:26px;color:grey;background-color:#ebebeb;border-top:1px solid #d3d3d3;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box;font-size:10pt}.jsoneditor-statusbar>.jsoneditor-curserinfo-val{margin-right:12px}.jsoneditor-statusbar>.jsoneditor-curserinfo-count{margin-left:4px}.jsoneditor-statusbar>.jsoneditor-validation-error-icon{float:right;width:24px;height:24px;padding:0;margin-top:1px;background:url(../img/jsoneditor-icons.svg) -168px -48px;cursor:pointer}.jsoneditor-statusbar>.jsoneditor-validation-error-count{float:right;margin:0 4px 0 0;cursor:pointer}.jsoneditor-statusbar>.jsoneditor-parse-error-icon{float:right;width:24px;height:24px;padding:0;margin:1px;background:url(../img/jsoneditor-icons.svg) -25px 0}.jsoneditor-statusbar .jsoneditor-array-info a{color:inherit}div.jsoneditor-statusbar>.jsoneditor-curserinfo-label,div.jsoneditor-statusbar>.jsoneditor-size-info{margin:0 4px}.jsoneditor-navigation-bar{width:100%;height:26px;line-height:26px;padding:0;margin:0;border-bottom:1px solid #d3d3d3;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box;color:grey;background-color:#ebebeb;overflow:hidden;font-family:arial,sans-serif;font-size:10pt}/*!
+ * Selectr 2.4.0
+ * https://github.com/Mobius1/Selectr
+ *
+ * Released under the MIT license
+ */.selectr-container{position:relative}.selectr-container li{list-style:none}.selectr-hidden{position:absolute;overflow:hidden;clip:rect(0,0,0,0);width:1px;height:1px;margin:-1px;padding:0;border:0 none}.selectr-visible{position:absolute;left:0;top:0;width:100%;height:100%;opacity:0;z-index:11}.selectr-desktop.multiple .selectr-visible{display:none}.selectr-desktop.multiple.native-open .selectr-visible{top:100%;min-height:200px!important;height:auto;opacity:1;display:block}.selectr-container.multiple.selectr-mobile .selectr-selected{z-index:0}.selectr-selected{position:relative;z-index:1;box-sizing:border-box;width:100%;padding:7px 28px 7px 14px;cursor:pointer;border:1px solid #999;border-radius:3px;background-color:#fff}.selectr-selected::before{position:absolute;top:50%;right:10px;width:0;height:0;content:'';-o-transform:rotate(0) translate3d(0,-50%,0);-ms-transform:rotate(0) translate3d(0,-50%,0);-moz-transform:rotate(0) translate3d(0,-50%,0);-webkit-transform:rotate(0) translate3d(0,-50%,0);transform:rotate(0) translate3d(0,-50%,0);border-width:4px 4px 0 4px;border-style:solid;border-color:#6c7a86 transparent transparent}.selectr-container.native-open .selectr-selected::before,.selectr-container.open .selectr-selected::before{border-width:0 4px 4px 4px;border-style:solid;border-color:transparent transparent #6c7a86}.selectr-label{display:none;overflow:hidden;width:100%;white-space:nowrap;text-overflow:ellipsis}.selectr-placeholder{color:#6c7a86}.selectr-tags{margin:0;padding:0;white-space:normal}.has-selected .selectr-tags{margin:0 0 -2px}.selectr-tag{list-style:none;position:relative;float:left;padding:2px 25px 2px 8px;margin:0 2px 2px 0;cursor:default;color:#fff;border:medium none;border-radius:10px;background:#acb7bf none repeat scroll 0 0}.selectr-container.multiple.has-selected .selectr-selected{padding:5px 28px 5px 5px}.selectr-options-container{position:absolute;z-index:10000;top:calc(100% - 1px);left:0;display:none;box-sizing:border-box;width:100%;border-width:0 1px 1px;border-style:solid;border-color:transparent #999 #999;border-radius:0 0 3px 3px;background-color:#fff}.selectr-container.open .selectr-options-container{display:block}.selectr-input-container{position:relative;display:none}.selectr-clear,.selectr-input-clear,.selectr-tag-remove{position:absolute;top:50%;right:22px;width:20px;height:20px;padding:0;cursor:pointer;-o-transform:translate3d(0,-50%,0);-ms-transform:translate3d(0,-50%,0);-moz-transform:translate3d(0,-50%,0);-webkit-transform:translate3d(0,-50%,0);transform:translate3d(0,-50%,0);border:medium none;background-color:transparent;z-index:11}.selectr-clear,.selectr-input-clear{display:none}.selectr-container.has-selected .selectr-clear,.selectr-input-container.active .selectr-input-clear{display:block}.selectr-selected .selectr-tag-remove{right:2px}.selectr-clear::after,.selectr-clear::before,.selectr-input-clear::after,.selectr-input-clear::before,.selectr-tag-remove::after,.selectr-tag-remove::before{position:absolute;top:5px;left:9px;width:2px;height:10px;content:' ';background-color:#6c7a86}.selectr-tag-remove::after,.selectr-tag-remove::before{top:4px;width:3px;height:12px;background-color:#fff}.selectr-clear:before,.selectr-input-clear::before,.selectr-tag-remove::before{-o-transform:rotate(45deg);-ms-transform:rotate(45deg);-moz-transform:rotate(45deg);-webkit-transform:rotate(45deg);transform:rotate(45deg)}.selectr-clear:after,.selectr-input-clear::after,.selectr-tag-remove::after{-o-transform:rotate(-45deg);-ms-transform:rotate(-45deg);-moz-transform:rotate(-45deg);-webkit-transform:rotate(-45deg);transform:rotate(-45deg)}.selectr-input-container.active,.selectr-input-container.active .selectr-clear{display:block}.selectr-input{top:5px;left:5px;box-sizing:border-box;width:calc(100% - 30px);margin:10px 15px;padding:7px 30px 7px 9px;border:1px solid #999;border-radius:3px}.selectr-notice{display:none;box-sizing:border-box;width:100%;padding:8px 16px;border-top:1px solid #999;border-radius:0 0 3px 3px;background-color:#fff}.selectr-container.notice .selectr-notice{display:block}.selectr-container.notice .selectr-selected{border-radius:3px 3px 0 0}.selectr-options{position:relative;top:calc(100% + 2px);display:none;overflow-x:auto;overflow-y:scroll;max-height:200px;margin:0;padding:0}.selectr-container.notice .selectr-options-container,.selectr-container.open .selectr-input-container,.selectr-container.open .selectr-options{display:block}.selectr-option{position:relative;display:block;padding:5px 20px;list-style:outside none none;cursor:pointer;font-weight:400}.selectr-options.optgroups>.selectr-option{padding-left:25px}.selectr-optgroup{font-weight:700;padding:0}.selectr-optgroup--label{font-weight:700;margin-top:10px;padding:5px 15px}.selectr-match{text-decoration:underline}.selectr-option.selected{background-color:#ddd}.selectr-option.active{color:#fff;background-color:#5897fb}.selectr-option.disabled{opacity:.4}.selectr-option.excluded{display:none}.selectr-container.open .selectr-selected{border-color:#999 #999 transparent #999;border-radius:3px 3px 0 0}.selectr-container.open .selectr-selected::after{-o-transform:rotate(180deg) translate3d(0,50%,0);-ms-transform:rotate(180deg) translate3d(0,50%,0);-moz-transform:rotate(180deg) translate3d(0,50%,0);-webkit-transform:rotate(180deg) translate3d(0,50%,0);transform:rotate(180deg) translate3d(0,50%,0)}.selectr-disabled{opacity:.6}.has-selected .selectr-placeholder,.selectr-empty{display:none}.has-selected .selectr-label{display:block}.taggable .selectr-selected{padding:4px 28px 4px 4px}.taggable .selectr-selected::after{display:table;content:" ";clear:both}.taggable .selectr-label{width:auto}.taggable .selectr-tags{float:left;display:block}.taggable .selectr-placeholder{display:none}.input-tag{float:left;min-width:90px;width:auto}.selectr-tag-input{border:medium none;padding:3px 10px;width:100%;font-family:inherit;font-weight:inherit;font-size:inherit}.selectr-input-container.loading::after{position:absolute;top:50%;right:20px;width:20px;height:20px;content:'';-o-transform:translate3d(0,-50%,0);-ms-transform:translate3d(0,-50%,0);-moz-transform:translate3d(0,-50%,0);-webkit-transform:translate3d(0,-50%,0);transform:translate3d(0,-50%,0);-o-transform-origin:50% 0 0;-ms-transform-origin:50% 0 0;-moz-transform-origin:50% 0 0;-webkit-transform-origin:50% 0 0;transform-origin:50% 0 0;-moz-animation:.5s linear 0s normal forwards infinite running spin;-webkit-animation:.5s linear 0s normal forwards infinite running spin;animation:.5s linear 0s normal forwards infinite running spin;border-width:3px;border-style:solid;border-color:#aaa #ddd #ddd;border-radius:50%}@-webkit-keyframes spin{0%{-webkit-transform:rotate(0) translate3d(0,-50%,0);transform:rotate(0) translate3d(0,-50%,0)}100%{-webkit-transform:rotate(360deg) translate3d(0,-50%,0);transform:rotate(360deg) translate3d(0,-50%,0)}}@keyframes spin{0%{-webkit-transform:rotate(0) translate3d(0,-50%,0);transform:rotate(0) translate3d(0,-50%,0)}100%{-webkit-transform:rotate(360deg) translate3d(0,-50%,0);transform:rotate(360deg) translate3d(0,-50%,0)}}.selectr-container.open.inverted .selectr-selected{border-color:transparent #999 #999;border-radius:0 0 3px 3px}.selectr-container.inverted .selectr-options-container{border-width:1px 1px 0;border-color:#999 #999 transparent;border-radius:3px 3px 0 0;background-color:#fff}.selectr-container.inverted .selectr-options-container{top:auto;bottom:calc(100% - 1px)}.selectr-container ::-webkit-input-placeholder{color:#6c7a86;opacity:1}.selectr-container ::-moz-placeholder{color:#6c7a86;opacity:1}.selectr-container :-ms-input-placeholder{color:#6c7a86;opacity:1}.selectr-container ::placeholder{color:#6c7a86;opacity:1}
\ No newline at end of file
diff --git a/demo/gdml/src/jsMain/web/css/main.css b/demo/gdml/src/jsMain/web/css/main.css
new file mode 100644
index 00000000..e7f925df
--- /dev/null
+++ b/demo/gdml/src/jsMain/web/css/main.css
@@ -0,0 +1,48 @@
+.loader {
+    border: 16px solid #f3f3f3; /* Light grey */
+    border-top: 16px solid #3498db; /* Blue */
+    border-radius: 50%;
+    width: 120px;
+    height: 120px;
+    animation: spin 2s linear infinite;
+}
+
+@keyframes spin {
+    0% { transform: rotate(0deg); }
+    100% { transform: rotate(360deg); }
+}
+
+/* Remove default bullets */
+ul, .objTree-subtree {
+    list-style-type: none;
+}
+
+/* Style the caret/arrow */
+.objTree-caret {
+    cursor: pointer;
+    user-select: none; /* Prevent text selection */
+}
+
+.objTree-label {
+    cursor: pointer;
+}
+
+/* Create the caret/arrow with a unicode, and style it */
+.objTree-caret::before {
+    content: "\25B6";
+    color: black;
+    display: inline-block;
+    margin-right: 6px;
+}
+
+.objTree-leaf::before {
+    content: "\25C6";
+    color: black;
+    display: inline-block;
+    margin-right: 6px;
+}
+
+/* Rotate the caret/arrow icon when clicked on (using JavaScript) */
+.objTree-caret-down::before {
+    transform: rotate(90deg);
+}
diff --git a/dataforge-vis-spatial-gdml/src/jsMain/web/css/img/jsoneditor-icons.svg b/demo/gdml/src/jsMain/web/img/jsoneditor-icons.svg
similarity index 100%
rename from dataforge-vis-spatial-gdml/src/jsMain/web/css/img/jsoneditor-icons.svg
rename to demo/gdml/src/jsMain/web/img/jsoneditor-icons.svg
diff --git a/dataforge-vis-spatial-gdml/src/jsMain/web/index.html b/demo/gdml/src/jsMain/web/index.html
similarity index 67%
rename from dataforge-vis-spatial-gdml/src/jsMain/web/index.html
rename to demo/gdml/src/jsMain/web/index.html
index 22603bcf..3b2a99b2 100644
--- a/dataforge-vis-spatial-gdml/src/jsMain/web/index.html
+++ b/demo/gdml/src/jsMain/web/index.html
@@ -4,13 +4,9 @@
     <meta charset="utf-8">
     <!--    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">-->
     <title>Three js demo for particle physics</title>
-    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"
-            integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8="
-            crossorigin="anonymous"></script>
     <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css"
           integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
     <link rel="stylesheet" href="css/main.css">
-    <link rel="stylesheet" href="css/inspire-tree-light.min.css">
     <link rel="stylesheet" href="css/jsoneditor.min.css">
     <script type="text/javascript" src="main.bundle.js"></script>
 </head>
@@ -37,12 +33,5 @@
         <div class="col-lg-3" id="editor"></div>
     </div>
 </div>
-
-<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js"
-        integrity="sha384-UO2eT0CpHqdSJQ6hJty5KVphtPhzWj9WO1clHTMGa3JDZwrnQq4sF86dIHNDz0W1"
-        crossorigin="anonymous"></script>
-<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js"
-        integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM"
-        crossorigin="anonymous"></script>
 </body>
 </html>
\ No newline at end of file
diff --git a/demo/gdml/src/jvmMain/kotlin/hep/dataforge/vis/spatial/gdml/demo/GDMLDemoApp.kt b/demo/gdml/src/jvmMain/kotlin/hep/dataforge/vis/spatial/gdml/demo/GDMLDemoApp.kt
new file mode 100644
index 00000000..b4a75c37
--- /dev/null
+++ b/demo/gdml/src/jvmMain/kotlin/hep/dataforge/vis/spatial/gdml/demo/GDMLDemoApp.kt
@@ -0,0 +1,79 @@
+package hep.dataforge.vis.spatial.gdml.demo
+
+import hep.dataforge.context.Global
+import hep.dataforge.vis.fx.editor.VisualObjectEditorFragment
+import hep.dataforge.vis.fx.editor.VisualObjectTreeFragment
+import hep.dataforge.vis.spatial.Material3D
+import hep.dataforge.vis.spatial.fx.FX3DPlugin
+import hep.dataforge.vis.spatial.fx.FXCanvas3D
+import hep.dataforge.vis.spatial.gdml.LUnit
+import hep.dataforge.vis.spatial.gdml.readFile
+import hep.dataforge.vis.spatial.gdml.toVisual
+import javafx.geometry.Orientation
+import javafx.scene.Parent
+import javafx.stage.FileChooser
+import scientifik.gdml.GDML
+import tornadofx.*
+
+class GDMLDemoApp : App(GDMLView::class)
+
+class GDMLView : View() {
+    private val fx3d = Global.plugins.fetch(FX3DPlugin)
+    private val canvas = FXCanvas3D(fx3d)
+
+    private val treeFragment = VisualObjectTreeFragment().apply {
+        this.itemProperty.bind(canvas.rootObjectProperty)
+    }
+
+    private val propertyEditor = VisualObjectEditorFragment {
+        it.allProperties()
+    }.apply {
+        descriptorProperty.set(Material3D.descriptor)
+        itemProperty.bind(treeFragment.selectedProperty)
+    }
+
+
+    override val root: Parent = borderpane {
+        top {
+            buttonbar {
+                button("Load GDML") {
+                    action {
+                        val file = chooseFile("Select a GDML file", filters = gdmlFilter).firstOrNull()
+                        if (file != null) {
+                            val obj = GDML.readFile(file.toPath()).toVisual {
+                                lUnit = LUnit.CM
+
+                                solidConfiguration = { parent, solid ->
+                                    if (solid.name == "cave") {
+                                        setProperty(Material3D.MATERIAL_WIREFRAME_KEY, true)
+                                    }
+                                    if (parent.physVolumes.isNotEmpty()) {
+                                        useStyle("opaque") {
+                                            Material3D.MATERIAL_OPACITY_KEY put 0.3
+                                        }
+                                    }
+                                }
+                            }
+                            canvas.render(obj)
+                        }
+                    }
+                }
+            }
+        }
+        center {
+            splitpane(Orientation.HORIZONTAL, treeFragment.root, canvas.root, propertyEditor.root) {
+                setDividerPositions(0.2, 0.6, 0.2)
+            }
+        }
+    }
+
+    companion object {
+        private val gdmlFilter = arrayOf(
+            FileChooser.ExtensionFilter("GDML", "*.gdml", "*.xml")
+        )
+    }
+}
+
+fun main() {
+    launch<GDMLDemoApp>()
+}
\ No newline at end of file
diff --git a/demo/muon-monitor/build.gradle.kts b/demo/muon-monitor/build.gradle.kts
new file mode 100644
index 00000000..48b34d0b
--- /dev/null
+++ b/demo/muon-monitor/build.gradle.kts
@@ -0,0 +1,69 @@
+import scientifik.useSerialization
+
+plugins {
+    id("scientifik.mpp")
+    //id("org.openjfx.javafxplugin")
+    id("application")
+}
+
+group = "ru.mipt.npm"
+
+useSerialization()
+
+val ktor_version = "1.3.0-rc"
+
+kotlin {
+
+    js {
+        browser {
+            webpackTask {
+                sourceMaps = true
+            }
+        }
+    }
+
+    val installJS = tasks.getByName<Copy>("installJsDist")
+
+    jvm {
+        withJava()
+        compilations.findByName("main").apply {
+            tasks.getByName<ProcessResources>("jvmProcessResources") {
+                dependsOn(installJS)
+                afterEvaluate {
+                    from(installJS.destinationDir)
+                }
+            }
+        }
+    }
+
+    sourceSets {
+        commonMain {
+            dependencies {
+                implementation(project(":dataforge-vis-spatial"))
+            }
+        }
+        jvmMain {
+            dependencies {
+                implementation("org.apache.commons:commons-math3:3.6.1")
+                implementation("io.ktor:ktor-server-cio:$ktor_version")
+                implementation("io.ktor:ktor-serialization:$ktor_version")
+            }
+        }
+        jsMain{
+            dependencies{
+                implementation("io.ktor:ktor-client-js:$ktor_version")
+                implementation("io.ktor:ktor-client-serialization-js:$ktor_version")
+                implementation(npm("text-encoding"))
+                implementation(npm("abort-controller"))
+            }
+        }
+    }
+}
+
+application {
+    mainClassName = "ru.mipt.npm.muon.monitor.server/MMServerKt"
+}
+
+//configure<JavaFXOptions> {
+//    modules("javafx.controls")
+//}
\ No newline at end of file
diff --git a/demo/muon-monitor/src/commonMain/kotlin/ru/mipt/npm/muon/monitor/Event.kt b/demo/muon-monitor/src/commonMain/kotlin/ru/mipt/npm/muon/monitor/Event.kt
new file mode 100644
index 00000000..5eddd7a4
--- /dev/null
+++ b/demo/muon-monitor/src/commonMain/kotlin/ru/mipt/npm/muon/monitor/Event.kt
@@ -0,0 +1,20 @@
+@file:UseSerializers(Point3DSerializer::class)
+package ru.mipt.npm.muon.monitor
+
+import hep.dataforge.vis.spatial.Point3D
+import hep.dataforge.vis.spatial.Point3DSerializer
+import kotlinx.serialization.Serializable
+import kotlinx.serialization.UseSerializers
+
+typealias Track = List<Point3D>
+
+/**
+ *
+ */
+@Serializable
+data class Event(val id: Int, val track: Track?, val hits: Collection<String>) {
+//    /**
+//     * The unique identity for given set of hits. One identity could correspond to different tracks
+//     */
+//    val id get() = hits.sorted().joinToString(separator = ", ", prefix = "[", postfix = "]")
+}
\ No newline at end of file
diff --git a/demo/muon-monitor/src/commonMain/kotlin/ru/mipt/npm/muon/monitor/Model.kt b/demo/muon-monitor/src/commonMain/kotlin/ru/mipt/npm/muon/monitor/Model.kt
new file mode 100644
index 00000000..e2d6afb0
--- /dev/null
+++ b/demo/muon-monitor/src/commonMain/kotlin/ru/mipt/npm/muon/monitor/Model.kt
@@ -0,0 +1,85 @@
+package ru.mipt.npm.muon.monitor
+
+import hep.dataforge.vis.common.removeAll
+import hep.dataforge.vis.spatial.*
+import ru.mipt.npm.muon.monitor.Monitor.CENTRAL_LAYER_Z
+import ru.mipt.npm.muon.monitor.Monitor.LOWER_LAYER_Z
+import ru.mipt.npm.muon.monitor.Monitor.UPPER_LAYER_Z
+import kotlin.math.PI
+
+class Model {
+    private val map = HashMap<String, VisualGroup3D>()
+    private val events = HashSet<Event>()
+
+    private fun VisualGroup3D.pixel(pixel: SC1) {
+        val group = group(pixel.name) {
+            position = Point3D(pixel.center.x, pixel.center.y, pixel.center.z)
+            box(pixel.xSize, pixel.ySize, pixel.zSize)
+            label(pixel.name) {
+                z = - Monitor.PIXEL_Z_SIZE / 2 - 5
+                rotationY = PI
+            }
+        }
+        map[pixel.name] = group
+    }
+
+    private fun VisualGroup3D.detector(detector: SC16) {
+        group(detector.name) {
+            detector.pixels.forEach {
+                pixel(it)
+            }
+        }
+    }
+
+    var tracks: VisualGroup3D
+
+    val root: VisualGroup3D = VisualGroup3D().apply {
+        rotationX = PI / 2
+        group("bottom") {
+            Monitor.detectors.filter { it.center.z == LOWER_LAYER_Z }.forEach {
+                detector(it)
+            }
+        }
+
+        group("middle") {
+            Monitor.detectors.filter { it.center.z == CENTRAL_LAYER_Z }.forEach {
+                detector(it)
+            }
+        }
+
+        group("top") {
+            Monitor.detectors.filter { it.center.z == UPPER_LAYER_Z }.forEach {
+                detector(it)
+            }
+        }
+
+        tracks = group("tracks")
+    }
+
+    private fun highlight(pixel: String) {
+        map[pixel]?.color("blue")
+    }
+
+    fun reset() {
+        map.values.forEach {
+            it.setProperty(Material3D.MATERIAL_COLOR_KEY, null)
+        }
+        tracks.removeAll()
+    }
+
+    fun displayEvent(event: Event) {
+        events.add(event)
+        event.hits.forEach {
+            highlight(it)
+        }
+        event.track?.let {
+            tracks.polyline(*it.toTypedArray(), name = "track[${event.id}]"){
+                thickness = 4
+            }
+        }
+    }
+
+    companion object {
+        fun buildGeometry() = Model().root
+    }
+}
\ No newline at end of file
diff --git a/demo/muon-monitor/src/commonMain/kotlin/ru/mipt/npm/muon/monitor/Monitor.kt b/demo/muon-monitor/src/commonMain/kotlin/ru/mipt/npm/muon/monitor/Monitor.kt
new file mode 100644
index 00000000..161854a8
--- /dev/null
+++ b/demo/muon-monitor/src/commonMain/kotlin/ru/mipt/npm/muon/monitor/Monitor.kt
@@ -0,0 +1,153 @@
+package ru.mipt.npm.muon.monitor
+
+import hep.dataforge.vis.spatial.Point3D
+import hep.dataforge.vis.spatial.plus
+import ru.mipt.npm.muon.monitor.Monitor.PIXEL_XY_SIZE
+import ru.mipt.npm.muon.monitor.Monitor.PIXEL_Z_SIZE
+
+/**
+ * A single pixel
+ */
+open class SC1(
+    val name: String,
+    val center: Point3D,
+    val xSize: Double = PIXEL_XY_SIZE, val ySize: Double = PIXEL_XY_SIZE, val zSize: Double = PIXEL_Z_SIZE
+)
+
+class SC16(
+    val name: String,
+    val center: Point3D
+) {
+
+    /**
+     * Build map for single SC16 detector
+     */
+    val pixels: Collection<SC1> by lazy {
+        (0 until 16).map { index ->
+            val x: Double
+            val y: Double
+            when (index) {
+                7 -> {
+                    x = 1.5 * Monitor.PIXEL_XY_SPACING;
+                    y = 1.5 * Monitor.PIXEL_XY_SPACING;
+                }
+                4 -> {
+                    x = 0.5 * Monitor.PIXEL_XY_SPACING;
+                    y = 1.5 * Monitor.PIXEL_XY_SPACING;
+                }
+                6 -> {
+                    x = 1.5 * Monitor.PIXEL_XY_SPACING;
+                    y = 0.5 * Monitor.PIXEL_XY_SPACING;
+                }
+                5 -> {
+                    x = 0.5 * Monitor.PIXEL_XY_SPACING;
+                    y = 0.5 * Monitor.PIXEL_XY_SPACING;
+                }
+
+                3 -> {
+                    x = -1.5 * Monitor.PIXEL_XY_SPACING;
+                    y = 1.5 * Monitor.PIXEL_XY_SPACING;
+                }
+                0 -> {
+                    x = -0.5 * Monitor.PIXEL_XY_SPACING;
+                    y = 1.5 * Monitor.PIXEL_XY_SPACING;
+                }
+                2 -> {
+                    x = -1.5 * Monitor.PIXEL_XY_SPACING;
+                    y = 0.5 * Monitor.PIXEL_XY_SPACING;
+                }
+                1 -> {
+                    x = -0.5 * Monitor.PIXEL_XY_SPACING;
+                    y = 0.5 * Monitor.PIXEL_XY_SPACING;
+                }
+
+                11 -> {
+                    x = -1.5 * Monitor.PIXEL_XY_SPACING;
+                    y = -1.5 * Monitor.PIXEL_XY_SPACING;
+                }
+                8 -> {
+                    x = -0.5 * Monitor.PIXEL_XY_SPACING;
+                    y = -1.5 * Monitor.PIXEL_XY_SPACING;
+                }
+                10 -> {
+                    x = -1.5 * Monitor.PIXEL_XY_SPACING;
+                    y = -0.5 * Monitor.PIXEL_XY_SPACING;
+                }
+                9 -> {
+                    x = -0.5 * Monitor.PIXEL_XY_SPACING;
+                    y = -0.5 * Monitor.PIXEL_XY_SPACING;
+                }
+
+                15 -> {
+                    x = 1.5 * Monitor.PIXEL_XY_SPACING;
+                    y = -1.5 * Monitor.PIXEL_XY_SPACING;
+                }
+                12 -> {
+                    x = 0.5 * Monitor.PIXEL_XY_SPACING;
+                    y = -1.5 * Monitor.PIXEL_XY_SPACING;
+                }
+                14 -> {
+                    x = 1.5 * Monitor.PIXEL_XY_SPACING;
+                    y = -0.5 * Monitor.PIXEL_XY_SPACING;
+                }
+                13 -> {
+                    x = 0.5 * Monitor.PIXEL_XY_SPACING;
+                    y = -0.5 * Monitor.PIXEL_XY_SPACING;
+                }
+                else -> throw Error();
+            }
+            val offset = Point3D(-y, x, 0)//rotateDetector(Point3D(x, y, 0.0));
+            val pixelName = "${name}_${index}"
+            SC1(pixelName, center + offset)
+        }
+    }
+}
+
+//class Layer(val name: String, val z: Double) {
+//    val detectors: Collection<SC16> by lazy {
+//
+//    }
+//}
+
+
+expect fun readResource(path: String): String
+
+internal expect fun readMonitorConfig(): String
+
+/**
+ * General geometry definitions
+ * Created by darksnake on 09-May-16.
+ */
+object Monitor {
+
+    const val GEOMETRY_TOLERANCE = 0.01
+    const val PIXEL_XY_SIZE = 122.0
+    const val PIXEL_XY_SPACING = 123.2
+    const val PIXEL_Z_SIZE = 30.0
+    const val CENTRAL_LAYER_Z = 0.0
+    const val UPPER_LAYER_Z = -166.0
+    const val LOWER_LAYER_Z = 180.0
+
+    /**
+     * Build map for the whole monitor
+     */
+    val detectors: Collection<SC16> by lazy {
+        readMonitorConfig()
+            .lineSequence()
+            .mapNotNull { line ->
+                if (line.startsWith(" ")) {
+                    val split = line.trim().split("\\s+".toRegex())
+                    val detectorName = split[1];
+                    val x = split[4].toDouble() - 500
+                    val y = split[5].toDouble() - 500
+                    val z = 180 - split[6].toDouble()
+                    SC16(detectorName, Point3D(x, y, z))
+                } else {
+                    null
+                }
+            }.toList()
+    }
+
+    val pixels: Collection<SC1> get() = detectors.flatMap { it.pixels }
+
+}
\ No newline at end of file
diff --git a/demo/muon-monitor/src/commonMain/resources/map-RMM110.sc16 b/demo/muon-monitor/src/commonMain/resources/map-RMM110.sc16
new file mode 100644
index 00000000..6d55e7da
--- /dev/null
+++ b/demo/muon-monitor/src/commonMain/resources/map-RMM110.sc16
@@ -0,0 +1,27 @@
+--Place-|-SC16-|-TB-CHN-|-HB-CHN-|-X-coord-|-Y-coord-|-Z-coord-|-Theta-|-Phi
+----------------------------------------------------------------------------
+ RT100     SC86     3        0         0      1000         0     0      270
+ RT100     SC87     6        1         0       500         0     0      270
+ RT100     SC88     8        2         0         0         0     0      270
+ RT100     SC91     9        3       500      1000         0     0      270
+ RT100     SC92    10        4       500       500         0     0      270
+ RT100     SC93    11        5       500         0         0     0      270
+ RT100     SC94    12        6      1000      1000         0     0      270
+ RT100     SC85    13        7      1000       500         0     0      270
+ RT100     SC96    15        8      1000         0         0     0      270
+###
+ RT100     SC81    26       12       250       750       180     0      270
+ RT100     SC82    27       11       250       250       180     0      270
+ RT100     SC83    28       23       750       750       180     0      270
+ RT100     SC84    29        9       750       250       180     0      270
+###
+ RT100     SC72    80       21      1000         0       346     0      270
+ RT100     SC73    79       20      1000       500       346     0      270
+ RT100     SC74    78       19      1000      1000       346     0      270
+ RT100     SC75    77       18       500         0       346     0      270
+ RT100     SC76    84       17       500       500       346     0      270
+ RT100     SC77    75       16       500      1000       346     0      270
+ RT100     SC78    74       15         0         0       346     0      270
+ RT100     SC79    73       14         0       500       346     0      270
+ RT100     SC80    72       13         0      1000       346     0      270
+STOP
diff --git a/demo/muon-monitor/src/jsMain/kotlin/ru/mipt/npm/muon/monitor/MMDemoApp.kt b/demo/muon-monitor/src/jsMain/kotlin/ru/mipt/npm/muon/monitor/MMDemoApp.kt
new file mode 100644
index 00000000..a9fac312
--- /dev/null
+++ b/demo/muon-monitor/src/jsMain/kotlin/ru/mipt/npm/muon/monitor/MMDemoApp.kt
@@ -0,0 +1,111 @@
+package ru.mipt.npm.muon.monitor
+
+import hep.dataforge.context.Global
+import hep.dataforge.js.Application
+import hep.dataforge.js.startApplication
+import hep.dataforge.meta.buildMeta
+import hep.dataforge.meta.withBottom
+import hep.dataforge.names.NameToken
+import hep.dataforge.vis.js.editor.card
+import hep.dataforge.vis.js.editor.objectTree
+import hep.dataforge.vis.js.editor.propertyEditor
+import hep.dataforge.vis.spatial.Material3D.Companion.MATERIAL_COLOR_KEY
+import hep.dataforge.vis.spatial.Material3D.Companion.MATERIAL_OPACITY_KEY
+import hep.dataforge.vis.spatial.Material3D.Companion.MATERIAL_WIREFRAME_KEY
+import hep.dataforge.vis.spatial.Visual3DPlugin
+import hep.dataforge.vis.spatial.VisualObject3D
+import hep.dataforge.vis.spatial.VisualObject3D.Companion.VISIBLE_KEY
+import hep.dataforge.vis.spatial.three.ThreePlugin
+import hep.dataforge.vis.spatial.three.output
+import hep.dataforge.vis.spatial.three.threeSettings
+import hep.dataforge.vis.spatial.visible
+import io.ktor.client.HttpClient
+import io.ktor.client.features.json.JsonFeature
+import io.ktor.client.features.json.serializer.KotlinxSerializer
+import io.ktor.client.request.get
+import kotlinx.coroutines.GlobalScope
+import kotlinx.coroutines.launch
+import kotlinx.html.js.button
+import kotlinx.html.js.onClickFunction
+import org.w3c.dom.HTMLElement
+import kotlin.browser.document
+import kotlin.dom.clear
+
+private class GDMLDemoApp : Application {
+
+    private val model = Model()
+
+    private val connection = HttpClient{
+        install(JsonFeature) {
+            serializer = KotlinxSerializer(Visual3DPlugin.json)
+        }
+    }
+
+    override fun start(state: Map<String, Any>) {
+
+        val context = Global.context("demo") {}
+        val three = context.plugins.load(ThreePlugin)
+        //val url = URL("https://drive.google.com/open?id=1w5e7fILMN83JGgB8WANJUYm8OW2s0WVO")
+
+        val canvasElement = document.getElementById("canvas") ?: error("Element with id 'canvas' not found on page")
+        val settingsElement =
+            document.getElementById("settings") ?: error("Element with id 'settings' not found on page")
+        val treeElement = document.getElementById("tree") ?: error("Element with id 'tree' not found on page")
+        val editorElement = document.getElementById("editor") ?: error("Element with id 'editor' not found on page")
+        canvasElement.clear()
+
+        canvasElement.clear()
+        val visual: VisualObject3D = model.root
+
+        //output.camera.layers.enable(1)
+        val output = three.output(canvasElement as HTMLElement)
+
+        output.camera.layers.set(0)
+        output.camera.position.z = -2000.0
+        output.camera.position.y = 500.0
+        settingsElement.threeSettings(output){
+            card("Events") {
+                button {
+                    +"Next"
+                    onClickFunction = {
+                        GlobalScope.launch {
+                            val event = connection.get<Event>("http://localhost:8080/event")
+                            model.displayEvent(event)
+                        }
+                    }
+                }
+                button {
+                    +"Clear"
+                    onClickFunction = {
+                        model.reset()
+                    }
+                }
+            }
+        }
+        //tree.visualObjectTree(visual, editor::propertyEditor)
+        treeElement.objectTree(NameToken("World"), visual) {
+            editorElement.propertyEditor(it) { item ->
+                //val descriptorMeta = Material3D.descriptor
+
+                val properties = item.allProperties()
+                val bottom = buildMeta {
+                    VISIBLE_KEY put (item.visible ?: true)
+                    if (item is VisualObject3D) {
+                        MATERIAL_COLOR_KEY put "#ffffff"
+                        MATERIAL_OPACITY_KEY put 1.0
+                        MATERIAL_WIREFRAME_KEY put false
+                    }
+                }
+                properties.withBottom(bottom)
+            }
+        }
+
+
+        output.render(visual)
+
+    }
+}
+
+fun main() {
+    startApplication(::GDMLDemoApp)
+}
\ No newline at end of file
diff --git a/demo/muon-monitor/src/jsMain/kotlin/ru/mipt/npm/muon/monitor/readResource.kt b/demo/muon-monitor/src/jsMain/kotlin/ru/mipt/npm/muon/monitor/readResource.kt
new file mode 100644
index 00000000..46242a20
--- /dev/null
+++ b/demo/muon-monitor/src/jsMain/kotlin/ru/mipt/npm/muon/monitor/readResource.kt
@@ -0,0 +1,40 @@
+package ru.mipt.npm.muon.monitor
+
+import hep.dataforge.js.requireJS
+
+actual fun readResource(path: String): String {
+    return requireJS(path) as String
+}
+
+// TODO replace by resource
+internal actual fun readMonitorConfig(): String{
+    return """
+        --Place-|-SC16-|-TB-CHN-|-HB-CHN-|-X-coord-|-Y-coord-|-Z-coord-|-Theta-|-Phi
+        ----------------------------------------------------------------------------
+         RT100     SC86     3        0         0      1000         0     0      270
+         RT100     SC87     6        1         0       500         0     0      270
+         RT100     SC88     8        2         0         0         0     0      270
+         RT100     SC91     9        3       500      1000         0     0      270
+         RT100     SC92    10        4       500       500         0     0      270
+         RT100     SC93    11        5       500         0         0     0      270
+         RT100     SC94    12        6      1000      1000         0     0      270
+         RT100     SC85    13        7      1000       500         0     0      270
+         RT100     SC96    15        8      1000         0         0     0      270
+        ###
+         RT100     SC81    26       12       250       750       180     0      270
+         RT100     SC82    27       11       250       250       180     0      270
+         RT100     SC83    28       23       750       750       180     0      270
+         RT100     SC84    29        9       750       250       180     0      270
+        ###
+         RT100     SC72    80       21      1000         0       346     0      270
+         RT100     SC73    79       20      1000       500       346     0      270
+         RT100     SC74    78       19      1000      1000       346     0      270
+         RT100     SC75    77       18       500         0       346     0      270
+         RT100     SC76    84       17       500       500       346     0      270
+         RT100     SC77    75       16       500      1000       346     0      270
+         RT100     SC78    74       15         0         0       346     0      270
+         RT100     SC79    73       14         0       500       346     0      270
+         RT100     SC80    72       13         0      1000       346     0      270
+        STOP
+    """.trimIndent()
+}
\ No newline at end of file
diff --git a/demo/muon-monitor/src/jsMain/web/css/jsoneditor.min.css b/demo/muon-monitor/src/jsMain/web/css/jsoneditor.min.css
new file mode 100644
index 00000000..63190af9
--- /dev/null
+++ b/demo/muon-monitor/src/jsMain/web/css/jsoneditor.min.css
@@ -0,0 +1,6 @@
+.jsoneditor .search input{height:auto;border:inherit;border:none;box-shadow:none}.jsoneditor table{border-collapse:collapse;width:auto}.jsoneditor td,.jsoneditor th{padding:0;display:table-cell;text-align:left;vertical-align:inherit;border-radius:inherit}.jsoneditor{color:#1a1a1a;border:thin solid #3883fa;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box;width:100%;height:100%;position:relative;padding:0;line-height:100%}div.jsoneditor-default,div.jsoneditor-field,div.jsoneditor-readonly,div.jsoneditor-value{border:1px solid transparent;min-height:16px;min-width:32px;padding:2px;margin:1px;word-wrap:break-word;float:left}div.jsoneditor-field p,div.jsoneditor-value p{margin:0}div.jsoneditor-value{word-break:break-word}div.jsoneditor-value.jsoneditor-empty::after{content:"value"}div.jsoneditor-value.jsoneditor-string{color:#006000}div.jsoneditor-value.jsoneditor-number{color:#ee422e}div.jsoneditor-value.jsoneditor-boolean{color:#ff8c00}div.jsoneditor-value.jsoneditor-null{color:#004ed0}div.jsoneditor-value.jsoneditor-invalid{color:#000}div.jsoneditor-readonly{min-width:16px;color:grey}div.jsoneditor-empty{border-color:#d3d3d3;border-style:dashed;border-radius:2px}div.jsoneditor-field.jsoneditor-empty::after{content:"field"}div.jsoneditor td{vertical-align:top}div.jsoneditor td.jsoneditor-separator{padding:3px 0;vertical-align:top;color:grey}div.jsoneditor td.jsoneditor-tree{vertical-align:top}div.jsoneditor div.jsoneditor-anchor{cursor:pointer}div.jsoneditor div.jsoneditor-anchor .picker_wrapper.popup.popup_bottom{top:28px;left:-10px}div.jsoneditor.busy pre.jsoneditor-preview{background:#f5f5f5;color:grey}div.jsoneditor.busy div.jsoneditor-busy{display:inherit}div.jsoneditor code.jsoneditor-preview{background:0 0}div.jsoneditor.jsoneditor-mode-preview pre.jsoneditor-preview{width:100%;height:100%;box-sizing:border-box;overflow:auto;padding:2px;margin:0;white-space:pre-wrap;word-break:break-all}div.jsoneditor-default{color:grey;padding-left:10px}div.jsoneditor-tree{width:100%;height:100%;position:relative;overflow:auto}div.jsoneditor-tree button.jsoneditor-button{width:24px;height:24px;padding:0;margin:0;border:none;cursor:pointer;background:transparent url(../img/jsoneditor-icons.svg)}div.jsoneditor-tree button.jsoneditor-button:focus{background-color:#f5f5f5;outline:#e5e5e5 solid 1px}div.jsoneditor-tree button.jsoneditor-collapsed{background-position:0 -48px}div.jsoneditor-tree button.jsoneditor-expanded{background-position:0 -72px}div.jsoneditor-tree button.jsoneditor-contextmenu{background-position:-48px -72px}div.jsoneditor-tree button.jsoneditor-invisible{visibility:hidden;background:0 0}div.jsoneditor-tree button.jsoneditor-dragarea{background:url(../img/jsoneditor-icons.svg) -72px -72px;cursor:move}div.jsoneditor-tree :focus{outline:0}div.jsoneditor-tree div.jsoneditor-show-more{display:inline-block;padding:3px 4px;margin:2px 0;background-color:#e5e5e5;border-radius:3px;color:grey;font-family:arial,sans-serif;font-size:10pt}div.jsoneditor-tree div.jsoneditor-show-more a{display:inline-block;color:grey}div.jsoneditor-tree div.jsoneditor-color{display:inline-block;width:12px;height:12px;margin:4px;border:1px solid grey;cursor:pointer}div.jsoneditor-tree div.jsoneditor-date{background:#a1a1a1;color:#fff;font-family:arial,sans-serif;border-radius:3px;display:inline-block;padding:3px;margin:0 3px}div.jsoneditor-tree table.jsoneditor-tree{border-collapse:collapse;border-spacing:0;width:100%}div.jsoneditor-tree .jsoneditor-button.jsoneditor-schema-error{width:24px;height:24px;padding:0;margin:0 4px 0 0;background:url(../img/jsoneditor-icons.svg) -168px -48px}div.jsoneditor-outer{position:static;width:100%;height:100%;margin:0;padding:0;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box}div.jsoneditor-outer.has-nav-bar{margin-top:-26px;padding-top:26px}div.jsoneditor-outer.has-nav-bar.has-main-menu-bar{margin-top:-61px;padding-top:61px}div.jsoneditor-outer.has-status-bar{margin-bottom:-26px;padding-bottom:26px}div.jsoneditor-outer.has-main-menu-bar{margin-top:-35px;padding-top:35px}div.jsoneditor-busy{position:absolute;top:15%;left:0;box-sizing:border-box;width:100%;text-align:center;display:none}div.jsoneditor-busy span{background-color:#ffffab;border:1px solid #fe0;border-radius:3px;padding:5px 15px;box-shadow:0 0 5px rgba(0,0,0,.4)}div.jsoneditor-field.jsoneditor-empty::after,div.jsoneditor-value.jsoneditor-empty::after{pointer-events:none;color:#d3d3d3;font-size:8pt}a.jsoneditor-value.jsoneditor-url,div.jsoneditor-value.jsoneditor-url{color:#006000;text-decoration:underline}a.jsoneditor-value.jsoneditor-url{display:inline-block;padding:2px;margin:2px}a.jsoneditor-value.jsoneditor-url:focus,a.jsoneditor-value.jsoneditor-url:hover{color:#ee422e}div.jsoneditor-field.jsoneditor-highlight,div.jsoneditor-field[contenteditable=true]:focus,div.jsoneditor-field[contenteditable=true]:hover,div.jsoneditor-value.jsoneditor-highlight,div.jsoneditor-value[contenteditable=true]:focus,div.jsoneditor-value[contenteditable=true]:hover{background-color:#ffffab;border:1px solid #fe0;border-radius:2px}div.jsoneditor-field.jsoneditor-highlight-active,div.jsoneditor-field.jsoneditor-highlight-active:focus,div.jsoneditor-field.jsoneditor-highlight-active:hover,div.jsoneditor-value.jsoneditor-highlight-active,div.jsoneditor-value.jsoneditor-highlight-active:focus,div.jsoneditor-value.jsoneditor-highlight-active:hover{background-color:#fe0;border:1px solid #ffc700;border-radius:2px}div.jsoneditor-value.jsoneditor-array,div.jsoneditor-value.jsoneditor-object{min-width:16px}div.jsoneditor-mode-form tr.jsoneditor-expandable td.jsoneditor-tree,div.jsoneditor-mode-view tr.jsoneditor-expandable td.jsoneditor-tree{cursor:pointer}div.jsoneditor-tree button.jsoneditor-contextmenu.jsoneditor-selected,div.jsoneditor-tree button.jsoneditor-contextmenu:focus,div.jsoneditor-tree button.jsoneditor-contextmenu:hover,tr.jsoneditor-selected.jsoneditor-first button.jsoneditor-contextmenu{background-position:-48px -48px}div.jsoneditor-tree div.jsoneditor-show-more a:focus,div.jsoneditor-tree div.jsoneditor-show-more a:hover{color:#ee422e}.ace-jsoneditor,textarea.jsoneditor-text{min-height:150px}textarea.jsoneditor-text{width:100%;height:100%;margin:0;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box;outline-width:0;border:none;background-color:#fff;resize:none}tr.jsoneditor-highlight,tr.jsoneditor-selected{background-color:#d3d3d3}tr.jsoneditor-selected button.jsoneditor-contextmenu,tr.jsoneditor-selected button.jsoneditor-dragarea{visibility:hidden}tr.jsoneditor-selected.jsoneditor-first button.jsoneditor-contextmenu,tr.jsoneditor-selected.jsoneditor-first button.jsoneditor-dragarea{visibility:visible}div.jsoneditor-tree button.jsoneditor-dragarea:focus,div.jsoneditor-tree button.jsoneditor-dragarea:hover,tr.jsoneditor-selected.jsoneditor-first button.jsoneditor-dragarea{background-position:-72px -48px}div.jsoneditor td,div.jsoneditor th,div.jsoneditor tr{padding:0;margin:0}.jsoneditor-popover,.jsoneditor-schema-error,div.jsoneditor td,div.jsoneditor textarea,div.jsoneditor th,div.jsoneditor-field,div.jsoneditor-value,pre.jsoneditor-preview{font-family:"dejavu sans mono","droid sans mono",consolas,monaco,"lucida console","courier new",courier,monospace,sans-serif;font-size:10pt;color:#1a1a1a}.jsoneditor-schema-error{cursor:default;display:inline-block;height:24px;line-height:24px;position:relative;text-align:center;width:24px}.jsoneditor-popover{background-color:#4c4c4c;border-radius:3px;box-shadow:0 0 5px rgba(0,0,0,.4);color:#fff;padding:7px 10px;position:absolute;cursor:auto;width:200px;z-index:999}.jsoneditor-popover.jsoneditor-above{bottom:32px;left:-98px}.jsoneditor-popover.jsoneditor-above:before{border-top:7px solid #4c4c4c;bottom:-7px}.jsoneditor-popover.jsoneditor-below{top:32px;left:-98px}.jsoneditor-popover.jsoneditor-below:before{border-bottom:7px solid #4c4c4c;top:-7px}.jsoneditor-popover.jsoneditor-left{top:-7px;right:32px}.jsoneditor-popover.jsoneditor-left:before{border-left:7px solid #4c4c4c;border-top:7px solid transparent;border-bottom:7px solid transparent;content:"";top:19px;right:-14px;left:inherit;margin-left:inherit;margin-top:-7px;position:absolute}.jsoneditor-popover.jsoneditor-right{top:-7px;left:32px}.jsoneditor-popover.jsoneditor-right:before{border-right:7px solid #4c4c4c;border-top:7px solid transparent;border-bottom:7px solid transparent;content:"";top:19px;left:-14px;margin-left:inherit;margin-top:-7px;position:absolute}.jsoneditor-popover:before{border-right:7px solid transparent;border-left:7px solid transparent;content:"";display:block;left:50%;margin-left:-7px;position:absolute}.jsoneditor-text-errors tr.jump-to-line:hover{text-decoration:underline;cursor:pointer}.jsoneditor-schema-error:focus .jsoneditor-popover,.jsoneditor-schema-error:hover .jsoneditor-popover{display:block;animation:fade-in .3s linear 1,move-up .3s linear 1}@keyframes fade-in{from{opacity:0}to{opacity:1}}.jsoneditor .jsoneditor-validation-errors-container{max-height:130px;overflow-y:auto}.jsoneditor .jsoneditor-validation-errors{width:100%;overflow:hidden}.jsoneditor .jsoneditor-additional-errors{position:absolute;margin:auto;bottom:31px;left:calc(50% - 92px);color:grey;background-color:#ebebeb;padding:7px 15px;border-radius:8px}.jsoneditor .jsoneditor-additional-errors.visible{visibility:visible;opacity:1;transition:opacity 2s linear}.jsoneditor .jsoneditor-additional-errors.hidden{visibility:hidden;opacity:0;transition:visibility 0s 2s,opacity 2s linear}.jsoneditor .jsoneditor-text-errors{width:100%;border-collapse:collapse;border-top:1px solid #ffc700}.jsoneditor .jsoneditor-text-errors td{padding:3px 6px;vertical-align:middle}.jsoneditor .jsoneditor-text-errors td pre{margin:0;white-space:normal}.jsoneditor .jsoneditor-text-errors tr{background-color:#ffffab}.jsoneditor .jsoneditor-text-errors tr.parse-error{background-color:#ee2e2e70}.jsoneditor-text-errors .jsoneditor-schema-error{border:none;width:24px;height:24px;padding:0;margin:0 4px 0 0;cursor:pointer}.jsoneditor-text-errors tr .jsoneditor-schema-error{background:url(../img/jsoneditor-icons.svg) -168px -48px}.jsoneditor-text-errors tr.parse-error .jsoneditor-schema-error{background:url(../img/jsoneditor-icons.svg) -25px 0}.fadein{-webkit-animation:fadein .3s;animation:fadein .3s;-moz-animation:fadein .3s;-o-animation:fadein .3s}@keyframes fadein{0%{opacity:0}100%{opacity:1}}.jsoneditor-contextmenu-root{position:relative;width:0;height:0}.jsoneditor-contextmenu{position:absolute;box-sizing:content-box;z-index:99}.jsoneditor-contextmenu .jsoneditor-menu{position:relative;left:0;top:0;width:128px;height:auto;background:#fff;border:1px solid #d3d3d3;box-shadow:2px 2px 12px rgba(128,128,128,.3);list-style:none;margin:0;padding:0}.jsoneditor-contextmenu .jsoneditor-menu button{position:relative;padding:0 4px 0 0;margin:0;width:128px;height:auto;border:none;cursor:pointer;color:#4d4d4d;background:0 0;font-size:10pt;font-family:arial,sans-serif;box-sizing:border-box;text-align:left}.jsoneditor-contextmenu .jsoneditor-menu button::-moz-focus-inner{padding:0;border:0}.jsoneditor-contextmenu .jsoneditor-menu button.jsoneditor-default{width:96px}.jsoneditor-contextmenu .jsoneditor-menu button.jsoneditor-expand{float:right;width:32px;height:24px;border-left:1px solid #e5e5e5}.jsoneditor-contextmenu .jsoneditor-menu li{overflow:hidden}.jsoneditor-contextmenu .jsoneditor-menu li ul{display:none;position:relative;left:-10px;top:0;border:none;box-shadow:inset 0 0 10px rgba(128,128,128,.5);padding:0 10px;-webkit-transition:all .3s ease-out;-moz-transition:all .3s ease-out;-o-transition:all .3s ease-out;transition:all .3s ease-out}.jsoneditor-contextmenu .jsoneditor-menu li ul .jsoneditor-icon{margin-left:24px}.jsoneditor-contextmenu .jsoneditor-menu li ul li button{padding-left:24px;animation:all ease-in-out 1s}.jsoneditor-contextmenu .jsoneditor-menu li button .jsoneditor-expand{position:absolute;top:0;right:0;width:24px;height:24px;padding:0;margin:0 4px 0 0;background:url(../img/jsoneditor-icons.svg) 0 -72px}.jsoneditor-contextmenu .jsoneditor-icon{position:absolute;top:0;left:0;width:24px;height:24px;border:none;padding:0;margin:0;background-image:url(../img/jsoneditor-icons.svg)}.jsoneditor-contextmenu .jsoneditor-text{padding:4px 0 4px 24px;word-wrap:break-word}.jsoneditor-contextmenu .jsoneditor-text.jsoneditor-right-margin{padding-right:24px}.jsoneditor-contextmenu .jsoneditor-separator{height:0;border-top:1px solid #e5e5e5;padding-top:5px;margin-top:5px}.jsoneditor-contextmenu button.jsoneditor-remove .jsoneditor-icon{background-position:-24px 0}.jsoneditor-contextmenu button.jsoneditor-append .jsoneditor-icon{background-position:0 0}.jsoneditor-contextmenu button.jsoneditor-insert .jsoneditor-icon{background-position:0 0}.jsoneditor-contextmenu button.jsoneditor-duplicate .jsoneditor-icon{background-position:-48px 0}.jsoneditor-contextmenu button.jsoneditor-sort-asc .jsoneditor-icon{background-position:-168px 0}.jsoneditor-contextmenu button.jsoneditor-sort-desc .jsoneditor-icon{background-position:-192px 0}.jsoneditor-contextmenu button.jsoneditor-transform .jsoneditor-icon{background-position:-216px 0}.jsoneditor-contextmenu button.jsoneditor-extract .jsoneditor-icon{background-position:0 -24px}.jsoneditor-contextmenu button.jsoneditor-type-string .jsoneditor-icon{background-position:-144px 0}.jsoneditor-contextmenu button.jsoneditor-type-auto .jsoneditor-icon{background-position:-120px 0}.jsoneditor-contextmenu button.jsoneditor-type-object .jsoneditor-icon{background-position:-72px 0}.jsoneditor-contextmenu button.jsoneditor-type-array .jsoneditor-icon{background-position:-96px 0}.jsoneditor-contextmenu button.jsoneditor-type-modes .jsoneditor-icon{background-image:none;width:6px}.jsoneditor-contextmenu li,.jsoneditor-contextmenu ul{box-sizing:content-box;position:relative}.jsoneditor-contextmenu .jsoneditor-menu button:focus,.jsoneditor-contextmenu .jsoneditor-menu button:hover{color:#1a1a1a;background-color:#f5f5f5;outline:0}.jsoneditor-contextmenu .jsoneditor-menu li button.jsoneditor-selected,.jsoneditor-contextmenu .jsoneditor-menu li button.jsoneditor-selected:focus,.jsoneditor-contextmenu .jsoneditor-menu li button.jsoneditor-selected:hover{color:#fff;background-color:#ee422e}.jsoneditor-contextmenu .jsoneditor-menu li ul li button:focus,.jsoneditor-contextmenu .jsoneditor-menu li ul li button:hover{background-color:#f5f5f5}.jsoneditor-modal{max-width:95%;border-radius:2px!important;padding:45px 15px 15px 15px!important;box-shadow:2px 2px 12px rgba(128,128,128,.3);color:#4d4d4d;line-height:1.3em}.jsoneditor-modal.jsoneditor-modal-transform{width:600px!important}.jsoneditor-modal .pico-modal-header{position:absolute;box-sizing:border-box;top:0;left:0;width:100%;padding:0 10px;height:30px;line-height:30px;font-family:arial,sans-serif;font-size:11pt;background:#3883fa;color:#fff}.jsoneditor-modal table{width:100%}.jsoneditor-modal table td{padding:3px 0}.jsoneditor-modal table td.jsoneditor-modal-input{text-align:right;padding-right:0;white-space:nowrap}.jsoneditor-modal table td.jsoneditor-modal-actions{padding-top:15px}.jsoneditor-modal table th{vertical-align:middle}.jsoneditor-modal p:first-child{margin-top:0}.jsoneditor-modal a{color:#3883fa}.jsoneditor-modal .jsoneditor-jmespath-block{margin-bottom:10px}.jsoneditor-modal .pico-close{background:0 0!important;font-size:24px!important;top:7px!important;right:7px!important;color:#fff}.jsoneditor-modal input{padding:4px}.jsoneditor-modal input[type=text]{cursor:inherit}.jsoneditor-modal input[disabled]{background:#d3d3d3;color:grey}.jsoneditor-modal .jsoneditor-select-wrapper{position:relative;display:inline-block}.jsoneditor-modal .jsoneditor-select-wrapper:after{content:"";width:0;height:0;border-left:5px solid transparent;border-right:5px solid transparent;border-top:6px solid #666;position:absolute;right:8px;top:14px;pointer-events:none}.jsoneditor-modal select{padding:3px 24px 3px 10px;min-width:180px;max-width:350px;-webkit-appearance:none;-moz-appearance:none;appearance:none;text-indent:0;text-overflow:"";font-size:10pt;line-height:1.5em}.jsoneditor-modal select::-ms-expand{display:none}.jsoneditor-modal .jsoneditor-button-group input{padding:4px 10px;margin:0;border-radius:0;border-left-style:none}.jsoneditor-modal .jsoneditor-button-group input.jsoneditor-button-first{border-top-left-radius:3px;border-bottom-left-radius:3px;border-left-style:solid}.jsoneditor-modal .jsoneditor-button-group input.jsoneditor-button-last{border-top-right-radius:3px;border-bottom-right-radius:3px}.jsoneditor-modal .jsoneditor-transform-preview{background:#f5f5f5;height:200px}.jsoneditor-modal .jsoneditor-transform-preview.jsoneditor-error{color:#ee422e}.jsoneditor-modal .jsoneditor-jmespath-wizard{line-height:1.2em;width:100%;padding:0;border-radius:3px}.jsoneditor-modal .jsoneditor-jmespath-label{font-weight:700;color:#1e90ff;margin-top:20px;margin-bottom:5px}.jsoneditor-modal .jsoneditor-jmespath-wizard-table{width:100%}.jsoneditor-modal .jsoneditor-jmespath-wizard-label{font-style:italic;margin:4px 0 2px 0}.jsoneditor-modal .jsoneditor-inline{position:relative;display:inline-block;width:100%;padding-top:2px;padding-bottom:2px}.jsoneditor-modal .jsoneditor-inline:not(:last-child){padding-right:2px}.jsoneditor-modal .jsoneditor-jmespath-filter{display:flex;flex-wrap:wrap}.jsoneditor-modal .jsoneditor-jmespath-filter-field{width:180px}.jsoneditor-modal .jsoneditor-jmespath-filter-relation{width:100px}.jsoneditor-modal .jsoneditor-jmespath-filter-value{min-width:180px;flex:1}.jsoneditor-modal .jsoneditor-jmespath-sort-field{width:170px}.jsoneditor-modal .jsoneditor-jmespath-sort-order{width:150px}.jsoneditor-modal .jsoneditor-jmespath-select-fields{width:100%}.jsoneditor-modal .selectr-selected{border-color:#d3d3d3;padding:4px 28px 4px 8px}.jsoneditor-modal .selectr-selected .selectr-tag{background-color:#3883fa;border-radius:5px}.jsoneditor-modal table td,.jsoneditor-modal table th{text-align:left;vertical-align:top;font-weight:400;color:#4d4d4d;border-spacing:0;border-collapse:collapse}.jsoneditor-modal #query,.jsoneditor-modal input,.jsoneditor-modal select,.jsoneditor-modal textarea{background:#fff;border:1px solid #d3d3d3;color:#4d4d4d;border-radius:3px;padding:4px}.jsoneditor-modal,.jsoneditor-modal #query,.jsoneditor-modal input,.jsoneditor-modal option,.jsoneditor-modal select,.jsoneditor-modal table td,.jsoneditor-modal table th,.jsoneditor-modal textarea{font-size:10.5pt;font-family:arial,sans-serif}.jsoneditor-modal #query,.jsoneditor-modal .jsoneditor-transform-preview{font-family:"dejavu sans mono","droid sans mono",consolas,monaco,"lucida console","courier new",courier,monospace,sans-serif;font-size:10pt;width:100%;box-sizing:border-box}.jsoneditor-modal input[type=button],.jsoneditor-modal input[type=submit]{background:#f5f5f5;padding:4px 20px}.jsoneditor-modal input,.jsoneditor-modal select{cursor:pointer}.jsoneditor-modal .jsoneditor-button-group.jsoneditor-button-group-value-asc input.jsoneditor-button-asc,.jsoneditor-modal .jsoneditor-button-group.jsoneditor-button-group-value-desc input.jsoneditor-button-desc{background:#3883fa;border-color:#3883fa;color:#fff}.jsoneditor-menu{width:100%;height:35px;padding:2px;margin:0;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box;color:#fff;background-color:#3883fa;border-bottom:1px solid #3883fa}.jsoneditor-menu>.jsoneditor-modes>button,.jsoneditor-menu>button{width:26px;height:26px;margin:2px;padding:0;border-radius:2px;border:1px solid transparent;background:transparent url(../img/jsoneditor-icons.svg);color:#fff;opacity:.8;font-family:arial,sans-serif;font-size:10pt;float:left}.jsoneditor-menu>.jsoneditor-modes>button:hover,.jsoneditor-menu>button:hover{background-color:rgba(255,255,255,.2);border:1px solid rgba(255,255,255,.4)}.jsoneditor-menu>.jsoneditor-modes>button:active,.jsoneditor-menu>.jsoneditor-modes>button:focus,.jsoneditor-menu>button:active,.jsoneditor-menu>button:focus{background-color:rgba(255,255,255,.3)}.jsoneditor-menu>.jsoneditor-modes>button:disabled,.jsoneditor-menu>button:disabled{opacity:.5;background-color:transparent;border:none}.jsoneditor-menu>button.jsoneditor-collapse-all{background-position:0 -96px}.jsoneditor-menu>button.jsoneditor-expand-all{background-position:0 -120px}.jsoneditor-menu>button.jsoneditor-sort{background-position:-120px -96px}.jsoneditor-menu>button.jsoneditor-transform{background-position:-144px -96px}.jsoneditor.jsoneditor-mode-form>.jsoneditor-menu>button.jsoneditor-sort,.jsoneditor.jsoneditor-mode-form>.jsoneditor-menu>button.jsoneditor-transform,.jsoneditor.jsoneditor-mode-view>.jsoneditor-menu>button.jsoneditor-sort,.jsoneditor.jsoneditor-mode-view>.jsoneditor-menu>button.jsoneditor-transform{display:none}.jsoneditor-menu>button.jsoneditor-undo{background-position:-24px -96px}.jsoneditor-menu>button.jsoneditor-undo:disabled{background-position:-24px -120px}.jsoneditor-menu>button.jsoneditor-redo{background-position:-48px -96px}.jsoneditor-menu>button.jsoneditor-redo:disabled{background-position:-48px -120px}.jsoneditor-menu>button.jsoneditor-compact{background-position:-72px -96px}.jsoneditor-menu>button.jsoneditor-format{background-position:-72px -120px}.jsoneditor-menu>button.jsoneditor-repair{background-position:-96px -96px}.jsoneditor-menu>.jsoneditor-modes{display:inline-block;float:left}.jsoneditor-menu>.jsoneditor-modes>button{background-image:none;width:auto;padding-left:6px;padding-right:6px}.jsoneditor-menu>.jsoneditor-modes>button.jsoneditor-separator,.jsoneditor-menu>button.jsoneditor-separator{margin-left:10px}.jsoneditor-menu a{font-family:arial,sans-serif;font-size:10pt;color:#fff;opacity:.8;vertical-align:middle}.jsoneditor-menu a:hover{opacity:1}.jsoneditor-menu a.jsoneditor-poweredBy{font-size:8pt;position:absolute;right:0;top:0;padding:10px}.jsoneditor-search{font-family:arial,sans-serif;position:absolute;right:4px;top:4px;border-collapse:collapse;border-spacing:0;display:flex}.jsoneditor-search input{color:#1a1a1a;width:120px;border:none;outline:0;margin:1px;line-height:20px}.jsoneditor-search button{width:16px;height:24px;padding:0;margin:0;border:none;background:url(../img/jsoneditor-icons.svg);vertical-align:top}.jsoneditor-search button:hover{background-color:transparent}.jsoneditor-search button.jsoneditor-refresh{width:18px;background-position:-99px -73px}.jsoneditor-search button.jsoneditor-next{cursor:pointer;background-position:-124px -73px}.jsoneditor-search button.jsoneditor-next:hover{background-position:-124px -49px}.jsoneditor-search button.jsoneditor-previous{cursor:pointer;background-position:-148px -73px;margin-right:2px}.jsoneditor-search button.jsoneditor-previous:hover{background-position:-148px -49px}.jsoneditor-results{font-family:arial,sans-serif;color:#fff;padding-right:5px;line-height:26px}.jsoneditor-frame{border:1px solid transparent;background-color:#fff;padding:0 2px;margin:0}.jsoneditor .autocomplete.dropdown{position:absolute;background:#fff;box-shadow:2px 2px 12px rgba(128,128,128,.3);border:1px solid #d3d3d3;z-index:100;overflow-x:hidden;overflow-y:auto;cursor:default;margin:0;padding:5px;text-align:left;outline:0;font-family:"dejavu sans mono","droid sans mono",consolas,monaco,"lucida console","courier new",courier,monospace,sans-serif;font-size:10pt}.jsoneditor .autocomplete.dropdown .item{color:#333}.jsoneditor .autocomplete.dropdown .item.hover{background-color:#ddd}.jsoneditor .autocomplete.hint{color:#aaa;top:4px;left:4px}.jsoneditor-treepath{padding:0 5px;overflow:hidden;white-space:nowrap;outline:0}.jsoneditor-treepath.show-all{word-wrap:break-word;white-space:normal;position:absolute;background-color:#ebebeb;z-index:999;box-shadow:2px 2px 12px rgba(128,128,128,.3)}.jsoneditor-treepath.show-all span.jsoneditor-treepath-show-all-btn{display:none}.jsoneditor-treepath div.jsoneditor-contextmenu-root{position:absolute;left:0}.jsoneditor-treepath .jsoneditor-treepath-show-all-btn{position:absolute;background-color:#ebebeb;left:0;height:20px;padding:0 3px;cursor:pointer}.jsoneditor-treepath .jsoneditor-treepath-element{margin:1px;font-family:arial,sans-serif;font-size:10pt}.jsoneditor-treepath .jsoneditor-treepath-seperator{margin:2px;font-size:9pt;font-family:arial,sans-serif}.jsoneditor-treepath span.jsoneditor-treepath-element:hover,.jsoneditor-treepath span.jsoneditor-treepath-seperator:hover{cursor:pointer;text-decoration:underline}.jsoneditor-statusbar{line-height:26px;height:26px;color:grey;background-color:#ebebeb;border-top:1px solid #d3d3d3;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box;font-size:10pt}.jsoneditor-statusbar>.jsoneditor-curserinfo-val{margin-right:12px}.jsoneditor-statusbar>.jsoneditor-curserinfo-count{margin-left:4px}.jsoneditor-statusbar>.jsoneditor-validation-error-icon{float:right;width:24px;height:24px;padding:0;margin-top:1px;background:url(../img/jsoneditor-icons.svg) -168px -48px;cursor:pointer}.jsoneditor-statusbar>.jsoneditor-validation-error-count{float:right;margin:0 4px 0 0;cursor:pointer}.jsoneditor-statusbar>.jsoneditor-parse-error-icon{float:right;width:24px;height:24px;padding:0;margin:1px;background:url(../img/jsoneditor-icons.svg) -25px 0}.jsoneditor-statusbar .jsoneditor-array-info a{color:inherit}div.jsoneditor-statusbar>.jsoneditor-curserinfo-label,div.jsoneditor-statusbar>.jsoneditor-size-info{margin:0 4px}.jsoneditor-navigation-bar{width:100%;height:26px;line-height:26px;padding:0;margin:0;border-bottom:1px solid #d3d3d3;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box;color:grey;background-color:#ebebeb;overflow:hidden;font-family:arial,sans-serif;font-size:10pt}/*!
+ * Selectr 2.4.0
+ * https://github.com/Mobius1/Selectr
+ *
+ * Released under the MIT license
+ */.selectr-container{position:relative}.selectr-container li{list-style:none}.selectr-hidden{position:absolute;overflow:hidden;clip:rect(0,0,0,0);width:1px;height:1px;margin:-1px;padding:0;border:0 none}.selectr-visible{position:absolute;left:0;top:0;width:100%;height:100%;opacity:0;z-index:11}.selectr-desktop.multiple .selectr-visible{display:none}.selectr-desktop.multiple.native-open .selectr-visible{top:100%;min-height:200px!important;height:auto;opacity:1;display:block}.selectr-container.multiple.selectr-mobile .selectr-selected{z-index:0}.selectr-selected{position:relative;z-index:1;box-sizing:border-box;width:100%;padding:7px 28px 7px 14px;cursor:pointer;border:1px solid #999;border-radius:3px;background-color:#fff}.selectr-selected::before{position:absolute;top:50%;right:10px;width:0;height:0;content:'';-o-transform:rotate(0) translate3d(0,-50%,0);-ms-transform:rotate(0) translate3d(0,-50%,0);-moz-transform:rotate(0) translate3d(0,-50%,0);-webkit-transform:rotate(0) translate3d(0,-50%,0);transform:rotate(0) translate3d(0,-50%,0);border-width:4px 4px 0 4px;border-style:solid;border-color:#6c7a86 transparent transparent}.selectr-container.native-open .selectr-selected::before,.selectr-container.open .selectr-selected::before{border-width:0 4px 4px 4px;border-style:solid;border-color:transparent transparent #6c7a86}.selectr-label{display:none;overflow:hidden;width:100%;white-space:nowrap;text-overflow:ellipsis}.selectr-placeholder{color:#6c7a86}.selectr-tags{margin:0;padding:0;white-space:normal}.has-selected .selectr-tags{margin:0 0 -2px}.selectr-tag{list-style:none;position:relative;float:left;padding:2px 25px 2px 8px;margin:0 2px 2px 0;cursor:default;color:#fff;border:medium none;border-radius:10px;background:#acb7bf none repeat scroll 0 0}.selectr-container.multiple.has-selected .selectr-selected{padding:5px 28px 5px 5px}.selectr-options-container{position:absolute;z-index:10000;top:calc(100% - 1px);left:0;display:none;box-sizing:border-box;width:100%;border-width:0 1px 1px;border-style:solid;border-color:transparent #999 #999;border-radius:0 0 3px 3px;background-color:#fff}.selectr-container.open .selectr-options-container{display:block}.selectr-input-container{position:relative;display:none}.selectr-clear,.selectr-input-clear,.selectr-tag-remove{position:absolute;top:50%;right:22px;width:20px;height:20px;padding:0;cursor:pointer;-o-transform:translate3d(0,-50%,0);-ms-transform:translate3d(0,-50%,0);-moz-transform:translate3d(0,-50%,0);-webkit-transform:translate3d(0,-50%,0);transform:translate3d(0,-50%,0);border:medium none;background-color:transparent;z-index:11}.selectr-clear,.selectr-input-clear{display:none}.selectr-container.has-selected .selectr-clear,.selectr-input-container.active .selectr-input-clear{display:block}.selectr-selected .selectr-tag-remove{right:2px}.selectr-clear::after,.selectr-clear::before,.selectr-input-clear::after,.selectr-input-clear::before,.selectr-tag-remove::after,.selectr-tag-remove::before{position:absolute;top:5px;left:9px;width:2px;height:10px;content:' ';background-color:#6c7a86}.selectr-tag-remove::after,.selectr-tag-remove::before{top:4px;width:3px;height:12px;background-color:#fff}.selectr-clear:before,.selectr-input-clear::before,.selectr-tag-remove::before{-o-transform:rotate(45deg);-ms-transform:rotate(45deg);-moz-transform:rotate(45deg);-webkit-transform:rotate(45deg);transform:rotate(45deg)}.selectr-clear:after,.selectr-input-clear::after,.selectr-tag-remove::after{-o-transform:rotate(-45deg);-ms-transform:rotate(-45deg);-moz-transform:rotate(-45deg);-webkit-transform:rotate(-45deg);transform:rotate(-45deg)}.selectr-input-container.active,.selectr-input-container.active .selectr-clear{display:block}.selectr-input{top:5px;left:5px;box-sizing:border-box;width:calc(100% - 30px);margin:10px 15px;padding:7px 30px 7px 9px;border:1px solid #999;border-radius:3px}.selectr-notice{display:none;box-sizing:border-box;width:100%;padding:8px 16px;border-top:1px solid #999;border-radius:0 0 3px 3px;background-color:#fff}.selectr-container.notice .selectr-notice{display:block}.selectr-container.notice .selectr-selected{border-radius:3px 3px 0 0}.selectr-options{position:relative;top:calc(100% + 2px);display:none;overflow-x:auto;overflow-y:scroll;max-height:200px;margin:0;padding:0}.selectr-container.notice .selectr-options-container,.selectr-container.open .selectr-input-container,.selectr-container.open .selectr-options{display:block}.selectr-option{position:relative;display:block;padding:5px 20px;list-style:outside none none;cursor:pointer;font-weight:400}.selectr-options.optgroups>.selectr-option{padding-left:25px}.selectr-optgroup{font-weight:700;padding:0}.selectr-optgroup--label{font-weight:700;margin-top:10px;padding:5px 15px}.selectr-match{text-decoration:underline}.selectr-option.selected{background-color:#ddd}.selectr-option.active{color:#fff;background-color:#5897fb}.selectr-option.disabled{opacity:.4}.selectr-option.excluded{display:none}.selectr-container.open .selectr-selected{border-color:#999 #999 transparent #999;border-radius:3px 3px 0 0}.selectr-container.open .selectr-selected::after{-o-transform:rotate(180deg) translate3d(0,50%,0);-ms-transform:rotate(180deg) translate3d(0,50%,0);-moz-transform:rotate(180deg) translate3d(0,50%,0);-webkit-transform:rotate(180deg) translate3d(0,50%,0);transform:rotate(180deg) translate3d(0,50%,0)}.selectr-disabled{opacity:.6}.has-selected .selectr-placeholder,.selectr-empty{display:none}.has-selected .selectr-label{display:block}.taggable .selectr-selected{padding:4px 28px 4px 4px}.taggable .selectr-selected::after{display:table;content:" ";clear:both}.taggable .selectr-label{width:auto}.taggable .selectr-tags{float:left;display:block}.taggable .selectr-placeholder{display:none}.input-tag{float:left;min-width:90px;width:auto}.selectr-tag-input{border:medium none;padding:3px 10px;width:100%;font-family:inherit;font-weight:inherit;font-size:inherit}.selectr-input-container.loading::after{position:absolute;top:50%;right:20px;width:20px;height:20px;content:'';-o-transform:translate3d(0,-50%,0);-ms-transform:translate3d(0,-50%,0);-moz-transform:translate3d(0,-50%,0);-webkit-transform:translate3d(0,-50%,0);transform:translate3d(0,-50%,0);-o-transform-origin:50% 0 0;-ms-transform-origin:50% 0 0;-moz-transform-origin:50% 0 0;-webkit-transform-origin:50% 0 0;transform-origin:50% 0 0;-moz-animation:.5s linear 0s normal forwards infinite running spin;-webkit-animation:.5s linear 0s normal forwards infinite running spin;animation:.5s linear 0s normal forwards infinite running spin;border-width:3px;border-style:solid;border-color:#aaa #ddd #ddd;border-radius:50%}@-webkit-keyframes spin{0%{-webkit-transform:rotate(0) translate3d(0,-50%,0);transform:rotate(0) translate3d(0,-50%,0)}100%{-webkit-transform:rotate(360deg) translate3d(0,-50%,0);transform:rotate(360deg) translate3d(0,-50%,0)}}@keyframes spin{0%{-webkit-transform:rotate(0) translate3d(0,-50%,0);transform:rotate(0) translate3d(0,-50%,0)}100%{-webkit-transform:rotate(360deg) translate3d(0,-50%,0);transform:rotate(360deg) translate3d(0,-50%,0)}}.selectr-container.open.inverted .selectr-selected{border-color:transparent #999 #999;border-radius:0 0 3px 3px}.selectr-container.inverted .selectr-options-container{border-width:1px 1px 0;border-color:#999 #999 transparent;border-radius:3px 3px 0 0;background-color:#fff}.selectr-container.inverted .selectr-options-container{top:auto;bottom:calc(100% - 1px)}.selectr-container ::-webkit-input-placeholder{color:#6c7a86;opacity:1}.selectr-container ::-moz-placeholder{color:#6c7a86;opacity:1}.selectr-container :-ms-input-placeholder{color:#6c7a86;opacity:1}.selectr-container ::placeholder{color:#6c7a86;opacity:1}
\ No newline at end of file
diff --git a/demo/muon-monitor/src/jsMain/web/css/main.css b/demo/muon-monitor/src/jsMain/web/css/main.css
new file mode 100644
index 00000000..e7f925df
--- /dev/null
+++ b/demo/muon-monitor/src/jsMain/web/css/main.css
@@ -0,0 +1,48 @@
+.loader {
+    border: 16px solid #f3f3f3; /* Light grey */
+    border-top: 16px solid #3498db; /* Blue */
+    border-radius: 50%;
+    width: 120px;
+    height: 120px;
+    animation: spin 2s linear infinite;
+}
+
+@keyframes spin {
+    0% { transform: rotate(0deg); }
+    100% { transform: rotate(360deg); }
+}
+
+/* Remove default bullets */
+ul, .objTree-subtree {
+    list-style-type: none;
+}
+
+/* Style the caret/arrow */
+.objTree-caret {
+    cursor: pointer;
+    user-select: none; /* Prevent text selection */
+}
+
+.objTree-label {
+    cursor: pointer;
+}
+
+/* Create the caret/arrow with a unicode, and style it */
+.objTree-caret::before {
+    content: "\25B6";
+    color: black;
+    display: inline-block;
+    margin-right: 6px;
+}
+
+.objTree-leaf::before {
+    content: "\25C6";
+    color: black;
+    display: inline-block;
+    margin-right: 6px;
+}
+
+/* Rotate the caret/arrow icon when clicked on (using JavaScript) */
+.objTree-caret-down::before {
+    transform: rotate(90deg);
+}
diff --git a/demo/muon-monitor/src/jsMain/web/img/jsoneditor-icons.svg b/demo/muon-monitor/src/jsMain/web/img/jsoneditor-icons.svg
new file mode 100644
index 00000000..332be179
--- /dev/null
+++ b/demo/muon-monitor/src/jsMain/web/img/jsoneditor-icons.svg
@@ -0,0 +1,748 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg
+        xmlns:dc="http://purl.org/dc/elements/1.1/"
+        xmlns:cc="http://creativecommons.org/ns#"
+        xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+        xmlns="http://www.w3.org/2000/svg"
+        xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+        xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+        width="240"
+        height="144"
+        id="svg4136"
+        version="1.1"
+        inkscape:version="0.91 r13725"
+        sodipodi:docname="jsoneditor-icons.svg">
+  <title
+     id="title6512">JSON Editor Icons</title>
+  <metadata
+     id="metadata4148">
+    <rdf:RDF>
+      <cc:Work
+         rdf:about="">
+        <dc:format>image/svg+xml</dc:format>
+        <dc:type
+           rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
+        <dc:title>JSON Editor Icons</dc:title>
+      </cc:Work>
+    </rdf:RDF>
+  </metadata>
+  <defs
+     id="defs4146" />
+  <sodipodi:namedview
+     pagecolor="#ff63ff"
+     bordercolor="#666666"
+     borderopacity="1"
+     objecttolerance="10"
+     gridtolerance="10"
+     guidetolerance="10"
+     inkscape:pageopacity="0"
+     inkscape:pageshadow="2"
+     inkscape:window-width="1920"
+     inkscape:window-height="1026"
+     id="namedview4144"
+     showgrid="true"
+     inkscape:zoom="4"
+     inkscape:cx="13.229181"
+     inkscape:cy="119.82429"
+     inkscape:window-x="0"
+     inkscape:window-y="0"
+     inkscape:window-maximized="1"
+     inkscape:current-layer="svg4136"
+     showguides="false"
+     borderlayer="false"
+     inkscape:showpageshadow="true"
+     showborder="true">
+    <inkscape:grid
+       type="xygrid"
+       id="grid4640"
+       empspacing="24" />
+  </sodipodi:namedview>
+  <!-- Created with SVG-edit - http://svg-edit.googlecode.com/ -->
+  <rect
+     style="fill:#4c4c4c;fill-opacity:1;stroke:none;stroke-width:0"
+     id="svg_1"
+     height="16"
+     width="16"
+     y="4"
+     x="4" />
+  <rect
+     id="svg_1-7"
+     height="16"
+     width="16"
+     y="3.999995"
+     x="28.000006"
+     style="fill:#ec3f29;fill-opacity:0.94117647;stroke:none;stroke-width:0" />
+  <rect
+     style="fill:#4c4c4c;fill-opacity:1;stroke:none;stroke-width:0"
+     x="52.000004"
+     y="3.999995"
+     width="16"
+     height="16"
+     id="rect4165" />
+  <rect
+     id="rect4175"
+     height="16"
+     width="16"
+     y="3.9999852"
+     x="172.00002"
+     style="fill:#4c4c4c;fill-opacity:1;stroke:none;stroke-width:0" />
+  <rect
+     id="rect4175-3"
+     height="16"
+     width="16"
+     y="3.999995"
+     x="196"
+     style="fill:#4c4c4c;fill-opacity:1;stroke:none;stroke-width:0" />
+  <g
+     id="g4299"
+     style="stroke:none">
+    <rect
+       x="7.0000048"
+       y="10.999998"
+       width="9.9999924"
+       height="1.9999986"
+       id="svg_1-1"
+       style="fill:#ffffff;fill-opacity:1;stroke:none;stroke-width:0" />
+    <rect
+       x="11.000005"
+       y="7.0000114"
+       width="1.9999955"
+       height="9.9999838"
+       id="svg_1-1-1"
+       style="fill:#ffffff;fill-opacity:1;stroke:none;stroke-width:0" />
+  </g>
+  <g
+     id="g4299-3"
+     transform="matrix(0.70710678,-0.70710678,0.70710678,0.70710678,19.029435,12.000001)"
+     style="stroke:none">
+    <rect
+       x="7.0000048"
+       y="10.999998"
+       width="9.9999924"
+       height="1.9999986"
+       id="svg_1-1-0"
+       style="fill:#ffffff;fill-opacity:1;stroke:none;stroke-width:0" />
+    <rect
+       x="11.000005"
+       y="7.0000114"
+       width="1.9999955"
+       height="9.9999838"
+       id="svg_1-1-1-9"
+       style="fill:#ffffff;fill-opacity:1;stroke:none;stroke-width:0" />
+  </g>
+  <rect
+     id="svg_1-7-5"
+     height="6.9999905"
+     width="6.9999909"
+     y="7.0000048"
+     x="55.000004"
+     style="fill:#ffffff;fill-opacity:1;stroke:#000000;stroke-width:0" />
+  <rect
+     style="fill:#ffffff;fill-opacity:1;stroke:#4c4c4c;stroke-width:2;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
+     x="58"
+     y="10.00001"
+     width="6.9999909"
+     height="6.9999905"
+     id="rect4354" />
+  <rect
+     id="svg_1-7-5-7"
+     height="6.9999905"
+     width="6.9999909"
+     y="10.000005"
+     x="58.000004"
+     style="fill:#ffffff;fill-opacity:1;stroke:#3c80df;stroke-width:0;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:0.94117647" />
+  <g
+     id="g4378">
+    <rect
+       style="fill:#ffffff;fill-opacity:1;stroke:#000000;stroke-width:0"
+       x="198"
+       y="10.999999"
+       width="7.9999909"
+       height="1.9999965"
+       id="svg_1-7-5-3" />
+    <rect
+       id="rect4374"
+       height="1.9999946"
+       width="11.999995"
+       y="7.0000005"
+       x="198"
+       style="fill:#ffffff;fill-opacity:1;stroke:#000000;stroke-width:0" />
+    <rect
+       id="rect4376"
+       height="1.9999995"
+       width="3.9999928"
+       y="14.999996"
+       x="198"
+       style="fill:#ffffff;fill-opacity:1;stroke:#000000;stroke-width:0" />
+  </g>
+  <g
+     transform="matrix(1,0,0,-1,-23.999995,23.999995)"
+     id="g4383">
+    <rect
+       id="rect4385"
+       height="1.9999965"
+       width="7.9999909"
+       y="10.999999"
+       x="198"
+       style="fill:#ffffff;fill-opacity:1;stroke:#000000;stroke-width:0" />
+    <rect
+       style="fill:#ffffff;fill-opacity:1;stroke:#000000;stroke-width:0"
+       x="198"
+       y="7.0000005"
+       width="11.999995"
+       height="1.9999946"
+       id="rect4387" />
+    <rect
+       style="fill:#ffffff;fill-opacity:1;stroke:#000000;stroke-width:0"
+       x="198"
+       y="14.999996"
+       width="3.9999928"
+       height="1.9999995"
+       id="rect4389" />
+  </g>
+  <rect
+     style="fill:#4c4c4c;fill-opacity:1;stroke:none"
+     id="rect3754-4"
+     width="16"
+     height="16"
+     x="76"
+     y="3.9999199" />
+  <path
+     style="fill:#ffffff;fill-opacity:1;stroke:#ffffff;stroke-width:0.2;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
+     d="m 85.10447,6.0157384 -0.0156,1.4063 c 3.02669,-0.2402 0.33008,3.6507996 2.48438,4.5780996 -2.18694,1.0938 0.49191,4.9069 -2.45313,4.5781 l -0.0156,1.4219 c 5.70828,0.559 1.03264,-5.1005 4.70313,-5.2656 l 0,-1.4063 c -3.61303,-0.027 1.11893,-5.7069996 -4.70313,-5.3124996 z"
+     id="path4351"
+     inkscape:connector-curvature="0"
+     sodipodi:nodetypes="cccccccc" />
+  <path
+     style="fill:#ffffff;fill-opacity:1;stroke:#ffffff;stroke-width:0.2;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
+     d="m 82.78125,5.9984384 0.0156,1.4063 c -3.02668,-0.2402 -0.33007,3.6506996 -2.48437,4.5780996 2.18694,1.0938 -0.49192,4.9069 2.45312,4.5781 l 0.0156,1.4219 c -5.70827,0.559 -1.03263,-5.1004 -4.70312,-5.2656 l 0,-1.4063 c 3.61303,-0.027 -1.11894,-5.7070996 4.70312,-5.3124996 z"
+     id="path4351-9"
+     inkscape:connector-curvature="0"
+     sodipodi:nodetypes="cccccccc" />
+  <rect
+     style="fill:#4c4c4c;fill-opacity:1;stroke:none"
+     id="rect3754-25"
+     width="16"
+     height="16"
+     x="100"
+     y="3.9999199" />
+  <path
+     style="fill:#ffffff;fill-opacity:1;stroke:none"
+     d="m 103.719,5.6719384 0,12.7187996 3.03125,0 0,-1.5313 -1.34375,0 0,-9.6249996 1.375,0 0,-1.5625 z"
+     id="path2987"
+     inkscape:connector-curvature="0" />
+  <path
+     style="fill:#ffffff;fill-opacity:1;stroke:none"
+     d="m 112.2185,5.6721984 0,12.7187996 -3.03125,0 0,-1.5313 1.34375,0 0,-9.6249996 -1.375,0 0,-1.5625 z"
+     id="path2987-1"
+     inkscape:connector-curvature="0" />
+  <rect
+     style="fill:#4c4c4c;fill-opacity:1;stroke:none"
+     id="rect3754-73"
+     width="16"
+     height="16"
+     x="124"
+     y="3.9999199" />
+  <path
+     style="fill:#ffffff;fill-opacity:1;stroke:none"
+     d="m 126.2824,17.602938 1.78957,0 1.14143,-2.8641 5.65364,0 1.14856,2.8641 1.76565,0 -4.78687,-11.1610996 -1.91903,0 z"
+     id="path3780"
+     inkscape:connector-curvature="0"
+     sodipodi:nodetypes="ccccccccc" />
+  <path
+     style="fill:#4c4c4c;fill-opacity:1;stroke:none"
+     d="m 129.72704,13.478838 4.60852,0.01 -2.30426,-5.5497996 z"
+     id="path3782"
+     inkscape:connector-curvature="0" />
+  <rect
+     style="fill:#4c4c4c;fill-opacity:1;stroke:none"
+     id="rect3754-35"
+     width="16"
+     height="16"
+     x="148"
+     y="3.9999199" />
+  <path
+     style="fill:#ffffff;fill-opacity:1;stroke:none"
+     d="m 156.47655,5.8917384 0,2.1797 0.46093,2.3983996 1.82813,0 0.39844,-2.3983996 0,-2.1797 z"
+     id="path5008-2"
+     inkscape:connector-curvature="0"
+     sodipodi:nodetypes="ccccccc" />
+  <path
+     style="fill:#ffffff;fill-opacity:1;stroke:none"
+     d="m 152.51561,5.8906384 0,2.1797 0.46094,2.3983996 1.82812,0 0.39844,-2.3983996 0,-2.1797 z"
+     id="path5008-2-8"
+     inkscape:connector-curvature="0"
+     sodipodi:nodetypes="ccccccc" />
+  <rect
+     id="svg_1-7-2"
+     height="1.9999961"
+     width="11.999996"
+     y="64"
+     x="54"
+     style="fill:#4c4c4c;fill-opacity:0.98431373;stroke:none;stroke-width:0" />
+  <rect
+     id="svg_1-7-2-2"
+     height="2.9999905"
+     width="2.9999907"
+     y="52"
+     x="80.000008"
+     style="fill:#4c4c4c;fill-opacity:0.98431373;stroke:none;stroke-width:0" />
+  <rect
+     style="fill:#4c4c4c;fill-opacity:0.98431373;stroke:none;stroke-width:0"
+     x="85.000008"
+     y="52"
+     width="2.9999907"
+     height="2.9999905"
+     id="rect4561" />
+  <rect
+     style="fill:#4c4c4c;fill-opacity:0.98431373;stroke:none;stroke-width:0"
+     x="80.000008"
+     y="58"
+     width="2.9999907"
+     height="2.9999905"
+     id="rect4563" />
+  <rect
+     id="rect4565"
+     height="2.9999905"
+     width="2.9999907"
+     y="58"
+     x="85.000008"
+     style="fill:#4c4c4c;fill-opacity:0.98431373;stroke:none;stroke-width:0" />
+  <rect
+     id="rect4567"
+     height="2.9999905"
+     width="2.9999907"
+     y="64"
+     x="80.000008"
+     style="fill:#4c4c4c;fill-opacity:0.98431373;stroke:none;stroke-width:0" />
+  <rect
+     style="fill:#4c4c4c;fill-opacity:0.98431373;stroke:none;stroke-width:0"
+     x="85.000008"
+     y="64"
+     width="2.9999907"
+     height="2.9999905"
+     id="rect4569" />
+  <circle
+     style="opacity:1;fill:none;fill-opacity:1;stroke:#4c4c4c;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none"
+     id="path4571"
+     cx="110.06081"
+     cy="57.939209"
+     r="4.7438836" />
+  <rect
+     style="fill:#4c4c4c;fill-opacity:0.98431373;stroke:none;stroke-width:0"
+     x="116.64566"
+     y="-31.79752"
+     width="4.229713"
+     height="6.4053884"
+     id="rect4563-2"
+     transform="matrix(0.70710678,0.70710678,-0.70710678,0.70710678,0,0)" />
+  <path
+     style="fill:#4c4c4c;fill-opacity:1;fill-rule:evenodd;stroke:none;stroke-width:0;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
+     d="M 125,56 138.77027,56.095 132,64 Z"
+     id="path4613"
+     inkscape:connector-curvature="0"
+     sodipodi:nodetypes="cccc" />
+  <path
+     sodipodi:nodetypes="cccc"
+     inkscape:connector-curvature="0"
+     id="path4615"
+     d="M 149,64 162.77027,63.905 156,56 Z"
+     style="fill:#4c4c4c;fill-opacity:1;fill-rule:evenodd;stroke:none;stroke-width:0;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
+  <rect
+     style="fill:#4c4c4c;fill-opacity:0.98431373;stroke:none;stroke-width:0"
+     x="54"
+     y="53"
+     width="11.999996"
+     height="1.9999961"
+     id="rect4638" />
+  <rect
+     id="svg_1-7-2-24"
+     height="1.9999957"
+     width="12.99999"
+     y="-56"
+     x="53"
+     style="fill:#4c4c4c;fill-opacity:0.98431373;stroke:none;stroke-width:0"
+     transform="matrix(0,1,-1,0,0,0)" />
+  <rect
+     transform="matrix(0,1,-1,0,0,0)"
+     style="fill:#4c4c4c;fill-opacity:0.98431373;stroke:none;stroke-width:0"
+     x="53"
+     y="-66"
+     width="12.99999"
+     height="1.9999957"
+     id="rect4657" />
+  <rect
+     id="rect4659"
+     height="0.99999291"
+     width="11.999999"
+     y="57"
+     x="54"
+     style="fill:#4c4c4c;fill-opacity:0.98431373;stroke:none;stroke-width:0" />
+  <rect
+     style="fill:#d3d3d3;fill-opacity:1;stroke:none;stroke-width:0;stroke-opacity:1"
+     x="54"
+     y="88.000122"
+     width="11.999996"
+     height="1.9999961"
+     id="rect4661" />
+  <rect
+     style="fill:#d3d3d3;fill-opacity:1;stroke:none;stroke-width:0;stroke-opacity:1"
+     x="80.000008"
+     y="76.000122"
+     width="2.9999907"
+     height="2.9999905"
+     id="rect4663" />
+  <rect
+     id="rect4665"
+     height="2.9999905"
+     width="2.9999907"
+     y="76.000122"
+     x="85.000008"
+     style="fill:#d3d3d3;fill-opacity:1;stroke:none;stroke-width:0;stroke-opacity:1" />
+  <rect
+     id="rect4667"
+     height="2.9999905"
+     width="2.9999907"
+     y="82.000122"
+     x="80.000008"
+     style="fill:#d3d3d3;fill-opacity:1;stroke:none;stroke-width:0;stroke-opacity:1" />
+  <rect
+     style="fill:#d3d3d3;fill-opacity:1;stroke:none;stroke-width:0;stroke-opacity:1"
+     x="85.000008"
+     y="82.000122"
+     width="2.9999907"
+     height="2.9999905"
+     id="rect4669" />
+  <rect
+     style="fill:#d3d3d3;fill-opacity:1;stroke:none;stroke-width:0;stroke-opacity:1"
+     x="80.000008"
+     y="88.000122"
+     width="2.9999907"
+     height="2.9999905"
+     id="rect4671" />
+  <rect
+     id="rect4673"
+     height="2.9999905"
+     width="2.9999907"
+     y="88.000122"
+     x="85.000008"
+     style="fill:#d3d3d3;fill-opacity:1;stroke:none;stroke-width:0;stroke-opacity:1" />
+  <circle
+     r="4.7438836"
+     cy="81.939331"
+     cx="110.06081"
+     id="circle4675"
+     style="opacity:1;fill:none;fill-opacity:1;stroke:#d3d3d3;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
+  <rect
+     transform="matrix(0.70710678,0.70710678,-0.70710678,0.70710678,0,0)"
+     id="rect4677"
+     height="6.4053884"
+     width="4.229713"
+     y="-14.826816"
+     x="133.6163"
+     style="fill:#d3d3d3;fill-opacity:1;stroke:#d3d3d3;stroke-width:0;stroke-opacity:1" />
+  <path
+     sodipodi:nodetypes="cccc"
+     inkscape:connector-curvature="0"
+     id="path4679"
+     d="m 125,80.000005 13.77027,0.09499 L 132,87.999992 Z"
+     style="fill:#d3d3d3;fill-opacity:1;fill-rule:evenodd;stroke:#d3d3d3;stroke-width:0;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
+  <path
+     style="fill:#d3d3d3;fill-opacity:1;fill-rule:evenodd;stroke:#d3d3d3;stroke-width:0;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
+     d="M 149,88.0002 162.77027,87.9052 156,80.0002 Z"
+     id="path4681"
+     inkscape:connector-curvature="0"
+     sodipodi:nodetypes="cccc" />
+  <rect
+     id="rect4683"
+     height="1.9999961"
+     width="11.999996"
+     y="77.000122"
+     x="54"
+     style="fill:#d3d3d3;fill-opacity:1;stroke:none;stroke-width:0;stroke-opacity:1" />
+  <rect
+     transform="matrix(0,1,-1,0,0,0)"
+     style="fill:#d3d3d3;fill-opacity:1;stroke:none;stroke-width:0;stroke-opacity:1"
+     x="77.000122"
+     y="-56"
+     width="12.99999"
+     height="1.9999957"
+     id="rect4685" />
+  <rect
+     id="rect4687"
+     height="1.9999957"
+     width="12.99999"
+     y="-66"
+     x="77.000122"
+     style="fill:#d3d3d3;fill-opacity:1;stroke:none;stroke-width:0;stroke-opacity:1"
+     transform="matrix(0,1,-1,0,0,0)" />
+  <rect
+     style="fill:#d3d3d3;fill-opacity:1;stroke:none;stroke-width:0;stroke-opacity:1"
+     x="54"
+     y="81.000122"
+     width="11.999999"
+     height="0.99999291"
+     id="rect4689" />
+  <rect
+     id="rect4761-1"
+     height="1.9999945"
+     width="15.99999"
+     y="101"
+     x="76.000008"
+     style="fill:#ffffff;fill-opacity:0.8;stroke:none;stroke-width:0" />
+  <rect
+     id="rect4761-0"
+     height="1.9999945"
+     width="15.99999"
+     y="105"
+     x="76.000008"
+     style="fill:#ffffff;fill-opacity:0.8;stroke:none;stroke-width:0" />
+  <rect
+     id="rect4761-7"
+     height="1.9999945"
+     width="9"
+     y="109"
+     x="76.000008"
+     style="fill:#ffffff;fill-opacity:0.8;stroke:none;stroke-width:0" />
+  <rect
+     id="rect4761-1-1"
+     height="1.9999945"
+     width="12"
+     y="125"
+     x="76.000008"
+     style="fill:#ffffff;fill-opacity:0.8;stroke:none;stroke-width:0" />
+  <rect
+     id="rect4761-1-1-4"
+     height="1.9999945"
+     width="10"
+     y="137"
+     x="76.000008"
+     style="fill:#ffffff;fill-opacity:0.8;stroke:none;stroke-width:0" />
+  <rect
+     id="rect4761-1-1-4-4"
+     height="1.9999945"
+     width="10"
+     y="129"
+     x="82"
+     style="fill:#ffffff;fill-opacity:0.8;stroke:none;stroke-width:0" />
+  <rect
+     id="rect4761-1-1-4-4-3"
+     height="1.9999945"
+     width="9"
+     y="133"
+     x="82"
+     style="fill:#ffffff;fill-opacity:0.8;stroke:none;stroke-width:0" />
+  <path
+     inkscape:connector-curvature="0"
+     style="color:#000000;font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-size:medium;line-height:normal;font-family:sans-serif;text-indent:0;text-align:start;text-decoration:none;text-decoration-line:none;text-decoration-style:solid;text-decoration-color:#000000;letter-spacing:normal;word-spacing:normal;text-transform:none;direction:ltr;block-progression:tb;writing-mode:lr-tb;baseline-shift:baseline;text-anchor:start;white-space:normal;clip-rule:nonzero;display:inline;overflow:visible;visibility:visible;opacity:0.8;isolation:auto;mix-blend-mode:normal;color-interpolation:sRGB;color-interpolation-filters:linearRGB;solid-color:#000000;solid-opacity:1;fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:none;stroke-width:2.66157866;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;color-rendering:auto;image-rendering:auto;shape-rendering:auto;text-rendering:auto;enable-background:accumulate"
+     d="m 36.398438,100.0254 c -0.423362,-0.013 -0.846847,0.01 -1.265626,0.062 -1.656562,0.2196 -3.244567,0.9739 -4.507812,2.2266 L 29,100.5991 l -2.324219,7.7129 7.826172,-1.9062 -1.804687,-1.9063 c 1.597702,-1.5308 4.048706,-1.8453 5.984375,-0.7207 1.971162,1.1452 2.881954,3.3975 2.308593,5.5508 -0.573361,2.1533 -2.533865,3.6953 -4.830078,3.6953 l 0,3.0742 c 3.550756,0 6.710442,-2.4113 7.650391,-5.9414 0.939949,-3.5301 -0.618463,-7.2736 -3.710938,-9.0703 -1.159678,-0.6738 -2.431087,-1.0231 -3.701171,-1.0625 z"
+     id="path4138" />
+  <path
+     inkscape:connector-curvature="0"
+     style="color:#000000;font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-size:medium;line-height:normal;font-family:sans-serif;text-indent:0;text-align:start;text-decoration:none;text-decoration-line:none;text-decoration-style:solid;text-decoration-color:#000000;letter-spacing:normal;word-spacing:normal;text-transform:none;direction:ltr;block-progression:tb;writing-mode:lr-tb;baseline-shift:baseline;text-anchor:start;white-space:normal;clip-rule:nonzero;display:inline;overflow:visible;visibility:visible;opacity:0.8;isolation:auto;mix-blend-mode:normal;color-interpolation:sRGB;color-interpolation-filters:linearRGB;solid-color:#000000;solid-opacity:1;fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:none;stroke-width:2.66157866;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;color-rendering:auto;image-rendering:auto;shape-rendering:auto;text-rendering:auto;enable-background:accumulate"
+     d="m 59.722656,99.9629 c -1.270084,0.039 -2.541493,0.3887 -3.701172,1.0625 -3.092475,1.7967 -4.650886,5.5402 -3.710937,9.0703 0.939949,3.5301 4.09768,5.9414 7.648437,5.9414 l 0,-3.0742 c -2.296214,0 -4.256717,-1.542 -4.830078,-3.6953 -0.573361,-2.1533 0.337432,-4.4056 2.308594,-5.5508 1.935731,-1.1246 4.38863,-0.8102 5.986326,0.7207 l -1.806638,1.9063 7.828128,1.9062 -2.32422,-7.7129 -1.62696,1.7168 c -1.26338,-1.2531 -2.848917,-2.0088 -4.505855,-2.2285 -0.418778,-0.055 -0.842263,-0.076 -1.265625,-0.062 z"
+     id="path4138-1" />
+  <path
+     inkscape:connector-curvature="0"
+     style="opacity:0.8;fill:#ffffff;fill-opacity:1;stroke:none;stroke-width:1.96599996;stroke-miterlimit:4;stroke-dasharray:none"
+     d="m 10.5,100 0,2 -2.4999996,0 L 12,107 l 4,-5 -2.5,0 0,-2 -3,0 z"
+     id="path3055-0-77" />
+  <path
+     style="opacity:0.8;fill:none;stroke:#ffffff;stroke-width:1.96599996;stroke-linecap:square;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
+     d="m 4.9850574,108.015 14.0298856,-0.03"
+     id="path5244-5-0-5"
+     inkscape:connector-curvature="0"
+     sodipodi:nodetypes="cc" />
+  <path
+     style="opacity:0.8;fill:none;stroke:#ffffff;stroke-width:1.96599996;stroke-linecap:square;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
+     d="m 4.9849874,132.015 14.0298866,-0.03"
+     id="path5244-5-0-5-8"
+     inkscape:connector-curvature="0"
+     sodipodi:nodetypes="cc" />
+  <path
+     inkscape:connector-curvature="0"
+     style="color:#000000;font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-size:medium;line-height:normal;font-family:sans-serif;text-indent:0;text-align:start;text-decoration:none;text-decoration-line:none;text-decoration-style:solid;text-decoration-color:#000000;letter-spacing:normal;word-spacing:normal;text-transform:none;direction:ltr;block-progression:tb;writing-mode:lr-tb;baseline-shift:baseline;text-anchor:start;white-space:normal;clip-rule:nonzero;display:inline;overflow:visible;visibility:visible;opacity:0.4;isolation:auto;mix-blend-mode:normal;color-interpolation:sRGB;color-interpolation-filters:linearRGB;solid-color:#000000;solid-opacity:1;fill:#4d4d4d;fill-opacity:1;fill-rule:nonzero;stroke:none;stroke-width:2.66157866;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;color-rendering:auto;image-rendering:auto;shape-rendering:auto;text-rendering:auto;enable-background:accumulate"
+     d="m 36.398438,123.9629 c -0.423362,-0.013 -0.846847,0.01 -1.265626,0.062 -1.656562,0.2196 -3.244567,0.9739 -4.507812,2.2266 L 29,124.5366 l -2.324219,7.7129 7.826172,-1.9062 -1.804687,-1.9063 c 1.597702,-1.5308 4.048706,-1.8453 5.984375,-0.7207 1.971162,1.1453 2.881954,3.3975 2.308593,5.5508 -0.573361,2.1533 -2.533864,3.6953 -4.830078,3.6953 l 0,3.0742 c 3.550757,0 6.710442,-2.4093 7.650391,-5.9394 0.939949,-3.5301 -0.618463,-7.2756 -3.710938,-9.0723 -1.159678,-0.6737 -2.431087,-1.0231 -3.701171,-1.0625 z"
+     id="path4138-12" />
+  <path
+     inkscape:connector-curvature="0"
+     style="color:#000000;font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-size:medium;line-height:normal;font-family:sans-serif;text-indent:0;text-align:start;text-decoration:none;text-decoration-line:none;text-decoration-style:solid;text-decoration-color:#000000;letter-spacing:normal;word-spacing:normal;text-transform:none;direction:ltr;block-progression:tb;writing-mode:lr-tb;baseline-shift:baseline;text-anchor:start;white-space:normal;clip-rule:nonzero;display:inline;overflow:visible;visibility:visible;opacity:0.4;isolation:auto;mix-blend-mode:normal;color-interpolation:sRGB;color-interpolation-filters:linearRGB;solid-color:#000000;solid-opacity:1;fill:#4d4d4d;fill-opacity:1;fill-rule:nonzero;stroke:none;stroke-width:2.66157866;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;color-rendering:auto;image-rendering:auto;shape-rendering:auto;text-rendering:auto;enable-background:accumulate"
+     d="m 59.722656,123.9629 c -1.270084,0.039 -2.541493,0.3888 -3.701172,1.0625 -3.092475,1.7967 -4.650886,5.5422 -3.710937,9.0723 0.939949,3.5301 4.09768,5.9394 7.648437,5.9394 l 0,-3.0742 c -2.296214,0 -4.256717,-1.542 -4.830078,-3.6953 -0.573361,-2.1533 0.337432,-4.4055 2.308594,-5.5508 1.935731,-1.1246 4.38863,-0.8102 5.986326,0.7207 l -1.806638,1.9063 7.828128,1.9062 -2.32422,-7.7129 -1.62696,1.7168 c -1.26338,-1.2531 -2.848917,-2.0088 -4.505855,-2.2285 -0.418778,-0.055 -0.842263,-0.076 -1.265625,-0.062 z"
+     id="path4138-1-3" />
+  <path
+     id="path6191"
+     d="m 10.5,116 0,-2 -2.4999996,0 L 12,109 l 4,5 -2.5,0 0,2 -3,0 z"
+     style="opacity:0.8;fill:#ffffff;fill-opacity:1;stroke:none;stroke-width:1.96599996;stroke-miterlimit:4;stroke-dasharray:none"
+     inkscape:connector-curvature="0" />
+  <path
+     inkscape:connector-curvature="0"
+     style="opacity:0.8;fill:#ffffff;fill-opacity:1;stroke:none;stroke-width:1.96599996;stroke-miterlimit:4;stroke-dasharray:none"
+     d="m 10.5,129 0,-2 -2.4999996,0 L 12,122 l 4,5 -2.5,0 0,2 -3,0 z"
+     id="path6193" />
+  <path
+     id="path6195"
+     d="m 10.5,135 0,2 -2.4999996,0 L 12,142 l 4,-5 -2.5,0 0,-2 -3,0 z"
+     style="opacity:0.8;fill:#ffffff;fill-opacity:1;stroke:none;stroke-width:1.96599996;stroke-miterlimit:4;stroke-dasharray:none"
+     inkscape:connector-curvature="0" />
+  <path
+     sodipodi:type="star"
+     style="fill:#4d4d4d;fill-opacity:0.90196078;stroke:#d3d3d3;stroke-width:0;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none"
+     id="path4500"
+     sodipodi:sides="3"
+     sodipodi:cx="11.55581"
+     sodipodi:cy="60.073242"
+     sodipodi:r1="5.1116104"
+     sodipodi:r2="2.5558052"
+     sodipodi:arg1="0"
+     sodipodi:arg2="1.0471976"
+     inkscape:flatsided="false"
+     inkscape:rounded="0"
+     inkscape:randomized="0"
+     d="m 16.66742,60.073242 -3.833708,2.213392 -3.8337072,2.213393 0,-4.426785 0,-4.426784 3.8337082,2.213392 z"
+     inkscape:transform-center-x="-1.2779026" />
+  <path
+     inkscape:transform-center-x="1.277902"
+     d="m -31.500004,60.073242 -3.833708,2.213392 -3.833707,2.213393 0,-4.426785 0,-4.426784 3.833707,2.213392 z"
+     inkscape:randomized="0"
+     inkscape:rounded="0"
+     inkscape:flatsided="false"
+     sodipodi:arg2="1.0471976"
+     sodipodi:arg1="0"
+     sodipodi:r2="2.5558052"
+     sodipodi:r1="5.1116104"
+     sodipodi:cy="60.073242"
+     sodipodi:cx="-36.611614"
+     sodipodi:sides="3"
+     id="path4502"
+     style="fill:#4d4d4d;fill-opacity:0.90196078;stroke:#d3d3d3;stroke-width:0;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none"
+     sodipodi:type="star"
+     transform="scale(-1,1)" />
+  <path
+     d="m 16.66742,60.073212 -3.833708,2.213392 -3.8337072,2.213392 0,-4.426784 0,-4.426785 3.8337082,2.213392 z"
+     inkscape:randomized="0"
+     inkscape:rounded="0"
+     inkscape:flatsided="false"
+     sodipodi:arg2="1.0471976"
+     sodipodi:arg1="0"
+     sodipodi:r2="2.5558052"
+     sodipodi:r1="5.1116104"
+     sodipodi:cy="60.073212"
+     sodipodi:cx="11.55581"
+     sodipodi:sides="3"
+     id="path4504"
+     style="fill:#4d4d4d;fill-opacity:0.90196078;stroke:#d3d3d3;stroke-width:0;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none"
+     sodipodi:type="star"
+     transform="matrix(0,1,-1,0,72.0074,71.7877)"
+     inkscape:transform-center-y="1.2779029" />
+  <path
+     inkscape:transform-center-y="-1.2779026"
+     transform="matrix(0,-1,-1,0,96,96)"
+     sodipodi:type="star"
+     style="fill:#4d4d4d;fill-opacity:0.90196078;stroke:#d3d3d3;stroke-width:0;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none"
+     id="path4506"
+     sodipodi:sides="3"
+     sodipodi:cx="11.55581"
+     sodipodi:cy="60.073212"
+     sodipodi:r1="5.1116104"
+     sodipodi:r2="2.5558052"
+     sodipodi:arg1="0"
+     sodipodi:arg2="1.0471976"
+     inkscape:flatsided="false"
+     inkscape:rounded="0"
+     inkscape:randomized="0"
+     d="m 16.66742,60.073212 -3.833708,2.213392 -3.8337072,2.213392 0,-4.426784 0,-4.426785 3.8337082,2.213392 z" />
+  <path
+     sodipodi:nodetypes="cccc"
+     inkscape:connector-curvature="0"
+     id="path4615-5"
+     d="m 171.82574,65.174193 16.34854,0 -8.17427,-13.348454 z"
+     style="fill:#fbb917;fill-opacity:1;fill-rule:evenodd;stroke:#fbb917;stroke-width:1.65161395;stroke-linecap:butt;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
+  <path
+     style="opacity:1;fill:#ffffff;fill-opacity:1;fill-rule:evenodd;stroke:none;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
+     d="m 179,55 0,6 2,0 0,-6"
+     id="path4300"
+     inkscape:connector-curvature="0"
+     sodipodi:nodetypes="cccc" />
+  <path
+     style="opacity:1;fill:#ffffff;fill-opacity:1;fill-rule:evenodd;stroke:none;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
+     d="m 179,62 0,2 2,0 0,-2"
+     id="path4300-6"
+     inkscape:connector-curvature="0"
+     sodipodi:nodetypes="cccc" />
+  <path
+     style="fill:#ffffff;fill-opacity:0.8;fill-rule:evenodd;stroke:#ffffff;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:0.8"
+     d="M 99.994369,113.0221 102,114.98353 l 7,-6.9558 3,0.97227 2,-1 1,-2 0,-3 -3,3 -3,-3 3,-3 -3,0 -2,1 -1,2 0.99437,3.0221 z"
+     id="path4268"
+     inkscape:connector-curvature="0"
+     sodipodi:nodetypes="ccccccccccccccc" />
+  <rect
+     id="rect4175-3-5"
+     height="16"
+     width="16"
+     y="4"
+     x="220"
+     style="fill:#4c4c4c;fill-opacity:1;stroke:none;stroke-width:0" />
+  <path
+     style="fill:#ffffff;fill-rule:evenodd;stroke:none;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
+     d="m 234,6 0,2 -5,5 0,5 -2,0 0,-5 -5,-5 0,-2"
+     id="path3546"
+     inkscape:connector-curvature="0"
+     sodipodi:nodetypes="cccccccc" />
+  <g
+     transform="matrix(1.3333328,0,0,-1.5999992,-139.9999,127.19999)"
+     id="g4383-6">
+    <rect
+       id="rect4385-2"
+       height="1.2499905"
+       width="5.9999924"
+       y="12.625005"
+       x="198.00002"
+       style="fill:#ffffff;fill-opacity:0.8;stroke:#000000;stroke-width:0" />
+    <rect
+       style="fill:#ffffff;fill-opacity:0.8;stroke:#000000;stroke-width:0"
+       x="198.00002"
+       y="15.125007"
+       width="7.4999928"
+       height="1.2499949"
+       id="rect4387-9" />
+    <rect
+       style="fill:#ffffff;fill-opacity:0.8;stroke:#000000;stroke-width:0"
+       x="198.00002"
+       y="7.6250024"
+       width="2.9999909"
+       height="1.2499905"
+       id="rect4389-1-0" />
+    <rect
+       style="fill:#ffffff;fill-opacity:0.8;stroke:#000000;stroke-width:0"
+       x="198.00002"
+       y="10.125004"
+       width="4.4999919"
+       height="1.2499905"
+       id="rect4389-1-9" />
+    <path
+       style="fill:#ffffff;fill-opacity:0.8;fill-rule:evenodd;stroke:none;stroke-width:0.68465352px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
+       d="m 207.00001,16.375004 0,-5.625005 -2.25,0 3,-3.1250014 3,3.1250014 -2.25,0 0,5.625005 -1.5,0"
+       id="path4402"
+       inkscape:connector-curvature="0"
+       sodipodi:nodetypes="cccccccc" />
+  </g>
+  <path
+     style="fill:#ffffff;fill-opacity:0.8;fill-rule:evenodd;stroke:none;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
+     d="m 164,100 0,3 -6,6 0,7 -4,0 0,-7 -6,-6 0,-3"
+     id="path3546-2-2"
+     inkscape:connector-curvature="0"
+     sodipodi:nodetypes="cccccccc" />
+  <rect
+     style="fill:#4c4c4c;fill-opacity:1;stroke:none;stroke-width:0"
+     id="svg_1-3"
+     height="16"
+     width="16"
+     y="28"
+     x="4" />
+  <path
+     sodipodi:nodetypes="ccccccccc"
+     inkscape:connector-curvature="0"
+     id="path4402-5-7"
+     d="m 15,41 0,-7 -4,0 0,3 -5,-4 5,-4 0,3 6,0 0,9"
+     style="fill:#ffffff;fill-opacity:1;fill-rule:evenodd;stroke:none;stroke-width:0.68465352px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1" />
+</svg>
diff --git a/demo/muon-monitor/src/jsMain/web/index.html b/demo/muon-monitor/src/jsMain/web/index.html
new file mode 100644
index 00000000..e4bb83a9
--- /dev/null
+++ b/demo/muon-monitor/src/jsMain/web/index.html
@@ -0,0 +1,32 @@
+<!DOCTYPE html>
+<html>
+<head>
+    <meta charset="utf-8">
+    <!--    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">-->
+    <title>Three js demo for particle physics</title>
+    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css"
+          integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
+    <link rel="stylesheet" href="css/main.css">
+    <link rel="stylesheet" href="css/jsoneditor.min.css">
+    <script type="text/javascript" src="main.bundle.js"></script>
+</head>
+<body class="testApp">
+
+<div class="container">
+    <h1>Muon monitor demo</h1>
+</div>
+
+<div class="container-fluid">
+    <div class="row">
+        <div class="col-lg-3">
+            <div class="row" id ="settings"></div>
+            <div class="row" id ="tree"></div>
+        </div>
+        <div class="col-lg-6">
+            <div class="container" id = "canvas"></div>
+        </div>
+        <div class="col-lg-3" id="editor"></div>
+    </div>
+</div>
+</body>
+</html>
\ No newline at end of file
diff --git a/demo/muon-monitor/src/jvmMain/kotlin/ru/mipt/npm/muon/monitor/readResource.kt b/demo/muon-monitor/src/jvmMain/kotlin/ru/mipt/npm/muon/monitor/readResource.kt
new file mode 100644
index 00000000..5cb275e1
--- /dev/null
+++ b/demo/muon-monitor/src/jvmMain/kotlin/ru/mipt/npm/muon/monitor/readResource.kt
@@ -0,0 +1,10 @@
+package ru.mipt.npm.muon.monitor
+
+actual fun readResource(path: String): String {
+    return ClassLoader.getSystemClassLoader().getResourceAsStream(path)?.readAllBytes()?.decodeToString()
+        ?: error("Resource '$path' not found")
+}
+
+internal actual fun readMonitorConfig(): String {
+    return readResource("map-RMM110.sc16")
+}
\ No newline at end of file
diff --git a/demo/muon-monitor/src/jvmMain/kotlin/ru/mipt/npm/muon/monitor/server/MMServer.kt b/demo/muon-monitor/src/jvmMain/kotlin/ru/mipt/npm/muon/monitor/server/MMServer.kt
new file mode 100644
index 00000000..1518aa35
--- /dev/null
+++ b/demo/muon-monitor/src/jvmMain/kotlin/ru/mipt/npm/muon/monitor/server/MMServer.kt
@@ -0,0 +1,61 @@
+package ru.mipt.npm.muon.monitor.server
+
+
+import hep.dataforge.vis.spatial.Visual3DPlugin
+import io.ktor.application.Application
+import io.ktor.application.call
+import io.ktor.application.install
+import io.ktor.application.log
+import io.ktor.features.CallLogging
+import io.ktor.features.ContentNegotiation
+import io.ktor.features.DefaultHeaders
+import io.ktor.http.content.resources
+import io.ktor.http.content.static
+import io.ktor.response.respond
+import io.ktor.routing.Routing
+import io.ktor.routing.get
+import io.ktor.serialization.serialization
+import io.ktor.server.cio.CIO
+import io.ktor.server.engine.embeddedServer
+import org.apache.commons.math3.random.JDKRandomGenerator
+import ru.mipt.npm.muon.monitor.Model
+import ru.mipt.npm.muon.monitor.sim.Cos2TrackGenerator
+import ru.mipt.npm.muon.monitor.sim.simulateOne
+import java.awt.Desktop
+import java.io.File
+import java.net.URI
+
+private val generator = Cos2TrackGenerator(JDKRandomGenerator(223))
+
+fun Application.module() {
+    val currentDir = File(".").absoluteFile
+    environment.log.info("Current directory: $currentDir")
+
+
+    install(DefaultHeaders)
+    install(CallLogging)
+    install(ContentNegotiation) {
+        serialization(json = Visual3DPlugin.json)
+    }
+    install(Routing) {
+        get("/event") {
+            val event = generator.simulateOne()
+            call.respond(event)
+        }
+        get("/geometry") {
+            call.respond(Model.buildGeometry())
+        }
+        static("/") {
+            resources()
+        }
+    }
+    try {
+        Desktop.getDesktop().browse(URI("http://localhost:8080/index.html"))
+    } catch (ex: Exception) {
+        log.error("Failed to launch browser", ex)
+    }
+}
+
+fun main() {
+    embeddedServer(CIO, 8080, host = "localhost", module = Application::module).start(wait = true)
+}
\ No newline at end of file
diff --git a/demo/muon-monitor/src/jvmMain/kotlin/ru/mipt/npm/muon/monitor/sim/Pixel.kt b/demo/muon-monitor/src/jvmMain/kotlin/ru/mipt/npm/muon/monitor/sim/Pixel.kt
new file mode 100644
index 00000000..71a96647
--- /dev/null
+++ b/demo/muon-monitor/src/jvmMain/kotlin/ru/mipt/npm/muon/monitor/sim/Pixel.kt
@@ -0,0 +1,122 @@
+package ru.mipt.npm.muon.monitor.sim
+
+import org.apache.commons.math3.geometry.euclidean.threed.Line
+import org.apache.commons.math3.geometry.euclidean.threed.Plane
+import org.apache.commons.math3.geometry.euclidean.threed.Vector3D
+import ru.mipt.npm.muon.monitor.Monitor.CENTRAL_LAYER_Z
+import ru.mipt.npm.muon.monitor.Monitor.GEOMETRY_TOLERANCE
+import ru.mipt.npm.muon.monitor.Monitor.LOWER_LAYER_Z
+import ru.mipt.npm.muon.monitor.Monitor.PIXEL_XY_SIZE
+import ru.mipt.npm.muon.monitor.Monitor.UPPER_LAYER_Z
+import ru.mipt.npm.muon.monitor.SC1
+import kotlin.random.Random
+
+/**
+ * Auxiliary cache for [SC1] planes
+ */
+internal class SC1Aux(val sc: SC1, var efficiency: Double = 1.0) {
+    //    val layer: Layer = findLayer(center.z);
+    private val upLayer =
+        findLayer(sc.center.z + sc.zSize / 2.0)//Layer("${name}_up", center.z + zSize / 2.0);
+    private val bottomLayer =
+        findLayer(sc.center.z - sc.zSize / 2.0)//Layer("${name}_bottom", center.z - zSize / 2.0);
+    private val centralLayer = findLayer(sc.center.z)
+
+    private val center = Vector3D(sc.center.x, sc.center.y, sc.center.z)
+
+    private val sideLayers: Array<Plane> = arrayOf(
+        Plane(center.add(Vector3D(PIXEL_XY_SIZE / 2, 0.0, 0.0)), Vector3D(1.0, 0.0, 0.0), GEOMETRY_TOLERANCE),
+        Plane(center.add(Vector3D(-PIXEL_XY_SIZE / 2, 0.0, 0.0)), Vector3D(-1.0, 0.0, 0.0), GEOMETRY_TOLERANCE),
+        Plane(center.add(Vector3D(0.0, PIXEL_XY_SIZE / 2, 0.0)), Vector3D(0.0, 1.0, 0.0), GEOMETRY_TOLERANCE),
+        Plane(center.add(Vector3D(0.0, -PIXEL_XY_SIZE / 2, 0.0)), Vector3D(0.0, -1.0, 0.0), GEOMETRY_TOLERANCE)
+    );
+
+    //TODO add efficiency
+    private fun containsPoint(x: Double, y: Double, z: Double, tolerance: Double = GEOMETRY_TOLERANCE): Boolean {
+        return x <= sc.center.x + sc.xSize / 2.0 + tolerance && x >= sc.center.x - sc.xSize / 2.0 - tolerance &&
+                y <= sc.center.y + sc.ySize / 2.0 + tolerance && y >= sc.center.y - sc.ySize / 2.0 - tolerance &&
+                z <= sc.center.z + sc.zSize / 2.0 + tolerance && z >= sc.center.z - sc.zSize / 2.0 - tolerance;
+    }
+
+    /**
+     * Check if pixel contains point
+     */
+    private fun containsPoint(point: Vector3D, tolerance: Double = GEOMETRY_TOLERANCE): Boolean {
+        return containsPoint(point.x, point.y, point.z, tolerance);
+    }
+
+    /**
+     * Return number of detector pixel like SCxx-12
+     */
+    fun getDetectorNumber(): Int {
+        return sc.name.substring(2, 4).toInt();
+    }
+
+    /**
+     * Return number of pixel in detector like SC79-xx
+     */
+    fun getPixelNumber(): Int {
+        return sc.name.substring(5).toInt();
+    }
+
+    /**
+     * The layer number from up to bottom
+     */
+    fun getLayerNumber(): Int {
+        return when (this.center.z) {
+            UPPER_LAYER_Z -> 1;
+            CENTRAL_LAYER_Z -> 2;
+            LOWER_LAYER_Z -> 3;
+            else -> throw RuntimeException("Unknown layer");
+        }
+    }
+
+    /**
+     * Check if track crosses the pixel
+     */
+    fun isHit(track: Line): Boolean {
+        //check central plane as well as upper and bottom planes of the layer
+        val upperIntersection = upLayer.intersection(track);
+        val bottomIntersection = bottomLayer.intersection(track);
+        val upperHit = containsPoint(upperIntersection);
+        val bottomHit = containsPoint(bottomIntersection);
+
+        if (!bottomHit && !upperHit) {
+            return false;
+        } else if (upperHit && bottomHit) {
+            return eff();
+        } else {
+            val verticalHitPoint = if (upperHit) {
+                upperIntersection
+            } else {
+                bottomIntersection
+            }
+            val horizontalHitPoint = getHorizontalHitPoint(track);
+            return if (horizontalHitPoint == null) {
+                //If horizontal intersection could not be found, it is near the rib and therefore length is always sufficient
+                true;
+            } else {
+                val length = verticalHitPoint.distance(horizontalHitPoint);
+                (length >= MINIMAL_TRACK_LENGTH) && eff();
+            }
+        }
+    }
+
+    private fun getHorizontalHitPoint(track: Line): Vector3D? {
+        return sideLayers
+            .map { it.intersection(track) }//FIXME there is a problem with geometric tolerances here
+            .firstOrNull { it != null && containsPoint(it, 100 * GEOMETRY_TOLERANCE) };
+    }
+
+    private fun eff(): Boolean {
+        return efficiency == 1.0 || Random.nextDouble() < efficiency;
+    }
+}
+
+private val auxCache = HashMap<SC1, SC1Aux>()
+
+fun SC1.isHit(track: Line): Boolean{
+    return auxCache.getOrPut(this){
+        SC1Aux(this)
+    }.isHit(track)
+}
\ No newline at end of file
diff --git a/demo/muon-monitor/src/jvmMain/kotlin/ru/mipt/npm/muon/monitor/sim/line.kt b/demo/muon-monitor/src/jvmMain/kotlin/ru/mipt/npm/muon/monitor/sim/line.kt
new file mode 100644
index 00000000..488140de
--- /dev/null
+++ b/demo/muon-monitor/src/jvmMain/kotlin/ru/mipt/npm/muon/monitor/sim/line.kt
@@ -0,0 +1,61 @@
+package ru.mipt.npm.muon.monitor.sim
+
+import hep.dataforge.vis.spatial.Point3D
+import org.apache.commons.math3.geometry.euclidean.threed.Line
+import org.apache.commons.math3.geometry.euclidean.threed.Plane
+import org.apache.commons.math3.geometry.euclidean.threed.Vector3D
+import ru.mipt.npm.muon.monitor.Monitor.CENTRAL_LAYER_Z
+import ru.mipt.npm.muon.monitor.Monitor.GEOMETRY_TOLERANCE
+
+/**
+ * Created by darksnake on 11-May-16.
+ */
+
+private val basePlane = Plane(Vector3D(0.0, 0.0, 0.0), Vector3D(0.0, 0.0, 1.0), GEOMETRY_TOLERANCE);
+
+/**
+ * elevation angle
+ */
+fun Line.getTheta(): Double {
+    return direction.delta;
+}
+
+/**
+ * Azimuthal angle
+ */
+fun Line.getPhi(): Double {
+    return direction.alpha;
+}
+
+/**
+ *  x of intersection with base (central) plane
+ */
+fun Line.getX(): Double {
+    return basePlane.intersection(this).x;
+}
+
+fun Line.getY(): Double {
+    return basePlane.intersection(this).y;
+}
+
+fun makeTrack(start: Vector3D, direction: Vector3D): Line {
+    return Line(start, start.add(direction), GEOMETRY_TOLERANCE)
+}
+
+fun makeTrack(x: Double, y: Double, theta: Double, phi: Double): Line {
+    //TODO check angle definitions
+    return makeTrack(
+        Vector3D(x, y, CENTRAL_LAYER_Z),
+        Vector3D(phi, theta)
+    )
+}
+
+fun Vector3D.toPoint() = Point3D(x, y, z)
+
+fun Line.toPoints(): List<Point3D> {
+    val basePoint = basePlane.intersection(this)
+    val bottom = basePoint.subtract(2000.0, direction)
+    val top = basePoint.add(2000.0, direction)
+    return listOf(bottom.toPoint(), top.toPoint())
+}
+
diff --git a/demo/muon-monitor/src/jvmMain/kotlin/ru/mipt/npm/muon/monitor/sim/monitor.kt b/demo/muon-monitor/src/jvmMain/kotlin/ru/mipt/npm/muon/monitor/sim/monitor.kt
new file mode 100644
index 00000000..01ff5d3b
--- /dev/null
+++ b/demo/muon-monitor/src/jvmMain/kotlin/ru/mipt/npm/muon/monitor/sim/monitor.kt
@@ -0,0 +1,52 @@
+package ru.mipt.npm.muon.monitor.sim
+
+import org.apache.commons.math3.geometry.euclidean.threed.Line
+import org.apache.commons.math3.geometry.euclidean.threed.Plane
+import org.apache.commons.math3.geometry.euclidean.threed.Vector3D
+import ru.mipt.npm.muon.monitor.Event
+import ru.mipt.npm.muon.monitor.Monitor
+import ru.mipt.npm.muon.monitor.SC1
+import ru.mipt.npm.muon.monitor.readResource
+import java.util.*
+
+
+// minimal track length in detector
+internal const val MINIMAL_TRACK_LENGTH = 10.0
+
+
+private val layerCache = HashMap<Double, Plane>()
+
+fun findLayer(z: Double): Plane = layerCache.getOrPut(z) {
+    Plane(
+        Vector3D(0.0, 0.0, z), Vector3D(0.0, 0.0, 1.0),
+        Monitor.GEOMETRY_TOLERANCE
+    )
+}
+
+fun readEffs(): Map<String, Double> {
+    val effMap = HashMap<String, Double>()
+    var detectorName: String = ""
+    var index: Int = 0
+    readResource("Effs-MM-minhits-4.dat").lineSequence().forEach { line ->
+        val trimmed = line.trim()
+        if (trimmed.startsWith("SC")) {
+            detectorName = trimmed.split(Regex("\\s+"))[2]
+        } else if (trimmed.startsWith("pixel")) {
+            index = 0
+        } else if (trimmed.isNotEmpty()) {
+            val eff = trimmed.split(Regex("\\s+"))[1].toDouble()
+            effMap["SC${detectorName}_${index}"] = eff
+            index++
+        }
+    }
+    return effMap
+}
+
+
+fun buildEventByTrack(index: Int, track: Line, hitResolver: (Line) -> Collection<SC1> = defaultHitResolver): Event {
+    return Event(index, track.toPoints(), hitResolver(track).map { it.name })
+}
+
+val defaultHitResolver: (Line) -> Collection<SC1> = { track: Line ->
+    Monitor.pixels.filter { it.isHit(track) }.toSet()
+}
\ No newline at end of file
diff --git a/demo/muon-monitor/src/jvmMain/kotlin/ru/mipt/npm/muon/monitor/sim/simulation.kt b/demo/muon-monitor/src/jvmMain/kotlin/ru/mipt/npm/muon/monitor/sim/simulation.kt
new file mode 100644
index 00000000..6019a94a
--- /dev/null
+++ b/demo/muon-monitor/src/jvmMain/kotlin/ru/mipt/npm/muon/monitor/sim/simulation.kt
@@ -0,0 +1,83 @@
+package ru.mipt.npm.muon.monitor.sim
+
+import org.apache.commons.math3.geometry.euclidean.threed.Line
+import org.apache.commons.math3.random.RandomGenerator
+import ru.mipt.npm.muon.monitor.Event
+import ru.mipt.npm.muon.monitor.Monitor.PIXEL_XY_SIZE
+import kotlin.math.acos
+import kotlin.math.pow
+import kotlin.math.sin
+
+private var counter = 0
+
+/**
+ * Simulate single track and returns corresponding event
+ */
+fun TrackGenerator.simulateOne(): Event {
+    val track = generate()
+    return buildEventByTrack(counter++, track)
+}
+
+interface TrackGenerator {
+    val rnd: RandomGenerator
+    fun generate(): Line
+}
+
+/**
+ * A uniform generator with track bases distributed in square in central plane, uniform phi and cos theta
+ */
+class UniformTrackGenerator(
+    override val rnd: RandomGenerator,
+    val maxX: Double = 4 * PIXEL_XY_SIZE,
+    val maxY: Double = 4 * PIXEL_XY_SIZE
+) :
+    TrackGenerator {
+    override fun generate(): Line {
+        val x = (1 - rnd.nextDouble() * 2.0) * maxX
+        val y = (1 - rnd.nextDouble() * 2.0) * maxY
+        val phi = (1 - rnd.nextDouble() * 2.0) * Math.PI
+        val theta = Math.PI / 2 - acos(rnd.nextDouble())
+        return makeTrack(x, y, theta, phi)
+    }
+}
+
+class FixedAngleGenerator(
+    override val rnd: RandomGenerator,
+    val phi: Double, val theta: Double,
+    val maxX: Double = 4 * PIXEL_XY_SIZE,
+    val maxY: Double = 4 * PIXEL_XY_SIZE
+) : TrackGenerator {
+    override fun generate(): Line {
+        val x = (1 - rnd.nextDouble() * 2.0) * maxX
+        val y = (1 - rnd.nextDouble() * 2.0) * maxY
+        return makeTrack(x, y, theta, phi)
+    }
+}
+
+/**
+ * Generating surface distribution using accept-reject method
+ */
+class Cos2TrackGenerator(
+    override val rnd: RandomGenerator,
+    val power: Double = 2.0,
+    val maxX: Double = 4 * PIXEL_XY_SIZE,
+    val maxY: Double = 4 * PIXEL_XY_SIZE
+) :
+    TrackGenerator {
+    override fun generate(): Line {
+        val x = (1 - rnd.nextDouble() * 2.0) * maxX
+        val y = (1 - rnd.nextDouble() * 2.0) * maxY
+        val phi = (1 - rnd.nextDouble() * 2.0) * Math.PI
+
+
+        for (i in 0..500) {
+            val thetaCandidate = acos(rnd.nextDouble())
+            val u = rnd.nextDouble()
+            val sin = sin(thetaCandidate)
+            if (u < sin.pow(power) / sin) {
+                return makeTrack(x, y, thetaCandidate, phi)
+            }
+        }
+        throw RuntimeException("Failed to generate theta from distribution")
+    }
+}
\ No newline at end of file
diff --git a/demo/muon-monitor/src/jvmMain/resources/Effs-MM-minhits-4.dat b/demo/muon-monitor/src/jvmMain/resources/Effs-MM-minhits-4.dat
new file mode 100644
index 00000000..6c700195
--- /dev/null
+++ b/demo/muon-monitor/src/jvmMain/resources/Effs-MM-minhits-4.dat
@@ -0,0 +1,397 @@
+  SC16 =  72  the min number of hits =  4
+  pixel    eff     d_eff    n_hit    n_tot
+   1a   0.9815    0.0070    39065    39801
+   2a   0.9790    0.0070    38199    39019
+   3a   0.9811    0.0070    38791    39538
+   4a   0.9833    0.0069    39987    40668
+   1b   0.9810    0.0070    38941    39697
+   2b   0.9800    0.0071    37449    38213
+   3b   0.9804    0.0070    39025    39806
+   4b   0.9804    0.0069    40432    41241
+   1c   0.9787    0.0069    39365    40221
+   2c   0.9793    0.0071    38092    38898
+   3c   0.9812    0.0070    38548    39288
+   4c   0.9806    0.0068    40894    41702
+   1d   0.9793    0.0069    39640    40479
+   2d   0.9775    0.0071    37605    38470
+   3d   0.9778    0.0069    39541    40439
+   4d   0.9786    0.0067    41719    42631
+  SC16 =  73  the min number of hits =  4
+  pixel    eff     d_eff    n_hit    n_tot
+   1a   0.9794    0.0069    39439    40270
+   2a   0.9791    0.0071    37754    38561
+   3a   0.9789    0.0069    39348    40198
+   4a   0.9794    0.0068    41517    42391
+   1b   0.9795    0.0070    39205    40027
+   2b   0.9796    0.0071    37647    38432
+   3b   0.9809    0.0070    38528    39280
+   4b   0.9818    0.0069    40075    40817
+   1c   0.9800    0.0071    38046    38822
+   2c   0.9805    0.0071    37651    38399
+   3c   0.9776    0.0069    39304    40205
+   4c   0.9817    0.0068    41296    42065
+   1d   0.9797    0.0070    38920    39728
+   2d   0.9802    0.0071    38191    38964
+   3d   0.9802    0.0070    38525    39302
+   4d   0.9825    0.0069    40020    40733
+  SC16 =  74  the min number of hits =  4
+  pixel    eff     d_eff    n_hit    n_tot
+   1a   0.9820    0.0070    39544    40270
+   2a   0.9816    0.0071    37850    38561
+   3a   0.9826    0.0070    39500    40198
+   4a   0.9835    0.0068    41693    42391
+   1b   0.9826    0.0070    39332    40027
+   2b   0.9811    0.0071    37707    38432
+   3b   0.9839    0.0070    38646    39280
+   4b   0.9855    0.0069    40224    40817
+   1c   0.9817    0.0071    38111    38822
+   2c   0.9825    0.0071    37726    38399
+   3c   0.9827    0.0070    39511    40205
+   4c   0.9842    0.0068    41399    42065
+   1d   0.9847    0.0070    39119    39728
+   2d   0.9825    0.0071    38282    38964
+   3d   0.9832    0.0070    38642    39302
+   4d   0.9856    0.0069    40148    40733
+  SC16 =  75  the min number of hits =  4
+  pixel    eff     d_eff    n_hit    n_tot
+   1a   0.9850    0.0069    40488    41106
+   2a   0.9824    0.0070    39586    40294
+   3a   0.9842    0.0069    40539    41189
+   4a   0.9877    0.0068    41864    42385
+   1b   0.9837    0.0069    40803    41478
+   2b   0.9835    0.0070    38953    39605
+   3b   0.9839    0.0069    40864    41533
+   4b   0.9856    0.0068    41895    42505
+   1c   0.9843    0.0068    41478    42139
+   2c   0.9825    0.0069    39926    40637
+   3c   0.9854    0.0069    40817    41422
+   4c   0.9866    0.0067    42925    43509
+   1d   0.9839    0.0068    41165    41839
+   2d   0.9837    0.0070    39517    40172
+   3d   0.9830    0.0068    40869    41576
+   4d   0.9840    0.0066    43928    44642
+  SC16 =  76  the min number of hits =  4
+  pixel    eff     d_eff    n_hit    n_tot
+   1a   0.9862    0.0068    41502    42083
+   2a   0.9871    0.0070    39451    39965
+   3a   0.9886    0.0069    40287    40752
+   4a   0.9897    0.0068    42213    42652
+   1b   0.9871    0.0068    41396    41939
+   2b   0.9864    0.0070    39284    39824
+   3b   0.9870    0.0069    41226    41768
+   4b   0.9863    0.0067    43486    44088
+   1c   0.9889    0.0070    40084    40533
+   2c   0.9868    0.0070    39824    40357
+   3c   0.9889    0.0069    40552    41008
+   4c   0.9908    0.0069    41425    41809
+   1d   0.9887    0.0070    40039    40498
+   2d   0.9873    0.0070    39214    39717
+   3d   0.9865    0.0069    40925    41486
+   4d   0.9883    0.0068    42085    42583
+  SC16 =  77  the min number of hits =  4
+  pixel    eff     d_eff    n_hit    n_tot
+   1a   0.9895    0.0082    29031    29339
+   2a   0.9887    0.0083    28275    28599
+   3a   0.9893    0.0081    29510    29830
+   4a   0.9902    0.0080    30308    30607
+   1b   0.9889    0.0082    28597    28918
+   2b   0.9888    0.0084    27365    27675
+   3b   0.9892    0.0083    28387    28696
+   4b   0.9913    0.0082    29412    29669
+   1c   0.9897    0.0082    28659    28957
+   2c   0.9885    0.0083    27926    28250
+   3c   0.9902    0.0082    29138    29426
+   4c   0.9909    0.0080    30831    31113
+   1d   0.9895    0.0081    29622    29937
+   2d   0.9879    0.0084    27787    28126
+   3d   0.9900    0.0082    28675    28964
+   4d   0.9913    0.0080    30536    30804
+  SC16 =  78  the min number of hits =  4
+  pixel    eff     d_eff    n_hit    n_tot
+   1a   0.9807    0.0068    41199    42008
+   2a   0.9786    0.0069    39864    40735
+   3a   0.9783    0.0068    41363    42279
+   4a   0.9815    0.0067    42769    43577
+   1b   0.9813    0.0068    40825    41605
+   2b   0.9796    0.0069    39542    40366
+   3b   0.9815    0.0069    40446    41209
+   4b   0.9841    0.0068    41689    42362
+   1c   0.9788    0.0068    41347    42244
+   2c   0.9795    0.0069    40231    41075
+   3c   0.9788    0.0068    41565    42465
+   4c   0.9810    0.0066    44415    45276
+   1d   0.9796    0.0067    41707    42576
+   2d   0.9801    0.0069    39722    40528
+   3d   0.9816    0.0068    40700    41462
+   4d   0.9816    0.0067    43022    43830
+  SC16 =  79  the min number of hits =  4
+  pixel    eff     d_eff    n_hit    n_tot
+   1a   0.9796    0.0081    29157    29765
+   2a   0.9781    0.0081    28678    29321
+   3a   0.9811    0.0081    28751    29304
+   4a   0.9783    0.0080    29750    30410
+   1b   0.9782    0.0081    29080    29728
+   2b   0.9762    0.0082    27948    28628
+   3b   0.9796    0.0080    29739    30358
+   4b   0.9796    0.0079    30395    31029
+   1c   0.9787    0.0080    29856    30505
+   2c   0.9787    0.0081    28613    29235
+   3c   0.9800    0.0081    29214    29811
+   4c   0.9804    0.0079    30742    31356
+   1d   0.9781    0.0080    29903    30572
+   2d   0.9780    0.0082    28276    28912
+   3d   0.9772    0.0080    29570    30259
+   4d   0.9788    0.0078    31546    32229
+  SC16 =  80  the min number of hits =  4
+  pixel    eff     d_eff    n_hit    n_tot
+   1a   0.9850    0.0082    28399    28832
+   2a   0.9834    0.0083    27891    28363
+   3a   0.9859    0.0082    28386    28791
+   4a   0.9878    0.0081    29272    29634
+   1b   0.9858    0.0083    28122    28528
+   2b   0.9833    0.0084    26978    27437
+   3b   0.9846    0.0082    28345    28789
+   4b   0.9872    0.0081    29293    29674
+   1c   0.9841    0.0082    28684    29148
+   2c   0.9828    0.0083    27674    28159
+   3c   0.9851    0.0083    27958    28381
+   4c   0.9869    0.0081    29810    30206
+   1d   0.9848    0.0081    29321    29774
+   2d   0.9844    0.0083    27631    28069
+   3d   0.9836    0.0082    28503    28979
+   4d   0.9851    0.0079    30577    31038
+  SC16 =  81  the min number of hits =  4
+  pixel    eff     d_eff    n_hit    n_tot
+   1a   0.9856    0.0086    25820    26198
+   2a   0.9868    0.0089    24696    25027
+   3a   0.9892    0.0088    25195    25469
+   4a   0.9892    0.0087    25786    26068
+   1b   0.9858    0.0087    25638    26007
+   2b   0.9863    0.0089    24125    24459
+   3b   0.9873    0.0086    25929    26262
+   4b   0.9852    0.0085    26940    27344
+   1c   0.9885    0.0089    24530    24816
+   2c   0.9873    0.0089    24570    24886
+   3c   0.9888    0.0088    25000    25282
+   4c   0.9907    0.0087    26103    26347
+   1d   0.9887    0.0088    25076    25362
+   2d   0.9857    0.0089    24340    24694
+   3d   0.9864    0.0087    25796    26152
+   4d   0.9871    0.0086    26010    26350
+  SC16 =  82  the min number of hits =  4
+  pixel    eff     d_eff    n_hit    n_tot
+   1a   0.9841    0.0069    40146    40794
+   2a   0.9830    0.0070    39206    39884
+   3a   0.9854    0.0070    39525    40112
+   4a   0.9874    0.0069    40762    41284
+   1b   0.9857    0.0069    40187    40771
+   2b   0.9851    0.0071    38243    38823
+   3b   0.9835    0.0069    40009    40679
+   4b   0.9850    0.0068    41450    42082
+   1c   0.9835    0.0069    40251    40927
+   2c   0.9843    0.0070    39042    39663
+   3c   0.9845    0.0069    39990    40621
+   4c   0.9869    0.0068    41955    42512
+   1d   0.9819    0.0069    40635    41386
+   2d   0.9843    0.0070    38912    39532
+   3d   0.9831    0.0069    40428    41121
+   4d   0.9825    0.0067    42663    43422
+  SC16 =  83  the min number of hits =  4
+  pixel    eff     d_eff    n_hit    n_tot
+   1a   0.9845    0.0068    41429    42083
+   2a   0.9830    0.0070    39286    39965
+   3a   0.9838    0.0069    40092    40752
+   4a   0.9850    0.0068    42013    42652
+   1b   0.9840    0.0068    41266    41939
+   2b   0.9837    0.0070    39174    39824
+   3b   0.9842    0.0068    41108    41768
+   4b   0.9841    0.0067    43388    44088
+   1c   0.9851    0.0069    39928    40533
+   2c   0.9817    0.0069    39617    40357
+   3c   0.9849    0.0069    40390    41008
+   4c   0.9863    0.0068    41238    41809
+   1d   0.9849    0.0069    39885    40498
+   2d   0.9843    0.0070    39092    39717
+   3d   0.9828    0.0069    40774    41486
+   4d   0.9859    0.0068    41981    42583
+  SC16 =  84  the min number of hits =  4
+  pixel    eff     d_eff    n_hit    n_tot
+   1a   0.9808    0.0086    25720    26224
+   2a   0.9780    0.0088    24341    24889
+   3a   0.9834    0.0086    26105    26547
+   4a   0.9796    0.0085    26333    26881
+   1b   0.9835    0.0087    25276    25699
+   2b   0.9816    0.0088    24571    25032
+   3b   0.9790    0.0087    25134    25674
+   4b   0.9866    0.0086    25969    26323
+   1c   0.9851    0.0086    25755    26145
+   2c   0.9831    0.0088    24727    25152
+   3c   0.9821    0.0086    25863    26335
+   4c   0.9813    0.0083    27641    28169
+   1d   0.9845    0.0086    26120    26532
+   2d   0.9835    0.0088    24676    25090
+   3d   0.9805    0.0086    25495    26003
+   4d   0.9847    0.0084    27010    27430
+  SC16 =  85  the min number of hits =  4
+  pixel    eff     d_eff    n_hit    n_tot
+   1a   0.9888    0.0069    41438    41908
+   2a   0.9879    0.0070    40115    40608
+   3a   0.9885    0.0068    41522    42007
+   4a   0.9890    0.0066    44029    44518
+   1b   0.9876    0.0068    41537    42059
+   2b   0.9883    0.0070    39491    39958
+   3b   0.9908    0.0069    40708    41086
+   4b   0.9895    0.0068    42674    43128
+   1c   0.9893    0.0070    40236    40672
+   2c   0.9883    0.0070    39383    39849
+   3c   0.9887    0.0068    41897    42374
+   4c   0.9901    0.0067    43244    43677
+   1d   0.9891    0.0069    40750    41197
+   2d   0.9878    0.0070    39719    40209
+   3d   0.9901    0.0069    40752    41159
+   4d   0.9902    0.0068    42110    42525
+  SC16 =  86  the min number of hits =  4
+  pixel    eff     d_eff    n_hit    n_tot
+   1a   0.9870    0.0081    29757    30148
+   2a   0.9883    0.0082    28618    28958
+   3a   0.9879    0.0082    29167    29524
+   4a   0.9886    0.0079    30975    31331
+   1b   0.9887    0.0081    29794    30133
+   2b   0.9876    0.0083    28184    28538
+   3b   0.9895    0.0082    29207    29518
+   4b   0.9907    0.0080    30271    30555
+   1c   0.9883    0.0082    28908    29251
+   2c   0.9887    0.0083    28282    28606
+   3c   0.9883    0.0081    29827    30181
+   4c   0.9916    0.0079    31116    31380
+   1d   0.9900    0.0082    29326    29622
+   2d   0.9884    0.0082    28561    28897
+   3d   0.9898    0.0082    29081    29380
+   4d   0.9911    0.0081    29889    30158
+  SC16 =  87  the min number of hits =  4
+  pixel    eff     d_eff    n_hit    n_tot
+   1a   0.9876    0.0070    39769    40270
+   2a   0.9875    0.0071    38079    38561
+   3a   0.9886    0.0070    39740    40198
+   4a   0.9869    0.0068    41835    42391
+   1b   0.9878    0.0070    39538    40027
+   2b   0.9871    0.0071    37936    38432
+   3b   0.9885    0.0071    38827    39280
+   4b   0.9896    0.0069    40393    40817
+   1c   0.9887    0.0071    38383    38822
+   2c   0.9864    0.0071    37878    38399
+   3c   0.9892    0.0070    39772    40205
+   4c   0.9899    0.0068    41641    42065
+   1d   0.9890    0.0070    39290    39728
+   2d   0.9880    0.0071    38495    38964
+   3d   0.9888    0.0071    38862    39302
+   4d   0.9912    0.0070    40375    40733
+  SC16 =  88  the min number of hits =  4
+  pixel    eff     d_eff    n_hit    n_tot
+   1a   0.9804    0.0068    41090    41910
+   2a   0.9788    0.0068    40437    41311
+   3a   0.9787    0.0067    41989    42905
+   4a   0.9814    0.0067    42708    43517
+   1b   0.9806    0.0068    41179    41993
+   2b   0.9786    0.0069    39836    40706
+   3b   0.9822    0.0068    40809    41550
+   4b   0.9830    0.0068    41869    42592
+   1c   0.9790    0.0067    41953    42853
+   2c   0.9778    0.0068    40547    41467
+   3c   0.9776    0.0067    42426    43398
+   4c   0.9781    0.0065    45386    46401
+   1d   0.9781    0.0067    42368    43318
+   2d   0.9798    0.0069    40395    41227
+   3d   0.9794    0.0068    41421    42293
+   4d   0.9810    0.0066    43810    44658
+  SC16 =  91  the min number of hits =  4
+  pixel    eff     d_eff    n_hit    n_tot
+   1a   0.9804    0.0068    41402    42230
+   2a   0.9765    0.0068    40606    41582
+   3a   0.9816    0.0068    41040    41811
+   4a   0.9818    0.0067    42427    43215
+   1b   0.9812    0.0068    41383    42176
+   2b   0.9785    0.0069    39515    40383
+   3b   0.9787    0.0068    41492    42394
+   4b   0.9812    0.0067    43091    43918
+   1c   0.9774    0.0067    41827    42794
+   2c   0.9782    0.0069    40267    41164
+   3c   0.9801    0.0068    41027    41862
+   4c   0.9801    0.0066    43673    44562
+   1d   0.9801    0.0067    42176    43031
+   2d   0.9789    0.0068    40435    41308
+   3d   0.9774    0.0067    42377    43359
+   4d   0.9771    0.0065    44859    45908
+  SC16 =  92  the min number of hits =  4
+  pixel    eff     d_eff    n_hit    n_tot
+   1a   0.9879    0.0082    28816    29168
+   2a   0.9876    0.0084    27450    27795
+   3a   0.9881    0.0082    28799    29147
+   4a   0.9877    0.0080    30498    30878
+   1b   0.9885    0.0082    28573    28904
+   2b   0.9881    0.0084    27702    28037
+   3b   0.9899    0.0083    28461    28752
+   4b   0.9905    0.0081    29726    30012
+   1c   0.9891    0.0084    27799    28104
+   2c   0.9892    0.0084    27657    27958
+   3c   0.9880    0.0082    28644    28991
+   4c   0.9903    0.0080    30138    30432
+   1d   0.9896    0.0082    28735    29037
+   2d   0.9891    0.0084    27680    27984
+   3d   0.9903    0.0083    28303    28580
+   4d   0.9912    0.0082    29272    29532
+  SC16 =  93  the min number of hits =  4
+  pixel    eff     d_eff    n_hit    n_tot
+   1a   0.9847    0.0069    40699    41330
+   2a   0.9845    0.0070    39280    39898
+   3a   0.9220    0.0066    37984    41198
+   4a   0.9864    0.0067    43034    43629
+   1b   0.9851    0.0069    40603    41216
+   2b   0.9841    0.0071    38495    39117
+   3b   0.9873    0.0070    39577    40088
+   4b   0.9866    0.0068    41684    42250
+   1c   0.9859    0.0070    39523    40090
+   2c   0.9863    0.0070    39423    39972
+   3c   0.9865    0.0069    40785    41343
+   4c   0.9865    0.0068    42213    42790
+   1d   0.9857    0.0069    40010    40589
+   2d   0.9854    0.0070    38880    39456
+   3d   0.9859    0.0070    39559    40124
+   4d   0.9875    0.0069    40866    41385
+  SC16 =  94  the min number of hits =  4
+  pixel    eff     d_eff    n_hit    n_tot
+   1a   0.9784    0.0086    25543    26106
+   2a   0.9800    0.0087    25262    25777
+   3a   0.9850    0.0087    25523    25912
+   4a   0.9835    0.0086    26036    26473
+   1b   0.9817    0.0087    25195    25664
+   2b   0.9768    0.0089    24039    24610
+   3b   0.9788    0.0086    25589    26143
+   4b   0.9821    0.0085    26527    27010
+   1c   0.9822    0.0086    25724    26191
+   2c   0.9802    0.0087    24951    25455
+   3c   0.9778    0.0087    25174    25746
+   4c   0.9810    0.0084    26777    27297
+   1d   0.9808    0.0086    25943    26452
+   2d   0.9775    0.0088    24528    25093
+   3d   0.9799    0.0086    25872    26404
+   4d   0.9783    0.0083    27161    27764
+  SC16 =  96  the min number of hits =  4
+  pixel    eff     d_eff    n_hit    n_tot
+   1a   0.9865    0.0068    42151    42727
+   2a   0.9874    0.0070    40062    40574
+   3a   0.9890    0.0069    41115    41571
+   4a   0.9895    0.0068    42296    42743
+   1b   0.9874    0.0068    41364    41890
+   2b   0.9864    0.0070    39479    40022
+   3b   0.9872    0.0068    41528    42067
+   4b   0.9870    0.0067    43749    44326
+   1c   0.9898    0.0069    40533    40952
+   2c   0.9873    0.0069    40513    41034
+   3c   0.9898    0.0069    40908    41329
+   4c   0.9903    0.0068    42150    42562
+   1d   0.9882    0.0069    40903    41392
+   2d   0.9879    0.0070    39634    40121
+   3d   0.9862    0.0068    41810    42396
+   4d   0.9893    0.0067    43167    43635
+
diff --git a/demo/muon-monitor/src/jvmTest/kotlin/ru/mipt/npm/muon/monitor/GeometryTest.kt b/demo/muon-monitor/src/jvmTest/kotlin/ru/mipt/npm/muon/monitor/GeometryTest.kt
new file mode 100644
index 00000000..7c718e23
--- /dev/null
+++ b/demo/muon-monitor/src/jvmTest/kotlin/ru/mipt/npm/muon/monitor/GeometryTest.kt
@@ -0,0 +1,17 @@
+package ru.mipt.npm.muon.monitor
+
+import org.junit.Test
+import kotlin.test.assertTrue
+
+class GeometryTest {
+
+    @Test
+    fun testLoadGeometry(){
+        assertTrue { readMonitorConfig().isNotBlank() }
+    }
+
+    @Test
+    fun testLoadModel(){
+        assertTrue { Monitor.pixels.isNotEmpty() }
+    }
+}
\ No newline at end of file
diff --git a/demo/spatial-showcase/build.gradle.kts b/demo/spatial-showcase/build.gradle.kts
new file mode 100644
index 00000000..46d63633
--- /dev/null
+++ b/demo/spatial-showcase/build.gradle.kts
@@ -0,0 +1,39 @@
+import org.openjfx.gradle.JavaFXOptions
+
+plugins {
+    id("scientifik.mpp")
+    id("org.openjfx.javafxplugin")
+    id("application")
+}
+
+kotlin {
+
+    jvm {
+        withJava()
+    }
+
+    js {
+        browser {
+            webpackTask {
+                sourceMaps = false
+            }
+        }
+    }
+
+    sourceSets {
+        commonMain {
+            dependencies {
+                api(project(":dataforge-vis-spatial"))
+                api(project(":dataforge-vis-spatial-gdml"))
+            }
+        }
+    }
+}
+
+application {
+    mainClassName = "hep.dataforge.vis.spatial.demo.FXDemoAppKt"
+}
+
+configure<JavaFXOptions> {
+    modules("javafx.controls")
+}
\ No newline at end of file
diff --git a/demo/spatial-showcase/src/commonMain/kotlin/hep/dataforge/vis/spatial/demo/demo.kt b/demo/spatial-showcase/src/commonMain/kotlin/hep/dataforge/vis/spatial/demo/demo.kt
new file mode 100644
index 00000000..ddb92491
--- /dev/null
+++ b/demo/spatial-showcase/src/commonMain/kotlin/hep/dataforge/vis/spatial/demo/demo.kt
@@ -0,0 +1,173 @@
+package hep.dataforge.vis.spatial.demo
+
+import hep.dataforge.meta.buildMeta
+import hep.dataforge.meta.invoke
+import hep.dataforge.names.toName
+import hep.dataforge.output.OutputManager
+import hep.dataforge.vis.common.Colors
+import hep.dataforge.vis.common.VisualObject
+import hep.dataforge.vis.spatial.*
+import hep.dataforge.vis.spatial.specifications.CanvasSpec
+import kotlinx.coroutines.*
+import kotlin.math.PI
+import kotlin.math.cos
+import kotlin.math.sin
+import kotlin.random.Random
+
+
+fun OutputManager.demo(name: String, title: String = name, block: VisualGroup3D.() -> Unit) {
+    val meta = buildMeta {
+        "title" put title
+    }
+    val output = get(VisualObject::class, name.toName(), meta = meta)
+    output.render(action = block)
+}
+
+val canvasOptions = CanvasSpec {
+    minSize = 500
+    axes {
+        size = 500.0
+        visible = true
+    }
+    camera {
+        distance = 600.0
+        latitude = PI/6
+    }
+}
+
+fun OutputManager.showcase() {
+    demo("shapes", "Basic shapes") {
+        box(100.0, 100.0, 100.0) {
+            z = -110.0
+        }
+        sphere(50.0) {
+            x = 110
+            detail = 16
+        }
+        tube(50, height = 10, innerRadius = 25, angle = PI) {
+            y = 110
+            detail = 16
+            rotationX = PI / 4
+        }
+    }
+
+    demo("dynamic", "Dynamic properties") {
+        val group = group {
+            box(100, 100, 100) {
+                z = 110.0
+            }
+
+            box(100, 100, 100) {
+                visible = false
+                x = 110.0
+                //override color for this cube
+                color(1530)
+
+                GlobalScope.launch(Dispatchers.Main) {
+                    while (isActive) {
+                        delay(500)
+                        visible = !(visible ?: false)
+                    }
+                }
+            }
+        }
+
+        GlobalScope.launch(Dispatchers.Main) {
+            val random = Random(111)
+            while (isActive) {
+                delay(1000)
+                group.color(random.nextInt(0, Int.MAX_VALUE))
+            }
+        }
+    }
+
+    demo("rotation", "Rotations") {
+        box(100, 100, 100)
+        group {
+            x = 200
+            rotationY = PI / 4
+            box(100, 100, 100) {
+                rotationZ = PI / 4
+                color(Colors.red)
+            }
+        }
+    }
+
+    demo("extrude", "extruded shape") {
+        extrude {
+            shape {
+                polygon(8, 50)
+            }
+            for (i in 0..100) {
+                layer(i * 5, 20 * sin(2 * PI / 100 * i), 20 * cos(2 * PI / 100 * i))
+            }
+            color(Colors.teal)
+            rotationX = -PI / 2
+        }
+    }
+
+    demo("lines", "Track / line segments") {
+        sphere(100) {
+            detail = 32
+            opacity = 0.4
+            color(Colors.blue)
+        }
+        repeat(20) {
+            polyline(Point3D(100, 100, 100), Point3D(-100, -100, -100)) {
+                thickness = 3.0
+                rotationX = it * PI2 / 20
+                color(Colors.green)
+                //rotationY = it * PI2 / 20
+            }
+        }
+    }
+
+    demo("text", "Box with a label") {
+        box(100, 100, 50) {
+            opacity = 0.3
+        }
+        label("Hello, world!", fontSize = 12) {
+            z = 26
+        }
+    }
+}
+
+fun OutputManager.showcaseCSG() {
+    demo("CSG.simple", "CSG operations") {
+        composite(CompositeType.UNION) {
+            box(100, 100, 100) {
+                z = 50
+            }
+            sphere(50)
+            material {
+                color(Colors.lightgreen)
+                opacity = 0.3f
+            }
+        }
+        composite(CompositeType.INTERSECT) {
+            y = 300
+            box(100, 100, 100) {
+                z = 50
+            }
+            sphere(50)
+            color(Colors.red)
+        }
+        composite(CompositeType.SUBTRACT) {
+            y = -300
+            box(100, 100, 100) {
+                z = 50
+            }
+            sphere(50)
+            color(Colors.blue)
+        }
+    }
+
+    demo("CSG.custom", "CSG with manually created object") {
+        intersect {
+            tube(60, 10) {
+                detail = 64
+            }
+            box(100, 100, 100)
+        }
+    }
+}
\ No newline at end of file
diff --git a/demo/spatial-showcase/src/jsMain/kotlin/hep/dataforge/vis/spatial/demo/ThreeDemoApp.kt b/demo/spatial-showcase/src/jsMain/kotlin/hep/dataforge/vis/spatial/demo/ThreeDemoApp.kt
new file mode 100644
index 00000000..7d9adc3e
--- /dev/null
+++ b/demo/spatial-showcase/src/jsMain/kotlin/hep/dataforge/vis/spatial/demo/ThreeDemoApp.kt
@@ -0,0 +1,56 @@
+package hep.dataforge.vis.spatial.demo
+
+import hep.dataforge.js.Application
+import hep.dataforge.js.startApplication
+import hep.dataforge.vis.spatial.three.MeshThreeFactory.Companion.EDGES_ENABLED_KEY
+import hep.dataforge.vis.spatial.three.MeshThreeFactory.Companion.WIREFRAME_ENABLED_KEY
+import hep.dataforge.vis.spatial.x
+import hep.dataforge.vis.spatial.y
+import kotlinx.coroutines.GlobalScope
+import kotlinx.coroutines.delay
+import kotlinx.coroutines.isActive
+import kotlinx.coroutines.launch
+import kotlin.browser.document
+import kotlin.random.Random
+
+private class ThreeDemoApp : Application {
+
+    override fun start(state: Map<String, Any>) {
+
+        val element = document.getElementById("canvas") ?: error("Element with id 'canvas' not found on page")
+
+        ThreeDemoGrid(element).run {
+            showcase()
+            showcaseCSG()
+//            demo("dynamicBox", "Dancing boxes") {
+//                val boxes = (-10..10).flatMap { i ->
+//                    (-10..10).map { j ->
+//                        varBox(10, 10, 0, name = "cell_${i}_${j}") {
+//                            x = i * 10
+//                            y = j * 10
+//                            value = 128
+//                            setProperty(EDGES_ENABLED_KEY, false)
+//                            setProperty(WIREFRAME_ENABLED_KEY, false)
+//                        }
+//                    }
+//                }
+//                GlobalScope.launch {
+//                    while (isActive) {
+//                        delay(500)
+//                        boxes.forEach { box ->
+//                            box.value = (box.value + Random.nextInt(-15, 15)).coerceIn(0..255)
+//                        }
+//                    }
+//                }
+//            }
+        }
+
+
+    }
+
+    override fun dispose() = emptyMap<String, Any>()//mapOf("lines" put presenter.dispose())
+}
+
+fun main() {
+    startApplication(::ThreeDemoApp)
+}
\ No newline at end of file
diff --git a/demo/spatial-showcase/src/jsMain/kotlin/hep/dataforge/vis/spatial/demo/ThreeDemoGrid.kt b/demo/spatial-showcase/src/jsMain/kotlin/hep/dataforge/vis/spatial/demo/ThreeDemoGrid.kt
new file mode 100644
index 00000000..44a71b5a
--- /dev/null
+++ b/demo/spatial-showcase/src/jsMain/kotlin/hep/dataforge/vis/spatial/demo/ThreeDemoGrid.kt
@@ -0,0 +1,66 @@
+package hep.dataforge.vis.spatial.demo
+
+import hep.dataforge.context.Global
+import hep.dataforge.meta.Meta
+import hep.dataforge.meta.get
+import hep.dataforge.meta.invoke
+import hep.dataforge.meta.string
+import hep.dataforge.names.Name
+import hep.dataforge.output.OutputManager
+import hep.dataforge.output.Renderer
+import hep.dataforge.vis.common.VisualObject
+import hep.dataforge.vis.spatial.specifications.AxesSpec
+import hep.dataforge.vis.spatial.specifications.CameraSpec
+import hep.dataforge.vis.spatial.specifications.CanvasSpec
+import hep.dataforge.vis.spatial.three.ThreeCanvas
+import hep.dataforge.vis.spatial.three.ThreePlugin
+import hep.dataforge.vis.spatial.three.output
+import kotlinx.html.dom.append
+import kotlinx.html.dom.create
+import kotlinx.html.h2
+import kotlinx.html.hr
+import kotlinx.html.id
+import kotlinx.html.js.div
+import kotlinx.html.span
+import org.w3c.dom.Element
+import kotlin.browser.document
+import kotlin.dom.clear
+import kotlin.reflect.KClass
+
+class ThreeDemoGrid(element: Element, meta: Meta = Meta.EMPTY) : OutputManager {
+
+    private val gridRoot = document.create.div("row")
+    private val outputs: MutableMap<Name, ThreeCanvas> = HashMap()
+
+    private val three = Global.plugins.fetch(ThreePlugin)
+
+    init {
+        element.clear()
+        element.append(gridRoot)
+    }
+
+    @Suppress("UNCHECKED_CAST")
+    override fun <T : Any> get(type: KClass<out T>, name: Name, stage: Name, meta: Meta): Renderer<T> {
+
+        return outputs.getOrPut(name) {
+            if (type != VisualObject::class) error("Supports only DisplayObject")
+            lateinit var output: ThreeCanvas
+            //TODO calculate cell width here using jquery
+            gridRoot.append {
+                span("border") {
+                    div("col-6") {
+                        div { id = "output-$name" }.also {
+                            output = three.output(it, canvasOptions)
+                            //output.attach(it)
+                        }
+                        hr()
+                        h2 { +(meta["title"].string ?: name.toString()) }
+                    }
+                }
+            }
+
+            output
+        } as Renderer<T>
+    }
+}
+
diff --git a/demo/spatial-showcase/src/jsMain/kotlin/hep/dataforge/vis/spatial/demo/VariableBox.kt b/demo/spatial-showcase/src/jsMain/kotlin/hep/dataforge/vis/spatial/demo/VariableBox.kt
new file mode 100644
index 00000000..2827dcbd
--- /dev/null
+++ b/demo/spatial-showcase/src/jsMain/kotlin/hep/dataforge/vis/spatial/demo/VariableBox.kt
@@ -0,0 +1,107 @@
+@file:UseSerializers(Point3DSerializer::class)
+
+package hep.dataforge.vis.spatial.demo
+
+import hep.dataforge.meta.int
+import hep.dataforge.meta.number
+import hep.dataforge.names.plus
+import hep.dataforge.names.startsWith
+import hep.dataforge.vis.common.getProperty
+import hep.dataforge.vis.common.setProperty
+import hep.dataforge.vis.spatial.*
+import hep.dataforge.vis.spatial.VisualObject3D.Companion.GEOMETRY_KEY
+import hep.dataforge.vis.spatial.demo.VariableBoxThreeFactory.Z_SIZE_KEY
+import hep.dataforge.vis.spatial.three.*
+import info.laht.threekt.core.BufferGeometry
+import info.laht.threekt.core.Object3D
+import info.laht.threekt.geometries.BoxBufferGeometry
+import info.laht.threekt.materials.MeshBasicMaterial
+import info.laht.threekt.objects.Mesh
+import kotlinx.serialization.UseSerializers
+import kotlin.math.max
+import kotlin.reflect.KClass
+
+internal var VisualObject3D.variableZSize: Number
+    get() = getProperty(Z_SIZE_KEY, false).number ?: 0f
+    set(value) {
+        setProperty(Z_SIZE_KEY, value)
+    }
+
+internal var VisualObject3D.value: Int
+    get() = getProperty("value", false).int ?: 0
+    set(value) {
+        setProperty("value", value)
+        val size = value.toFloat() / 255f * 20f
+        scaleZ = size
+        z = -size / 2
+
+        val b = max(0, 255 - value)
+        val r = max(0, value - 255)
+        val g = 255 - b - r
+        color(r.toUByte(), g.toUByte(), b.toUByte())
+    }
+
+fun VisualGroup3D.varBox(
+    xSize: Number,
+    ySize: Number,
+    zSize: Number,
+    name: String = "",
+    action: VisualObject3D.() -> Unit = {}
+) = CustomThreeVisualObject(VariableBoxThreeFactory).apply {
+    scaleX = xSize
+    scaleY = ySize
+    scaleZ = zSize
+}.apply(action).also { set(name, it) }
+
+private object VariableBoxThreeFactory : ThreeFactory<VisualObject3D> {
+    val X_SIZE_KEY = GEOMETRY_KEY + "xSize"
+    val Y_SIZE_KEY = GEOMETRY_KEY + "ySize"
+    val Z_SIZE_KEY = GEOMETRY_KEY + "zSize"
+
+    override val type: KClass<in VisualObject3D> get() = VisualObject3D::class
+
+    override fun invoke(obj: VisualObject3D): Object3D {
+        val xSize = obj.getProperty(X_SIZE_KEY, false).number?.toDouble() ?: 1.0
+        val ySize = obj.getProperty(Y_SIZE_KEY, false).number?.toDouble() ?: 1.0
+        val zSize = obj.getProperty(Z_SIZE_KEY, false).number?.toDouble() ?: 1.0
+        val geometry = BoxBufferGeometry(1, 1, 1)
+
+        //JS sometimes tries to pass Geometry as BufferGeometry
+        @Suppress("USELESS_IS_CHECK") if (geometry !is BufferGeometry) error("BufferGeometry expected")
+
+        val mesh = Mesh(geometry, MeshBasicMaterial()).apply {
+            applyEdges(obj)
+            applyWireFrame(obj)
+
+            //set position for mesh
+            updatePosition(obj)
+
+            //set color for mesh
+            updateMaterial(obj)
+
+            layers.enable(obj.layer)
+            children.forEach {
+                it.layers.enable(obj.layer)
+            }
+        }
+
+        mesh.scale.set(xSize, ySize, zSize)
+
+        //add listener to object properties
+        obj.onPropertyChange(this) { name, _, _ ->
+            when {
+//                name.startsWith(GEOMETRY_KEY) -> {
+//                    val newXSize = obj.getProperty(X_SIZE_KEY, false).number?.toDouble() ?: 1.0
+//                    val newYSize = obj.getProperty(Y_SIZE_KEY, false).number?.toDouble() ?: 1.0
+//                    val newZSize = obj.getProperty(Z_SIZE_KEY, false).number?.toDouble() ?: 1.0
+//                    mesh.scale.set(newXSize, newYSize, newZSize)
+//                    mesh.updateMatrix()
+//                }
+                name.startsWith(MeshThreeFactory.WIREFRAME_KEY) -> mesh.applyWireFrame(obj)
+                name.startsWith(MeshThreeFactory.EDGES_KEY) -> mesh.applyEdges(obj)
+                else -> mesh.updateProperty(obj, name)
+            }
+        }
+        return mesh
+    }
+}
\ No newline at end of file
diff --git a/demo/spatial-showcase/src/jsMain/web/index.html b/demo/spatial-showcase/src/jsMain/web/index.html
new file mode 100644
index 00000000..e76b2dd4
--- /dev/null
+++ b/demo/spatial-showcase/src/jsMain/web/index.html
@@ -0,0 +1,17 @@
+<!DOCTYPE html>
+<html>
+<head>
+    <meta charset="utf-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
+    <title>Three js demo for particle physics</title>
+    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css"
+          integrity="sha384-Vkoo8x4CGsO3+Hhxv8T/Q5PaXtkKtu6ug5TOeNV6gBiFeWPGFN9MuhOf23Q9Ifjh" crossorigin="anonymous">
+    <script type="text/javascript" src="main.bundle.js"></script>
+</head>
+<body class="testApp">
+<div class="container">
+    <h1>Demo grid</h1>
+</div>
+<div class="container" id="canvas"></div>
+</body>
+</html>
\ No newline at end of file
diff --git a/demo/spatial-showcase/src/jvmMain/kotlin/hep/dataforge/vis/spatial/demo/FXDemoApp.kt b/demo/spatial-showcase/src/jvmMain/kotlin/hep/dataforge/vis/spatial/demo/FXDemoApp.kt
new file mode 100644
index 00000000..109ed1da
--- /dev/null
+++ b/demo/spatial-showcase/src/jvmMain/kotlin/hep/dataforge/vis/spatial/demo/FXDemoApp.kt
@@ -0,0 +1,28 @@
+package hep.dataforge.vis.spatial.demo
+
+import hep.dataforge.vis.spatial.gdml.gdml
+import javafx.stage.Stage
+import tornadofx.*
+import java.nio.file.Paths
+
+class FXDemoApp : App(FXDemoGrid::class) {
+
+    val view: FXDemoGrid by inject()
+
+    override fun start(stage: Stage) {
+        super.start(stage)
+
+        stage.width = 600.0
+        stage.height = 600.0
+
+        view.showcase()
+        view.demo("gdml", "gdml-cubes") {
+            gdml(Paths.get("D:\\Work\\Projects\\gdml.kt\\gdml-source\\cubes.gdml"))
+            //setProperty(Material3D.MATERIAL_WIREFRAME_KEY, true)
+        }
+    }
+}
+
+fun main() {
+    launch<FXDemoApp>()
+}
\ No newline at end of file
diff --git a/demo/spatial-showcase/src/jvmMain/kotlin/hep/dataforge/vis/spatial/demo/FXDemoGrid.kt b/demo/spatial-showcase/src/jvmMain/kotlin/hep/dataforge/vis/spatial/demo/FXDemoGrid.kt
new file mode 100644
index 00000000..9357e5de
--- /dev/null
+++ b/demo/spatial-showcase/src/jvmMain/kotlin/hep/dataforge/vis/spatial/demo/FXDemoGrid.kt
@@ -0,0 +1,43 @@
+package hep.dataforge.vis.spatial.demo
+
+import hep.dataforge.context.Global
+import hep.dataforge.meta.Meta
+import hep.dataforge.meta.buildMeta
+import hep.dataforge.names.Name
+import hep.dataforge.output.OutputManager
+import hep.dataforge.output.Renderer
+import hep.dataforge.vis.common.VisualObject
+import hep.dataforge.vis.spatial.fx.FX3DPlugin
+import hep.dataforge.vis.spatial.fx.FXCanvas3D
+import hep.dataforge.vis.spatial.specifications.AxesSpec
+import hep.dataforge.vis.spatial.specifications.CanvasSpec
+import javafx.collections.FXCollections
+import javafx.scene.Parent
+import javafx.scene.control.Tab
+import tornadofx.*
+import kotlin.reflect.KClass
+
+class FXDemoGrid : View(title = "DataForge-vis FX demo"), OutputManager {
+    private val outputs = FXCollections.observableHashMap<Name, FXCanvas3D>()
+
+    override val root: Parent = borderpane {
+        center = tabpane {
+            tabs.bind(outputs) { key: Name, value: FXCanvas3D ->
+                Tab(key.toString(), value.root)
+            }
+        }
+    }
+
+    private val fx3d = Global.plugins.fetch(FX3DPlugin)
+
+    @Suppress("UNCHECKED_CAST")
+    override fun <T : Any> get(type: KClass<out T>, name: Name, stage: Name, meta: Meta): Renderer<T> {
+        return outputs.getOrPut(name) {
+            if (type != VisualObject::class) kotlin.error("Supports only DisplayObject")
+            val output = FXCanvas3D(fx3d, canvasOptions)
+
+            output
+        } as Renderer<T>
+    }
+
+}
\ No newline at end of file
diff --git a/gradle/wrapper/gradle-wrapper.jar b/gradle/wrapper/gradle-wrapper.jar
index 5c2d1cf0..cc4fdc29 100644
Binary files a/gradle/wrapper/gradle-wrapper.jar and b/gradle/wrapper/gradle-wrapper.jar differ
diff --git a/gradle/wrapper/gradle-wrapper.properties b/gradle/wrapper/gradle-wrapper.properties
index 7c4388a9..94920145 100644
--- a/gradle/wrapper/gradle-wrapper.properties
+++ b/gradle/wrapper/gradle-wrapper.properties
@@ -1,5 +1,5 @@
 distributionBase=GRADLE_USER_HOME
 distributionPath=wrapper/dists
-distributionUrl=https\://services.gradle.org/distributions/gradle-5.6.2-bin.zip
+distributionUrl=https\://services.gradle.org/distributions/gradle-6.0.1-bin.zip
 zipStoreBase=GRADLE_USER_HOME
 zipStorePath=wrapper/dists
diff --git a/gradlew b/gradlew
index 83f2acfd..2fe81a7d 100644
--- a/gradlew
+++ b/gradlew
@@ -154,19 +154,19 @@ if [ "$cygwin" = "true" -o "$msys" = "true" ] ; then
         else
             eval `echo args$i`="\"$arg\""
         fi
-        i=$((i+1))
+        i=`expr $i + 1`
     done
     case $i in
-        (0) set -- ;;
-        (1) set -- "$args0" ;;
-        (2) set -- "$args0" "$args1" ;;
-        (3) set -- "$args0" "$args1" "$args2" ;;
-        (4) set -- "$args0" "$args1" "$args2" "$args3" ;;
-        (5) set -- "$args0" "$args1" "$args2" "$args3" "$args4" ;;
-        (6) set -- "$args0" "$args1" "$args2" "$args3" "$args4" "$args5" ;;
-        (7) set -- "$args0" "$args1" "$args2" "$args3" "$args4" "$args5" "$args6" ;;
-        (8) set -- "$args0" "$args1" "$args2" "$args3" "$args4" "$args5" "$args6" "$args7" ;;
-        (9) set -- "$args0" "$args1" "$args2" "$args3" "$args4" "$args5" "$args6" "$args7" "$args8" ;;
+        0) set -- ;;
+        1) set -- "$args0" ;;
+        2) set -- "$args0" "$args1" ;;
+        3) set -- "$args0" "$args1" "$args2" ;;
+        4) set -- "$args0" "$args1" "$args2" "$args3" ;;
+        5) set -- "$args0" "$args1" "$args2" "$args3" "$args4" ;;
+        6) set -- "$args0" "$args1" "$args2" "$args3" "$args4" "$args5" ;;
+        7) set -- "$args0" "$args1" "$args2" "$args3" "$args4" "$args5" "$args6" ;;
+        8) set -- "$args0" "$args1" "$args2" "$args3" "$args4" "$args5" "$args6" "$args7" ;;
+        9) set -- "$args0" "$args1" "$args2" "$args3" "$args4" "$args5" "$args6" "$args7" "$args8" ;;
     esac
 fi
 
@@ -175,14 +175,9 @@ save () {
     for i do printf %s\\n "$i" | sed "s/'/'\\\\''/g;1s/^/'/;\$s/\$/' \\\\/" ; done
     echo " "
 }
-APP_ARGS=$(save "$@")
+APP_ARGS=`save "$@"`
 
 # Collect all arguments for the java command, following the shell quoting and substitution rules
 eval set -- $DEFAULT_JVM_OPTS $JAVA_OPTS $GRADLE_OPTS "\"-Dorg.gradle.appname=$APP_BASE_NAME\"" -classpath "\"$CLASSPATH\"" org.gradle.wrapper.GradleWrapperMain "$APP_ARGS"
 
-# by default we should be in the correct project dir, but when run from Finder on Mac, the cwd is wrong
-if [ "$(uname)" = "Darwin" ] && [ "$HOME" = "$PWD" ]; then
-  cd "$(dirname "$0")"
-fi
-
 exec "$JAVACMD" "$@"
diff --git a/settings.gradle.kts b/settings.gradle.kts
index b49736d1..7dbf2794 100644
--- a/settings.gradle.kts
+++ b/settings.gradle.kts
@@ -13,12 +13,7 @@ pluginManagement {
     resolutionStrategy {
         eachPlugin {
             when (requested.id.id) {
-                "kotlinx-atomicfu" -> useModule("org.jetbrains.kotlinx:atomicfu-gradle-plugin:${requested.version}")
-                "kotlin-multiplatform" -> useModule("org.jetbrains.kotlin:kotlin-gradle-plugin:${requested.version}")
-                "org.jetbrains.kotlin.jvm" -> useModule("org.jetbrains.kotlin:kotlin-gradle-plugin:${requested.version}")
-                "org.jetbrains.kotlin.js" -> useModule("org.jetbrains.kotlin:kotlin-gradle-plugin:${requested.version}")
                 "kotlin-dce-js" -> useModule("org.jetbrains.kotlin:kotlin-gradle-plugin:${requested.version}")
-                "org.jetbrains.kotlin.frontend" -> useModule("org.jetbrains.kotlin:kotlin-frontend-plugin:${requested.version}")
                 "scientifik.mpp", "scientifik.publish", "scientifik.jvm", "scientifik.js" -> useModule("scientifik:gradle-tools:${requested.version}")
                 "org.openjfx.javafxplugin" -> useModule("org.openjfx:javafx-plugin:${requested.version}")
             }
@@ -26,17 +21,18 @@ pluginManagement {
     }
 }
 
-enableFeaturePreview("GRADLE_METADATA")
+//enableFeaturePreview("GRADLE_METADATA")
 
 rootProject.name = "dataforge-vis"
 
 include(
     ":dataforge-vis-common",
-    ":wrappers",
-    ":dataforge-vis-fx",
+//    ":wrappers",
     ":dataforge-vis-spatial",
     ":dataforge-vis-spatial-gdml",
-    ":spatial-js-demo"
+    ":demo:spatial-showcase",
+    ":demo:gdml",
+    ":demo:muon-monitor"
 )
 
 //if(file("../dataforge-core").exists()) {
diff --git a/spatial-js-demo/build.gradle.kts b/spatial-js-demo/build.gradle.kts
deleted file mode 100644
index fa333f2d..00000000
--- a/spatial-js-demo/build.gradle.kts
+++ /dev/null
@@ -1,9 +0,0 @@
-plugins {
-    id("scientifik.js")
-    //id("kotlin-dce-js")
-}
-
-dependencies {
-    api(project(":dataforge-vis-spatial"))
-    testCompile(kotlin("test-js"))
-}
diff --git a/spatial-js-demo/src/main/kotlin/hep/dataforge/vis/spatial/demo/ThreeDemoApp.kt b/spatial-js-demo/src/main/kotlin/hep/dataforge/vis/spatial/demo/ThreeDemoApp.kt
deleted file mode 100644
index a35bf4c9..00000000
--- a/spatial-js-demo/src/main/kotlin/hep/dataforge/vis/spatial/demo/ThreeDemoApp.kt
+++ /dev/null
@@ -1,158 +0,0 @@
-package hep.dataforge.vis.spatial.demo
-
-import hep.dataforge.context.ContextBuilder
-import hep.dataforge.vis.ApplicationBase
-import hep.dataforge.vis.common.Colors
-import hep.dataforge.vis.spatial.*
-import hep.dataforge.vis.startApplication
-import kotlinx.coroutines.GlobalScope
-import kotlinx.coroutines.delay
-import kotlinx.coroutines.isActive
-import kotlinx.coroutines.launch
-import kotlin.math.PI
-import kotlin.math.cos
-import kotlin.math.sin
-import kotlin.random.Random
-
-
-private class ThreeDemoApp : ApplicationBase() {
-
-    override val stateKeys: List<String> = emptyList()
-
-    override fun start(state: Map<String, Any>) {
-
-        //TODO replace by optimized builder after dataforge 0.1.3-dev-8
-        val context = ContextBuilder("three-demo").build()
-
-        context.plugins.load(ThreeDemoGrid()).run {
-            demo("shapes", "Basic shapes") {
-                box(100.0, 100.0, 100.0) {
-                    z = 110.0
-                }
-                sphere(50.0) {
-                    x = 110
-                    detail = 16
-                }
-                tube(50, height = 10, innerRadius = 25, angle = PI) {
-                    y = 110
-                    detail = 16
-                    rotationX = PI / 4
-                }
-            }
-
-            demo("dynamic", "Dynamic properties") {
-                val group = group {
-                    box(100, 100, 100) {
-                        z = 110.0
-                    }
-
-                    box(100, 100, 100) {
-                        visible = false
-                        x = 110.0
-                        //override color for this cube
-                        color(1530)
-
-                        GlobalScope.launch {
-                            while (isActive) {
-                                delay(500)
-                                visible = !(visible ?: false)
-                            }
-                        }
-                    }
-                }
-
-                GlobalScope.launch {
-                    val random = Random(111)
-                    while (isActive) {
-                        delay(1000)
-                        group.color(random.nextInt(0, Int.MAX_VALUE))
-                    }
-                }
-            }
-
-            demo("rotation", "Rotations") {
-                box(100, 100, 100)
-                group {
-                    x = 200
-                    rotationY = PI / 4
-                    box(100, 100, 100) {
-                        rotationZ = PI / 4
-                        color(Colors.red)
-                    }
-                }
-            }
-
-            demo("extrude", "extruded shape") {
-                extrude {
-                    shape {
-                        polygon(8, 50)
-                    }
-                    for (i in 0..100) {
-                        layer(i * 5, 20 * sin(2 * PI / 100 * i), 20 * cos(2 * PI / 100 * i))
-                    }
-                    color(Colors.teal)
-                }
-            }
-
-            demo("CSG.simple", "CSG operations") {
-                composite(CompositeType.UNION) {
-                    box(100, 100, 100) {
-                        z = 50
-                    }
-                    sphere(50)
-                    material {
-                        "color" to Colors.lightgreen
-                        "opacity" to 0.3
-                    }
-                }
-                composite(CompositeType.INTERSECT) {
-                    y = 300
-                    box(100, 100, 100) {
-                        z = 50
-                    }
-                    sphere(50)
-                    color(Colors.red)
-                }
-                composite(CompositeType.SUBTRACT) {
-                    y = -300
-                    box(100, 100, 100) {
-                        z = 50
-                    }
-                    sphere(50)
-                    color(Colors.blue)
-                }
-            }
-            demo("CSG.custom", "CSG with manually created object") {
-                intersect {
-                    box(100, 100, 100)
-                    tube(60, 10) {
-                        detail = 180
-                    }
-                }
-            }
-            demo("lines", "Track / line segments") {
-                sphere(100) {
-                    color(Colors.blue)
-                    detail = 50
-                    opacity = 0.4
-                }
-                repeat(20) {
-                    polyline(Point3D(100, 100, 100), Point3D(-100, -100, -100)) {
-                        thickness = 208.0
-                        rotationX = it * PI2 / 20
-                        color(Colors.green)
-                             //rotationY = it * PI2 / 20
-                    }
-                }
-            }
-        }
-
-
-    }
-
-    override fun dispose() = emptyMap<String, Any>()//mapOf("lines" to presenter.dispose())
-}
-
-fun main() {
-    startApplication(::ThreeDemoApp)
-}
\ No newline at end of file
diff --git a/spatial-js-demo/src/main/kotlin/hep/dataforge/vis/spatial/demo/ThreeDemoGrid.kt b/spatial-js-demo/src/main/kotlin/hep/dataforge/vis/spatial/demo/ThreeDemoGrid.kt
deleted file mode 100644
index 9eb190d8..00000000
--- a/spatial-js-demo/src/main/kotlin/hep/dataforge/vis/spatial/demo/ThreeDemoGrid.kt
+++ /dev/null
@@ -1,92 +0,0 @@
-package hep.dataforge.vis.spatial.demo
-
-import hep.dataforge.context.AbstractPlugin
-import hep.dataforge.context.Context
-import hep.dataforge.context.PluginFactory
-import hep.dataforge.context.PluginTag
-import hep.dataforge.meta.Meta
-import hep.dataforge.meta.buildMeta
-import hep.dataforge.meta.get
-import hep.dataforge.meta.string
-import hep.dataforge.names.Name
-import hep.dataforge.names.toName
-import hep.dataforge.output.Output
-import hep.dataforge.output.OutputManager
-import hep.dataforge.vis.common.VisualObject
-import hep.dataforge.vis.spatial.VisualGroup3D
-import hep.dataforge.vis.spatial.render
-import hep.dataforge.vis.spatial.three.ThreeOutput
-import hep.dataforge.vis.spatial.three.ThreePlugin
-import hep.dataforge.vis.spatial.three.output
-import kotlinx.html.dom.append
-import kotlinx.html.dom.create
-import kotlinx.html.h2
-import kotlinx.html.hr
-import kotlinx.html.id
-import kotlinx.html.js.div
-import kotlinx.html.span
-import kotlin.browser.document
-import kotlin.dom.clear
-import kotlin.reflect.KClass
-
-class ThreeDemoGrid(meta: Meta) : AbstractPlugin(meta), OutputManager {
-    override val tag: PluginTag get() = Companion.tag
-
-    private val gridRoot = document.create.div("row")
-    private val outputs: MutableMap<Name, ThreeOutput> = HashMap()
-
-    override fun dependsOn(): List<PluginFactory<*>> = listOf(ThreePlugin)
-
-    override fun attach(context: Context) {
-        super.attach(context)
-        val elementId = meta["elementID"].string ?: "canvas"
-        val element = document.getElementById(elementId) ?: error("Element with id $elementId not found on page")
-        element.clear()
-        element.append(gridRoot)
-    }
-
-    @Suppress("UNCHECKED_CAST")
-    override fun <T : Any> get(type: KClass<out T>, name: Name, stage: Name, meta: Meta): Output<T> {
-        val three = context.plugins.get<ThreePlugin>()!!
-
-        return outputs.getOrPut(name) {
-            if (type != VisualObject::class) error("Supports only DisplayObject")
-            val output = three.output(meta = meta) {
-                "minSize" to 500
-                "axis" to {
-                    "size" to 500
-                }
-            }
-            //TODO calculate cell width here using jquery
-            gridRoot.append {
-                span("border") {
-                    div("col-6") {
-                        div { id = "output-$name" }.also{
-                            output.attach(it)
-                        }
-                        hr()
-                        h2 { +(meta["title"].string ?: name.toString()) }
-                    }
-                }
-            }
-
-            output
-        } as Output<T>
-    }
-
-    companion object : PluginFactory<ThreeDemoGrid> {
-        override val tag: PluginTag = PluginTag(group = "hep.dataforge", name = "vis.js.spatial.demo")
-
-        override val type: KClass<out ThreeDemoGrid> = ThreeDemoGrid::class
-
-        override fun invoke(meta: Meta): ThreeDemoGrid = ThreeDemoGrid(meta)
-    }
-}
-
-fun ThreeDemoGrid.demo(name: String, title: String = name, block: VisualGroup3D.() -> Unit) {
-    val meta = buildMeta {
-        "title" to title
-    }
-    val output = get(VisualObject::class, name.toName(), meta = meta)
-    output.render(action = block)
-}
\ No newline at end of file
diff --git a/spatial-js-demo/src/main/web/index.html b/spatial-js-demo/src/main/web/index.html
deleted file mode 100644
index ef65002b..00000000
--- a/spatial-js-demo/src/main/web/index.html
+++ /dev/null
@@ -1,35 +0,0 @@
-<!DOCTYPE html>
-<html>
-<head>
-    <meta charset="utf-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
-    <title>Three js demo for particle physics</title>
-    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css"
-          integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
-    <script type="text/javascript" src="main.bundle.js"></script>
-</head>
-<body class="testApp">
-<!--
-<div class="container" id="drop_zone" data-toggle="tooltip" data-placement="right"
-     title="Для загрузки данных в текстовом формате, надо перетащить файл сюда">
-    Загрузить данные
-    <br/>
-    (перетащить файл сюда)
-</div>
--->
-<div class="container">
-    <h1>Demo grid</h1>
-</div>
-<div class="container" id="canvas"></div>
-
-<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js"
-        integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo"
-        crossorigin="anonymous"></script>
-<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js"
-        integrity="sha384-UO2eT0CpHqdSJQ6hJty5KVphtPhzWj9WO1clHTMGa3JDZwrnQq4sF86dIHNDz0W1"
-        crossorigin="anonymous"></script>
-<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js"
-        integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM"
-        crossorigin="anonymous"></script>
-</body>
-</html>
\ No newline at end of file
diff --git a/wrappers/build.gradle.kts b/wrappers/build.gradle.kts
index 177713d0..0d79fcc0 100644
--- a/wrappers/build.gradle.kts
+++ b/wrappers/build.gradle.kts
@@ -13,8 +13,8 @@ kotlin{
     sourceSets["main"].apply{
         dependencies{
             api(npm("style-loader"))
-            api(npm("inspire-tree","6.0.1"))
-            api(npm("inspire-tree-dom","4.0.6"))
+//            api(npm("inspire-tree","6.0.1"))
+//            api(npm("inspire-tree-dom","4.0.6"))
             api(npm("jsoneditor"))
             api(npm("dat.gui"))
             //api("org.jetbrains:kotlin-extensions:1.0.1-pre.83-kotlin-1.3.50")