Scripting

Expansive supports powerful server-side Javascript in files with a .exp extension. These scripts are run at render time to enable you to create web page content dynamically. This is great for creating pages based on database data or other dynamic data for which static web pages cannot represent.

Javascript ES6

Expansive uses the Javascript ES6 for embedded scripts. This means you have the same great language for server-side scripting as you have in the browser — less learning, more leverage.

Expansive processes embedded scripting at "render-time" using the the Ejscript Javascript Engine. This means that static web pages can use dynamic scripting without a run-time penalty when the site is live.

Creating Dynamic Pages

If a source page, layout or partial has a .exp extension, it will be processed by the Expansive Ejscript service. Javascript code is defined between the <@ code @> tags. For example:

<p>Today's date is <@= Date() @>

The <@= sequence means run the Javascript expression and paste the result here. The <@ sequence (without the equals) means run the Javascript code and do not paste any result. This is useful to iterate over html elements. For example:

<ul>
    <@ for (i = 0; i < 10; i++) { @>
        <li> Item <@= i @> </li>
    <@ } @>
</ul>

This will emit ten item lines.

<ul>
    <li> Item 0 </li>
    <li> Item 1 </li>
    <li> Item 2 </li>
    <li> Item 3 </li>
    <li> Item 4 </li>
    <li> Item 5 </li>
    <li> Item 6 </li>
    <li> Item 7 </li>
    <li> Item 8 </li>
    <li> Item 9 </li>
</ul>

Short Forms

Because variable substitution is so common, Expansive provides some convenient short forms. These can be used outside <@ @> delimiters.

@=expression — to substitute the expression value (no spaces in expression)
@={expression} — to substitute the expression value
@~ — to replace with the relative URL to the application home (top)
@@ — to get a single literal '@' in the rendered document.

<p>Generated on @=meta.date </p>

Relative URLs

The @~ short form can be very useful when constructing relative URLs that may vary depending on what URL the application is hosted.

 <a href="@~/admin/index.html"><button ...></a>