Setup default project

bumble-tech · Oct 13, 2023 · 799437c · 799437c
1 parent 541d8ca
commit 799437c
Show file tree

Hide file tree

Showing 7 changed files with 50 additions and 11 deletions.
diff --git a/shared/build.gradle.kts b/shared/build.gradle.kts
@@ -19,11 +19,11 @@ kotlin {
         }
     }
 
-//    js(IR) {
-//        // Adding moduleName as a workaround for this issue: https://youtrack.jetbrains.com/issue/KT-51942
-//        moduleName = "puzzyx-common"
-//        browser()
-//    }
+    js(IR) {
+        // Adding moduleName as a workaround for this issue: https://youtrack.jetbrains.com/issue/KT-51942
+        moduleName = "puzzyx-common"
+        browser()
+    }
 
     sourceSets {
         val commonMain by getting {
@@ -63,4 +63,5 @@ dependencies {
     add("kspCommonMainMetadata", libs.appyx.mutable.ui.processor)
     add("kspAndroid", libs.appyx.mutable.ui.processor)
     add("kspDesktop", libs.appyx.mutable.ui.processor)
+    add("kspJs", libs.appyx.mutable.ui.processor)
 }
diff --git a/...commonMain/kotlin/com/bumble/puzzyx/appyx/component/backstackclipper/ClipShapeProgress.kt b/...commonMain/kotlin/com/bumble/puzzyx/appyx/component/backstackclipper/ClipShapeProgress.kt
@@ -28,7 +28,8 @@ class ClipShapeProgress(
     coroutineScope: CoroutineScope,
     target: Target,
     displacement: StateFlow<Float> = MutableStateFlow(0f),
-    private val shape: @Composable (progress: Float) -> Shape = { RectangleShape },
+    // web-target doesn't like a lambda here for some reason
+    private val shape: @Composable ((progress: Float) -> Shape)? = null,
 ) : MotionProperty<Float, AnimationVector1D>(
     coroutineScope = coroutineScope,
     animatable = Animatable(target.value),
@@ -47,10 +48,9 @@ class ClipShapeProgress(
         get() = Modifier.composed {
             val progress = renderValueFlow.collectAsState().value
             if (progress == 0f) this
-            else this.clip(shape.invoke(progress))
+            else this.clip(shape?.invoke(progress) ?: RectangleShape)
         }
 
-
     override suspend fun lerpTo(start: Target, end: Target, fraction: Float) {
         snapTo(
             lerpFloat(

diff --git a/shared/src/commonMain/kotlin/com/bumble/puzzyx/ui/DottedMeshShape.kt b/shared/src/commonMain/kotlin/com/bumble/puzzyx/ui/DottedMeshShape.kt
@@ -12,8 +12,8 @@ import androidx.compose.ui.unit.LayoutDirection
 import com.bumble.appyx.interactions.core.annotations.FloatRange
 import com.bumble.appyx.interactions.core.ui.math.lerpFloat
 import com.bumble.puzzyx.math.mapValueRange
-import java.lang.Integer.max
 import kotlin.math.abs
+import kotlin.math.max
 import kotlin.math.sqrt
 
 /**

diff --git a/shared/src/jsMain/kotlin/com/bumble/puzzyx/imageloader/toImageBitmap.kt b/shared/src/jsMain/kotlin/com/bumble/puzzyx/imageloader/toImageBitmap.kt
@@ -0,0 +1,8 @@
+package com.bumble.puzzyx.imageloader
+
+import androidx.compose.ui.graphics.ImageBitmap
+import androidx.compose.ui.graphics.toComposeImageBitmap
+
+actual fun ByteArray.toImageBitmap(): ImageBitmap {
+    return org.jetbrains.skia.Image.makeFromEncoded(this).toComposeImageBitmap()
+}
diff --git a/webApp/build.gradle.kts b/webApp/build.gradle.kts
@@ -17,7 +17,7 @@ kotlin {
                 implementation(compose.runtime)
                 implementation(compose.foundation)
                 implementation(compose.material3)
-//                implementation(project(":shared"))
+                implementation(project(":shared"))
                 implementation(libs.appyx.navigation)
                 implementation(libs.appyx.components.backstack)
             }
@@ -39,7 +39,10 @@ tasks.register<Copy>("copyResources") {
     include("**/*")
 }
 
-tasks.named("jsMainClasses") {
+tasks.named("jsBrowserProductionExecutableDistributeResources") {
     dependsOn("copyResources")
 }
 
+tasks.named("compileKotlinJs") {
+    dependsOn("copyResources")
+}
diff --git a/webApp/src/jsMain/resources/index.html b/webApp/src/jsMain/resources/index.html
@@ -0,0 +1,15 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <title>Puzzyx</title>
+        <script src="skiko.js"></script>
+    <link type="text/css" rel="stylesheet" href="styles.css"/>
+</head>
+<body>
+<div>
+    <canvas id="ComposeTarget" width="512" height="512"></canvas>
+</div>
+<script src="webApp.js"></script>
+</body>
+</html>
diff --git a/webApp/src/jsMain/resources/styles.css b/webApp/src/jsMain/resources/styles.css
@@ -0,0 +1,12 @@
+#root {
+    width: 100%;
+    height: 100vh;
+}
+
+body {
+    margin: 0;
+}
+
+#root > .compose-web-column > div {
+    position: relative;
+}