pagesally Generator

Pages of all Folders ally!

The pagesally Generator builds a static website by enriching the .page files with the content of a frame.html and a menu.html. Different topics can be handled in folders. Every folder has its own menu.html, while the frame.html is in the root folder.

Example frame.html

<!DOCTYPE html>
<html lang="en">
<head>
  <title>{v:title default="The Site"}</title>
  <t:>
  <meta name="description" content="{v:description}" />
  </t:>
  <link href='https://fonts.googleapis.com/css?family=Teko' rel='stylesheet' type='text/css' />
  <style>
    body { max-width: 25cm; margin: 0 auto; }
    header { display: flex; align-items: flex-end; }
    header * { flex-grow: 1; padding: 0; margin: 0; }
    header h2 { text-align: right; flex-grow: 4; }
    main { display: flex; }
    aside { flex-shrink: 0; flex-grow: 1; display: flex; flex-direction: column; align-items: flex-end;}
  </style>
</head>
<body>
  <header>
    <h1>The Site</h1>
    <a${ class="$topic1Class"}$ href="dir1">Topic 1</a>
    <a${ class="$topic2Class"}$ href="dir2">Topic 2</a>
    <h2>{v:topic}</h2>
  </header>
  {v:menu}
</body>
</html>

Example menu.html

  <t:topic>Things of interest</t:topic>
  <main>
    <aside>
      <t: page="/topic1/">The thing</t:>
      <t: page="/topic1/other.html">The other thing</t:>
    </aside>
    <article>
      {v:content}
    </article>
  </main>

Example /topic1/thing.page

    <t:title>Stuff about the thing</t:title>
    <t:description>Hey man, the that's the thing, that's so interesting, you know?</t:description>
    <t:topic1Class>highlight</t:topic1Class>
    <h1>About a thing</h1>
    <p>
      Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et
      dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet
      clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet,
      consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed
      diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata
      sanctus est Lorem ipsum dolor sit amet.
    </p>

How to ally a page

Those files combined might look like this. The files are combined to the static page. If we look into the .page file it defines 2 regions ('title' and 'description') and some html (the 'content'). This 3 elements can than be used in the other files. If we look into menu.html, we see how the 'content' is used. Furthermore, the menu.html defines yet another region: 'topic' and some html, that's called 'menu', here. Looking into frame.html, one can see how 'title', 'description', 'topic', and 'menu' are used. The names of the regions can be chosen freely, and it can be as many as required.

The allies

frame.html: The name 'frame.html' is fixed. There can be exactly one per file set. Here goes the stuff, that's the same for the whole site. If there are pages, that look completely different, they can be kept in the 'resources' folder. The file itself is not part of the generation result.
menu.html: Also he name 'menu.html' is fixed. There can be exactly one per folder or none. If there's none in the current folder, the one of the parent folder is taken. If not even the root folder has one, a small default variant is taken. The file itself is not part of the generation result.
the .page files

  content
    Topic1
      Subtopic1
        index.page
      menu.html
      index.page
      thing.page
    Topic2
      menu.html
      index.page
      other.page
    frame.html
    menu.html
    index.page
    imprint.page
  resources
    img
    script
    styles

    <groupId>org.jproggy.pagesally</groupId>
    <artifactId>pagesally-generator</artifactId>
    <version>1.0.0-SNAPSHOT</version>