npm - spyne - Versions diffs - 0.19.0 → 0.20.0 - Mend

spyne 0.19.0 → 0.20.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (129) hide show

package/.eslintrc.js +4 -3
package/.travis.yml +24 -11
package/karma.conf.js +76 -86
package/lib/spyne.esm.js +15 -0
package/lib/spyne.esm.js.map +1 -0
package/lib/spyne.umd.js +9565 -0
package/package.json +46 -26
package/rollup.config.js +26 -0
package/src/spyne/channels/channel-fetch-class.js +39 -43
package/src/spyne/channels/channel-payload-class.js +61 -74
package/src/spyne/channels/channel-proxy.js +25 -26
package/src/spyne/channels/channel.js +141 -149
package/src/spyne/channels/channels-config.js +46 -47
package/src/spyne/channels/channels-map.js +61 -65
package/src/spyne/channels/spyne-channel-lifecycle.js +12 -12
package/src/spyne/channels/spyne-channel-route.js +241 -250
package/src/spyne/channels/spyne-channel-ui.js +213 -75
package/src/spyne/channels/spyne-channel-window.js +157 -157
package/src/spyne/spyne-app.js +32 -19
package/src/spyne/spyne-plugins.js +55 -70
package/src/spyne/spyne.js +23 -23
package/src/spyne/utils/channel-config-validator.js +10 -10
package/src/spyne/utils/channel-fetch-util.js +72 -55
package/src/spyne/utils/channel-payload-filter.js +89 -100
package/src/spyne/utils/deep-merge.js +31 -29
package/src/spyne/utils/frp-tools.js +108 -92
package/src/spyne/utils/gc.js +6 -6
package/src/spyne/utils/mixins/base-core-mixins.js +17 -15
package/src/spyne/utils/mixins/base-streams-mixins.js +9 -9
package/src/spyne/utils/route-channel-updater.js +23 -29
package/src/spyne/utils/safe-clone.js +40 -58
package/src/spyne/utils/sanitize-html.js +35 -0
package/src/spyne/utils/security-policy.js +11 -0
package/src/spyne/utils/spyne-app-properties.js +110 -114
package/src/spyne/utils/spyne-logger.js +4 -11
package/src/spyne/utils/spyne-plugins-methods.js +38 -63
package/src/spyne/utils/spyne-trait.js +33 -33
package/src/spyne/utils/spyne-utils-channel-route-url.js +229 -153
package/src/spyne/utils/spyne-utils-channel-route.js +128 -138
package/src/spyne/utils/spyne-utils-channel-window.js +39 -39
package/src/spyne/utils/viewstream-animations.js +12 -12
package/src/spyne/utils/viewstream-observables.js +45 -45
package/src/spyne/views/dom-element-template.js +111 -114
package/src/spyne/views/dom-element.js +82 -84
package/src/spyne/views/view-stream-broadcaster.js +66 -62
package/src/spyne/views/view-stream-element.js +105 -106
package/src/spyne/views/view-stream-payload.js +25 -27
package/src/spyne/views/view-stream-selector.js +157 -163
package/src/spyne/views/view-stream.js +416 -640
package/src/tests/channels/channel-dom.test.js +15 -15
package/src/tests/channels/channel-fetch.test.js +51 -62
package/src/tests/channels/channel-payload-class.test.js +50 -63
package/src/tests/channels/channel-payload-filter.test.js +133 -193
package/src/tests/channels/channel-route.test.js +102 -112
package/src/tests/channels/channel-stream-item.test.js +19 -19
package/src/tests/channels/channel-ui.test.js +15 -27
package/src/tests/channels/channel-util-dom.test.js +31 -31
package/src/tests/channels/channel.test.js +20 -25
package/src/tests/channels/route-utils.test.js +61 -66
package/src/tests/channels/url-utils.test.js +151 -151
package/src/tests/channels/view-stream-broadcaster.test.js +7 -7
package/src/tests/import.test.js +5 -5
package/src/tests/index.js +6 -7
package/src/tests/index.test.js +6 -8
package/src/tests/mocks/channel-payload-data.js +218 -220
package/src/tests/mocks/enhancer.test.js +5 -5
package/src/tests/mocks/payload-ui.js +87 -90
package/src/tests/mocks/routes-data.js +264 -266
package/src/tests/mocks/spyne-docs.mocks.js +3 -3
package/src/tests/mocks/template-renderer.mocks.js +47 -47
package/src/tests/mocks/utils-data.js +78 -79
package/src/tests/mocks/viewstream-internal-payload.mocks.js +50 -50
package/src/tests/mocks/window-events-arr.js +1 -1
package/src/tests/package-json.spec.test.js +9 -0
package/src/tests/spyne-app.test.js +15 -18
package/src/tests/spyne-plugin.test.js +16 -20
package/src/tests/utils/channel-action-filter.test.js +84 -86
package/src/tests/utils/channel-data-packet-generator.unused.js +62 -86
package/src/tests/utils/channel-fetch-util.test.js +64 -66
package/src/tests/utils/frp-tools.test.js +19 -19
package/src/tests/utils/plugins-methods.test.js +31 -55
package/src/tests/utils/security.test.js +10 -0
package/src/tests/utils/spyne-app-properties.test.js +4 -8
package/src/tests/views/dom-el-selectors.test.js +112 -119
package/src/tests/views/dom-el-template-proxy.test.js +7 -0
package/src/tests/views/dom-el-template.test.js +186 -156
package/src/tests/views/dom-el.test.js +58 -56
package/src/tests/views/view-stream-enhancer-loader.test.js +2 -2
package/src/tests/views/view-stream-enhancer.test.js +11 -11
package/src/tests/views/view-stream.test.js +22 -33
package/webpack.config.js +76 -67
package/docs/-_%20Solves%20equations%20of%20the%20form%20a%20_%20x%20=%20b.html +0 -487
package/docs/DomItem.html +0 -298
package/docs/DomItem_DomItem.html +0 -314
package/docs/ViewStream.html +0 -2249
package/docs/ViewStream_ViewStream.html +0 -503
package/docs/custom/css/jsdoc-viewstream.css +0 -377
package/docs/custom/layout.tmpl +0 -47
package/docs/dom-item.js.html +0 -213
package/docs/fonts/OpenSans-Bold-webfont.eot +0 -0
package/docs/fonts/OpenSans-Bold-webfont.svg +0 -1830
package/docs/fonts/OpenSans-Bold-webfont.woff +0 -0
package/docs/fonts/OpenSans-BoldItalic-webfont.eot +0 -0
package/docs/fonts/OpenSans-BoldItalic-webfont.svg +0 -1830
package/docs/fonts/OpenSans-BoldItalic-webfont.woff +0 -0
package/docs/fonts/OpenSans-Italic-webfont.eot +0 -0
package/docs/fonts/OpenSans-Italic-webfont.svg +0 -1830
package/docs/fonts/OpenSans-Italic-webfont.woff +0 -0
package/docs/fonts/OpenSans-Light-webfont.eot +0 -0
package/docs/fonts/OpenSans-Light-webfont.svg +0 -1831
package/docs/fonts/OpenSans-Light-webfont.woff +0 -0
package/docs/fonts/OpenSans-LightItalic-webfont.eot +0 -0
package/docs/fonts/OpenSans-LightItalic-webfont.svg +0 -1835
package/docs/fonts/OpenSans-LightItalic-webfont.woff +0 -0
package/docs/fonts/OpenSans-Regular-webfont.eot +0 -0
package/docs/fonts/OpenSans-Regular-webfont.svg +0 -1831
package/docs/fonts/OpenSans-Regular-webfont.woff +0 -0
package/docs/global.html +0 -548
package/docs/index-custom.html +0 -79
package/docs/index.html +0 -82
package/docs/jsdoc.config.json +0 -22
package/docs/scripts/linenumber.js +0 -25
package/docs/scripts/prettify/Apache-License-2.0.txt +0 -202
package/docs/scripts/prettify/lang-css.js +0 -2
package/docs/scripts/prettify/prettify.js +0 -28
package/docs/styles/jsdoc-default.css +0 -358
package/docs/styles/prettify-jsdoc.css +0 -111
package/docs/styles/prettify-tomorrow.css +0 -132
package/docs/view-stream.js.html +0 -767

