From 70bc6412e0b54119d3f0b6a82c1def78a9088d16 Mon Sep 17 00:00:00 2001 From: Robert Jaros Date: Sun, 3 Sep 2017 03:23:34 +0200 Subject: DropDown attributes --- src/main/kotlin/pl/treksoft/kvision/Showcase.kt | 4 +++- src/main/kotlin/pl/treksoft/kvision/core/Widget.kt | 8 +++++++ .../pl/treksoft/kvision/dropdown/DropDown.kt | 27 +++++++++++++++++++--- src/main/kotlin/pl/treksoft/kvision/html/List.kt | 18 +++++++++++---- src/main/kotlin/pl/treksoft/kvision/html/Tag.kt | 3 ++- .../pl/treksoft/kvision/dropdown/DropDownSpec.kt | 11 +++++++++ 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 = 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 = 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, icon: String? = null, style: BUTTON_STYLE = BUTTON_STYLE.DEFAULT, size: BUTTON_SIZE? = null, - block: Boolean = false, disabled: Boolean = false, image: ResString? = null, classes: Set = setOf()) : Container(classes) { + block: Boolean = false, disabled: Boolean = false, image: ResString? = null, dropup: Boolean = false, classes: Set = 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? = null, rich: Boolean = f override fun childrenVNodes(): Array { 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("
", element?.innerHTML, "Should render correct drop down") + } + } + } \ No newline at end of file -- cgit