You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@tapestry.apache.org by bu...@apache.org on 2015/07/19 23:21:30 UTC

svn commit: r958985 [25/29] - in /websites/production/tapestry/content: ./ 2009/09/13/ 2009/10/27/ 2009/11/25/ 2010/07/18/ 2010/07/24/ 2010/10/11/ 2010/10/31/ 2010/11/18/ 2010/12/16/ 2010/12/17/ 2011/01/18/ 2011/03/23/ 2011/03/29/ 2011/03/30/ 2011/03/3...

Modified: websites/production/tapestry/content/strategybuilder-service.html
==============================================================================
--- websites/production/tapestry/content/strategybuilder-service.html (original)
+++ websites/production/tapestry/content/strategybuilder-service.html Sun Jul 19 21:21:27 2015
@@ -27,6 +27,16 @@
   </title>
   <link type="text/css" rel="stylesheet" href="/resources/space.css">
 
+    <link href='/resources/highlighter/styles/shCoreCXF.css' rel='stylesheet' type='text/css' />
+  <link href='/resources/highlighter/styles/shThemeCXF.css' rel='stylesheet' type='text/css' />
+  <script src='/resources/highlighter/scripts/shCore.js' type='text/javascript'></script>
+  <script src='/resources/highlighter/scripts/shBrushJava.js' type='text/javascript'></script>
+  <script src='/resources/highlighter/scripts/shBrushXml.js' type='text/javascript'></script>
+  <script src='/resources/highlighter/scripts/shBrushPlain.js' type='text/javascript'></script>
+  <script type="text/javascript">
+  SyntaxHighlighter.defaults['toolbar'] = false;
+  SyntaxHighlighter.all();
+  </script>
 
   <link href="/styles/style.css" rel="stylesheet" type="text/css"/>
 
@@ -57,15 +67,7 @@
   </div>
 
 <div id="content">
-<div id="ConfluenceContent"><style type="text/css">/*<![CDATA[*/
-table.ScrollbarTable  {border: none;padding: 3px;width: 100%;padding: 3px;margin: 0px;background-color: #f0f0f0}
-table.ScrollbarTable td.ScrollbarPrevIcon {text-align: center;width: 16px;border: none;}
-table.ScrollbarTable td.ScrollbarPrevName {text-align: left;border: none;}
-table.ScrollbarTable td.ScrollbarParent {text-align: center;border: none;}
-table.ScrollbarTable td.ScrollbarNextName {text-align: right;border: none;}
-table.ScrollbarTable td.ScrollbarNextIcon {text-align: center;width: 16px;border: none;}
-
-/*]]>*/</style><div class="Scrollbar"><table class="ScrollbarTable"><tr><td colspan="1" rowspan="1" class="ScrollbarPrevIcon"><a shape="rect" href="shadowbuilder-service.html"><img align="middle" border="0" src="https://cwiki.apache.org/confluence/images/icons/back_16.gif" width="16" height="16"></a></td><td colspan="1" rowspan="1" class="ScrollbarPrevName" width="33%"><a shape="rect" href="shadowbuilder-service.html">ShadowBuilder Service</a>&#160;</td><td colspan="1" rowspan="1" class="ScrollbarParent" width="33%"><sup><a shape="rect" href="ioc.html"><img align="middle" border="0" src="https://cwiki.apache.org/confluence/images/icons/up_16.gif" width="8" height="8"></a></sup><a shape="rect" href="ioc.html">IoC</a></td><td colspan="1" rowspan="1" class="ScrollbarNextName" width="33%">&#160;<a shape="rect" href="injection-in-detail.html">Injection in Detail</a></td><td colspan="1" rowspan="1" class="ScrollbarNextIcon"><a shape="rect" href="injection-in-detail.html"><img align="middl
 e" border="0" src="https://cwiki.apache.org/confluence/images/icons/forwd_16.gif" width="16" height="16"></a></td></tr></table></div>
+<div id="ConfluenceContent">
 
 <h1 id="StrategyBuilderService-StrategyPattern">Strategy Pattern</h1>
 
@@ -85,11 +87,11 @@ table.ScrollbarTable td.ScrollbarNextIco
 <p>The StrategyBuilder service (<a shape="rect" class="external-link" href="http://tapestry.apache.org/current/apidocs/org/apache/tapestry5/ioc/services/StrategyBuilder.html">API</a>) creates a service implementation around a strategy registry.</p>
 
 <div class="code panel pdl" style="border-width: 1px;"><div class="codeContent panelContent pdl">
-<script class="brush: java; gutter: false; theme: Default" type="syntaxhighlighter"><![CDATA[
+<pre class="brush: java; gutter: false; theme: Default" style="font-size:12px;">
 public interface StrategyBuilder
 {
     &lt;S&gt; S build(StrategyRegistry&lt;S&gt; registry);
-}]]></script>
+}</pre>
 </div></div>
 
 <p>For a given interface (and matching StrategyRegistry), a service implementation is created. The service interface is determined from the strategy registry.</p>
@@ -107,26 +109,17 @@ public interface StrategyBuilder
 <p>You convert the configuration into a StrategyRegistry, and use that to build the final service:</p>
 
 <div class="code panel pdl" style="border-width: 1px;"><div class="codeContent panelContent pdl">
-<script class="brush: java; gutter: false; theme: Default" type="syntaxhighlighter"><![CDATA[
+<pre class="brush: java; gutter: false; theme: Default" style="font-size:12px;">
   public static MyStrategyService build(Map&lt;Class, MyStrategyService&gt; configuration,
-    @InjectService(&quot;StrategyBuilder&quot;)
+    @InjectService("StrategyBuilder")
     StrategyBuilder builder)
   {
      StategyRegistry&lt;MyStrategyService&gt; registry = StrategyRegistry.newInstance(MyStrategyService.class, configuration);
   
      return builder.build(registry);
-  }]]></script>
+  }</pre>
 </div></div>
