You are viewing a plain text version of this content. The canonical link for it is here.
Posted to dev@tapestry.apache.org by bu...@apache.org on 2013/08/18 00:20:32 UTC

svn commit: r875062 - in /websites/production/tapestry/content: cache/main.pageCache javascript.html

Author: buildbot
Date: Sat Aug 17 22:20:32 2013
New Revision: 875062

Log:
Production update by buildbot for tapestry

Modified:
    websites/production/tapestry/content/cache/main.pageCache
    websites/production/tapestry/content/javascript.html

Modified: websites/production/tapestry/content/cache/main.pageCache
==============================================================================
Binary files - no diff available.

Modified: websites/production/tapestry/content/javascript.html
==============================================================================
--- websites/production/tapestry/content/javascript.html (original)
+++ websites/production/tapestry/content/javascript.html Sat Aug 17 22:20:32 2013
@@ -34,9 +34,9 @@
 </div>
 
 <div id="top">
-<div id="smallbanner"><div class="searchbox" style="float:right;margin: .3em 1em .1em 1em">
+<div id="smallbanner"><div class="searchbox" style="float:right;margin: .3em 1em .1em 1em"><p>
 <span style="color: #999; font-size: 90%">Tapestry docs, issues, wikis &amp; blogs:</span>
-<form enctype="application/x-www-form-urlencoded" method="get" action="http://tapestry.apache.org/search.html">
+</p><form enctype="application/x-www-form-urlencoded" method="get" action="http://tapestry.apache.org/search.html">
   <input type="text" name="q">
   <input type="submit" value="Search">
 </form>
@@ -66,7 +66,7 @@
         
                                             </td></tr><tr><td colspan="1" rowspan="1">
                                  <span class="icon icon-page" title="Page">Page:</span>
-                         <a shape="rect" href="javascript-faq.html">JavaScript FAQ</a>
+                         <a shape="rect" href="assets.html">Assets</a>
         
                                             </td></tr><tr><td colspan="1" rowspan="1">
                                  <span class="icon icon-page" title="Page">Page:</span>
@@ -78,7 +78,7 @@
         
                                             </td></tr><tr><td colspan="1" rowspan="1">
                                  <span class="icon icon-page" title="Page">Page:</span>
-                         <a shape="rect" href="assets.html">Assets</a>
+                         <a shape="rect" href="javascript-faq.html">JavaScript FAQ</a>
         
                                             </td></tr></table>
 </div>
@@ -99,30 +99,33 @@
 
 <p>Tapestry provides several ways to add a link to a JavaScript library within your page or component. Although you can use direct <tt>&lt;script type="text/javascript" src="xxx.js"&gt;&lt;/script&gt;</tt> approach, you should only use it for JavaScript that resides outside of your application. For JavaScript within your app, Tapestry provides <em>much</em> better ways to do the same thing. Most users choose the simplest, the @Import annotation approach.</p>
 
+<div class="navmenu" style="float:right; background:#eee; margin:3px; padding:0 1em"><p><b>JumpStart Demo:</b> <br clear="none">
+<a shape="rect" class="external-link" href="http://jumpstart.doublenegative.com.au/jumpstart/examples/javascript/javascript" >JavaScript</a> </p></div> 
+
 <h2><a shape="rect" name="JavaScript-Approach1%3A@Import"></a>Approach 1: @Import</h2>
 
 <p>Use the @<a shape="rect" class="external-link" href="http://tapestry.apache.org/current/apidocs/org/apache/tapestry5/annotations/Import.html">Import</a> annotation (or  @<a shape="rect" class="external-link" href="http://tapestry.apache.org/current/apidocs/org/apache/tapestry5/annotations/IncludeJavaScriptLibrary.html">IncludeJavaScriptLibrary</a> in Tapestry 5.0 and 5.1) to include links to JavaScript (and CSS) files in your page or component. Tapestry ensures that each such file is only referenced once in your page.</p>
 
 <table class="sectionMacro" border="0" cellpadding="5" cellspacing="0" width="100%"><tbody><tr><td colspan="1" rowspan="1" valign="top" class="confluenceTd">
 <div class="code panel" style="border-width: 1px;"><div class="codeHeader panelHeader" style="border-bottom-width: 1px;"><b>For Tapestry 5.2 and later</b></div><div class="codeContent panelContent">
