presently 0.14.1 → 0.15.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- checksums.yaml +4 -4
- checksums.yaml.gz.sig +0 -0
- data/bake/presently/export.rb +6 -3
- data/context/animating-slides.md +13 -25
- data/context/getting-started.md +0 -3
- data/context/index.yaml +1 -1
- data/lib/presently/export.rb +8 -0
- data/lib/presently/slide.rb +1 -1
- data/lib/presently/version.rb +1 -1
- data/public/_static/index.css +0 -19
- data/public/slide.js +0 -19
- data/readme.md +8 -5
- data/releases.md +7 -0
- data.tar.gz.sig +0 -0
- metadata +4 -4
- metadata.gz.sig +0 -0
checksums.yaml
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
---
|
|
2
2
|
SHA256:
|
|
3
|
-
metadata.gz:
|
|
4
|
-
data.tar.gz:
|
|
3
|
+
metadata.gz: 42f99b653f49a0ac23d4c6b49314cde4ef814e70a7d274c7d67914e4f707514d
|
|
4
|
+
data.tar.gz: f308373c9741dad960682283d52df1d34e285e32e0c9155cd0911d3e62405562
|
|
5
5
|
SHA512:
|
|
6
|
-
metadata.gz:
|
|
7
|
-
data.tar.gz:
|
|
6
|
+
metadata.gz: 48116005297631e4fbdc4d06c1b83cfadb847d61dcb03ea60e603af4c28d9d0e678539fe114fbf6ce4f12e0fbc590281094e7fa40c2be003e9d488be31a25516
|
|
7
|
+
data.tar.gz: ed77bebb4005f828ab6b09c321cf075778a394706f0ff0bd6ffc2e2852e3c73ac2da3944e1ad7744cb82e3546702d0f81c4a966acc346f9c374b032f29100df9
|
checksums.yaml.gz.sig
CHANGED
|
Binary file
|
data/bake/presently/export.rb
CHANGED
|
@@ -50,12 +50,15 @@ def pdf(output: "presentation.pdf", slides_root: "slides", notes: true, speaker:
|
|
|
50
50
|
begin
|
|
51
51
|
environment = Async::Service::Environment.build(
|
|
52
52
|
Presently::Environment::Application,
|
|
53
|
-
root:
|
|
54
|
-
slides_root:
|
|
53
|
+
root: Dir.pwd,
|
|
54
|
+
slides_root: slides_root,
|
|
55
55
|
endpoint: Async::HTTP::Endpoint.parse("http://localhost", bound_endpoint)
|
|
56
56
|
)
|
|
57
57
|
|
|
58
|
-
|
|
58
|
+
# PDF export always requires an HTTP server, regardless of the configured
|
|
59
|
+
# Lively transport:
|
|
60
|
+
transport = environment.with(environment.evaluator.http_environment)
|
|
61
|
+
evaluator = transport.evaluator
|
|
59
62
|
server = evaluator.make_server(evaluator.endpoint)
|
|
60
63
|
server_task = task.async{server.run}
|
|
61
64
|
|
data/context/animating-slides.md
CHANGED
|
@@ -1,14 +1,6 @@
|
|
|
1
1
|
# Animating Slides
|
|
2
2
|
|
|
3
|
-
This guide explains how to animate content within slides using the
|
|
4
|
-
|
|
5
|
-
## How Morph Works
|
|
6
|
-
|
|
7
|
-
The `morph` transition uses the browser's View Transitions API. When navigating between two slides, any element that has a `view-transition-name` style on both the old and new slide is matched — the browser captures its position and appearance in both states and animates between them.
|
|
8
|
-
|
|
9
|
-
Elements without a matching name crossfade. The slide background stays completely still (no container animation).
|
|
10
|
-
|
|
11
|
-
This is the mechanism that makes build sequences possible: the same element appears on consecutive slides with the same name, so it stays pinned in place while hidden elements appear around it.
|
|
3
|
+
This guide explains how to animate content within slides using the slide scripting system.
|
|
12
4
|
|
|
13
5
|
## Slide Scripts
|
|
14
6
|
|
|
@@ -18,7 +10,6 @@ Any slide can include a JavaScript block at the end of its presenter notes secti
|
|
|
18
10
|
---
|
|
19
11
|
template: default
|
|
20
12
|
duration: 30
|
|
21
|
-
transition: morph
|
|
22
13
|
---
|
|
23
14
|
|
|
24
15
|
- First point
|
|
@@ -30,7 +21,7 @@ transition: morph
|
|
|
30
21
|
Your presenter notes here.
|
|
31
22
|
|
|
32
23
|
```javascript
|
|
33
|
-
slide.find("li").show(1
|
|
24
|
+
slide.find("li").show(1)
|
|
34
25
|
```
|
|
35
26
|
~~~
|
|
36
27
|
|
|
@@ -52,7 +43,7 @@ slide.find(".callout") // elements with a specific class
|
|
|
52
43
|
|
|
53
44
|
### `elements.show(n, options)`
|
|
54
45
|
|
|
55
|
-
Shows the first `n` elements in the collection and hides the rest.
|
|
46
|
+
Shows the first `n` elements in the collection and hides the rest. Returns a `Promise` that resolves when any reveal animation completes.
|
|
56
47
|
|
|
57
48
|
``` javascript
|
|
58
49
|
slide.find("li").show(0) // all hidden
|
|
@@ -64,7 +55,6 @@ Options:
|
|
|
64
55
|
|
|
65
56
|
| Option | Description |
|
|
66
57
|
|---|---|
|
|
67
|
-
| `group` | Name prefix for `view-transition-name` — must be consistent across slides for morph to match elements. Defaults to `"build"`. |
|
|
68
58
|
| `effect` | Entry animation for the newly revealed element. See effects below. |
|
|
69
59
|
|
|
70
60
|
### `elements.builder(options)`
|
|
@@ -72,7 +62,7 @@ Options:
|
|
|
72
62
|
Creates a `SlideBuilder` with default options and a cached position. Use this instead of calling `show()` manually when you want to reveal elements one at a time from a script.
|
|
73
63
|
|
|
74
64
|
``` javascript
|
|
75
|
-
const bullets = slide.find("li").builder({
|
|
65
|
+
const bullets = slide.find("li").builder({effect: "fly-up"})
|
|
76
66
|
bullets.show(0) // hide all initially
|
|
77
67
|
bullets.next() // reveal first, plays fly-up
|
|
78
68
|
bullets.next() // reveal second, plays fly-up
|
|
@@ -115,7 +105,7 @@ A build sequence is a series of consecutive slides with the same content, each r
|
|
|
115
105
|
---
|
|
116
106
|
template: default
|
|
117
107
|
duration: 20
|
|
118
|
-
transition:
|
|
108
|
+
transition: fade
|
|
119
109
|
---
|
|
120
110
|
|
|
121
111
|
- Real-time synchronization
|
|
@@ -127,7 +117,7 @@ transition: morph
|
|
|
127
117
|
Let's walk through the key features.
|
|
128
118
|
|
|
129
119
|
```javascript
|
|
130
|
-
slide.find("li").show(0
|
|
120
|
+
slide.find("li").show(0)
|
|
131
121
|
```
|
|
132
122
|
~~~
|
|
133
123
|
|
|
@@ -136,7 +126,7 @@ slide.find("li").show(0, {group: "bullet"})
|
|
|
136
126
|
---
|
|
137
127
|
template: default
|
|
138
128
|
duration: 20
|
|
139
|
-
transition:
|
|
129
|
+
transition: fade
|
|
140
130
|
---
|
|
141
131
|
|
|
142
132
|
- Real-time synchronization
|
|
@@ -148,12 +138,10 @@ transition: morph
|
|
|
148
138
|
The display and presenter stay in sync over a WebSocket connection.
|
|
149
139
|
|
|
150
140
|
```javascript
|
|
151
|
-
slide.find("li").show(1
|
|
141
|
+
slide.find("li").show(1)
|
|
152
142
|
```
|
|
153
143
|
~~~
|
|
154
144
|
|
|
155
|
-
The `group` option must be identical across all slides in the sequence so the browser matches the same elements. Without it, each slide uses the default `"build"` prefix — which is fine as long as only one build sequence is active per slide.
|
|
156
|
-
|
|
157
145
|
Because all elements are in the DOM from the start (just hidden), the vertical layout stays consistent throughout the sequence — there is no shift as elements appear.
|
|
158
146
|
|
|
159
147
|
## Build Effects
|
|
@@ -161,7 +149,7 @@ Because all elements are in the DOM from the start (just hidden), the vertical l
|
|
|
161
149
|
Pass an `effect` option to animate the newly revealed element as it appears. The effect plays as a CSS animation on the element and is removed automatically once it completes.
|
|
162
150
|
|
|
163
151
|
``` javascript
|
|
164
|
-
slide.find("li").show(2, {
|
|
152
|
+
slide.find("li").show(2, {effect: "fly-up"})
|
|
165
153
|
```
|
|
166
154
|
|
|
167
155
|
Available effects:
|
|
@@ -181,8 +169,8 @@ A slide can have multiple independent build groups. Each `find().show()` call is
|
|
|
181
169
|
|
|
182
170
|
``` javascript
|
|
183
171
|
// Reveal list items as one group, callout div as another
|
|
184
|
-
slide.find("li").show(3
|
|
185
|
-
slide.find(".callout").show(1, {
|
|
172
|
+
slide.find("li").show(3)
|
|
173
|
+
slide.find(".callout").show(1, {effect: "fly-up"})
|
|
186
174
|
```
|
|
187
175
|
|
|
188
176
|
## In-Slide Animation with `slide.after()`
|
|
@@ -190,8 +178,8 @@ slide.find(".callout").show(1, {group: "callout", effect: "fly-up"})
|
|
|
190
178
|
For sequential reveals within a single slide (without navigating to the next slide), use `slide.after()`. Each step fires a delay in milliseconds relative to the previous step. Returns a `SlideContext` so subsequent `.after()` calls chain naturally.
|
|
191
179
|
|
|
192
180
|
``` javascript
|
|
193
|
-
const panes = slide.find(".pane").builder({
|
|
194
|
-
const items = slide.find(".item").builder({
|
|
181
|
+
const panes = slide.find(".pane").builder({effect: "fade"})
|
|
182
|
+
const items = slide.find(".item").builder({effect: "fly-up"})
|
|
195
183
|
panes.show(0)
|
|
196
184
|
items.show(0)
|
|
197
185
|
|
data/context/getting-started.md
CHANGED
|
@@ -263,9 +263,6 @@ Available transitions:
|
|
|
263
263
|
| `fade` | Crossfade between slides |
|
|
264
264
|
| `slide-left` | Current slide exits left, next enters from right |
|
|
265
265
|
| `slide-right` | Current slide exits right, next enters from left |
|
|
266
|
-
| `morph` | Matched elements animate between positions; everything else crossfades |
|
|
267
|
-
|
|
268
|
-
The `morph` transition uses the browser's View Transitions API to smoothly animate individual elements between slides. Elements with the same `view-transition-name` across two consecutive slides are matched and interpolated.
|
|
269
266
|
|
|
270
267
|
## Presenter Notes
|
|
271
268
|
|
data/context/index.yaml
CHANGED
data/lib/presently/export.rb
CHANGED
|
@@ -20,8 +20,16 @@ module Presently
|
|
|
20
20
|
PageSize = Struct.new(:slide_width_px, :slide_height_px, :notes_height_px, keyword_init: true) do
|
|
21
21
|
PX_PER_CM = 96.0 / 2.54
|
|
22
22
|
|
|
23
|
+
# Convert the slide width from CSS pixels to centimetres.
|
|
24
|
+
# @returns [Float] The slide width in centimetres.
|
|
23
25
|
def slide_width_cm = (slide_width_px / PX_PER_CM).round(4)
|
|
26
|
+
|
|
27
|
+
# Convert the slide height from CSS pixels to centimetres.
|
|
28
|
+
# @returns [Float] The slide height in centimetres.
|
|
24
29
|
def slide_height_cm = (slide_height_px / PX_PER_CM).round(4)
|
|
30
|
+
|
|
31
|
+
# Convert the notes panel height from CSS pixels to centimetres.
|
|
32
|
+
# @returns [Float] The notes panel height in centimetres.
|
|
25
33
|
def notes_height_cm = (notes_height_px / PX_PER_CM).round(4)
|
|
26
34
|
end
|
|
27
35
|
|
data/lib/presently/slide.rb
CHANGED
|
@@ -249,7 +249,7 @@ module Presently
|
|
|
249
249
|
end
|
|
250
250
|
|
|
251
251
|
# The transition type for animating into this slide.
|
|
252
|
-
# @returns [String | Nil] The transition name (e.g. `"fade"`, `"slide-left"`, `"
|
|
252
|
+
# @returns [String | Nil] The transition name (e.g. `"fade"`, `"slide-left"`, `"slide-right"`), or `nil` for instant swap.
|
|
253
253
|
def transition
|
|
254
254
|
@front_matter&.fetch("transition", nil)
|
|
255
255
|
end
|
data/lib/presently/version.rb
CHANGED
data/public/_static/index.css
CHANGED
|
@@ -364,18 +364,6 @@ html[data-transition="slide-right"]::view-transition-new(slide-container) {
|
|
|
364
364
|
animation: vt-slide-in-left 0.4s ease-in-out;
|
|
365
365
|
}
|
|
366
366
|
|
|
367
|
-
/* Magic move — the browser interpolates position/size for matched
|
|
368
|
-
view-transition-name elements. No cross-fade on the container
|
|
369
|
-
to avoid background dimming. */
|
|
370
|
-
html[data-transition="morph"]::view-transition-old(slide-container) {
|
|
371
|
-
animation: none;
|
|
372
|
-
opacity: 0;
|
|
373
|
-
}
|
|
374
|
-
|
|
375
|
-
html[data-transition="morph"]::view-transition-new(slide-container) {
|
|
376
|
-
animation: none;
|
|
377
|
-
}
|
|
378
|
-
|
|
379
367
|
@keyframes vt-fade-out {
|
|
380
368
|
from { opacity: 1; }
|
|
381
369
|
to { opacity: 0; }
|
|
@@ -410,13 +398,6 @@ html[data-transition="morph"]::view-transition-new(slide-container) {
|
|
|
410
398
|
BUILD EFFECTS
|
|
411
399
|
======================== */
|
|
412
400
|
|
|
413
|
-
/* Suppress both pseudo-elements for hidden build elements so they
|
|
414
|
-
neither crossfade in nor crossfade out during the transition. */
|
|
415
|
-
::view-transition-old(.build-hidden),
|
|
416
|
-
::view-transition-new(.build-hidden) {
|
|
417
|
-
display: none;
|
|
418
|
-
}
|
|
419
|
-
|
|
420
401
|
/* Fade */
|
|
421
402
|
.build-fade {
|
|
422
403
|
animation: vt-fade-in 0.4s ease;
|
data/public/slide.js
CHANGED
|
@@ -3,7 +3,6 @@
|
|
|
3
3
|
// instead of tracking count manually. Created via SlideElements#builder(options).
|
|
4
4
|
export class SlideBuilder {
|
|
5
5
|
#elements;
|
|
6
|
-
#prefix;
|
|
7
6
|
#defaultEffect;
|
|
8
7
|
#slide;
|
|
9
8
|
#step = 0;
|
|
@@ -11,7 +10,6 @@ export class SlideBuilder {
|
|
|
11
10
|
constructor(slide, elements, options = {}) {
|
|
12
11
|
this.#slide = slide;
|
|
13
12
|
this.#elements = elements;
|
|
14
|
-
this.#prefix = options.group || 'build';
|
|
15
13
|
this.#defaultEffect = options.effect || null;
|
|
16
14
|
}
|
|
17
15
|
|
|
@@ -26,16 +24,8 @@ export class SlideBuilder {
|
|
|
26
24
|
let revealedElement = null;
|
|
27
25
|
|
|
28
26
|
this.#elements.forEach((element, index) => {
|
|
29
|
-
// Only assign a group name if the element doesn't already have an explicit one.
|
|
30
|
-
// Preserving explicit names allows elements to participate in morph transitions
|
|
31
|
-
// to other slides while still being managed by the build system.
|
|
32
|
-
if (!element.style.viewTransitionName || element.style.viewTransitionName === 'none') {
|
|
33
|
-
element.style.viewTransitionName = `${this.#prefix}-${index + 1}`;
|
|
34
|
-
}
|
|
35
|
-
|
|
36
27
|
if (index < count) {
|
|
37
28
|
element.style.visibility = 'visible';
|
|
38
|
-
element.style.viewTransitionClass = '';
|
|
39
29
|
|
|
40
30
|
if (index === count - 1 && effect) {
|
|
41
31
|
element.classList.add(`build-${effect}`);
|
|
@@ -43,9 +33,6 @@ export class SlideBuilder {
|
|
|
43
33
|
}
|
|
44
34
|
} else {
|
|
45
35
|
element.style.visibility = 'hidden';
|
|
46
|
-
// Keep viewTransitionClass set so morph transitions can suppress
|
|
47
|
-
// crossfading on hidden elements when called inside startViewTransition.
|
|
48
|
-
element.style.viewTransitionClass = 'build-hidden';
|
|
49
36
|
}
|
|
50
37
|
});
|
|
51
38
|
|
|
@@ -75,11 +62,7 @@ export class SlideBuilder {
|
|
|
75
62
|
const effect = this.#slide.animated ? (overrides.effect !== undefined ? overrides.effect : this.#defaultEffect) : null;
|
|
76
63
|
const element = this.#elements[this.#step];
|
|
77
64
|
|
|
78
|
-
if (!element.style.viewTransitionName || element.style.viewTransitionName === 'none') {
|
|
79
|
-
element.style.viewTransitionName = `${this.#prefix}-${this.#step + 1}`;
|
|
80
|
-
}
|
|
81
65
|
element.style.visibility = 'visible';
|
|
82
|
-
element.style.viewTransitionClass = '';
|
|
83
66
|
|
|
84
67
|
this.#step += 1;
|
|
85
68
|
|
|
@@ -141,7 +124,6 @@ export class SlideElements {
|
|
|
141
124
|
|
|
142
125
|
// Create a stateful SlideBuilder for this element collection with default options.
|
|
143
126
|
// @parameter options [Object] Default options applied to every show() / next() call.
|
|
144
|
-
// group: prefix for view-transition-name (default: "build")
|
|
145
127
|
// effect: "fade", "fly-up", "fly-down", "fly-left", "fly-right", "scale"
|
|
146
128
|
// @returns [SlideBuilder]
|
|
147
129
|
builder(options = {}) {
|
|
@@ -152,7 +134,6 @@ export class SlideElements {
|
|
|
152
134
|
// Delegates to SlideBuilder for the actual implementation.
|
|
153
135
|
// @parameter count [Integer] Number of elements to show.
|
|
154
136
|
// @parameter options [Object]
|
|
155
|
-
// group: prefix for view-transition-name (default: "build")
|
|
156
137
|
// effect: "fade", "fly-up", "fly-down", "fly-left", "fly-right", "scale"
|
|
157
138
|
// @returns [Promise] Resolves when the animation completes (or immediately if no effect).
|
|
158
139
|
show(count, options = {}) {
|
data/readme.md
CHANGED
|
@@ -23,12 +23,19 @@ Please see the [project documentation](https://socketry.github.io/presently/) fo
|
|
|
23
23
|
|
|
24
24
|
- [Getting Started](https://socketry.github.io/presently/guides/getting-started/index) - This guide explains how to use `presently` to create and deliver web-based presentations using Markdown slides.
|
|
25
25
|
|
|
26
|
-
- [Animating Slides](https://socketry.github.io/presently/guides/animating-slides/index) - This guide explains how to animate content within slides using the
|
|
26
|
+
- [Animating Slides](https://socketry.github.io/presently/guides/animating-slides/index) - This guide explains how to animate content within slides using the slide scripting system.
|
|
27
27
|
|
|
28
28
|
## Releases
|
|
29
29
|
|
|
30
30
|
Please see the [project releases](https://socketry.github.io/presently/releases/index) for all releases.
|
|
31
31
|
|
|
32
|
+
### v0.15.0
|
|
33
|
+
|
|
34
|
+
q
|
|
35
|
+
|
|
36
|
+
- Export works from current working directory.
|
|
37
|
+
- Remove explicit support for `morph` transition.
|
|
38
|
+
|
|
32
39
|
### v0.14.0
|
|
33
40
|
|
|
34
41
|
- Increase code font size by 50%.
|
|
@@ -77,10 +84,6 @@ Please see the [project releases](https://socketry.github.io/presently/releases/
|
|
|
77
84
|
|
|
78
85
|
- Add `bake presently:slides:speakers` task to print a timing breakdown grouped by speaker. Each speaker's slides are listed in presentation order with individual and total durations, making it easy to balance talk time in multi-speaker presentations. Slides without a `speaker` key are grouped under `(no speaker)`.
|
|
79
86
|
|
|
80
|
-
### v0.5.0
|
|
81
|
-
|
|
82
|
-
- Add optional `speaker` front matter key to slides. When present, the current speaker's name is shown in the timing bar. If the next slide has a different speaker, a handoff indicator (e.g. `→ Next Speaker`) is shown alongside, giving presenters an at-a-glance cue for tag-team talks.
|
|
83
|
-
|
|
84
87
|
## See Also
|
|
85
88
|
|
|
86
89
|
- [lively](https://github.com/socketry/lively) — The real-time application framework that powers Presently.
|
data/releases.md
CHANGED
data.tar.gz.sig
CHANGED
|
Binary file
|
metadata
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
--- !ruby/object:Gem::Specification
|
|
2
2
|
name: presently
|
|
3
3
|
version: !ruby/object:Gem::Version
|
|
4
|
-
version: 0.
|
|
4
|
+
version: 0.15.0
|
|
5
5
|
platform: ruby
|
|
6
6
|
authors:
|
|
7
7
|
- Samuel Williams
|
|
@@ -44,14 +44,14 @@ dependencies:
|
|
|
44
44
|
requirements:
|
|
45
45
|
- - "~>"
|
|
46
46
|
- !ruby/object:Gem::Version
|
|
47
|
-
version: '0.
|
|
47
|
+
version: '0.18'
|
|
48
48
|
type: :runtime
|
|
49
49
|
prerelease: false
|
|
50
50
|
version_requirements: !ruby/object:Gem::Requirement
|
|
51
51
|
requirements:
|
|
52
52
|
- - "~>"
|
|
53
53
|
- !ruby/object:Gem::Version
|
|
54
|
-
version: '0.
|
|
54
|
+
version: '0.18'
|
|
55
55
|
- !ruby/object:Gem::Dependency
|
|
56
56
|
name: markly
|
|
57
57
|
requirement: !ruby/object:Gem::Requirement
|
|
@@ -243,7 +243,7 @@ required_rubygems_version: !ruby/object:Gem::Requirement
|
|
|
243
243
|
- !ruby/object:Gem::Version
|
|
244
244
|
version: '0'
|
|
245
245
|
requirements: []
|
|
246
|
-
rubygems_version: 4.0.
|
|
246
|
+
rubygems_version: 4.0.10
|
|
247
247
|
specification_version: 4
|
|
248
248
|
summary: A web-based presentation tool built with Lively.
|
|
249
249
|
test_files: []
|
metadata.gz.sig
CHANGED
|
Binary file
|