Pass through all slide shortcode params to section

Now slides can have ids and arbitrary data attributes, and a whitelist of valid attributes no longer needs to be maintained.
This commit is contained in:
dzello 2018-07-22 18:25:48 +02:00
parent 27e0dc2aa0
commit 3e34fe3bc9
3 changed files with 28 additions and 11 deletions

View file

@ -158,10 +158,10 @@ Like fragment but more terse - content is placed inline in a self-closing shortc
#### slide shortcode #### slide shortcode
The slide shortcode lets you set custom Reveal.js attributes for each slide - things like transition, background color and [much more](https://github.com/hakimel/reveal.js/#slide-attributes). The slide shortcode lets you set custom Reveal.js attributes for each slide - things like id, transition, background and [much more](https://github.com/hakimel/reveal.js/#slide-attributes).
```markdown ```markdown
{{% slide background="#FFF" transition="zoom" transition-speed="fast" %}} {{% slide id="hello" background="#FFF" transition="zoom" transition-speed="fast" %}}
# Hello, world! # Hello, world!

View file

@ -4,18 +4,18 @@ weight = 34
## Slide ## Slide
Customize individual slide parameters like background color and transition. Customize individual slide attributes like id, background color and transition. Use the same keys as Reveal.js but omit the 'data-' prefix.
[See all slide params](https://github.com/hakimel/reveal.js#slide-backgrounds) [See more attributes](https://github.com/hakimel/reveal.js#slide-attributes)
--- ---
{{% slide transition="zoom" transition-speed="fast" %}} {{% slide id="custom-1" transition="zoom" transition-speed="fast" %}}
## Custom slide 1 ## Custom slide 1
``` ```
{{%/* slide transition="zoom" transition-speed="fast" */%}} {{%/* slide id="custom-1" transition="zoom" transition-speed="fast" */%}}
## Custom slide 1 ## Custom slide 1
@ -26,12 +26,12 @@ Customize individual slide parameters like background color and transition.
--- ---
{{% slide background-color="#FF4081" %}} {{% slide id="custom-2" background="#FF4081" %}}
## Custom slide 2 ## Custom slide 2
``` ```
{{%/* slide background-color="#FF4081" */%}} {{%/* slide id="custom-2" background="#FF4081" */%}}
## Custom slide 2 ## Custom slide 2
@ -42,6 +42,19 @@ Customize individual slide parameters like background color and transition.
--- ---
💡 Tip: Setting a slide's `id` attribute makes it easy to link to from other parts of the presentation.
<br>
```markdown
Go to [custom slide 1](#custom-1)
```
<small>
Go to [custom slide 1](#custom-1)
</small>
---
{{% section %}} {{% section %}}
{{% slide content="home.example" /%}} {{% slide content="home.example" /%}}

View file

@ -12,12 +12,16 @@
{{- $scratch.Add "slides" . -}} {{- $scratch.Add "slides" . -}}
{{- end -}} {{- end -}}
{{- end -}} {{- end -}}
{{- $attributes := slice "background-color" "background-image" "background-size" "background-position" "background-repeat" "transition" "transition-speed" "background-iframe" "background-interactive" "background-video" "background-video-loop" "background-video-muted" -}}
{{- $params := . -}} {{- $params := . -}}
{{- $noPrefix := slice "id" -}}
{{- $noOutput := slice "content" -}}
{{- range .Scratch.Get "slides" }} {{- range .Scratch.Get "slides" }}
<section data-noprocess data-shortcode-slide <section data-noprocess data-shortcode-slide
{{- range $attribute := $attributes -}} {{- range $key, $value := $.Params -}}
{{- with $params.Get $attribute }} data-{{ $attribute | safeHTMLAttr }}="{{ . }}"{{ end -}} {{- if not (in $noOutput $key) -}}
{{- $attrName := cond (in $noPrefix $key) $key (delimit (slice "data" $key) "-") }}
{{ $attrName | safeHTMLAttr }}="{{ $value }}"
{{- end -}}
{{- end -}}> {{- end -}}>
{{ . | safeHTML }} {{ . | safeHTML }}
</section> </section>