Versions Compared

Old Version 2

changes.mady.by.user Seth Seligman

Saved on

compared with

New Version 3

changes.mady.by.user Seth Seligman

Saved on

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.
Wiki Markup
h2. Overview

This document is intended to describe the standard layout and design for an MIT web application. It is based on the design currently used by InsideMIT java/struts applications, but it should be adaptable to any MVC style environment. The presentation layer is built from a set of templates described below. This make this documentation framework and language neutral, variables are signified with a "$" character, and included files are encloded in brackets, i.e. \[ includeFile \]\\ \\

h2. Layout 

There are two templates uses for page layout:

weblayout_form
weblayout 

Each layout template serves as a container for all the components of a given web page, including the doctype declaration, html header, and body sections. Both layouts contain an html form declaration. The weblayout template has a default form action, while the form action in the weblayout_form template is set via javascript.

Weblayout_form Template 

<\!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

&nbsp; <head>
&nbsp;&nbsp;&nbsp; \[ head.template \]
&nbsp; </head>

&nbsp; <body><div class="portlet-font"><\!-\- This is placed in a separate block from body so the IE hack for small font sizes can be placed on body \-->

&nbsp;&nbsp;&nbsp; <div id="hi1">
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <tiles:insert attribute="header" />
&nbsp;&nbsp;&nbsp; </div><\!-\- End hi1 \-->

&nbsp;&nbsp;&nbsp; <div id="mid"><\!-\- THIS LAYOUT IS ONLY FOR PAGES THAT CAN HAVE A DEFAULT FORM ACTION \-->
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <html-el:form styleId="PageForm" action="${pageAction}" method="post">
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <input type="hidden" name="IDDforward" id="IDDforward" value="" />
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; <%-\- this won't work anymore \--%>
&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; <logic:present name="pageAction">
&nbsp;&nbsp;&nbsp; &nbsp; &nbsp;&nbsp;&nbsp; &nbsp;<bean:define id="pageActionDo"><%= pageAction.toString().substring(1) %>.do</bean:define>
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <button onclick="dojo.mit.formAction('PageForm','<bean:write name="pageActionDo"/>')" style="display:none">This button just enables the enter key to perform the default form action</button>
&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; </logic:present>
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <input type="hidden" name="pageName" id="pageName" value="<tiles:insert attribute="pageName"/>" />
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <input type="hidden" name="IDDforward" id="IDDforward" value="" />

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <div id="nav1">
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <tiles:insert attribute="utilityBox"/>
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <tiles:insert attribute="legend" ignore="true"/>
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; </div>

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <div id="nav2">
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <h1><tiles:insert attribute="pageTitle"/></h1>
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <tiles:insert attribute="messages"/>
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; </div>

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <tiles:insert attribute="body-content">
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <tiles:put name="pageName" beanName="pageName"/>
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <tiles:put name="pageTitle" beanName="pageTitle"/>
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <logic:present name="pageAction">
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <tiles:put name="pageAction" beanName="pageAction"/>
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; </logic:present>
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <logic:present name="backAction">
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <tiles:put name="backAction" beanName="backAction"/>
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; </logic:present>
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <tiles:put name="helpPage" beanName="helpPage"/>
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; </tiles:insert>
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; </html-el:form><\!-\- /form \-->
&nbsp;&nbsp;&nbsp; </div><\!-\- End mid \-->

&nbsp;&nbsp;&nbsp; <div id="lo2">
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <tiles:insert attribute="footer"/>
&nbsp;&nbsp;&nbsp; </div><\!-\- End lo2 \-->
&nbsp; </div></body>
</html:html>

<% log.debug("OUT"); %>
&nbsp;\\ \\ \\ \\ \\

Overview

...