-<pre class="code-java">
-@Import(library={<span class="code-quote">"context:js/jquery.js"</span>,
-		<span class="code-quote">"context:js/myeffects.js"</span>})
-<span class="code-keyword">public</span> class MyComponent
+<script class="theme: Default; brush: java; gutter: false" type="syntaxhighlighter"><![CDATA[
+@Import(library={"context:js/jquery.js",
+		"context:js/myeffects.js"})
+public class MyComponent
 {
  . . .
 }
-</pre>
+]]></script>
 </div></div></td><td colspan="1" rowspan="1" valign="top" class="confluenceTd">
 <div class="code panel" style="border-width: 1px;"><div class="codeHeader panelHeader" style="border-bottom-width: 1px;"><b>For Tapestry 5.0 and 5.1</b></div><div class="codeContent panelContent">
-<pre class="code-java">
-@IncludeJavaScriptLibrary(value={<span class="code-quote">"context:js/jquery.js"</span>,
-		<span class="code-quote">"context:js/myeffects.js"</span>})
-<span class="code-keyword">public</span> class MyComponent
+<script class="theme: Default; brush: java; gutter: false" type="syntaxhighlighter"><![CDATA[
+@IncludeJavaScriptLibrary(value={"context:js/jquery.js",
+		"context:js/myeffects.js"})
+public class MyComponent
 {
  . . .
 }
-</pre>
+]]></script>
 </div></div></td></tr></tbody></table>
 
 <p>@Import may also be applied to individual methods, in which case the import operation only occurs when the method is invoked.</p>
@@ -141,32 +144,32 @@
 
 <table class="sectionMacro" border="0" cellpadding="5" cellspacing="0" width="100%"><tbody><tr><td colspan="1" rowspan="1" valign="top" class="confluenceTd">
 <div class="code panel" style="border-width: 1px;"><div class="codeHeader panelHeader" style="border-bottom-width: 1px;"><b>Tapestry 5.2 and later</b></div><div class="codeContent panelContent">
-<pre class="code-java">
-  @Inject @Path(<span class="code-quote">"context:/js/myeffects.js"</span>)
-  <span class="code-keyword">private</span> Asset myEffects;
+<script class="theme: Default; brush: java; gutter: false" type="syntaxhighlighter"><![CDATA[
+  @Inject @Path("context:/js/myeffects.js")
+  private Asset myEffects;
 
   @Environmental
-  <span class="code-keyword">private</span> JavaScriptSupport javaScriptSupport;
+  private JavaScriptSupport javaScriptSupport;
 
   void setupRender()
   {
     javaScriptSupport.importJavaScriptLibrary(myEffects);
   }
-</pre>
+]]></script>
 </div></div></td><td colspan="1" rowspan="1" valign="top" class="confluenceTd">
 <div class="code panel" style="border-width: 1px;"><div class="codeHeader panelHeader" style="border-bottom-width: 1px;"><b>Tapestry 5.1 and earlier</b></div><div class="codeContent panelContent">
-<pre class="code-java">
-  @Inject @Path(<span class="code-quote">"context:/js/myeffects.js"</span>)
-  <span class="code-keyword">private</span> Asset myEffects;
+<script class="theme: Default; brush: java; gutter: false" type="syntaxhighlighter"><![CDATA[
+  @Inject @Path("context:/js/myeffects.js")
+  private Asset myEffects;
 
   @Environmental
-  <span class="code-keyword">private</span> RenderSupport renderSupport;
+  private RenderSupport renderSupport;
 
   void setupRender()
   {
     renderSupport.addScriptLink(myEffects);
   }
-</pre>
+]]></script>
 </div></div></td></tr></tbody></table>
 
 <p>Tapestry will ensure that the necessary &lt;link&gt; elements are added to the <em>top</em> of the document (in the &lt;head&gt; element). With Tapestry 5.3 and later the new elements are inserted at the bottom of the &lt;head&gt; element; in versions before 5.3 they appear at the top of the &lt;head&gt; element).</p>
