JSP templates

Our panel definitions tell us, what JSP templates we have need to create. A template can

Page layout template

The /WEB-INF/jsp/page.jspx template contains our page layout. Here's the code: 

<!-- Simple layout: title, header, menu, body, footer -->
<jsp:root version="2.0"
  xmlns:base="http://calyxo.odysseus.de/jsp/base"
  xmlns:panels="http://calyxo.odysseus.de/jsp/panels"
  xmlns:jsp="http://java.sun.com/JSP/Page">
  <jsp:directive.page language="java" contentType="text/html"/>
  <!-- since we define the calyxo access here,
       included templates don't need to redefine it. -->
  <base:access var="calyxo"/>
  <html>
    <head>
      <title>${calyxo.panels.param.title}</title>
      <base href="${calyxo.base.context.home}/index.jspx"/>
      <a href="style.css" type="text/css" rel="stylesheet"/>
    </head>
    <body>
      <table width="100%" cellpadding="0" cellspacing="4">
        <tr>
          <td class="header" colspan="2">
            <panels:panel name="header"/>
          </td>
        </tr>
        <tr>
          <td class="menu">
            <panels:panel name="menu"/>
          </td>
          <td class="content">
            <panels:panel name="content"/>
            <div class="messages">
              <panels:panel name="messages"/>
            </div>
          </td>
        </tr>
        <tr>
          <td class="footer" colspan="2">
            <panels:panel name="footer"/>
          </td>
        </tr>
      </table>
    </body>
  </html>
</jsp:root>

The ${calyxo.base.context.home} expression evaluates to an absolute URL pointing to our application, e.g. http://foo.bar.com:8080/login-sample. The HTML base makes sure your browser interprets relative paths as context-relative, not relative to the current request URL.

The template then uses the stylesheet style.css, which we'll create later. This file has to be placed into the application's root directory.

In the simple table-based layout, the template renders the page title and includes its subpanels, as expected.

Menu template

The /WEB-INF/jsp/menu.jspx template iterates over the list of menu items and displays them as links: 

<jsp:root version="2.0"
  xmlns:base="http://calyxo.odysseus.de/jsp/base"
  xmlns:panels="http://calyxo.odysseus.de/jsp/panels"
  xmlns:jsp="http://java.sun.com/JSP/Page">
  <ul>
    <panels:list name="items">
      <li>
        <base:a action="${calyxo.panels.param.action}">
          ${calyxo.panels.param.title}
        </base:a>
      </li>
    </panels:list>
  </ul>
</jsp:root>

Messages template

The /WEB-INF/jsp/messages.jspx template iterates over the action error messages and displays them: 

<jsp:root version="2.0"
  xmlns:c="http://java.sun.com/jsp/jstl/core"
  xmlns:jsp="http://java.sun.com/JSP/Page">
  <c:if test="${!empty calyxo.control.errors}">
    <h3>Action errors</h3>
      <ul>
        <c:forEach var="message"
          items="${calyxo.control.errors.allMessages}">
          <li>${calyxo.base.i18n.format[message]}</li>
        </c:forEach>
      </ul>
  </c:if>
</jsp:root>

Header and footer templates

The /WEB-INF/jsp/header.jspx template displays the application title: 

<jsp:root xmlns:jsp="http://java.sun.com/JSP/Page" version="2.0">
  <h1>${calyxo.panels.param.text}</h1>
</jsp:root>

The /WEB-INF/jsp/footer.jspx template just displays static text: 

<jsp:root xmlns:jsp="http://java.sun.com/JSP/Page" version="2.0">
  <div align="left"><em>Powered by Calyxo!</em></div>
</jsp:root>

The content templates

Roughly spoken, our content templates are our old JSP pages, stripped by the HTML decoration, that has gone to the page layout template.
We begin with the two templates from module outside. Here's the /WEB-INF/jsp/login.jspx template: 

<jsp:root
  xmlns:jsp="http://java.sun.com/JSP/Page"
  xmlns:base="http://calyxo.odysseus.de/jsp/base"
  version="2.0">
  <h3>Login, please...</h3>
  <base:form action="/login">
    <table>
      <tr>
        <td align="right">User Id</td>
        <td><input type="text" name="user"/></td>
      </tr>
      <tr>
        <td align="right">Password</td>
        <td><input type="password" name="password"/></td>
      </tr>
    </table>
    <input type="submit" value="Submit"/>
  </base:form>
</jsp:root>

The /WEB-INF/jsp/goodbye.jspx template is trivial: 

<jsp:root xmlns:jsp="http://java.sun.com/JSP/Page" version="2.0">
  <h3>Goodbye!</h3>
</jsp:root>

The same applies to the /WEB-INF/jsp/welcome.jspx template used by module inside: 

<jsp:root xmlns:jsp="http://java.sun.com/JSP/Page" version="2.0">
  <h3>Welcome, ${user}!</h3>
</jsp:root>