-
-<style type="text/css">/*<![CDATA[*/
-table.ScrollbarTable  {border: none;padding: 3px;width: 100%;padding: 3px;margin: 0px;background-color: #f0f0f0}
-table.ScrollbarTable td.ScrollbarPrevIcon {text-align: center;width: 16px;border: none;}
-table.ScrollbarTable td.ScrollbarPrevName {text-align: left;border: none;}
-table.ScrollbarTable td.ScrollbarParent {text-align: center;border: none;}
-table.ScrollbarTable td.ScrollbarNextName {text-align: right;border: none;}
-table.ScrollbarTable td.ScrollbarNextIcon {text-align: center;width: 16px;border: none;}
-
-/*]]>*/</style><div class="Scrollbar"><table class="ScrollbarTable"><tr><td colspan="1" rowspan="1" class="ScrollbarPrevIcon"><a shape="rect" href="shadowbuilder-service.html"><img align="middle" border="0" src="https://cwiki.apache.org/confluence/images/icons/back_16.gif" width="16" height="16"></a></td><td colspan="1" rowspan="1" class="ScrollbarPrevName" width="33%"><a shape="rect" href="shadowbuilder-service.html">ShadowBuilder Service</a>&#160;</td><td colspan="1" rowspan="1" class="ScrollbarParent" width="33%"><sup><a shape="rect" href="ioc.html"><img align="middle" border="0" src="https://cwiki.apache.org/confluence/images/icons/up_16.gif" width="8" height="8"></a></sup><a shape="rect" href="ioc.html">IoC</a></td><td colspan="1" rowspan="1" class="ScrollbarNextName" width="33%">&#160;<a shape="rect" href="injection-in-detail.html">Injection in Detail</a></td><td colspan="1" rowspan="1" class="ScrollbarNextIcon"><a shape="rect" href="injection-in-detail.html"><img align="middl
 e" border="0" src="https://cwiki.apache.org/confluence/images/icons/forwd_16.gif" width="16" height="16"></a></td></tr></table></div></div>
+</div>
 </div>
 
 <div class="clearer"></div>

Modified: websites/production/tapestry/content/support.html
==============================================================================
--- websites/production/tapestry/content/support.html (original)
+++ websites/production/tapestry/content/support.html Sun Jul 19 21:21:27 2015
@@ -57,7 +57,7 @@
   </div>
 
 <div id="content">
-<div id="ConfluenceContent"><p>Apache Tapestry is an open source project and as such, supported by the community. Even if you are looking for commercial support, your best bet for support is to first subscribe to Apache Tapestry user mailing list and ask there. Read more about how to <a shape="rect" href="community.html#Community-GettingInvolved">get involved</a>.</p>
+<div id="ConfluenceContent"><p>Apache Tapestry is an open source project and as such, supported by the community. Even if you are looking for commercial support, your best bet for support is to first subscribe to Apache Tapestry user mailing list and ask there. Read more about how to <a shape="rect" href="community.html">get involved</a>.</p>
 
 <h3 id="Support-CommercialTrainingandSupport">Commercial Training and Support</h3>
 

Modified: websites/production/tapestry/content/supporting-informal-parameters.html
==============================================================================
--- websites/production/tapestry/content/supporting-informal-parameters.html (original)
+++ websites/production/tapestry/content/supporting-informal-parameters.html Sun Jul 19 21:21:27 2015
@@ -27,6 +27,16 @@
   </title>
   <link type="text/css" rel="stylesheet" href="/resources/space.css">
 
+    <link href='/resources/highlighter/styles/shCoreCXF.css' rel='stylesheet' type='text/css' />
+  <link href='/resources/highlighter/styles/shThemeCXF.css' rel='stylesheet' type='text/css' />
+  <script src='/resources/highlighter/scripts/shCore.js' type='text/javascript'></script>
+  <script src='/resources/highlighter/scripts/shBrushJava.js' type='text/javascript'></script>
+  <script src='/resources/highlighter/scripts/shBrushXml.js' type='text/javascript'></script>
+  <script src='/resources/highlighter/scripts/shBrushPlain.js' type='text/javascript'></script>
+  <script type="text/javascript">
+  SyntaxHighlighter.defaults['toolbar'] = false;
+  SyntaxHighlighter.all();
+  </script>
 
   <link href="/styles/style.css" rel="stylesheet" type="text/css"/>
 
@@ -57,15 +67,7 @@
   </div>
 
 <div id="content">
-<div id="ConfluenceContent"><style type="text/css">/*<![CDATA[*/
-table.ScrollbarTable  {border: none;padding: 3px;width: 100%;padding: 3px;margin: 0px;background-color: #f0f0f0}
-table.ScrollbarTable td.ScrollbarPrevIcon {text-align: center;width: 16px;border: none;}
-table.ScrollbarTable td.ScrollbarPrevName {text-align: left;border: none;}
-table.ScrollbarTable td.ScrollbarParent {text-align: center;border: none;}
-table.ScrollbarTable td.ScrollbarNextName {text-align: right;border: none;}
-table.ScrollbarTable td.ScrollbarNextIcon {text-align: center;width: 16px;border: none;}
-
-/*]]>*/</style><div class="Scrollbar"><table class="ScrollbarTable"><tr><td colspan="1" rowspan="1" class="ScrollbarPrevIcon"><a shape="rect" href="error-page-recipe.html"><img align="middle" border="0" src="https://cwiki.apache.org/confluence/images/icons/back_16.gif" width="16" height="16"></a></td><td colspan="1" rowspan="1" class="ScrollbarPrevName" width="33%"><a shape="rect" href="error-page-recipe.html">Error Page Recipe</a>&#160;</td><td colspan="1" rowspan="1" class="ScrollbarParent" width="33%"><sup><a shape="rect" href="cookbook.html"><img align="middle" border="0" src="https://cwiki.apache.org/confluence/images/icons/up_16.gif" width="8" height="8"></a></sup><a shape="rect" href="cookbook.html">Cookbook</a></td><td colspan="1" rowspan="1" class="ScrollbarNextName" width="33%">&#160;<a shape="rect" href="component-libraries.html">Component Libraries</a></td><td colspan="1" rowspan="1" class="ScrollbarNextIcon"><a shape="rect" href="component-libraries.html"><img align="mi
 ddle" border="0" src="https://cwiki.apache.org/confluence/images/icons/forwd_16.gif" width="16" height="16"></a></td></tr></table></div>
+<div id="ConfluenceContent">
 <p></p>
 
 <h2 id="SupportingInformalParameters-SupportingInformalParameters">Supporting Informal Parameters</h2>
@@ -84,7 +86,7 @@ table.ScrollbarTable td.ScrollbarNextIco
 <p>In the example below we create an Img component, a custom replacement for the &lt;img&gt; tag. Its src parameter will be an asset. We'll use the @SupportsInformalParameters annotation to tell Tapestry that the component should support informal parameters.</p>
 
 <div class="code panel pdl" style="border-width: 1px;"><div class="codeContent panelContent pdl">
-<script class="brush: java; gutter: false; theme: Default" type="syntaxhighlighter"><![CDATA[
+<pre class="brush: java; gutter: false; theme: Default" style="font-size:12px;">
 @SupportsInformalParameters
 public class Img
 {
@@ -96,13 +98,13 @@ public class Img
 
     boolean beginRender(MarkupWriter writer)
     {
-         writer.element(&quot;img&quot;, &quot;src&quot;, src);
+         writer.element("img", "src", src);
          resources.renderInformalParameters(writer);
          writer.end();
          return false;
     }
 }
-]]></script>
+</pre>
 </div></div>
 
 <p>The call to renderInformalParameters() is what converts and outputs the informal parameters. It should occur <em>after</em> your code has rendered attributes into the element (earlier written attributes will <em>not</em> be overwritten by later written attributes).</p>
@@ -114,7 +116,7 @@ public class Img
 <p>Another, equivalent, approach is to use the <a shape="rect" class="external-link" href="http://tapestry.apache.org/tapestry5/apidocs/org/apache/tapestry5/corelib/mixins/RenderInformals.html">RenderInformals</a> mixin:</p>
 
 <div class="code panel pdl" style="border-width: 1px;"><div class="codeContent panelContent pdl">
-<script class="brush: java; gutter: false; theme: Default" type="syntaxhighlighter"><![CDATA[
+<pre class="brush: java; gutter: false; theme: Default" style="font-size:12px;">
 public class Img
 {
     @Parameter(required=true, allowNull=false, defaultPrefix=BindingConstants.ASSET)
@@ -125,7 +127,7 @@ public class Img
 
     void beginRender(MarkupWriter writer)
     {
-        writer.element(&quot;img&quot;, &quot;src&quot;, src);
+        writer.element("img", "src", src);
     }
 
     boolean beforeRenderBody(MarkupWriter writer)
@@ -134,7 +136,7 @@ public class Img
         return false;
     }
 }
-]]></script>
+</pre>
 </div></div>
 
 <p>This variation splits the rendering of the tag in two pieces, so that the RenderInformals mixin can operate (after beginRender() and before beforeRenderBody()).</p></div>

Modified: websites/production/tapestry/content/switching-cases.html
==============================================================================
--- websites/production/tapestry/content/switching-cases.html (original)
+++ websites/production/tapestry/content/switching-cases.html Sun Jul 19 21:21:27 2015
@@ -27,6 +27,16 @@
   </title>
   <link type="text/css" rel="stylesheet" href="/resources/space.css">
 
+    <link href='/resources/highlighter/styles/shCoreCXF.css' rel='stylesheet' type='text/css' />
+  <link href='/resources/highlighter/styles/shThemeCXF.css' rel='stylesheet' type='text/css' />
+  <script src='/resources/highlighter/scripts/shCore.js' type='text/javascript'></script>
+  <script src='/resources/highlighter/scripts/shBrushJava.js' type='text/javascript'></script>
+  <script src='/resources/highlighter/scripts/shBrushXml.js' type='text/javascript'></script>
+  <script src='/resources/highlighter/scripts/shBrushPlain.js' type='text/javascript'></script>
+  <script type="text/javascript">
+  SyntaxHighlighter.defaults['toolbar'] = false;
+  SyntaxHighlighter.all();
+  </script>
 
   <link href="/styles/style.css" rel="stylesheet" type="text/css"/>
 
@@ -57,43 +67,35 @@
   </div>
 
 <div id="content">
-<div id="ConfluenceContent"><style type="text/css">/*<![CDATA[*/
-table.ScrollbarTable  {border: none;padding: 3px;width: 100%;padding: 3px;margin: 0px;background-color: #f0f0f0}
-table.ScrollbarTable td.ScrollbarPrevIcon {text-align: center;width: 16px;border: none;}
-table.ScrollbarTable td.ScrollbarPrevName {text-align: left;border: none;}
-table.ScrollbarTable td.ScrollbarParent {text-align: center;border: none;}
-table.ScrollbarTable td.ScrollbarNextName {text-align: right;border: none;}
-table.ScrollbarTable td.ScrollbarNextIcon {text-align: center;width: 16px;border: none;}
-
-/*]]>*/</style><div class="Scrollbar"><table class="ScrollbarTable"><tr><td colspan="1" rowspan="1" class="ScrollbarPrevIcon"><a shape="rect" href="component-libraries.html"><img align="middle" border="0" src="https://cwiki.apache.org/confluence/images/icons/back_16.gif" width="16" height="16"></a></td><td colspan="1" rowspan="1" class="ScrollbarPrevName" width="33%"><a shape="rect" href="component-libraries.html">Component Libraries</a>&#160;</td><td colspan="1" rowspan="1" class="ScrollbarParent" width="33%"><sup><a shape="rect" href="cookbook.html"><img align="middle" border="0" src="https://cwiki.apache.org/confluence/images/icons/up_16.gif" width="8" height="8"></a></sup><a shape="rect" href="cookbook.html">Cookbook</a></td><td colspan="1" rowspan="1" class="ScrollbarNextName" width="33%">&#160;<a shape="rect" href="enum-parameter-recipe.html">Enum Parameter Recipe</a></td><td colspan="1" rowspan="1" class="ScrollbarNextIcon"><a shape="rect" href="enum-parameter-recipe.html"><i
 mg align="middle" border="0" src="https://cwiki.apache.org/confluence/images/icons/forwd_16.gif" width="16" height="16"></a></td></tr></table></div><h1 id="SwitchingCases-SwitchingCases">Switching Cases</h1><p>With Tapestry's <code>If</code> component you can only test one condition at a time. In order to distinguish multiple cases, you'd have to write complex nested if/else constructs in your page template and have a checker method for each test inside your page class.</p><div class="navmenu" style="float:right; background:#eee; margin:3px; padding:0 1em">
+<div id="ConfluenceContent"><h1 id="SwitchingCases-SwitchingCases">Switching Cases</h1><p>With Tapestry's <code>If</code> component you can only test one condition at a time. In order to distinguish multiple cases, you'd have to write complex nested if/else constructs in your page template and have a checker method for each test inside your page class.</p><div class="navmenu" style="float:right; background:#eee; margin:3px; padding:0 1em">
 <p>    <strong>JumpStart Demo:</strong><br clear="none">
     <a shape="rect" class="external-link" href="http://jumpstart.doublenegative.com.au/jumpstart/examples/lang/ifnotnegateswitchelseunless" >If, Not, Negate, Switch, Else, Unless</a></p></div><p>In cases where you have to distinguish multiple cases, the <code>Delegate</code> component comes in. It delegates rendering to some other component, for example a <code>Block</code>. For each case you have, you basically wrap the content inside a <code>Block</code> that doesn't get rendered by default. You then place a Delegate component on your page and point it to a method inside your page class that will decide which of your Blocks should be rendered.</p><p>Imagine for example a use case, where you want to distinguish between 4 cases and you have an int property called <code>whichCase</code> that should be tested against. Your page template would look as follows:</p><div class="code panel pdl" style="border-width: 1px;"><div class="codeHeader panelHeader pdl" style="border-bottom-width: 1
 px;"><b>SwitchMe.tml</b></div><div class="codeContent panelContent pdl">
-<script class="brush: xml; gutter: false; theme: Default" type="syntaxhighlighter"><![CDATA[&lt;html xmlns:t=&quot;http://tapestry.apache.org/schema/tapestry_5_1_0.xsd&quot;&gt;
+<pre class="brush: xml; gutter: false; theme: Default" style="font-size:12px;">&lt;html xmlns:t="http://tapestry.apache.org/schema/tapestry_5_1_0.xsd"&gt;
     &lt;body&gt;
         &lt;h1&gt;Switch&lt;/h1&gt;
 
-        &lt;t:delegate to=&quot;case&quot;/&gt;
+        &lt;t:delegate to="case"/&gt;
 
-        &lt;t:block t:id=&quot;case1&quot;&gt;
+        &lt;t:block t:id="case1"&gt;
             Here is the content for case1.
         &lt;/t:block&gt;
 
-        &lt;t:block t:id=&quot;case2&quot;&gt;
+        &lt;t:block t:id="case2"&gt;
             Here is the content for case2.
         &lt;/t:block&gt;
         
-        &lt;t:block t:id=&quot;case3&quot;&gt;
+        &lt;t:block t:id="case3"&gt;
             Here is the content for case3.
         &lt;/t:block&gt;
         
-        &lt;t:block t:id=&quot;case4&quot;&gt;
+        &lt;t:block t:id="case4"&gt;
             Here is the content for case4.
         &lt;/t:block&gt;
     &lt;/body&gt;
 &lt;/html&gt;
-]]></script>
+</pre>
 </div></div><p>You can see, that the <code>Delegate</code> component's <code>to</code> parameter is bound to the case property of your page class. In your page class you therefore have a <code>getCase()</code> method that is responsible for telling the <code>Delegate</code> component which component should be rendered. For that we are injecting references to the <code>Block}}s defined in your page template into the page class and return the according {{Block</code> in the <code>getCase()</code> method.</p><div class="code panel pdl" style="border-width: 1px;"><div class="codeHeader panelHeader pdl" style="border-bottom-width: 1px;"><b>SwitchMe.java</b></div><div class="codeContent panelContent pdl">
-<script class="brush: java; gutter: false; theme: Default" type="syntaxhighlighter"><![CDATA[public class SwitchMe
+<pre class="brush: java; gutter: false; theme: Default" style="font-size:12px;">public class SwitchMe
 {
     @Persist
     private int whichCase;
@@ -118,7 +120,7 @@ table.ScrollbarTable td.ScrollbarNextIco
         }
     }
 }
-]]></script>
+</pre>
 </div></div><p>Happy switching!</p></div>
 </div>
 

