diff options
| -rw-r--r-- | examples/showcase/src/main/kotlin/com/example/DataTab.kt | 4 | ||||
| -rw-r--r-- | examples/todomvc/build.gradle | 10 | ||||
| -rw-r--r-- | examples/todomvc/src/main/kotlin/com/example/Todomvc.kt | 39 |
3 files changed, 31 insertions, 22 deletions
diff --git a/examples/showcase/src/main/kotlin/com/example/DataTab.kt b/examples/showcase/src/main/kotlin/com/example/DataTab.kt index 8a38e001..ed690340 100644 --- a/examples/showcase/src/main/kotlin/com/example/DataTab.kt +++ b/examples/showcase/src/main/kotlin/com/example/DataTab.kt @@ -1,7 +1,7 @@ package com.example import com.lightningkite.kotlin.observable.list.observableListOf -import pl.treksoft.kvision.data.DataComponent +import pl.treksoft.kvision.data.BaseDataComponent import pl.treksoft.kvision.data.DataContainer import pl.treksoft.kvision.form.check.CHECKBOXSTYLE import pl.treksoft.kvision.form.check.CheckBox @@ -20,7 +20,7 @@ class DataTab : SimplePanel() { val panel = VPanel(spacing = 5) - class DataModel(checked: Boolean, text: String) : DataComponent() { + class DataModel(checked: Boolean, text: String) : BaseDataComponent() { var checked: Boolean by obs(checked) var text: String by obs(text) } diff --git a/examples/todomvc/build.gradle b/examples/todomvc/build.gradle index 3087c146..f8e959d3 100644 --- a/examples/todomvc/build.gradle +++ b/examples/todomvc/build.gradle @@ -1,5 +1,6 @@ buildscript { ext.kotlin_version = '1.2.21' + ext.serialization_version = '0.4' ext.production = (findProperty('prod') ?: 'false') == 'true' ext.npmdeps = new URL("file:///home/rjaros/git/kvision/npm.dependencies").getText() @@ -7,23 +8,27 @@ buildscript { jcenter() maven { url 'https://dl.bintray.com/kotlin/kotlin-eap' } maven { url "https://plugins.gradle.org/m2/" } + maven { url "https://kotlin.bintray.com/kotlinx" } } dependencies { classpath "org.jetbrains.kotlin:kotlin-gradle-plugin:$kotlin_version" classpath "org.jetbrains.kotlin:kotlin-frontend-plugin:0.0.26" classpath "gradle.plugin.io.gitlab.arturbosch.detekt:detekt-gradle-plugin:1.0.0.RC6-2" + classpath "org.jetbrains.kotlinx:kotlinx-gradle-serialization-plugin:$serialization_version" } } apply plugin: 'kotlin2js' +apply plugin: 'kotlinx-serialization' apply plugin: 'org.jetbrains.kotlin.frontend' apply plugin: "io.gitlab.arturbosch.detekt" repositories { jcenter() - maven { url = 'https://dl.bintray.com/gbaldeck/kotlin' } - maven { url = 'https://dl.bintray.com/rjaros/kotlin' } + maven { url 'https://kotlin.bintray.com/kotlinx' } + maven { url 'https://dl.bintray.com/gbaldeck/kotlin' } + maven { url 'https://dl.bintray.com/rjaros/kotlin' } maven { url "file:///home/rjaros/kotlin/mvn/" } @@ -31,6 +36,7 @@ repositories { dependencies { compile "org.jetbrains.kotlin:kotlin-stdlib-js:$kotlin_version" + compile "org.jetbrains.kotlinx:kotlinx-serialization-runtime-js:$serialization_version" compile "org.jetbrains.kotlin:kotlin-test-js:$kotlin_version" // for now only compile configuration is supported compile "pl.treksoft:kvision:0.0.1" } diff --git a/examples/todomvc/src/main/kotlin/com/example/Todomvc.kt b/examples/todomvc/src/main/kotlin/com/example/Todomvc.kt index 76d90716..bbed337f 100644 --- a/examples/todomvc/src/main/kotlin/com/example/Todomvc.kt +++ b/examples/todomvc/src/main/kotlin/com/example/Todomvc.kt @@ -1,11 +1,14 @@ package com.example import com.lightningkite.kotlin.observable.list.observableListOf +import kotlinx.serialization.Serializable +import kotlinx.serialization.json.JSON +import kotlinx.serialization.list import org.w3c.dom.get import org.w3c.dom.set import pl.treksoft.kvision.ApplicationBase import pl.treksoft.kvision.core.Root -import pl.treksoft.kvision.data.DataComponent +import pl.treksoft.kvision.data.BaseDataComponent import pl.treksoft.kvision.data.DataContainer import pl.treksoft.kvision.form.FieldLabel import pl.treksoft.kvision.form.check.CHECKINPUTTYPE @@ -23,13 +26,18 @@ import kotlin.browser.localStorage const val ENTER_KEY = 13 const val ESCAPE_KEY = 27 -class Todo(completed: Boolean, title: String, hidden: Boolean) : DataComponent() { - var completed: Boolean by obs(completed) - var title: String by obs(title) +@Serializable +open class BaseTodo(open var completed: Boolean, open var title: String) : BaseDataComponent() + +class Todo(completed: Boolean, title: String, hidden: Boolean) : BaseTodo(completed, title) { + constructor(base: BaseTodo) : this(base.completed, base.title, false) + + override var completed: Boolean by obs(completed) + override var title: String by obs(title) var hidden: Boolean by obs(hidden) } -enum class LISTMODE { +enum class TODOMODE { ALL, ACTIVE, COMPLETED @@ -57,7 +65,7 @@ class Todomvc : ApplicationBase() { private val itemsLeftTag = Tag(TAG.SPAN, " items left", classes = setOf("todo-count")).apply { add(countTag) } - private var mode: LISTMODE = LISTMODE.ALL + private var mode: TODOMODE = TODOMODE.ALL private val header = genHeader() private val main = genMain() @@ -80,17 +88,12 @@ class Todomvc : ApplicationBase() { private fun loadModel() { localStorage.get("todos-kvision")?.let { - JSON.parse<Array<dynamic>>(it).map { Todo(it.completed, it.title, false) }.forEach { - model.add(it) - } + JSON.parse(BaseTodo.serializer().list, it).map { model.add(Todo(it)) } } } private fun saveModel() { - val jsonString = model.map { - val array = listOf("title" to it.title, "completed" to it.completed).toTypedArray() - JSON.stringify(kotlin.js.json(*array)) - }.toString() + val jsonString = JSON.indented.stringify(BaseTodo.serializer().list, model.toList()) localStorage.set("todos-kvision", jsonString) } @@ -110,7 +113,7 @@ class Todomvc : ApplicationBase() { } private fun all() { - this.mode = LISTMODE.ALL + this.mode = TODOMODE.ALL this.allLink.addCssClass("selected") this.activeLink.removeCssClass("selected") this.completedLink.removeCssClass("selected") @@ -118,7 +121,7 @@ class Todomvc : ApplicationBase() { } private fun active() { - this.mode = LISTMODE.ACTIVE + this.mode = TODOMODE.ACTIVE this.allLink.removeCssClass("selected") this.activeLink.addCssClass("selected") this.completedLink.removeCssClass("selected") @@ -126,7 +129,7 @@ class Todomvc : ApplicationBase() { } private fun completed() { - this.mode = LISTMODE.COMPLETED + this.mode = TODOMODE.COMPLETED this.allLink.removeCssClass("selected") this.activeLink.removeCssClass("selected") this.completedLink.addCssClass("selected") @@ -154,7 +157,7 @@ class Todomvc : ApplicationBase() { private fun addTodo(value: String?) { val v = value?.trim() ?: "" if (v.isNotEmpty()) { - model.add(Todo(false, v, mode == LISTMODE.COMPLETED)) + model.add(Todo(false, v, mode == TODOMODE.COMPLETED)) } } @@ -183,7 +186,7 @@ class Todomvc : ApplicationBase() { ).onClick { model[index].completed = this.value model[index].hidden = - mode == LISTMODE.ACTIVE && this.value || mode == LISTMODE.COMPLETED && !this.value + mode == TODOMODE.ACTIVE && this.value || mode == TODOMODE.COMPLETED && !this.value }) add(Tag(TAG.LABEL, model[index].title).apply { setEventListener<Tag> { |