bali-component-framework
Version:
This library provides a JavaScript based implementation of the Bali Nebula™ Component Framework.
699 lines (698 loc) • 43.5 kB
HTML
<html>
<head>
<meta charset="UTF-8"> <link rel="stylesheet" href="https://bali-nebula.net/static/styles/BDN.css">
<link rel="apple-touch-icon" sizes="57x57" href="https://bali-nebula.net/static/icons/apple-icon-57x57.png"> <link rel="apple-touch-icon" sizes="60x60" href="https://bali-nebula.net/static/icons/apple-icon-60x60.png"> <link rel="apple-touch-icon" sizes="72x72" href="https://bali-nebula.net/static/icons/apple-icon-72x72.png"> <link rel="apple-touch-icon" sizes="76x76" href="https://bali-nebula.net/static/icons/apple-icon-76x76.png"> <link rel="apple-touch-icon" sizes="114x114" href="https://bali-nebula.net/static/icons/apple-icon-114x114.png"> <link rel="apple-touch-icon" sizes="120x120" href="https://bali-nebula.net/static/icons/apple-icon-120x120.png"> <link rel="apple-touch-icon" sizes="144x144" href="https://bali-nebula.net/static/icons/apple-icon-144x144.png"> <link rel="apple-touch-icon" sizes="152x152" href="https://bali-nebula.net/static/icons/apple-icon-152x152.png"> <link rel="apple-touch-icon" sizes="180x180" href="https://bali-nebula.net/static/icons/apple-icon-180x180.png"> <link rel="icon" type="image/png" sizes="192x192" href="https://bali-nebula.net/static/icons/android-icon-192x192.png"> <link rel="icon" type="image/png" sizes="32x32" href="https://bali-nebula.net/static/icons/favicon-32x32.png"> <link rel="icon" type="image/png" sizes="96x96" href="https://bali-nebula.net/static/icons/favicon-96x96.png"> <link rel="icon" type="image/png" sizes="16x16" href="https://bali-nebula.net/static/icons/favicon-16x16.png"> <link rel="manifest" href="https://bali-nebula.net/static/icons/manifest.json"> <meta name="msapplication-TileColor" content="#ffffff"> <meta name="msapplication-TileImage" content="https://bali-nebula.net/static/icons/ms-icon-144x144.png"> <meta name="theme-color" content="#ffffff"> </head>
<body>
<div class="document">
<div class="value">
<div class="title">TITLE</div>
<div class="catalog">
<div class="type">Catalog</div>
<div class="association">
<div class="key" style="width:12ch">
<div class="element symbol">empty</div>
</div>
<div class="colon">:</div>
<div class="value">
<div class="list">
<div class="type">List</div>
<div class="item">
<div class="list">
<div class="type">List</div>
</div>
</div>
<div class="item">
<div class="catalog">
<div class="type">Catalog</div>
</div>
</div>
</div>
</div>
</div>
<div class="association">
<div class="key" style="width:12ch">
<div class="element symbol">list</div>
</div>
<div class="colon">:</div>
<div class="value">
<div class="list">
<div class="type">List</div>
<div class="item">
<div class="list">
<div class="type">List</div>
<div class="item">
<div class="element number">1</div>
</div>
<div class="item">
<div class="element number">2</div>
</div>
<div class="item">
<div class="element number">3</div>
</div>
</div>
</div>
<div class="item">
<div class="list">
<div class="type">Set</div>
<div class="item">
<div class="element symbol">alpha</div>
</div>
<div class="item">
<div class="element symbol">beta</div>
</div>
<div class="item">
<div class="element symbol">delta</div>
</div>
<div class="item">
<div class="element symbol">gamma</div>
</div>
</div><div class="parameters">
<div class="type">Parameters</div><div class="association">
<div class="key" style="width:5ch">
<div class="element symbol">type</div></div>
<div class="colon">:</div>
<div class="value">
<div class="element name"><a href="https://bali-nebula.net/repository/names/nebula/collections/Set/v1">/nebula/collections/Set/v1</a> (ItemType: /nebula/strings/Symbol/v1)</div>
</div>
</div>
</div>
</div>
<div class="item">
<div class="list">
<div class="type">List</div>
<div class="item">
<pre class="element code">target</pre>
</div>
<div class="item">
<div class="element pattern">any</div>
</div>
<div class="item">
<div class="element pattern">"foo[Bb]ar"?</div>
</div>
<div class="item">
<div class="element pattern">none</div>
</div>
<div class="item">
<pre class="element tag">#L7JJGPAYAH7T55J5Q9Q75RRL0SVW8F1X76HWW90CHJJQAH6270DH</pre>
</div>
<div class="item">
<div class="element symbol">symbol</div>
</div>
<div class="item">
<div class="element reserved">reserved-5</div>
</div>
<div class="item">
<div class="element duration">P3Y2M1D</div>
</div>
<div class="item">
<div class="element moment">2017-07-04</div>
</div>
<div class="item">
<a class="element resource" href="https://google.com/">google.com/</a>
</div>
<div class="item">
<div class="element version">v1.2.3</div>
</div>
<div class="item">
<pre class="element text">"
"
nested
multiline
text
"
"</pre>
</div>
<div class="item">
<pre class="element binary">0110101101010001(encoding: base02)</pre>
</div>
<div class="item">
<div class="element probability">.5</div>
</div>
<div class="item">
<div class="element percentage">75%</div>
</div>
<div class="item">
<div class="element number">undefined</div>
</div>
<div class="item">
<div class="element number">∞</div>
</div>
<div class="item">
<div class="element number">-π</div>
</div>
<div class="item">
<div class="element angle">~π</div>
</div>
<div class="item">
<div class="element number">τ</div>
</div>
<div class="item">
<div class="element number">φ</div>
</div>
<div class="item">
<div class="element number">(3, 4i)</div>
</div>
<div class="item">
<div class="list">
<div class="type">List</div>
<div class="item">
<pre class="element text">"one"</pre>
</div>
<div class="item">
<pre class="element text">"two"</pre>
</div>
<div class="item">
<pre class="element text">"three"</pre>
</div>
</div>
</div>
<div class="item">
<div class="catalog">
<div class="type">Catalog</div>
<div class="association">
<div class="key" style="width:5ch">
<div class="element symbol">foo</div>
</div>
<div class="colon">:</div>
<div class="value">
<div class="element symbol">bar</div>
</div>
</div>
<div class="association">
<div class="key" style="width:5ch">
<div class="element symbol">bar</div>
</div>
<div class="colon">:</div>
<div class="value">
<div class="element number">25 (range: [1..100])</div>
</div>
</div>
<div class="association">
<div class="key" style="width:5ch">
<div class="element symbol">baz</div>
</div>
<div class="colon">:</div>
<div class="value">
<div class="element pattern">none</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="association">
<div class="key" style="width:12ch">
<div class="element symbol">catalog</div>
</div>
<div class="colon">:</div>
<div class="value">
<div class="catalog">
<div class="type">Catalog</div>
<div class="association">
<div class="key" style="width:35ch">
<div class="element reserved">a-1</div>
</div>
<div class="colon">:</div>
<div class="value">
<pre class="element text">"a"</pre>
</div>
</div>
<div class="association">
<div class="key" style="width:35ch">
<div class="element reserved">b-2</div>
</div>
<div class="colon">:</div>
<div class="value">
<pre class="element text">"b"</pre>
</div>
</div>
<div class="association">
<div class="key" style="width:35ch">
<div class="element reserved">c-3</div>
</div>
<div class="colon">:</div>
<div class="value">
<pre class="element text">"c"</pre>
</div>
</div>
<div class="association">
<div class="key" style="width:35ch">
<pre class="element text">"1."</pre>
</div>
<div class="colon">:</div>
<div class="value">
<div class="element boolean">true</div>
</div>
</div>
<div class="association">
<div class="key" style="width:35ch">
<pre class="element text">"iffy"</pre>
</div>
<div class="colon">:</div>
<div class="value">
<div class="element probability">.5</div>
</div>
</div>
<div class="association">
<div class="key" style="width:35ch">
<pre class="element text">".0"</pre>
</div>
<div class="colon">:</div>
<div class="value">
<pre class="element code">size + 1</pre>
</div>
</div>
<div class="association">
<div class="key" style="width:35ch">
<div class="element boolean">true</div>
</div>
<div class="colon">:</div>
<div class="value">
<div class="element boolean">false</div>
</div>
</div>
<div class="association">
<div class="key" style="width:35ch">
<div class="element probability">.5</div>
</div>
<div class="colon">:</div>
<div class="value">
<div class="element boolean">true</div>
</div>
</div>
<div class="association">
<div class="key" style="width:35ch">
<div class="element percentage">50%</div>
</div>
<div class="colon">:</div>
<div class="value">
<div class="element percentage">20%</div>
</div>
</div>
<div class="association">
<div class="key" style="width:35ch">
<div class="element number">∞</div>
</div>
<div class="colon">:</div>
<div class="value">
<div class="element number">undefined</div>
</div>
</div>
<div class="association">
<div class="key" style="width:35ch">
<div class="element pattern">"^.*$"?</div>
</div>
<div class="colon">:</div>
<div class="value">
<div class="element pattern">none (strict: true)</div>
</div>
</div>
<div class="association">
<div class="key" style="width:35ch">
<pre class="element tag">#665VRFNFZMQX09TSKHJSD1HL567F4FF7</pre>
</div>
<div class="colon">:</div>
<div class="value">
<pre class="element tag">#CT41AC8K5AZBMJF88W60F40SZQCMA0XN (size: 20)</pre>
</div>
</div>
<div class="association">
<div class="key" style="width:35ch">
<div class="element symbol">foo</div>
</div>
<div class="colon">:</div>
<div class="value">
<div class="element symbol">bar (baz: baz)</div>
</div>
</div>
<div class="association">
<div class="key" style="width:35ch">
<div class="element name"><a href="https://bali-nebula.net/repository/names/name">/name</a></div>
</div>
<div class="colon">:</div>
<div class="value">
<div class="element name"><a href="https://bali-nebula.net/repository/names/name">/name</a> (relative: false)</div>
</div>
</div>
<div class="association">
<div class="key" style="width:35ch">
<div class="element duration">P0D</div>
</div>
<div class="colon">:</div>
<div class="value">
<div class="element duration">P1Y3M24D7H32M15S</div>
</div>
</div>
<div class="association">
<div class="key" style="width:35ch">
<div class="element moment">2017-04-01</div>
</div>
<div class="colon">:</div>
<div class="value">
<div class="element moment">2017-04-01 (country: "USA")</div>
</div>
</div>
<div class="association">
<div class="key" style="width:35ch">
<a class="element resource" href="https://craterdog.com/">craterdog.com/</a>
</div>
<div class="colon">:</div>
<div class="value">
<a class="element resource" href="https://bali-nebula.net/nebula/examples">bali-nebula.net/nebula/examples?foo=5&bar=false</a>
</div>
</div>
<div class="association">
<div class="key" style="width:35ch">
<div class="element version">v1</div>
</div>
<div class="colon">:</div>
<div class="value">
<div class="element version">v2.3 (patch: true)</div>
</div>
</div>
<div class="association">
<div class="key" style="width:35ch">
<pre class="element text">"key"</pre>
</div>
<div class="colon">:</div>
<div class="value">
<pre class="element text">"value" (mediaType: "text")</pre>
</div>
</div>
<div class="association">
<div class="key" style="width:35ch">
<pre class="element binary">MMNBXR9TC237PK269GLFZ4J4XA4R9LF1</pre>
</div>
<div class="colon">:</div>
<div class="value">
<pre class="element binary">0111010110101100100011(encoding: base16)</pre>
</div>
</div>
<div class="association">
<div class="key" style="width:35ch">
<div class="element angle">~π</div>
</div>
<div class="colon">:</div>
<div class="value">
<div class="element angle">~π (units: radians)</div>
</div>
</div>
<div class="association">
<div class="key" style="width:35ch">
<div class="element number">τ</div>
</div>
<div class="colon">:</div>
<div class="value">
<div class="element number">-6.28318531</div>
</div>
</div>
<div class="association">
<div class="key" style="width:35ch">
<div class="element number">(1, 2i)</div>
</div>
<div class="colon">:</div>
<div class="value">
<div class="element number">(5 e^~1.4i)</div>
</div>
</div>
<div class="association">
<div class="key" style="width:35ch">
<div class="element symbol">sequence</div>
</div>
<div class="colon">:</div>
<div class="value">
<div class="list">
<div class="type">Queue</div>
<div class="item">
<pre class="element text">"short"</pre>
</div>
<div class="item">
<pre class="element text">"sequence"</pre>
</div>
</div><div class="parameters">
<div class="type">Parameters</div><div class="association">
<div class="key" style="width:5ch">
<div class="element symbol">type</div></div>
<div class="colon">:</div>
<div class="value">
<div class="element name"><a href="https://bali-nebula.net/repository/names/nebula/collections/Queue/v1">/nebula/collections/Queue/v1</a></div>
</div>
</div>
</div>
</div>
</div>
<div class="association">
<div class="key" style="width:35ch">
<div class="element symbol">table</div>
</div>
<div class="colon">:</div>
<div class="value">
<div class="catalog">
<div class="type">Foo</div>
<div class="association">
<div class="key" style="width:3ch">
<div class="element symbol">a</div>
</div>
<div class="colon">:</div>
<div class="value">
<div class="element number">e</div>
</div>
</div>
<div class="association">
<div class="key" style="width:3ch">
<div class="element symbol">b</div>
</div>
<div class="colon">:</div>
<div class="value">
<div class="element number">-π</div>
</div>
</div>
<div class="association">
<div class="key" style="width:3ch">
<div class="element symbol">c</div>
</div>
<div class="colon">:</div>
<div class="value">
<div class="element number">φ</div>
</div>
</div>
<div class="association">
<div class="key" style="width:3ch">
<div class="element symbol">d</div>
</div>
<div class="colon">:</div>
<div class="value">
<div class="element number">τ</div>
</div>
</div>
<div class="association">
<div class="key" style="width:3ch">
<div class="element symbol">e</div>
</div>
<div class="colon">:</div>
<div class="value">
<div class="element number">∞</div>
</div>
</div>
</div><div class="parameters">
<div class="type">Parameters</div><div class="association">
<div class="key" style="width:5ch">
<div class="element symbol">type</div></div>
<div class="colon">:</div>
<div class="value">
<div class="element name"><a href="https://bali-nebula.net/repository/names/acme/examples/Foo/v1.2.3">/acme/examples/Foo/v1.2.3</a></div>
</div>
</div>
</div>
</div>
</div>
<div class="association">
<div class="key" style="width:35ch">
<div class="element symbol">procedure</div>
</div>
<div class="colon">:</div>
<div class="value">
<pre class="element code">{
if condition then {
return true
} else {
throw exception
}
} (condition: /nebula/elements/Boolean/v1)</pre>
</div>
</div>
</div>
</div>
</div>
<div class="association">
<div class="key" style="width:12ch">
<div class="element symbol">procedures</div>
</div>
<div class="colon">:</div>
<div class="value">
<div class="list">
<div class="type">List</div>
<div class="item">
<pre class="element code">{
}</pre>
</div>
<div class="item">
<pre class="element code">{
$foo := bar
$bar := baz
} (bar: baz)</pre>
</div>
<div class="item">
<pre class="element code">{
if condition then {
$x := y
} else {
return x
}
} (y: 5, baz: none, condition: true)</pre>
</div>
</div>
</div>
</div>
<div class="association">
<div class="key" style="width:12ch">
<div class="element symbol">binaries</div>
</div>
<div class="colon">:</div>
<div class="value">
<div class="list">
<div class="type">List</div>
<div class="item">
<pre class="element binary">(encoding: base02)</pre>
</div>
<div class="item">
<pre class="element binary">
001011011001110101000001010011111011110100110111000111100000
00000100011001001101
(encoding: base16)</pre>
</div>
<div class="item">
<pre class="element binary">
C3393B1543ACD32429A15D22A557C42DDD227DDDDA69D9CD55A7923D214A
49D8A9C1AAC975C02B58
</pre>
</div>
<div class="item">
<pre class="element binary">
51540EF86BC3660D4F4F95D3EF1E57E5A79396A2C6D4590A50202A849881
45ADAEB3DC84737D6021CC0DB3E13EFDC90DBF4917172BA27E426FA6398A
790CE723DB70712361EDDF7DAEE5EDB706CA1A631DBCD80988E98171E166
C8BF8D3BE0E97F6E655105E74D96F9F86026504B752854B9316D0AB8263A
(encoding: base16)</pre>
</div>
<div class="item">
<pre class="element binary">
234VDR3AFBR3N596XPHCZL7HNL2NX9FTV858QH33QQR62GP176PW7DAKCB1H
DW411WRC0YS71NWKA93S
(encoding: base64)</pre>
</div>
</div>
</div>
</div>
<div class="association">
<div class="key" style="width:12ch">
<div class="element symbol">texts</div>
</div>
<div class="colon">:</div>
<div class="value">
<div class="list">
<div class="type">List</div>
<div class="item">
<pre class="element text">"simple"</pre>
</div>
<div class="item">
<pre class="element text">"This is a sentence."</pre>
</div>
<div class="item">
<pre class="element text">"This contains a \"quoted\" word."</pre>
</div>
<div class="item">
<pre class="element text">"This contains a \n new line character."</pre>
</div>
<div class="item">
<pre class="element text">"This contains a {procedure}."</pre>
</div>
</div>
</div>
</div>
<div class="association">
<div class="key" style="width:12ch">
<div class="element symbol">moments</div>
</div>
<div class="colon">:</div>
<div class="value">
<div class="list">
<div class="type">List</div>
<div class="item">
<div class="element moment">1000 (country: "Atlantis")</div>
</div>
<div class="item">
<div class="element moment">1962-04-01 (city: "New York City")</div>
</div>
<div class="item">
<div class="element moment">1962-04-01 06:31 (city: "San Francisco")</div>
</div>
<div class="item">
<div class="element moment">1962-04-01 06:31:59.726 (city: "Denver", region: "Colorado", country: "USA")</div>
</div>
</div>
</div>
</div>
<div class="association">
<div class="key" style="width:12ch">
<div class="element symbol">ranges</div>
</div>
<div class="colon">:</div>
<div class="value">
<div class="list">
<div class="type">List</div>
<div class="item">
<div class="range">[<div class="element number">-3</div>..<div class="element number">5</div>]</div>
</div>
<div class="item">
<div class="range">[<div class="element number">π</div><..<div class="element number">τ</div>]</div>
</div>
<div class="item">
<div class="range">[<div class="element number">0</div>..<<div class="element number"> </div>]</div>
</div>
<div class="item">
<div class="range">[<div class="element number">0</div>..<<div class="element number">∞</div>]</div>
</div>
<div class="item">
<div class="range">[<div class="element number"> </div>..<<div class="element number">-1</div>]</div>
</div>
<div class="item">
<div class="range">[<pre class="element code">-∞</pre>..<<div class="element number">-1</div>]</div>
</div>
<div class="item">
<div class="range">[<div class="element number"> </div><..<<div class="element number"> </div>]</div>
</div>
<div class="item">
<div class="range">[<pre class="element code">-∞</pre><..<<div class="element number">∞</div>]</div>
</div>
<div class="item">
<div class="range">[<div class="element number"> </div>..<div class="element number"> </div>]</div>
</div>
<div class="item">
<div class="range">[<pre class="element code">-∞</pre>..<div class="element number">∞</div>]</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="poweredBy">
<img class="logo" src="https://bali-nebula.net/static/images/CraterDog.png">
</div>
</body>
</html>