Modified: websites/production/tapestry/content/symbols.html
==============================================================================
--- websites/production/tapestry/content/symbols.html (original)
+++ websites/production/tapestry/content/symbols.html Sun Jul 19 21:21:27 2015
@@ -27,6 +27,16 @@
   </title>
   <link type="text/css" rel="stylesheet" href="/resources/space.css">
 
+    <link href='/resources/highlighter/styles/shCoreCXF.css' rel='stylesheet' type='text/css' />
+  <link href='/resources/highlighter/styles/shThemeCXF.css' rel='stylesheet' type='text/css' />
+  <script src='/resources/highlighter/scripts/shCore.js' type='text/javascript'></script>
+  <script src='/resources/highlighter/scripts/shBrushJava.js' type='text/javascript'></script>
+  <script src='/resources/highlighter/scripts/shBrushXml.js' type='text/javascript'></script>
+  <script src='/resources/highlighter/scripts/shBrushPlain.js' type='text/javascript'></script>
+  <script type="text/javascript">
+  SyntaxHighlighter.defaults['toolbar'] = false;
+  SyntaxHighlighter.all();
+  </script>
 
   <link href="/styles/style.css" rel="stylesheet" type="text/css"/>
 
@@ -57,15 +67,7 @@
   </div>
 
 <div id="content">
-<div id="ConfluenceContent"><style type="text/css">/*<![CDATA[*/
-table.ScrollbarTable  {border: none;padding: 3px;width: 100%;padding: 3px;margin: 0px;background-color: #f0f0f0}
-table.ScrollbarTable td.ScrollbarPrevIcon {text-align: center;width: 16px;border: none;}
-table.ScrollbarTable td.ScrollbarPrevName {text-align: left;border: none;}
-table.ScrollbarTable td.ScrollbarParent {text-align: center;border: none;}
-table.ScrollbarTable td.ScrollbarNextName {text-align: right;border: none;}
-table.ScrollbarTable td.ScrollbarNextIcon {text-align: center;width: 16px;border: none;}
-
-/*]]>*/</style><div class="Scrollbar"><table class="ScrollbarTable"><tr><td colspan="1" rowspan="1" class="ScrollbarPrevIcon"><a shape="rect" href="ordering-by-constraints.html"><img align="middle" border="0" src="https://cwiki.apache.org/confluence/images/icons/back_16.gif" width="16" height="16"></a></td><td colspan="1" rowspan="1" class="ScrollbarPrevName" width="33%"><a shape="rect" href="ordering-by-constraints.html">Ordering by Constraints</a>&#160;</td><td colspan="1" rowspan="1" class="ScrollbarParent" width="33%"><sup><a shape="rect" href="ioc.html"><img align="middle" border="0" src="https://cwiki.apache.org/confluence/images/icons/up_16.gif" width="8" height="8"></a></sup><a shape="rect" href="ioc.html">IoC</a></td><td colspan="1" rowspan="1" class="ScrollbarNextName" width="33%">&#160;<a shape="rect" href="chainbuilder-service.html">ChainBuilder Service</a></td><td colspan="1" rowspan="1" class="ScrollbarNextIcon"><a shape="rect" href="chainbuilder-service.html"><img ali
 gn="middle" border="0" src="https://cwiki.apache.org/confluence/images/icons/forwd_16.gif" width="16" height="16"></a></td></tr></table></div>
+<div id="ConfluenceContent">
 
 <div class="navmenu" style="float:right; background:#eee; margin:3px; padding:3px">
 <div class="error"><span class="error">Error formatting macro: contentbylabel: com.atlassian.confluence.api.service.exceptions.BadRequestException: Could not parse cql : null</span> </div></div>
@@ -79,9 +81,9 @@ table.ScrollbarTable td.ScrollbarNextIco
 <p>The syntax of symbols is based on Ant expressions. That is, the name is surrounded by ${ and } characters:</p>
 
 <div class="code panel pdl" style="border-width: 1px;"><div class="codeContent panelContent pdl">
-<script class="brush: java; gutter: false; theme: Default" type="syntaxhighlighter"><![CDATA[
+<pre class="brush: java; gutter: false; theme: Default" style="font-size:12px;">
 ${some.symbol.name}
-]]></script>
+</pre>
 </div></div>
 
 <p>The value on the inside is the <em>symbol name</em>. By convention, the symbol name is segmented with periods (for example, "tapestry.production-mode").</p>
@@ -97,12 +99,12 @@ ${some.symbol.name}
 <p>For example:</p>
 
 <div class="code panel pdl" style="border-width: 1px;"><div class="codeContent panelContent pdl">
-<script class="brush: java; gutter: false; theme: Default" type="syntaxhighlighter"><![CDATA[
+<pre class="brush: java; gutter: false; theme: Default" style="font-size:12px;">
   public static MyService build(
-      @InjectService(&quot;${some-service-id}&quot;) Collaborator collab)
+      @InjectService("${some-service-id}") Collaborator collab)
   {
     return . . . ;
-  }]]></script>
+  }</pre>
 </div></div>
 
 <p>Here, the symbol name, <code>some-service-id</code> is a service id, such as <code>WackyCollaborator</code>.</p>
@@ -114,14 +116,14 @@ ${some.symbol.name}
 <p>You may also inject symbol values. For example, if you are interested in whether the application is in production mode or developer mode:</p>
 
 <div class="code panel pdl" style="border-width: 1px;"><div class="codeContent panelContent pdl">
