microsling server-side javascript and ESP templates

back to homepage

Server-side javascript code and javascript-based ESP templates can be used by microsling to process requests. The scripts are located by the SlingScriptResolver , as for the Velocity templates (see that page for more details about how this resolution works).

Scripts can either:

Have the .esp extension to use the microsling ECMAscript Server Pages syntax described below.
Have the .js extension to use "raw" javascript.

Server-side javascript support is implemented by the RhinoJavascriptServlet.

To test this, remove or rename Velocity templates if you played with them before (Velocity has priority due to the order in which the SlingServlet classes are setup), and store one of the scripts shown below under /sling/scripts/microsling/example/, using the filenames shown in comments in the scripts below.

Content nodes created with the Content creation forms should then be displayed in HTML, with a layout defined by the example scripts.

As for the Velocity templates, other output formats can be generated, for example by renaming the ESP template to plain.esp (as the Content-type for text is text/plain), modifying it to output plain text and using a .txt extension in the request.

ECMAscript Server Pages (ESP)

ECMAscript Server Pages work much like JSP:

A template mixes javascript code with litteral text that is copied to the output.
<% ... %> tags enclose code blocks.
<%= ... %> tags include the result of a javascript expression in the output.
Several standard objects are available in javascript to access microsling data (TODO: document these objects - for now see the RhinoJavascriptServlet source code)

ESP template example

<%-- microsling ESP template example, store this as html.esp --%>
<html>
<body>
<p>This page is generated from an ESP template!</p>
<h1><%= resource.getURI() %></h1>
<%
  for (var prop in resource.item) {
    %>
      <p>
        <%= resource.item[prop] %>
      </p>
    <%
  }
%>
</body>
</html>

Raw javascript

Raw javascript is probably more useful to handle the POST, PUT or DELETE methods.

Javascript example

// store this as html.js in the repository    
// TODO this is not very useful, rewrite this example
out.println("<html><body>");
out.println("<p>This page is generated from a rhino script</p>");
out.println("<h1>" + resource.getURI() + "</h1>");
out.println("<p>Title: " + resource.getItem().getProperty('title').getString() + "</p>");
out.println("<p>Text: " + resource.getItem().getProperty('text').getString() + "</p>");
out.println("</body></html>");

Directory listing example

Store the following template under sling/scripts/NODETYPES/nt/unstructured/html.esp to render a simple directory listing for nt:unstructured nodes which do not have a slingComponentId property.

<%-- microsling ESP directory listing example -%>
<html>
<body>
<p>This HTML directory listing is generated from an ESP template!</p>
<h1><%= resource.uri %></h1>
<ol>
<%
for (var prop in resource.item) {
    if (resource.item[prop]["text"]) {
        %><li><a href="/microsling<%= resource.item[prop] %>.html"><%= resource.item[prop] %></a></li><%
    }
}
%>
</ol>
</body>
</html>

If you have created some content with the test form, and activated the above template, microsling/content/testing.sling.html should display an HTML directory listing.