package/docs/ViewStream.html DELETED Viewed

@@ -1,2249 +0,0 @@
-<!DOCTYPE html>
-<html lang="en">
-<head>
-    <meta charset="utf-8">
-    <title>JSDoc: Class: ViewStream</title>
-    <link href="https://fonts.googleapis.com/css?family=Roboto+Slab" rel="stylesheet">
-    <script src="scripts/prettify/prettify.js"> </script>
-    <script src="scripts/prettify/lang-css.js"> </script>
-    <!--[if lt IE 9]>
-      <script src="//html5shiv.googlecode.com/svn/trunk/html5.js"></script>
-    <![endif]-->
-    <link type="text/css" rel="stylesheet" href="styles/prettify-tomorrow.css">
-<!--
-    <link type="text/css" rel="stylesheet" href="styles/jsdoc-default.css">
--->
-    <link type="text/css" rel="stylesheet" href="custom/css/jsdoc-viewstream.css">
-</head>
-<body>
-<div id="main">
-    <a class="page-title spyne" href='https://www.npmjs.com/package/spyne' target='blank'>spyne</a>
-<!--
-    <h1 class="page-title">Class: ViewStream</h1>
--->
-<section>
-<header>
-        <h2><span class="attribs"><span class="type-signature"></span></span>ViewStream<span class="signature">(props)</span><span class="type-signature"></span></h2>
-</header>
-<article>
-    <div class="container-overview">
-    <h4 class="name" id="ViewStream"><span class="type-signature"></span>new ViewStream<span class="signature">(props)</span><span class="type-signature"></span></h4>
-<div class="description">
-    <p>The ViewStream object creates or references  a dom elment; the dom element can be as simple as a &#60;p&gt; tag, or the dom element can be a large dom chunk that is generated from data and an html template.
-<br><br>
-Generally, the idea is to extend the ViewStream class and add the custom values within the constructor function, but all of the values can be passed as parameters as well.</p>
-</div>
-    <h5>Parameters:</h5>
-<table class="params">
-    <thead>
-    <tr>
-        <th>Name</th>
-        <th>Type</th>
-        <th class="last">Description</th>
-    </tr>
-    </thead>
-    <tbody>
-        <tr>
-                <td class="name"><code>props</code></td>
-            <td class="type">
-<span class="param-type">object</span>
-            </td>
-            <td class="description last"><p>This json object takes in parameters to generate or reference the dom element</p></td>
-        </tr>
-    </tbody>
-</table>
-    <h5 class="subsection-title">Properties:</h5>
-<table class="props">
-    <thead>
-    <tr>
-        <th>Name</th>
-        <th>Type</th>
-        <th class="last">Description</th>
-    </tr>
-    </thead>
-    <tbody>
-        <tr>
-                <td class="name"><code>props.tagName</code></td>
-            <td class="type">
-<span class="param-type">string</span>
-            </td>
-            <td class="description last"><p>'div'  This can be any dom tag</p></td>
-        </tr>
-        <tr>
-                <td class="name"><code>props.el</code></td>
-            <td class="type">
-<span class="param-type">domItem</span>
-            </td>
-            <td class="description last"><p>undefined, if defined, ViewStream will connect to that element</p></td>
-        </tr>
-        <tr>
-                <td class="name"><code>props.data</code></td>
-            <td class="type">
-<span class="param-type">string</span>
-|
-<span class="param-type">object</span>
-            </td>
-            <td class="description last"><p>undefined, // string for innerText or Json object for html template</p></td>
-        </tr>
-        <tr>
-                <td class="name"><code>props.animateIn</code></td>
-            <td class="type">
-<span class="param-type">boolean</span>
-            </td>
-            <td class="description last"><p>false, animates in View</p></td>
-        </tr>
-        <tr>
-                <td class="name"><code>props.animateInTime</code></td>
-            <td class="type">
-<span class="param-type">number</span>
-            </td>
-            <td class="description last"><p>.5</p></td>
-        </tr>
-        <tr>
-                <td class="name"><code>props.animateOut</code></td>
-            <td class="type">
-<span class="param-type">boolean</span>
-            </td>
-            <td class="description last"><p>false, animates in View</p></td>
-        </tr>
-        <tr>
-                <td class="name"><code>props.animateOutTime</code></td>
-            <td class="type">
-<span class="param-type">number</span>
-            </td>
-            <td class="description last"><p>.5</p></td>
-        </tr>
-        <tr>
-                <td class="name"><code>props.id</code></td>
-            <td class="type">
-<span class="param-type">string</span>
-            </td>
-            <td class="description last"><p>undefined, generates a random id if left undefined</p></td>
-        </tr>
-        <tr>
-                <td class="name"><code>props.debug</code></td>
-            <td class="type">
-<span class="param-type">boolean</span>
-            </td>
-            <td class="description last"><p>false</p></td>
-        </tr>
-        <tr>
-                <td class="name"><code>props.tmpl</code></td>
-            <td class="type">
-<span class="param-type">tmpl</span>
-            </td>
-            <td class="description last"><p>undefined, // html template</p></td>
-        </tr>
-    </tbody>
-</table>
-<dl class="details">
-    <dt class="tag-source">Source:</dt>
-    <dd class="tag-source"><ul class="dummy"><li>
-        <a href="view-stream.js.html">view-stream.js</a>, <a href="view-stream.js.html#line15">line 15</a>
-    </li></ul></dd>
-</dl>
-    <h5>Examples</h5>
-    <pre class="prettyprint"><code>// returns &lt;h2>Hello World&lt;/h2>
-new ViewStream({tagName:'h2', data:'Hello World'};</code></pre>
-    <pre class="prettyprint"><code>//  returns
-&lt;ul>
-   &lt;li>firstName: Jane&lt;li>
-   &lt;li>lastName: Doe&lt;li>
-   &lt;li>Age: 23&lt;li>
-&lt;/ul>
-let myTemplate = '&lt;li>firstName: {{fName}}&lt;li>lastName: {{lName}}&lt;li>Age: {{age}}';
-let myData = {fName: Jane, lName: Doe, age:23};
-new ViewStream({tagName:'ul', data:myData, tmpl:myTemplate});</code></pre>
-    </div>
-        <h3 class="subsection-title">Methods</h3>
-    <h4 class="name" id="addChannel"><span class="type-signature"></span>addChannel<span class="signature">(str, bool, bool)</span><span class="type-signature"></span></h4>
-<div class="description">
-    <p>Preferred method to connect to instances of registered channels, such as 'DOM', 'UI', and 'ROUTE' channels.</p>
-<p>Add Channel will automatically unsubscribe to the channel, whereas the getChannel method requires the developer to manually unsubscribe.</p>
-</div>
-    <h5>Parameters:</h5>
-<table class="params">
-    <thead>
-    <tr>
-        <th>Name</th>
-        <th>Type</th>
-        <th>Default</th>
-        <th class="last">Description</th>
-    </tr>
-    </thead>
-    <tbody>
-        <tr>
-                <td class="name"><code>str</code></td>
-            <td class="type">
-<span class="param-type">string</span>
-            </td>
-                <td class="default">
-                </td>
-            <td class="description last"><p>The name of the registered Channel that was added to the Channels Controller.</p></td>
-        </tr>
-        <tr>
-                <td class="name"><code>bool</code></td>
-            <td class="type">
-<span class="param-type">boolean</span>
-            </td>
-                <td class="default">
-                    false
-                </td>
-            <td class="description last"><p>false, add true if the View should wait for this channel to unsubscribe before removing itself.</p></td>
-        </tr>
-        <tr>
-                <td class="name"><code>bool</code></td>
-            <td class="type">
-<span class="param-type">sendDownStream</span>
-            </td>
-                <td class="default">
-                </td>
-            <td class="description last"><p>The direction where the stream is allowed to travel.</p></td>
-        </tr>
-    </tbody>
-</table>
-<dl class="details">
-    <dt class="tag-source">Source:</dt>
-    <dd class="tag-source"><ul class="dummy"><li>
-        <a href="view-stream.js.html">view-stream.js</a>, <a href="view-stream.js.html#line643">line 643</a>
-    </li></ul></dd>
-</dl>
-    <h5>Example</h5>
-    <pre class="prettyprint"><code>let routeChannel = this.addChannel('ROUTE');
-     extendedStateMethods() {
-          return [
-            ['CHANNEL_ROUTE_CHANGE_EVENT', 'onMapRouteEvent']
-          ]
-      }
-      onMapRouteEvent(p) {
-         console.log('the route value is ', p);
-      }</code></pre>
-    <h4 class="name" id="afterRender"><span class="type-signature"></span>afterRender<span class="signature">()</span><span class="type-signature"></span></h4>
-<div class="description">
-    <p>This method is called once the ViewStream's domElement has been rendered and attached to the dom.
-<br>
-This method is empty and is meant to be overridden.</p>
-</div>
-<dl class="details">
-    <dt class="tag-source">Source:</dt>
-    <dd class="tag-source"><ul class="dummy"><li>
-        <a href="view-stream.js.html">view-stream.js</a>, <a href="view-stream.js.html#line565">line 565</a>
-    </li></ul></dd>
-</dl>
-    <h4 class="name" id="appendToDom"><span class="type-signature"></span>appendToDom<span class="signature">(node)</span><span class="type-signature"></span></h4>
-<div class="description">
-    <p>Appends a ViewStream object to an existing dom element.</p>
-</div>
-    <h5>Parameters:</h5>
-<table class="params">
-    <thead>
-    <tr>
-        <th>Name</th>
-        <th>Type</th>
-        <th class="last">Description</th>
-    </tr>
-    </thead>
-    <tbody>
-        <tr>
-                <td class="name"><code>node</code></td>
-            <td class="type">
-<span class="param-type">dom</span>
-            </td>
-            <td class="description last"><p>the ViewStream child that is to be attached.</p></td>
-        </tr>
-    </tbody>
-</table>
-<dl class="details">
-    <dt class="tag-source">Source:</dt>
-    <dd class="tag-source"><ul class="dummy"><li>
-        <a href="view-stream.js.html">view-stream.js</a>, <a href="view-stream.js.html#line434">line 434</a>
-    </li></ul></dd>
-</dl>
-    <h5>Example</h5>
-    <pre class="prettyprint"><code>//  returns
-&lt;body>
-   &lt;h2>Hello World&lt;/h2>
-&lt;/body>
-let viewStream = new ViewStream('h2', 'Hello World');
-viewStream.appendToDom(document.body);</code></pre>
-    <h4 class="name" id="appendView"><span class="type-signature"></span>appendView<span class="signature">(v, query)</span><span class="type-signature"></span></h4>
-<div class="description">
-    <p>This method appends a child ViewStream object. <br>After the attachment, rxjs observables are exchanged between the parent and child ViewStream objects.<br><br></p>
-</div>
-    <h5>Parameters:</h5>
-<table class="params">
-    <thead>
-    <tr>
-        <th>Name</th>
-        <th>Type</th>
-        <th class="last">Description</th>
-    </tr>
-    </thead>
-    <tbody>
-        <tr>
-                <td class="name"><code>v</code></td>
-            <td class="type">
-<span class="param-type"><a href="ViewStream.html">ViewStream</a></span>
-            </td>
-            <td class="description last"><p>the ViewStream child that is to be attached.</p></td>
-        </tr>
-        <tr>
-                <td class="name"><code>query</code></td>
-            <td class="type">
-<span class="param-type">string</span>
-            </td>
-            <td class="description last"><p>a querySelector within this ViewStream.</p></td>
-        </tr>
-    </tbody>
-</table>
-<dl class="details">
-    <dt class="tag-source">Source:</dt>
-    <dd class="tag-source"><ul class="dummy"><li>
-        <a href="view-stream.js.html">view-stream.js</a>, <a href="view-stream.js.html#line471">line 471</a>
-    </li></ul></dd>
-</dl>
-    <h5>Example</h5>
-    <pre class="prettyprint"><code>//  returns
-&lt;body>
-   &lt;main>
-       &lt;h2>Hello World&lt;/h2>
-   &lt;/main>
-&lt;/body>
-let parentView = new ViewStream('main');
-parentView.appendToDom(document.body);
-let childView = new ViewStream({tagName:'h2', data:'Hello World'};
-parentView.appendView(childView)</code></pre>
-    <h4 class="name" id="appendViewToParent"><span class="type-signature"></span>appendViewToParent<span class="signature">(v, query, this)</span><span class="type-signature"></span></h4>
-<div class="description">
-    <p>This method appends a child ViewStream object to a parent ViewStream object.</p>
-</div>
-    <h5>Parameters:</h5>
-<table class="params">
-    <thead>
-    <tr>
-        <th>Name</th>
-        <th>Type</th>
-        <th class="last">Description</th>
-    </tr>
-    </thead>
-    <tbody>
-        <tr>
-                <td class="name"><code>v</code></td>
-            <td class="type">
-<span class="param-type"><a href="ViewStream.html">ViewStream</a></span>
-            </td>
-            <td class="description last"><p>the ViewStream parent.</p></td>
-        </tr>
-        <tr>
-                <td class="name"><code>query</code></td>
-            <td class="type">
-<span class="param-type">string</span>
-            </td>
-            <td class="description last"><p>a querySelector within this ViewStream.</p></td>
-        </tr>
-        <tr>
-                <td class="name"><code>this</code></td>
-            <td class="type">
-<span class="param-type">level</span>
-            </td>
-            <td class="description last"><p>parameters can attach the viewStream's dom element up the dom tree while still maintaining the parent-child relationship of the ViewStream objects.</p></td>
-        </tr>
-    </tbody>
-</table>
-<dl class="details">
-    <dt class="tag-source">Source:</dt>
-    <dd class="tag-source"><ul class="dummy"><li>
-        <a href="view-stream.js.html">view-stream.js</a>, <a href="view-stream.js.html#line498">line 498</a>
-    </li></ul></dd>
-</dl>
-    <h5>Example</h5>
-    <pre class="prettyprint"><code>//  returns
-&lt;body>
-   &lt;main>
-       &lt;h2>Hello World&lt;/h2>
-   &lt;/main>
-&lt;/body>
-let parentView = new ViewStream('main');
-parentView.appendToDom(document.body);
-let childView = new ViewStream({tagName:'h2', data:'Hello World'};
-childView.appendToParent(parentView)</code></pre>
-    <h4 class="name" id="broadcastEvents"><span class="type-signature"></span>broadcastEvents<span class="signature">()</span><span class="type-signature"></span></h4>
-<div class="description">
-    <p>Add any query within the ViewStream's dom and any dom events to automatically be observed by the UI Channel.
-<br></p>
-</div>
-<dl class="details">
-    <dt class="tag-source">Source:</dt>
-    <dd class="tag-source"><ul class="dummy"><li>
-        <a href="view-stream.js.html">view-stream.js</a>, <a href="view-stream.js.html#line585">line 585</a>
-    </li></ul></dd>
-</dl>
-    <h5>Example</h5>
-    <pre class="prettyprint"><code>broadcastEvents() {
- // ADD BUTTON EVENTS AS NESTED ARRAYS
- return [
-      ['#my-button', 'mouseover'],
-      ['#my-input', 'change']
-    ]
-  }</code></pre>
-    <h4 class="name" id="getChannel"><span class="type-signature"></span>getChannel<span class="signature">()</span><span class="type-signature"></span></h4>
-<div class="description">
-    <p>Automatically connect to an instance of registered channels, such as 'DOM', 'UI', and 'ROUTE' channels.</p>
-</div>
-<dl class="details">
-    <dt class="tag-source">Source:</dt>
-    <dd class="tag-source"><ul class="dummy"><li>
-        <a href="view-stream.js.html">view-stream.js</a>, <a href="view-stream.js.html#line606">line 606</a>
-    </li></ul></dd>
-</dl>
-    <h5>Example</h5>
-    <pre class="prettyprint"><code>let uiChannel = this.getChannel('UI');
-uiChannel
-   .filter((p) => p.data.id==='#my-button')
-   .subscribe((p) => console.log('my button was clicked ', p));</code></pre>
-    <h4 class="name" id="prependToDom"><span class="type-signature"></span>prependToDom<span class="signature">(node)</span><span class="type-signature"></span></h4>
-<div class="description">
-    <p>Prepends the current ViewStream object to an existing dom element.</p>
-</div>
-    <h5>Parameters:</h5>
-<table class="params">
-    <thead>
-    <tr>
-        <th>Name</th>
-        <th>Type</th>
-        <th class="last">Description</th>
-    </tr>
-    </thead>
-    <tbody>
-        <tr>
-                <td class="name"><code>node</code></td>
-            <td class="type">
-<span class="param-type">dom</span>
-            </td>
-            <td class="description last"><p>the ViewStream child that is to be attached.</p></td>
-        </tr>
-    </tbody>
-</table>
-<dl class="details">
-    <dt class="tag-source">Source:</dt>
-    <dd class="tag-source"><ul class="dummy"><li>
-        <a href="view-stream.js.html">view-stream.js</a>, <a href="view-stream.js.html#line447">line 447</a>
-    </li></ul></dd>
-</dl>
-    <h5>Example</h5>
-    <pre class="prettyprint"><code>this.prependToDom(document.body);</code></pre>
-    <h4 class="name" id="prependView"><span class="type-signature"></span>prependView<span class="signature">(v, query)</span><span class="type-signature"></span></h4>
-<div class="description">
-    <p>This method prepends a child ViewStream object to the current ViewStream object. <br>After the attachment, rxjs observables are exchanged between the parent and child ViewStream objects.<br><br></p>
-</div>
-    <h5>Parameters:</h5>
-<table class="params">
-    <thead>
-    <tr>
-        <th>Name</th>
-        <th>Type</th>
-        <th class="last">Description</th>
-    </tr>
-    </thead>
-    <tbody>
-        <tr>
-                <td class="name"><code>v</code></td>
-            <td class="type">
-<span class="param-type"><a href="ViewStream.html">ViewStream</a></span>
-            </td>
-            <td class="description last"><p>the ViewStream child that is to be attached.</p></td>
-        </tr>
-        <tr>
-                <td class="name"><code>query</code></td>
-            <td class="type">
-<span class="param-type">string</span>
-            </td>
-            <td class="description last"><p>a querySelector within this ViewStream.</p></td>
-        </tr>
-    </tbody>
-</table>
-<dl class="details">
-    <dt class="tag-source">Source:</dt>
-    <dd class="tag-source"><ul class="dummy"><li>
-        <a href="view-stream.js.html">view-stream.js</a>, <a href="view-stream.js.html#line543">line 543</a>
-    </li></ul></dd>
-</dl>
-    <h5>Example</h5>
-    <pre class="prettyprint"><code>//  returns
-&lt;body>
-   &lt;main>
-       &lt;h2>Hello World&lt;/h2>
-   &lt;/main>
-&lt;/body>
-let parentView = new ViewStream('main');
-parentView.appendToDom(document.body);
-let childView = new ViewStream({tagName:'h2', data:'Hello World'};
-parentView.prependView(childView);</code></pre>
-    <h4 class="name" id="prependViewToParent"><span class="type-signature"></span>prependViewToParent<span class="signature">(v, query, level)</span><span class="type-signature"></span></h4>
-<div class="description">
-    <p>This method prepends a child ViewStream object to a parent ViewStream object.</p>
-</div>
-    <h5>Parameters:</h5>
-<table class="params">
-    <thead>
-    <tr>
-        <th>Name</th>
-        <th>Type</th>
-        <th>Default</th>
-        <th class="last">Description</th>
-    </tr>
-    </thead>
-    <tbody>
-        <tr>
-                <td class="name"><code>v</code></td>
-            <td class="type">
-<span class="param-type"><a href="ViewStream.html">ViewStream</a></span>
-            </td>
-                <td class="default">
-                </td>
-            <td class="description last"><p>the ViewStream parent.</p></td>
-        </tr>
-        <tr>
-                <td class="name"><code>query</code></td>
-            <td class="type">
-<span class="param-type">string</span>
-            </td>
-                <td class="default">
-                </td>
-            <td class="description last"><p>a querySelector within this ViewStream.</p></td>
-        </tr>
-        <tr>
-                <td class="name"><code>level</code></td>
-            <td class="type">
-<span class="param-type">number</span>
-            </td>
-                <td class="default">
-                    1
-                </td>
-            <td class="description last"><p>this parameter can attach the viewStream's dom element up the dom tree while still maintaining the parent-child relationship of the ViewStream objects.</p></td>
-        </tr>
-    </tbody>
-</table>
-<dl class="details">
-    <dt class="tag-source">Source:</dt>
-    <dd class="tag-source"><ul class="dummy"><li>
-        <a href="view-stream.js.html">view-stream.js</a>, <a href="view-stream.js.html#line516">line 516</a>
-    </li></ul></dd>
-</dl>
-    <h5>Example</h5>
-    <pre class="prettyprint"><code>let parentView = new ViewStream('main');
-parentView.prependToDom(document.body);
-let childView = new ViewStream({tagName:'h2', data:'Hello World'};
-childView.prependViewToParent(parentView)</code></pre>
-    <h4 class="name" id="sendChannelPayload"><span class="type-signature"></span>sendChannelPayload<span class="signature">(channelName, action, payload)</span><span class="type-signature"></span></h4>
-<div class="description">
-    <p>Method to send data to any registered channel.
-*</p>
-</div>
-    <h5>Parameters:</h5>
-<table class="params">
-    <thead>
-    <tr>
-        <th>Name</th>
-        <th>Type</th>
-        <th>Default</th>
-        <th class="last">Description</th>
-    </tr>
-    </thead>
-    <tbody>
-        <tr>
-                <td class="name"><code>channelName</code></td>
-            <td class="type">
-<span class="param-type">string</span>
-            </td>
-                <td class="default">
-                </td>
-            <td class="description last"><p>The name of the registered Channel that was added to the Channels Controller.</p></td>
-        </tr>
-        <tr>
-                <td class="name"><code>action</code></td>
-            <td class="type">
-<span class="param-type">string</span>
-            </td>
-                <td class="default">
-                    DEFAULT_EVENT
-                </td>
-            <td class="description last"><p>The event type that listeners can point to.</p></td>
-        </tr>
-        <tr>
-                <td class="name"><code>payload</code></td>
-            <td class="type">
-<span class="param-type">object</span>
-            </td>
-                <td class="default">
-                </td>
-            <td class="description last"><p>{}, The main data to send to the channel.</p></td>
-        </tr>
-    </tbody>
-</table>
-<dl class="details">
-    <dt class="tag-source">Source:</dt>
-    <dd class="tag-source"><ul class="dummy"><li>
-        <a href="view-stream.js.html">view-stream.js</a>, <a href="view-stream.js.html#line680">line 680</a>
-    </li></ul></dd>
-</dl>
-    <h5>Example</h5>
-    <pre class="prettyprint"><code>let payload = {'location' : 'about'};
-let action = 'PAGE_CHANGE_EVENT';
-this.sendChannelPayload('ROUTE', paylaod, action);</code></pre>
-</article>
-</section>
-</div>
-<nav>
-    <h2><a href="index.html">Home</a></h2><h3>Classes</h3><ul><li><a href="DomItem.html">DomItem</a></li><li><a href="ViewStream.html">ViewStream</a></li></ul>
-</nav>
-<br class="clear">
-<footer>
-    Documentation generated by <a href="https://github.com/jsdoc3/jsdoc">JSDoc 3.5.5</a> on Fri Dec 15 2017 22:34:55 GMT-0500 (EST)
-</footer>
-<script> prettyPrint(); </script>
-<script src="scripts/linenumber.js"> </script>
-</body>
-</html>