- Ittf nodes, The Indented Text Tree Format
- Ittf documents are templates
- JsWizzi
- Ecma builtin objects
- JsWizzi - Ecma builtin functions
- JsWizzi - Ecma builtin Array object
- JsWizzi - Ecma builtin Date object
- JsWizzi - Ecma builtin JSON object
- JsWizzi - Ecma builtin Math object
- JsWizzi - Ecma builtin Map object
- JsWizzi - Ecma builtin Number object
- JsWizzi - Ecma builtin Object object
- JsWizzi - Ecma builtin RegExp object
- JsWizzi - Ecma builtin Set object
- JsWizzi - Ecma builtin String object
- JsWizzi, NodeJs builtin modules
- JsWizzi - Builtin objects
- JsWizzi statements
- JsWizzi functions
- Ittf nodes - template commands
- Ittf nodes - The `$` and `$global` template command
- Ittf nodes - The `$if`, `$elif`, `$else` template commands
- Ittf nodes - The `$for` template command
- Ittf nodes - The `$foreach` and `$backeach` template commands
- Ittf nodes - The `$raw` template command
- Ittf nodes - The `$while` template command
- Ittf nodes - The `$.` template command
- Ittf nodes - Ittf fragments mixup and inclusion
- Ittf nodes - The `$include` template command
- Ittf nodes - The `$mix` template command
- Ittf nodes - Features of `$mix`
- Ittf nodes - `$mix` a fragment as root
- Ittf nodes - The `$hook` template command
- Ittf nodes - The `$append` template command
- Ittf nodes - The `$virtual` and `$override` template commands
- Ittf nodes - The `$group` template command
- Ittf fragments - Parameters by value
- Ittf fragments - Parameters default values
- Ittf fragments - The `@@null` default value
- Ittf fragments - Parameter types
- Ittf fragments - Manipulation of parameters
- Ittf fragments - Parameters by reference
- Ittf nodes - Inline Ittf fragments
- Ittf nodes - function template commands
- Ittf magic tricks
Ittf documents are the source files of a Wizzi production
1 root2 node3 node4 node5 node The Wizzi Factory6 node https://wizzihub.com/7 node ITTF stands for Indented Text Tree Format,8 node a human-friendly text format9 node for representing a tree data structure10 node of node names and values.
root
node
node
node
node The Wizzi Factory
node https://wizzihub.com/
node ITTF stands for Indented Text Tree Format,
node a human-friendly text format
node for representing a tree data structure
node of node names and values.
Ittf indented tree
1 root A document must have one and only one root node2 $$ the indentation shapes the tree (this is a comment, see later)3 node child 14 node child 25 node child 2.a6 node child 2.a.17 node child 2.b
root A document must have one and only one root node
node child 1
node child 2
node child 2.a
node child 2.a.1
node child 2.b
Ittf nodes
1 node-name node-value2 $$ Every line is a node consisting of a name-value pair.3 $$ The name is the first string of chars of the line4 $$ is separated from the value by a space or a tab.5 name the value is separated from the name by a space or tab6 name-is-a-word value is a string until end of line
node-name node-value
name the value is separated from the name by a space or tab
name-is-a-word value is a string until end of line
Ittf nodes - Line continuation
1 node-name node-value2 name the value can span many lines3 \ , and continue without separation4 name , or continue5 \b with a blank separator6 name , or continue7 \n with a line feed separator
node-name node-value
name the value can span many lines, and continue without separation
name , or continue with a blank separator
name , or continue
with a line feed separator
Ittf nodes - Values
1 root2 name values always are trimmed3 name ${} you must use the blank escape ${}4 name to insert start or end spaces
root.
....name.values.always.are.trimmed
....name...you.must.use.the.blank.escape...
....name.to.insert.start.or.end.spaces
Ittf nodes - Escapes
1 root2 name except the blank escape, as first or last character,3 \b the escape char is ignored4 name \n, \t, \b, and so on, are inserted unescaped in the value string5 name how do you insert a \b sequence at start or end line?6 $asis name \b*|^^ the $asis command at rescue ${}
root
name except the blank escape, as first or last character, the escape char is ignored
name \n, \t, \b, and so on, are inserted unescaped in the value string
name how do you insert a \b sequence at start or end line?
$asis name \b*|^^ the $asis command at rescue
Ittf nodes - Comments
1 root2 $$ this node is commented out entirely until end of line3 and $$this part too4 node value5 $*6 this is a multiline7 comment8 *$9 node value10 this too $*is11 a multiline comment12 *$
root
and
node value
node value
this too
Ittf nodes - Comment tricks
1 root2 node how do you insert a "$$" or "$*" in a value?3 node you must use `JsWizzi` (see later)4 node And you can insert ${'$'}${'$'} and ${'$'}* and *${'$'}
root
node how do you insert a "$$" or "$*" in a value?
node you must use `JsWizzi` (see later)
node And you can insert $$ and $* and *$
Ittf are templates - scripts
1 root2 # Ittf documents are templates3 #4 # Node names and values can contain scripts that drive the tree buildUp.5 #6 # There are single line `code nodes`7 $ var kind = 'number'8 #9 # There are multiline `code nodes`10 $11 var items = [12 'item-1',13 'item-2'14 ];15 #16 # The script language is `JsWizzi` a subset of javascript.17 # See later all `JsWizzi` statements.
root
# Ittf documents are templates
#
# Node names and values can contain scripts that drive the tree buildUp.
#
# There are single line `code nodes`
#
# There are multiline `code nodes`
#
# The script language is `JsWizzi` a subset of javascript.
# See later all `JsWizzi` statements.
Ittf are templates - Node template commands
1 root2 #3 # Than we have `node template commands`4 #5 $ var kind = 'number'6 #7 $if kind == 'string'8 node hello9 $elif kind == 'num' + 'BER'.toLowerCase()10 node 3311 $else12 node what?
root
#
# Than we have `node template commands`
#
#
node 33
Ittf are templates - `ittfMacro` (Interpolation)
1 root2 #3 # And then we have `ittfMacro` (interpolation)4 #5 $ var kind = 'number'6 #7 # The selected kind is: "${kind}"8 #9 # So that ...10 #11 $12 var items = [13 'item-1',14 'item-2'15 ];16 #17 # ... can give18 #19 items:20 $foreach item in items21 ${item}22 ;23 #24 # See later all `node template commands`25 #
root
#
# And then we have `ittfMacro` (interpolation)
#
#
# The selected kind is: "number"
#
# So that ...
#
#
# ... can give
#
items:
item-1
item-2
;
#
# See later all `node template commands`
#
JsWizzi - Variable declarations
1 any2 #3 # The `var` statement (`let` and `const` not implemented)4 #5 $6 var alphaVar1 = "name";7 var alphaVar2 = 'name';8 var integerVar = 3;9 var floatVar = 3.14;10 var objectVar1 = {11 name: 'annie'12 };13 var arrayVar1 = [14 'joe',15 'barbie'16 ];17 var objectVar2 = {18 obj1: objectVar1,19 arr1: arrayVar1,20 };21 var arrayVar2 = [22 objectVar2,23 {24 arr1: arrayVar125 }26 ];27 any arrayVar2[0].obj1.name: ${arrayVar2[0].obj1.name}!
any
#
# The `var` statement (`let` and `const` not implemented)
#
any arrayVar2[0].obj1.name: annie!
JsWizzi - Unary expressions
1 any2 any +2 = ${ +2 }3 any -2 = ${ -2 }4 any !(2 == 2) = ${ !(2 == 2) }5 $6 var a = 0;7 any a = = ${ a }8 any ++a = ${ ++a }9 any ++a = ${ ++a }10 any --a = ${ --a }11 any typeof 3 = ${ typeof 3 }12 any typeof '3' = ${ typeof '3' }13 any typeof xyz = ${ typeof xyz }
any
any +2 = 2
any -2 = -2
any !(2 == 2) = false
any a = = 0
any ++a = 1
any ++a = 2
any --a = 1
any typeof 3 = number
any typeof '3' = string
any typeof xyz = undefined
JsWizzi - Binary expressions
1 any2 any 2 + 2 = ${ 2 + 2 }3 any 5 - 2 = ${ 5 - 2 }4 any 3 * 3 = ${ 3 * 3 }5 any 6 / 2 = ${ 6 / 2 }6 any 5 % 2 = ${ 5 % 2 }7 any 5 == 2 = ${ 5 == 2 }8 any 5 != 2 = ${ 5 != 2 }9 any 5 > 2 = ${ 5 > 2 }10 any 5 >= 5 = ${ 5 >= 5 }11 any 5 < 2 = ${ 5 < 2 }12 any 5 <= 5 = ${ 5 <= 5 }13 any "a" in { a: 1} = ${ "a" in { a: 1} }14 any typeof 5 === 'string' = ${ typeof 5 === 'string' }15 any String(5) = ${ String(5) }16 any Number('5.5') = ${ Number('5.5') }17 any Date(2013,6,12) = ${ Date(2013,6,12) }18 any 5 << 5 = ${ 5 << 5 }19 any 5 >> 5 = ${ 5 >> 5 }20 any 5 >>> 5 = ${ 5 >>> 5 }21 any 5 | 5 = ${ 5 | 5 }22 any 5 & 5 = ${ 5 & 5 }23 any 5 ^ 5 = ${ 5 ^ 5 }
any
any 2 + 2 = 4
any 5 - 2 = 3
any 3 * 3 = 9
any 6 / 2 = 3
any 5 % 2 = 1
any 5 == 2 = false
any 5 != 2 = true
any 5 > 2 = true
any 5 >= 5 = true
any 5 < 2 = false
any 5 <= 5 = true
any "a" in { a: 1} = true
any typeof 5 === 'string' = false
any String(5) = 5
any Number('5.5') = 5.5
any Date(2013,6,12) = Tue May 06 2025 05:35:05 GMT+0000 (Coordinated Universal Time)
any 5 << 5 = 160
any 5 >> 5 = 0
any 5 >>> 5 = 0
any 5 | 5 = 5
any 5 & 5 = 5
any 5 ^ 5 = 0
JsWizzi - Conditional operator
1 root2 node (3 == 3 ? 1 : 0) = ${ 3 == 3 ? 1 : 0 }3 node (true ? 5 : 2) = ${ true ? 5 : 2 }
root
node (3 == 3 ? 1 : 0) = 1
node (true ? 5 : 2) = 5
JsWizzi - Assignments
1 root2 $ var a = 0;3 node var a = 0; a += 2; -> ${ a += 2 }4 $ var a = 0;5 node var a = 0; a -= 2; -> ${ a -= 2 }6 $ var a = 3;7 node var a = 3; a *= 2; -> ${ a *= 2 }8 $ var a = 3;9 node var a = 3; a /= 2; -> ${ a /= 2 }10 $ var a = 3;11 node var a = 3; a %= 2; -> ${ a %= 2 }12 $ var a = 3;13 node var a = 3; a <<= 2; -> ${ a <<= 2 }14 $ var a = 3;15 node var a = 3; a >>= 2; -> ${ a >>= 2 }16 $ var a = 3;17 node var a = 3; a >>>= 2; -> ${ a >>>= 2 }18 $ var a = 3;19 node var a = 3; a &= 2; -> ${ a &= 2 }20 $ var a = 3;21 node var a = 3; a |= 2; -> ${ a |= 2 }22 $ var a = 3;23 node var a = 3; a ^= 2; -> ${ a ^= 2 }
root
node var a = 0; a += 2; -> 2
node var a = 0; a -= 2; -> -2
node var a = 3; a *= 2; -> 6
node var a = 3; a /= 2; -> 1.5
node var a = 3; a %= 2; -> 1
node var a = 3; a <<= 2; -> 12
node var a = 3; a >>= 2; -> 0
node var a = 3; a >>>= 2; -> 0
node var a = 3; a &= 2; -> 2
node var a = 3; a |= 2; -> 3
node var a = 3; a ^= 2; -> 1
JsWizzi - Variable declaration and interpolation
1 root2 $3 var name = 'stefi';4 var options = {5 title: 'Chapter 1'6 };7 node title is ${options.title}8 node name is ${name}
root
node title is Chapter 1
node name is stefi
JsWizzi - More variable declarations
1 html2 $3 var name = 'Ribot';4 var runDowns = 16, runWon = 16;5 var placements = [1, 1, 1, 1, 1];6 var pedigree = {7 mother: 'Romanella',8 father: 'Tenerani',9 paternalGrandfather: 'Bellini',10 maternalGrandfather: 'El greco'11 };12 p ${name} was undefeated. Won ${runWon} out of ${runDowns} races.13 p His father was ${pedigree.father} and his mother ${pedigree.mother}.14 p His placements are boring: ${placements}, ...
html
p Ribot was undefeated. Won 16 out of 16 races.
p His father was Tenerani and his mother Romanella.
p His placements are boring: 1,1,1,1,1, ...
JsWizzi - Ecma builtin functions
1 root2 node parseInt('43.5') = ${ parseInt(43.5) }3 node parseFloat('43.5') = ${ parseFloat(43.5) }4 node isFinite(Infinity) = ${ isFinite(Infinity) }5 node isFinite(NaN) = ${ isFinite(NaN) }6 node isFinite(null) = ${ isFinite(null) }7 node isFinite(0) = ${ isFinite(0) }8 node isNaN(NaN) = ${ isNaN(NaN) }9 node isNaN(undefined) = ${ isNaN(undefined) }10 node isNaN({}) = ${ isNaN({})}11 node isNaN(true) = ${ isNaN(true) }12 node isNaN(null) = ${ isNaN(null) }13 node isNaN(37) = ${ isNaN(37) }14 node isNaN('37') = ${ isNaN('37') }15 node isNaN('37.37') = ${ isNaN('37.37') }16 node isNaN('123ABC') = ${ isNaN('123ABC') }17 node parseInt('123ABC') = ${ parseInt('123ABC') }18 node isNaN('') = ${ isNaN('') }19 node isNaN(' ') = ${ isNaN(' ') }20 node isNaN(new Date()) = ${ isNaN(new Date()) }21 node isNaN(new Date().toString()) = ${ isNaN(new Date().toString()) }22 node isNaN('blabla') = ${ isNaN('blabla') }23 node parseFloat(3.14) = ${ parseFloat(3.14) }24 node parseFloat('3.14') = ${ parseFloat('3.14') }25 node parseFloat('314e-2') = ${ parseFloat('314e-2') }26 node parseFloat('0.0314E+2') = ${ parseFloat('0.0314E+2') }27 node parseFloat('3.14more non-digit characters') = ${parseFloat('3.14more non-digit characters') }28 node parseInt(' 0xF', 16) = ${ parseInt(' 0xF', 16) }29 node parseInt(' F', 16) = ${ parseInt(' F', 16) }30 node parseInt('17', 8) = ${ parseInt('17', 8) }31 node parseInt('015', 10) = ${ parseInt('015', 10) }32 node parseInt(15.99, 10) = ${ parseInt(15.99, 10) }33 node parseInt('15,123', 10) = ${ parseInt('15,123', 10) }34 node parseInt('FXX123', 16) = ${ parseInt('FXX123', 16) }35 node parseInt('1111', 2) = ${ parseInt('1111', 2) }36 node parseInt('15 * 3', 10) = ${ parseInt('15 * 3', 10) }37 node parseInt('15e2', 10) = ${ parseInt('15e2', 10) }38 node parseInt('15px', 10) = ${ parseInt('15px', 10) }39 node parseInt('12', 13) = ${ parseInt('12', 13) }40 node reserved chars : encodeURI(";,/?:@&=+$") = ${ encodeURI(";,/?:@&=+$") }41 node unescaped chars : encodeURI("-_.!~*'()") = ${ encodeURI("-_.!~*'()") }42 node number sign: encodeURI("#") = ${ encodeURI("#") }43 node alphanumeric chars + space : encodeURI("ABC abc 123") = ${ encodeURI("ABC abc 123") }44 node encodeURIComponent(";,/?:@&=+$") = ${ encodeURIComponent(";,/?:@&=+$") }45 node encodeURIComponent("-_.!~*'()") = ${ encodeURIComponent("-_.!~*'()") }46 node encodeURIComponent("#") = ${ encodeURIComponent("#") }47 node encodeURIComponent("ABC abc 123") = ${ encodeURIComponent("ABC abc 123") }
root
node parseInt('43.5') = 43
node parseFloat('43.5') = 43.5
node isFinite(Infinity) = false
node isFinite(NaN) = false
node isFinite(null) = true
node isFinite(0) = true
node isNaN(NaN) = true
node isNaN(undefined) = true
node isNaN({}) = true
node isNaN(true) = false
node isNaN(null) = false
node isNaN(37) = false
node isNaN('37') = false
node isNaN('37.37') = false
node isNaN('123ABC') = true
node parseInt('123ABC') = 123
node isNaN('') = false
node isNaN(' ') = false
node isNaN(new Date()) = false
node isNaN(new Date().toString()) = true
node isNaN('blabla') = true
node parseFloat(3.14) = 3.14
node parseFloat('3.14') = 3.14
node parseFloat('314e-2') = 3.14
node parseFloat('0.0314E+2') = 3.14
node parseFloat('3.14more non-digit characters') = 3.14
node parseInt(' 0xF', 16) = 15
node parseInt(' F', 16) = 15
node parseInt('17', 8) = 15
node parseInt('015', 10) = 15
node parseInt(15.99, 10) = 15
node parseInt('15,123', 10) = 15
node parseInt('FXX123', 16) = 15
node parseInt('1111', 2) = 15
node parseInt('15 * 3', 10) = 15
node parseInt('15e2', 10) = 15
node parseInt('15px', 10) = 15
node parseInt('12', 13) = 15
node reserved chars : encodeURI(";,/?:@&=+$") = ;,/?:@&=+$
node unescaped chars : encodeURI("-_.!~*'()") = -_.!~*'()
node number sign: encodeURI("#") = #
node alphanumeric chars + space : encodeURI("ABC abc 123") = ABC%20abc%20123
node encodeURIComponent(";,/?:@&=+$") = %3B%2C%2F%3F%3A%40%26%3D%2B%24
node encodeURIComponent("-_.!~*'()") = -_.!~*'()
node encodeURIComponent("#") = %23
node encodeURIComponent("ABC abc 123") = ABC%20abc%20123
JsWizzi - Ecma builtin Array object
1 root2 #3 # All ECMA builtin methods of the `Array` object are supported4 #5 # Examples:6 #7 node new Array(4) = ${ new Array(4) }8 node new Array(4).join('0') = ${ new Array(4).join('0') }9 #10 node <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array"></a>
root
#
# All ECMA builtin methods of the `Array` object are supported
#
# Examples:
#
node new Array(4) = ,,,
node new Array(4).join('0') = 000
#
node <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array"></a>
JsWizzi - Ecma builtin Date object
1 root2 #3 # All ECMA builtin methods of the `Date` object are supported4 #5 # Examples:6 #7 node <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Date"></a>8 node today: new Date() = ${ new Date() }9 node new Date('December 17, 1995 03:24:00') = ${ new Date('December 17, 1995 03:24:00') }10 node new Date('1995-12-17T03:24:00') = ${ new Date('1995-12-17T03:24:00') }11 node new Date(1995, 11, 17) = ${ new Date(1995, 11, 17) }12 node new Date(1995, 11, 17, 3, 24, 0) = ${ new Date(1995, 11, 17, 3, 24, 0) }
root
#
# All ECMA builtin methods of the `Date` object are supported
#
# Examples:
#
node <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Date"></a>
node today: new Date() = Tue May 06 2025 05:35:05 GMT+0000 (Coordinated Universal Time)
node new Date('December 17, 1995 03:24:00') = Sun Dec 17 1995 03:24:00 GMT+0000 (Coordinated Universal Time)
node new Date('1995-12-17T03:24:00') = Sun Dec 17 1995 03:24:00 GMT+0000 (Coordinated Universal Time)
node new Date(1995, 11, 17) = Sun Dec 17 1995 00:00:00 GMT+0000 (Coordinated Universal Time)
node new Date(1995, 11, 17, 3, 24, 0) = Sun Dec 17 1995 03:24:00 GMT+0000 (Coordinated Universal Time)
JsWizzi - Ecma builtin JSON object
1 root2 #3 # All ECMA builtin methods of the `JSON` object are supported4 #5 # Examples:6 #7 $8 var arrayVar1 = [9 'joe',10 'barbie'11 ];12 #13 # node JSON.stringify(arrayVar1) = ${JSON.stringify(arrayVar1)}14 #15 node <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/JSON"></a>
root
#
# All ECMA builtin methods of the `JSON` object are supported
#
# Examples:
#
#
# node JSON.stringify(arrayVar1) = ["joe","barbie"]
#
node <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/JSON"></a>
JsWizzi - Ecma builtin Math object
1 root2 #3 # All ECMA builtin methods of the `Math` object are supported4 #5 #6 $7 function getRandomInt(max) {8 return Math.floor(Math.random() * max);9 }10 #11 # getRandomInt(10): ${getRandomInt(10)}12 # getRandomInt(10): ${getRandomInt(10)}13 # getRandomInt(10): ${getRandomInt(10)}14 #15 node <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Math"></a>
root
#
# All ECMA builtin methods of the `Math` object are supported
#
#
#
# getRandomInt(10): 9
# getRandomInt(10): 3
# getRandomInt(10): 5
#
node <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Math"></a>
JsWizzi - Ecma builtin Map object
1 root2 #3 # All ECMA builtin methods of the `Map` object are supported4 #5 # Examples:6 #7 $8 const map1 = new Map();9 map1.set ('a', 1);10 map1.set ('b', 2);11 map1.set ('c', 3);12 #13 node map1.get('a') = ${map1.get('a')}14 #15 #16 node <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Map"></a>
root
#
# All ECMA builtin methods of the `Map` object are supported
#
# Examples:
#
#
node map1.get('a') = 1
#
#
node <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Map"></a>
JsWizzi - Ecma builtin Number object
1 root2 #3 # All ECMA builtin methods of the `Number` object are supported4 #5 # Examples:6 #7 node Number.MAX_VALUE = ${ Number.MAX_VALUE }8 node Number.MIN_VALUE = ${ Number.MIN_VALUE }9 node Number.POSITIVE_INFINITY = ${ Number.POSITIVE_INFINITY }10 node Number.NEGATIVE_INFINITY = ${ Number.NEGATIVE_INFINITY }11 node Number.isFinite(null) = ${ Number.isFinite(null) }12 node Number.isFinite(0) = ${ Number.isFinite(0) }13 node Number.NaN = ${ Number.NaN }14 node Number('123') = ${ Number('123') }15 node Number('12.3') = ${ Number('12.3') }16 node Number('') = ${ Number('') }17 node Number(' ') = ${ Number(' ') }18 node Number('blabla') = ${ Number('blabla') }19 node Number('0x11') = ${ Number('0x11') }20 node Number('0b11') = ${ Number('0b11') }21 node Number('0o11') = ${ Number('0o11') }22 node Number('foo') = ${ Number('foo') }23 node Number('100a') = ${ Number('100a') }24 node Number('123ABC') = ${ Number('123ABC') }
root
#
# All ECMA builtin methods of the `Number` object are supported
#
# Examples:
#
node Number.MAX_VALUE = 1.7976931348623157e+308
node Number.MIN_VALUE = 5e-324
node Number.POSITIVE_INFINITY = Infinity
node Number.NEGATIVE_INFINITY = -Infinity
node Number.isFinite(null) = false
node Number.isFinite(0) = true
node Number.NaN = NaN
node Number('123') = 123
node Number('12.3') = 12.3
node Number('') = 0
node Number(' ') = 0
node Number('blabla') = NaN
node Number('0x11') = 17
node Number('0b11') = 3
node Number('0o11') = 9
node Number('foo') = NaN
node Number('100a') = NaN
node Number('123ABC') = NaN
JsWizzi - Ecma builtin Object object
1 root2 #3 # All ECMA builtin methods of the `Object` object are supported4 #5 node new Object(true) = ${ new Object(true).toString() }6 #7 #8 node <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object"></a>
root
#
# All ECMA builtin methods of the `Object` object are supported
#
node new Object(true) = true
#
#
node <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object"></a>
JsWizzi - Ecma builtin RegExp object
1 root2 #3 # All ECMA builtin methods of the `Number` object are supported4 #5 # Examples:6 #7 node new RegExp('\\w+') = ${ new RegExp('\\w+') }8 node 'John Smith'.replace(new RegExp('(\\w+)\\s(\\w+)'), '$2, $1') =9 \b ${ 'John Smith'.replace(new RegExp('(\\w+)\\s(\\w+)'), '$2, $1') }10 $11 var str = 'John Smith';12 var reValue = '(\\w+)\\s(\\w+)';13 var re = new RegExp(reValue);14 node str.replace(re, '$2, $1') = ${ str.replace(re, '$2, $1') }15 #16 #17 node <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/RegExp"></a>
root
#
# All ECMA builtin methods of the `Number` object are supported
#
# Examples:
#
node new RegExp('\\w+') = /\w+/
node 'John Smith'.replace(new RegExp('(\\w+)\\s(\\w+)'), '$2, $1') = Smith, John
node str.replace(re, '$2, $1') = Smith, John
#
#
node <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/RegExp"></a>
JsWizzi - Ecma builtin Set object
1 root2 #3 # All ECMA builtin methods of the `Set` object are supported4 #5 # Examples:6 #7 $8 const mySet1 = new Set();9 mySet1.add (1);10 mySet1.add (5);11 mySet1.add (5);12 #13 # node mySet1.size: ${mySet1.size}14 #15 #16 node <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Set"></a>
root
#
# All ECMA builtin methods of the `Set` object are supported
#
# Examples:
#
#
# node mySet1.size: 2
#
#
node <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Set"></a>
JsWizzi - Ecma builtin String object
1 root2 #3 # All ECMA builtin methods of the `String` object are supported4 #5 # Examples:6 #7 node ${'a'.toUpperCase()}8 node ${'A'.toLowerCase()}9 node ${'a' + ' b ' + 'c'}10 node ${'a' + ' b '.trim() + 'c'}11 node ${'a,b,c,d'.split(',').join('-')}12 #13 #14 node <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String"></a>
root
#
# All ECMA builtin methods of the `String` object are supported
#
# Examples:
#
node A
node a
node a b c
node abc
node a-b-c-d
#
#
node <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String"></a>
JsWizzi - NodeJs `path` builtin functions
1 root2 #3 # All NodeJs methods of the `path` module are supported4 #5 # Examples:6 #7 $8 var folder = path.join('c:/alpha', 'beta', 'gamma.json');9 #10 node folder = ${folder}11 #12 #13 node <a href="https://nodejs.org/api/path.html"></a>
root
#
# All NodeJs methods of the `path` module are supported
#
# Examples:
#
#
node folder = c:/alpha/beta/gamma.json
#
#
node <a href="https://nodejs.org/api/path.html"></a>
JsWizzi - NodeJs `util` builtin functions
1 root2 #3 # All NodeJs methods of the `util` module are supported4 #5 # Examples:6 #7 $8 var obj = {9 name: 'annie'10 };11 #12 node util.inspect(obj) = ${util.inspect(obj)}13 #14 #15 node <a href="https://nodejs.org/api/util.html"></a>
root
#
# All NodeJs methods of the `util` module are supported
#
# Examples:
#
#
node util.inspect(obj) = { name: 'annie' }
#
#
node <a href="https://nodejs.org/api/util.html"></a>
JsWizzi - `inflect` builtin functions
1 root2 node 'item'.pluralize = ${ 'item'.pluralize }3 node 'friend'.pluralize = ${ 'friend'.pluralize }4 node 'lady'.pluralize = ${ 'lady'.pluralize }5 node 'way'.pluralize.toUpperCase() = ${ 'way'.pluralize.toUpperCase() }6 node 'people'.singularize = ${ 'people'.singularize }7 node 'octopi'.singularize = ${ 'octopi'.singularize }8 node 'Hats'.singularize.toUpperCase() = ${ 'Hats'.singularize.toUpperCase() }9 node 'message_properties'.camelize = ${ 'message_properties'.camelize }10 node 'message_properties'.camelize = ${ 'message_properties'.camelize }11 node 'message_properties'.dasherize = ${ 'message_properties'.dasherize }12 node 'Message Properties'.dasherize = ${ 'Message Properties'.dasherize }13 node 'message_properties'.titleize = ${ 'message_properties'.titleize }14 node 'message properties to keep'.titleize = ${ 'message properties to keep'.titleize }15 node 'Message.Bus.Properties'.demodulize = ${ 'Message.Bus.Properties'.demodulize }16 node 'MessageBusProperty'.tableize = ${ 'MessageBusProperty'.tableize }17 node 'message_bus_properties'.classify = ${ 'message_bus_properties'.classify }18 node 'MessageBusProperty'.foreign_key = ${ 'MessageBusProperty'.foreign_key }19 node '1'.ordinalize = ${ '1'.ordinalize }20 node '2'.ordinalize = ${ '2'.ordinalize }21 node '3'.ordinalize = ${ '3'.ordinalize }22 node '4'.ordinalize = ${ '4'.ordinalize }
root
node 'item'.pluralize = items
node 'friend'.pluralize = friends
node 'lady'.pluralize = ladies
node 'way'.pluralize.toUpperCase() = WAYS
node 'people'.singularize = person
node 'octopi'.singularize = octopus
node 'Hats'.singularize.toUpperCase() = HAT
node 'message_properties'.camelize = MessageProperties
node 'message_properties'.camelize = MessageProperties
node 'message_properties'.dasherize = message-properties
node 'Message Properties'.dasherize = Message Properties
node 'message_properties'.titleize = Message Properties
node 'message properties to keep'.titleize = Message Properties To Keep
node 'Message.Bus.Properties'.demodulize = Properties
node 'MessageBusProperty'.tableize = message_bus_properties
node 'message_bus_properties'.classify = MessageBusProperty
node 'MessageBusProperty'.foreign_key = message_bus_property_id
node '1'.ordinalize = 1st
node '2'.ordinalize = 2nd
node '3'.ordinalize = 3rd
node '4'.ordinalize = 4th
JsWizzi - Underscore `_` builtin functions
1 root2 node inflect : 'message-properties'.camelize = ${ 'message-properties'.camelize }3 node JsWizzi _ : _.dashToCamelCase('message-properties') = ${ _.dashToCamelCase('message-properties') }4 node inflect : 'message_properties'.camelize = ${ 'message_properties'.camelize }5 node JsWizzi _ : _.camelize('message_properties') = ${ _.camelize('message_properties') }6 $ var text = 'alfa\\t " " \\n'7 node "_.escape( text )" = "${ _.escape( text ) }"8 node _.isString( '3' ) = ${ _.isString( '3' ) }9 node _.isString( 3 ) = ${ _.isString( 3 ) }10 node _.isEmpty( '' ) = ${ _.isEmpty( '' ) }11 node _.isEmpty( 'a ' ) = ${ _.isEmpty( 'a ' ) }12 node _.isNotEmpty( 'a ' ) = ${ _.isNotEmpty( 'a ' ) }13 node _.isNotEmpty( '' ) = ${ _.isNotEmpty( '' ) }14 node _.isObject( {} ) = ${ _.isObject( {} ) }15 node _.isObject( 3 ) = ${ _.isObject( 3 ) }16 node _.isArray( [] ) = ${ _.isArray( [] ) }17 node _.isArray( {} ) = ${ _.isArray( {} ) }18 node _.isNumber( 3 ) = ${ _.isNumber( 3 ) }19 node _.isNumber( '' ) = ${ _.isNumber( '' ) }20 node _.isDate( new Date() ) = ${ _.isDate( new Date() ) }21 node _.isDate( [] ) = ${ _.isDate( [] ) }22 $23 var options = {24 title: 'Chapter 1'25 };26 node _.replace( '1353739', '3', '0' ) = ${ _.replace( '1353739', '3', '0' ) }27 node _.inspect( options ) = ${ _.inspect( options ) }
root
node inflect : 'message-properties'.camelize = Message-properties
node JsWizzi _ : _.dashToCamelCase('message-properties') = messageProperties
node inflect : 'message_properties'.camelize = MessageProperties
node JsWizzi _ : _.camelize('message_properties') = messageProperties
node "_.escape( text )" = "alfa\\t \" \" \\n"
node _.isString( '3' ) = true
node _.isString( 3 ) = false
node _.isEmpty( '' ) = true
node _.isEmpty( 'a ' ) = false
node _.isNotEmpty( 'a ' ) = true
node _.isNotEmpty( '' ) = false
node _.isObject( {} ) = true
node _.isObject( 3 ) = false
node _.isArray( [] ) = true
node _.isArray( {} ) = false
node _.isNumber( 3 ) = true
node _.isNumber( '' ) = false
node _.isDate( new Date() ) = true
node _.isDate( [] ) = false
node _.replace( '1353739', '3', '0' ) = 1050709
node _.inspect( options ) = { title: 'Chapter 1' }
JsWizzi - Conditions
1 root2 $3 var name = 'Derby', winner = null;4 if (name == 'Ascot') {5 winner = 'Ribot';6 } else if (name == 'Arc de triomphe') {7 winner = 'Varenne';8 } else if (name == 'Derby') {9 winner = 'Ribot';10 } else {11 winner = 'Varenne';12 }13 node If the race was ${name} the winner was ${winner}.
// 6/5/2025:5:35:5 by /app/node_modules/@wizzi/mtree/lib/loader/mTreeBuildUpScriptBuilder.js
$.n(); // set the context state to NodeContext
var $0 = {}; // the root node of the mTree buildUp
var $1 = { n: "root", v: "", i: 14, r: 1, c: 1, s: "f1", u: "f1", }; //node:14
$.a($0, $1, 5);
$.s("f1");
var name = 'Derby', winner = null; //node:16
if (name == 'Ascot') { //node:17
winner = 'Ribot'; //node:18
} else if (name == 'Arc de triomphe') { //node:19
winner = 'Varenne'; //node:20
} else if (name == 'Derby') { //node:21
winner = 'Ribot'; //node:22
} else { //node:23
winner = 'Varenne'; //node:24
} //node:25
$.n();
var $3 = { n: "node", v: $.ip("f1", "If the race was ${name} the winner was ${winner}.", "string", 18, false), i: 26, r: 13, c: 5, s: "f1", u: "f1", }; //node:26
$.a($1, $3, 19);
JsWizzi - For loop
1 root2 $3 var sletters = 'a,b,c,d,e,f,g,h';4 var aletters = sletters.split(',');5 var letter, label='';6 for (var i=0; i<aletters.length; i++) {7 letter = aletters[i];8 label += i % 2 == 0 ? letter : letter.toUpperCase();9 }10 node The resulting label has the even letters upper cased: ${label}.
// 6/5/2025:5:35:5 by /app/node_modules/@wizzi/mtree/lib/loader/mTreeBuildUpScriptBuilder.js
$.n(); // set the context state to NodeContext
var $0 = {}; // the root node of the mTree buildUp
var $1 = { n: "root", v: "", i: 11, r: 1, c: 1, s: "f1", u: "f1", }; //node:11
$.a($0, $1, 5);
$.s("f1");
var sletters = 'a,b,c,d,e,f,g,h'; //node:13
var aletters = sletters.split(','); //node:14
var letter, label=''; //node:15
for (var i=0; i<aletters.length; i++) { //node:16
letter = aletters[i]; //node:17
label += i % 2 == 0 ? letter : letter.toUpperCase(); //node:18
} //node:19
$.n();
var $3 = { n: "node", v: $.ip("f1", "The resulting label has the even letters upper cased: ${label}.", "string", 15, false), i: 20, r: 10, c: 5, s: "f1", u: "f1", }; //node:20
$.a($1, $3, 16);
JsWizzi - While loop
1 root2 $3 var x = 1, odds = '1';4 while ( x < 10 ) {5 x += 2;6 odds += ', ' + x7 }8 node First odd numbers: ${odds}.
// 6/5/2025:5:35:5 by /app/node_modules/@wizzi/mtree/lib/loader/mTreeBuildUpScriptBuilder.js
$.n(); // set the context state to NodeContext
var $0 = {}; // the root node of the mTree buildUp
var $1 = { n: "root", v: "", i: 9, r: 1, c: 1, s: "f1", u: "f1", }; //node:9
$.a($0, $1, 5);
$.s("f1");
var x = 1, odds = '1'; //node:11
while ( x < 10 ) { //node:12
x += 2; //node:13
odds += ', ' + x //node:14
} //node:15
$.n();
var $3 = { n: "node", v: $.ip("f1", "First odd numbers: ${odds}.", "string", 13, false), i: 16, r: 8, c: 5, s: "f1", u: "f1", }; //node:16
$.a($1, $3, 14);
JsWizzi - Functions
1 root2 $3 function sayHello(name) {4 return 'Hii I am ' + name;5 }6 $$TODO var sh = sayHello;7 p If Varenne could have talked he would have said: ${ sayHello('Varenne') }.8 $$TODO p If Ribot could have talked he would have said: ${ sh('Ribot') }.
// 6/5/2025:5:35:5 by /app/node_modules/@wizzi/mtree/lib/loader/mTreeBuildUpScriptBuilder.js
$.n(); // set the context state to NodeContext
var $0 = {}; // the root node of the mTree buildUp
var $1 = { n: "root", v: "", i: 7, r: 1, c: 1, s: "f1", u: "f1", }; //node:7
$.a($0, $1, 5);
$.s("f1");
function sayHello(name) { //node:9
return 'Hii I am ' + name; //node:10
} //node:11
$.n();
var $3 = { n: "p", v: $.ip("f1", "If Varenne could have talked he would have said: ${ sayHello('Varenne') }.", "string", 11, false), i: 12, r: 7, c: 5, s: "f1", u: "f1", }; //node:12
$.a($1, $3, 12);
Functions in scripts
1 root2 $3 function sayHello(name) {4 return 'Hii I am ' + name;5 }6 $$TODO var sh = sayHello;7 p If Varenne could have talked he would have said: ${ sayHello('Varenne') }.8 $$TODO p If Ribot could have talked he would have said: ${ sh('Ribot') }.
root
p If Varenne could have talked he would have said: Hii I am Varenne.
Functions in markup
1 root2 $function sayHello3 $param name4 node Hii I am ${ name }5 $ var name = 'Ribot'6 $_ sayHello7 $@ name
root
node Hii I am Ribot
Functions in scripts + markup !!! powerful
1 root2 $3 function buildNode(parent, childCount, deep) {4 _.log ('deep', deep)5 parent.childs = [];6 if (deep > 3) { return; }7 _.log ('deep after test', deep)8 parent.childs = [];9 for (var i = 0; i < childCount; i++) {10 var child = { id: parent.id + '-' + i};11 buildNode (child, childCount, deep + 1);12 parent.childs.push (child);13 }14 }15 var tree = { id: 0 };16 buildNode (tree, 2, 0);17 node18 node Let us inspect the 'tree' variable we built.19 node20 node ${ _.inspect(tree) }21 node22 node beautiful tree buildup without depth limits23 node24 $function nodeView25 $param parent26 div node${parent.id}27 $foreach nodeChild in parent.childs28 $_ nodeView29 $@ nodeChild30 $_ nodeView31 $@ tree
root
node
node Let us inspect the 'tree' variable we built.
node
node {
id: 0,
childs: [
{
id: '0-0',
childs: [
{
id: '0-0-0',
childs: [
{
id: '0-0-0-0',
childs: [
{ id: '0-0-0-0-0', childs: [] },
{ id: '0-0-0-0-1', childs: [] }
]
},
{
id: '0-0-0-1',
childs: [
{ id: '0-0-0-1-0', childs: [] },
{ id: '0-0-0-1-1', childs: [] }
]
}
]
},
{
id: '0-0-1',
childs: [
{
id: '0-0-1-0',
childs: [
{ id: '0-0-1-0-0', childs: [] },
{ id: '0-0-1-0-1', childs: [] }
]
},
{
id: '0-0-1-1',
childs: [
{ id: '0-0-1-1-0', childs: [] },
{ id: '0-0-1-1-1', childs: [] }
]
}
]
}
]
},
{
id: '0-1',
childs: [
{
id: '0-1-0',
childs: [
{
id: '0-1-0-0',
childs: [
{ id: '0-1-0-0-0', childs: [] },
{ id: '0-1-0-0-1', childs: [] }
]
},
{
id: '0-1-0-1',
childs: [
{ id: '0-1-0-1-0', childs: [] },
{ id: '0-1-0-1-1', childs: [] }
]
}
]
},
{
id: '0-1-1',
childs: [
{
id: '0-1-1-0',
childs: [
{ id: '0-1-1-0-0', childs: [] },
{ id: '0-1-1-0-1', childs: [] }
]
},
{
id: '0-1-1-1',
childs: [
{ id: '0-1-1-1-0', childs: [] },
{ id: '0-1-1-1-1', childs: [] }
]
}
]
}
]
}
]
}
node
node beautiful tree buildup without depth limits
node
div node0
div node0-0
div node0-0-0
div node0-0-0-0
div node0-0-0-0-0
div node0-0-0-0-1
div node0-0-0-1
div node0-0-0-1-0
div node0-0-0-1-1
div node0-0-1
div node0-0-1-0
div node0-0-1-0-0
div node0-0-1-0-1
div node0-0-1-1
div node0-0-1-1-0
div node0-0-1-1-1
div node0-1
div node0-1-0
div node0-1-0-0
div node0-1-0-0-0
div node0-1-0-0-1
div node0-1-0-1
div node0-1-0-1-0
div node0-1-0-1-1
div node0-1-1
div node0-1-1-0
div node0-1-1-0-0
div node0-1-1-0-1
div node0-1-1-1
div node0-1-1-1-0
div node0-1-1-1-1
Ittf nodes - The `$` and `$global` template command
1 root2 # With the `$` template command you can declare3 # variables and functions in the body of a Ittf Document4 # that have document unit scope.5 $6 var name = 'bax';7 function sum(a,b) { return a+b; }8 # With the `$global` template command you can declare9 # variables and functions in the body of a main Ittf Document10 # that have global scope for any Ittf Fragment included or mixed.11 $global12 var name = 'bax';13 function sum(a,b) { return a+b; }
root
# With the `$` template command you can declare
# variables and functions in the body of a Ittf Document
# that have document unit scope.
# With the `$global` template command you can declare
# variables and functions in the body of a main Ittf Document
# that have global scope for any Ittf Fragment included or mixed.
Ittf nodes - The `$if`, `$elif`, `$else` template commands
1 root2 $3 var name = 'Derby';4 $if name == 'Ascot'5 node If the race was ${name} the winner was Ribot6 $elif name == 'Arc de triomphe'7 node If the race was ${name} the winner was Varenne8 $elif name == 'Derby'9 node If the race was ${name} the winner was Ribot10 $else11 node If the race was ${name} the winner was Varenne
root
node If the race was Derby the winner was Ribot
Ittf nodes - The `$for` template command
1 root2 $3 var sletters = 'a,b,c,d,e,f,g,h';4 $foreach letter in aletters5 node ${ letter.toUpperCase() }
// 6/5/2025:5:35:5 by /app/node_modules/@wizzi/mtree/lib/loader/mTreeBuildUpScriptBuilder.js
$.n(); // set the context state to NodeContext
var $0 = {}; // the root node of the mTree buildUp
var $1 = { n: "root", v: "", i: 6, r: 1, c: 1, s: "f1", u: "f1", }; //node:6
$.a($0, $1, 5);
$.s("f1");
var sletters = 'a,b,c,d,e,f,g,h'; //node:8
var letter_count3 = aletters.length; //node:9
var letter_count = aletters.length; //node:9
for (var i3=0; i3<letter_count3; i3++) { //node:9
var letter = aletters[i3]; //node:9
var letter_index = i3; //node:9
$.n();
var $4 = { n: "node", v: $.ip("f1", "${ letter.toUpperCase() }", "string", 14, false), i: 10, r: 5, c: 9, s: "f1", u: "f1", }; //node:10
$.a($1, $4, 15);
}
Ittf nodes - The `$foreach` and `$backeach` template commands
1 root2 $3 var sletters = 'a,b,c,d,e,f,g,h';4 var aletters = sletters.split(',');5 node The resulting tree has the odd node values upper cased:6 $foreach letter in aletters7 node ${ letter_index} ${ letter_index % 2 == 0 ? letter : letter.toUpperCase() }8 node The same backword with backeach9 $backeach letter in aletters10 node ${ letter_index} ${ letter_index % 2 == 0 ? letter : letter.toUpperCase() }
root
node The resulting tree has the odd node values upper cased:
node 0 a
node 1 B
node 2 c
node 3 D
node 4 e
node 5 F
node 6 g
node 7 H
node The same backword with backeach
node 7 H
node 6 g
node 5 F
node 4 e
node 3 D
node 2 c
node 1 B
node 0 a
Ittf nodes - The `$raw` template command
1 root2 # You may need node branches where nodes3 # are not interpolated.4 # Use the `$raw` node template command.5 $raw6 node ${unexistent}
root
# You may need node branches where nodes
# are not interpolated.
# Use the `$raw` node template command.
node ${unexistent}
Ittf nodes - The `$while` template command
1 root2 $ var x = 1, odds = '1'3 $while x < 104 $ x += 25 node ${ odds += ', ' + x }
root
node 1, 3
node 1, 3, 5
node 1, 3, 5, 7
node 1, 3, 5, 7, 9
node 1, 3, 5, 7, 9, 11
Ittf nodes - The `$.` template command
1 root2 # The `$.` template command compresses a node hierarchy3 # in a single string into the node value of the parent4 $.5 alpha6 beta7 gamma8 #9 # Plugins can use the function `inlinedTextToTextLines` to extract10 # the text lines compressed in a node value:11 #12 # var inlinedTextToTextLines = require("@wizzi/utils").helpers.inlinedTextToTextLines13 # var lines = inlinedTextToTextLines(model.wzName)14 #
// 6/5/2025:5:35:5 by /app/node_modules/@wizzi/mtree/lib/loader/mTreeBuildUpScriptBuilder.js
$.n(); // set the context state to NodeContext
var $0 = {}; // the root node of the mTree buildUp
var $1 = { n: "root", v: "", i: 15, r: 1, c: 1, s: "f1", u: "f1", }; //node:15
$.a($0, $1, 5);
var $2 = { n: "#", v: "The `$.` template command compresses a node hierarchy", i: 16, r: 2, c: 5, s: "f1", u: "f1", }; //node:16
$.a($1, $2, 7);
var $3 = { n: "#", v: "in a single string into the node value of the parent", i: 17, r: 3, c: 5, s: "f1", u: "f1", }; //node:17
$.a($1, $3, 9);
$1.v = $1.v ? $1.v : '' //node:18
$1.v += ($.textSep + "alpha __LS__ beta __LS__ gamma "); //node:18
var $5 = { n: "#", v: "", i: 22, r: 8, c: 5, s: "f1", u: "f1", }; //node:22
$.a($1, $5, 13);
var $6 = { n: "#", v: "Plugins can use the function `inlinedTextToTextLines` to extract", i: 23, r: 9, c: 5, s: "f1", u: "f1", }; //node:23
$.a($1, $6, 15);
var $7 = { n: "#", v: "the text lines compressed in a node value:", i: 24, r: 10, c: 5, s: "f1", u: "f1", }; //node:24
$.a($1, $7, 17);
var $8 = { n: "#", v: "", i: 25, r: 11, c: 5, s: "f1", u: "f1", }; //node:25
$.a($1, $8, 19);
var $9 = { n: "#", v: "var inlinedTextToTextLines = require(\"@wizzi/utils\").helpers.inlinedTextToTextLines", i: 26, r: 12, c: 5, s: "f1", u: "f1", }; //node:26
$.a($1, $9, 21);
var $10 = { n: "#", v: "var lines = inlinedTextToTextLines(model.wzName)", i: 27, r: 13, c: 5, s: "f1", u: "f1", }; //node:27
$.a($1, $10, 23);
var $11 = { n: "#", v: "", i: 28, r: 14, c: 5, s: "f1", u: "f1", }; //node:28
$.a($1, $11, 25);
Ittf nodes - Including fragments
Fragment: fragment-1
1 f-root-12 f-node-1a f-value-1a3 f-node-1b f-value-1b
1 root2 # Trees of Ittf nodes of other files (Ittf units)3 # can be included as branches in any node of4 # the includer Ittf document5 node-1 value-16 $include fragment-17 node-2 value-2
root
# Trees of Ittf nodes of other files (Ittf units)
# can be included as branches in any node of
# the includer Ittf document
node-1 value-1
f-root-1
f-node-1a f-value-1a
f-node-1b f-value-1b
node-2 value-2
Ittf nodes - Mixing fragments
Fragment: fragment-1
1 f-root-12 $params suffix3 f-node-1a f-value-1a-${suffix}4 f-node-1b f-value-1b-${suffix}
1 root2 # Trees of Ittf nodes of other files (Ittf units)3 # can be mixed as branches in any node of4 # the includer Ittf document,5 # passing values as parameters, and having options6 # for shaping the resulting node tree (see later)7 node-1 value-18 fragment-1( hello)9 node-2 value-2
root
# Trees of Ittf nodes of other files (Ittf units)
# can be mixed as branches in any node of
# the includer Ittf document,
# passing values as parameters, and having options
# for shaping the resulting node tree (see later)
node-1 value-1
f-root-1
f-node-1a f-value-1a-hello
f-node-1b f-value-1b-hello
node-2 value-2
Ittf nodes - Mixing inline fragments
1 root2 #3 # Fragments can be defined inside4 # the Ittf that mixes them5 #6 $fragment fragment_17 $params name8 ---9 node hello ${name}10 ---11 #12 fragment_1( bax)
root
#
# Fragments can be defined inside
# the Ittf that mixes them
#
#
---
node hello bax
---
Ittf nodes - Features of `$include`
Fragment: fragment-1
1 f-root-12 $3 var name = 'bax';4 f-node-1a f-value-1a-${name}5 f-node-1b f-value-1b-${name}
1 root2 # With `$include` the nodes of the fragment are included as is.3 # You cannot pass parameters to included documents.4 # The evaluation context of the scripts of the fragment5 # is included in the evaluation context of the includer.6 node-1 value-17 $include fragment-18 node-2 value-2-${name}
root
# With `$include` the nodes of the fragment are included as is.
# You cannot pass parameters to included documents.
# The evaluation context of the scripts of the fragment
# is included in the evaluation context of the includer.
node-1 value-1
f-root-1
f-node-1a f-value-1a-bax
f-node-1b f-value-1b-bax
node-2 value-2-bax
Ittf nodes - `$include` fragment as root
Fragment: fragment-1
1 f-root-12 f-node-1a f-value-1a3 f-node-1b f-value-1b
1 $include fragment-12 # You cannot `$include` a fragment as the3 # root node of the includer.4 # There is no way to append child nodes5 # to the included branch.6 node-1 value-17 node-2 value-2
{
"errorName": "IttfIncludeError",
"message": "A $include command cannot be a root node.",
"hint": {
"ittfErrorLines": [
"0001 $include fragment-1",
" ^ A $include command cannot be a root node. <--- --- --- --- --- ERROR",
"0002 # You cannot `$include` a fragment as the",
"0003 # root node of the includer.",
"0004 # There is no way to append child nodes",
"0005 # to the included branch."
],
"errorName": "IttfIncludeError",
"message": "A $include command cannot be a root node."
}
}
Ittf nodes - Features of `$mix`
Fragment: fragment-1
1 f-root-12 $3 var name = 'bax';4 f-node-1a f-value-1a-${name}5 f-node-1b f-value-1b-${name}
1 root2 # With `$mix` the nodes of the fragment are mixed.3 # The mixed fragment mantains its evaluation context4 # separated from that of the mixer.5 node-1 value-16 fragment-1()7 # This should raise a JsWizziError8 node-2 value-2-${name}
{
"errorName": "JsWizziError",
"message": "Identifier < name > not defined, on node < node:16, Available context keys: __dirname,__filename>",
"hint": {
"mTreeBuildUpScriptErrorLines": {
"lines": [
"0001 var _____result = name;",
" ^ unknown identifier <--- --- --- --- --- ERROR"
],
"parsedErrorLine": {
"nodeId": null
}
},
"errorName": "ReferenceError",
"message": "Identifier < name > not defined, on node < node:16, Available context keys: __dirname,__filename>"
}
}
Ittf nodes - `$mix` a fragment as root
Fragment: fragment-1
1 f-root-12 f-node-1a f-value-1a3 f-node-1b f-value-1b
1 fragment-1()2 # You can `$mix` a fragment as root node.3 # Child nodes of the mixer are appended4 # to the root of the mixed.5 node-1 value-16 node-2 value-2
f-root-1
f-node-1a f-value-1a
f-node-1b f-value-1b
# You can `$mix` a fragment as root node.
# Child nodes of the mixer are appended
# to the root of the mixed.
node-1 value-1
node-2 value-2
Ittf nodes - The `$hook` template command
Fragment: fragment-1
1 f-root-12 f-node-1a f-value-1a3 # How to mix child nodes of the mixer4 # in a specific insertion point of the mixed?5 # You can place e `$hook` node in the mixed.6 $hook7 f-node-1b f-value-1b
1 fragment-1()2 node-1 value-13 node-2 value-2
f-root-1
f-node-1a f-value-1a
# How to mix child nodes of the mixer
# in a specific insertion point of the mixed?
# You can place e `$hook` node in the mixed.
node-1 value-1
node-2 value-2
f-node-1b f-value-1b
Ittf nodes - The `$append` template command
Fragment: fragment-1
1 f-root-12 f-node-1a f-value-1a3 # You may need more than one insertion point.4 # You can place more `$hook` commands, but5 # you must give them names6 $hook one7 f-node-1b f-value-1b8 f-node-1b1 f-value-1b19 # The `$hook` with no name is10 # the default hook.11 $hook
1 fragment-1()2 $append one3 # To append children to named hooks4 # use an `$append` command with the5 # hook name6 node-1a f-value-1a7 # These are appended to the default hook8 node-1b1a f-value-1b1a9 node-1b1b f-value-1b1b
f-root-1
f-node-1a f-value-1a
# You may need more than one insertion point.
# You can place more `$hook` commands, but
# you must give them names
# To append children to named hooks
# use an `$append` command with the
# hook name
node-1a f-value-1a
f-node-1b f-value-1b
f-node-1b1 f-value-1b1
# The `$hook` with no name is
# the default hook.
# These are appended to the default hook
node-1b1a f-value-1b1a
node-1b1b f-value-1b1b
Ittf nodes - The `$virtual` and `$override` template commands
Fragment: fragment-1
1 f-root-12 f-node-1a f-value-1a3 # With $hook commands you set insertion points.4 # With the $virtual template command you can set replace points.5 $virtual one6 f-node-1b-virtual ** f-value-1b-virtual **
1 root2 # To replace virtual nodes use an `$override` command with the virtual name3 #4 # With override, the override node is included5 fragment-1()6 $override one7 node-1a-override ** f-value-1a-override **8 node-1b1a f-value-1b1a9 # With no override, the virtual node is included10 fragment-1()11 node-1b1a f-value-1b1a
root
# To replace virtual nodes use an `$override` command with the virtual name
#
# With override, the override node is included
f-root-1
f-node-1a f-value-1a
# With $hook commands you set insertion points.
# With the $virtual template command you can set replace points.
node-1a-override ** f-value-1a-override **
node-1b1a f-value-1b1a
# With no override, the virtual node is included
f-root-1
f-node-1a f-value-1a
# With $hook commands you set insertion points.
# With the $virtual template command you can set replace points.
f-node-1b-virtual ** f-value-1b-virtual **
node-1b1a f-value-1b1a
Ittf nodes - The `$group` template command
Fragment: fragment-1
1 $group2 f-root-13 f-node-1a4 f-node-ba5 f-root-26 f-node-2a7 f-node-2a
1 root2 # You may need fragments with many root nodes3 # Ittf rules do not allow more than one root node4 # You can use a `$group` template command as5 # root node of a fragment.6 $include fragment-1
root
# You may need fragments with many root nodes
# Ittf rules do not allow more than one root node
# You can use a `$group` template command as
# root node of a fragment.
f-root-1
f-node-1a
f-node-ba
f-root-2
f-node-2a
f-node-2a
Ittf fragments - Parameters by value
Fragment: lia
1 $group2 $params text, href3 li4 a ${text}5 href ${href}
1 root2 # You can pass parameters to mixed fragments.3 # Parameters are comma separated.4 # These parameters are passed by value:5 ul6 lia( alfa, #alfa)7 lia( beta, #beta)
root
# You can pass parameters to mixed fragments.
# Parameters are comma separated.
# These parameters are passed by value:
ul
li
a alfa
href #alfa
li
a beta
href #beta
Ittf fragments - Parameters default values
Fragment: fragment-1
1 f-root2 $params name|stefi3 node ${name}
1 root2 # Fragment parameters may have default values3 fragment-1()4 fragment-1( annie )
root
# Fragment parameters may have default values
f-root
node stefi
f-root
node annie
Ittf fragments - The `@@null` default value
Fragment: fragment-1
1 f-root2 $params name, kind|@@null3 node ${name}4 $if kind != null5 # ok kind not null6 $if kind == 'alpha'7 ... alpha kind ...
1 root2 # Sometimes is useful to test3 # explicitly for null (missing parameter)4 fragment-1( bax )5 fragment-1( bax, alpha )
root
# Sometimes is useful to test
# explicitly for null (missing parameter)
f-root
node bax
f-root
node bax
# ok kind not null
... alpha kind ...
Ittf fragments - Parameter types
Fragment: fragment-1
1 f-root2 $params name:string|bax, age:integer|33, hasdegree:boolean|false3 # The other types are: float and date4 node ${name}5 $if age < 406 node is young7 $else8 node is old9 $if hasdegree10 node has a degree11 $else12 node has not a degree
1 root2 # Parameters can be typed3 fragment-1( jim )4 fragment-1( bax, 67, true )
root
# Parameters can be typed
f-root
# The other types are: float and date
node jim
node is young
node has not a degree
f-root
# The other types are: float and date
node bax
node is old
node has a degree
Ittf fragments - Manipulation of parameters
Fragment: fragment-1
1 f-root2 $params commandParam|alpha;beta;gamma3 $4 var commands = [];5 var actions = commandParam.split(';')6 for (var i=0; i<actions.length; i++) {7 var tokens = actions[i].trim().split(' ');8 var command = { name: tokens[0] };9 commands.push (command);10 }11 f-node Commands: ${ _.inspect(commands) }
1 root2 # Sample manipulation of parameters3 fragment-1()4 fragment-1( sigma;tau )
root
# Sample manipulation of parameters
f-root
f-node Commands: [ { name: 'alpha' }, { name: 'beta' }, { name: 'gamma' } ]
f-root
f-node Commands: [ { name: 'sigma' }, { name: 'tau' } ]
Ittf fragments - Parameters by reference
Fragment: fragment-1
1 $group2 $params &options3 $if options.useBlog4 blog ${options.blog.name}
1 root2 # You can pass references to objects3 # as parameters of mixed fragments.4 $5 var options = {6 useBlog: true,7 blog: { name: 'Hello' }8 }9 fragment-1( &options )
root
# You can pass references to objects
# as parameters of mixed fragments.
blog Hello
Ittf nodes - Passing parameters to inline fragments
1 html2 $global3 var gName = 'bepi';4 var gData = {5 name: 'dudu'6 }7 $$ param by value8 $fragment hello_19 $params name10 h1 hello_111 h3 ${name} (... should be stefi, passed by value)12 $$ param by ref is string13 $fragment hello_214 $params &name15 h1 hello_216 h3 ${name} (... should be annie, passed var by ref)17 $$ default param is literal value18 $fragment hello_319 $params name|stefi20 h1 hello_321 h3 ${name} (... should be stefi, param default value)22 $$ default param is global context value (string)23 $fragment hello_424 $params name|&gName25 h1 hello_426 h3 ${name} (... should be bepi, param default reference to global var)27 $$ param by ref is object28 $fragment hello_529 $params &data30 h1 hello_531 h3 ${data.name} (... should be afro, passed as object property)32 $$ default param is global context value (object)33 $fragment hello_634 $params data|&gData35 h1 hello_636 h3 ${data.name} (... should be dudu, property of object that is param default value)37 body38 hello_1( stefi)39 $ var name = 'annie'40 hello_2( &name)41 hello_3()42 hello_4()43 $ var data = { name: 'afro' }44 hello_5( &data)45 hello_6()
html
body
h1 hello_1
h3 stefi (... should be stefi, passed by value)
h1 hello_2
h3 annie (... should be annie, passed var by ref)
h1 hello_3
h3 stefi (... should be stefi, param default value)
h1 hello_4
h3 bepi (... should be bepi, param default reference to global var)
h1 hello_5
h3 afro (... should be afro, passed as object property)
h1 hello_6
h3 dudu (... should be dudu, property of object that is param default value)
Ittf nodes - The `$function`, `$param`, `$_` and `$@` template commands
1 root2 # Template function commands allow a more compacted3 # fragment composition4 $function nodeItem5 $param name6 node value ${name}7 $_ nodeItem8 $@ 'stefi'
root
# Template function commands allow a more compacted
# fragment composition
node value stefi
Ittf nodes - Recursive `$function`
1 root2 # A recursive `$function` for building a tree view3 $4 var treeObj = {5 name: 'root', value: 'sample',6 children: [{7 name: 'node', value: 'branch 1',8 children: [{9 name: 'node', value: 'leaf 1a', children: []10 }]11 },{12 name: 'node', value: 'branch 2',13 children: [{14 name: 'node', value: 'branch 2a',15 children: [{16 name: 'node', value: 'leaf 2a1', children: []17 }, {18 name: 'node', value: 'leaf 2a2', children: []19 }]20 }]21 }]22 }23 $function nodeView24 $param nodeObj25 ${nodeObj.name} ${nodeObj.value}26 $foreach item in nodeObj.children27 $_ nodeView28 $@ item29 $_ nodeView30 $@ treeObj
root
# A recursive `$function` for building a tree view
root sample
node branch 1
node leaf 1a
node branch 2
node branch 2a
node leaf 2a1
node leaf 2a2
Embedding statements in interpolated expressions
1 root2 $3 var commands = [ { name: 'alpha' }, { name: 'beta' }, { name: 'gamma' } ];4 node We perform an interpolation of a multistatement JsWizzi expression.5 node We intersperse command names with dashes.6 $foreach command in commands7 node ${ command.name.toUpperCase()[0] + ' - ' + command.name }8 node This is quite crazy. But it works! ->9 \b var len = command.name.length, output = '';10 \b for (var i=0; i<len; i++) {11 \b output += command.name[i];12 \b if (i < len -1) { output += ' - '};13 \b }14 \b return output;15 \b }16 node That is why mTree stays for "magical tree".17 node See in wizzi-mtree/loader/ittfinterpolate.js how this works.
{
"errorName": "JsWizziError",
"message": "JsWizzi does not support function expressions",
"hint": {
"mTreeBuildUpScriptErrorLines": {
"lines": [
"0001 var _____result = function dummy() { var len = command.name.length, output = ''; for (var i=0; i<len; i++) { output += command.name[i]; if (i < len -1) { output += ' - '}; } return output; }();",
" ^ not supported <--- --- --- --- --- ERROR"
],
"parsedErrorLine": {
"nodeId": null
}
},
"errorName": "NotSupportedError",
"message": "JsWizzi does not support function expressions"
}
}