Expresso.Morph (expresso v0.1.0)

Copy Markdown View Source

Gives each element that the auto morph uses a signature of its kind and its content

The auto morph pairs an element of one slide with an element of the next slide when the two have the same kind and the same content. Expresso.Renderer calls sign/1 before the render, and Expresso.Overlay.Render.attributes/1 writes the signature of an element as data-morph-signature. The script in assets/src/morph.ts compares the signatures, so it does not read the content from the page.

Expresso.Element.kinds/0 gives the content of each kind:

  • :text - the text of the rendered element, with one space for each run of white space. The text of a <style> in an inline icon is not part of it, because the render gives each copy its own style rules.
  • :source - the src option of an image or of an embed.
  • :file - the file of a video or of a sound.
  • :drawing - the SVG of the element before the render gives it the ids of its copy, or the SVG of the rendered element.
  • :svg - the SVG of the file of a diagram, before the render gives it the ids of its copy. Two files with the same SVG have the same content.
  • :shape - the kind of a shape and its text.
  • :language - the language of a code element.
  • :label - the label of a stat.

A kind without a content gets no signature. An element with an empty :text, :drawing or :svg content, such as a text area without a text or a diagram with an empty svg element, gets no signature, because two such elements are not the same element. A code without a language and a stat without a label still get a signature. An element with the morph option gets no signature either, because its key gives its partner.

Summary

Functions

Write the signature of each element of a deck that the auto morph uses

Return the signature of a kind of element and its content

Functions

sign(deck)

@spec sign(Expresso.Deck.t()) :: Expresso.Deck.t()

Write the signature of each element of a deck that the auto morph uses

signature(kind, content)

@spec signature(String.t(), String.t()) :: String.t()

Return the signature of a kind of element and its content

The slide template uses this function for the heading of a slide, with the kind "heading" and the text of the heading.

iex> Expresso.Morph.signature("heading", "Coffee") ==
...>   Expresso.Morph.signature("heading", "Coffee")
true
iex> Expresso.Morph.signature("heading", "Coffee") ==
...>   Expresso.Morph.signature("stat", "Coffee")
false