@@ -175,24 +178,33 @@
 
 <p>The <tt>setupRender</tt> method (the name is specifically linked to a <a shape="rect" href="component-rendering.html" title="Component Rendering">render phase</a>) is the correct place to inform the JavaScriptSupport (or RenderSupport) service that the library is needed.</p>
 
+<div class="navmenu" style="float:right; background:#eee; margin:3px; padding:0 1em"><p><b>JumpStart Demo:</b> <br clear="none">
+<a shape="rect" class="external-link" href="http://jumpstart.doublenegative.com.au/jumpstart/examples/javascript/reusable" >Reusable JavaScript</a> </p></div> 
+
 <h3><a shape="rect" name="JavaScript-The%7B%7BaddScript%7D%7Dmethod"></a>The <tt>addScript</tt> method</h3>
 
 <p>The <tt>addScript</tt> method is used when you need to add some JavaScript code directly to the page. This will be inserted at the <em>bottom of the document</em>, and will only be executed when the document has finished loading on the client (i.e., from the window.onload event handler).</p>
 
 <table class="sectionMacro" border="0" cellpadding="5" cellspacing="0" width="100%"><tbody><tr><td colspan="1" rowspan="1" valign="top" class="confluenceTd">
 <div class="code panel" style="border-width: 1px;"><div class="codeHeader panelHeader" style="border-bottom-width: 1px;"><b>Tapestry 5.2 and later</b></div><div class="codeContent panelContent">
