Added some todos

lightningkite · Nov 27, 2024 · 96b2a87 · 96b2a87
1 parent ddd2b73
commit 96b2a87
Show file tree

Hide file tree

Showing 2 changed files with 9 additions and 74 deletions.
diff --git a/example-app/src/commonMain/kotlin/com/lightningkite/mppexampleapp/docs/DataScreen.kt b/example-app/src/commonMain/kotlin/com/lightningkite/mppexampleapp/docs/DataScreen.kt
@@ -209,80 +209,14 @@ object DataScreen: DocScreen {
                     }
                 }
             }
-            text("Notice that you can increment either of the two counters now")
-//            space()
-//            h2("Starting simple with Property")
-//            text("KiteUI is roughly based on Solid.js, which uses smaller sections to contain actions that should run when dependencies change.")
-//            text("However, to begin using that, we have to first look at Property.")
-//
-//            code { content = ("val counter = Property<Int>(0)") }
-//            val counter = Property<Int>(0)
-//
-//            text("A Property is a changing value that we want to observe changes on.  We can now manipulate the value freely:")
-//            code { content = "counter.value = 0" }
-//            counter.value = 0
-//
-//            text("Anyone who listens to the property will be notified when the value changes.  Now, how do we use it?  We can use what's called a reactive scope:")
-//            example("""
-//                text {
-//                    reactive { content = "The current counter value is ${'$'}{counter()}" }
-//                }
-//                """.trimIndent()) {
-//                text {
-//                    reactive { content = "The current counter value is ${counter()}" }
-//                }
-//            }
-//            text("The code within the reactive block will run any time the things it depends on change.")
-//
-//            text("Now, let's make a button to increment it:")
-//            example("""
-//                important - button {
-//                    text("Increment the counter")
-//                    onClick { counter.value++ }
-//                }
-//                """.trimIndent()) {
-//                important - button {
-//                    text("Increment the counter")
-//                    onClick { counter.value++ }
-//                }
-//            }
-//
-//            text("That's the simplest way to start.")
-//            space()
-//
-//            h2("Readable: the root of all KiteUI reactivity")
-//            text("A Property implements the Readable interface, which is the root of all the reactive tools in KiteUI.")
-//            text("If you have any kind of Readable, you may 'call' it with () within a reactive scope to both get the value and rerun when it changes.")
-//            text("However, there are other kinds of readables too.  The most commonly used one is shared:")
-//            val otherCounter = Property(0)
-//            val combinedCounters = shared { counter() + otherCounter() }
-//            code { content = """
-//                val otherCounter = Property(0)
-//                val combinedCounters = shared { counter() + otherCounter() }
-//            """.trimIndent()}
-//            text("Now, we can access this calculation like this:")
-//            example("""
-//                col {
-//                    important - button {
-//                        text { reactive { content = "Increment the other counter, which is at ${'$'}{otherCounter()}" } }
-//                        onClick { otherCounter.value++ }
-//                    }
-//                    text {
-//                        reactive { content = "${'$'}{counter()} + ${'$'}{otherCounter()} = ${'$'}{combinedCounters()}" }
-//                    }
-//                }
-//                """.trimIndent()) {
-//                col {
-//                    important - button {
-//                        text { reactive { content = "Increment the other counter, which is at ${otherCounter()}" } }
-//                        onClick { otherCounter.value++ }
-//                    }
-//                    text {
-//                        reactive { content = "${counter()} + ${otherCounter()} = ${combinedCounters()}" }
-//                    }
-//                }
-//            }
-//            text("Notice that you can increment either of the two counters now")
+            text("Notice that you can increment either of the two counters now.")
+            space()
+
+            h2("Writable")
+            h3("bind")
+            text("To Do")
+            h3("withWrite")
+            text("To Do")
         }
     }
 

diff --git a/example-app/src/jsMain/resources/index.html b/example-app/src/jsMain/resources/index.html
@@ -4,6 +4,7 @@
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width,initial-scale=1">
     <title>JS Client</title>
+    <base href="/">
     <link rel="preconnect" href="https://fonts.googleapis.com">
     <link rel="stylesheet" href="/experimental.css" />
     <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>