From 9aeac4d224d126866fec2f35a5b875f691beabf0 Mon Sep 17 00:00:00 2001 From: HugoGranstrom <5092565+HugoGranstrom@users.noreply.github.com> Date: Tue, 13 Sep 2022 20:18:37 +0200 Subject: [PATCH 01/31] add useScrollWheel to readme --- README.md | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/README.md b/README.md index 271903f..1b30634 100644 --- a/README.md +++ b/README.md @@ -27,6 +27,7 @@ lots of flexibility so you can tailor it to your liking. - [Typewriter](#typewriter) - [Speaker View](#speaker-view) - [Local Reveal.js installation](#use-local-revealjs-installation) + - [Misc. Config](#misc-configuration) - [Roadmap](#roadmap-๐Ÿ—บ) # API @@ -255,6 +256,9 @@ Then in your presentation `.nim` file add this line: nb.useLocalReveal("revealjsfolder") ``` +## Misc. Configuration +- `useScrollWheel()`, this enables stepping forward in the presentation using the scroll-wheel. + # Roadmap ๐Ÿ—บ - [X] Make available `fragments` (https://revealjs.com/fragments/) - [x] Make it work with default options From 0cad8d84f85404e465fc30b34ef219d7be39c908 Mon Sep 17 00:00:00 2001 From: HugoGranstrom <5092565+HugoGranstrom@users.noreply.github.com> Date: Tue, 13 Sep 2022 20:19:38 +0200 Subject: [PATCH 02/31] implement experimental fragmentThen --- src/nimiSlides.nim | 33 +++++++++++++++++++++++++++------ 1 file changed, 27 insertions(+), 6 deletions(-) diff --git a/src/nimiSlides.nim b/src/nimiSlides.nim index 2a051d2..633dca2 100644 --- a/src/nimiSlides.nim +++ b/src/nimiSlides.nim @@ -184,13 +184,14 @@ template slide*(body: untyped) = slide(autoAnimate=false): body -template fragmentStartBlock(fragments: seq[Table[string, string]], animations: openArray[seq[FragmentAnimation]], endAnimations: openArray[seq[FragmentAnimation]]) = +template fragmentStartBlock(fragments: seq[Table[string, string]], animations: openArray[seq[FragmentAnimation]], endAnimations: openArray[seq[FragmentAnimation]], indexOffset: int) = newNbSlimBlock("fragmentStart"): for level in animations: var frag: Table[string, string] frag["classStr"] = join(level, " ") # eg. fade-in highlight-blue - frag["fragIndex"] = $currentFragment - currentFragment += 1 + frag["fragIndex"] = $(currentFragment + indexOffset) + if indexOffset == 0: + currentFragment += 1 fragments.add frag template fragmentEndBlock(fragments: seq[Table[string, string]], animations: openArray[seq[FragmentAnimation]], endAnimations: openArray[seq[FragmentAnimation]], startBlock: NbBlock) = @@ -206,7 +207,7 @@ template fragmentEndBlock(fragments: seq[Table[string, string]], animations: ope assert nb.blk != startBlock startBlock.context["fragments"] = fragments # set for start block -template fragmentCore*(animations: openArray[seq[FragmentAnimation]], endAnimations: openArray[seq[FragmentAnimation]], body: untyped) = +template fragmentCore*(animations: openArray[seq[FragmentAnimation]], endAnimations: openArray[seq[FragmentAnimation]], indexOffset: untyped, body: untyped) = ## Creates a fragment of the content of body. Nesting works. ## animations: each seq in animations are animations that are to be applied at the same time. The first seq's animations ## are applied on the first button click, and the second seq's animations on the second click etc. @@ -218,11 +219,14 @@ template fragmentCore*(animations: openArray[seq[FragmentAnimation]], endAnimati ## `fragment(@[@[fadeIn]], @[@[fadeOut]]): block` will first fadeIn the entire block and perform eventual animations in nested fragments. Once ## all of those are finished, it will run fadeOut on the entire block and its subfragments. var fragments: seq[Table[string, string]] - fragmentStartBlock(fragments, animations, endAnimations) + fragmentStartBlock(fragments, animations, endAnimations, indexOffset) var startBlock = nb.blk # this *should* be the block created by fragmentStartBlock body fragmentEndBlock(fragments, animations, endAnimations, startBlock) +template fragmentCore*(animations: openArray[seq[FragmentAnimation]], endAnimations: openArray[seq[FragmentAnimation]], body: untyped) = + fragmentCore(animations, endAnimations, 0, body) + template fragment*(animations: varargs[seq[FragmentAnimation]] = @[@[fadeIn]], body: untyped): untyped = ## Creates a fragment of the content of body. Nesting works. ## animations: each seq of the varargs are animations that are to be applied at the same time. The first seq's animations @@ -263,6 +267,15 @@ template fragmentEnd*(endAnimation: FragmentAnimation, body: untyped) = fragmentCore(newSeq[seq[FragmentAnimation]](), @[@[endAnimation]]): body +template fragmentThen*(an1, an2: seq[FragmentAnimation], body: untyped) = + fragmentCore(@[an2], newSeq[seq[FragmentAnimation]](), 1): # trigger these on the next animation, but don't increment the counter. + fragmentCore(@[an1], newSeq[seq[FragmentAnimation]]()): + body + +template fragmentThen*(an1, an2: FragmentAnimation, body: untyped) = + fragmentThen(@[an1], @[an2]): + body + template fragmentList*(list: seq[string], animation: varargs[seq[FragmentAnimation]]) = for s in list: fragment(animation): @@ -333,7 +346,8 @@ template typewriter*(textMessage: string, typeSpeed = 50, alignment = "center") inc i timeout = setTimeout(typewriterLocal, speed) karaxHtml: - p(id = id, style=style(textAlign, align.kstring)) + p(id = id, style=style(textAlign, align.kstring)): + text localText.cstring window.addEventListener("load", proc (event: Event) = echo "Loading ", fragIndex @@ -373,3 +387,10 @@ template speakerNote*(text: string) = $1 """ % [text] + +template align*(text: string, body: untyped) = + nbRawOutput: """ +
+""" % text + body + nbRawOutput: "
" From 6f50420d1cb3e954f09baae5d0bc9157546f5c4a Mon Sep 17 00:00:00 2001 From: HugoGranstrom <5092565+HugoGranstrom@users.noreply.github.com> Date: Tue, 13 Sep 2022 20:19:53 +0200 Subject: [PATCH 03/31] use fragmentThen in showcase --- docs/fragments.nim | 3 +++ 1 file changed, 3 insertions(+) diff --git a/docs/fragments.nim b/docs/fragments.nim index ad77dc5..af30792 100644 --- a/docs/fragments.nim +++ b/docs/fragments.nim @@ -52,6 +52,9 @@ slide: slide: let codeAnimations = [@[fadeIn], @[grows], @[shrinks, semiFadeOut]] # you can save animations for easy reuse nbText: "### Let's make some animations to showcase code blocks one after another:" + fragmentThen(fadeIn, semiFadeOut): + nbCode: + let bla = "This will fadeIn and then semiFadeOut at the same time as the next block appears" fragment(codeAnimations): nbCode: let s = """This code block will fadeIn, From 973e193e9f36bac243a8df3c808f280eafdba42a Mon Sep 17 00:00:00 2001 From: HugoGranstrom <5092565+HugoGranstrom@users.noreply.github.com> Date: Tue, 13 Sep 2022 20:20:10 +0200 Subject: [PATCH 04/31] add onReval template --- src/nimiSlides/revealFFI.nim | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/src/nimiSlides/revealFFI.nim b/src/nimiSlides/revealFFI.nim index 1f711dc..f43638a 100644 --- a/src/nimiSlides/revealFFI.nim +++ b/src/nimiSlides/revealFFI.nim @@ -25,3 +25,7 @@ when defined(js): raise newException(ValueError, "Element doesn't have a data-fragment-index field") proc on*(reveal: RevealType, event: cstring, listener: proc (event: RevealEvent)) {.importjs: "#.on(#, #)".} + template onReveal*(revealEvent: cstring, listener: proc (event: RevealEvent)) = + window.addEventListener("load", proc (event: Event) = + Reveal.on(revealEvent, listener) + ) From f10ef46154366724fcb89e2360de50636ed64cc8 Mon Sep 17 00:00:00 2001 From: HugoGranstrom <5092565+HugoGranstrom@users.noreply.github.com> Date: Tue, 13 Sep 2022 20:49:59 +0200 Subject: [PATCH 05/31] implement fragmentNext --- src/nimiSlides.nim | 24 ++++++++++++++++++------ 1 file changed, 18 insertions(+), 6 deletions(-) diff --git a/src/nimiSlides.nim b/src/nimiSlides.nim index 633dca2..e4d2fe8 100644 --- a/src/nimiSlides.nim +++ b/src/nimiSlides.nim @@ -184,13 +184,13 @@ template slide*(body: untyped) = slide(autoAnimate=false): body -template fragmentStartBlock(fragments: seq[Table[string, string]], animations: openArray[seq[FragmentAnimation]], endAnimations: openArray[seq[FragmentAnimation]], indexOffset: int) = +template fragmentStartBlock(fragments: seq[Table[string, string]], animations: openArray[seq[FragmentAnimation]], endAnimations: openArray[seq[FragmentAnimation]], indexOffset: int, incrementCounter: bool) = newNbSlimBlock("fragmentStart"): for level in animations: var frag: Table[string, string] frag["classStr"] = join(level, " ") # eg. fade-in highlight-blue frag["fragIndex"] = $(currentFragment + indexOffset) - if indexOffset == 0: + if incrementCounter: currentFragment += 1 fragments.add frag @@ -207,7 +207,7 @@ template fragmentEndBlock(fragments: seq[Table[string, string]], animations: ope assert nb.blk != startBlock startBlock.context["fragments"] = fragments # set for start block -template fragmentCore*(animations: openArray[seq[FragmentAnimation]], endAnimations: openArray[seq[FragmentAnimation]], indexOffset: untyped, body: untyped) = +template fragmentCore*(animations: openArray[seq[FragmentAnimation]], endAnimations: openArray[seq[FragmentAnimation]], indexOffset: untyped, incrementCounter: untyped, body: untyped) = ## Creates a fragment of the content of body. Nesting works. ## animations: each seq in animations are animations that are to be applied at the same time. The first seq's animations ## are applied on the first button click, and the second seq's animations on the second click etc. @@ -219,13 +219,13 @@ template fragmentCore*(animations: openArray[seq[FragmentAnimation]], endAnimati ## `fragment(@[@[fadeIn]], @[@[fadeOut]]): block` will first fadeIn the entire block and perform eventual animations in nested fragments. Once ## all of those are finished, it will run fadeOut on the entire block and its subfragments. var fragments: seq[Table[string, string]] - fragmentStartBlock(fragments, animations, endAnimations, indexOffset) + fragmentStartBlock(fragments, animations, endAnimations, indexOffset, incrementCounter) var startBlock = nb.blk # this *should* be the block created by fragmentStartBlock body fragmentEndBlock(fragments, animations, endAnimations, startBlock) template fragmentCore*(animations: openArray[seq[FragmentAnimation]], endAnimations: openArray[seq[FragmentAnimation]], body: untyped) = - fragmentCore(animations, endAnimations, 0, body) + fragmentCore(animations, endAnimations, 0, true, body) template fragment*(animations: varargs[seq[FragmentAnimation]] = @[@[fadeIn]], body: untyped): untyped = ## Creates a fragment of the content of body. Nesting works. @@ -268,7 +268,7 @@ template fragmentEnd*(endAnimation: FragmentAnimation, body: untyped) = body template fragmentThen*(an1, an2: seq[FragmentAnimation], body: untyped) = - fragmentCore(@[an2], newSeq[seq[FragmentAnimation]](), 1): # trigger these on the next animation, but don't increment the counter. + fragmentCore(@[an2], newSeq[seq[FragmentAnimation]](), 1, false): # trigger these on the next animation, but don't increment the counter. fragmentCore(@[an1], newSeq[seq[FragmentAnimation]]()): body @@ -276,6 +276,18 @@ template fragmentThen*(an1, an2: FragmentAnimation, body: untyped) = fragmentThen(@[an1], @[an2]): body +template fragmentNext*(an: FragmentAnimation, body: untyped) = + fragmentCore(@[@[an]], newSeq[seq[FragmentAnimation]](), 0, false): + body + +template fragmentNext*(an: seq[FragmentAnimation], body: untyped) = + fragmentCore(@[an], newSeq[seq[FragmentAnimation]](), 0, false): + body + +template fadeInNext*(body: untyped) = + fragmentNext(fadeIn): + body + template fragmentList*(list: seq[string], animation: varargs[seq[FragmentAnimation]]) = for s in list: fragment(animation): From 20780441036de4cb32f089f4f72533c3a441477e Mon Sep 17 00:00:00 2001 From: HugoGranstrom <5092565+HugoGranstrom@users.noreply.github.com> Date: Wed, 14 Sep 2022 12:39:18 +0200 Subject: [PATCH 06/31] nbRawOutput -> nbRawHtml --- src/nimiSlides.nim | 12 ++++++------ 1 file changed, 6 insertions(+), 6 deletions(-) diff --git a/src/nimiSlides.nim b/src/nimiSlides.nim index e4d2fe8..1f41410 100644 --- a/src/nimiSlides.nim +++ b/src/nimiSlides.nim @@ -164,9 +164,9 @@ var currentFragment: int template slide*(autoAnimate: untyped, body: untyped): untyped = if autoAnimate: - nbRawOutput: "
" + nbRawHtml: "
" else: - nbRawOutput: "
" + nbRawHtml: "
" when declaredInScope(CountVarNimiSlide): when CountVarNimiSlide < 2: static: inc CountVarNimiSlide @@ -178,7 +178,7 @@ template slide*(autoAnimate: untyped, body: untyped): untyped = var CountVarNimiSlide {.inject, compileTime.} = 1 # we just entered the first level body static: dec CountVarNimiSlide - nbRawOutput: "
" + nbRawHtml: "
" template slide*(body: untyped) = slide(autoAnimate=false): @@ -394,15 +394,15 @@ template bigText*(text: string) = nb.blk.output = text template speakerNote*(text: string) = - nbRawOutput: """ + nbRawHtml: """ """ % [text] template align*(text: string, body: untyped) = - nbRawOutput: """ + nbRawHtml: """
""" % text body - nbRawOutput: "
" + nbRawHtml: "" From 0125cc4dd8326e1d2b44891047245954348685dd Mon Sep 17 00:00:00 2001 From: HugoGranstrom <5092565+HugoGranstrom@users.noreply.github.com> Date: Wed, 14 Sep 2022 12:41:06 +0200 Subject: [PATCH 07/31] update nimble file --- nimiSlides.nimble | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/nimiSlides.nimble b/nimiSlides.nimble index 56620a0..ebf3865 100644 --- a/nimiSlides.nimble +++ b/nimiSlides.nimble @@ -1,6 +1,6 @@ # Package -version = "0.1" +version = "0.2" author = "Hugo Granstrรถm" description = "Reveal.js theme for nimib" license = "MIT" @@ -9,7 +9,7 @@ srcDir = "src" # Dependencies requires "nim >= 1.4.0" -requires "nimib >= 0.3.0" +requires "nimib >= 0.3.1" requires "toml_serialization >= 0.2.0" import os From cdeff361db02066dae8a563cfccbd579481bf1dd Mon Sep 17 00:00:00 2001 From: HugoGranstrom <5092565+HugoGranstrom@users.noreply.github.com> Date: Thu, 22 Sep 2022 19:39:03 +0200 Subject: [PATCH 08/31] implement slideOptions --- src/nimiSlides.nim | 79 ++++++++++++++++++++++++++++++++++++++++++---- 1 file changed, 73 insertions(+), 6 deletions(-) diff --git a/src/nimiSlides.nim b/src/nimiSlides.nim index 1f41410..1e09e10 100644 --- a/src/nimiSlides.nim +++ b/src/nimiSlides.nim @@ -31,6 +31,21 @@ type NimiSlidesConfig* = object localReveal*: string + SlideOptions* = object + autoAnimate*: bool + colorBackground*: string + imageBackground*: string + videoBackground*: string + iframeBackground*: string + iframeInteractive*: bool + +proc slideOptions*(autoAnimate, iframeInteractive = false, colorBackground, gradientBackground, imageBackground, videoBackground, iframeBackground: string = ""): SlideOptions = + SlideOptions( + autoAnimate: autoAnimate, iframeInteractive: iframeInteractive, colorBackground: colorBackground, + imageBackground: imageBackground, videoBackground: videoBackground, + iframeBackground: iframeBackground + ) + const document = """ @@ -162,11 +177,22 @@ proc revealTheme*(doc: var NbDoc) = var currentFragment: int -template slide*(autoAnimate: untyped, body: untyped): untyped = - if autoAnimate: - nbRawHtml: "
" - else: - nbRawHtml: "
" +template slide*(options: untyped, body: untyped): untyped = + var attributes: string + if options.autoAnimate: + attributes.add "data-auto-animate " + if options.colorBackground.len > 0: + attributes.add """data-background-color="$1" """ % [options.colorBackground] + elif options.imageBackground.len > 0: + attributes.add """data-background-image="$1" """ % [options.imageBackground] + elif options.videoBackground.len > 0: + attributes.add """data-background-video="$1" """ % [options.videoBackground] + elif options.iframeBackground.len > 0: + attributes.add """data-background-iframe="$1" """ % [options.iframeBackground] + if options.iframeInteractive: + attributes.add "data-background-interactive " + + nbRawHtml: "
" % [attributes] when declaredInScope(CountVarNimiSlide): when CountVarNimiSlide < 2: static: inc CountVarNimiSlide @@ -181,7 +207,7 @@ template slide*(autoAnimate: untyped, body: untyped): untyped = nbRawHtml: "
" template slide*(body: untyped) = - slide(autoAnimate=false): + slide(slideOptions()): body template fragmentStartBlock(fragments: seq[Table[string, string]], animations: openArray[seq[FragmentAnimation]], endAnimations: openArray[seq[FragmentAnimation]], indexOffset: int, incrementCounter: bool) = @@ -295,6 +321,47 @@ template fragmentList*(list: seq[string], animation: varargs[seq[FragmentAnimati template fragmentList*(list: seq[string], animation: FragmentAnimation) = fragmentList(list, @[@[animation]]) + +template orderedList*(p: string, body: untyped) = + fragmentFadeIn: + nbRawHtml: "
  • " + nbText: p + nbRawHtml: "
      " + body + nbRawHtml: "
  • " + +template orderedList*(body: untyped) = + orderedList("", body) + +template unorderedList*(p: string, body: untyped) = + fragmentFadeIn: + nbRawHtml: "
  • " + nbText: p + nbRawHtml: "
      " + body + nbRawHtml: "
  • " + +template unorderedList*(body: untyped) = + unorderedList("", body) + +template listItem*(animation: seq[FragmentAnimation], body: untyped) = + var classString: string + for an in animation: + classString &= $an & " " + nbRawHtml: """
  • """ % [classString, $currentFragment] + currentFragment += 1 + body + nbRawHtml: "
  • " +template listItem*(animation: FragmentAnimation, body: untyped) = + listItem(@[animation], body) + +template listItem*(body: untyped) = + listItem(fadeIn, body) + +template fragmentList*(body: untyped) = + nbRawHtml: """
      """ + body + nbRawHtml: "
    " proc toHSlice*(h: HSlice[int, int]): HSlice[int, int] = h From 630d230a3588b20ef22a8e1ce8e8eacb8d892001 Mon Sep 17 00:00:00 2001 From: HugoGranstrom <5092565+HugoGranstrom@users.noreply.github.com> Date: Thu, 22 Sep 2022 20:12:19 +0200 Subject: [PATCH 09/31] add slide options to README --- README.md | 42 +++++++++++++++++++++++++++++++++++++----- src/nimiSlides.nim | 2 +- 2 files changed, 38 insertions(+), 6 deletions(-) diff --git a/README.md b/README.md index 1b30634..4eb97fc 100644 --- a/README.md +++ b/README.md @@ -23,7 +23,9 @@ lots of flexibility so you can tailor it to your liking. - [Big Text](#big-text) - [Hiding code output](#hiding-code-output) - [Themes](#themes) - - [Auto-animation](#automatic-animation) + - [Slide Options](#slide-options) + - [Auto-animation](#automatic-animation) + - [Backgrounds](#backgrounds) - [Typewriter](#typewriter) - [Speaker View](#speaker-view) - [Local Reveal.js installation](#use-local-revealjs-installation) @@ -201,21 +203,51 @@ setSlidesTheme(White) Available themes are: `Black`, `Beige`, `Blood`, `League`, `Moon`, `Night`, `Serif`, `Simple`, `Sky`, `Solarized`, `White`. The same site as above can be view with `White` theme here: https://hugogranstrom.com/nimiSlides/index_white.html -## Automatic animation +## Slide options +There are some settings that has to be assigned to a slide to work, like a background image. Below are the available settings. + +### Automatic animation Reveal.js has support for [auto-animation](https://revealjs.com/auto-animate/) which when possible, smoothly animates the transition between slides. Here is an example where the second list element will be smoothly added after the first one: ```nim slide: - slide(autoAnimate=true): + slide(slideOptions(autoAnimate=true)): nbText: """ - One element """ - slide(autoAnimate=true): + slide(slideOptions(autoAnimate=true)): nbText: """ - One element -- Two elements +- Two elements """ ``` +### Backgrounds +There are multiple [background types](https://revealjs.com/backgrounds/) available: +- A single color: +```nim +slide: + slide(slideOptions(colorBackground="#f1b434")): + nbText: "Yellow background" +``` +- Image background: +```nim +slide: + slide(slideOptions(imageBackground="path/to/image/or/url")): + discard +``` +- Video background: +```nim +slide: + slide(slideOptions(videoBackground="path/to/video/or/url")): + discard +``` +- Iframe background: +```nim +slide: + slide(slideOptions(iframeBackground="url/to/website", iframeInteractive=true)): + discard +``` + ## Typewriter Do you want the effect of someone writing your text letter by letter? Then `typewriter` is what you are looking for! ```nim diff --git a/src/nimiSlides.nim b/src/nimiSlides.nim index 1e09e10..b812907 100644 --- a/src/nimiSlides.nim +++ b/src/nimiSlides.nim @@ -39,7 +39,7 @@ type iframeBackground*: string iframeInteractive*: bool -proc slideOptions*(autoAnimate, iframeInteractive = false, colorBackground, gradientBackground, imageBackground, videoBackground, iframeBackground: string = ""): SlideOptions = +proc slideOptions*(autoAnimate, iframeInteractive = false, colorBackground, imageBackground, videoBackground, iframeBackground: string = ""): SlideOptions = SlideOptions( autoAnimate: autoAnimate, iframeInteractive: iframeInteractive, colorBackground: colorBackground, imageBackground: imageBackground, videoBackground: videoBackground, From 091743083536270db860963344428c78be3789a5 Mon Sep 17 00:00:00 2001 From: HugoGranstrom <5092565+HugoGranstrom@users.noreply.github.com> Date: Thu, 22 Sep 2022 20:40:46 +0200 Subject: [PATCH 10/31] add changelog.md --- changelog.md | 16 ++++++++++++++++ 1 file changed, 16 insertions(+) create mode 100644 changelog.md diff --git a/changelog.md b/changelog.md new file mode 100644 index 0000000..e57c4b7 --- /dev/null +++ b/changelog.md @@ -0,0 +1,16 @@ +# Changelog + +## v0.2 +- Update to use nimib v0.3.1. +- `slide` now accepts a `SlideOptions` created through `slideOptions` proc instead of a bool. It has the following fields: + - `autoAnimate` - same as previously, it tries to automatically animate the transition of slides. + - `colorBackground` - set the background color of the slide. + - `imageBackground` - set the background to an image. + - `videoBackground` - set the background to a video file (not Youtube, use iframe for it) + - `iframeBackground` - set the background to an iframe of a website (fullscreen). + - `iframeInteractive` - make the iframe interactive. +- Add `showSlideNumber` template to enable showing the current slide number. +- Add `useScrollWheel` template to enable stepping through the slides with the scroll wheel. +- Experimental features - the API for these are not yet stable and might change in the future: + - `fragmentThen` - Allows the construction of fragments like `growThenShrink` by `fragmentThen(grows, shrinks)`. The second animations happens at the same time as the next animation, reducing the number of clicks needed. + - `align` template to simply align its content like this: `align("left"):` \ No newline at end of file From 2e397bb9e8a3e19d7ba01543c782bb1ee70a6bcd Mon Sep 17 00:00:00 2001 From: HugoGranstrom <5092565+HugoGranstrom@users.noreply.github.com> Date: Thu, 22 Sep 2022 20:49:03 +0200 Subject: [PATCH 11/31] update showcase --- docs/showcase.html | 433 +++++++++++++++++++++++---------------------- docs/showcase.nim | 18 +- 2 files changed, 239 insertions(+), 212 deletions(-) diff --git a/docs/showcase.html b/docs/showcase.html index 02e3bc9..f13943f 100644 --- a/docs/showcase.html +++ b/docs/showcase.html @@ -9,15 +9,15 @@
    -
    +

    Welcome to nimiSlides! ๐Ÿ›ท

    These slides will show you what this nimib theme is capable of.

    -
    -
    +
    +

    You can have text, but also code:

    let a = 2
     let b = 3
    @@ -25,7 +25,7 @@ 

    Welcome to echo "First this!" echo "But not this!" @@ -36,7 +36,7 @@

    Welcome to This is another note @@ -3053,17 +3053,18 @@

    Typewriter Effect

    return result_469762075[0]; } -var rootid_452985903_469762057 = to_469762050(parseJson_603985094(makeNimstrLit("\"karax-1\""))); -var id_452985904_469762063 = to_469762050(parseJson_603985094(makeNimstrLit("\"typewriter0\""))); -var localtext_452985905_469762069 = to_469762050(parseJson_603985094(makeNimstrLit("\"This text will be typed one letter at a time with the speed and alignement specified.\""))); -var fragindex_452985906_469762100 = to_469762070(parseJson_603985094(makeNimstrLit("0"))); -var speed_452985907_469762106 = to_469762070(parseJson_603985094(makeNimstrLit("30"))); -var align_452985908_469762112 = to_469762050(parseJson_603985094(makeNimstrLit("\"left\""))); +var rootid_452985781_469762057 = to_469762050(parseJson_603985094(makeNimstrLit("\"karax-1\""))); +var id_452985782_469762063 = to_469762050(parseJson_603985094(makeNimstrLit("\"typewriter0\""))); +var localtext_452985783_469762069 = to_469762050(parseJson_603985094(makeNimstrLit("\"This text will be typed one letter at a time with the speed and alignement specified.\""))); +var fragindex_452985784_469762100 = to_469762070(parseJson_603985094(makeNimstrLit("0"))); +var speed_452985785_469762106 = to_469762070(parseJson_603985094(makeNimstrLit("30"))); +var align_452985786_469762112 = to_469762050(parseJson_603985094(makeNimstrLit("\"left\""))); var gid_1174405727 = [0]; var vcomponents_1207959565 = [{}]; var kxi__nimib_kxi_3 = null; -var i_452985910_469762171 = [0]; -var timeout_452985911_469762172 = [null]; +var postrendercallback_452985787_469762168 = [null]; +var i_452985789_469762175 = [0]; +var timeout_452985790_469762176 = [null]; function newSeq_1140851702(len_1140851704) { var result_1140851705 = []; @@ -3230,15 +3231,15 @@

    Typewriter Effect

    var dest_1140850944 = n_1140850943.dom; Label1: do { var i_1140850952 = 0; - var colontmp__469762308 = 0; - colontmp__469762308 = (n_1140850943.events).length; - var i_469762309 = 0; + var colontmp__469762312 = 0; + colontmp__469762312 = (n_1140850943.events).length; + var i_469762313 = 0; Label2: do { Label3: while (true) { - if (!(i_469762309 < colontmp__469762308)) break Label3; - i_1140850952 = i_469762309; + if (!(i_469762313 < colontmp__469762312)) break Label3; + i_1140850952 = i_469762313; n_1140850943.events[i_1140850952]["Field2"] = wrapEvent_1140850842(dest_1140850944, n_1140850943, n_1140850943.events[i_1140850952]["Field0"], n_1140850943.events[i_1140850952]["Field1"]); - i_469762309 += 1; + i_469762313 += 1; } } while (false); } while (false); @@ -3250,15 +3251,15 @@

    Typewriter Effect

    n_1241514465.style = {}; Label1: do { var i_1241514479 = 0; - var colontmp__469762312 = 0; - colontmp__469762312 = (s_1241514466.length - 1); - var res_469762313 = 0; + var colontmp__469762316 = 0; + colontmp__469762316 = (s_1241514466.length - 1); + var res_469762317 = 0; Label2: do { Label3: while (true) { - if (!(res_469762313 <= colontmp__469762312)) break Label3; - i_1241514479 = res_469762313; + if (!(res_469762317 <= colontmp__469762316)) break Label3; + i_1241514479 = res_469762317; n_1241514465.style[s_1241514466[i_1241514479]] = s_1241514466[(i_1241514479 + 1)]; - res_469762313 += 2; + res_469762317 += 2; } } while (false); } while (false); @@ -3354,17 +3355,17 @@

    Typewriter Effect

    Label1: do { var k_1140851077 = null; Label2: do { - var i_469762293 = 0; - var colontmp__469762294 = 0; - colontmp__469762294 = (n_1140850971.kids).length; - var i_469762295 = 0; + var i_469762297 = 0; + var colontmp__469762298 = 0; + colontmp__469762298 = (n_1140850971.kids).length; + var i_469762299 = 0; Label3: do { Label4: while (true) { - if (!(i_469762295 < colontmp__469762294)) break Label4; - i_469762293 = i_469762295; - k_1140851077 = n_1140850971.kids[i_469762293]; + if (!(i_469762299 < colontmp__469762298)) break Label4; + i_469762297 = i_469762299; + k_1140851077 = n_1140850971.kids[i_469762297]; result_1140850974.appendChild(toDom_1140850970(k_1140851077, useAttachedNode_1140850972, kxi_1140850973)); - i_469762295 += 1; + i_469762299 += 1; } } while (false); } while (false); @@ -3387,21 +3388,21 @@

    Typewriter Effect

    var k_1140851078 = null; var v_1140851079 = null; Label6: do { - var i_469762303 = 0; - var colontmp__469762304 = 0; - colontmp__469762304 = ((n_1140850971.attrs).length - 2); - var res_469762305 = 0; + var i_469762307 = 0; + var colontmp__469762308 = 0; + colontmp__469762308 = ((n_1140850971.attrs).length - 2); + var res_469762309 = 0; Label7: do { Label8: while (true) { - if (!(res_469762305 <= colontmp__469762304)) break Label8; - i_469762303 = res_469762305; - k_1140851078 = n_1140850971.attrs[i_469762303]; - v_1140851079 = n_1140850971.attrs[(i_469762303 + 1)]; + if (!(res_469762309 <= colontmp__469762308)) break Label8; + i_469762307 = res_469762309; + k_1140851078 = n_1140850971.attrs[i_469762307]; + v_1140851079 = n_1140850971.attrs[(i_469762307 + 1)]; if (!((v_1140851079 == null))) { result_1140850974.setAttribute(k_1140851078, v_1140851079); } - res_469762305 += 2; + res_469762309 += 2; } } while (false); } while (false); @@ -3481,19 +3482,19 @@

    Typewriter Effect

    Label3: do { var i_1140851158 = 0; - var colontmp__469762316 = 0; - colontmp__469762316 = len_1174405816(n_1140851119); - var i_469762317 = 0; + var colontmp__469762320 = 0; + colontmp__469762320 = len_1174405816(n_1140851119); + var i_469762321 = 0; Label4: do { Label5: while (true) { - if (!(i_469762317 < colontmp__469762316)) break Label5; - i_1140851158 = i_469762317; + if (!(i_469762321 < colontmp__469762320)) break Label5; + i_1140851158 = i_469762321; if (!(same_1140851118(HEX5BHEX5D_1174405823(n_1140851119, i_1140851158), e_1140851120.childNodes[i_1140851158], (nesting_1140851121 + 1)))) { result_1140851122 = false; break BeforeRet; } - i_469762317 += 1; + i_469762321 += 1; } } while (false); } while (false); @@ -3555,19 +3556,19 @@

    Typewriter Effect

    Label1: do { var i_1241514276 = 0; - var colontmp__469762343 = 0; - colontmp__469762343 = a_1241514239.length; - var i_469762344 = 0; + var colontmp__469762347 = 0; + colontmp__469762347 = a_1241514239.length; + var i_469762348 = 0; Label2: do { Label3: while (true) { - if (!(i_469762344 < colontmp__469762343)) break Label3; - i_1241514276 = i_469762344; + if (!(i_469762348 < colontmp__469762347)) break Label3; + i_1241514276 = i_469762348; if (!((a_1241514239[i_1241514276] == b_1241514240[i_1241514276]))) { result_1241514241 = false; break BeforeRet; } - i_469762344 += 1; + i_469762348 += 1; } } while (false); } while (false); @@ -3587,19 +3588,19 @@

    Typewriter Effect

    result_1174405982 = true; Label1: do { var i_1174405996 = 0; - var colontmp__469762347 = 0; - colontmp__469762347 = (a_1174405980.attrs).length; - var i_469762348 = 0; + var colontmp__469762351 = 0; + colontmp__469762351 = (a_1174405980.attrs).length; + var i_469762352 = 0; Label2: do { Label3: while (true) { - if (!(i_469762348 < colontmp__469762347)) break Label3; - i_1174405996 = i_469762348; + if (!(i_469762352 < colontmp__469762351)) break Label3; + i_1174405996 = i_469762352; if (!((a_1174405980.attrs[i_1174405996] == b_1174405981.attrs[i_1174405996]))) { result_1174405982 = false; break BeforeRet; } - i_469762348 += 1; + i_469762352 += 1; } } while (false); } while (false); @@ -3655,19 +3656,19 @@

    Typewriter Effect

    Label1: do { var i_1140851193 = 0; - var colontmp__469762335 = 0; - colontmp__469762335 = len_1174405816(a_1140851173); - var i_469762336 = 0; + var colontmp__469762339 = 0; + colontmp__469762339 = len_1174405816(a_1140851173); + var i_469762340 = 0; Label2: do { Label3: while (true) { - if (!(i_469762336 < colontmp__469762335)) break Label3; - i_1140851193 = i_469762336; + if (!(i_469762340 < colontmp__469762339)) break Label3; + i_1140851193 = i_469762340; if ((eq_1140851172(HEX5BHEX5D_1174405823(a_1140851173, i_1140851193), HEX5BHEX5D_1174405823(b_1140851174, i_1140851193), recursive_1140851175) == 1)) { result_1140851176 = 1; break BeforeRet; } - i_469762336 += 1; + i_469762340 += 1; } } while (false); } while (false); @@ -3721,19 +3722,19 @@

    Typewriter Effect

    Label6: do { var i_1140851219 = 0; - var colontmp__469762339 = 0; - colontmp__469762339 = len_1174405816(a_1140851173); - var i_469762340 = 0; + var colontmp__469762343 = 0; + colontmp__469762343 = len_1174405816(a_1140851173); + var i_469762344 = 0; Label7: do { Label8: while (true) { - if (!(i_469762340 < colontmp__469762339)) break Label8; - i_1140851219 = i_469762340; + if (!(i_469762344 < colontmp__469762343)) break Label8; + i_1140851219 = i_469762344; if (!((eq_1140851172(HEX5BHEX5D_1174405823(a_1140851173, i_1140851219), HEX5BHEX5D_1174405823(b_1140851174, i_1140851219), true) == 3))) { result_1140851176 = 1; break BeforeRet; } - i_469762340 += 1; + i_469762344 += 1; } } while (false); } while (false); @@ -3776,18 +3777,18 @@

    Typewriter Effect

    var k_1140851269 = null; var __1140851270 = null; Label2: do { - var i_469762352 = 0; - var colontmp__469762353 = 0; - colontmp__469762353 = ((oldNode_1140851264.attrs).length - 2); - var res_469762354 = 0; + var i_469762356 = 0; + var colontmp__469762357 = 0; + colontmp__469762357 = ((oldNode_1140851264.attrs).length - 2); + var res_469762358 = 0; Label3: do { Label4: while (true) { - if (!(res_469762354 <= colontmp__469762353)) break Label4; - i_469762352 = res_469762354; - k_1140851269 = oldNode_1140851264.attrs[i_469762352]; - __1140851270 = oldNode_1140851264.attrs[(i_469762352 + 1)]; + if (!(res_469762358 <= colontmp__469762357)) break Label4; + i_469762356 = res_469762358; + k_1140851269 = oldNode_1140851264.attrs[i_469762356]; + __1140851270 = oldNode_1140851264.attrs[(i_469762356 + 1)]; oldNode_1140851264.dom.removeAttribute(k_1140851269); - res_469762354 += 2; + res_469762358 += 2; } } while (false); } while (false); @@ -3796,21 +3797,21 @@

    Typewriter Effect

    var k_1140851271 = null; var v_1140851272 = null; Label6: do { - var i_469762358 = 0; - var colontmp__469762359 = 0; - colontmp__469762359 = ((newNode_1140851263.attrs).length - 2); - var res_469762360 = 0; + var i_469762362 = 0; + var colontmp__469762363 = 0; + colontmp__469762363 = ((newNode_1140851263.attrs).length - 2); + var res_469762364 = 0; Label7: do { Label8: while (true) { - if (!(res_469762360 <= colontmp__469762359)) break Label8; - i_469762358 = res_469762360; - k_1140851271 = newNode_1140851263.attrs[i_469762358]; - v_1140851272 = newNode_1140851263.attrs[(i_469762358 + 1)]; + if (!(res_469762364 <= colontmp__469762363)) break Label8; + i_469762362 = res_469762364; + k_1140851271 = newNode_1140851263.attrs[i_469762362]; + v_1140851272 = newNode_1140851263.attrs[(i_469762362 + 1)]; if (!((v_1140851272 == null))) { oldNode_1140851264.dom.setAttribute(k_1140851271, v_1140851272); } - res_469762360 += 2; + res_469762364 += 2; } } while (false); } while (false); @@ -3828,19 +3829,19 @@

    Typewriter Effect

    BeforeRet: do { Label1: do { var i_1174405807 = 0; - var colontmp__469762363 = 0; - colontmp__469762363 = ((n_1174405796.attrs).length - 2); - var res_469762364 = 0; + var colontmp__469762367 = 0; + colontmp__469762367 = ((n_1174405796.attrs).length - 2); + var res_469762368 = 0; Label2: do { Label3: while (true) { - if (!(res_469762364 <= colontmp__469762363)) break Label3; - i_1174405807 = res_469762364; + if (!(res_469762368 <= colontmp__469762367)) break Label3; + i_1174405807 = res_469762368; if ((n_1174405796.attrs[i_1174405807] == key_1174405797)) { result_1174405798 = n_1174405796.attrs[(i_1174405807 + 1)]; break BeforeRet; } - res_469762364 += 2; + res_469762368 += 2; } } while (false); } while (false); @@ -3854,15 +3855,15 @@

    Typewriter Effect

    if (!((d_1140850807.karaxEvents == null))) { Label1: do { var i_1140850823 = 0; - var colontmp__469762367 = 0; - colontmp__469762367 = d_1140850807.karaxEvents.length; - var i_469762368 = 0; + var colontmp__469762371 = 0; + colontmp__469762371 = d_1140850807.karaxEvents.length; + var i_469762372 = 0; Label2: do { Label3: while (true) { - if (!(i_469762368 < colontmp__469762367)) break Label3; - i_1140850823 = i_469762368; + if (!(i_469762372 < colontmp__469762371)) break Label3; + i_1140850823 = i_469762372; d_1140850807.removeEventListener(d_1140850807.karaxEvents[i_1140850823]["Field0"], d_1140850807.karaxEvents[i_1140850823]["Field1"]); - i_469762368 += 1; + i_469762372 += 1; } } while (false); } while (false); @@ -3983,28 +3984,28 @@

    Typewriter Effect

    var pos_1140851476 = (nimMin(oldPos_1140851462, newPos_1140851463) + 1); Label8: do { var i_1140851481 = 0; - var colontmp__469762322 = 0; - colontmp__469762322 = (pos_1140851476 - 1); - var res_469762323 = commonPrefix_1140851453; + var colontmp__469762326 = 0; + colontmp__469762326 = (pos_1140851476 - 1); + var res_469762327 = commonPrefix_1140851453; Label9: do { Label10: while (true) { - if (!(res_469762323 <= colontmp__469762322)) break Label10; - i_1140851481 = res_469762323; + if (!(res_469762327 <= colontmp__469762326)) break Label10; + i_1140851481 = res_469762327; diff_1140851413(HEX5BHEX5D_1174405823(newNode_1140851414, i_1140851481), HEX5BHEX5D_1174405823(oldNode_1140851415, i_1140851481), current_1140851417, current_1140851417.childNodes[i_1140851481], kxi_1140851418); - res_469762323 += 1; + res_469762327 += 1; } } while (false); } while (false); if (((oldPos_1140851462 + 1) == oldLength_1140851444)) { Label11: do { var i_1140851486 = 0; - var res_469762326 = pos_1140851476; + var res_469762330 = pos_1140851476; Label12: do { Label13: while (true) { - if (!(res_469762326 <= newPos_1140851463)) break Label13; - i_1140851486 = res_469762326; + if (!(res_469762330 <= newPos_1140851463)) break Label13; + i_1140851486 = res_469762330; addPatch_1140851282(kxi_1140851418, 2, current_1140851417, null, HEX5BHEX5D_1174405823(newNode_1140851414, i_1140851486), null); - res_469762326 += 1; + res_469762330 += 1; } } while (false); } while (false); @@ -4013,13 +4014,13 @@

    Typewriter Effect

    var before_1140851487 = current_1140851417.childNodes[(oldPos_1140851462 + 1)]; Label14: do { var i_1140851492 = 0; - var res_469762329 = pos_1140851476; + var res_469762333 = pos_1140851476; Label15: do { Label16: while (true) { - if (!(res_469762329 <= newPos_1140851463)) break Label16; - i_1140851492 = res_469762329; + if (!(res_469762333 <= newPos_1140851463)) break Label16; + i_1140851492 = res_469762333; addPatch_1140851282(kxi_1140851418, 3, current_1140851417, before_1140851487, HEX5BHEX5D_1174405823(newNode_1140851414, i_1140851492), null); - res_469762329 += 1; + res_469762333 += 1; } } while (false); } while (false); @@ -4027,14 +4028,14 @@

    Typewriter Effect

    Label17: do { var i_1140851497 = 0; - var res_469762332 = pos_1140851476; + var res_469762336 = pos_1140851476; Label18: do { Label19: while (true) { - if (!(res_469762332 <= oldPos_1140851462)) break Label19; - i_1140851497 = res_469762332; + if (!(res_469762336 <= oldPos_1140851462)) break Label19; + i_1140851497 = res_469762336; addPatch_1140851282(kxi__nimib_kxi_3, 4, null, null, null, HEX5BHEX5D_1174405823(oldNode_1140851415, i_1140851497)); addPatch_1140851282(kxi_1140851418, 1, current_1140851417, current_1140851417.childNodes[i_1140851497], null, null); - res_469762332 += 1; + res_469762336 += 1; } } while (false); } while (false); @@ -4099,15 +4100,15 @@

    Typewriter Effect

    Label1: do { var i_1140851363 = 0; - var colontmp__469762378 = 0; - colontmp__469762378 = len_1174405816(dest_1140851348); - var i_469762379 = 0; + var colontmp__469762382 = 0; + colontmp__469762382 = len_1174405816(dest_1140851348); + var i_469762383 = 0; Label2: do { Label3: while (true) { - if (!(i_469762379 < colontmp__469762378)) break Label3; - i_1140851363 = i_469762379; + if (!(i_469762383 < colontmp__469762382)) break Label3; + i_1140851363 = i_469762383; moveDom_1140851347(HEX5BHEX5D_1174405823(dest_1140851348, i_1140851363), HEX5BHEX5D_1174405823(src_1140851349, i_1140851363)); - i_469762379 += 1; + i_469762383 += 1; } } while (false); } while (false); @@ -4124,11 +4125,11 @@

    Typewriter Effect

    function applyPatch_1140851364(kxi_1140851365) { Label1: do { var i_1140851370 = 0; - var i_469762372 = 0; + var i_469762376 = 0; Label2: do { Label3: while (true) { - if (!(i_469762372 < kxi_1140851365.patchLen)) break Label3; - i_1140851370 = i_469762372; + if (!(i_469762376 < kxi_1140851365.patchLen)) break Label3; + i_1140851370 = i_469762376; var p_1140851371 = nimCopy(null, kxi_1140851365.patches[i_1140851370], NTI1140850694); switch (p_1140851371.k) { case 0: @@ -4181,21 +4182,21 @@

    Typewriter Effect

    break; } - i_469762372 += 1; + i_469762376 += 1; } } while (false); } while (false); kxi_1140851365.patchLen = 0; Label4: do { var i_1140851402 = 0; - var i_469762375 = 0; + var i_469762379 = 0; Label5: do { Label6: while (true) { - if (!(i_469762375 < kxi_1140851365.patchLenV)) break Label6; - i_1140851402 = i_469762375; + if (!(i_469762379 < kxi_1140851365.patchLenV)) break Label6; + i_1140851402 = i_469762379; var p_1140851403 = nimCopy(null, kxi_1140851365.patchesV[i_1140851402], NTI1140850695); HEX5BHEX5DHEX3D_1174405827(p_1140851403.parent, p_1140851403.pos, p_1140851403.newChild); - i_469762375 += 1; + i_469762379 += 1; } } while (false); } while (false); @@ -4365,13 +4366,13 @@

    Typewriter Effect

    result_1174405897 = newVNode_1174405891(kind_1174405895); Label1: do { var k_1174405909 = null; - var i_469762383 = 0; + var i_469762387 = 0; Label2: do { Label3: while (true) { - if (!(i_469762383 < (kids_1174405896).length)) break Label3; - k_1174405909 = kids_1174405896[i_469762383]; + if (!(i_469762387 < (kids_1174405896).length)) break Label3; + k_1174405909 = kids_1174405896[i_469762387]; add_1174405831(result_1174405897, k_1174405909); - i_469762383 += 1; + i_469762387 += 1; } } while (false); } while (false); @@ -4396,18 +4397,18 @@

    Typewriter Effect

    s_1241514286.push(""); Label3: do { var j_1241514330 = 0; - var colontmp__469762387 = 0; - var colontmp__469762388 = 0; - colontmp__469762387 = (s_1241514286.length - 1); - colontmp__469762388 = (i_1241514289 + 3); - var res_469762390 = colontmp__469762387; + var colontmp__469762391 = 0; + var colontmp__469762392 = 0; + colontmp__469762391 = (s_1241514286.length - 1); + colontmp__469762392 = (i_1241514289 + 3); + var res_469762394 = colontmp__469762391; Label4: do { Label5: while (true) { - if (!(colontmp__469762388 <= res_469762390)) break Label5; - j_1241514330 = res_469762390; + if (!(colontmp__469762392 <= res_469762394)) break Label5; + j_1241514330 = res_469762394; s_1241514286[j_1241514330] = s_1241514286[(j_1241514330 - 2)]; s_1241514286[(j_1241514330 - 1)] = s_1241514286[(j_1241514330 - 3)]; - res_469762390 -= 2; + res_469762394 -= 2; } } while (false); } while (false); @@ -4451,18 +4452,18 @@

    Typewriter Effect

    } -function createdom_452985876_469762188() { - var result_469762189 = null; +function createdom_452985754_469762192() { + var result_469762193 = null; - var tmp_469762220 = tree_1174405894(44, []); - var tmp_469762221 = tree_1174405894(32, []); - tmp_469762221.id = toJSStr(id_452985904_469762063); - tmp_469762221.style = style_1241514444(160, toJSStr(align_452985908_469762112)); - add_1174405831(tmp_469762221, text_1174405949(toJSStr(localtext_452985905_469762069))); - add_1174405831(tmp_469762220, tmp_469762221); - result_469762189 = tmp_469762220; + var tmp_469762224 = tree_1174405894(44, []); + var tmp_469762225 = tree_1174405894(32, []); + tmp_469762225.id = toJSStr(id_452985782_469762063); + tmp_469762225.style = style_1241514444(160, toJSStr(align_452985786_469762112)); + add_1174405831(tmp_469762225, text_1174405949(toJSStr(localtext_452985783_469762069))); + add_1174405831(tmp_469762224, tmp_469762225); + result_469762193 = tmp_469762224; - return result_469762189; + return result_469762193; } @@ -4472,18 +4473,18 @@

    Typewriter Effect

    BeforeRet: do { Label1: do { var node_1308622884 = null; - var i_469762394 = 0; - var L_469762395 = (el_1308622863.attributes).length; + var i_469762398 = 0; + var L_469762399 = (el_1308622863.attributes).length; Label2: do { Label3: while (true) { - if (!(i_469762394 < L_469762395)) break Label3; - node_1308622884 = el_1308622863.attributes[i_469762394]; + if (!(i_469762398 < L_469762399)) break Label3; + node_1308622884 = el_1308622863.attributes[i_469762398]; if ((node_1308622884.nodeName == "data-line-numbers")) { result_1308622864 = true; break BeforeRet; } - i_469762394 += 1; + i_469762398 += 1; } } while (false); } while (false); @@ -4613,19 +4614,19 @@

    Typewriter Effect

    BeforeRet: do { Label1: do { var node_1308622909 = null; - var i_469762398 = 0; - var L_469762399 = (el_1308622904.attributes).length; + var i_469762402 = 0; + var L_469762403 = (el_1308622904.attributes).length; Label2: do { Label3: while (true) { - if (!(i_469762398 < L_469762399)) break Label3; - node_1308622909 = el_1308622904.attributes[i_469762398]; + if (!(i_469762402 < L_469762403)) break Label3; + node_1308622909 = el_1308622904.attributes[i_469762402]; if ((node_1308622909.nodeName == "data-fragment-index-nimib")) { var fragmentIndex_1308622910 = nsuParseInt(cstrToNimstr(node_1308622909.nodeValue)); result_1308622905 = fragmentIndex_1308622910; break BeforeRet; } - i_469762398 += 1; + i_469762402 += 1; } } while (false); } while (false); @@ -4636,41 +4637,41 @@

    Typewriter Effect

    } -function typewriterlocal_452985877_469762173() { +function typewriterlocal_452985755_469762177() { var Temporary1; - rawEcho(makeNimstrLit("Typing "), HEX24_318767107(fragindex_452985906_469762100)); - var el_452985912_469762174 = document.getElementById(toJSStr(id_452985904_469762063)); - if ((i_452985910_469762171[0] < (localtext_452985905_469762069).length)) { - if (null != (Temporary1 = toJSStr(nimCharToStr(localtext_452985905_469762069[i_452985910_469762171[0]])), Temporary1)) { if (null == el_452985912_469762174.innerHTML) el_452985912_469762174.innerHTML = Temporary1; else el_452985912_469762174.innerHTML += Temporary1; }; - i_452985910_469762171[0] += 1; - timeout_452985911_469762172[0] = setTimeout(typewriterlocal_452985877_469762173, speed_452985907_469762106); + rawEcho(makeNimstrLit("Typing "), HEX24_318767107(fragindex_452985784_469762100)); + var el_452985791_469762178 = document.getElementById(toJSStr(id_452985782_469762063)); + if ((i_452985789_469762175[0] < (localtext_452985783_469762069).length)) { + if (null != (Temporary1 = toJSStr(nimCharToStr(localtext_452985783_469762069[i_452985789_469762175[0]])), Temporary1)) { if (null == el_452985791_469762178.innerHTML) el_452985791_469762178.innerHTML = Temporary1; else el_452985791_469762178.innerHTML += Temporary1; }; + i_452985789_469762175[0] += 1; + timeout_452985790_469762176[0] = setTimeout(typewriterlocal_452985755_469762177, speed_452985785_469762106); } } -function lambda_452985882_469762236(event_452985913_469762237) { +function lambda_452985760_469762240(event_452985792_469762241) { -function lambda_452985883_469762238(event_452985913_469762239) { - if (!(isAnimatedCode_1308622862(event_452985913_469762239.fragment))) { - var index_452985914_469762240 = getFragmentIndex_1308622903(event_452985913_469762239.fragment); - if ((fragindex_452985906_469762100 == index_452985914_469762240)) { - var el_452985912_469762241 = document.getElementById(toJSStr(id_452985904_469762063)); - el_452985912_469762241.innerHTML = ""; - i_452985910_469762171[0] = 0; - rawEcho(makeNimstrLit("Starting "), HEX24_318767107(fragindex_452985906_469762100)); - typewriterlocal_452985877_469762173(); +function lambda_452985761_469762242(event_452985792_469762243) { + if (!(isAnimatedCode_1308622862(event_452985792_469762243.fragment))) { + var index_452985793_469762244 = getFragmentIndex_1308622903(event_452985792_469762243.fragment); + if ((fragindex_452985784_469762100 == index_452985793_469762244)) { + var el_452985791_469762245 = document.getElementById(toJSStr(id_452985782_469762063)); + el_452985791_469762245.innerHTML = ""; + i_452985789_469762175[0] = 0; + rawEcho(makeNimstrLit("Starting "), HEX24_318767107(fragindex_452985784_469762100)); + typewriterlocal_452985755_469762177(); } else { - var el_452985912_469762242 = document.getElementById(toJSStr(id_452985904_469762063)); - i_452985910_469762171[0] = (localtext_452985905_469762069).length; - if (!((timeout_452985911_469762172[0] == null))) { - clearTimeout(timeout_452985911_469762172[0]); + var el_452985791_469762246 = document.getElementById(toJSStr(id_452985782_469762063)); + i_452985789_469762175[0] = (localtext_452985783_469762069).length; + if (!((timeout_452985790_469762176[0] == null))) { + clearTimeout(timeout_452985790_469762176[0]); } - el_452985912_469762242.innerHTML = toJSStr(localtext_452985905_469762069); + el_452985791_469762246.innerHTML = toJSStr(localtext_452985783_469762069); } } @@ -4679,10 +4680,10 @@

    Typewriter Effect

    } -function lambda_452985884_469762246(event_452985913_469762247) { - if (!(isAnimatedCode_1308622862(event_452985913_469762247.fragment))) { - var index_452985914_469762248 = getFragmentIndex_1308622903(event_452985913_469762247.fragment); - if ((fragindex_452985906_469762100 == index_452985914_469762248)) { +function lambda_452985762_469762250(event_452985792_469762251) { + if (!(isAnimatedCode_1308622862(event_452985792_469762251.fragment))) { + var index_452985793_469762252 = getFragmentIndex_1308622903(event_452985792_469762251.fragment); + if ((fragindex_452985784_469762100 == index_452985793_469762252)) { } } @@ -4691,20 +4692,20 @@

    Typewriter Effect

    } - rawEcho(makeNimstrLit("Loading "), HEX24_318767107(fragindex_452985906_469762100)); - Reveal.on("fragmentshown", lambda_452985883_469762238); - Reveal.on("fragmenthidden", lambda_452985884_469762246); + rawEcho(makeNimstrLit("Loading "), HEX24_318767107(fragindex_452985784_469762100)); + Reveal.on("fragmentshown", lambda_452985761_469762242); + Reveal.on("fragmenthidden", lambda_452985762_469762250); } -setRenderer_1140851796(createdom_452985876_469762188, toJSStr(rootid_452985903_469762057), null); -window.addEventListener("load", lambda_452985882_469762236, false); +setRenderer_1140851796(createdom_452985754_469762192, toJSStr(rootid_452985781_469762057), postrendercallback_452985787_469762168[0]); +window.addEventListener("load", lambda_452985760_469762240, false);

    -
    -
    +
    +

    Fragments (animations)

    @@ -4746,7 +4747,7 @@

    Who doesn't like animations? โ–ถ

    -
    +

    You can do pretty complex animations:

    @@ -4773,7 +4774,7 @@

    You can do pretty complex animations:

    -
    +

    Using a for loop you can automate tedious repetition

    @@ -4801,20 +4802,20 @@

    Using a for loop you can automate tedious repetition

    -
    +

    Automatic animation

    • One element
    -
    +

    Automatic animation

    • One element
    • Two elements
    -
    +

    Automatic animation

    • One element
    • @@ -4822,7 +4823,7 @@

      Automatic animation

    • Three elements
    -
    +

    Fragment list

    @@ -4841,14 +4842,14 @@

    Fragment list

    -
    +

    Math โž•

    You can show off all your fancy equations โš› $$ e^{\pi i} = -1 $$ $$ \int_0^{\infty} \frac{1}{1 + e^x} dx$$

    -
    -
    +
    +

    Images ๐Ÿ–ผ๏ธ

    You can have the code generating an image in the slides and then load the image. This way it's always up to date!

    import numericalnim, ggplotnim, std/[sequtils, math]
    @@ -4865,7 +4866,7 @@ 

    Images ๐Ÿ–ผ๏ธ

    df = df.gather(["exact", "spline"], value="y", key="type")
    -
    +

    Now let's load the image we just created!

    ggplot(df, aes("x", "y", color="type")) +
       geom_line() +
    @@ -4880,6 +4881,20 @@ 

    Now let's load the image we just created!

    +
    +
    +

    You can have different backgrounds

    +
    +
    +

    Image background

    +
    +
    +

    Video background

    +
    +
    +

    Iframe background

    +
    +
    diff --git a/docs/showcase.nim b/docs/showcase.nim index 29e811b..bbd6983 100644 --- a/docs/showcase.nim +++ b/docs/showcase.nim @@ -73,18 +73,18 @@ slide: fragment(highlightCurrentBlue): nbText: text - slide(autoAnimate=true): + slide(slideOptions(autoAnimate=true)): nbText: "## Automatic animation" nbText: """ - One element """ - slide(autoAnimate=true): + slide(slideOptions(autoAnimate=true)): nbText: "## Automatic animation" nbText: """ - One element - Two elements """ - slide(autoAnimate=true): + slide(slideOptions(autoAnimate=true)): nbText: "## Automatic animation" nbText: """ - One element @@ -139,6 +139,18 @@ You can have the code generating an image in the slides and then load the image. fragment(fadeUp): nbImage("images/splineComp.png") +slide: + slide(slideOptions(colorBackground="#f1b434")): + nbText: "You can have different backgrounds" + + slide(slideOptions(imageBackground="https://images.freeimages.com/images/large-previews/3d0/london-1452422.jpg")): + nbText: "Image background" + + slide(slideOptions(videoBackground="https://user-images.githubusercontent.com/5092565/178597724-16287a00-5c31-4500-83d8-e07160a36369.mp4")): + nbText: "Video background" + + slide(slideOptions(iframeBackground="https://pietroppeter.github.io/nimib/", iframeInteractive=true)): + nbText: "Iframe background" From e3dab65401d16b5ca820ad6faaa4ab005bbf0ec0 Mon Sep 17 00:00:00 2001 From: HugoGranstrom <5092565+HugoGranstrom@users.noreply.github.com> Date: Thu, 22 Sep 2022 20:50:58 +0200 Subject: [PATCH 12/31] rebuild docs --- docs/fragments.html | 51 +++++++++++++++++++++++++------------------ docs/index.html | 26 +++++++++++----------- docs/index_white.html | 26 +++++++++++----------- 3 files changed, 56 insertions(+), 47 deletions(-) diff --git a/docs/fragments.html b/docs/fragments.html index 4682d48..98e4596 100644 --- a/docs/fragments.html +++ b/docs/fragments.html @@ -9,12 +9,12 @@
    -
    +

    Fragments

    This slideshow is a showcase of the fragments capabilities of nimiSlides. For the source code, look here.

    -
    -
    +
    +

    The basic animation is fadeIn:

    @@ -57,7 +57,7 @@

    The basic animation is fadeIn:

    -
    +

    Nesting of fragments

    @@ -76,7 +76,7 @@

    Nesting of fragments

    -
    +

    Ending animations

    @@ -100,11 +100,20 @@

    Ending animations

    -
    +

    Let's make some animations to showcase code blocks one after another:

    +
    +
    -
    -
    + +
    let bla = "This will fadeIn and then semiFadeOut at the same time as the next block appears"
    +
    + +
    + +
    +
    +
    let s = """This code block will fadeIn,
                   grows and then shrink and semiFadeOut!"""
    @@ -112,18 +121,18 @@

    Let's make some animations to showcase code blocks one after another:

    -
    -
    -
    +
    +
    +
    let t = "This code block will behave the same!"
    -
    -
    -
    +
    +
    +
    proc hello(world: string) =
       echo world
    @@ -134,34 +143,34 @@ 

    Let's make some animations to showcase code blocks one after another:

    -
    +

    Let's pass the green down the line!

    -
    +

    0

    -
    +

    1

    -
    +

    2

    -
    +

    3

    -
    +

    4

    -
    +

    5

    diff --git a/docs/index.html b/docs/index.html index a89130f..8596ae8 100644 --- a/docs/index.html +++ b/docs/index.html @@ -9,24 +9,24 @@
    -
    +

    Welcome to nimiSlides!

    These slides will show you what this theme is capable of โ›„

    -
    -
    +
    +

    Hello World Example

    echo "Hello World"
    Hello World
    -
    +

    Hello Down here

    -
    +

    A classic

    Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

    -
    +

    Fragments (animations)

    @@ -65,7 +65,7 @@

    Fragments (animations)

    -
    +

    Code example

    var this: int
     let is_a = 1
    @@ -74,8 +74,8 @@ 

    Code example

    code(this)
    block
    -
    -
    +
    +

    Generating and showing images

    import ggplotnim, random, sequtils
     randomize(42)
    @@ -86,7 +86,7 @@ 

    Generating and showing images

    "Type" : concat(newSeqWith(25, "background"), newSeqWith(25, "candidates")) })
    -
    +
    ggplot(df, aes("Energy", "Counts")) +
       geom_histogram() +
       theme_opaque() +
    @@ -97,17 +97,17 @@ 

    Generating and showing images

    -
    +

    Math

    You can typeset math as well (using nb.useLatex):

    $$ e^{\pi i} = -1 $$

    -
    +

    This is big!

    This is also big!

    This is normal text!

    -
    +

    And a final reveal: These slides were created just using Nim!

    diff --git a/docs/index_white.html b/docs/index_white.html index 92c4e25..b3beef4 100644 --- a/docs/index_white.html +++ b/docs/index_white.html @@ -9,24 +9,24 @@
    -
    +

    Welcome to nimiSlides!

    These slides will show you what this theme is capable of โ›„

    -
    -
    +
    +

    Hello World Example

    echo "Hello World"
    Hello World
    -
    +

    Hello Down here

    -
    +

    A classic

    Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

    -
    +

    Fragments (animations)

    @@ -65,7 +65,7 @@

    Fragments (animations)

    -
    +

    Code example

    var this: int
     let is_a = 1
    @@ -74,8 +74,8 @@ 

    Code example

    code(this)
    block
    -
    -
    +
    +

    Generating and showing images

    import ggplotnim, random, sequtils
     randomize(42)
    @@ -86,7 +86,7 @@ 

    Generating and showing images

    "Type" : concat(newSeqWith(25, "background"), newSeqWith(25, "candidates")) })
    -
    +
    ggplot(df, aes("Energy", "Counts")) +
       geom_histogram() +
       theme_opaque() +
    @@ -97,17 +97,17 @@ 

    Generating and showing images

    -
    +

    Math

    You can typeset math as well (using nb.useLatex):

    $$ e^{\pi i} = -1 $$

    -
    +

    This is big!

    This is also big!

    This is normal text!

    -
    +

    And a final reveal: These slides were created just using Nim!

    From f86dcc26338ee3f9ff8d46126e503dcbbfe4f737 Mon Sep 17 00:00:00 2001 From: HugoGranstrom <5092565+HugoGranstrom@users.noreply.github.com> Date: Fri, 23 Sep 2022 09:24:50 +0200 Subject: [PATCH 13/31] implement columns using CSS Grid --- src/nimiSlides.nim | 10 ++++++++++ 1 file changed, 10 insertions(+) diff --git a/src/nimiSlides.nim b/src/nimiSlides.nim index b812907..76938ec 100644 --- a/src/nimiSlides.nim +++ b/src/nimiSlides.nim @@ -473,3 +473,13 @@ template align*(text: string, body: untyped) = """ % text body nbRawHtml: "
    " + +template columns*(body: untyped) = + template column(bodyInner: untyped) = + nbRawHtml: "
    " + bodyInner + nbRawHtml: "
    " + + nbRawHtml: hlHtml"""
    """ + body + nbRawHtml: "
    " From cc5630a5bb97cf73afb4f3576fe84e2d169b9e26 Mon Sep 17 00:00:00 2001 From: HugoGranstrom <5092565+HugoGranstrom@users.noreply.github.com> Date: Fri, 23 Sep 2022 11:11:31 +0200 Subject: [PATCH 14/31] implement footer --- src/nimiSlides.nim | 8 +++++++- 1 file changed, 7 insertions(+), 1 deletion(-) diff --git a/src/nimiSlides.nim b/src/nimiSlides.nim index 76938ec..5563646 100644 --- a/src/nimiSlides.nim +++ b/src/nimiSlides.nim @@ -63,13 +63,16 @@ const head = """ """ -const main = """ +const main = hlHtml"""
    {{#blocks}} {{&.}} {{/blocks}}
    +
    {{> revealJS }}

    Welcome to nimiSlides! ๐Ÿ›ท

    These slides will show you what this nimib theme is capable of.

    @@ -3053,18 +3299,18 @@

    Typewriter Effect

    return result_469762075[0]; } -var rootid_452985781_469762057 = to_469762050(parseJson_603985094(makeNimstrLit("\"karax-1\""))); -var id_452985782_469762063 = to_469762050(parseJson_603985094(makeNimstrLit("\"typewriter0\""))); -var localtext_452985783_469762069 = to_469762050(parseJson_603985094(makeNimstrLit("\"This text will be typed one letter at a time with the speed and alignement specified.\""))); -var fragindex_452985784_469762100 = to_469762070(parseJson_603985094(makeNimstrLit("0"))); -var speed_452985785_469762106 = to_469762070(parseJson_603985094(makeNimstrLit("30"))); -var align_452985786_469762112 = to_469762050(parseJson_603985094(makeNimstrLit("\"left\""))); +var rootid_452985828_469762057 = to_469762050(parseJson_603985094(makeNimstrLit("\"karax-1\""))); +var id_452985829_469762063 = to_469762050(parseJson_603985094(makeNimstrLit("\"typewriter0\""))); +var localtext_452985830_469762069 = to_469762050(parseJson_603985094(makeNimstrLit("\"This text will be typed one letter at a time with the speed and alignement specified.\""))); +var fragindex_452985831_469762100 = to_469762070(parseJson_603985094(makeNimstrLit("0"))); +var speed_452985832_469762106 = to_469762070(parseJson_603985094(makeNimstrLit("30"))); +var align_452985833_469762112 = to_469762050(parseJson_603985094(makeNimstrLit("\"left\""))); var gid_1174405727 = [0]; var vcomponents_1207959565 = [{}]; -var kxi__nimib_kxi_3 = null; -var postrendercallback_452985787_469762168 = [null]; -var i_452985789_469762175 = [0]; -var timeout_452985790_469762176 = [null]; +var kxi__nimib_kxi_5 = null; +var postrendercallback_452985834_469762168 = [null]; +var i_452985836_469762175 = [0]; +var timeout_452985837_469762176 = [null]; function newSeq_1140851702(len_1140851704) { var result_1140851705 = []; @@ -3290,7 +3536,7 @@

    Typewriter Effect

    result_1140850974 = document.createTextNode(n_1140850971.text); n_1140850971.dom = result_1140850974; if (!((n_1140850971.id == null))) { - kxi__nimib_kxi_3.byId[n_1140850971.id] = n_1140850971; + kxi__nimib_kxi_5.byId[n_1140850971.id] = n_1140850971; } } @@ -3300,7 +3546,7 @@

    Typewriter Effect

    result_1140850974.innerHTML = n_1140850971.text; n_1140850971.dom = result_1140850974; if (!((n_1140850971.id == null))) { - kxi__nimib_kxi_3.byId[n_1140850971.id] = n_1140850971; + kxi__nimib_kxi_5.byId[n_1140850971.id] = n_1140850971; } break BeforeRet; @@ -3311,7 +3557,7 @@

    Typewriter Effect

    result_1140850974 = toDom_1140850970(x_1140851014, useAttachedNode_1140850972, kxi_1140850973); n_1140850971.dom = result_1140850974; if (!((n_1140850971.id == null))) { - kxi__nimib_kxi_3.byId[n_1140850971.id] = n_1140850971; + kxi__nimib_kxi_5.byId[n_1140850971.id] = n_1140850971; } break BeforeRet; @@ -3321,7 +3567,7 @@

    Typewriter Effect

    result_1140850974 = n_1140850971.dom; n_1140850971.dom = result_1140850974; if (!((n_1140850971.id == null))) { - kxi__nimib_kxi_3.byId[n_1140850971.id] = n_1140850971; + kxi__nimib_kxi_5.byId[n_1140850971.id] = n_1140850971; } break BeforeRet; @@ -3340,7 +3586,7 @@

    Typewriter Effect

    result_1140850974 = toDom_1140850970(x_1140851042.expanded, useAttachedNode_1140850972, kxi_1140850973); n_1140850971.dom = result_1140850974; if (!((n_1140850971.id == null))) { - kxi__nimib_kxi_3.byId[n_1140850971.id] = n_1140850971; + kxi__nimib_kxi_5.byId[n_1140850971.id] = n_1140850971; } break BeforeRet; @@ -3349,7 +3595,7 @@

    Typewriter Effect

    result_1140850974 = document.createElement(toTag_1174405469[n_1140850971.kind]); n_1140850971.dom = result_1140850974; if (!((n_1140850971.id == null))) { - kxi__nimib_kxi_3.byId[n_1140850971.id] = n_1140850971; + kxi__nimib_kxi_5.byId[n_1140850971.id] = n_1140850971; } Label1: do { @@ -3455,7 +3701,7 @@

    Typewriter Effect

    var result_1140851122 = false; BeforeRet: do { - if (kxi__nimib_kxi_3.orphans.hasOwnProperty(n_1140851119.id)) { + if (kxi__nimib_kxi_5.orphans.hasOwnProperty(n_1140851119.id)) { result_1140851122 = true; break BeforeRet; } @@ -4033,7 +4279,7 @@

    Typewriter Effect

    Label19: while (true) { if (!(res_469762336 <= oldPos_1140851462)) break Label19; i_1140851497 = res_469762336; - addPatch_1140851282(kxi__nimib_kxi_3, 4, null, null, null, HEX5BHEX5D_1174405823(oldNode_1140851415, i_1140851497)); + addPatch_1140851282(kxi__nimib_kxi_5, 4, null, null, null, HEX5BHEX5D_1174405823(oldNode_1140851415, i_1140851497)); addPatch_1140851282(kxi_1140851418, 1, current_1140851417, current_1140851417.childNodes[i_1140851497], null, null); res_469762336 += 1; } @@ -4041,7 +4287,7 @@

    Typewriter Effect

    } while (false); break; case 1: - addPatch_1140851282(kxi__nimib_kxi_3, 4, null, null, null, oldNode_1140851415); + addPatch_1140851282(kxi__nimib_kxi_5, 4, null, null, null, oldNode_1140851415); addPatch_1140851282(kxi_1140851418, 0, parent_1140851416, current_1140851417, newNode_1140851414, null); break; case 4: @@ -4073,7 +4319,7 @@

    Typewriter Effect

    x_1140851519.expanded = x_1140851519.renderImpl(x_1140851519); x_1140851519.renderedVersion = x_1140851519.version; if ((oldExpanded_1140851527 == null)) { - addPatch_1140851282(kxi__nimib_kxi_3, 4, null, null, null, x_1140851519); + addPatch_1140851282(kxi__nimib_kxi_5, 4, null, null, null, x_1140851519); addPatch_1140851282(kxi_1140851513, 0, parent_1140851526, current_1140851525, x_1140851519.expanded, null); } else { @@ -4095,7 +4341,7 @@

    Typewriter Effect

    dest_1140851348.dom = src_1140851349.dom; src_1140851349.dom = null; if (!((dest_1140851348.id == null))) { - kxi__nimib_kxi_3.byId[dest_1140851348.id] = dest_1140851348; + kxi__nimib_kxi_5.byId[dest_1140851348.id] = dest_1140851348; } Label1: do { @@ -4267,12 +4513,12 @@

    Typewriter Effect

    function init_1140851671(ev_1140851672) { function HEX3Aanonymous_1140851673() { - dodraw_1140851608(kxi__nimib_kxi_3); + dodraw_1140851608(kxi__nimib_kxi_5); } - kxi__nimib_kxi_3.renderId = window.requestAnimationFrame(HEX3Aanonymous_1140851673); + kxi__nimib_kxi_5.renderId = window.requestAnimationFrame(HEX3Aanonymous_1140851673); } @@ -4296,7 +4542,7 @@

    Typewriter Effect

    function setRenderer_1140851684(renderer_1140851687, root_1140851688, clientPostRenderCallback_1140851691) { function HEX3Aanonymous_1140851750() { - redraw_1140851665(kxi__nimib_kxi_3); + redraw_1140851665(kxi__nimib_kxi_5); } @@ -4309,7 +4555,7 @@

    Typewriter Effect

    } result_1140851692 = {rootId: root_1140851688, renderer: renderer_1140851687, postRenderCallback: clientPostRenderCallback_1140851691, patches: newSeq_1140851702(60), patchesV: newSeq_1140851723(30), components: [], surpressRedraws: false, byId: {}, orphans: {}, currentTree: null, toFocus: null, toFocusV: null, renderId: 0, rendering: false, patchLen: 0, patchLenV: 0, runCount: 0}; - kxi__nimib_kxi_3 = result_1140851692; + kxi__nimib_kxi_5 = result_1140851692; window.addEventListener("load", init_1140851671, false); window.onhashchange = HEX3Aanonymous_1140851750; @@ -4452,14 +4698,14 @@

    Typewriter Effect

    } -function createdom_452985754_469762192() { +function createdom_452985823_469762192() { var result_469762193 = null; var tmp_469762224 = tree_1174405894(44, []); var tmp_469762225 = tree_1174405894(32, []); - tmp_469762225.id = toJSStr(id_452985782_469762063); - tmp_469762225.style = style_1241514444(160, toJSStr(align_452985786_469762112)); - add_1174405831(tmp_469762225, text_1174405949(toJSStr(localtext_452985783_469762069))); + tmp_469762225.id = toJSStr(id_452985829_469762063); + tmp_469762225.style = style_1241514444(160, toJSStr(align_452985833_469762112)); + add_1174405831(tmp_469762225, text_1174405949(toJSStr(localtext_452985830_469762069))); add_1174405831(tmp_469762224, tmp_469762225); result_469762193 = tmp_469762224; @@ -4637,41 +4883,41 @@

    Typewriter Effect

    } -function typewriterlocal_452985755_469762177() { +function typewriterlocal_452985824_469762177() { var Temporary1; - rawEcho(makeNimstrLit("Typing "), HEX24_318767107(fragindex_452985784_469762100)); - var el_452985791_469762178 = document.getElementById(toJSStr(id_452985782_469762063)); - if ((i_452985789_469762175[0] < (localtext_452985783_469762069).length)) { - if (null != (Temporary1 = toJSStr(nimCharToStr(localtext_452985783_469762069[i_452985789_469762175[0]])), Temporary1)) { if (null == el_452985791_469762178.innerHTML) el_452985791_469762178.innerHTML = Temporary1; else el_452985791_469762178.innerHTML += Temporary1; }; - i_452985789_469762175[0] += 1; - timeout_452985790_469762176[0] = setTimeout(typewriterlocal_452985755_469762177, speed_452985785_469762106); + rawEcho(makeNimstrLit("Typing "), HEX24_318767107(fragindex_452985831_469762100)); + var el_452985838_469762178 = document.getElementById(toJSStr(id_452985829_469762063)); + if ((i_452985836_469762175[0] < (localtext_452985830_469762069).length)) { + if (null != (Temporary1 = toJSStr(nimCharToStr(localtext_452985830_469762069[i_452985836_469762175[0]])), Temporary1)) { if (null == el_452985838_469762178.innerHTML) el_452985838_469762178.innerHTML = Temporary1; else el_452985838_469762178.innerHTML += Temporary1; }; + i_452985836_469762175[0] += 1; + timeout_452985837_469762176[0] = setTimeout(typewriterlocal_452985824_469762177, speed_452985832_469762106); } } -function lambda_452985760_469762240(event_452985792_469762241) { +function lambda_452985825_469762240(event_452985839_469762241) { -function lambda_452985761_469762242(event_452985792_469762243) { - if (!(isAnimatedCode_1308622862(event_452985792_469762243.fragment))) { - var index_452985793_469762244 = getFragmentIndex_1308622903(event_452985792_469762243.fragment); - if ((fragindex_452985784_469762100 == index_452985793_469762244)) { - var el_452985791_469762245 = document.getElementById(toJSStr(id_452985782_469762063)); - el_452985791_469762245.innerHTML = ""; - i_452985789_469762175[0] = 0; - rawEcho(makeNimstrLit("Starting "), HEX24_318767107(fragindex_452985784_469762100)); - typewriterlocal_452985755_469762177(); +function lambda_452985826_469762242(event_452985839_469762243) { + if (!(isAnimatedCode_1308622862(event_452985839_469762243.fragment))) { + var index_452985840_469762244 = getFragmentIndex_1308622903(event_452985839_469762243.fragment); + if ((fragindex_452985831_469762100 == index_452985840_469762244)) { + var el_452985838_469762245 = document.getElementById(toJSStr(id_452985829_469762063)); + el_452985838_469762245.innerHTML = ""; + i_452985836_469762175[0] = 0; + rawEcho(makeNimstrLit("Starting "), HEX24_318767107(fragindex_452985831_469762100)); + typewriterlocal_452985824_469762177(); } else { - var el_452985791_469762246 = document.getElementById(toJSStr(id_452985782_469762063)); - i_452985789_469762175[0] = (localtext_452985783_469762069).length; - if (!((timeout_452985790_469762176[0] == null))) { - clearTimeout(timeout_452985790_469762176[0]); + var el_452985838_469762246 = document.getElementById(toJSStr(id_452985829_469762063)); + i_452985836_469762175[0] = (localtext_452985830_469762069).length; + if (!((timeout_452985837_469762176[0] == null))) { + clearTimeout(timeout_452985837_469762176[0]); } - el_452985791_469762246.innerHTML = toJSStr(localtext_452985783_469762069); + el_452985838_469762246.innerHTML = toJSStr(localtext_452985830_469762069); } } @@ -4680,10 +4926,10 @@

    Typewriter Effect

    } -function lambda_452985762_469762250(event_452985792_469762251) { - if (!(isAnimatedCode_1308622862(event_452985792_469762251.fragment))) { - var index_452985793_469762252 = getFragmentIndex_1308622903(event_452985792_469762251.fragment); - if ((fragindex_452985784_469762100 == index_452985793_469762252)) { +function lambda_452985827_469762250(event_452985839_469762251) { + if (!(isAnimatedCode_1308622862(event_452985839_469762251.fragment))) { + var index_452985840_469762252 = getFragmentIndex_1308622903(event_452985839_469762251.fragment); + if ((fragindex_452985831_469762100 == index_452985840_469762252)) { } } @@ -4692,14 +4938,14 @@

    Typewriter Effect

    } - rawEcho(makeNimstrLit("Loading "), HEX24_318767107(fragindex_452985784_469762100)); - Reveal.on("fragmentshown", lambda_452985761_469762242); - Reveal.on("fragmenthidden", lambda_452985762_469762250); + rawEcho(makeNimstrLit("Loading "), HEX24_318767107(fragindex_452985831_469762100)); + Reveal.on("fragmentshown", lambda_452985826_469762242); + Reveal.on("fragmenthidden", lambda_452985827_469762250); } -setRenderer_1140851796(createdom_452985754_469762192, toJSStr(rootid_452985781_469762057), postrendercallback_452985787_469762168[0]); -window.addEventListener("load", lambda_452985760_469762240, false); +setRenderer_1140851796(createdom_452985823_469762192, toJSStr(rootid_452985828_469762057), postrendercallback_452985834_469762168[0]); +window.addEventListener("load", lambda_452985825_469762240, false);
    @@ -4896,6 +5142,9 @@

    Now let's load the image we just created!

    +
    diff --git a/docs/showcase.nim b/docs/showcase.nim index bbd6983..c938e8c 100644 --- a/docs/showcase.nim +++ b/docs/showcase.nim @@ -7,9 +7,10 @@ setSlidesTheme(Moon) useScrollWheel() showSlideNumber() +footer("You can have a footer. It's handy for [links](https://github.com/HugoGranstrom/nimiSlides)") slide: - bigText: "Welcome to [nimiSlides](https://github.com/HugoGranstrom/nimiSlides)! ๐Ÿ›ท" + bigText: "Welcome to [nimiSlides](https://github.com/HugoGranstrom/nimiSlides)! ๐Ÿ›ท" nbText: "These slides will show you what this [nimib](https://github.com/pietroppeter/nimib) theme is capable of." speakerNote "This is a note" From 4716c60745b0f734687d0bc358b6e269829b43b6 Mon Sep 17 00:00:00 2001 From: HugoGranstrom <5092565+HugoGranstrom@users.noreply.github.com> Date: Sat, 24 Sep 2022 12:10:11 +0200 Subject: [PATCH 20/31] make it compile on nimib v0.3.1 --- src/nimiSlides.nim | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/nimiSlides.nim b/src/nimiSlides.nim index 2e90e70..a40b7b1 100644 --- a/src/nimiSlides.nim +++ b/src/nimiSlides.nim @@ -64,7 +64,7 @@ const head = """ """ -const main = hlHtml""" +const main = """
    {{#blocks}} From 885c327093d868dbeadb6745d1f127a792bdcb94 Mon Sep 17 00:00:00 2001 From: HugoGranstrom <5092565+HugoGranstrom@users.noreply.github.com> Date: Sat, 24 Sep 2022 19:42:18 +0200 Subject: [PATCH 21/31] fix columns and add it to showcase --- docs/showcase.html | 27 +++++++++++++++++++++++++++ docs/showcase.nim | 18 ++++++++++++++++++ src/nimiSlides.nim | 13 +++++++------ 3 files changed, 52 insertions(+), 6 deletions(-) diff --git a/docs/showcase.html b/docs/showcase.html index 13af086..ed32b3a 100644 --- a/docs/showcase.html +++ b/docs/showcase.html @@ -5141,6 +5141,33 @@

    Now let's load the image we just created!

    Iframe background

    +
    +
    +

    2 Columns

    +
    +
    +

    Left

    +
    +
    +

    Right

    +
    +
    +
    +
    +

    3 Columns

    +
    +
    +

    Left

    +
    +
    +

    Middle

    +
    +
    +

    Right

    +
    +
    +
    +
    " template columns*(body: untyped) = - template column(bodyInner: untyped) = - nbRawHtml: "
    " - bodyInner - nbRawHtml: "
    " - - nbRawHtml: hlHtml"""
    """ + nbRawHtml: """
    """ body nbRawHtml: "
    " +template column*(bodyInner: untyped) = + ## column should always be used inside a `columns` block + nbRawHtml: "
    " + bodyInner + nbRawHtml: "
    " + template footer*(text: string, rawHtml = false) = if rawHtml: nb.context["revealFooter"] = text From 11b58ad2f67bcc552be29e36419bee9d27418d57 Mon Sep 17 00:00:00 2001 From: HugoGranstrom <5092565+HugoGranstrom@users.noreply.github.com> Date: Sat, 24 Sep 2022 20:36:54 +0200 Subject: [PATCH 22/31] footer now accepts fontSize and opacity so it doesn't stand out as much --- README.md | 2 +- changelog.md | 2 +- docs/showcase.html | 146 ++++++++++++++++++++++----------------------- src/nimiSlides.nim | 8 ++- 4 files changed, 81 insertions(+), 77 deletions(-) diff --git a/README.md b/README.md index 325786f..29dcd6d 100644 --- a/README.md +++ b/README.md @@ -291,7 +291,7 @@ nb.useLocalReveal("revealjsfolder") ## Misc. Configuration - `useScrollWheel()`, this enables stepping forward in the presentation using the scroll-wheel. - `showSlideNumber()`, this enables the current slide number being shown in the corner. -- `footer(text: string, rawHtml=false)`, this will create a footer at the bottom of every slide. By default the text is treated as markdown, but if `rawHtml=true` it will inline the text as raw HTML. +- `footer(text: string, fontSize=16, opacity=0.6, rawHtml=false)`, this will create a footer at the bottom of every slide. By default the text is treated as markdown, but if `rawHtml=true` it will inline the text as raw HTML. # Roadmap ๐Ÿ—บ - [X] Make available `fragments` (https://revealjs.com/fragments/) diff --git a/changelog.md b/changelog.md index e95afec..34c7e8c 100644 --- a/changelog.md +++ b/changelog.md @@ -20,7 +20,7 @@ slide: column: nbText: "Right column" ``` -- `footer` template to a footer to every slide. The input is a string with markdown, unless the argument `rawHtml=true` in which case it is treated as raw HTML. +- `footer(text: string, fontSize=20, opacity=0.6, rawHtml=false)` template to a footer to every slide. The input is a string with markdown, unless the argument `rawHtml=true` in which case it is treated as raw HTML. - The footer will be shown on all slides except those with image-, video- or iframe-backgrounds. - Experimental features - the API for these are not yet stable and might change in the future: - `fragmentThen` - Allows the construction of fragments like `growThenShrink` by `fragmentThen(grows, shrinks)`. The second animations happens at the same time as the next animation, reducing the number of clicks needed. diff --git a/docs/showcase.html b/docs/showcase.html index ed32b3a..8ac83ea 100644 --- a/docs/showcase.html +++ b/docs/showcase.html @@ -162,21 +162,21 @@ function HEX3Aanonymous_469762055(eventHEX60gensym0_469762056) { -function lambda_452985023_469762059(event_452985044_469762060) { +function lambda_452985134_469762059(event_452985155_469762060) { BeforeRet: do { rawEcho(makeNimstrLit("slidechanged!")); - var currentslide_452985045_469762061 = event_452985044_469762060.currentSlide; - console.log(currentslide_452985045_469762061); + var currentslide_452985156_469762061 = event_452985155_469762060.currentSlide; + console.log(currentslide_452985156_469762061); Label1: do { - var node_452985046_469762065 = null; + var node_452985157_469762065 = null; var i_469762204 = 0; - var L_469762205 = (currentslide_452985045_469762061.attributes).length; + var L_469762205 = (currentslide_452985156_469762061.attributes).length; Label2: do { Label3: while (true) { if (!(i_469762204 < L_469762205)) break Label3; - node_452985046_469762065 = currentslide_452985045_469762061.attributes[i_469762204]; - if (contains_469762068(["data-background-video", "data-background-iframe", "data-background-image"], node_452985046_469762065.nodeName)) { - footer_452985043_469762058.style.setProperty("visibility", "hidden", []); + node_452985157_469762065 = currentslide_452985156_469762061.attributes[i_469762204]; + if (contains_469762068(["data-background-video", "data-background-iframe", "data-background-image"], node_452985157_469762065.nodeName)) { + footer_452985154_469762058.style.setProperty("visibility", "hidden", []); break BeforeRet; } @@ -184,7 +184,7 @@ } } while (false); } while (false); - footer_452985043_469762058.style.setProperty("visibility", "visible", []); + footer_452985154_469762058.style.setProperty("visibility", "visible", []); } while (false); @@ -194,21 +194,21 @@ function HEX3Aanonymous_469762125(eventHEX60gensym0_469762126) { -function lambda_452985023_469762129(event_452985044_469762130) { +function lambda_452985134_469762129(event_452985155_469762130) { BeforeRet: do { rawEcho(makeNimstrLit("slidechanged!")); - var currentslide_452985045_469762131 = event_452985044_469762130.currentSlide; - console.log(currentslide_452985045_469762131); + var currentslide_452985156_469762131 = event_452985155_469762130.currentSlide; + console.log(currentslide_452985156_469762131); Label1: do { - var node_452985046_469762135 = null; + var node_452985157_469762135 = null; var i_469762212 = 0; - var L_469762213 = (currentslide_452985045_469762131.attributes).length; + var L_469762213 = (currentslide_452985156_469762131.attributes).length; Label2: do { Label3: while (true) { if (!(i_469762212 < L_469762213)) break Label3; - node_452985046_469762135 = currentslide_452985045_469762131.attributes[i_469762212]; - if (contains_469762068(["data-background-video", "data-background-iframe", "data-background-image"], node_452985046_469762135.nodeName)) { - footer_452985043_469762128.style.setProperty("visibility", "hidden", []); + node_452985157_469762135 = currentslide_452985156_469762131.attributes[i_469762212]; + if (contains_469762068(["data-background-video", "data-background-iframe", "data-background-image"], node_452985157_469762135.nodeName)) { + footer_452985154_469762128.style.setProperty("visibility", "hidden", []); break BeforeRet; } @@ -216,18 +216,18 @@ } } while (false); } while (false); - footer_452985043_469762128.style.setProperty("visibility", "visible", []); + footer_452985154_469762128.style.setProperty("visibility", "visible", []); } while (false); } rawEcho(makeNimstrLit("Doing something!")); - var deck_452985042_469762127 = Reveal.getRevealElement(); - var footer_452985043_469762128 = document.getElementById("reveal-footer").cloneNode(true); - footer_452985043_469762128.style.setProperty("visibility", "visible", []); - deck_452985042_469762127.appendChild(footer_452985043_469762128); - Reveal.on("slidechanged", lambda_452985023_469762129); + var deck_452985153_469762127 = Reveal.getRevealElement(); + var footer_452985154_469762128 = document.getElementById("reveal-footer").cloneNode(true); + footer_452985154_469762128.style.setProperty("visibility", "visible", []); + deck_452985153_469762127.appendChild(footer_452985154_469762128); + Reveal.on("slidechanged", lambda_452985134_469762129); } @@ -239,11 +239,11 @@ if (Reveal.isReady()) { rawEcho(makeNimstrLit("Doing something!")); - var deck_452985042_469762057 = Reveal.getRevealElement(); - var footer_452985043_469762058 = document.getElementById("reveal-footer").cloneNode(true); - footer_452985043_469762058.style.setProperty("visibility", "visible", []); - deck_452985042_469762057.appendChild(footer_452985043_469762058); - Reveal.on("slidechanged", lambda_452985023_469762059); + var deck_452985153_469762057 = Reveal.getRevealElement(); + var footer_452985154_469762058 = document.getElementById("reveal-footer").cloneNode(true); + footer_452985154_469762058.style.setProperty("visibility", "visible", []); + deck_452985153_469762057.appendChild(footer_452985154_469762058); + Reveal.on("slidechanged", lambda_452985134_469762059); } else { window.addEventListener("load", HEX3Aanonymous_469762123, false); @@ -3299,18 +3299,18 @@

    Typewriter Effect

    return result_469762075[0]; } -var rootid_452985828_469762057 = to_469762050(parseJson_603985094(makeNimstrLit("\"karax-1\""))); -var id_452985829_469762063 = to_469762050(parseJson_603985094(makeNimstrLit("\"typewriter0\""))); -var localtext_452985830_469762069 = to_469762050(parseJson_603985094(makeNimstrLit("\"This text will be typed one letter at a time with the speed and alignement specified.\""))); -var fragindex_452985831_469762100 = to_469762070(parseJson_603985094(makeNimstrLit("0"))); -var speed_452985832_469762106 = to_469762070(parseJson_603985094(makeNimstrLit("30"))); -var align_452985833_469762112 = to_469762050(parseJson_603985094(makeNimstrLit("\"left\""))); +var rootid_452985939_469762057 = to_469762050(parseJson_603985094(makeNimstrLit("\"karax-1\""))); +var id_452985940_469762063 = to_469762050(parseJson_603985094(makeNimstrLit("\"typewriter0\""))); +var localtext_452985941_469762069 = to_469762050(parseJson_603985094(makeNimstrLit("\"This text will be typed one letter at a time with the speed and alignement specified.\""))); +var fragindex_452985942_469762100 = to_469762070(parseJson_603985094(makeNimstrLit("0"))); +var speed_452985943_469762106 = to_469762070(parseJson_603985094(makeNimstrLit("30"))); +var align_452985944_469762112 = to_469762050(parseJson_603985094(makeNimstrLit("\"left\""))); var gid_1174405727 = [0]; var vcomponents_1207959565 = [{}]; var kxi__nimib_kxi_5 = null; -var postrendercallback_452985834_469762168 = [null]; -var i_452985836_469762175 = [0]; -var timeout_452985837_469762176 = [null]; +var postrendercallback_452985945_469762168 = [null]; +var i_452985947_469762175 = [0]; +var timeout_452985948_469762176 = [null]; function newSeq_1140851702(len_1140851704) { var result_1140851705 = []; @@ -4698,14 +4698,14 @@

    Typewriter Effect

    } -function createdom_452985823_469762192() { +function createdom_452985934_469762192() { var result_469762193 = null; var tmp_469762224 = tree_1174405894(44, []); var tmp_469762225 = tree_1174405894(32, []); - tmp_469762225.id = toJSStr(id_452985829_469762063); - tmp_469762225.style = style_1241514444(160, toJSStr(align_452985833_469762112)); - add_1174405831(tmp_469762225, text_1174405949(toJSStr(localtext_452985830_469762069))); + tmp_469762225.id = toJSStr(id_452985940_469762063); + tmp_469762225.style = style_1241514444(160, toJSStr(align_452985944_469762112)); + add_1174405831(tmp_469762225, text_1174405949(toJSStr(localtext_452985941_469762069))); add_1174405831(tmp_469762224, tmp_469762225); result_469762193 = tmp_469762224; @@ -4883,41 +4883,41 @@

    Typewriter Effect

    } -function typewriterlocal_452985824_469762177() { +function typewriterlocal_452985935_469762177() { var Temporary1; - rawEcho(makeNimstrLit("Typing "), HEX24_318767107(fragindex_452985831_469762100)); - var el_452985838_469762178 = document.getElementById(toJSStr(id_452985829_469762063)); - if ((i_452985836_469762175[0] < (localtext_452985830_469762069).length)) { - if (null != (Temporary1 = toJSStr(nimCharToStr(localtext_452985830_469762069[i_452985836_469762175[0]])), Temporary1)) { if (null == el_452985838_469762178.innerHTML) el_452985838_469762178.innerHTML = Temporary1; else el_452985838_469762178.innerHTML += Temporary1; }; - i_452985836_469762175[0] += 1; - timeout_452985837_469762176[0] = setTimeout(typewriterlocal_452985824_469762177, speed_452985832_469762106); + rawEcho(makeNimstrLit("Typing "), HEX24_318767107(fragindex_452985942_469762100)); + var el_452985949_469762178 = document.getElementById(toJSStr(id_452985940_469762063)); + if ((i_452985947_469762175[0] < (localtext_452985941_469762069).length)) { + if (null != (Temporary1 = toJSStr(nimCharToStr(localtext_452985941_469762069[i_452985947_469762175[0]])), Temporary1)) { if (null == el_452985949_469762178.innerHTML) el_452985949_469762178.innerHTML = Temporary1; else el_452985949_469762178.innerHTML += Temporary1; }; + i_452985947_469762175[0] += 1; + timeout_452985948_469762176[0] = setTimeout(typewriterlocal_452985935_469762177, speed_452985943_469762106); } } -function lambda_452985825_469762240(event_452985839_469762241) { +function lambda_452985936_469762240(event_452985950_469762241) { -function lambda_452985826_469762242(event_452985839_469762243) { - if (!(isAnimatedCode_1308622862(event_452985839_469762243.fragment))) { - var index_452985840_469762244 = getFragmentIndex_1308622903(event_452985839_469762243.fragment); - if ((fragindex_452985831_469762100 == index_452985840_469762244)) { - var el_452985838_469762245 = document.getElementById(toJSStr(id_452985829_469762063)); - el_452985838_469762245.innerHTML = ""; - i_452985836_469762175[0] = 0; - rawEcho(makeNimstrLit("Starting "), HEX24_318767107(fragindex_452985831_469762100)); - typewriterlocal_452985824_469762177(); +function lambda_452985937_469762242(event_452985950_469762243) { + if (!(isAnimatedCode_1308622862(event_452985950_469762243.fragment))) { + var index_452985951_469762244 = getFragmentIndex_1308622903(event_452985950_469762243.fragment); + if ((fragindex_452985942_469762100 == index_452985951_469762244)) { + var el_452985949_469762245 = document.getElementById(toJSStr(id_452985940_469762063)); + el_452985949_469762245.innerHTML = ""; + i_452985947_469762175[0] = 0; + rawEcho(makeNimstrLit("Starting "), HEX24_318767107(fragindex_452985942_469762100)); + typewriterlocal_452985935_469762177(); } else { - var el_452985838_469762246 = document.getElementById(toJSStr(id_452985829_469762063)); - i_452985836_469762175[0] = (localtext_452985830_469762069).length; - if (!((timeout_452985837_469762176[0] == null))) { - clearTimeout(timeout_452985837_469762176[0]); + var el_452985949_469762246 = document.getElementById(toJSStr(id_452985940_469762063)); + i_452985947_469762175[0] = (localtext_452985941_469762069).length; + if (!((timeout_452985948_469762176[0] == null))) { + clearTimeout(timeout_452985948_469762176[0]); } - el_452985838_469762246.innerHTML = toJSStr(localtext_452985830_469762069); + el_452985949_469762246.innerHTML = toJSStr(localtext_452985941_469762069); } } @@ -4926,10 +4926,10 @@

    Typewriter Effect

    } -function lambda_452985827_469762250(event_452985839_469762251) { - if (!(isAnimatedCode_1308622862(event_452985839_469762251.fragment))) { - var index_452985840_469762252 = getFragmentIndex_1308622903(event_452985839_469762251.fragment); - if ((fragindex_452985831_469762100 == index_452985840_469762252)) { +function lambda_452985938_469762250(event_452985950_469762251) { + if (!(isAnimatedCode_1308622862(event_452985950_469762251.fragment))) { + var index_452985951_469762252 = getFragmentIndex_1308622903(event_452985950_469762251.fragment); + if ((fragindex_452985942_469762100 == index_452985951_469762252)) { } } @@ -4938,14 +4938,14 @@

    Typewriter Effect

    } - rawEcho(makeNimstrLit("Loading "), HEX24_318767107(fragindex_452985831_469762100)); - Reveal.on("fragmentshown", lambda_452985826_469762242); - Reveal.on("fragmenthidden", lambda_452985827_469762250); + rawEcho(makeNimstrLit("Loading "), HEX24_318767107(fragindex_452985942_469762100)); + Reveal.on("fragmentshown", lambda_452985937_469762242); + Reveal.on("fragmenthidden", lambda_452985938_469762250); } -setRenderer_1140851796(createdom_452985823_469762192, toJSStr(rootid_452985828_469762057), postrendercallback_452985834_469762168[0]); -window.addEventListener("load", lambda_452985825_469762240, false); +setRenderer_1140851796(createdom_452985934_469762192, toJSStr(rootid_452985939_469762057), postrendercallback_452985945_469762168[0]); +window.addEventListener("load", lambda_452985936_469762240, false);
    @@ -5169,7 +5169,7 @@

    Now let's load the image we just created!

    - diff --git a/src/nimiSlides.nim b/src/nimiSlides.nim index a30b44e..563c83c 100644 --- a/src/nimiSlides.nim +++ b/src/nimiSlides.nim @@ -71,9 +71,11 @@ const main = """ {{&.}} {{/blocks}} - {{> revealJS }} -
    +

    Welcome to nimiSlides! ๐Ÿ›ท

    These slides will show you what this nimib theme is capable of.

    -
    -
    +
    +

    You can have text, but also code:

    let a = 2
     let b = 3
    @@ -271,7 +265,7 @@ 

    Welcome to

    You can animate the code as well! ๐ŸŽž

    echo "First this!"
     echo "But not this!"
    @@ -282,9 +276,10 @@ 

    Welcome to

    Typewriter Effect

    @@ -3299,18 +3294,18 @@

    Typewriter Effect

    return result_469762075[0]; } -var rootid_452985939_469762057 = to_469762050(parseJson_603985094(makeNimstrLit("\"karax-1\""))); -var id_452985940_469762063 = to_469762050(parseJson_603985094(makeNimstrLit("\"typewriter0\""))); -var localtext_452985941_469762069 = to_469762050(parseJson_603985094(makeNimstrLit("\"This text will be typed one letter at a time with the speed and alignement specified.\""))); -var fragindex_452985942_469762100 = to_469762070(parseJson_603985094(makeNimstrLit("0"))); -var speed_452985943_469762106 = to_469762070(parseJson_603985094(makeNimstrLit("30"))); -var align_452985944_469762112 = to_469762050(parseJson_603985094(makeNimstrLit("\"left\""))); +var rootid_452985959_469762057 = to_469762050(parseJson_603985094(makeNimstrLit("\"karax-1\""))); +var id_452985960_469762063 = to_469762050(parseJson_603985094(makeNimstrLit("\"typewriter0\""))); +var localtext_452985961_469762069 = to_469762050(parseJson_603985094(makeNimstrLit("\"This text will be typed one letter at a time with the speed and alignement specified.\""))); +var fragindex_452985962_469762100 = to_469762070(parseJson_603985094(makeNimstrLit("0"))); +var speed_452985963_469762106 = to_469762070(parseJson_603985094(makeNimstrLit("30"))); +var align_452985964_469762112 = to_469762050(parseJson_603985094(makeNimstrLit("\"left\""))); var gid_1174405727 = [0]; var vcomponents_1207959565 = [{}]; -var kxi__nimib_kxi_5 = null; -var postrendercallback_452985945_469762168 = [null]; -var i_452985947_469762175 = [0]; -var timeout_452985948_469762176 = [null]; +var kxi__nimib_kxi_9 = null; +var postrendercallback_452985965_469762168 = [null]; +var i_452985967_469762175 = [0]; +var timeout_452985968_469762176 = [null]; function newSeq_1140851702(len_1140851704) { var result_1140851705 = []; @@ -3536,7 +3531,7 @@

    Typewriter Effect

    result_1140850974 = document.createTextNode(n_1140850971.text); n_1140850971.dom = result_1140850974; if (!((n_1140850971.id == null))) { - kxi__nimib_kxi_5.byId[n_1140850971.id] = n_1140850971; + kxi__nimib_kxi_9.byId[n_1140850971.id] = n_1140850971; } } @@ -3546,7 +3541,7 @@

    Typewriter Effect

    result_1140850974.innerHTML = n_1140850971.text; n_1140850971.dom = result_1140850974; if (!((n_1140850971.id == null))) { - kxi__nimib_kxi_5.byId[n_1140850971.id] = n_1140850971; + kxi__nimib_kxi_9.byId[n_1140850971.id] = n_1140850971; } break BeforeRet; @@ -3557,7 +3552,7 @@

    Typewriter Effect

    result_1140850974 = toDom_1140850970(x_1140851014, useAttachedNode_1140850972, kxi_1140850973); n_1140850971.dom = result_1140850974; if (!((n_1140850971.id == null))) { - kxi__nimib_kxi_5.byId[n_1140850971.id] = n_1140850971; + kxi__nimib_kxi_9.byId[n_1140850971.id] = n_1140850971; } break BeforeRet; @@ -3567,7 +3562,7 @@

    Typewriter Effect

    result_1140850974 = n_1140850971.dom; n_1140850971.dom = result_1140850974; if (!((n_1140850971.id == null))) { - kxi__nimib_kxi_5.byId[n_1140850971.id] = n_1140850971; + kxi__nimib_kxi_9.byId[n_1140850971.id] = n_1140850971; } break BeforeRet; @@ -3586,7 +3581,7 @@

    Typewriter Effect

    result_1140850974 = toDom_1140850970(x_1140851042.expanded, useAttachedNode_1140850972, kxi_1140850973); n_1140850971.dom = result_1140850974; if (!((n_1140850971.id == null))) { - kxi__nimib_kxi_5.byId[n_1140850971.id] = n_1140850971; + kxi__nimib_kxi_9.byId[n_1140850971.id] = n_1140850971; } break BeforeRet; @@ -3595,7 +3590,7 @@

    Typewriter Effect

    result_1140850974 = document.createElement(toTag_1174405469[n_1140850971.kind]); n_1140850971.dom = result_1140850974; if (!((n_1140850971.id == null))) { - kxi__nimib_kxi_5.byId[n_1140850971.id] = n_1140850971; + kxi__nimib_kxi_9.byId[n_1140850971.id] = n_1140850971; } Label1: do { @@ -3701,7 +3696,7 @@

    Typewriter Effect

    var result_1140851122 = false; BeforeRet: do { - if (kxi__nimib_kxi_5.orphans.hasOwnProperty(n_1140851119.id)) { + if (kxi__nimib_kxi_9.orphans.hasOwnProperty(n_1140851119.id)) { result_1140851122 = true; break BeforeRet; } @@ -4279,7 +4274,7 @@

    Typewriter Effect

    Label19: while (true) { if (!(res_469762336 <= oldPos_1140851462)) break Label19; i_1140851497 = res_469762336; - addPatch_1140851282(kxi__nimib_kxi_5, 4, null, null, null, HEX5BHEX5D_1174405823(oldNode_1140851415, i_1140851497)); + addPatch_1140851282(kxi__nimib_kxi_9, 4, null, null, null, HEX5BHEX5D_1174405823(oldNode_1140851415, i_1140851497)); addPatch_1140851282(kxi_1140851418, 1, current_1140851417, current_1140851417.childNodes[i_1140851497], null, null); res_469762336 += 1; } @@ -4287,7 +4282,7 @@

    Typewriter Effect

    } while (false); break; case 1: - addPatch_1140851282(kxi__nimib_kxi_5, 4, null, null, null, oldNode_1140851415); + addPatch_1140851282(kxi__nimib_kxi_9, 4, null, null, null, oldNode_1140851415); addPatch_1140851282(kxi_1140851418, 0, parent_1140851416, current_1140851417, newNode_1140851414, null); break; case 4: @@ -4319,7 +4314,7 @@

    Typewriter Effect

    x_1140851519.expanded = x_1140851519.renderImpl(x_1140851519); x_1140851519.renderedVersion = x_1140851519.version; if ((oldExpanded_1140851527 == null)) { - addPatch_1140851282(kxi__nimib_kxi_5, 4, null, null, null, x_1140851519); + addPatch_1140851282(kxi__nimib_kxi_9, 4, null, null, null, x_1140851519); addPatch_1140851282(kxi_1140851513, 0, parent_1140851526, current_1140851525, x_1140851519.expanded, null); } else { @@ -4341,7 +4336,7 @@

    Typewriter Effect

    dest_1140851348.dom = src_1140851349.dom; src_1140851349.dom = null; if (!((dest_1140851348.id == null))) { - kxi__nimib_kxi_5.byId[dest_1140851348.id] = dest_1140851348; + kxi__nimib_kxi_9.byId[dest_1140851348.id] = dest_1140851348; } Label1: do { @@ -4513,12 +4508,12 @@

    Typewriter Effect

    function init_1140851671(ev_1140851672) { function HEX3Aanonymous_1140851673() { - dodraw_1140851608(kxi__nimib_kxi_5); + dodraw_1140851608(kxi__nimib_kxi_9); } - kxi__nimib_kxi_5.renderId = window.requestAnimationFrame(HEX3Aanonymous_1140851673); + kxi__nimib_kxi_9.renderId = window.requestAnimationFrame(HEX3Aanonymous_1140851673); } @@ -4542,7 +4537,7 @@

    Typewriter Effect

    function setRenderer_1140851684(renderer_1140851687, root_1140851688, clientPostRenderCallback_1140851691) { function HEX3Aanonymous_1140851750() { - redraw_1140851665(kxi__nimib_kxi_5); + redraw_1140851665(kxi__nimib_kxi_9); } @@ -4555,7 +4550,7 @@

    Typewriter Effect

    } result_1140851692 = {rootId: root_1140851688, renderer: renderer_1140851687, postRenderCallback: clientPostRenderCallback_1140851691, patches: newSeq_1140851702(60), patchesV: newSeq_1140851723(30), components: [], surpressRedraws: false, byId: {}, orphans: {}, currentTree: null, toFocus: null, toFocusV: null, renderId: 0, rendering: false, patchLen: 0, patchLenV: 0, runCount: 0}; - kxi__nimib_kxi_5 = result_1140851692; + kxi__nimib_kxi_9 = result_1140851692; window.addEventListener("load", init_1140851671, false); window.onhashchange = HEX3Aanonymous_1140851750; @@ -4698,14 +4693,14 @@

    Typewriter Effect

    } -function createdom_452985934_469762192() { +function createdom_452985954_469762192() { var result_469762193 = null; var tmp_469762224 = tree_1174405894(44, []); var tmp_469762225 = tree_1174405894(32, []); - tmp_469762225.id = toJSStr(id_452985940_469762063); - tmp_469762225.style = style_1241514444(160, toJSStr(align_452985944_469762112)); - add_1174405831(tmp_469762225, text_1174405949(toJSStr(localtext_452985941_469762069))); + tmp_469762225.id = toJSStr(id_452985960_469762063); + tmp_469762225.style = style_1241514444(160, toJSStr(align_452985964_469762112)); + add_1174405831(tmp_469762225, text_1174405949(toJSStr(localtext_452985961_469762069))); add_1174405831(tmp_469762224, tmp_469762225); result_469762193 = tmp_469762224; @@ -4883,41 +4878,41 @@

    Typewriter Effect

    } -function typewriterlocal_452985935_469762177() { +function typewriterlocal_452985955_469762177() { var Temporary1; - rawEcho(makeNimstrLit("Typing "), HEX24_318767107(fragindex_452985942_469762100)); - var el_452985949_469762178 = document.getElementById(toJSStr(id_452985940_469762063)); - if ((i_452985947_469762175[0] < (localtext_452985941_469762069).length)) { - if (null != (Temporary1 = toJSStr(nimCharToStr(localtext_452985941_469762069[i_452985947_469762175[0]])), Temporary1)) { if (null == el_452985949_469762178.innerHTML) el_452985949_469762178.innerHTML = Temporary1; else el_452985949_469762178.innerHTML += Temporary1; }; - i_452985947_469762175[0] += 1; - timeout_452985948_469762176[0] = setTimeout(typewriterlocal_452985935_469762177, speed_452985943_469762106); + rawEcho(makeNimstrLit("Typing "), HEX24_318767107(fragindex_452985962_469762100)); + var el_452985969_469762178 = document.getElementById(toJSStr(id_452985960_469762063)); + if ((i_452985967_469762175[0] < (localtext_452985961_469762069).length)) { + if (null != (Temporary1 = toJSStr(nimCharToStr(localtext_452985961_469762069[i_452985967_469762175[0]])), Temporary1)) { if (null == el_452985969_469762178.innerHTML) el_452985969_469762178.innerHTML = Temporary1; else el_452985969_469762178.innerHTML += Temporary1; }; + i_452985967_469762175[0] += 1; + timeout_452985968_469762176[0] = setTimeout(typewriterlocal_452985955_469762177, speed_452985963_469762106); } } -function lambda_452985936_469762240(event_452985950_469762241) { +function lambda_452985956_469762240(event_452985970_469762241) { -function lambda_452985937_469762242(event_452985950_469762243) { - if (!(isAnimatedCode_1308622862(event_452985950_469762243.fragment))) { - var index_452985951_469762244 = getFragmentIndex_1308622903(event_452985950_469762243.fragment); - if ((fragindex_452985942_469762100 == index_452985951_469762244)) { - var el_452985949_469762245 = document.getElementById(toJSStr(id_452985940_469762063)); - el_452985949_469762245.innerHTML = ""; - i_452985947_469762175[0] = 0; - rawEcho(makeNimstrLit("Starting "), HEX24_318767107(fragindex_452985942_469762100)); - typewriterlocal_452985935_469762177(); +function lambda_452985957_469762242(event_452985970_469762243) { + if (!(isAnimatedCode_1308622862(event_452985970_469762243.fragment))) { + var index_452985971_469762244 = getFragmentIndex_1308622903(event_452985970_469762243.fragment); + if ((fragindex_452985962_469762100 == index_452985971_469762244)) { + var el_452985969_469762245 = document.getElementById(toJSStr(id_452985960_469762063)); + el_452985969_469762245.innerHTML = ""; + i_452985967_469762175[0] = 0; + rawEcho(makeNimstrLit("Starting "), HEX24_318767107(fragindex_452985962_469762100)); + typewriterlocal_452985955_469762177(); } else { - var el_452985949_469762246 = document.getElementById(toJSStr(id_452985940_469762063)); - i_452985947_469762175[0] = (localtext_452985941_469762069).length; - if (!((timeout_452985948_469762176[0] == null))) { - clearTimeout(timeout_452985948_469762176[0]); + var el_452985969_469762246 = document.getElementById(toJSStr(id_452985960_469762063)); + i_452985967_469762175[0] = (localtext_452985961_469762069).length; + if (!((timeout_452985968_469762176[0] == null))) { + clearTimeout(timeout_452985968_469762176[0]); } - el_452985949_469762246.innerHTML = toJSStr(localtext_452985941_469762069); + el_452985969_469762246.innerHTML = toJSStr(localtext_452985961_469762069); } } @@ -4926,10 +4921,10 @@

    Typewriter Effect

    } -function lambda_452985938_469762250(event_452985950_469762251) { - if (!(isAnimatedCode_1308622862(event_452985950_469762251.fragment))) { - var index_452985951_469762252 = getFragmentIndex_1308622903(event_452985950_469762251.fragment); - if ((fragindex_452985942_469762100 == index_452985951_469762252)) { +function lambda_452985958_469762250(event_452985970_469762251) { + if (!(isAnimatedCode_1308622862(event_452985970_469762251.fragment))) { + var index_452985971_469762252 = getFragmentIndex_1308622903(event_452985970_469762251.fragment); + if ((fragindex_452985962_469762100 == index_452985971_469762252)) { } } @@ -4938,20 +4933,20 @@

    Typewriter Effect

    } - rawEcho(makeNimstrLit("Loading "), HEX24_318767107(fragindex_452985942_469762100)); - Reveal.on("fragmentshown", lambda_452985937_469762242); - Reveal.on("fragmenthidden", lambda_452985938_469762250); + rawEcho(makeNimstrLit("Loading "), HEX24_318767107(fragindex_452985962_469762100)); + Reveal.on("fragmentshown", lambda_452985957_469762242); + Reveal.on("fragmenthidden", lambda_452985958_469762250); } -setRenderer_1140851796(createdom_452985934_469762192, toJSStr(rootid_452985939_469762057), postrendercallback_452985945_469762168[0]); -window.addEventListener("load", lambda_452985936_469762240, false); +setRenderer_1140851796(createdom_452985954_469762192, toJSStr(rootid_452985959_469762057), postrendercallback_452985965_469762168[0]); +window.addEventListener("load", lambda_452985956_469762240, false);

    -
    -
    +
    +

    Fragments (animations)

    @@ -4993,7 +4988,7 @@

    Who doesn't like animations? โ–ถ

    -
    +

    You can do pretty complex animations:

    @@ -5020,7 +5015,7 @@

    You can do pretty complex animations:

    -
    +

    Using a for loop you can automate tedious repetition

    @@ -5048,20 +5043,20 @@

    Using a for loop you can automate tedious repetition

    -
    +

    Automatic animation

    • One element
    -
    +

    Automatic animation

    • One element
    • Two elements
    -
    +

    Automatic animation

    • One element
    • @@ -5069,7 +5064,7 @@

      Automatic animation

    • Three elements
    -
    +

    Fragment list

    @@ -5088,14 +5083,14 @@

    Fragment list

    -
    +

    Math โž•

    You can show off all your fancy equations โš› $$ e^{\pi i} = -1 $$ $$ \int_0^{\infty} \frac{1}{1 + e^x} dx$$

    -
    -
    +
    +

    Images ๐Ÿ–ผ๏ธ

    You can have the code generating an image in the slides and then load the image. This way it's always up to date!

    import numericalnim, ggplotnim, std/[sequtils, math]
    @@ -5112,7 +5107,7 @@ 

    Images ๐Ÿ–ผ๏ธ

    df = df.gather(["exact", "spline"], value="y", key="type")
    -
    +

    Now let's load the image we just created!

    ggplot(df, aes("x", "y", color="type")) +
       geom_line() +
    @@ -5127,22 +5122,22 @@ 

    Now let's load the image we just created!

    -
    -
    +
    +

    You can have different backgrounds

    -
    +

    Image background

    -
    +

    Video background

    -
    +

    Iframe background

    -
    -
    +
    +

    2 Columns

    @@ -5153,7 +5148,7 @@

    2 Columns

    -
    +

    3 Columns

    @@ -5168,7 +5163,7 @@

    3 Columns

    -
    +

    Incremental lists

      @@ -5207,6 +5202,9297 @@

      Incremental lists

    +
    +

    Corner images

    + + + + +