rayslides -- slides ported to raylib

See here for the original slides project.

This port is minimalistic, and I wrote it to be able to edit, present, and PDF-export slides on a Mac.

Due to the new raylib dep, builds should work on all 3 major platforms now.

Missing but maybe coming soon:

• SDF-based font scaling

Missing but probably not coming soon:

• PPTX Export
• Editor
• Inspector Gadget

Presentation and Slide Navigation

See the next section for keyboard shortcuts for slideshow control and slide navigation. In addition to using the keyboard, you can also use a "clicker" / "presenter" device.

Keyboard Shortcuts

Shortcut	Description
Q	Quit
ESC	Quit
S	Screen-Shot current slide to PNG
SHIFT + S	Screen-Shot and export slideshow to PDF
F	Toggle fullscreen
L	Toggle laserpointer
SHIFT + L	Iterate laserpointer sizes
C	Clear laserpointer drawing
B	Toggle Beast Mode*
<-	Goto previous slide
PgUp	Goto previous slide
Backspace	Goto previous slide
->	Goto next slide
PgDown	Goto next slide
Space	Goto next slide
1	Goto first slide
0	Goto last slide
G	Goto first slide
Shift + G	Goto last slide

Beast Mode: removes the 60 FPS limit

Slideshow Text Format

Markdown Format

Bulleted items can be placed and nested like this:

- first
    - second (4 space indendation)
        - third ...

Formatting is supported:

Normal text.
**Bold** text.
_italic_ text.
_**Bold italic**_ text.
~~Underlined~~ text.
`rendered with "font_extra" (e.g. "zig showtime" font)`
<#rrggbbaa>Colored with alpha</> text. E.g. <#ff0000ff>red full opacity</>

Slideshow Format

Internal render buffer resolution is 1920x1080. So always use coordinates in this range.

More documentation to follow.

Example of the current text format - see test_public.sld for a more realistic example:

# lines starting with a # sign are comments

# -------------------------------------------------------------
# -- intro slide template
# -------------------------------------------------------------

# Background image

# for a simple colored background:
@bg color=#181818FF

# or a background image:
# @bg img=assets/bgwater.jpg

# change default line height from 1.0 to 1.2
@line_height=1.2

# often-used text elements
@push intro_title    x=150 y=400 w=1700 h=223 fontsize=96 color=#7A7A7AFF
@push intro_subtitle x=219 y=728 w=836 h=246 fontsize=45 color=#cd0f2dff
@push intro_authors  x=219 y=818 w=836 h=246 fontsize=45 color=#993366ff

# the following pushslide will the slide cause to be pushed ("remembered as template"), not rendered
@pushslide intro

# auto-incrementing slide-number is in $slide_number
@push slide_number x=1803 y=1027 w=40   h=40  fontsize=20 color=#404040ff text=$slide_number

# -------------------------------------------------------------
# -- content slide template
# -------------------------------------------------------------
@bg color=#181818FF
@pop slide_number
@pushslide content


# #############################################################
# ##   S  L  I  D  E  S
# #############################################################

# -------------------------------------------------------------
@popslide intro
@pop intro_title text=!Slideshows in <#F7A41DFF>ZIG</>!
@pop intro_subtitle text=_**Easy, text-based slideshows for Hackers**_
@pop intro_authors text=_@renerocksai_

# -------------------------------------------------------------
# Some slide without slide template
# -------------------------------------------------------------
@popslide content

# Images can be placed with explicit dimensions:
# @box img=some_image.png x=800 y=100 w=320 h=200

# Or use auto-dimensions (uses the image's natural size):
# @box img=some_image.png x=800 y=100

# Scale the auto-dimensions:
# @box img=some_image.png x=800 y=100 scale=0.5

# Adjust aspect ratio (w/h) after scaling:
# @box img=some_image.png x=800 y=100 scale=0.5 ratio=0.5

# Only specify width (height auto-calculated to preserve aspect ratio):
# @box img=some_image.png x=800 y=100 w=320

@box x=100 y=100 w=1720 h=880 color=#FFFFFFFF
Here come the bullets:
`
Text in a box can span multiple lines and will be wrapped
according to width
`
`
`
Empty lines consist of a single backtick (see above and below)
`
`
`
Bullet list:
- first
    - some details
- second
- <#808080ff>third</> in a different color

Building it

Just zig build. See build.zig.zon for minimum required zig version.

$ zig build run -- testslides/test_public.sld