jsf.js_next_gen 4.0.0-RC.1 → 4.0.0-RC.10

package/src/main/typescript/impl/xhrCore/ResponseProcessor.ts

@@ -14,7 +14,7 @@
  * limitations under the License.
  */
 
-import {Config, DomQuery, DQ, Lang, Stream, XMLQuery} from "mona-dish";
+import {Config, DomQueryCollector, DQ, DQ$, Lang, LazyStream, Stream, XMLQuery} from "mona-dish";
 import {Implementation} from "../AjaxImpl";
 import {Assertions} from "../util/Assertions";
 import {IResponseProcessor} from "./IResponseProcessor";
@@ -40,7 +40,6 @@ import {
     P_PARTIAL_SOURCE,
     P_VIEWSTATE,
     RESPONSE_XML, SEL_CLIENT_WINDOW_ELEM,
-    SEL_SCRIPTS_STYLES,
     SEL_VIEWSTATE_ELEM,
     SOURCE,
     SUCCESS,
@@ -52,7 +51,7 @@ import {
     TAG_HEAD,
     UPDATE_ELEMS,
     UPDATE_FORMS,
-    DEFERRED_HEAD_INSERTS
+    DEFERRED_HEAD_INSERTS, PARTIAL_ID, P_EXECUTE, P_RENDER, HTML_CLIENT_WINDOW
 } from "../core/Const";
 import trim = Lang.trim;
 import {ExtConfig, ExtDomQuery} from "../util/ExtDomQuery";
@@ -86,27 +85,31 @@ export class ResponseProcessor implements IResponseProcessor {
         if (!shadowHead.isPresent()) {
             return;
         }
+        let head = ExtDomQuery.querySelectorAll(TAG_HEAD);
+        // full replace we delete everything
+        head.childNodes.delete();
+        this.addToHead(shadowHead);
+    }
 
-        let oldHead = ExtDomQuery.querySelectorAll(TAG_HEAD);
-
-        //delete all to avoid script and style overlays
-        oldHead.querySelectorAll(SEL_SCRIPTS_STYLES).delete();
+    addToHead(shadowHead: XMLQuery | DQ) {
+        const mappedHeadData = new ExtDomQuery(shadowHead);
+        const postProcessTags = ["STYLE", "LINK", "SCRIPT"];
+        const nonExecutables = mappedHeadData.filter(item => postProcessTags.indexOf(item.tagName.orElse("").value) == -1);
+        nonExecutables.runHeadInserts(true);
 
-        // we cannot replace new elements in the head, but we can eval the elements
-        // eval means the scripts will get attached (eval script attach method)
-        // but this is done by DomQuery not in this code
-        this.storeForEval(shadowHead);
         //incoming either the outer head tag or its children
-        //shadowHead = (shadowHead.tagName.value === "HEAD") ? shadowHead.childNodes : shadowHead;
-        //this.addToHead(shadowHead);
+        const nodesToAdd = (shadowHead.tagName.value === "HEAD") ? shadowHead.childNodes : shadowHead;
+        // this is stored for post processing
+        // after the rest of the "pyhsical build up", head before body
+        const evalElements = nodesToAdd.stream
+            .filter(item => postProcessTags.indexOf(item.tagName.orElse("").value) != -1).collect(new DomQueryCollector());
+        this.addToHeadDeferred(evalElements);
     }
 
-    addToHead(newElements: XMLQuery | DQ) {
+    addToHeadDeferred(newElements: XMLQuery | DQ) {
         this.internalContext.assign(DEFERRED_HEAD_INSERTS).value.push(newElements);
     }
 
-
-
     /**
      * replaces the body in the expected manner
      * which means the entire body content is refreshed
@@ -335,14 +338,18 @@ export class ResponseProcessor implements IResponseProcessor {
         Stream.ofAssoc<StateHolder>(this.internalContext.getIf(APPLIED_VST).orElse({}).value)
             .each((item: Array<any>) => {
                 let value: StateHolder = item[1];
-                let nameSpace = DQ.byId(value.nameSpace, true).orElse(document.body);
-                let affectedForms = nameSpace.byTagName(TAG_FORM);
-                let affectedForms2 = nameSpace.filter(item => item.tagName.orElse(EMPTY_STR).value.toLowerCase() == TAG_FORM);
+                let namingContainerId = this.internalContext.getIf(PARTIAL_ID);
+                let affectedForms;
 
-                this.appendViewStateToForms(new DomQuery(affectedForms, affectedForms2), value.value);
+                affectedForms = this.getContainerForms(namingContainerId)
+                    .filter(affectedForm => this.executeOrRenderFilter(affectedForm));
+
+                this.appendViewStateToForms(affectedForms, value.value);
             });
     }
 
+
+
     /**
      * same as with view states before applies the incoming client windows as last step after the rest of the processing
      * is done.
@@ -350,12 +357,14 @@ export class ResponseProcessor implements IResponseProcessor {
     fixClientWindow() {
         Stream.ofAssoc<StateHolder>(this.internalContext.getIf(APPLIED_CLIENT_WINDOW).orElse({}).value)
             .each((item: Array<any>) => {
-                let value: StateHolder = item[1];
-                let nameSpace = DQ.byId(value.nameSpace, true).orElse(document.body);
-                let affectedForms = nameSpace.byTagName(TAG_FORM);
-                let affectedForms2 = nameSpace.filter(item => item.tagName.orElse(EMPTY_STR).value.toLowerCase() == TAG_FORM);
+                const value: StateHolder = item[1];
+                const namingContainerId = this.internalContext.getIf(PARTIAL_ID);
+                let affectedForms;
 
-                this.appendClientWindowToForms(new DomQuery(affectedForms, affectedForms2), value.value);
+                affectedForms = this.getContainerForms(namingContainerId)
+                    .filter(affectedForm => this.executeOrRenderFilter(affectedForm));
+
+                this.appendClientWindowToForms(affectedForms, value.value);
             });
     }
 
@@ -403,7 +412,11 @@ export class ResponseProcessor implements IResponseProcessor {
     private assignState(forms: DQ, selector: string, state: string) {
         forms.each((form: DQ) => {
             let stateHolders = form.querySelectorAll(selector)
-                .orElseLazy(() => ResponseProcessor.newViewStateElement(form));
+                .orElseLazy(() => {
+                    return selector.indexOf("ViewState") != -1 ?
+                        ResponseProcessor.newViewStateElement(form):
+                        ResponseProcessor.newClientWindowElement(form);
+                });
 
             stateHolders.attr("value").value = state;
         });
@@ -416,9 +429,21 @@ export class ResponseProcessor implements IResponseProcessor {
      * (usually a form node)
      */
     private static newViewStateElement(parent: DQ): DQ {
-        let newViewState = DQ.fromMarkup($nsp(HTML_VIEWSTATE));
-        newViewState.appendTo(parent);
-        return newViewState;
+        let newElement = DQ.fromMarkup($nsp(HTML_VIEWSTATE));
+        newElement.appendTo(parent);
+        return newElement;
+    }
+
+    /**
+     * Helper to Create a new JSF ViewState Element
+     *
+     * @param parent, the parent node to attach the viewState element to
+     * (usually a form node)
+     */
+    private static newClientWindowElement(parent: DQ): DQ {
+        let newElement = DQ.fromMarkup($nsp(HTML_CLIENT_WINDOW));
+        newElement.appendTo(parent);
+        return newElement;
     }
 
     /**
@@ -480,5 +505,42 @@ export class ResponseProcessor implements IResponseProcessor {
         this.externalContext.getIf(ON_ERROR).orElse(this.internalContext.getIf(ON_ERROR).value).orElse(EMPTY_FUNC).value(errorData);
     }
 
+    /**
+     * filters the forms according to being in the execute or render cycle
+     * @param affectedForm
+     * @private
+     */
+    private executeOrRenderFilter(affectedForm) {
+        let executes = this.externalContext.getIf($nsp(P_EXECUTE)).orElse("@none").value.split(/\s+/gi);
+        let renders = this.externalContext.getIf($nsp(P_RENDER)).orElse("@none").value.split(/\s+/gi);
+        let executeAndRenders = executes.concat(...renders);
+        return LazyStream.of(...executeAndRenders).filter(nameOrId => {
+            if (nameOrId == "@all") {
+                return true;
+            }
+            if (nameOrId == "@none") {
+                return true;
+            }
+
+            const nameOrIdSelector = `[id='${nameOrId}'], [name='#${nameOrId}']`;
+            //either the form directly is in execute or render or one of its children or one of its parents
+            return affectedForm.matchesSelector(nameOrIdSelector) ||
+                affectedForm.querySelectorAll(nameOrIdSelector).isPresent() ||
+                affectedForm.parents(nameOrIdSelector).isPresent();
+        }).first().isPresent();
+    }
 
+    /**
+     * gets all forms under a single naming container id
+     * @param namingContainerId
+     * @private
+     */
+    private getContainerForms(namingContainerId: Config) {
+        if (namingContainerId.isPresent()) {
+            //naming container mode, all forms under naming container id must be processed
+            return DQ.byId(namingContainerId.value).orElse(DQ$(`form[name='${namingContainerId.value}']`)).byTagName(TAG_FORM, true);
+        } else {
+            return DQ.byTagName(TAG_FORM);
+        }
+    }
 }

package/src/main/typescript/impl/xhrCore/XhrFormData.ts

@@ -16,7 +16,7 @@
 import {ArrayCollector, Config, DQ, Lang, LazyStream, Stream} from "mona-dish";
 import {EMPTY_STR, IDENT_ALL, IDENT_FORM, P_VIEWSTATE} from "../core/Const";
 import isString = Lang.isString;
-import {ExtConfig} from "../util/ExtDomQuery";
+import {ExtConfig, ExtDomQuery} from "../util/ExtDomQuery";
 
 
 /**
@@ -54,15 +54,20 @@ export class XhrFormData extends Config {
         //a call to getViewState before must pass the encoded line
         //a call from getViewState passes the form element as datasource,
         //so we have two call points
+        // atm we basically encode twice, to keep the code leaner
+        // this will be later optmized, practically elements
+        // which are already covered by an external viewstate do not need
+        // the encoding a second time, because they are overwritten by the viewstate again
         if (isString(dataSource)) {
             this.assignEncodedString(<string>this.dataSource);
         } else {
             this.applyFormDataToConfig();
         }
-        if('undefined' != typeof viewState) {
+        //now assign the external viewstate overrides
+        if ('undefined' != typeof viewState) {
             this.assignEncodedString(viewState)
         }
-        if(executes) {
+        if (executes) {
             this.postInit(...executes);
         }
     }
@@ -73,14 +78,17 @@ export class XhrFormData extends Config {
      * in our ajax request
      */
     postInit(...executes: Array<string>) {
-        let fetchInput = (id: string): DQ => {
+        let fetchFileInputs = (id: string): DQ => {
+            const INPUT_FILE = "input[type='file']";
             if (id == IDENT_ALL) {
-                return DQ.querySelectorAllDeep("input[type='file']");
+                return DQ.querySelectorAllDeep(INPUT_FILE);
             } else if (id == IDENT_FORM) {
-                return (<DQ>this.dataSource).querySelectorAllDeep("input[type='file']");
+                return (<DQ>this.dataSource).matchesSelector(INPUT_FILE) ?
+                    (<DQ>this.dataSource) :
+                    (<DQ>this.dataSource).querySelectorAllDeep(INPUT_FILE);
             } else {
                 let element = DQ.byId(id, true);
-                return this.getFileInputs(element);
+                return element.matchesSelector(INPUT_FILE) ? element : this.getFileInputs(element);
             }
         };
 
@@ -90,7 +98,7 @@ export class XhrFormData extends Config {
 
 
         this.isMultipartRequest = LazyStream.of(...executes)
-            .map(fetchInput)
+            .map(fetchFileInputs)
             .filter(inputExists)
             .first().isPresent();
     }
@@ -113,8 +121,8 @@ export class XhrFormData extends Config {
     assignEncodedString(encoded: string) {
         // this code filters out empty strings as key value pairs
         let keyValueEntries = decodeURIComponent(encoded).split(/&/gi)
-                .filter(item => !!(item || '')
-                .replace(/\s+/g,''));
+            .filter(item => !!(item || '')
+                .replace(/\s+/g, ''));
         this.assignString(keyValueEntries);
     }
 
@@ -133,8 +141,8 @@ export class XhrFormData extends Config {
             return keyVal.length < 3 ? [keyVal?.[0] ?? [], keyVal?.[1] ?? []] : keyVal;
         }
 
+        //TODO fix files...
         Stream.of(...keyValueEntries)
-            //split only the first =
             .map(line => splitToKeyVal(line))
             //special case of having keys without values
             .map(keyVal => fixKeyWithoutVal(keyVal))
@@ -171,7 +179,11 @@ export class XhrFormData extends Config {
         }
         let entries = LazyStream.of(...Object.keys(this.value))
             .filter(key => this.value.hasOwnProperty(key))
-            .flatMap(key => Stream.of(...this.value[key]).map(val => [key, val]).collect(new ArrayCollector()))
+            .flatMap(key => Stream.of(...this.value[key]).map(val => [key, val])
+                //we cannot encode file elements that is handled by multipart requests anyway
+                .filter(([, value]) => !(value instanceof ExtDomQuery.global().File))
+                .collect(new ArrayCollector()))
+
             .map(keyVal => {
                 return `${encodeURIComponent(keyVal[0])}=${encodeURIComponent(keyVal[1])}`;
             })

package/src/main/typescript/myfaces/OamSubmit.ts

@@ -62,18 +62,22 @@ export module oam {
         DQ.byId(element).delete();
     };
 
-    // noinspection JSUnusedGlobalSymbols
+    // noinspection JSUnusedGlobalSymbols,JSUnusedLocalSymbols
     /**
      * does special form submit remapping
      * re-maps the issuing command link into something,
-     * a decode of the command link on the server can understand
+     * the "decode" of the command link on the server can understand
      *
      * @param formName
      * @param linkId
      * @param target
      * @param params
      */
-    export const submitForm = function (formName: string, linkId: string, target: string, params: { [key: string]: any }): boolean {
+    export const submitForm = function (formName: string, linkId: string | null = null, target: string |null = null, params: AssocArr<any> | Tuples<string, any> | null = {} ): boolean {
+
+        //handle a possible incoming null, not sure if this is used that way anywhere, but we allow it
+        params = (!params) ? {} : params;
+
         let clearFn = 'clearFormHiddenParams_' + formName.replace(/-/g, '\$:').replace(/:/g, '_');
         window?.[clearFn]?.(formName);
 
@@ -81,14 +85,14 @@ export module oam {
         if (window?.myfaces?.core?.config?.autoScroll && (window as any)?.getScrolling) {
             myfaces.oam.setHiddenInput(formName, 'autoScroll', (window as any)?.getScrolling());
         }
-        Stream.ofAssoc(params).each((param: [string, any]) => {
-            myfaces.oam.setHiddenInput(formName, param[0], param[1]);
-        });
+        let paramsStream: Stream<[string, any]> = Array.isArray(params) ? Stream.of(...params) : Stream.ofAssoc(params);
+        paramsStream.each(([key, data]) => myfaces.oam.setHiddenInput(formName, key, data));
 
         //we call the namespaced function, to allow decoration, via a direct call we would
-        myfaces.oam.setHiddenInput(formName, `${formName}:_idcl`, linkId);
+        myfaces.oam.setHiddenInput(formName, `${formName}:_idcl`, linkId ?? '');
+
 
-        DQ.byId(document.forms[formName]).each(form => {
+        DQ.byId(document.forms?.[formName] ?? document.getElementById(formName)).each(form => {
             const ATTR_TARGET = "target";
             const formElement = form.getAsElem(0).value as HTMLFormElement;
             const oldTarget = form.attr(ATTR_TARGET).value;
@@ -104,8 +108,9 @@ export module oam {
                 window?.console.error(e);
             } finally {
                 form.attr(ATTR_TARGET).value = oldTarget;
-                Stream.ofAssoc(params).each((param: [string, any]) => {
-                    myfaces.oam.clearHiddenInput(formName, param[0]);
+                // noinspection JSUnusedLocalSymbols
+                paramsStream.each(([key, data]) => {
+                    myfaces.oam.clearHiddenInput(formName, key);
                 });
                 myfaces.oam.clearHiddenInput(formName, `${formName}:_idcl`);
             }

package/src/main/typescript/test/frameworkBase/_ext/shared/XmlResponses.ts

@@ -194,7 +194,7 @@ export class XmlResponses {
 <partial-response id="j_id__v_0"><changes><update id="jakarta.faces.Resource">
     <![CDATA[
         <script src="../../../xhrCore/fixtures/addedViewHead3.js"></script>
-        <style type="text/css" rel="../../../xhrCore/fixtures/addedViewHead2.css"></style>
+        <link rel="stylesheet" href="../../../xhrCore/fixtures/addedViewHead2.css"></link>
         <script type="text/javascript">
             document.getElementById('resource_area_1').innerHTML = 'booga';
         </script>
@@ -204,6 +204,45 @@ export class XmlResponses {
 </partial-response>
 `
 
+    static HEAD_REPLACE = `
+<partial-response id="j_id__v_0"><changes><update id="jakarta.faces.ViewHead">
+    <![CDATA[
+    <head>
+        <script type="text/javascript" src="../../../xhrCore/fixtures/addedViewHead3.js"></script>
+        <link rel="stylesheet" href="../../../xhrCore/fixtures/addedViewHead2.css"></link>
+        <script type="text/javascript">
+            setTimeout(() => document.getElementById('resource_area_1').innerHTML = 'booga', 100);
+        </script>
+    </head>    
+    ]]>
+</update>
+</changes>
+</partial-response>
+`
+
+    static HEAD_REPLACE2 = `
+<partial-response id="j_id__v_0"><changes><update id="jakarta.faces.ViewHead">
+    <![CDATA[
+    <head>
+        <title>After Update</title>
+        <meta charset="UTF-8">
+        <meta name="description" content="Free Web tutorials">
+        <meta name="keywords" content="HTML, CSS, JavaScript, JSF">
+        <meta name="viewport" content="width=device-width, initial-scale=0.8">
+        <meta name="author" content="Whoever">
+        <script type="text/javascript" src="../../../xhrCore/fixtures/addedViewHead3.js"></script>
+        <link rel="stylesheet" href="../../../xhrCore/fixtures/addedViewHead2.css"></link>
+        <script type="text/javascript">
+            setTimeout(() => document.getElementById('resource_area_1').innerHTML = 'booga', 100);
+        </script>
+    </head>    
+    ]]>
+</update>
+</changes>
+</partial-response>
+`
+
+
     static NONCE_REPLY = `
     <partial-response><changes><update id='nonce_result'>
     <![CDATA[<script nonce='test12d3' type='text/javascript' src='http://foobaz/nonce_script.js'></script>]]>

package/src/main/typescript/test/xhrCore/OamSubmitTest.spec.ts

@@ -0,0 +1,177 @@
+/*! Licensed to the Apache Software Foundation (ASF) under one or more
+ * contributor license agreements.  See the NOTICE file distributed with
+ * this work for additional information regarding copyright ownership.
+ * The ASF licenses this file to you under the Apache License, Version 2.0
+ * (the "License"); you may not use this file except in compliance with
+ * the License.  You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import {describe} from "mocha";
+import * as sinon from "sinon";
+import {Implementation} from "../../impl/AjaxImpl";
+import {StandardInits} from "../frameworkBase/_ext/shared/StandardInits";
+import defaultMyFaces = StandardInits.defaultMyFaces;
+import {DQ, DQ$} from "mona-dish";
+import {expect} from "chai";
+
+describe('Tests for the MyFaces specifig oam submit', function () {
+
+    beforeEach(async function () {
+
+        let waitForResult = defaultMyFaces();
+
+        return waitForResult.then((close) => {
+
+            this.xhr = sinon.useFakeXMLHttpRequest();
+            this.requests = [];
+            this.xhr.onCreate = (xhr) => {
+                this.requests.push(xhr);
+            };
+            (<any>global).XMLHttpRequest = this.xhr;
+            window.XMLHttpRequest = this.xhr;
+
+            this.jsfAjaxResponse = sinon.spy((<any>global).faces.ajax, "response");
+
+            this.closeIt = () => {
+                (<any>global).XMLHttpRequest = window.XMLHttpRequest = this.xhr.restore();
+                this.jsfAjaxResponse.restore();
+                Implementation.reset();
+                close();
+            }
+        });
+    });
+
+    afterEach(function () {
+        this.closeIt();
+    });
+
+    it(("must handle oam submit correctly, tuples"), (done) => {
+
+        let options = [["booga1", "value1"], ["booga2", "value2"]];
+
+        (DQ.byId("blarg")
+            .getAsElem(0).value as HTMLFormElement).onsubmit = (evt) => {
+            expect(DQ$("#blarg #booga1").inputValue.value).to.eq("value1");
+            expect(DQ$("#blarg #booga2").inputValue.value).to.eq("value2");
+            done();
+            return false;
+        };
+
+        myfaces.oam.submitForm("blarg", null, null, options);
+
+    });
+    it(("must handle oam submit correctly, associative array"), (done) => {
+
+        let options = {"booga1": "value1", "booga2": "value2"};
+
+        (DQ.byId("blarg")
+            .getAsElem(0).value as HTMLFormElement).onsubmit = (evt) => {
+            expect(DQ$("#blarg #booga1").inputValue.value).to.eq("value1");
+            expect(DQ$("#blarg #booga2").inputValue.value).to.eq("value2");
+            done();
+            return false;
+        };
+
+        myfaces.oam.submitForm("blarg", null, null, options);
+
+    });
+
+    it(("all hidden inputs must be cleared post submit"), (done) => {
+
+        let options = {"booga1": "value1", "booga2": "value2"};
+
+        (DQ.byId("blarg")
+            .getAsElem(0).value as HTMLFormElement).onsubmit = (evt) => {
+            expect(DQ$("#blarg #booga1").length).to.eq(1);
+            expect(DQ$("#blarg #booga2").length).to.eq(1);
+            return false;
+        };
+
+        myfaces.oam.submitForm("blarg", null, null, options);
+
+        expect(DQ$("#blarg #booga1").length).to.eq(0);
+        expect(DQ$("#blarg #booga2").length).to.eq(0);
+        done();
+    });
+
+    it(("must handle linkid correctly, associative array"), (done) => {
+
+        let options = {"booga1": "value1", "booga2": "value2"};
+
+        (DQ.byId("blarg")
+            .getAsElem(0).value as HTMLFormElement).onsubmit = (evt) => {
+            expect(DQ.byId(`blarg:_idcl`).inputValue.value).to.eq("bla");
+            done();
+            return false;
+        };
+
+        myfaces.oam.submitForm("blarg", "bla", null, options);
+
+    });
+
+    it(("must handle target correctly, associative array"), (done) => {
+
+        let options = {"booga1": "value1", "booga2": "value2"};
+        (DQ.byId("blarg")
+            .getAsElem(0).value as HTMLFormElement).onsubmit = (evt) => {
+            expect(DQ$(`#blarg`).attr("target").value).to.eq("target1");
+            done();
+            return false;
+        };
+        myfaces.oam.submitForm("blarg", "bla", "target1", options);
+
+    });
+
+    it(("must handle limited parameters"), (done) => {
+
+        (DQ.byId("blarg")
+            .getAsElem(0).value as HTMLFormElement).onsubmit = (evt) => {
+            expect(DQ.byId(`blarg:_idcl`).inputValue.value).to.eq("bla");
+            done();
+            return false;
+        };
+        try {
+        myfaces.oam.submitForm("blarg", "bla");
+        } catch(e) {
+            done(e);
+        }
+
+    });
+    it(("must handle limited parameters 2"), (done) => {
+
+        (DQ.byId("blarg")
+            .getAsElem(0).value as HTMLFormElement).onsubmit = (evt) => {
+            expect(DQ.byId(`blarg:_idcl`).inputValue.value).to.eq("bla");
+            done();
+            return false;
+        };
+        try {
+            myfaces.oam.submitForm("blarg", "bla", null);
+        } catch(e) {
+            done(e);
+        }
+    });
+    it(("must handle limited parameters 3"), (done) => {
+
+        (DQ.byId("blarg")
+            .getAsElem(0).value as HTMLFormElement).onsubmit = (evt) => {
+            expect(DQ.byId(`blarg:_idcl`).inputValue.value).to.eq("bla");
+            done();
+            return false;
+        };
+        try {
+            myfaces.oam.submitForm("blarg", "bla", null, null);
+        } catch(e) {
+            done(e);
+        }
+    });
+
+});