1"use strict";(self.webpackChunkdocs=self.webpackChunkdocs||[]).push([[1192],{35743:(e,n,t)=>{t.r(n),t.d(n,{assets:()=>r,contentTitle:()=>o,default:()=>p,frontMatter:()=>a,metadata:()=>l,toc:()=>d});var i=t(85893),s=t(11151);const a={sidebar_position:7},o="Waypoints",l={id:"tutorials/dynamic/waypoints",title:"Waypoints",description:"Waypoints let you name positions in your slide's animation timeline and reference them by label instead of hard-coded subslide numbers. This makes animations easier to maintain \u2014 inserting a pause or item before a waypoint automatically shifts everything that follows. No more counting the subslides yourself.",source:"@site/docs/tutorials/dynamic/waypoints.md",sourceDirName:"tutorials/dynamic",slug:"/tutorials/dynamic/waypoints",permalink:"/docs/tutorials/dynamic/waypoints",draft:!1,unlisted:!1,editUrl:"https://github.com/touying-typ/touying/tree/main/docs/en/tutorials/dynamic/waypoints.md",tags:[],version:"current",sidebarPosition:7,frontMatter:{sidebar_position:7},sidebar:"tutorialSidebar",previous:{title:"Handout Mode",permalink:"/docs/tutorials/dynamic/handout"},next:{title:"Multi-File Architecture",permalink:"/docs/tutorials/multi-file"}},r={},d=[{value:"Basic Usage",id:"basic-usage",level:2},{value:"Implicit Waypoints",id:"implicit-waypoints",level:2},{value:"item-by-item with Waypoints",id:"item-by-item-with-waypoints",level:2},{value:"Non-advancing Waypoints",id:"non-advancing-waypoints",level:2},{value:"Waypoint Markers",id:"waypoint-markers",level:2},{value:"Complex Example",id:"complex-example",level:2},{value:"Explicit Waypoint Starts",id:"explicit-waypoint-starts",level:2},{value:"More Examples",id:"more-examples",level:2}];function c(e){const n={a:"a",blockquote:"blockquote",code:"code",h1:"h1",h2:"h2",p:"p",pre:"pre",table:"table",tbody:"tbody",td:"td",th:"th",thead:"thead",tr:"tr",...(0,s.a)(),...e.components};return(0,i.jsxs)(i.Fragment,{children:[(0,i.jsx)(n.h1,{id:"waypoints",children:"Waypoints"}),"\n",(0,i.jsx)(n.p,{children:"Waypoints let you name positions in your slide's animation timeline and reference them by label instead of hard-coded subslide numbers. This makes animations easier to maintain \u2014 inserting a pause or item before a waypoint automatically shifts everything that follows. No more counting the subslides yourself."}),"\n",(0,i.jsx)(n.h2,{id:"basic-usage",children:"Basic Usage"}),"\n",(0,i.jsxs)(n.p,{children:["Place a ",(0,i.jsx)(n.code,{children:"#waypoint(<label>)"})," to mark a named position, then use the label in ",(0,i.jsx)(n.code,{children:"#uncover"})," or ",(0,i.jsx)(n.code,{children:"#only"}),":"]}),"\n",(0,i.jsx)(n.pre,{children:(0,i.jsx)(n.code,{className:"language-typst",children:"#slide[\n Base content.\n #waypoint(<step-a>)\n #uncover(<step-a>)[Uncovered from step-a.]\n #waypoint(<step-b>)\n #only(<step-b>)[Only during step-b.]\n]\n"})}),"\n",(0,i.jsxs)(n.p,{children:["Each advancing waypoint (the default) creates a new subslide. Here ",(0,i.jsx)(n.code,{children:"<step-a>"})," fires on subslide 2 and ",(0,i.jsx)(n.code,{children:"<step-b>"})," on subslide 3."]}),"\n",(0,i.jsx)(n.h2,{id:"implicit-waypoints",children:"Implicit Waypoints"}),"\n",(0,i.jsxs)(n.p,{children:["When you pass a new label directly to ",(0,i.jsx)(n.code,{children:"#uncover"}),", ",(0,i.jsx)(n.code,{children:"#only"}),", or ",(0,i.jsx)(n.code,{children:"#item-by-item"}),", an implicit waypoint is emitted automatically \u2014 no separate ",(0,i.jsx)(n.code,{children:"#waypoint"})," call needed:"]}),"\n",(0,i.jsx)(n.pre,{children:(0,i.jsx)(n.code,{className:"language-typst",children:"#slide[\n First content.\n #uncover(<reveal>)[Appears from here.]\n #only(<final>)[Only on the last step.]\n]\n"})}),"\n",(0,i.jsx)(n.p,{children:"The implicit waypoint is only registered once per label (the first occurrence wins), so multiple references to the same label share the same position."}),"\n",(0,i.jsx)(n.h2,{id:"item-by-item-with-waypoints",children:"item-by-item with Waypoints"}),"\n",(0,i.jsxs)(n.p,{children:[(0,i.jsx)(n.code,{children:"#item-by-item"})," accepts a label as its ",(0,i.jsx)(n.code,{children:"start"}
1)," parameter. The items begin revealing from that waypoint's position:"]}),"\n",(0,i.jsx)(n.pre,{children:(0,i.jsx)(n.code,{className:"language-typst",children:"#slide[\n #item-by-item(start: <list>)[\n - Alpha\n - Beta\n - Gamma\n ]\n #only(<done>)[All items revealed.]\n]\n"})}),"\n",(0,i.jsxs)(n.p,{children:["This produces 4 subslides: items appear on 2, 3, 4 (the implicit ",(0,i.jsx)(n.code,{children:"<list>"})," waypoint advances to subslide 2), and ",(0,i.jsx)(n.code,{children:"<done>"})," fires on subslide 5."]}),"\n",(0,i.jsxs)(n.blockquote,{children:["\n",(0,i.jsx)(n.p,{children:"Note: Waypoints capture all subslides into their range until a new waypoint follows."}),"\n"]}),"\n",(0,i.jsx)(n.h2,{id:"non-advancing-waypoints",children:"Non-advancing Waypoints"}),"\n",(0,i.jsxs)(n.p,{children:["By default, waypoints advance the subslide counter. Use ",(0,i.jsx)(n.code,{children:"advance: false"})," on explicit waypoints to mark a position without creating a new subslide:"]}),"\n",(0,i.jsx)(n.pre,{children:(0,i.jsx)(n.code,{className:"language-typst",children:"#slide[\n #waypoint(<here>, advance: false)\n Content at the current position.\n]\n"})}),"\n",(0,i.jsx)(n.h2,{id:"waypoint-markers",children:"Waypoint Markers"}),"\n",(0,i.jsxs)(n.p,{children:["For more control, use waypoint markers (",(0,i.jsx)(n.code,{children:"wp-m"}),") to reference specific parts of a waypoint's range:"]}),"\n",(0,i.jsxs)(n.table,{children:[(0,i.jsx)(n.thead,{children:(0,i.jsxs)(n.tr,{children:[(0,i.jsx)(n.th,{children:"Marker"}),(0,i.jsx)(n.th,{children:"Meaning"})]})}),(0,i.jsxs)(n.tbody,{children:[(0,i.jsxs)(n.tr,{children:[(0,i.jsx)(n.td,{children:(0,i.jsx)(n.code,{children:"from-wp(<label>)"})}),(0,i.jsx)(n.td,{children:"All subslides following the first subslide of the waypoint."})]}),(0,i.jsxs)(n.tr,{children:[(0,i.jsx)(n.td,{children:(0,i.jsx)(n.code,{children:"until-wp(<label>)"})}),(0,i.jsx)(n.td,{children:"All subslides until the last subslide of the waypoint's range."})]}),(0,i.jsxs)(n.tr,{children:[(0,i.jsx)(n.td,{children:(0,i.jsx)(n.code,{children:"get-first(<label>)"})}),(0,i.jsx)(n.td,{children:"The first subslide of the waypoint's range."})]}),(0,i.jsxs)(n.tr,{children:[(0,i.jsx)(n.td,{children:(0,i.jsx)(n.code,{children:"get-last(<label>)"})}),(0,i.jsx)(n.td,{children:"The last subslide of the waypoint's range."})]}),(0,i.jsxs)(n.tr,{children:[(0,i.jsx)(n.td,{children:(0,i.jsx)(n.code,{children:"prev-wp(<label>)"})}),(0,i.jsx)(n.td,{children:"The previous waypoint to the given one."})]}),(0,i.jsxs)(n.tr,{children:[(0,i.jsx)(n.td,{children:(0,i.jsx)(n.code,{children:"next-wp(<label>)"})}),(0,i.jsx)(n.td,{children:"The next waypoint to the given one."})]}),(0,i.jsxs)(n.tr,{children:[(0,i.jsx)(n.td,{children:(0,i.jsx)(n.code,{children:"not-wp(<label>)"})}),(0,i.jsx)(n.td,{children:"All subslides not in the waypoint's range."})]})]})]}),"\n",(0,i.jsx)(n.pre,{children:(0,i.jsx)(n.code,{className:"language-typst",children:"#slide[\n #waypoint(<mid>)\n #uncover(<mid>)[Visible during mid.]\n #waypoint(<end>)\n #uncover(from-wp(<mid>))[From mid onward.]\n #only(prev-wp(<end>))[Only before end starts.]\n]\n"})}),"\n",(0,i.jsx)(n.p,{children:"You may even combine waypoint markers to specify the exact behaviour you need:"}),"\n",(0,i.jsx)(n.pre,{children:(0,i.jsx)(n.code,{className:"language-typst",children:"#slide[\n #waypoint(<mid>, advance:false)\n #uncover(<mid>)[Visible during mid.]\n #pause\n Second mid.\n #waypoint(<end>)\n End.\n\n #only(not-wp(get-first(<mid>)))[Soon finished.]\n]\n"})}),"\n",(0,i.jsx)(n.h2,{id:"complex-example",children:"Complex Example"}),"\n",(0,i.jsx)(n.p,{children:"As previously hinted, waypoints capture the range of subslides following them and you can reuse waypoints later to refer to a whole range."}),"\n",(0,i.jsx)(n.pre,{children:(0,i.jsx)(n.code,{className:"language-typst",children:"#slide(composer: (1fr, 1fr))[\n #item-by-item(start: <steps>)[\n - Step one\n - Step two\n - Step three\n ]\n #pause\n Some remark.\n #uncover(<done>)[All done!]\n][\n #alternatives(at: (<steps>, <done>))[\n _Working through the steps..._\n ][\n _Complete!_\n ]\n]\n"})}),"\n",(0,i.jsx)(n.h2,{id:"explicit-waypoint-starts",children:"Explicit Waypoint Starts"}),"\n",(0,i.jsx)(n.p,{children:"You may even set explicit start values for wayp
1oints, both subslide indexes and other waypoints are possible."}),"\n",(0,i.jsx)(n.pre,{children:(0,i.jsx)(n.code,{className:"language-typst",children:"#slide(composer: (1fr, 1fr))[\n #item-by-item(start: <steps>)[\n - Step one\n - Step two\n - Step three\n ]\n #pause\n Some remark.\n #uncover(<done>, start: 4)[All done, even before the remark!]\n][\n #waypoint(<parallel>, start: <done>)\n Explaining stuff.\n #pause\n More explanation.\n]\n"})}),"\n",(0,i.jsx)(n.h2,{id:"more-examples",children:"More Examples"}),"\n",(0,i.jsxs)(n.p,{children:["For a comprehensive set of examples covering all waypoint features \u2014 including callback-style slides, integration to CeTZ and Fletcher, ",(0,i.jsx)(n.code,{children:"recall-subslide"}),", and edge cases \u2014 see ",(0,i.jsx)(n.a,{href:"https://github.com/touying-typ/touying/blob/main/examples/waypoints.typ",children:(0,i.jsx)(n.code,{children:"examples/waypoints.typ"})}),"."]})]})}function p(e={}){const{wrapper:n}={...(0,s.a)(),...e.components};return n?(0,i.jsx)(n,{...e,children:(0,i.jsx)(c,{...e})}):c(e)}},11151:(e,n,t)=>{t.d(n,{Z:()=>l,a:()=>o});var i=t(67294);const s={},a=i.createContext(s);function o(e){const n=i.useContext(a);return i.useMemo((function(){return"function"==typeof e?e(n):{...n,...e}}),[n,e])}function l(e){let n;return n=e.disableParentContext?"function"==typeof e.components?e.components(s):e.components||s:o(e.components),i.createElement(a.Provider,{value:n},e.children)}}}]);
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.