JavaScript is a first-class concept in Tapestry, and sophisticated JavaScript support is provided right out of the box, including rich

...

Ajax and Zones, download optimization, client-side logging, and localization.

In production mode, by default, Tapestry will merge JavaScript libraries, add version numbering, and set a far-future expires header to encourage aggressive browser caching. Starting with version 5.3, Tapestry can also automatically minify (compress) JavaScript libraries when in production mode.

In addition, as will be described in detail below, Tapestry comes with the Prototype and Scriptaculous libraries, or you can easily swap in JQuery using a 3rd-party module.

...

Tapestry provides several ways to add a link to a JavaScript library within your page or component. Although you can use direct <script type="text/javascript" src="xxx.js"></script> approach, you should only use it for JavaScript that resides outside of your application. For JavaScript within your app, Tapestry provides much better ways to do the same thing. Most users choose the simplest, the @Import annotation approach.

{float:right|background=#eee|padding=0 1em} 
*JumpStart Demo:* 
[JavaScript|http://jumpstart.doublenegative.com.au/jumpstart/examples/javascript/javascript] 
{float}

Approach 1: Approach 1: @Import

Use the @Import annotation (or @IncludeJavaScriptLibrary 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.

...

Note: When specifying a file to import, you'll often use the context: binding prefix to indicate that the file is stored in the web application context, and not on the classpath. Relative paths will be on the classpath, relative to the Java class. See Legacy JavaScript See Component Parameters for other binding prefix options.

...

Alternatively, you can use JavaScriptSupport (for Tapestry 5.2 or later) or RenderSupport (for Tapestry 5.0 and 5.1) to include a JavaScript library in your page or component. JavaScriptSupport and RenderSupport are environmental services that include a number of methods that will be used by components, or by services that are called from components. For example:

...

The setupRender method (the name is specifically linked to a render phase) is the correct place to inform the JavaScriptSupport (or RenderSupport) service that the library is needed.

...

...

The addScript method

The addScript method is used when you need to add some JavaScript code directly to the page. This will be inserted at the bottom of the document, and will only be executed when the document has finished loading on the client (i.e., from the window.onload event handler).

...

Minification can be disabled by setting the SymbolConstants.MINIFICATION_ENABLED the tapestry.enable-minification configuration symbol to false in your application's module class (usually AppModule.java). By default it is enabled when in production mode and disabled otherwise.

...

In versions prior to 5.3, Tapestry uses used a modified version of the Blackbird JavaScript console. The Tapestry object includes three functions: debug, warn and error.

Each of these functions take a message and an optional pattern; if the pattern is provided, the message is interpolated on the pattern. The final message is displayed in the Blackbird console, which will make itself visible automatically.

...

Ajax Components and Mixins

Tapestry provides easy-to-use support for Ajax, the technique of using JavaScript to dynamically updating parts of a web page with content from the server without redrawing the whole page.

...

See Ajax and Zones for details.

Built-in Libraries

...

...

Div
style

float: right

...

; max-width

...

: 30%

Panel borderColor #eee titleBGColor #eee title Alternatives to Prototype Tapestry 5.4 includes the ability to switch between Prototype and JQuery. For Tapestry 5.3 and earlier, you also have some options:: Tapestry5-Jquery module – Using JQuery instead of Prototype Tapestry5HowToIntegrateJQuery – Using JQuery in addition to Prototype TAPS-1364 – lists some starting points for ExtJS integration

 

Tapestry 5.4 and earlier come with the Prototype and Scriptaculous libraries ... no extra download is required. Tapestry will automatically link into your pages the prototype.js, scriptaculous.js, and effects.js libraries, as well as the Tapestry library, tapestry.js (which largely consists of support for form input validation). Starting with Tapestry 5.3, Underscore is also included.

Prototype and Scriptaculous Versions

Tapestry included only Prototype and Scriptaculous in versions prior to Tapestry 5.4. See Supported Environments and Versions for a matrix of prototype and scriptaculous versions supported by Tapestry.

In versions before 5.4, Tapestry used

...

Prototype and Scriptaculous Versions

Tapestry uses a modified version of the main Scriptaculous library, scriptaculous.js, with the library's default autoloading behavior turned off. This lets Tapestry and Tapestry components control which Scriptaculus scripts are loaded, rather than having all of them loaded unnecessarily.

...

The Asset is injected, using the ${tapestry.scriptaculous} configuration symbol to reference the location of the Scriptaculous library.

...

@Contribute(JavaScriptStackSource.class)
public static void addMyStack (MappedConfiguration<String, JavaScriptStack> configuration)
{
        configuration.addInstance("MyNewStack", myStack.class);
}

...