Support for SplitPanel drag and dragEnd events

6 files changed, 34 insertions, 17 deletions

diff --git a/src/main/kotlin/pl/treksoft/kvision/Showcase.kt b/src/main/kotlin/pl/treksoft/kvision/Showcase.kt
index 25bacd6b..9ac623a8 100644
--- a/src/main/kotlin/pl/treksoft/kvision/Showcase.kt
+++ b/src/main/kotlin/pl/treksoft/kvision/Showcase.kt
@@ -83,6 +83,13 @@ class Showcase : ApplicationBase() {
                 "Proin porttitor diam id massa eleifend aliquet. Morbi nec erat porttitor, placerat lorem et, dignissim lectus. Cras ultricies posuere arcu, et pharetra dui laoreet in. Sed nec ipsum in sapien vestibulum maximus eu id nunc. Ut finibus aliquam nisi id vehicula. Phasellus sodales lobortis orci, non interdum risus dignissim quis. Proin bibendum consectetur diam nec mattis. Suspendisse dictum vulputate metus at tincidunt."))
         split.add(split2)
         root.add(split)
+        split.setEventListener<SplitPanel> {
+            dragSplitPanel = { e ->
+                if ((e.detail.asDynamic()).newWidth > 400) {
+                    e.detail.preventDefault()
+                }
+            }
+        }
 
         val p = Tag(TAG.P, "To jest prawo", align = ALIGN.RIGHT)
         p.title = "Tytuł"
diff --git a/src/main/kotlin/pl/treksoft/kvision/core/Widget.kt b/src/main/kotlin/pl/treksoft/kvision/core/Widget.kt
index 8db506e8..4c818063 100644
--- a/src/main/kotlin/pl/treksoft/kvision/core/Widget.kt
+++ b/src/main/kotlin/pl/treksoft/kvision/core/Widget.kt
@@ -3,6 +3,7 @@ package pl.treksoft.kvision.core
 import com.github.snabbdom.VNode
 import com.github.snabbdom.VNodeData
 import com.github.snabbdom.h
+import org.w3c.dom.CustomEventInit
 import org.w3c.dom.Node
 import pl.treksoft.jquery.JQuery
 import pl.treksoft.jquery.jQuery
@@ -227,4 +228,9 @@ open class Widget(classes: Set<String> = setOf()) : KVObject {
             arrayOf(label)
         }
     }
+
+    internal open fun dispatchEvent(type: String, eventInitDict: CustomEventInit): Boolean? {
+        val event = org.w3c.dom.CustomEvent(type, eventInitDict)
+        return this.getElement()?.dispatchEvent(event)
+    }
 }
diff --git a/src/main/kotlin/pl/treksoft/kvision/dropdown/DropDown.kt b/src/main/kotlin/pl/treksoft/kvision/dropdown/DropDown.kt
index 8cc7eaf6..780cc4e3 100644
--- a/src/main/kotlin/pl/treksoft/kvision/dropdown/DropDown.kt
+++ b/src/main/kotlin/pl/treksoft/kvision/dropdown/DropDown.kt
@@ -134,21 +134,17 @@ open class DropDown(text: String, elements: List<StringPair>? = null, icon: Stri
     @Suppress("UnsafeCastFromDynamic")
     override fun afterInsert(node: VNode) {
         this.getElementJQuery()?.on("show.bs.dropdown", { e, _ ->
-            val event = CustomEvent("showBsDropdown", obj({ detail = e }))
-            this.getElement()?.dispatchEvent(event)
+            this.dispatchEvent("showBsDropdown", obj({ detail = e }))
         })
         this.getElementJQuery()?.on("shown.bs.dropdown", { e, _ ->
-            val event = CustomEvent("shownBsDropdown", obj({ detail = e }))
-            this.getElement()?.dispatchEvent(event)
+            this.dispatchEvent("shownBsDropdown", obj({ detail = e }))
         })
         this.getElementJQuery()?.on("hide.bs.dropdown", { e, _ ->
-            val event = CustomEvent("hideBsDropdown", obj({ detail = e }))
-            this.getElement()?.dispatchEvent(event)
+            this.dispatchEvent("hideBsDropdown", obj({ detail = e }))
         })
         this.getElementJQuery()?.on("hidden.bs.dropdown", { e, _ ->
             list.visible = false
-            val event = CustomEvent("hiddenBsDropdown", obj({ detail = e }))
-            this.getElement()?.dispatchEvent(event)
+            this.dispatchEvent("hiddenBsDropdown", obj({ detail = e }))
         })
     }
 
diff --git a/src/main/kotlin/pl/treksoft/kvision/modal/Modal.kt b/src/main/kotlin/pl/treksoft/kvision/modal/Modal.kt
index d9a0466f..c587e977 100644
--- a/src/main/kotlin/pl/treksoft/kvision/modal/Modal.kt
+++ b/src/main/kotlin/pl/treksoft/kvision/modal/Modal.kt
@@ -139,21 +139,17 @@ open class Modal(caption: String? = null, closeButton: Boolean = true,
             backdrop = if (escape) "true" else "static"
         })
         this.getElementJQuery()?.on("show.bs.modal", { e, _ ->
-            val event = CustomEvent("showBsModal", obj({ detail = e }))
-            this.getElement()?.dispatchEvent(event)
+            this.dispatchEvent("showBsModal", obj({ detail = e }))
         })
         this.getElementJQuery()?.on("shown.bs.modal", { e, _ ->
-            val event = CustomEvent("shownBsModal", obj({ detail = e }))
-            this.getElement()?.dispatchEvent(event)
+            this.dispatchEvent("shownBsModal", obj({ detail = e }))
         })
         this.getElementJQuery()?.on("hide.bs.modal", { e, _ ->
-            val event = CustomEvent("hideBsModal", obj({ detail = e }))
-            this.getElement()?.dispatchEvent(event)
+            this.dispatchEvent("hideBsModal", obj({ detail = e }))
         })
         this.getElementJQuery()?.on("hidden.bs.modal", { e, _ ->
             this.visible = false
-            val event = CustomEvent("hiddenBsModal", obj({ detail = e }))
-            this.getElement()?.dispatchEvent(event)
+            this.dispatchEvent("hiddenBsModal", obj({ detail = e }))
         })
     }
 