-<script class="brush: java; gutter: false; theme: Default" type="syntaxhighlighter"><![CDATA[
+<pre class="brush: java; gutter: false; theme: Default" style="font-size:12px;">
 public class MyService implements MyServiceInterface
 {
-  public MyService(@Value(&quot;${tapestry.production-mode}&quot;) boolean productionMode, ...)
+  public MyService(@Value("${tapestry.production-mode}") boolean productionMode, ...)
   {
     if (productionMode) {
       . . .
-]]></script>
+</pre>
 </div></div>
 
 <p>Here Tapestry has <a shape="rect" href="type-coercion.html">coerced</a> the "tapestry.production-mode" symbol to a boolean to be injected.</p>
@@ -129,14 +131,14 @@ public class MyService implements MyServ
 <p>As an alternative, the @Symbol annotation, may be used:</p>
 
 <div class="code panel pdl" style="border-width: 1px;"><div class="codeContent panelContent pdl">
-<script class="brush: java; gutter: false; theme: Default" type="syntaxhighlighter"><![CDATA[
+<pre class="brush: java; gutter: false; theme: Default" style="font-size:12px;">
 public class MyService implements MyServiceInterface
 {
   public MyService(@Symbol(SymbolConstants.PRODUCTION_MODE) boolean productionMode, ...)
   {
     if (productionMode) {
       . . .
-]]></script>
+</pre>
 </div></div>
 
 <p>This is very useful when a constant value is defined for the symbol; it means that the compiler can catch a typo, rather than detecting it a runtime.</p>
@@ -162,11 +164,11 @@ public class MyService implements MyServ
 <p>From the previous example:</p>
 
 <div class="code panel pdl" style="border-width: 1px;"><div class="codeContent panelContent pdl">
-<script class="brush: java; gutter: false; theme: Default" type="syntaxhighlighter"><![CDATA[
+<pre class="brush: java; gutter: false; theme: Default" style="font-size:12px;">
   public void contributeApplicationDefaults(MappedConfiguration&lt;String, String&gt; configuration)
   {
-    configuration.add(&quot;some-service-id&quot;, &quot;WackyCollaborator&quot;);
-  }]]></script>
+    configuration.add("some-service-id", "WackyCollaborator");
+  }</pre>
 </div></div>
 
 <h3 id="Symbols-FactoryDefaultsProvider">FactoryDefaults Provider</h3>
@@ -182,14 +184,14 @@ public class MyService implements MyServ
 <p>It is possible and valid to define one symbol in terms of one or more other symbols.</p>
 
 <div class="code panel pdl" style="border-width: 1px;"><div class="codeContent panelContent pdl">
-<script class="brush: java; gutter: false; theme: Default" type="syntaxhighlighter"><![CDATA[
+<pre class="brush: java; gutter: false; theme: Default" style="font-size:12px;">
   public void contributeFactoryDefaults(MappedConfiguration&lt;String, String&gt; configuration)
   {
-      configuration.add(&quot;report.url&quot;, &quot;http://${report.host}:${report.port}/${report.path}&quot;);
-      configuration.add(&quot;report.host&quot;, &quot;www.myreportsite.com&quot;);
-      configuration.add(&quot;report.port&quot;, &quot;80&quot;);
-      configuration.add(&quot;report.path&quot;, &quot;/report.cgi&quot;);
-  }]]></script>
+      configuration.add("report.url", "http://${report.host}:${report.port}/${report.path}");
+      configuration.add("report.host", "www.myreportsite.com");
+      configuration.add("report.port", "80");
+      configuration.add("report.path", "/report.cgi");
+  }</pre>
 </div></div>
 
 <p>The ordinary default for <code>report.url</code> will be <code><a shape="rect" class="external-link" href="http://www.myreportsite.com:80/report.cgi" >http://www.myreportsite.com:80/report.cgi</a></code>.</p>
@@ -199,24 +201,15 @@ public class MyService implements MyServ
 <p>Tapestry checks that no symbol is directly or indirectly dependent on itself. For example, the following contribution is illegal:</p>
 
 <div class="code panel pdl" style="border-width: 1px;"><div class="codeContent panelContent pdl">
-<script class="brush: java; gutter: false; theme: Default" type="syntaxhighlighter"><![CDATA[
+<pre class="brush: java; gutter: false; theme: Default" style="font-size:12px;">
   public void contributeApplicationDefaults(MappedConfiguration&lt;String, String&gt; configuration)
   {
-      configuration.add(&quot;report.path&quot;, &quot;${report.url}/report.cgi&quot;);
-  }]]></script>
+      configuration.add("report.path", "${report.url}/report.cgi");
+  }</pre>
 </div></div>
 
 <p>When the <code>report.url</code> is referenced, an exception will be thrown with the message: <em>Symbol 'report.path' is defined in terms of itself (report.path --&gt; report.url --&gt; report.path)</em>.</p>
-
-<style type="text/css">/*<![CDATA[*/
-table.ScrollbarTable  {border: none;padding: 3px;width: 100%;padding: 3px;margin: 0px;background-color: #f0f0f0}
-table.ScrollbarTable td.ScrollbarPrevIcon {text-align: center;width: 16px;border: none;}
-table.ScrollbarTable td.ScrollbarPrevName {text-align: left;border: none;}
-table.ScrollbarTable td.ScrollbarParent {text-align: center;border: none;}
-table.ScrollbarTable td.ScrollbarNextName {text-align: right;border: none;}
-table.ScrollbarTable td.ScrollbarNextIcon {text-align: center;width: 16px;border: none;}
-
-/*]]>*/</style><div class="Scrollbar"><table class="ScrollbarTable"><tr><td colspan="1" rowspan="1" class="ScrollbarPrevIcon"><a shape="rect" href="ordering-by-constraints.html"><img align="middle" border="0" src="https://cwiki.apache.org/confluence/images/icons/back_16.gif" width="16" height="16"></a></td><td colspan="1" rowspan="1" class="ScrollbarPrevName" width="33%"><a shape="rect" href="ordering-by-constraints.html">Ordering by Constraints</a>&#160;</td><td colspan="1" rowspan="1" class="ScrollbarParent" width="33%"><sup><a shape="rect" href="ioc.html"><img align="middle" border="0" src="https://cwiki.apache.org/confluence/images/icons/up_16.gif" width="8" height="8"></a></sup><a shape="rect" href="ioc.html">IoC</a></td><td colspan="1" rowspan="1" class="ScrollbarNextName" width="33%">&#160;<a shape="rect" href="chainbuilder-service.html">ChainBuilder Service</a></td><td colspan="1" rowspan="1" class="ScrollbarNextIcon"><a shape="rect" href="chainbuilder-service.html"><img ali
 gn="middle" border="0" src="https://cwiki.apache.org/confluence/images/icons/forwd_16.gif" width="16" height="16"></a></td></tr></table></div></div>
+</div>
 </div>
 
 <div class="clearer"></div>

Modified: websites/production/tapestry/content/tapestry-for-jsf-users.html
==============================================================================
--- websites/production/tapestry/content/tapestry-for-jsf-users.html (original)
+++ websites/production/tapestry/content/tapestry-for-jsf-users.html Sun Jul 19 21:21:27 2015
@@ -27,6 +27,16 @@
   </title>
   <link type="text/css" rel="stylesheet" href="/resources/space.css">
 
+    <link href='/resources/highlighter/styles/shCoreCXF.css' rel='stylesheet' type='text/css' />
+  <link href='/resources/highlighter/styles/shThemeCXF.css' rel='stylesheet' type='text/css' />
+  <script src='/resources/highlighter/scripts/shCore.js' type='text/javascript'></script>
+  <script src='/resources/highlighter/scripts/shBrushJava.js' type='text/javascript'></script>
+  <script src='/resources/highlighter/scripts/shBrushXml.js' type='text/javascript'></script>
+  <script src='/resources/highlighter/scripts/shBrushPlain.js' type='text/javascript'></script>
+  <script type="text/javascript">
+  SyntaxHighlighter.defaults['toolbar'] = false;
+  SyntaxHighlighter.all();
+  </script>
 
   <link href="/styles/style.css" rel="stylesheet" type="text/css"/>
 
@@ -57,61 +67,45 @@
   </div>
 
 <div id="content">
-<div id="ConfluenceContent"><style type="text/css">/*<![CDATA[*/
-table.ScrollbarTable  {border: none;padding: 3px;width: 100%;padding: 3px;margin: 0px;background-color: #f0f0f0}
-table.ScrollbarTable td.ScrollbarPrevIcon {text-align: center;width: 16px;border: none;}
-table.ScrollbarTable td.ScrollbarPrevName {text-align: left;border: none;}
-table.ScrollbarTable td.ScrollbarParent {text-align: center;border: none;}
-table.ScrollbarTable td.ScrollbarNextName {text-align: right;border: none;}
-table.ScrollbarTable td.ScrollbarNextIcon {text-align: center;width: 16px;border: none;}
-
-/*]]>*/</style><div class="Scrollbar"><table class="ScrollbarTable"><tr><td colspan="1" rowspan="1" class="ScrollbarPrevIcon"><a shape="rect" href="component-cheat-sheet.html"><img align="middle" border="0" src="https://cwiki.apache.org/confluence/images/icons/back_16.gif" width="16" height="16"></a></td><td colspan="1" rowspan="1" class="ScrollbarPrevName" width="33%"><a shape="rect" href="component-cheat-sheet.html">Component Cheat Sheet</a>&#160;</td><td colspan="1" rowspan="1" class="ScrollbarParent" width="33%"><sup><a shape="rect" href="cheat-sheets.html"><img align="middle" border="0" src="https://cwiki.apache.org/confluence/images/icons/up_16.gif" width="8" height="8"></a></sup><a shape="rect" href="cheat-sheets.html">Cheat Sheets</a></td><td colspan="1" rowspan="1" class="ScrollbarNextName" width="33%">&#160;</td></tr></table></div><h1 id="TapestryforJSFUsers-TapestryforJSFUsers">Tapestry for JSF Users</h1><div class="navmenu" style="float:right; background:#eee; margin:3px
 ; padding:3px">
+<div id="ConfluenceContent"><h1 id="TapestryforJSFUsers-TapestryforJSFUsers">Tapestry for JSF Users</h1><div class="navmenu" style="float:right; background:#eee; margin:3px; padding:3px">
 <div class="error"><span class="error">Error formatting macro: contentbylabel: com.atlassian.confluence.api.service.exceptions.BadRequestException: Could not parse cql : null</span> </div></div><p>This isa brief guide for learning Tapestry, designed for those who already know JavaServer Faces (JSF).</p><p>Because both JSF and Tapestry are component oriented frameworks designed to serve mostly the same kinds of problems in similar ways, developers who already know JSF will find it very easy to learn Tapestry. In fact, Facelets, the default view technology in JSF 2.0, was created specifically to give JSF a Tapestry-like templating capability, so Facelets users should feel right at home.</p><p>Since almost all modern JSF applications use Facelets as their view technology, we assume the use of Facelets here when discussing JSF features.</p><p>JSF is a rich, mature web framework specification, and there are lots of smart people who use it productively. This guide isn't intended as a pro-
 versus-con comparison or as advocacy of any kind. Instead, it just attempts to make transitions between the two frameworks easier, regardless of the reason for doing so.</p><h2 id="TapestryforJSFUsers-Side-by-sideComparison">Side-by-side Comparison</h2><p>JSF and Tapestry have a lot of superficial similarities, so the first steps in that transition are all about relating similar concepts, terms and components in your mind:</p><div class="table-wrap"><table class="confluenceTable"><tbody><tr><th colspan="1" rowspan="1" class="confluenceTh"><p>Concepts &amp; Terminology</p></th><th colspan="1" rowspan="1" class="confluenceTh"><p>JSF</p></th><th colspan="1" rowspan="1" class="confluenceTh"><p>Tapestry</p></th></tr><tr><td colspan="1" rowspan="1" class="confluenceTd"><p>Java class associated with a page or component</p></td><td colspan="1" rowspan="1" class="confluenceTd"><p>"Backing Bean"</p></td><td colspan="1" rowspan="1" class="confluenceTd"><p>"<a shape="rect" href="component-class
 es.html">Component Class</a>"</p></td></tr><tr><td colspan="1" rowspan="1" class="confluenceTd"><p>Component attributes/parameters</p></td><td colspan="1" rowspan="1" class="confluenceTd"><p>"attributes"</p></td><td colspan="1" rowspan="1" class="confluenceTd"><p>"<a shape="rect" href="component-parameters.html">parameters</a>"</p></td></tr><tr><th colspan="1" rowspan="1" class="confluenceTh"><p>Common Attributes/Parameters</p></th><th colspan="1" rowspan="1" class="confluenceTh"><p>JSF</p></th><th colspan="1" rowspan="1" class="confluenceTh"><p>Tapestry</p></th></tr><tr><td colspan="1" rowspan="1" class="confluenceTd"><p>HTML Attribute used for invisible instrumentation</p></td><td colspan="1" rowspan="1" class="confluenceTd"><p>jsfc="someComponentType"</p></td><td colspan="1" rowspan="1" class="confluenceTd"><p><a shape="rect" href="component-templates.html">t:type="someComponentType"</a></p></td></tr><tr><td colspan="1" rowspan="1" class="confluenceTd"><p>CSS "class" attribute na
 me</p></td><td colspan="1" rowspan="1" class="confluenceTd"><p>styleClass</p></td><td colspan="1" rowspan="1" class="confluenceTd"><p>class</p></td></tr><tr><td colspan="1" rowspan="1" class="confluenceTd"><p>Alternating "zebra" striped rows</p></td><td colspan="1" rowspan="1" class="confluenceTd"><p>rowclasses="class1,class2"</p></td><td colspan="1" rowspan="1" class="confluenceTd"><p>class="${cycle:class1,class2}" using <a shape="rect" class="external-link" href="https://wiki.apache.org/tapestry/Tapestry5HowToAddBindingPrefixCycle">cycle binding prefix</a>, or with CSS: .rowClass:nth-child(even) {background-color: #e8e8e8;}</p></td></tr><tr><th colspan="1" rowspan="1" class="confluenceTh"><p>Output and Messages</p></th><th colspan="1" rowspan="1" class="confluenceTh"><p>JSF</p></th><th colspan="1" rowspan="1" class="confluenceTh"><p>Tapestry</p></th></tr><tr><td colspan="1" rowspan="1" class="confluenceTd"><p>Escaped HTML from property</p></td><td colspan="1" rowspan="1" class="co
 nfluenceTd"><p>&lt;h:outputText value="myBean.myValue"/&gt;</p></td><td colspan="1" rowspan="1" class="confluenceTd"><p>${myValue}</p></td></tr><tr><td colspan="1" rowspan="1" class="confluenceTd"><p>Raw HTML from property</p></td><td colspan="1" rowspan="1" class="confluenceTd"><p>#{myBean.myValue}</p></td><td colspan="1" rowspan="1" class="confluenceTd"><p><a shape="rect" class="external-link" href="http://tapestry.apache.org/current/apidocs/org/apache/tapestry5/corelib/components/OutputRaw.html">&lt;t:outputRaw value="myValue"/&gt;</a></p></td></tr><tr><td colspan="1" rowspan="1" class="confluenceTd"><p>Error messages</p></td><td colspan="1" rowspan="1" class="confluenceTd"><p>&lt;h:message&gt; and &lt;h:messages&gt;</p></td><td colspan="1" rowspan="1" class="confluenceTd"><p><a shape="rect" class="external-link" href="http://tapestry.apache.org/current/apidocs/org/apache/tapestry5/corelib/components/Error.html">&lt;t:error&gt;</a> and <a shape="rect" class="external-link" href="
 http://tapestry.apache.org/current/apidocs/org/apache/tapestry5/corelib/components/Errors.html">&lt;t:errors&gt;</a> (for forms) or <a shape="rect" class="external-link" href="http://tapestry.apache.org/current/apidocs/org/apache/tapestry5/corelib/components/Alerts.html">&lt;t:alerts&gt;</a></p></td></tr><tr><td colspan="1" rowspan="1" class="confluenceTd"><p>Image display</p></td><td colspan="1" rowspan="1" class="confluenceTd"><p>&lt;h:graphicImage&gt;</p></td><td colspan="1" rowspan="1" class="confluenceTd"><p><em>use standard &lt;img&gt; tag</em></p></td></tr><tr><th colspan="1" rowspan="1" class="confluenceTh"><p>Conditionals and Looping</p></th><th colspan="1" rowspan="1" class="confluenceTh"><p>JSF</p></th><th colspan="1" rowspan="1" class="confluenceTh"><p>Tapestry</p></th></tr><tr><td colspan="1" rowspan="1" class="confluenceTd"><p>Render-time loop</p></td><td colspan="1" rowspan="1" class="confluenceTd"><p>&lt;ui:repeat&gt;</p></td><td colspan="1" rowspan="1" class="conflu
 enceTd"><p><a shape="rect" class="external-link" href="http://tapestry.apache.org/current/apidocs/org/apache/tapestry5/corelib/components/Loop.html">&lt;t:loop&gt;</a></p></td></tr><tr><td colspan="1" rowspan="1" class="confluenceTd"><p>Compile-time loop</p></td><td colspan="1" rowspan="1" class="confluenceTd"><p>&lt;c:forEach&gt;</p></td><td colspan="1" rowspan="1" class="confluenceTd"><p><a shape="rect" class="external-link" href="http://tapestry.apache.org/current/apidocs/org/apache/tapestry5/corelib/components/Loop.html">&lt;t:loop&gt;</a></p></td></tr><tr><td colspan="1" rowspan="1" class="confluenceTd"><p>Conditional</p></td><td colspan="1" rowspan="1" class="confluenceTd"><p>&lt;c:if test="#{myBean.myValue}"&gt;</p></td><td colspan="1" rowspan="1" class="confluenceTd"><p><a shape="rect" class="external-link" href="http://tapestry.apache.org/current/apidocs/org/apache/tapestry5/corelib/components/If.html">&lt;t:if test="myValue"&gt;</a></p></td></tr><tr><td colspan="1" rowspan
 ="1" class="confluenceTd"><p>Conditional</p></td><td colspan="1" rowspan="1" class="confluenceTd"><p>&lt;ui:fragment rendered="#{myBean.someCondition}"/&gt;...&lt;/ui:fragment&gt;</p></td><td colspan="1" rowspan="1" class="confluenceTd"><p><a shape="rect" class="external-link" href="http://tapestry.apache.org/current/apidocs/org/apache/tapestry5/corelib/components/If.html">&lt;t:if test="someCondition"&gt;...&lt;/t:if&gt;</a></p></td></tr><tr><td colspan="1" rowspan="1" class="confluenceTd"><p>Switch</p></td><td colspan="1" rowspan="1" class="confluenceTd"><p>&lt;c:choose&gt;&lt;c:when ... &gt;&lt;/c:choose&gt;</p></td><td colspan="1" rowspan="1" class="confluenceTd"><p>See <a shape="rect" href="switching-cases.html">Switching Cases</a></p></td></tr><tr><td colspan="1" rowspan="1" class="confluenceTd"><p>Server-side comment</p></td><td colspan="1" rowspan="1" class="confluenceTd"><p>&lt;ui:remove&gt;</p></td><td colspan="1" rowspan="1" class="confluenceTd"><p><a shape="rect" href="c
 omponent-templates.html">&lt;t:remove&gt;</a></p></td></tr><tr><th colspan="1" rowspan="1" class="confluenceTh"><p>Links and Buttons</p></th><th colspan="1" rowspan="1" class="confluenceTh"><p>JSF</p></th><th colspan="1" rowspan="1" class="confluenceTh"><p>Tapestry</p></th></tr><tr><td colspan="1" rowspan="1" class="confluenceTd"><p>Navigational link</p></td><td colspan="1" rowspan="1" class="confluenceTd"><p>&lt;h:link outcome="nextpage.xhtml"/&gt;</p></td><td colspan="1" rowspan="1" class="confluenceTd"><p><a shape="rect" class="external-link" href="http://tapestry.apache.org/current/apidocs/org/apache/tapestry5/corelib/components/PageLink.html">&lt;t:pagelink page="nextpage"/&gt;</a></p></td></tr><tr><td colspan="1" rowspan="1" class="confluenceTd"><p>Event-triggering link, without form submission</p></td><td colspan="1" rowspan="1" class="confluenceTd"><p><em>not available</em></p></td><td colspan="1" rowspan="1" class="confluenceTd"><p><a shape="rect" class="external-link" href
 ="http://tapestry.apache.org/current/apidocs/org/apache/tapestry5/corelib/components/ActionLink.html">&lt;t:actionLink&gt;</a> or <a shape="rect" class="external-link" href="http://tapestry.apache.org/current/apidocs/org/apache/tapestry5/corelib/components/EventLink.html">&lt;t:eventLink&gt;</a></p></td></tr><tr><td colspan="1" rowspan="1" class="confluenceTd"><p>Form submission link</p></td><td colspan="1" rowspan="1" class="confluenceTd"><p>&lt;h:commandLink&gt;</p></td><td colspan="1" rowspan="1" class="confluenceTd"><p><a shape="rect" class="external-link" href="http://tapestry.apache.org/current/apidocs/org/apache/tapestry5/corelib/components/LinkSubmit.html">&lt;t:linkSubmit&gt;</a></p></td></tr><tr><td colspan="1" rowspan="1" class="confluenceTd"><p>Form submission button</p></td><td colspan="1" rowspan="1" class="confluenceTd"><p>&lt;h:commandButton&gt;</p></td><td colspan="1" rowspan="1" class="confluenceTd"><p><a shape="rect" class="external-link" href="http://tapestry.apa
 che.org/current/apidocs/org/apache/tapestry5/corelib/components/Submit.html">&lt;t:submit&gt;</a></p></td></tr><tr><td colspan="1" rowspan="1" class="confluenceTd"><p>Link to Javascript file</p></td><td colspan="1" rowspan="1" class="confluenceTd"><p>&lt;h:outputScript&gt;</p></td><td colspan="1" rowspan="1" class="confluenceTd"><p><em>&lt;script&gt; or use @Import in component class</em></p></td></tr><tr><td colspan="1" rowspan="1" class="confluenceTd"><p>Link to CSS file</p></td><td colspan="1" rowspan="1" class="confluenceTd"><p>&lt;h:outputStylesheet&gt;</p></td><td colspan="1" rowspan="1" class="confluenceTd"><p><em>&lt;style&gt; or use @Import in component class</em></p></td></tr><tr><th colspan="1" rowspan="1" class="confluenceTh"><p>Grids, Tables and Trees</p></th><th colspan="1" rowspan="1" class="confluenceTh"><p>JSF</p></th><th colspan="1" rowspan="1" class="confluenceTh"><p>Tapestry</p></th></tr><tr><td colspan="1" rowspan="1" class="confluenceTd"><p>Tabular data in &lt;
 table&gt;</p></td><td colspan="1" rowspan="1" class="confluenceTd"><p>&lt;h:datatable&gt;</p></td><td colspan="1" rowspan="1" class="confluenceTd"><p><a shape="rect" class="external-link" href="http://tapestry.apache.org/current/apidocs/org/apache/tapestry5/corelib/components/Grid.html">&lt;t:grid&gt;</a></p></td></tr><tr><td colspan="1" rowspan="1" class="confluenceTd"><p>Table used for layout</p></td><td colspan="1" rowspan="1" class="confluenceTd"><p>&lt;h:panelGrid&gt; with &lt;h:panelGroup&gt;</p></td><td colspan="1" rowspan="1" class="confluenceTd"><p><em>use standard &lt;table&gt; tag</em></p></td></tr><tr><td colspan="1" rowspan="1" class="confluenceTd"><p>Hierarchical tree</p></td><td colspan="1" rowspan="1" class="confluenceTd"><p><em>depends on component library</em></p></td><td colspan="1" rowspan="1" class="confluenceTd"><p><a shape="rect" class="external-link" href="http://tapestry.apache.org/current/apidocs/org/apache/tapestry5/corelib/components/Tree.html">&lt;t:tree
 &gt;</a></p></td></tr><tr><th colspan="1" rowspan="1" class="confluenceTh"><p>Form Tags/Components</p></th><th colspan="1" rowspan="1" class="confluenceTh"><p>JSF</p></th><th colspan="1" rowspan="1" class="confluenceTh"><p>Tapestry</p></th></tr><tr><td colspan="1" rowspan="1" class="confluenceTd"><p>Form</p></td><td colspan="1" rowspan="1" class="confluenceTd"><p>&lt;h:form&gt;</p></td><td colspan="1" rowspan="1" class="confluenceTd"><p><a shape="rect" class="external-link" href="http://tapestry.apache.org/current/apidocs/org/apache/tapestry5/corelib/components/Form.html">&lt;t:form&gt;</a></p></td></tr><tr><td colspan="1" rowspan="1" class="confluenceTd"><p>Single-line text input field</p></td><td colspan="1" rowspan="1" class="confluenceTd"><p>&lt;h:inputText&gt;</p></td><td colspan="1" rowspan="1" class="confluenceTd"><p><a shape="rect" class="external-link" href="http://tapestry.apache.org/current/apidocs/org/apache/tapestry5/corelib/components/TextField.html">&lt;t:textField&gt
 ;</a></p></td></tr><tr><td colspan="1" rowspan="1" class="confluenceTd"><p>Password field</p></td><td colspan="1" rowspan="1" class="confluenceTd"><p>&lt;h:inputSecret&gt;</p></td><td colspan="1" rowspan="1" class="confluenceTd"><p><a shape="rect" class="external-link" href="http://tapestry.apache.org/current/apidocs/org/apache/tapestry5/corelib/components/PasswordField.html">&lt;t:passwordfield&gt;</a></p></td></tr><tr><td colspan="1" rowspan="1" class="confluenceTd"><p>Select menu</p></td><td colspan="1" rowspan="1" class="confluenceTd"><p>&lt;h:selectOneMenu&gt;</p></td><td colspan="1" rowspan="1" class="confluenceTd"><p><a shape="rect" class="external-link" href="http://tapestry.apache.org/current/apidocs/org/apache/tapestry5/corelib/components/Select.html">&lt;t:select&gt;</a></p></td></tr><tr><td colspan="1" rowspan="1" class="confluenceTd"><p>Checkbox</p></td><td colspan="1" rowspan="1" class="confluenceTd"><p>&lt;h:selectBooleanCheckbox&gt;</p></td><td colspan="1" rowspan="1
 " class="confluenceTd"><p><a shape="rect" class="external-link" href="http://tapestry.apache.org/current/apidocs/org/apache/tapestry5/corelib/components/Checkbox.html">&lt;t:checkbox&gt;</a></p></td></tr><tr><td colspan="1" rowspan="1" class="confluenceTd"><p>Checkbox list</p></td><td colspan="1" rowspan="1" class="confluenceTd"><p>&lt;h:selectManyCheckbox&gt;</p></td><td colspan="1" rowspan="1" class="confluenceTd"><p><a shape="rect" class="external-link" href="http://tapestry.apache.org/current/apidocs/org/apache/tapestry5/corelib/components/Checklist.html">&lt;t:checklist&gt;</a></p></td></tr><tr><td colspan="1" rowspan="1" class="confluenceTd"><p>Radio button list</p></td><td colspan="1" rowspan="1" class="confluenceTd"><p>&lt;h:selectOneRadio&gt;</p></td><td colspan="1" rowspan="1" class="confluenceTd"><p><a shape="rect" class="external-link" href="http://tapestry.apache.org/current/apidocs/org/apache/tapestry5/corelib/components/RadioGroup.html">&lt;t:radioGroup&gt;</a> with <
 a shape="rect" class="external-link" href="http://tapestry.apache.org/current/apidocs/org/apache/tapestry5/corelib/components/Radio.html">&lt;t:radio&gt;</a></p></td></tr><tr><td colspan="1" rowspan="1" class="confluenceTd"><p>Multiple select menu</p></td><td colspan="1" rowspan="1" class="confluenceTd"><p>&lt;h:selectManyListbox&gt;</p></td><td colspan="1" rowspan="1" class="confluenceTd"><p><em>not available</em> (but see Palette and Checklist)</p></td></tr><tr><td colspan="1" rowspan="1" class="confluenceTd"><p>Hidden field</p></td><td colspan="1" rowspan="1" class="confluenceTd"><p>&lt;h:inputHidden&gt;</p></td><td colspan="1" rowspan="1" class="confluenceTd"><p><a shape="rect" class="external-link" href="http://tapestry.apache.org/current/apidocs/org/apache/tapestry5/corelib/components/Hidden.html">&lt;t:hidden&gt;</a></p></td></tr><tr><td colspan="1" rowspan="1" class="confluenceTd"><p>textarea tag</p></td><td colspan="1" rowspan="1" class="confluenceTd"><p>&lt;h:inputTextarea
 &gt;</p></td><td colspan="1" rowspan="1" class="confluenceTd"><p><a shape="rect" class="external-link" href="http://tapestry.apache.org/current/apidocs/org/apache/tapestry5/corelib/components/TextArea.html">&lt;t:textArea&gt;</a></p></td></tr><tr><td colspan="1" rowspan="1" class="confluenceTd"><p>Label tag</p></td><td colspan="1" rowspan="1" class="confluenceTd"><p>&lt;h:outputLabel for="..."&gt;</p></td><td colspan="1" rowspan="1" class="confluenceTd"><p><a shape="rect" class="external-link" href="http://tapestry.apache.org/current/apidocs/org/apache/tapestry5/corelib/components/Label.html">&lt;t:label for="..."&gt;</a></p></td></tr></tbody></table></div><p>Some important notes:</p><ul><li>With Tapestry, you don't use the ${...} syntax with parameters of components. Just use a bare expression within the quotes. For example: &lt;t:textfield value="myProperty"&gt; instead of &lt;t:textfield value="${myProperty}"&gt;, because in the latter case the expression is converted to a read-o
 nly string before the textfield component gets it.</li></ul><h2 id="TapestryforJSFUsers-HelloWorldComparison">Hello World Comparison</h2><p>Faces templates and Tapestry templates are superficially quite similar.</p><div class="sectionColumnWrapper"><div class="sectionMacro"><div class="sectionMacroRow"><div class="columnMacro"><div class="code panel pdl" style="border-width: 1px;"><div class="codeHeader panelHeader pdl" style="border-bottom-width: 1px;"><b>JSF template (helloworld.xhtml)</b></div><div class="codeContent panelContent pdl">
-<script class="brush: xml; gutter: false; theme: Default" type="syntaxhighlighter"><![CDATA[&lt;html xmlns=&quot;http://www.w3.org/1999/xhtml&quot;
-        xmlns:h=&quot;http://java.sun.com/jsf/html&quot;&gt;
+<pre class="brush: xml; gutter: false; theme: Default" style="font-size:12px;">&lt;html xmlns="http://www.w3.org/1999/xhtml"
+        xmlns:h="http://java.sun.com/jsf/html"&gt;
   &lt;h:body&gt;
-    &lt;p&gt;&lt;h:outputText value=&quot;#{helloWorldBean.greeting} /&gt;&lt;/p&gt;
+    &lt;p&gt;&lt;h:outputText value="#{helloWorldBean.greeting} /&gt;&lt;/p&gt;
   &lt;/h:body&gt;
 &lt;/html&gt;
-]]></script>
+</pre>
 </div></div></div><div class="columnMacro"><div class="code panel pdl" style="border-width: 1px;"><div class="codeHeader panelHeader pdl" style="border-bottom-width: 1px;"><b>Tapestry template (HelloWorld.tml)</b></div><div class="codeContent panelContent pdl">
-<script class="brush: xml; gutter: false; theme: Default" type="syntaxhighlighter"><![CDATA[&lt;html&gt;
+<pre class="brush: xml; gutter: false; theme: Default" style="font-size:12px;">&lt;html&gt;
   &lt;body&gt;
     &lt;p&gt;${greeting}&lt;/p&gt;
   &lt;/body&gt;
 &lt;/html&gt;
-]]></script>
+</pre>
 </div></div></div></div></div></div><p>Though these are very similar, notice some differences:</p><ul><li>The #{...} syntax in JSF does not encode the underlying string, so you have to use the &lt;h:outputText&gt; tag if your data may contain HTML reserved characters such as &lt;, &gt;, or &amp;. In contrast, the ${...} syntax in Tapestry <strong>does</strong> encode the underlying string.</li><li>In JSF, backing beans are not necessarily related one-to-one with page templates. Often several templates use the same backing bean, and one template may reference multiple backing beans. In Tapestry, they are always related one-to-one, and therefore you don't have to specify which component class your ${...} expressions are referencing.</li></ul><div class="sectionColumnWrapper"><div class="sectionMacro"><div class="sectionMacroRow"><div class="columnMacro"><div class="code panel pdl" style="border-width: 1px;"><div class="codeHeader panelHeader pdl" style="border-bottom-width: 1px;"><b>J
 SF Backing Bean (HelloWorldBean.java)</b></div><div class="codeContent panelContent pdl">
-<script class="brush: java; gutter: false; theme: Default" type="syntaxhighlighter"><![CDATA[@ManagedBean
+<pre class="brush: java; gutter: false; theme: Default" style="font-size:12px;">@ManagedBean
 @RequestScoped
 public class HelloWorldBean {
     public String getGreeting() {
-        return &quot;Hello, World!&quot;;
+        return "Hello, World!";
     }
 }
-]]></script>
+</pre>
 </div></div></div><div class="columnMacro"><div class="code panel pdl" style="border-width: 1px;"><div class="codeHeader panelHeader pdl" style="border-bottom-width: 1px;"><b>Tapestry page class (HelloWorld.java)</b></div><div class="codeContent panelContent pdl">
-<script class="brush: java; gutter: false; theme: Default" type="syntaxhighlighter"><![CDATA[public class HelloWorld {
+<pre class="brush: java; gutter: false; theme: Default" style="font-size:12px;">public class HelloWorld {
     public String getGreeting() {
-        return &quot;Hello, World!&quot;;
+        return "Hello, World!";
     }
 }
-]]></script>
+</pre>
 </div></div></div></div></div></div><h2 id="TapestryforJSFUsers-Expressionsintemplates">Expressions in templates</h2><p>JSF uses the Unified Expression Language with the #{...} or ${...} syntax for accessing Backing Bean properties. For its part, Tapestry uses the ${...} syntax with a similar but more limited expression language called <a shape="rect" href="property-expressions.html">Property Expressions</a>. Both allow easy access to properties via the usual JavaBean conventions, but with Tapestry you don't have to specify which class the expression starts at (because it always starts at the component class corresponding to the template). Some comparisons:</p><div class="table-wrap"><table class="confluenceTable"><tbody><tr><td colspan="1" rowspan="1" class="confluenceTd"><p>&#160;</p></td><th colspan="1" rowspan="1" class="confluenceTh"><p>JSF Syntax</p></th><th colspan="1" rowspan="1" class="confluenceTh"><p>Tapestry Syntax</p></th></tr><tr><td colspan="1" rowspan="1" class="conf
 luenceTd"><p>Property (calls getEmployeeName() or setEmployeeName())</p></td><td colspan="1" rowspan="1" class="confluenceTd"><p>#{employeeBean.employeeName}</p></td><td colspan="1" rowspan="1" class="confluenceTd"><p>${employeeName}</p></td></tr><tr><td colspan="1" rowspan="1" class="confluenceTd"><p>Boolean property (calls isHourly() or setHourly())</p></td><td colspan="1" rowspan="1" class="confluenceTd"><p>#{employeeBean.hourly}</p></td><td colspan="1" rowspan="1" class="confluenceTd"><p>${hourly}</p></td></tr><tr><td colspan="1" rowspan="1" class="confluenceTd"><p>Property chain</p></td><td colspan="1" rowspan="1" class="confluenceTd"><p>#{employeeBean.address.street}</p></td><td colspan="1" rowspan="1" class="confluenceTd"><p>${address.street}</p></td></tr><tr><td colspan="1" rowspan="1" class="confluenceTd"><p>Null-safe property chain</p></td><td colspan="1" rowspan="1" class="confluenceTd"><p>#{employeeBean.address.street}</p></td><td colspan="1" rowspan="1" class="confluenc
 eTd"><p>${address?.street}</p></td></tr><tr><td colspan="1" rowspan="1" class="confluenceTd"><p>5th element in a List</p></td><td colspan="1" rowspan="1" class="confluenceTd"><p>#{employeeBean.employees[5].name}</p></td><td colspan="1" rowspan="1" class="confluenceTd"><p>${employees.get(5).name}</p></td></tr><tr><td colspan="1" rowspan="1" class="confluenceTd"><p>Negation</p></td><td colspan="1" rowspan="1" class="confluenceTd"><p>#{! employeeBean.hourly}</p></td><td colspan="1" rowspan="1" class="confluenceTd"><p>${! hourly}</p></td></tr><tr><td colspan="1" rowspan="1" class="confluenceTd"><p>Arithmetic &amp; relational operators</p></td><td colspan="1" rowspan="1" class="confluenceTd"><p>+-*/% div mod</p></td><td colspan="1" rowspan="1" class="confluenceTd"><p><em>not available</em></p></td></tr><tr><td colspan="1" rowspan="1" class="confluenceTd"><p>Relational operators</p></td><td colspan="1" rowspan="1" class="confluenceTd"><p>== != ne &lt; lt &gt; gt &lt;= le &gt;= ge</p></td>
 <td colspan="1" rowspan="1" class="confluenceTd"><p><em>not available</em></p></td></tr><tr><td colspan="1" rowspan="1" class="confluenceTd"><p>Ternary operator</p></td><td colspan="1" rowspan="1" class="confluenceTd"><p>#{myBean.foo &lt; 0 ? 'bar' : 'baz'}</p></td><td colspan="1" rowspan="1" class="confluenceTd"><p><em>not available</em></p></td></tr><tr><td colspan="1" rowspan="1" class="confluenceTd"><p>Method calling</p></td><td colspan="1" rowspan="1" class="confluenceTd"><p>#{myBean.employees.size()}</p></td><td colspan="1" rowspan="1" class="confluenceTd"><p>${employees.size()}</p></td></tr><tr><td colspan="1" rowspan="1" class="confluenceTd"><p>Iterated Range</p></td><td colspan="1" rowspan="1" class="confluenceTd"><p><em>not avaialble</em></p></td><td colspan="1" rowspan="1" class="confluenceTd"><p>${1..10}</p></td></tr><tr><td colspan="1" rowspan="1" class="confluenceTd"><p>Iterated Range (calculated)</p></td><td colspan="1" rowspan="1" class="confluenceTd"><p><em>not avai
 alble</em></p></td><td colspan="1" rowspan="1" class="confluenceTd"><p>${1..groupList.size()}</p></td></tr><tr><td colspan="1" rowspan="1" class="confluenceTd"><p>List</p></td><td colspan="1" rowspan="1" class="confluenceTd"><p><em>not available</em></p></td><td colspan="1" rowspan="1" class="confluenceTd"><p>${ [ user.name, user.email, user.phone ] }</p></td></tr><tr><td colspan="1" rowspan="1" class="confluenceTd"><p>Map</p></td><td colspan="1" rowspan="1" class="confluenceTd"><p><em>not available</em></p></td><td colspan="1" rowspan="1" class="confluenceTd"><p>${ { 'id':'4039','type':'hourly' } }</p></td></tr></tbody></table></div><p>Features shown as <em>not available</em> above are absent by design, because (in both Tapestry and JSF) it is considered best to keep complex logic in the component class rather than in the template.</p><h2 id="TapestryforJSFUsers-EventHandling&amp;PageNavigation">Event Handling &amp; Page Navigation</h2><h3 id="TapestryforJSFUsers-Eventhandling">Eve
 nt handling</h3><p>In JSF, you specify the event via the <code>action</code> parameter (for example, &lt;h:commandButton value="Submit" action="employeeBean.saveChanges"&gt;). For Tapestry, event handler methods are found by method naming conventions (onSomeEvent() or by method annotations (@Event), based on a combination of the "t:id" attribute and event name, and the action name used depends on the component. For example, the "&lt;t:actionlink&gt;" component in Tapestry emits an "action" event when clicked, and you handle that event in your "onAction()" method.</p><h2 id="TapestryforJSFUsers-Validation">Validation</h2><p>Tapestry applications can use JSR 303 Bean Validation annotations that JSF users should be familiar with:</p><div class="code panel pdl" style="border-width: 1px;"><div class="codeContent panelContent pdl">
-<script class="brush: java; gutter: false; theme: Default" type="syntaxhighlighter"><![CDATA[public class Employee {
-    @Validate(&quot;required,minlength=2,maxlength=100&quot;)
+<pre class="brush: java; gutter: false; theme: Default" style="font-size:12px;">public class Employee {
+    @Validate("required,minlength=2,maxlength=100")
     private String lastName;
     @NotNull @Email private String email;
-]]></script>
-</div></div><h3 id="TapestryforJSFUsers-Post-Redirect-GetNavigation">Post-Redirect-Get Navigation</h3><p>By default, most JSF URLs are "one page behind". That is, when you click on an &lt;h:commandLink&gt; link or submit a form, the request goes back to the originating page, and the server returns the contents of the <strong>next</strong> page &#8211; but the URL in the browser shows the previous page's URL. To fix this in JSF you add the "?faces-redirect=true" to the URL you return from event handlers, which causes JSF to send a redirect to the browser to navigate to the next page.</p><p>By contrast, Tapestry implements this Post-Redirect-Get pattern by default. The URL will always reflect the page you're seeing, not the page you just came from.</p><p>Note that by default Tapestry does not save property values across the Post-Redirect-Get cycle. This means that you have to consider how (and whether) to persist property values from one page to the next. The usual solution is to eith
 er make the values part of the page's <a shape="rect" href="navigation.html#Navigation-PageActivation">Activation Context</a> (which means the values will be appended to the URL) or <a shape="rect" href="persistent-page-data.html">@Persist the properties</a> the values in the session.</p><h2 id="TapestryforJSFUsers-CustomandCompositeComponents">Custom and Composite Components</h2><p>With JSF, creating custom components is an <a shape="rect" class="external-link" href="http://jsfcorner.blogspot.com/2011/01/custom-components.html" >advanced topic</a>. In fact, many JSF developers have <em>never</em> created a custom component. In JSF 1.x, creating each custom component requires a lot of work: creating 3 Java classes (component, component renderer and component tag), registering the component in an XML file, and registering the tag in the .tld file. In JSF 2.x <em>composite components</em> can be created without too much work (if your needs can be met by combining existing components <
 em>and</em> you don't need any custom Java), but you still have to use cumbersome &lt;composite:interface&gt; and &lt;composite:implementation&gt; tags in your component templates, and you have to list the composite components in the xml namespace declaration at the top of the pages where you are using them.</p><p>Creating true custom components in JSF 2.0 still requires several steps: create a component class (generally having the @FacesComponent annotation and extending UIComponentBase), create a renderer class (generally extending Renderer), add a &lt;renderer&gt; section to the facesconfig file, and create a *-taglib.xml file in the WEB_INF folder that defines the namespace, tag and component type of the custom component.</p><p>In contrast, with Tapestry, <a shape="rect" href="component-classes.html">creating custom components</a> is a <em>beginner</em> topic: it is expected to be a daily activity for developers, because it is so easy. In fact, the steps are the same as creating
  a page. All you have to do is create a (potentially empty) Java class in a "components" sub-package, and create a template file containing (X)HTML markup in the corresponding "components" sub-folder within your package hierarchy under /src/main/resources. You <em>use</em> a custom component just like you use any built-in Tapestry component: <code>&lt;t:mycomponent&gt;</code>.</p><p>Because they're so easy to create, Tapestry applications tend to have a lot of custom components and much less repetition of HTML than most JSF applications.</p><h2 id="TapestryforJSFUsers-OtherReferences">Other References</h2><ul><li><a shape="rect" class="external-link" href="http://blog.tapestry5.de/wp-content/uploads/2010/06/JSF-2.0-vs-Tapestry-5.pdf" >JavaServer Faces 2.0 vs. Tapestry 5: A Head-to-Head Comparison</a> slides by Igor Drobiazko, June 2010.</li><li><a shape="rect" class="external-link" href="http://docs.oracle.com/javaee/6/tutorial/doc/gkhxa.html" >Composite Components: Advanced Topics 
 and Example</a> part of <em>The Java EE 6 Tutorial</em> from Oracle</li></ul><style type="text/css">/*<![CDATA[*/
-table.ScrollbarTable  {border: none;padding: 3px;width: 100%;padding: 3px;margin: 0px;background-color: #f0f0f0}
-table.ScrollbarTable td.ScrollbarPrevIcon {text-align: center;width: 16px;border: none;}
-table.ScrollbarTable td.ScrollbarPrevName {text-align: left;border: none;}
-table.ScrollbarTable td.ScrollbarParent {text-align: center;border: none;}
-table.ScrollbarTable td.ScrollbarNextName {text-align: right;border: none;}
-table.ScrollbarTable td.ScrollbarNextIcon {text-align: center;width: 16px;border: none;}
-
-/*]]>*/</style><div class="Scrollbar"><table class="ScrollbarTable"><tr><td colspan="1" rowspan="1" class="ScrollbarPrevIcon"><a shape="rect" href="component-cheat-sheet.html"><img align="middle" border="0" src="https://cwiki.apache.org/confluence/images/icons/back_16.gif" width="16" height="16"></a></td><td colspan="1" rowspan="1" class="ScrollbarPrevName" width="33%"><a shape="rect" href="component-cheat-sheet.html">Component Cheat Sheet</a>&#160;</td><td colspan="1" rowspan="1" class="ScrollbarParent" width="33%"><sup><a shape="rect" href="cheat-sheets.html"><img align="middle" border="0" src="https://cwiki.apache.org/confluence/images/icons/up_16.gif" width="8" height="8"></a></sup><a shape="rect" href="cheat-sheets.html">Cheat Sheets</a></td><td colspan="1" rowspan="1" class="ScrollbarNextName" width="33%">&#160;</td></tr></table></div></div>
+</pre>
+</div></div><h3 id="TapestryforJSFUsers-Post-Redirect-GetNavigation">Post-Redirect-Get Navigation</h3><p>By default, most JSF URLs are "one page behind". That is, when you click on an &lt;h:commandLink&gt; link or submit a form, the request goes back to the originating page, and the server returns the contents of the <strong>next</strong> page &#8211; but the URL in the browser shows the previous page's URL. To fix this in JSF you add the "?faces-redirect=true" to the URL you return from event handlers, which causes JSF to send a redirect to the browser to navigate to the next page.</p><p>By contrast, Tapestry implements this Post-Redirect-Get pattern by default. The URL will always reflect the page you're seeing, not the page you just came from.</p><p>Note that by default Tapestry does not save property values across the Post-Redirect-Get cycle. This means that you have to consider how (and whether) to persist property values from one page to the next. The usual solution is to eith
 er make the values part of the page's <a shape="rect" href="navigation.html">Activation Context</a> (which means the values will be appended to the URL) or <a shape="rect" href="persistent-page-data.html">@Persist the properties</a> the values in the session.</p><h2 id="TapestryforJSFUsers-CustomandCompositeComponents">Custom and Composite Components</h2><p>With JSF, creating custom components is an <a shape="rect" class="external-link" href="http://jsfcorner.blogspot.com/2011/01/custom-components.html" >advanced topic</a>. In fact, many JSF developers have <em>never</em> created a custom component. In JSF 1.x, creating each custom component requires a lot of work: creating 3 Java classes (component, component renderer and component tag), registering the component in an XML file, and registering the tag in the .tld file. In JSF 2.x <em>composite components</em> can be created without too much work (if your needs can be met by combining existing components <em>and</em> you don't need
  any custom Java), but you still have to use cumbersome &lt;composite:interface&gt; and &lt;composite:implementation&gt; tags in your component templates, and you have to list the composite components in the xml namespace declaration at the top of the pages where you are using them.</p><p>Creating true custom components in JSF 2.0 still requires several steps: create a component class (generally having the @FacesComponent annotation and extending UIComponentBase), create a renderer class (generally extending Renderer), add a &lt;renderer&gt; section to the facesconfig file, and create a *-taglib.xml file in the WEB_INF folder that defines the namespace, tag and component type of the custom component.</p><p>In contrast, with Tapestry, <a shape="rect" href="component-classes.html">creating custom components</a> is a <em>beginner</em> topic: it is expected to be a daily activity for developers, because it is so easy. In fact, the steps are the same as creating a page. All you have to d
 o is create a (potentially empty) Java class in a "components" sub-package, and create a template file containing (X)HTML markup in the corresponding "components" sub-folder within your package hierarchy under /src/main/resources. You <em>use</em> a custom component just like you use any built-in Tapestry component: <code>&lt;t:mycomponent&gt;</code>.</p><p>Because they're so easy to create, Tapestry applications tend to have a lot of custom components and much less repetition of HTML than most JSF applications.</p><h2 id="TapestryforJSFUsers-OtherReferences">Other References</h2><ul><li><a shape="rect" class="external-link" href="http://blog.tapestry5.de/wp-content/uploads/2010/06/JSF-2.0-vs-Tapestry-5.pdf" >JavaServer Faces 2.0 vs. Tapestry 5: A Head-to-Head Comparison</a> slides by Igor Drobiazko, June 2010.</li><li><a shape="rect" class="external-link" href="http://docs.oracle.com/javaee/6/tutorial/doc/gkhxa.html" >Composite Components: Advanced Topics and Example</a> part of <e
 m>The Java EE 6 Tutorial</em> from Oracle</li></ul></div>
 </div>
 
 <div class="clearer"></div>

Modified: websites/production/tapestry/content/tapestry-inversion-of-control-faq.html
==============================================================================
--- websites/production/tapestry/content/tapestry-inversion-of-control-faq.html (original)
+++ websites/production/tapestry/content/tapestry-inversion-of-control-faq.html Sun Jul 19 21:21:27 2015
@@ -27,6 +27,16 @@
   </title>
   <link type="text/css" rel="stylesheet" href="/resources/space.css">
 
+    <link href='/resources/highlighter/styles/shCoreCXF.css' rel='stylesheet' type='text/css' />
+  <link href='/resources/highlighter/styles/shThemeCXF.css' rel='stylesheet' type='text/css' />
+  <script src='/resources/highlighter/scripts/shCore.js' type='text/javascript'></script>
+  <script src='/resources/highlighter/scripts/shBrushJava.js' type='text/javascript'></script>
+  <script src='/resources/highlighter/scripts/shBrushXml.js' type='text/javascript'></script>
+  <script src='/resources/highlighter/scripts/shBrushPlain.js' type='text/javascript'></script>
+  <script type="text/javascript">
+  SyntaxHighlighter.defaults['toolbar'] = false;
+  SyntaxHighlighter.all();
+  </script>
 
   <link href="/styles/style.css" rel="stylesheet" type="text/css"/>
 
@@ -57,15 +67,7 @@
   </div>
 
 <div id="content">
-<div id="ConfluenceContent"><style type="text/css">/*<![CDATA[*/
-table.ScrollbarTable  {border: none;padding: 3px;width: 100%;padding: 3px;margin: 0px;background-color: #f0f0f0}
-table.ScrollbarTable td.ScrollbarPrevIcon {text-align: center;width: 16px;border: none;}
-table.ScrollbarTable td.ScrollbarPrevName {text-align: left;border: none;}
-table.ScrollbarTable td.ScrollbarParent {text-align: center;border: none;}
-table.ScrollbarTable td.ScrollbarNextName {text-align: right;border: none;}
-table.ScrollbarTable td.ScrollbarNextIcon {text-align: center;width: 16px;border: none;}
-
-/*]]>*/</style><div class="Scrollbar"><table class="ScrollbarTable"><tr><td colspan="1" rowspan="1" class="ScrollbarPrevIcon"><a shape="rect" href="injection-faq.html"><img align="middle" border="0" src="https://cwiki.apache.org/confluence/images/icons/back_16.gif" width="16" height="16"></a></td><td colspan="1" rowspan="1" class="ScrollbarPrevName" width="33%"><a shape="rect" href="injection-faq.html">Injection FAQ</a>&#160;</td><td colspan="1" rowspan="1" class="ScrollbarParent" width="33%"><sup><a shape="rect" href="frequently-asked-questions.html"><img align="middle" border="0" src="https://cwiki.apache.org/confluence/images/icons/up_16.gif" width="8" height="8"></a></sup><a shape="rect" href="frequently-asked-questions.html">Frequently Asked Questions</a></td><td colspan="1" rowspan="1" class="ScrollbarNextName" width="33%">&#160;<a shape="rect" href="security-faq.html">Security FAQ</a></td><td colspan="1" rowspan="1" class="ScrollbarNextIcon"><a shape="rect" href="security-faq
 .html"><img align="middle" border="0" src="https://cwiki.apache.org/confluence/images/icons/forwd_16.gif" width="16" height="16"></a></td></tr></table></div>
+<div id="ConfluenceContent">
 
 <h2 id="TapestryInversionofControlFAQ-TapestryInversionofControlContainer">Tapestry Inversion of Control Container</h2>
 
@@ -91,7 +93,7 @@ table.ScrollbarTable td.ScrollbarNextIco
 <p>This same concern applies to any long-lived resource (a thread, a database connection, a JMS queue connection) that a service may hold onto.  Your code needs to know when the application has been undeployed and shutdown.  This is actually quite easy, by adding some post-injection logic to your implementation class.</p>
 
 <div class="code panel pdl" style="border-width: 1px;"><div class="codeContent panelContent pdl">
-<script class="brush: java; gutter: true; theme: Default" type="syntaxhighlighter"><![CDATA[
+<pre class="brush: java; gutter: true; theme: Default" style="font-size:12px;">
 public class MyServiceImpl implements MyService
 {
   private boolean shuttingDown;
@@ -119,7 +121,7 @@ public class MyServiceImpl implements My
     });
   }
 }
-]]></script>
+</pre>
 </div></div>
 
 <p>After Tapestry invokes the constructor of the service implementation, and after it performs any field injections, it invokes post injection methods. The methods must be public and return void.  Parameters to a post injection method represent further injections ... in the above example, the RegistryShutdownHub is injected into the PostInjection method, since it is only used inside that one method.</p>
@@ -139,16 +141,7 @@ public class MyServiceImpl implements My
 <p>Sometimes a service does extra work that is desirable at application startup: examples may be registering message handlers with a JMS implementation, or setting up indexing.  Since the service's constructor (or <a shape="rect" class="external-link" href="http://tapestry.apache.org/current/apidocs/org/apache/tapestry5/ioc/annotations/PostInjection.html">@PostInjection</a> methods) are not invoked until the service is realized.</p>
 
 <p>The solution is the <a shape="rect" class="external-link" href="http://tapestry.apache.org/current/apidocs/org/apache/tapestry5/ioc/annotations/EagerLoad.html">@EagerLoad</a> annotation; service implementation classes marked with this annotation are loaded when the Registry is first startup, rather than lazily.</p>
-
-<style type="text/css">/*<![CDATA[*/
-table.ScrollbarTable  {border: none;padding: 3px;width: 100%;padding: 3px;margin: 0px;background-color: #f0f0f0}
-table.ScrollbarTable td.ScrollbarPrevIcon {text-align: center;width: 16px;border: none;}
-table.ScrollbarTable td.ScrollbarPrevName {text-align: left;border: none;}
-table.ScrollbarTable td.ScrollbarParent {text-align: center;border: none;}
-table.ScrollbarTable td.ScrollbarNextName {text-align: right;border: none;}
-table.ScrollbarTable td.ScrollbarNextIcon {text-align: center;width: 16px;border: none;}
-
-/*]]>*/</style><div class="Scrollbar"><table class="ScrollbarTable"><tr><td colspan="1" rowspan="1" class="ScrollbarPrevIcon"><a shape="rect" href="injection-faq.html"><img align="middle" border="0" src="https://cwiki.apache.org/confluence/images/icons/back_16.gif" width="16" height="16"></a></td><td colspan="1" rowspan="1" class="ScrollbarPrevName" width="33%"><a shape="rect" href="injection-faq.html">Injection FAQ</a>&#160;</td><td colspan="1" rowspan="1" class="ScrollbarParent" width="33%"><sup><a shape="rect" href="frequently-asked-questions.html"><img align="middle" border="0" src="https://cwiki.apache.org/confluence/images/icons/up_16.gif" width="8" height="8"></a></sup><a shape="rect" href="frequently-asked-questions.html">Frequently Asked Questions</a></td><td colspan="1" rowspan="1" class="ScrollbarNextName" width="33%">&#160;<a shape="rect" href="security-faq.html">Security FAQ</a></td><td colspan="1" rowspan="1" class="ScrollbarNextIcon"><a shape="rect" href="security-faq
 .html"><img align="middle" border="0" src="https://cwiki.apache.org/confluence/images/icons/forwd_16.gif" width="16" height="16"></a></td></tr></table></div></div>
+</div>
 </div>
 
 <div class="clearer"></div>