From 52d0dc96084cb81636472bf7614edd5fda43ad89 Mon Sep 17 00:00:00 2001 From: Salomon BRYS Date: Thu, 4 Jul 2024 10:58:55 +0200 Subject: [PATCH] Updated Demo --- .../{documentation.yml => pages.yml} | 24 +++++-- Demo/src/commonMain/kotlin/1_Navigation.kt | 6 ++ Demo/src/commonMain/kotlin/2_Steps.kt | 8 ++- Demo/src/commonMain/kotlin/3_Transitions.kt | 3 +- Demo/src/commonMain/kotlin/4_SourceCode.kt | 28 +++++++- Demo/src/commonMain/kotlin/5_Modes.kt | 64 +------------------ Demo/src/commonMain/kotlin/6_Decoration.kt | 9 ++- Demo/src/commonMain/kotlin/7_KodeinKoders.kt | 17 ++++- Demo/src/commonMain/kotlin/8_GetStarted.kt | 4 +- Demo/src/commonMain/kotlin/main.kt | 2 +- Demo/src/jvmMain/kotlin/5_Modes.desktop.kt | 54 ++++++++++++++++ Demo/src/wasmJsMain/kotlin/5_Modes.web.kt | 20 ++++++ antora-playbook.yml | 1 - docs/antora.yml | 4 +- 14 files changed, 157 insertions(+), 87 deletions(-) rename .github/workflows/{documentation.yml => pages.yml} (64%) create mode 100644 Demo/src/jvmMain/kotlin/5_Modes.desktop.kt create mode 100644 Demo/src/wasmJsMain/kotlin/5_Modes.web.kt diff --git a/.github/workflows/documentation.yml b/.github/workflows/pages.yml similarity index 64% rename from .github/workflows/documentation.yml rename to .github/workflows/pages.yml index 0cf217c..d3fbdd0 100644 --- a/.github/workflows/documentation.yml +++ b/.github/workflows/pages.yml @@ -3,9 +3,7 @@ name: Publish documentation to Github Pages on: push: branches: - - 'main' - paths: - - 'docs/**.adoc' + - 'release' # Allows you to run this workflow manually from the Actions tab workflow_dispatch: @@ -29,14 +27,28 @@ jobs: uses: actions/checkout@v4 - name: Configure Pages uses: actions/configure-pages@v3 - - name: Install Node.js + + - name: Setup Node.js uses: actions/setup-node@v4 with: - node-version: '18' + node-version: '22' - name: Install Antora run: npm install - - name: Generate Site + - name: Generate Documentation Site run: npx antora antora-playbook.yml + + - name: Set up JDK Temurin 17 + uses: actions/setup-java@v3 + with: + distribution: temurin + java-version: 17 + - name: Setup Gradle + uses: gradle/gradle-build-action@v2 + - name: Generate Demo web export + run: ./gradlew :Demo:wasmJsBrowserDistribution + - name: Copy Demo web export to site directory + run: cp -r Demo/build/dist/wasmJs/productionExecutable build/site/Demo + - name: Upload Artifacts uses: actions/upload-pages-artifact@v2 with: diff --git a/Demo/src/commonMain/kotlin/1_Navigation.kt b/Demo/src/commonMain/kotlin/1_Navigation.kt index 408e4d5..184efab 100644 --- a/Demo/src/commonMain/kotlin/1_Navigation.kt +++ b/Demo/src/commonMain/kotlin/1_Navigation.kt @@ -7,6 +7,7 @@ import androidx.compose.material.icons.automirrored.outlined.Backspace import androidx.compose.material.icons.outlined.ArrowUpward import androidx.compose.ui.Modifier import androidx.compose.ui.unit.dp +import androidx.compose.ui.unit.em import org.kodein.emoji.Emoji import org.kodein.emoji.smileys_emotion.face_smiling.Wink import net.kodein.cup.Slide @@ -26,4 +27,9 @@ val navigation by Slide { ) Spacer(Modifier.height(16.dp)) TextWithEmoji("Still, move forward to see the rest of the features ${Emoji.Wink}") + Spacer(Modifier.height(16.dp)) + Text( + text = "(By the way, your USB or bluetooth clicker should also work!)", + fontSize = 0.6.em + ) } diff --git a/Demo/src/commonMain/kotlin/2_Steps.kt b/Demo/src/commonMain/kotlin/2_Steps.kt index 939eee7..0af18b2 100644 --- a/Demo/src/commonMain/kotlin/2_Steps.kt +++ b/Demo/src/commonMain/kotlin/2_Steps.kt @@ -44,10 +44,12 @@ val steps by Slide( AnimatedVisibility( visible = step >= 4, enter = scaleIn(spring(Spring.DampingRatioHighBouncy, Spring.StiffnessMediumLow)) + expandVertically(clip = false), - modifier = Modifier ) { - Title { - TextWithAnimatedEmoji("Or attracting attention! ${Emoji.Collision}") + Title( + modifier = Modifier + .padding(top = 32.dp) + ) { + TextWithAnimatedEmoji("${Emoji.Collision} Or attracting attention! ${Emoji.Collision}") } } } diff --git a/Demo/src/commonMain/kotlin/3_Transitions.kt b/Demo/src/commonMain/kotlin/3_Transitions.kt index 201cfd2..7eb3739 100644 --- a/Demo/src/commonMain/kotlin/3_Transitions.kt +++ b/Demo/src/commonMain/kotlin/3_Transitions.kt @@ -2,7 +2,6 @@ import androidx.compose.animation.AnimatedVisibility import androidx.compose.foundation.layout.padding import androidx.compose.material.Text import androidx.compose.ui.Modifier -import androidx.compose.ui.platform.LocalLayoutDirection import androidx.compose.ui.unit.dp import net.kodein.cup.Slide import net.kodein.cup.SlideSpecs @@ -20,7 +19,7 @@ val transitions by Slide( ) ) { step -> Title(Modifier.padding(16.dp)) { - Text("There can also be complex slide transition animations !") + Text("There can also be complex slide transition transitions !") } AnimatedVisibility(step >= 1) { TextWithEmoji("Have you noticed the background change? 🤔") diff --git a/Demo/src/commonMain/kotlin/4_SourceCode.kt b/Demo/src/commonMain/kotlin/4_SourceCode.kt index fd1edf6..36cdd34 100644 --- a/Demo/src/commonMain/kotlin/4_SourceCode.kt +++ b/Demo/src/commonMain/kotlin/4_SourceCode.kt @@ -1,13 +1,23 @@ +import androidx.compose.animation.AnimatedVisibility import androidx.compose.foundation.background +import androidx.compose.foundation.layout.Row +import androidx.compose.foundation.layout.Spacer +import androidx.compose.foundation.layout.height import androidx.compose.foundation.layout.padding import androidx.compose.foundation.shape.RoundedCornerShape import androidx.compose.material.Text import androidx.compose.ui.Modifier import androidx.compose.ui.graphics.Color +import androidx.compose.ui.text.SpanStyle import androidx.compose.ui.text.TextStyle import androidx.compose.ui.unit.dp import net.kodein.cup.PreparedSlide -import net.kodein.cup.sa.* +import net.kodein.cup.sa.SAStyle +import net.kodein.cup.sa.SourceCode +import net.kodein.cup.sa.line +import net.kodein.cup.sa.rememberSourceCode +import net.kodein.cup.ui.SpanStyleSheet +import net.kodein.cup.ui.styled import utils.Title @@ -44,9 +54,18 @@ val sourceCode by PreparedSlide( } slideContent { step -> + val stylesheet = object : SpanStyleSheet() { + val pre by registerMarker(SpanStyle( + fontFamily = KodeinTheme.Fonts.JetBrainsMono, + color = KodeinTheme.Color.Orange + )) + } + Title { Text("You can animate source code!") } + Text(styled(stylesheet) { "(Here's an example of how I would introduce Kotlin's ${+pre}lazy${-pre} property delegate)" }) + Spacer(Modifier.height(8.dp)) SourceCode( sourceCode = sourceCode, step = step, @@ -56,5 +75,12 @@ val sourceCode by PreparedSlide( .background(Color.DarkGray, RoundedCornerShape(4.dp)) .padding(8.dp) ) + Spacer(Modifier.height(8.dp)) + Row { + AnimatedVisibility(step >= 1) { Text("You can reveal") } + AnimatedVisibility(step >= 2) { Text(", highlight") } + AnimatedVisibility(step >= 4) { Text(", remove, replace") } + AnimatedVisibility(step >= 5) { Text(" or decorate source code") } + } } } diff --git a/Demo/src/commonMain/kotlin/5_Modes.kt b/Demo/src/commonMain/kotlin/5_Modes.kt index a278ff8..03aaf3f 100644 --- a/Demo/src/commonMain/kotlin/5_Modes.kt +++ b/Demo/src/commonMain/kotlin/5_Modes.kt @@ -4,15 +4,13 @@ import androidx.compose.foundation.text.appendInlineContent import androidx.compose.material.Text import androidx.compose.material.icons.Icons import androidx.compose.material.icons.automirrored.rounded.List -import androidx.compose.material.icons.automirrored.rounded.SpeakerNotes import androidx.compose.material.icons.rounded.ZoomOut import androidx.compose.ui.Modifier import androidx.compose.ui.text.buildAnnotatedString import androidx.compose.ui.text.style.TextAlign import androidx.compose.ui.unit.dp -import androidx.compose.ui.unit.em -import net.kodein.cup.* -import net.kodein.cup.speaker.SpeakerNotes +import net.kodein.cup.Slide +import net.kodein.cup.SlideGroup import utils.InlineIcon import utils.Title @@ -46,60 +44,4 @@ val overview by Slide { ) } -val speakerWindow by Slide( - user = SpeakerNotes( - """ - This slides has some **speaker notes** that you can see here! - - - You can use markdown in speaker notes - - Or you can use regular compose if you prefer - - Isn't that cool! - """ - ) -) { - Title { - Text("Hit S to open the Speaker Window!") - } - Text( - text = buildAnnotatedString { - append("(Or click on the top left ") - appendInlineContent("icon") - append(" shown when moving your mouse.)") - }, - inlineContent = mapOf( - "icon" to InlineIcon(Icons.AutoMirrored.Rounded.SpeakerNotes, "icon") - ), - textAlign = TextAlign.Center, - ) - Spacer(Modifier.height(16.dp)) - Text( - text = "Only available on desktop (not web).", - fontSize = 0.6.em, - textAlign = TextAlign.Center, - ) -} - -val groups by Slide { - Title { - Text("You can group slides and apply specifics to all slides in the group") - } - Text( - text = "For example, the last 3 slides are grouped and given a vertical transitions between them!", - textAlign = TextAlign.Center, - ) -} - -val modes = Slides( - overview, - speakerWindow, - groups, - specs = { - it.insideTransitionSpecs( - startTransitions = TransitionSet.moveVertical, - endTransitions = TransitionSet.moveVertical - ) + SlideSpecs( - size = SLIDE_SIZE_16_9 - ) - } -) +expect val modes: SlideGroup diff --git a/Demo/src/commonMain/kotlin/6_Decoration.kt b/Demo/src/commonMain/kotlin/6_Decoration.kt index e9b3791..06fa180 100644 --- a/Demo/src/commonMain/kotlin/6_Decoration.kt +++ b/Demo/src/commonMain/kotlin/6_Decoration.kt @@ -15,14 +15,13 @@ import utils.Title val decoration by Slide( - stepCount = 2, - user = KodeinBanner(visible = true) + stepCount = 2 ) { step -> Title { - Text("You can decorate and theme your presentation") + Text("You can decorate and\ntheme your presentation") } Text( - text = "This presentation uses the KODEIN theme that we created for our own presentations!", + text = "This presentation uses the KODEIN theme that\nwe created for our own presentations!", textAlign = TextAlign.Center, ) Spacer(Modifier.height(32.dp)) @@ -31,7 +30,7 @@ val decoration by Slide( horizontalAlignment = Alignment.CenterHorizontally, modifier = Modifier.fillMaxWidth() ) { - TextWithEmoji("For example the ${Emoji.DownArrow} orange bar is not standard and part of our theming.") + TextWithEmoji("For example the ${Emoji.DownArrow} light purple bar is not standard and part of our theming.") Spacer(Modifier.height(16.dp)) NotoAnimatedEmoji(Emoji.StarStruck, Modifier.size(64.dp)) } diff --git a/Demo/src/commonMain/kotlin/7_KodeinKoders.kt b/Demo/src/commonMain/kotlin/7_KodeinKoders.kt index 7204a27..06ac720 100644 --- a/Demo/src/commonMain/kotlin/7_KodeinKoders.kt +++ b/Demo/src/commonMain/kotlin/7_KodeinKoders.kt @@ -1,3 +1,4 @@ +import androidx.compose.animation.core.* import androidx.compose.foundation.Image import androidx.compose.foundation.clickable import androidx.compose.foundation.layout.Column @@ -5,8 +6,10 @@ import androidx.compose.foundation.layout.Row import androidx.compose.foundation.layout.height import androidx.compose.foundation.layout.padding import androidx.compose.material.Text +import androidx.compose.runtime.getValue import androidx.compose.ui.Alignment import androidx.compose.ui.Modifier +import androidx.compose.ui.draw.scale import androidx.compose.ui.graphics.ColorFilter import androidx.compose.ui.input.pointer.PointerIcon import androidx.compose.ui.input.pointer.pointerHoverIcon @@ -26,9 +29,14 @@ import org.jetbrains.compose.resources.painterResource val kodeinKoders by Slide( - specs = SlideSpecs(size = SLIDE_SIZE_16_9), - user = KodeinBanner(visible = true) + specs = SlideSpecs(size = SLIDE_SIZE_16_9) ) { + val scale by rememberInfiniteTransition().animateFloat( + initialValue = 0.95f, + targetValue = 1.05f, + animationSpec = infiniteRepeatable(tween(2_500), RepeatMode.Reverse) + ) + Text( text = "CuP is brought to you by:", modifier = Modifier.padding(bottom = 16.dp) @@ -38,6 +46,7 @@ val kodeinKoders by Slide( Row( verticalAlignment = Alignment.CenterVertically, modifier = Modifier + .scale(scale) .pointerHoverIcon(PointerIcon.Hand) .clickable { uriHandler.openUri("https://kodein.net") @@ -47,7 +56,9 @@ val kodeinKoders by Slide( painter = painterResource(Res.drawable.logo), contentDescription = null, colorFilter = ColorFilter.tint(KodeinTheme.Color.Orange), - modifier = Modifier.height(112.dp).padding(end = 12.dp) + modifier = Modifier + .height(112.dp) + .padding(end = 12.dp) ) Column { Text( diff --git a/Demo/src/commonMain/kotlin/8_GetStarted.kt b/Demo/src/commonMain/kotlin/8_GetStarted.kt index 8b2c51b..e6ede81 100644 --- a/Demo/src/commonMain/kotlin/8_GetStarted.kt +++ b/Demo/src/commonMain/kotlin/8_GetStarted.kt @@ -15,13 +15,13 @@ val getStarted by Slide { } val uriHandler = LocalUriHandler.current Text( - text = "https://github.com/kosi-libs/CuP", + text = "https://github.com/KodeinKoders/CuP", textAlign = TextAlign.Center, color = KodeinTheme.Color.Link, modifier = Modifier .pointerHoverIcon(PointerIcon.Hand) .clickable { - uriHandler.openUri("https://github.com/kosi-libs/CuP") + uriHandler.openUri("https://github.com/KodeinKoders/CuP") } ) } diff --git a/Demo/src/commonMain/kotlin/main.kt b/Demo/src/commonMain/kotlin/main.kt index bcc5813..8a26316 100644 --- a/Demo/src/commonMain/kotlin/main.kt +++ b/Demo/src/commonMain/kotlin/main.kt @@ -103,7 +103,7 @@ fun KodeinPresentation( .align(Alignment.TopEnd) ) { Text( - text = "Amazing!", + text = "Desktop only!", fontSize = 20.sp, color = Color.Black, ) diff --git a/Demo/src/jvmMain/kotlin/5_Modes.desktop.kt b/Demo/src/jvmMain/kotlin/5_Modes.desktop.kt new file mode 100644 index 0000000..9d75d75 --- /dev/null +++ b/Demo/src/jvmMain/kotlin/5_Modes.desktop.kt @@ -0,0 +1,54 @@ +import androidx.compose.foundation.text.appendInlineContent +import androidx.compose.material.Text +import androidx.compose.material.icons.Icons +import androidx.compose.material.icons.automirrored.rounded.SpeakerNotes +import androidx.compose.ui.text.buildAnnotatedString +import androidx.compose.ui.text.style.TextAlign +import net.kodein.cup.* +import net.kodein.cup.speaker.SpeakerNotes +import net.kodein.cup.utils.dataMapOf +import utils.InlineIcon +import utils.Title + + +val speakerWindow by Slide( + user = dataMapOf( + SpeakerNotes( + """ + This slides has some **speaker notes** that you can see here! + + Speaker notes are written in _Markdown_. + Isn't that cool! + """ + ), + KodeinBanner(visible = true) + ) +) { + Title { + Text("Hit S to open the Speaker Window!") + } + Text( + text = buildAnnotatedString { + append("(Or click on the top left ") + appendInlineContent("icon") + append(" shown when moving your mouse.)") + }, + inlineContent = mapOf( + "icon" to InlineIcon(Icons.AutoMirrored.Rounded.SpeakerNotes, "icon") + ), + textAlign = TextAlign.Center, + ) +} + +actual val modes: SlideGroup = Slides( + overview, + speakerWindow, + specs = { + it.insideTransitionSpecs( + startTransitions = TransitionSet.moveVertical, + endTransitions = TransitionSet.moveVertical + ) + SlideSpecs( + size = SLIDE_SIZE_16_9 + ) + } +) diff --git a/Demo/src/wasmJsMain/kotlin/5_Modes.web.kt b/Demo/src/wasmJsMain/kotlin/5_Modes.web.kt new file mode 100644 index 0000000..ecffa44 --- /dev/null +++ b/Demo/src/wasmJsMain/kotlin/5_Modes.web.kt @@ -0,0 +1,20 @@ +import androidx.compose.material.Text +import net.kodein.cup.Slide +import net.kodein.cup.SlideGroup +import net.kodein.cup.Slides +import utils.Title + + +val speakerWindow by Slide( + user = KodeinBanner(visible = true) +) { + Title { + Text("Desktop offers a Speaker Window") + } + Text("(Not available on Web exports.)") +} + +actual val modes: SlideGroup = Slides( + overview, + speakerWindow +) diff --git a/antora-playbook.yml b/antora-playbook.yml index 74f0f47..59f0bdb 100644 --- a/antora-playbook.yml +++ b/antora-playbook.yml @@ -6,7 +6,6 @@ site: content: sources: - url: ./ - worktree: true start_path: docs asciidoc: extensions: diff --git a/docs/antora.yml b/docs/antora.yml index 892b799..f5512f8 100644 --- a/docs/antora.yml +++ b/docs/antora.yml @@ -1,7 +1,7 @@ name: CuP title: Compose ur Pres version: '1.0' -display_version: '1.0.0-Beta-07' +display_version: '1.0.0-Beta-08' nav: - modules/ROOT/nav.adoc - modules/core/nav.adoc @@ -10,7 +10,7 @@ nav: asciidoc: attributes: branch: 'main' - version: '1.0.0-Beta-07' + version: '1.0.0-Beta-08' kotlin: '2.0.0' compose: '1.6.10' jdk: '1.8' \ No newline at end of file