@jinntec/fore 1.10.0 → 1.10.2

package/src/ui/fx-repeat.js

@@ -207,13 +207,17 @@ export class FxRepeat extends foreElementMixin(HTMLElement) {
       });
     }
 
+/*
 	  this.touchedPaths = new Set();
 	  const instance = XPathUtil.resolveInstance(this, this.ref);
 	  const depTrackDomfacade = new DependencyNotifyingDomFacade((node) => {
 		  this.touchedPaths.add(XPathUtil.getPath(node, instance));
 	  });
       const rawNodeset = evaluateXPath(this.ref, inscope, this, {}, {}, depTrackDomfacade );
-	  console.log('Touched!', this.ref, [...this.touchedPaths].join(', '));
+*/
+    const rawNodeset = evaluateXPath(this.ref, inscope, this);
+
+    // console.log('Touched!', this.ref, [...this.touchedPaths].join(', '));
     if (rawNodeset.length === 1 && Array.isArray(rawNodeset[0])) {
       // This XPath likely returned an XPath array. Just collapse to that array
       this.nodeset = rawNodeset[0];
@@ -229,6 +233,13 @@ export class FxRepeat extends foreElementMixin(HTMLElement) {
     // console.time('repeat-refresh', this);
     this._evalNodeset();
 
+    // ### register ourselves as boundControl
+/*
+    const modelItem = this.getModelItem();
+    if (!modelItem.boundControls.includes(this)) {
+      modelItem.boundControls.push(this);
+    }
+*/
     // console.log('repeat refresh nodeset ', this.nodeset);
     // console.log('repeatCount', this.repeatCount);
 

package/src/ui/fx-repeatitem.js

@@ -91,15 +91,9 @@ export class FxRepeatitem extends foreElementMixin(HTMLElement) {
     }
 
     if (this.modelItem && !this.modelItem.relevant) {
-      // await Fore.fadeOutElement(this)
-      // this.style.display = 'none';
-		this.style.display = 'none';
+        this.setAttribute('nonrelevant','');
     } else {
-      // if(this.hasAttribute('repeat-index')){
-      //   Fore.fadeInElement(this);
-      // }
-      // this.style.display = this.display;
-		this.style.display = 'block';
+		this.setAttribute('relevant','');
     }
 
     /*

package/src/ui/fx-switch.js

@@ -18,7 +18,10 @@ class FxSwitch extends FxContainer {
   constructor() {
     super();
     this.formerCase = {};
+    this.selectedCase = null;
+    this.cases = null;
   }
+
   connectedCallback() {
     if (super.connectedCallback) {
       super.connectedCallback();
@@ -37,63 +40,83 @@ class FxSwitch extends FxContainer {
         </style>
         ${html}
     `;
+    this.cases = [];
+    this.formerCase=null;
   }
 
   async refresh(force) {
     super.refresh();
     // console.log('refresh on switch ');
-    const cases = this.querySelectorAll(':scope > fx-case');
-    let selectedCase = cases[0]; // first is always default
+    if(this.cases.length === 0){
+      this.cases = Array.from(this.querySelectorAll(':scope > fx-case'));
+    }
+
     if (this.isBound()) {
-      Array.from(cases).forEach(caseElem => {
-        const name = caseElem.getAttribute('name');
-        if (name === this.modelItem?.value) {
-          Fore.dispatch(caseElem,'select',{});
-          caseElem.classList.add('selected-case');
-          selectedCase = caseElem;
-        } else {
-          if(caseElem.classList.contains('selected-case')){
-            Fore.dispatch(caseElem,'deselect',{});
-          }
-          caseElem.classList.remove('selected-case');
-        }
-      });
-    } else {
-      selectedCase = this.querySelector(':scope > .selected-case');
-      // if none is selected select the first as default
-      if (!selectedCase) {
-        selectedCase = cases[0]; // if nothing is selected use the first case
-        Fore.dispatch(selectedCase,'select',{});
-        selectedCase.classList.add('selected-case');
-      }
+      this._handleBoundSwitch();
     }
-    if(this.formerCase !== selectedCase){
-      const visited = selectedCase.querySelectorAll('.visited');
-      Array.from(visited).forEach(v =>{
-        v.classList.remove('visited');
-      });
+    if(!this.selectedCase){
+      this.selectedCase = this.cases[0]; // first is always default
+      this.toggle(this.selectedCase);
     }
 
-    Fore.refreshChildren(selectedCase,force);
-    this.formerCase = selectedCase;
+    Fore.refreshChildren(this.selectedCase,force);
   }
 
+  _dispatchEvents(){
+    if(this.formerCase && this.formerCase !== this.selectedCase){
+      Fore.dispatch(this.formerCase,'deselect',{});
+    }
+    if(this.selectedCase.classList.contains('selected-case')){
+      Fore.dispatch(this.selectedCase,'select',{});
+    }
+  }
+
+  _resetVisited(){
+    const visited = this.selectedCase.querySelectorAll('.visited');
+    Array.from(visited).forEach(v =>{
+      v.classList.remove('visited');
+    });
+  }
+
+  /**
+   * handles switches being bound. If modelItem value matches the 'name' attribute that case will be toggled.
+   * @private
+   */
+  _handleBoundSwitch() {
+    Array.from(this.cases).forEach(caseElem => {
+      const name = caseElem.getAttribute('name');
+      if (name === this.modelItem?.value) {
+        this.toggle(caseElem);
+      }
+    });
+  }
+
+  /**
+   * Activates a fx-case element by switching CSS classes.
+   * Dispatches 'select' and 'deselect' events as appropriate.
+   *
+   * @param caseElement the fx-case element to activate
+   */
   toggle(caseElement) {
-    const cases = this.querySelectorAll('fx-case');
-    Array.from(cases).forEach(c => {
-      if (caseElement === c) {
-        // eslint-disable-next-line no-param-reassign
+    this.formerCase = this.selectedCase;
+    this.selectedCase = caseElement;
+    Array.from(this.cases).forEach(c => {
+      if (c === this.selectedCase) {
+        c.classList.remove('deselected-case');
         c.classList.add('selected-case');
-        Fore.dispatch(c,'select',{});
-        this.refresh();
+        c.inert = false;
       } else {
-        // eslint-disable-next-line no-param-reassign
-        if(c.classList.contains('selected-case')){
-          Fore.dispatch(c,'deselect',{});
-        }
         c.classList.remove('selected-case');
+        c.classList.add('deselected-case');
+        c.inert = true;
+        this._resetVisited();
       }
     });
+
+    if(this.selectedCase !== caseElement){
+      this.selectedCase = caseElement;
+    }
+    this._dispatchEvents();
   }
 }
 

package/src/ui/fx-trigger.js

@@ -116,19 +116,9 @@ export class FxTrigger extends XfAbstractControl {
     }
   }
 
-  /*
-        async refresh() {
-          super.refresh();
-          // console.log('fx-button refresh');
-
-          const elements = this.querySelectorAll(':scope > *');
-          elements.forEach(element => {
-            if (typeof element.refresh === 'function') {
-              element.refresh();
-            }
-          });
-        }
-      */
+  async refresh() {
+    super.refresh();
+  }
 }
 
 if (!customElements.get('fx-trigger')) {

package/src/xpath-evaluation.js

@@ -418,6 +418,7 @@ function getVariablesInScope(formElement) {
  * @param  {Node} contextNode The start of the XPath
  * @param  {{parentNode}|ForeElementMixin} formElement  The form element associated to the XPath
  */
+/*
 export function evaluateXPath(xpath, contextNode, formElement, variables = {}, options={}, domFacade = null) {
     const namespaceResolver = createNamespaceResolverForNode(xpath, contextNode, formElement);
     const variablesInScope = getVariablesInScope(formElement);
@@ -440,7 +441,59 @@ export function evaluateXPath(xpath, contextNode, formElement, variables = {}, o
         },
     );
 }
+*/
+export function evaluateXPath(xpath, contextNode, formElement, variables = {}, options={}) {
+    try{
+        console.log('evaluateXPath',xpath);
+        const namespaceResolver = createNamespaceResolverForNode(xpath, contextNode, formElement);
+        const variablesInScope = getVariablesInScope(formElement);
+
+        return fxEvaluateXPath(
+            xpath,
+            contextNode,
+            null,
+            {...variablesInScope, ...variables},
+            fxEvaluateXPath.ALL_RESULTS_TYPE,
+            {
+                debug: true,
+                currentContext: {formElement, variables},
+                moduleImports: {
+                    xf: XFORMS_NAMESPACE_URI,
+                },
+                functionNameResolver,
+                namespaceResolver,
+                language: options.language || evaluateXPath.XPATH_3_1
+            },
+        );
+    }catch (e){
+        formElement.dispatchEvent(new CustomEvent('error', {
+            composed: false,
+            bubbles: true,
+            detail: {
+                origin: formElement,
+                message: `Expression '${xpath}' failed`,
+                expr:xpath,
+                level:'Error'
+            },
+        }));
 
+/*
+        formElement.dispatchEvent(
+            new CustomEvent('error', {
+                composed: false,
+                bubbles: true,
+                cancelable:true,
+                detail: {
+                    origin: formElement,
+                    message: `Expression '${xpath}' failed`,
+                    expr:xpath,
+                    level:'Error'},
+            }),
+        );
+*/
+        return false;
+    }
+}
 /**
  * Evaluate an XPath to the first Node
  *
@@ -450,17 +503,30 @@ export function evaluateXPath(xpath, contextNode, formElement, variables = {}, o
  * @return {Node}  The first node found by the XPath
  */
 export function evaluateXPathToFirstNode(xpath, contextNode, formElement) {
-    const namespaceResolver = createNamespaceResolverForNode(xpath, contextNode, formElement);
-    const variablesInScope = getVariablesInScope(formElement);
-    return fxEvaluateXPathToFirstNode(xpath, contextNode, null, variablesInScope, {
-        defaultFunctionNamespaceURI: XFORMS_NAMESPACE_URI,
-        moduleImports: {
-            xf: XFORMS_NAMESPACE_URI,
-        },
-        currentContext: {formElement},
-        functionNameResolver,
-        namespaceResolver,
-    });
+    try{
+        const namespaceResolver = createNamespaceResolverForNode(xpath, contextNode, formElement);
+        const variablesInScope = getVariablesInScope(formElement);
+        return fxEvaluateXPathToFirstNode(xpath, contextNode, null, variablesInScope, {
+            defaultFunctionNamespaceURI: XFORMS_NAMESPACE_URI,
+            moduleImports: {
+                xf: XFORMS_NAMESPACE_URI,
+            },
+            currentContext: {formElement},
+            functionNameResolver,
+            namespaceResolver,
+        });
+    } catch (e){
+        formElement.dispatchEvent(new CustomEvent('error', {
+            composed: false,
+            bubbles: true,
+            detail: {
+                origin: formElement,
+                message: `Expression '${xpath}' failed`,
+                expr:xpath,
+                level:'Error'
+            },
+        }));
+    }
 }
 
 /**
@@ -472,17 +538,30 @@ export function evaluateXPathToFirstNode(xpath, contextNode, formElement) {
  * @return {Node[]}  All nodes
  */
 export function evaluateXPathToNodes(xpath, contextNode, formElement) {
-    const namespaceResolver = createNamespaceResolverForNode(xpath, contextNode, formElement);
-    const variablesInScope = getVariablesInScope(formElement);
+    try{
+        const namespaceResolver = createNamespaceResolverForNode(xpath, contextNode, formElement);
+        const variablesInScope = getVariablesInScope(formElement);
 
-    return fxEvaluateXPathToNodes(xpath, contextNode, null, variablesInScope, {
-        currentContext: {formElement},
-        functionNameResolver,
-        moduleImports: {
-            xf: XFORMS_NAMESPACE_URI,
-        },
-        namespaceResolver,
-    });
+        return fxEvaluateXPathToNodes(xpath, contextNode, null, variablesInScope, {
+            currentContext: {formElement},
+            functionNameResolver,
+            moduleImports: {
+                xf: XFORMS_NAMESPACE_URI,
+            },
+            namespaceResolver,
+        });
+    }catch (e){
+        formElement.dispatchEvent(new CustomEvent('error', {
+            composed: false,
+            bubbles: true,
+            detail: {
+                origin: formElement,
+                message: `Expression '${xpath}' failed`,
+                expr:xpath,
+                level:'Error'
+            },
+        }));
+    }
 }
 
 /**
@@ -494,17 +573,30 @@ export function evaluateXPathToNodes(xpath, contextNode, formElement) {
  * @return {boolean}
  */
 export function evaluateXPathToBoolean(xpath, contextNode, formElement) {
-    const namespaceResolver = createNamespaceResolverForNode(xpath, contextNode, formElement);
-    const variablesInScope = getVariablesInScope(formElement);
+    try{
+        const namespaceResolver = createNamespaceResolverForNode(xpath, contextNode, formElement);
+        const variablesInScope = getVariablesInScope(formElement);
 
-    return fxEvaluateXPathToBoolean(xpath, contextNode, null, variablesInScope, {
-        currentContext: {formElement},
-        functionNameResolver,
-        moduleImports: {
-            xf: XFORMS_NAMESPACE_URI,
-        },
-        namespaceResolver,
-    });
+        return fxEvaluateXPathToBoolean(xpath, contextNode, null, variablesInScope, {
+            currentContext: {formElement},
+            functionNameResolver,
+            moduleImports: {
+                xf: XFORMS_NAMESPACE_URI,
+            },
+            namespaceResolver,
+        });
+    }catch (e){
+        formElement.dispatchEvent(new CustomEvent('error', {
+            composed: false,
+            bubbles: true,
+            detail: {
+                origin: formElement,
+                message: `Expression '${xpath}' failed`,
+                expr:xpath,
+                level:'Error'
+            },
+        }));
+    }
 }
 
 /**
@@ -525,17 +617,30 @@ export function evaluateXPathToString(
     domFacade = null,
     namespaceReferenceNode = formElement,
 ) {
-    const namespaceResolver = createNamespaceResolverForNode(xpath, contextNode, formElement);
-    const variablesInScope = getVariablesInScope(formElement);
+    try{
+        const namespaceResolver = createNamespaceResolverForNode(xpath, contextNode, formElement);
+        const variablesInScope = getVariablesInScope(formElement);
 
-    return fxEvaluateXPathToString(xpath, contextNode, domFacade, variablesInScope, {
-        currentContext: {formElement},
-        functionNameResolver,
-        moduleImports: {
-            xf: XFORMS_NAMESPACE_URI,
-        },
-        namespaceResolver,
-    });
+        return fxEvaluateXPathToString(xpath, contextNode, domFacade, variablesInScope, {
+            currentContext: {formElement},
+            functionNameResolver,
+            moduleImports: {
+                xf: XFORMS_NAMESPACE_URI,
+            },
+            namespaceResolver,
+        });
+    }catch (e) {
+        formElement.dispatchEvent(new CustomEvent('error', {
+            composed: false,
+            bubbles: true,
+            detail: {
+                origin: formElement,
+                message: `Expression '${xpath}' failed`,
+                expr:xpath,
+                level:'Error'
+            },
+        }));
+    }
 }
 
 /**
@@ -556,22 +661,31 @@ export function evaluateXPathToStrings(
     domFacade = null,
     namespaceReferenceNode = formElement,
 ) {
-    const namespaceResolver = createNamespaceResolverForNode(xpath, contextNode, formElement);
-    return fxEvaluateXPathToStrings(
-        xpath,
-        contextNode,
-        domFacade,
-        {},
-
-        {
-            currentContext: {formElement},
-            functionNameResolver,
-            moduleImports: {
-                xf: XFORMS_NAMESPACE_URI,
+    try{
+        const namespaceResolver = createNamespaceResolverForNode(xpath, contextNode, formElement);
+        return fxEvaluateXPathToStrings( xpath, contextNode, domFacade,
+            {},
+            {
+                currentContext: {formElement},
+                functionNameResolver,
+                moduleImports: {
+                    xf: XFORMS_NAMESPACE_URI,
+                },
+                namespaceResolver,
             },
-            namespaceResolver,
-        },
-    );
+        );
+    } catch (e){
+        formElement.dispatchEvent(new CustomEvent('error', {
+            composed: false,
+            bubbles: true,
+            detail: {
+                origin: formElement,
+                message: `Expression '${xpath}' failed`,
+                expr:xpath,
+                level:'Error'
+            },
+        }));
+    }
 }
 
 /**
@@ -592,17 +706,30 @@ export function evaluateXPathToNumber(
     domFacade = null,
     namespaceReferenceNode = formElement,
 ) {
-    const namespaceResolver = createNamespaceResolverForNode(xpath, contextNode, formElement);
-    const variablesInScope = getVariablesInScope(formElement);
+    try{
+        const namespaceResolver = createNamespaceResolverForNode(xpath, contextNode, formElement);
+        const variablesInScope = getVariablesInScope(formElement);
 
-    return fxEvaluateXPathToNumber(xpath, contextNode, domFacade, variablesInScope, {
-        currentContext: {formElement},
-        functionNameResolver,
-        moduleImports: {
-            xf: XFORMS_NAMESPACE_URI,
-        },
-        namespaceResolver,
-    });
+        return fxEvaluateXPathToNumber(xpath, contextNode, domFacade, variablesInScope, {
+            currentContext: {formElement},
+            functionNameResolver,
+            moduleImports: {
+                xf: XFORMS_NAMESPACE_URI,
+            },
+            namespaceResolver,
+        });
+    }catch (e) {
+        formElement.dispatchEvent(new CustomEvent('error', {
+            composed: false,
+            bubbles: true,
+            detail: {
+                origin: formElement,
+                message: `Expression '${xpath}' failed`,
+                expr:xpath,
+                level:'Error'
+            },
+        }));
+    }
 }
 
 const contextFunction = (dynamicContext, string) => {
@@ -844,25 +971,30 @@ const instance = (dynamicContext, string) => {
         {namespaceResolver: xhtmlNamespaceResolver},
     );
 
-    const inst = string
-          ? formElement.getModel().getInstance(string)
-          : formElement.getModel().getDefaultInstance();
-
-/*
-    const inst = string
-        ? resolveId(string, formElement, 'fx-instance')
-        : formElement.querySelector(`fx-instance`);
-*/
+    let lookup = null;
+    if(string === null || string === 'default'){
+        lookup = formElement.getModel().getDefaultInstance();
+    }else{
+        lookup = formElement.getModel().getInstance(string);
+        if(!lookup){
+            document.querySelector('fx-fore').dispatchEvent(new CustomEvent('error', {
+                composed: true,
+                bubbles: true,
+                detail: {
+                    origin: 'functions',
+                    message: `Instance not found '${localName}'`,
+                    level:'Error'
+                },
+            }));
+        }
+    }
 
-    if (inst) {
-        const context = inst.getDefaultContext();
-		if (!context) {
-			debugger;
-			return null;
-		}
-		return context;
+    const context = lookup.getDefaultContext();
+    if (!context) {
+        debugger;
+        return null;
     }
-    return null;
+    return context;
 };
 
 registerCustomXPathFunction(