Stacks: push and stack

A component knows which script or stylesheet it needs; the layout knows where those belong. {push 'name'} adds rendered text to a named stack where the component is used, and {stack 'name'} prints the stack - in the <head>, say, far above the components that fill it.

PHP
HTML
fragments/stacks_1.pad
Result
<p>Stylesheets this page needs:</p>
<ul>{stack 'styles'}</ul>

{sequence '1..3', name='n'}
{push 'styles', once='badge'}<li>badge.css</li>{/push}
<span class="badge">badge {$n}</span>
{/sequence}

{push 'styles'}<li>footer.css</li>{/push}

Stylesheets this page needs:

  • badge.css
  • footer.css
badge 1 badge 2 badge 3

Filled in at the end

A page renders from top to bottom, so a {stack} in the head comes out before anything below it has pushed. It prints a marker instead, and the marker is replaced by the stack once the whole page has rendered: it gets every push of the page, made above it or below it, in the order they were made.

once

Where pushes come from