DropDown attributes

6 files changed, 62 insertions, 9 deletions

diff --git a/src/main/kotlin/pl/treksoft/kvision/Showcase.kt b/src/main/kotlin/pl/treksoft/kvision/Showcase.kt
index 019b6681..67d7bbd1 100644
--- a/src/main/kotlin/pl/treksoft/kvision/Showcase.kt
+++ b/src/main/kotlin/pl/treksoft/kvision/Showcase.kt
@@ -5,6 +5,7 @@ import pl.treksoft.kvision.core.Container
 import pl.treksoft.kvision.core.Img
 import pl.treksoft.kvision.core.KVManager
 import pl.treksoft.kvision.core.Root
+import pl.treksoft.kvision.dropdown.DD.*
 import pl.treksoft.kvision.dropdown.DropDown
 import pl.treksoft.kvision.html.*
 import pl.treksoft.kvision.html.TAG.H1
@@ -32,7 +33,8 @@ class Showcase : ApplicationBase() {
         val dd = DropDown("Dropdown", listOf("abc" to "#!/x", "def" to "#!/y"), "flag")
         root.add(dd)
 
-        val dd2 = DropDown("Dropdown2", listOf("abc" to "#!/abc", "def" to "#!/def"), "flag")
+        val dd2 = DropDown("Dropdown2", listOf("abc" to "#!/abc", "def" to "#!/def", "xyz" to DISABLED.POS, "Header" to HEADER.POS, "Separtatorek" to SEPARATOR.POS
+        ), "flag", dropup = true)
         root.add(dd2)
 
         val p = Tag(TAG.P, "To jest prawo", align = ALIGN.RIGHT)
diff --git a/src/main/kotlin/pl/treksoft/kvision/core/Widget.kt b/src/main/kotlin/pl/treksoft/kvision/core/Widget.kt
index 8da8b0b6..34a3aa81 100644
--- a/src/main/kotlin/pl/treksoft/kvision/core/Widget.kt
+++ b/src/main/kotlin/pl/treksoft/kvision/core/Widget.kt
@@ -29,6 +29,11 @@ open class Widget(classes: Set<String> = setOf()) : KVObject {
             field = value
             refresh()
         }
+    var role: String? = null
+        set(value) {
+            field = value
+            refresh()
+        }
 
     internal open fun render(): VNode {
         return kvh("div")
@@ -68,6 +73,9 @@ open class Widget(classes: Set<String> = setOf()) : KVObject {
         if (title != null) {
             snattrs.add("title" to title.orEmpty())
         }
+        if (role != null) {
+            snattrs.add("role" to role.orEmpty())
+        }
         return snattrs
     }
 
diff --git a/src/main/kotlin/pl/treksoft/kvision/dropdown/DropDown.kt b/src/main/kotlin/pl/treksoft/kvision/dropdown/DropDown.kt
index 1a3f63c9..7176f725 100644
--- a/src/main/kotlin/pl/treksoft/kvision/dropdown/DropDown.kt
+++ b/src/main/kotlin/pl/treksoft/kvision/dropdown/DropDown.kt
@@ -5,15 +5,36 @@ import pl.treksoft.kvision.core.ResString
 import pl.treksoft.kvision.html.*
 import pl.treksoft.kvision.snabbdom.StringPair
 
+enum class DD(val POS: String) {
+    HEADER("DD#HEADER"),
+    DISABLED("DD#DISABLED"),
+    SEPARATOR("DD#SEPARATOR")
+}
+
 open class DropDown(text: String, elements: List<StringPair>, icon: String? = null, style: BUTTON_STYLE = BUTTON_STYLE.DEFAULT, size: BUTTON_SIZE? = null,
-                    block: Boolean = false, disabled: Boolean = false, image: ResString? = null, classes: Set<String> = setOf()) : Container(classes) {
+                    block: Boolean = false, disabled: Boolean = false, image: ResString? = null, dropup: Boolean = false, classes: Set<String> = setOf()) : Container(classes) {
     val idc = "kv_dropdown_" + counter
     val button: DropDownButton = DropDownButton(idc, text, icon, style, size, block, disabled, image, setOf("dropdown"))
     val list: DropDownListTag = DropDownListTag(idc, setOf("dropdown-menu"))
 
     init {
-        this.addCssClass("dropdown")
-        val children = elements.map { Link(it.first, it.second) }
+        this.addCssClass(if (dropup) "dropup" else "dropdown")
+        val children = elements.map {
+            when (it.second) {
+                DD.HEADER.POS -> Tag(TAG.LI, it.first, classes = setOf("dropdown-header"))
+                DD.SEPARATOR.POS -> {
+                    val tag = Tag(TAG.LI, classes = setOf("divider"))
+                    tag.role = "separator"
+                    tag
+                }
+                DD.DISABLED.POS -> {
+                    val tag = Tag(TAG.LI, classes = setOf("disabled"))
+                    tag.add(Link(it.first, "#"))
+                    tag
+                }
+                else -> Link(it.first, it.second)
+            }
+        }
         list.addAll(children)
         this.add(button)
         this.add(list)
diff --git a/src/main/kotlin/pl/treksoft/kvision/html/List.kt b/src/main/kotlin/pl/treksoft/kvision/html/List.kt
index b2801ce9..e525d9a5 100644
--- a/src/main/kotlin/pl/treksoft/kvision/html/List.kt
+++ b/src/main/kotlin/pl/treksoft/kvision/html/List.kt
@@ -1,11 +1,9 @@
 package pl.treksoft.kvision.html
 
 import com.github.snabbdom.VNode
-import com.github.snabbdom.array
 import com.github.snabbdom.h
 import pl.treksoft.kvision.core.Container
 import pl.treksoft.kvision.core.KVManager
-import pl.treksoft.kvision.core.Widget
 import pl.treksoft.kvision.snabbdom.StringBoolPair
 
 enum class LIST(val tagName: String) {
@@ -49,8 +47,20 @@ open class ListTag(type: LIST, elements: List<String>? = null, rich: Boolean = f
     override fun childrenVNodes(): Array<VNode> {
         val childrenElements = children.filter { it.visible }
         val res = when (type) {
-            LIST.UL, LIST.OL, LIST.UNSTYLED, LIST.INLINE -> childrenElements.map { v -> h("li", arrayOf(v.render())) }
-            LIST.DL, LIST.DL_HORIZ -> childrenElements.mapIndexed { index, v -> h(if (index % 2 == 0) "dt" else "dd", arrayOf(v.render())) }
+            LIST.UL, LIST.OL, LIST.UNSTYLED, LIST.INLINE -> childrenElements.map { v ->
+                if (v is Tag && v.type == TAG.LI) {
+                    v.render()
+                } else {
+                    h("li", arrayOf(v.render()))
+                }
+            }
+            LIST.DL, LIST.DL_HORIZ -> childrenElements.mapIndexed { index, v ->
+                if (v is Tag && v.type == TAG.LI) {
+                    v.render()
+                } else {
+                    h(if (index % 2 == 0) "dt" else "dd", arrayOf(v.render()))
+                }
+            }
         }
         return res.toTypedArray()
     }
diff --git a/src/main/kotlin/pl/treksoft/kvision/html/Tag.kt b/src/main/kotlin/pl/treksoft/kvision/html/Tag.kt
index cbaa611e..4a3f708f 100644
--- a/src/main/kotlin/pl/treksoft/kvision/html/Tag.kt
+++ b/src/main/kotlin/pl/treksoft/kvision/html/Tag.kt
@@ -32,7 +32,8 @@ enum class TAG(val tagName: String) {
     KBD("kbd"),
     VAR("var"),
     SAMP("samp"),
-    SPAN("span")
+    SPAN("span"),
+    LI("li")
 }
 
 enum class ALIGN(val className: String) {
diff --git a/src/test/kotlin/test/pl/treksoft/kvision/dropdown/DropDownSpec.kt b/src/test/kotlin/test/pl/treksoft/kvision/dropdown/DropDownSpec.kt
index 878119dc..fec45a47 100644
--- a/src/test/kotlin/test/pl/treksoft/kvision/dropdown/DropDownSpec.kt
+++ b/src/test/kotlin/test/pl/treksoft/kvision/dropdown/DropDownSpec.kt
@@ -20,4 +20,15 @@ class DropDownSpec : DomSpec {
         }
     }
 
+    @Test
+    fun render_DropUp() {
+        run {
+            val root = Root("test")
+            val dd = DropDown("Dropdown", listOf("abc" to "#!/x", "def" to "#!/y"), "flag", dropup = true)
+            root.add(dd)
+            val element = document.getElementById("test")
+            assertEquals("<div class=\"dropup\"><button class=\"dropdown btn btn-default\" id=\"kv_dropdown_1\" type=\"button\" data-toggle=\"dropdown\" aria-haspopup=\"true\" aria-expanded=\"false\"><span class=\"glyphicon glyphicon-flag\"></span> Dropdown</button><ul class=\"dropdown-menu\" aria-labelledby=\"kv_dropdown_1\"><li><a href=\"#!/x\">abc</a></li><li><a href=\"#!/y\">def</a></li></ul></div>", element?.innerHTML, "Should render correct drop down")
+        }
+    }
+
 }
\ No newline at end of file