Popover improvements, VP and RV fixes

lightningkite · Mar 19, 2024 · 631e70e · 631e70e
1 parent 41f3e91
commit 631e70e
Show file tree

Hide file tree

Showing 9 changed files with 218 additions and 146 deletions.
diff --git a/example-app/src/commonMain/kotlin/com/lightningkite/mppexampleapp/InfiniteImagesScreen.kt b/example-app/src/commonMain/kotlin/com/lightningkite/mppexampleapp/InfiniteImagesScreen.kt
@@ -48,14 +48,49 @@ object InfiniteImagesScreen : RockScreen {
         recyclerView {
             columns = 4
             children(Constant(ReturnIndexList)) {
-                stack {
+                button {
                     sizeConstraints(height = 16.rem) - image {
                         scaleType = ImageScaleType.Crop
-                        ::source { ImageRemote("https://picsum.photos/seed/${it.await()}/200/200") }
+                        ::source { ImageRemote("https://picsum.photos/seed/${it.await()}/100/100") }
 //                            source = Resources.imagesSolera
                     }
+                    onClick {
+                        navigator.dialog.navigate(ImageViewPager(it.await()))
+                    }
                 }
             }
         }
     }
+}
+
+class ImageViewPager(val initialIndex: Int) : RockScreen {
+    val currentPage = Property(initialIndex)
+
+    override fun ViewWriter.render() {
+        stack {
+            viewPager {
+                children(Constant(InfiniteImagesScreen.ReturnIndexList)) { currImage ->
+                    stack {
+                        spacing = 0.25.rem
+                        image {
+                            reactiveScope {
+                                val index = currImage.await()
+                                source = ImageRemote("https://picsum.photos/seed/${index}/100/100")
+                                delay(1)
+                                source = ImageRemote("https://picsum.photos/seed/${index}/1000/1000")
+                            }
+                            scaleType = ImageScaleType.Fit
+                        }
+                    }
+                }
+                index bind currentPage
+            }
+            gravity(Align.End, Align.Start) - button {
+                icon { source = Icon.close }
+                onClick {
+                    navigator.dismiss()
+                }
+            }
+        } in themeFromLast { it.copy(background = Color.black, foreground = Color.white) }
+    }
 }
diff --git a/example-app/src/commonMain/kotlin/com/lightningkite/mppexampleapp/RecyclerViewScreen.kt b/example-app/src/commonMain/kotlin/com/lightningkite/mppexampleapp/RecyclerViewScreen.kt
@@ -46,11 +46,6 @@ object RecyclerViewScreen : RockScreen {
                     }
                 }
             }
-            sizedBox(SizeConstraints(height = 5.rem)) - horizontalRecyclerView {
-                children(items) {
-                    important - stack { centered - text { ::content { it.await().toString() } } }
-                }
-            }
             recyclerView {
                 recyclerView = this
                 spacing = 0.5.rem

diff --git a/library/library.podspec b/library/library.podspec
@@ -39,7 +39,7 @@ Pod::Spec.new do |spec|
                 fi
                 set -ev
                 REPO_ROOT="$PODS_TARGET_SRCROOT"
-                "$REPO_ROOT/../gradlew" -p "$REPO_ROOT" $KOTLIN_PROJECT_PATH:syncFramework \
+                "$REPO_ROOT/../../picme-frontend/gradlew" -p "$REPO_ROOT" $KOTLIN_PROJECT_PATH:syncFramework \
                     -Pkotlin.native.cocoapods.platform=$PLATFORM_NAME \
                     -Pkotlin.native.cocoapods.archs="$ARCHS" \
                     -Pkotlin.native.cocoapods.configuration="$CONFIGURATION"

diff --git a/library/src/commonMain/kotlin/com/lightningkite/rock/views/ViewWriter.kt b/library/src/commonMain/kotlin/com/lightningkite/rock/views/ViewWriter.kt
@@ -79,6 +79,7 @@ class ViewWriter(
             }
         }
 
+    var rootTheme: suspend () -> Theme = { MaterialLikeTheme() }
     var lastTheme: suspend () -> Theme = { MaterialLikeTheme() }
     var currentTheme: suspend () -> Theme = { MaterialLikeTheme() }
     inline fun <T> withThemeGetter(crossinline calculate: suspend (suspend () -> Theme) -> Theme, action: () -> T): T {

diff --git a/library/src/commonMain/kotlin/com/lightningkite/rock/views/l2/AppNavV2.kt b/library/src/commonMain/kotlin/com/lightningkite/rock/views/l2/AppNavV2.kt
@@ -32,6 +32,7 @@ fun ViewWriter.navSideBar(navElements: suspend () -> List<NavElement>) {
 
 fun ViewWriter.appBase(routes: Routes, mainLayout: ContainingView.() -> Unit) {
     stack {
+        rootTheme = lastTheme
         val navigator = PlatformNavigator
         PlatformNavigator.routes = routes
         this@appBase.navigator = navigator

diff --git a/library/src/jsMain/kotlin/com/lightningkite/rock/views/DynamicCSS.kt b/library/src/jsMain/kotlin/com/lightningkite/rock/views/DynamicCSS.kt
@@ -775,7 +775,7 @@ object DynamicCSS {
                 "transition-duration" to "0.15s",
                 "transition-timing-function" to "linear",
                 "transition-delay" to "0s",
-                "transition-property" to "color, background-image, background-color, outline-color, box-shadow, border-radius, opacity",
+                "transition-property" to "color, background-image, background-color, outline-color, box-shadow, border-radius, opacity, backdrop-filter",
             )
         )
 

diff --git a/library/src/jsMain/kotlin/com/lightningkite/rock/views/direct/ImageView.js.kt b/library/src/jsMain/kotlin/com/lightningkite/rock/views/direct/ImageView.js.kt
@@ -73,7 +73,7 @@ fun ImageView.setSrc(url: String) {
         val children = (0..<native.children.length).mapNotNull { native.children[it] }
         val myIndex = children.indexOf(newElement)
         if(myIndex == -1) return@label Unit
-        if((clockMillis() - now).also { println("Image load for $url took $it ms") } < 32) {
+        if((clockMillis() - now) < 32) {
             // disable animations and get it done; no reason to show the user an animation
             newElement.withoutAnimation {
                 newElement.style.opacity = "1"