diff --git a/src/main/kotlin/pl/treksoft/kvision/panel/SplitPanel.kt b/src/main/kotlin/pl/treksoft/kvision/panel/SplitPanel.kt
index 234a9a20..be51149e 100644
--- a/src/main/kotlin/pl/treksoft/kvision/panel/SplitPanel.kt
+++ b/src/main/kotlin/pl/treksoft/kvision/panel/SplitPanel.kt
@@ -2,6 +2,7 @@ package pl.treksoft.kvision.panel
 
 import com.github.snabbdom.VNode
 import pl.treksoft.jquery.JQuery
+import pl.treksoft.jquery.JQueryEventObject
 import pl.treksoft.kvision.core.Container
 import pl.treksoft.kvision.html.TAG
 import pl.treksoft.kvision.html.Tag
@@ -17,19 +18,28 @@ open class SplitPanel(val direction: DIRECTION = DIRECTION.VERTICAL,
 
     internal val splitter = Splitter(this, direction)
 
+    @Suppress("UnsafeCastFromDynamic")
     internal fun afterInsertSplitter() {
         if (children.size == 2) {
             val horizontal = direction == DIRECTION.HORIZONTAL
+            val self = this
             children[0].getElementJQueryD().resizable(obj {
                 handleSelector = "#" + splitter.id
                 resizeWidth = !horizontal
                 resizeHeight = horizontal
-                onDragEnd = { _: dynamic, el: JQuery, _: dynamic ->
+                onDrag = lok@ { e: JQueryEventObject, _: JQuery, newWidth: Int, newHeight: Int, _: dynamic ->
+                    e.asDynamic()["newWidth"] = newWidth
+                    e.asDynamic()["newHeight"] = newHeight
+                    self.dispatchEvent("dragSplitPanel", obj({ detail = e }))
+                    return@lok !e.isDefaultPrevented()
+                }
+                onDragEnd = { e: JQueryEventObject, el: JQuery, _: dynamic ->
                     if (horizontal) {
                         children[0].height = el.height().toInt()
                     } else {
                         children[0].width = el.width().toInt()
                     }
+                    self.dispatchEvent("dragEndSplitPanel", obj({ detail = e }))
                 }
             })
         }
diff --git a/src/main/kotlin/pl/treksoft/kvision/snabbdom/Types.kt b/src/main/kotlin/pl/treksoft/kvision/snabbdom/Types.kt
index e8df9971..dc6877a1 100644
--- a/src/main/kotlin/pl/treksoft/kvision/snabbdom/Types.kt
+++ b/src/main/kotlin/pl/treksoft/kvision/snabbdom/Types.kt
@@ -34,6 +34,8 @@ interface BtOn : On {
     var shownBsModal: ((KvEvent) -> kotlin.Unit)?
     var hideBsModal: ((KvEvent) -> kotlin.Unit)?
     var hiddenBsModal: ((KvEvent) -> kotlin.Unit)?
+    var dragSplitPanel: ((KvEvent) -> kotlin.Unit)?
+    var dragEndSplitPanel: ((KvEvent) -> kotlin.Unit)?
 }
 
 interface SnOn<T> : BtOn {