-<pre class="code-java">
-javaScriptSupport.addScript(
-        <span class="code-quote">"$('%s').observe('click', hideMe());"</span>,
+<script class="theme: Default; brush: java; gutter: false" type="syntaxhighlighter"><![CDATA[
+void afterRender()
+{
+    javaScriptSupport.addScript(
+        "$('%s').observe('click', hideMe());",
         container.getClientId());
-</pre>
+}
+]]></script>
 </div></div></td><td colspan="1" rowspan="1" valign="top" class="confluenceTd">
 <div class="code panel" style="border-width: 1px;"><div class="codeHeader panelHeader" style="border-bottom-width: 1px;"><b>Tapestry 5.1 and earlier</b></div><div class="codeContent panelContent">
-<pre class="code-java">
-void addScript(<span class="code-object">String</span>.format(
-        <span class="code-quote">"$('%s').observe('click', hideMe());"</span>,
+<script class="theme: Default; brush: java; gutter: false" type="syntaxhighlighter"><![CDATA[
+void afterRender()
+{
+    javaScriptSupport.addScript(String.format(
+        "$('%s').observe('click', hideMe());",
         container.getClientId()));
-</pre>
+}
+]]></script>
 </div></div></td></tr></tbody></table>
 
 <p>When calling the method, the format string can include standard substitutions (such as '%s') for arguments. This saves you the trouble of calling String.format() yourself. (For Tapestry 5.1 and earlier, you must call String.format() yourself.) In any case, the formatted JavaScript is added to the script block in the rendered output.</p>
@@ -203,52 +215,52 @@ void addScript(<span class="code-object"
 
 <table class="sectionMacro" border="0" cellpadding="5" cellspacing="0" width="100%"><tbody><tr><td colspan="1" rowspan="1" valign="top" class="confluenceTd">
 <div class="code panel" style="border-width: 1px;"><div class="codeHeader panelHeader" style="border-bottom-width: 1px;"><b>For Tapestry 5.2 and later</b></div><div class="codeContent panelContent">
-<pre class="code-java">
+<script class="theme: Default; brush: java; gutter: false" type="syntaxhighlighter"><![CDATA[
   @Environmental
-  <span class="code-keyword">private</span> JavaScriptSupport javaScriptSupport;
-</pre>
+  private JavaScriptSupport javaScriptSupport;
+]]></script>
 </div></div></td><td colspan="1" rowspan="1" valign="top" class="confluenceTd">
 <div class="code panel" style="border-width: 1px;"><div class="codeHeader panelHeader" style="border-bottom-width: 1px;"><b>For Tapestry 5.0 and 5.1</b></div><div class="codeContent panelContent">
-<pre class="code-java">
+<script class="theme: Default; brush: java; gutter: false" type="syntaxhighlighter"><![CDATA[
   @Environmental
-  <span class="code-keyword">private</span> RenderSupport renderSupport;
-</pre>
+  private RenderSupport renderSupport;
+]]></script>
 </div></div></td></tr></tbody></table>
 
 <p>The @Environmental annotation only works inside components, but occasionally you may want to inject JavaScriptSupport (or RenderSupport) into a service. Fortunately, a proxy has been set up to allow the use of @Inject instead:</p>
 
 <table class="sectionMacro" border="0" cellpadding="5" cellspacing="0" width="100%"><tbody><tr><td colspan="1" rowspan="1" valign="top" class="confluenceTd">
 <div class="code panel" style="border-width: 1px;"><div class="codeHeader panelHeader" style="border-bottom-width: 1px;"><b>For Tapestry 5.2 and later</b></div><div class="codeContent panelContent">
-<pre class="code-java">
+<script class="theme: Default; brush: java; gutter: false" type="syntaxhighlighter"><![CDATA[
   @Inject
-  <span class="code-keyword">private</span> JavaScriptSupport javaScriptSupport;
-</pre>
+  private JavaScriptSupport javaScriptSupport;
+]]></script>
 </div></div></td><td colspan="1" rowspan="1" valign="top" class="confluenceTd">
 <div class="code panel" style="border-width: 1px;"><div class="codeHeader panelHeader" style="border-bottom-width: 1px;"><b>For Tapestry 5.0 and 5.1</b></div><div class="codeContent panelContent">
-<pre class="code-java">
+<script class="theme: Default; brush: java; gutter: false" type="syntaxhighlighter"><![CDATA[
   @Inject
-  <span class="code-keyword">private</span> RenderSupport renderSupport;
-</pre>
+  private RenderSupport renderSupport;
+]]></script>
 </div></div></td></tr></tbody></table>
 
 <p>... or, in a service implementation constructor:</p>
 
 <table class="sectionMacro" border="0" cellpadding="5" cellspacing="0" width="100%"><tbody><tr><td colspan="1" rowspan="1" valign="top" class="confluenceTd">
 <div class="code panel" style="border-width: 1px;"><div class="codeHeader panelHeader" style="border-bottom-width: 1px;"><b>For Tapestry 5.2 and later</b></div><div class="codeContent panelContent">
-<pre class="code-java">
-  <span class="code-keyword">public</span> MyServiceImpl(JavaScriptSupport support)
+<script class="theme: Default; brush: java; gutter: false" type="syntaxhighlighter"><![CDATA[
+  public MyServiceImpl(JavaScriptSupport support)
   {
     . . .
   }
-</pre>
+]]></script>
 </div></div></td><td colspan="1" rowspan="1" valign="top" class="confluenceTd">
 <div class="code panel" style="border-width: 1px;"><div class="codeHeader panelHeader" style="border-bottom-width: 1px;"><b>For Tapestry 5.0 and 5.1</b></div><div class="codeContent panelContent">
-<pre class="code-java">
-  <span class="code-keyword">public</span> MyServiceImpl(RenderSupport support)
+<script class="theme: Default; brush: java; gutter: false" type="syntaxhighlighter"><![CDATA[
+  public MyServiceImpl(RenderSupport support)
   {
     . . .
   }
-</pre>
+]]></script>
 </div></div></td></tr></tbody></table>
 
 <p>Inside a component, you should use @Environmental, to highlight the fact that RenderSupport (like most environmental objects) is only available during rendering, not during action requests.</p>
@@ -280,13 +292,13 @@ void addScript(<span class="code-object"
 <p>IMPORTANT NOTE: The tapestry-core module only provides the empty infrastructure for supporting minification; the actual logic is supplied in the tapestry-yuicompressor module. To use it, you'll need to update your dependencies to include this module.</p>
 
 <div class="code panel" style="border-width: 1px;"><div class="codeHeader panelHeader" style="border-bottom-width: 1px;"><b>Maven pom.xml (partial)</b></div><div class="codeContent panelContent">
-<pre class="code-xml">
-<span class="code-tag">&lt;dependency&gt;</span>
-    <span class="code-tag">&lt;groupId&gt;</span>org.apache.tapestry<span class="code-tag">&lt;/groupId&gt;</span>
-    <span class="code-tag">&lt;artifactId&gt;</span>tapestry-yuicompressor<span class="code-tag">&lt;/artifactId&gt;</span>
-    <span class="code-tag">&lt;version&gt;</span>${tapestry-release-version}<span class="code-tag">&lt;/version&gt;</span>
-<span class="code-tag">&lt;/dependency&gt;</span>
-</pre>
+<script class="theme: Default; brush: xml; gutter: false" type="syntaxhighlighter"><![CDATA[
+&lt;dependency&gt;
+    &lt;groupId&gt;org.apache.tapestry&lt;/groupId&gt;
+    &lt;artifactId&gt;tapestry-yuicompressor&lt;/artifactId&gt;
+    &lt;version&gt;${tapestry-release-version}&lt;/version&gt;
+&lt;/dependency&gt;
+]]></script>
 </div></div>
 
 <p>Gradle would be similar, of course. If you aren't using something like Maven or Gradle, you'll have to download the jar and its dependency (com.yahoo.platform.yui: yuicompressor) yourself.</p>
@@ -311,12 +323,12 @@ void addScript(<span class="code-object"
 <p>Example usage:</p>
 
 <div class="code panel" style="border-width: 1px;"><div class="codeContent panelContent">
-<pre class="code-java">
- Tapestry.debug(<span class="code-quote">"Field id is #{id}, value is #{value}"</span>, field);
+<script class="theme: Default; brush: java; gutter: false" type="syntaxhighlighter"><![CDATA[
+ Tapestry.debug("Field id is #{id}, value is #{value}", field);
 
- Tapestry.error(<span class="code-quote">"Server is not available."</span>);
+ Tapestry.error("Server is not available.");
 
-</pre>
+]]></script>
 </div></div>
 
 <p>With Tapestry 5.3 and later the Blackbird console has been removed; just use the standard console logging features (e.g. <tt>console.log()</tt>) built into modern browsers.</p>
@@ -330,9 +342,9 @@ void addScript(<span class="code-object"
 <p>The correct usage is:</p>
 
 <div class="code panel" style="border-width: 1px;"><div class="codeContent panelContent">
-<pre class="code-java">
-  &lt;a href=<span class="code-quote">"..."</span> onclick=<span class="code-quote">"javascript:Tapestry.waitForPage(event);"</span>&gt; ... &lt;/a&gt;
-</pre>
+<script class="theme: Default; brush: java; gutter: false" type="syntaxhighlighter"><![CDATA[
+  &lt;a href="..." onclick="javascript:Tapestry.waitForPage(event);"&gt; ... &lt;/a&gt;
+]]></script>
 </div></div>
 
 <p>The constant <a shape="rect" class="external-link" href="http://tapestry.apache.org/current/apidocs/org/apache/tapestry5/MarkupConstants.html">MarkupConstants.WAIT_FOR_PAGE</a> contains the part of this snippet inside the quotes.</p>
@@ -363,17 +375,17 @@ void addScript(<span class="code-object"
 <p>For example, you might store a value for an element in one place:</p>
 
 <div class="code panel" style="border-width: 1px;"><div class="codeContent panelContent">
-<pre class="code-java">
+<script class="theme: Default; brush: java; gutter: false" type="syntaxhighlighter"><![CDATA[
   $T(myid).fadeDuration = .5;
-</pre>
+]]></script>
 </div></div>
 
 <p>Then use it somewhere else:</p>
 
 <div class="code panel" style="border-width: 1px;"><div class="codeContent panelContent">
-<pre class="code-java">
-  <span class="code-keyword">new</span> Effect.Fade($(myId), { duration: $T(myid).fadeDuration });
-</pre>
+<script class="theme: Default; brush: java; gutter: false" type="syntaxhighlighter"><![CDATA[
+  new Effect.Fade($(myId), { duration: $T(myid).fadeDuration });
+]]></script>
 </div></div>
 
 
@@ -402,19 +414,19 @@ Tapestry also works well with other Java
 <p>If you need access to other Scriptaculous libraries, you can provide them as follows:</p>
 
 <div class="code panel" style="border-width: 1px;"><div class="codeContent panelContent">
-<pre class="code-java">
-  @Inject @Path(<span class="code-quote">"${tapestry.scriptaculous}/dragdrop.js"</span>)
-  <span class="code-keyword">private</span> Asset dragDropLibrary;
+<script class="theme: Default; brush: java; gutter: false" type="syntaxhighlighter"><![CDATA[
+  @Inject @Path("${tapestry.scriptaculous}/dragdrop.js")
+  private Asset dragDropLibrary;
 
   @Environmental
-  <span class="code-keyword">private</span> JavaScriptSupport javaScriptSupport;
+  private JavaScriptSupport javaScriptSupport;
 
   void setupRender()
   {
     javaScriptSupport.addScriptLink(dragDropLibrary);
   }
 
-</pre>
+]]></script>
 </div></div>
 
 <p>The Asset is injected, using the ${tapestry.scriptaculous} <a shape="rect" href="symbols.html" title="Symbols">symbol</a> to reference the location of the Scriptaculous library.</p>
@@ -449,90 +461,90 @@ Tapestry also works well with other Java
 
 
 <div class="code panel" style="border-width: 1px;"><div class="codeHeader panelHeader" style="border-bottom-width: 1px;"><b>myStack.java</b></div><div class="codeContent panelContent">
-<pre class="code-java">
-<span class="code-keyword">public</span> class myStack <span class="code-keyword">implements</span> JavaScriptStack {
+<script class="theme: Default; brush: java; gutter: false" type="syntaxhighlighter"><![CDATA[
+public class myStack implements JavaScriptStack {
 
-    <span class="code-keyword">private</span> <span class="code-keyword">final</span> AssetSource assetSource;
+    private final AssetSource assetSource;
 
-    <span class="code-keyword">public</span> myStack (<span class="code-keyword">final</span> AssetSource assetSource)
+    public myStack (final AssetSource assetSource)
     {
-        <span class="code-keyword">this</span>.assetSource = assetSource;
+        this.assetSource = assetSource;
     }
 
-    <span class="code-keyword">public</span> <span class="code-object">String</span> getInitialization()
+    public String getInitialization()
     {
-    	<span class="code-keyword">return</span> <span class="code-keyword">null</span>;
+    	return null;
     }
 
 
 
-    <span class="code-keyword">public</span> List&lt;Asset&gt; getJavaScriptLibraries()
+    public List&lt;Asset&gt; getJavaScriptLibraries()
     {
-    	List&lt;Asset&gt; ret = <span class="code-keyword">new</span> ArrayList&lt;Asset&gt;();
+    	List&lt;Asset&gt; ret = new ArrayList&lt;Asset&gt;();
 
-	ret.add(assetSource.getContextAsset(<span class="code-quote">"<span class="code-keyword">static</span>/js/jquery.js"</span>, <span class="code-keyword">null</span>));
+	ret.add(assetSource.getContextAsset("static/js/jquery.js", null));
 
-        ret.add(assetSource.getContextAsset(<span class="code-quote">"<span class="code-keyword">static</span>/js/jquery.ui.core.js"</span>, <span class="code-keyword">null</span>));
+        ret.add(assetSource.getContextAsset("static/js/jquery.ui.core.js", null));
 
-        <span class="code-keyword">return</span> ret;
+        return ret;
     }
 
-    <span class="code-keyword">public</span> List&lt;StylesheetLink&gt; getStylesheets()
+    public List&lt;StylesheetLink&gt; getStylesheets()
     {
-    	List&lt;StylesheetLink&gt; ret = <span class="code-keyword">new</span> ArrayList&lt;StylesheetLink&gt;();
+    	List&lt;StylesheetLink&gt; ret = new ArrayList&lt;StylesheetLink&gt;();
 
-    	ret.add(<span class="code-keyword">new</span> StylesheetLink(assetSource.getContextAsset(<span class="code-quote">"<span class="code-keyword">static</span>/css/style.css"</span>, <span class="code-keyword">null</span>)));
+    	ret.add(new StylesheetLink(assetSource.getContextAsset("static/css/style.css", null)));
 
-	<span class="code-keyword">return</span> ret;
+	return ret;
     }
 
-    <span class="code-keyword">public</span> List&lt;<span class="code-object">String</span>&gt; getStacks()
+    public List&lt;String&gt; getStacks()
     {
-        <span class="code-keyword">return</span> Collections.emptyList();
+        return Collections.emptyList();
     }
 
 }
-</pre>
+]]></script>
 </div></div>
 
 <p>When your new Stack is created, you have to define it in your AppModule.</p>
 
 <div class="code panel" style="border-width: 1px;"><div class="codeHeader panelHeader" style="border-bottom-width: 1px;"><b>AppModule.java</b></div><div class="codeContent panelContent">
-<pre class="code-java">
+<script class="theme: Default; brush: java; gutter: false" type="syntaxhighlighter"><![CDATA[
 @Contribute(JavaScriptStackSource.class)
-<span class="code-keyword">public</span> <span class="code-keyword">static</span> void addMyStack (MappedConfiguration&lt;<span class="code-object">String</span>, JavaScriptStack&gt; configuration)
+public static void addMyStack (MappedConfiguration&lt;String, JavaScriptStack&gt; configuration)
 {
-        configuration.addInstance(<span class="code-quote">"MyNewStack"</span>, myStack.class);
+        configuration.addInstance("MyNewStack", myStack.class);
 }
-</pre>
+]]></script>
 </div></div>
 
 <p>You can now use it in your pages and components, by using the @Import annotation or the JavaScriptSupport service :</p>
 
 <table class="sectionMacro" border="0" cellpadding="5" cellspacing="0" width="100%"><tbody><tr><td colspan="1" rowspan="1" valign="top" class="confluenceTd">
 <div class="code panel" style="border-width: 1px;"><div class="codeHeader panelHeader" style="border-bottom-width: 1px;"><b>With @Import</b></div><div class="codeContent panelContent">
-<pre class="code-java">
-  @Import(stack=<span class="code-quote">"MyNewStack"</span>)
-  <span class="code-keyword">public</span> class myPage {
+<script class="theme: Default; brush: java; gutter: false" type="syntaxhighlighter"><![CDATA[
+  @Import(stack="MyNewStack")
+  public class myPage {
   }
-</pre>
+]]></script>
 </div></div></td><td colspan="1" rowspan="1" valign="top" class="confluenceTd">
 <div class="code panel" style="border-width: 1px;"><div class="codeHeader panelHeader" style="border-bottom-width: 1px;"><b>With JavaScriptSupport</b></div><div class="codeContent panelContent">
-<pre class="code-java">
+<script class="theme: Default; brush: java; gutter: false" type="syntaxhighlighter"><![CDATA[
 @Inject
-<span class="code-keyword">private</span> JavaScriptSupport js;
+private JavaScriptSupport js;
 
 @SetupRender
-<span class="code-keyword">public</span> void importStack(){
-  js.importStack(<span class="code-quote">"MyNewStack"</span>);
+public void importStack(){
+  js.importStack("MyNewStack");
 }
-</pre>
+]]></script>
 </div></div></td></tr></tbody></table></div>
 </div>
 
 <div class="clearer"></div>
 <div id="footer">
-<div id="footer"><p>Apache Tapestry, Tapestry, Apache, the Apache feather logo, and the Apache Tapestry project logo are trademarks of The Apache Software Foundation.</p>
+<div id="footer"><p>Apache Tapestry, Tapestry, Apache, the Apache feather logo, and the Apache Tapestry project logo are trademarks of The Apache Software Foundation.<br clear="none">
 <script type="text/javascript">
   var _gaq = _gaq || [];
   _gaq.push(['_setAccount', 'UA-400821-1']);
@@ -543,7 +555,7 @@ Tapestry also works well with other Java
     ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
     var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
   })();
-</script></div>
+</script></p></div>
 </div>
 		<div id="comments_thread"></div>
 		<script type="text/javascript" src="https://comments.apache.org/show_comments.lua?site=tapestry&amp;page=http://tapestry.apache.org/javascript.html" async="true">