zpt

<!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <title>Expressions</title> <script type="text/javascript" src="../lib/zpt.min.js" defer></script> <script type="text/javascript" src="../js/zpt.js" defer></script> <script type="text/javascript" src="../lib/syntaxHighlighter/lib.js"></script> <link rel="stylesheet" type="text/css" href="../docs.css"> <link rel="stylesheet" type="text/css" href="../lib/syntaxHighlighter/theme.css"> </head> <body> <div data-use-macro="'page@templates.html'"> <div data-fill-slot="'page-header'"> <h1>ZPT-JS tutorial - Expressions</h1> <ul> <li><a href="#intro">Intro</a>.</li> <li><a href="#path">Path expressions</a>.</li> <li><a href="#arithmethic">Arithmethic expressions</a>.</li> <li><a href="#boolean">Boolean expressions</a>.</li> <li><a href="#comparison">Comparison expressions</a>.</li> <li><a href="#scripting">Scripting expressions</a>.</li> <li><a href="#misc">Misc expressions</a>.</li> </ul> </div> <article data-fill-slot="'article'"> <h2 data-attributes="id 'intro'">Intro</h2> Do you remember how we can replace the content of any tag? Take a look at this template: sample.html <pre class="brush: html; highlight: [4]"> <html> <body> This is the title. </body> </html> </pre> title in the data-content attribute is an expression. An expression can be evaluated by ZPT-JS to a value: this value is used by the data-content attribute to replace its contents. Expressions are used widely by the tags of ZPT-JS. <h2 data-attributes="id 'path'">Path expressions</h2> There are several types of expressions. The title is a variable expression, a subtype of path expressions. ZPT-JS evaluates it replacing it by its value in the dictionary (really in the scope). Very simple! Literal expressions are also very simple. They represent constant values: <pre class="brush: html"> a string literal an integer number a float number a boolean true value a boolean false value </pre> Every path expression starts with a variable name. The available variable names refer either to objects or variables defined in the dictionary or within the Page Template. Let's see some examples of path expressions! <pre class="brush: html"> any friends? </pre> To evaluate user/name, ZPT-JS evaluates first user as an object and then searchs its name property. This is a property expression. <pre class="brush: html"> any friends? </pre> This example will be evaluated to 'no friends' if user/name is evaluated to false. So this allows to set default values. <pre class="brush: html"> birth </pre> To evaluate user/birth(), ZPT-JS identifies first user as an object, then searchs its birth method, then evaluates their arguments (in this case there is none) and run it. This is a method expression. Path expressions can be as complex as you wish: <pre class="brush: html"> a day </pre> ZPT-JS evaluates first user as an object, then searchs its getData method, then evaluates their arguments (in this case a string literal: personal), run it and then get the day property of the resulting object. <pre class="brush: html"> birth </pre> ZPT-JS identifies first myFunction as a function, then evaluates their arguments and run it. This is a function expression. <pre class="brush: html"> element 0 of items element index of items </pre> These are some examples of array expressions. The first one evaluates to the first element of the items array. The second one to item number index. <pre class="brush: html"> 1, 5, 99 and number 'a', 'b', 99 and number 4, 6, 8 and number </pre> These are some examples of list expressions. The first one evaluates to an array with elements 1, 5, 99 and number. Mixing elements of different type is supported: the second one evaluates to an array with elements 'a', 'b', 99 and number. The third one includes a range expression: 4:8:2. The first argument (4) defines the number to start, the second one (8) the number to stop and the third one (2) the step. It evaluates to 4, 6, 8. So the full expression evaluates to 4, 6, 8 and number. Lists are very versatile: <pre class="brush: html"> evaluates to 1,2,3,10 evaluates to 4,1,2,3,10 </pre> Don't forget to not use spaces inside ranges! <pre class="brush: html"> this will not work! </pre> <h2 data-attributes="id 'arithmethic'">Arithmethic expressions</h2> Arithmethic expressions define expressions using math operations: <pre class="brush: html"> must be 9 must be 1 must be 20 must be 23 must be 2 must be 202 </pre> The first 5 use these math operations: add (+:), substract (-:), multiply (*:), divide (/:) and module (%:). The last one shows a more complex expression that uses parenthesis. Lists expressions can be used in arithmethic operations: <pre class="brush: html"> evaluates to 1+2+3+10 = 16 evaluates to 4+1+2+3+10 = 20 </pre> <h2 data-attributes="id 'boolean'">Boolean expressions</h2> Boolean expressions define expressions using boolean operations: <pre class="brush: html"> must be false must be true must be false must be Liar! </pre> <h2 data-attributes="id 'comparison'">Comparison expressions</h2> Comparison expressions compare values: <pre class="brush: html"> must be true must be false must be true must be false must be true must be false </pre> The first 4 use these comparison operations: equals (eq:), not (not:), greater than (gt:) and lesser than (lt:). The last one uses the in operator (in:): it evaluates to true if the first element is included into the next elements. <h2 data-attributes="id 'scripting'">Scripting expressions</h2> Scripting expressions executes scripts: <pre class="brush: html"> must be 101 </pre> The first one is a javascript expression: ZPT-JS evaluates the expressions (starting by $ and surrounded by {}) and then execute the resulting string as javascript code. <h2 data-attributes="id 'misc'">Misc expressions</h2> This category includes exists, string and format expressions. <pre class="brush: html"> must be true must be false must be user is Bob </pre> The first and the second expressions are exists expressions. The evaluate to true if the arguments is not undefined (the first one). If a path is provided it evaluates the full path must exist to be evaluated as true (the second one). The third one is a string expression. They support to combine strings and other expressions to build a string. Format expressions use components called formatters to format the evaluation of an expression. ZPT-JS includes some built-in formatters: <pre class="brush: html"> must be test must be TEST must be 1.37 must be 0.33 </pre> </article> </div> </body> </html>