@jinntec/fore 1.0.0-1 → 1.0.0-2

package/src/ForeElementMixin.js

@@ -23,12 +23,6 @@ export const foreElementMixin = superclass =>
         model: {
           type: Object,
         },
-        /**
-         * XPath binding expression pointing to bound node
-         */
-        ref: {
-          type: String,
-        },
         /**
          * The modelitem object associated to the bound node holding the evaluated state.
          */
@@ -41,6 +35,12 @@ export const foreElementMixin = superclass =>
         nodeset: {
           type: Object,
         },
+        /**
+         * XPath binding expression pointing to bound node
+         */
+        ref: {
+          type: String,
+        },
       };
     }
 
@@ -98,26 +98,26 @@ export const foreElementMixin = superclass =>
       if (this.ref === '') {
         this.nodeset = inscopeContext;
       } else if (Array.isArray(inscopeContext)) {
+        /*
         inscopeContext.forEach(n => {
           if (XPathUtil.isSelfReference(this.ref)) {
             this.nodeset = inscopeContext;
           } else {
-            const localResult = evaluateXPathToFirstNode(this.ref, n, null);
+            const localResult = evaluateXPathToFirstNode(this.ref, n, this);
             // console.log('local result: ', localResult);
             this.nodeset.push(localResult);
           }
         });
+*/
+        this.nodeset = evaluateXPathToFirstNode(this.ref, inscopeContext[0], this);
       } else {
         // this.nodeset = fx.evaluateXPathToFirstNode(this.ref, inscopeContext, null, {namespaceResolver: this.namespaceResolver});
-
-        // todo: code below fails - why?
-        const formElement = this.getOwnerForm();
-        if (inscopeContext.nodeType) {
-          this.nodeset = evaluateXPathToFirstNode(this.ref, inscopeContext, formElement);
+        const { nodeType } = inscopeContext;
+        if (nodeType) {
+          this.nodeset = evaluateXPathToFirstNode(this.ref, inscopeContext, this);
         } else {
-          this.nodeset = evaluateXPath(this.ref, inscopeContext, formElement);
+          this.nodeset = evaluateXPath(this.ref, inscopeContext, this);
         }
-        // this.nodeset = evaluateXPath(this.ref,inscopeContext,formElement)
       }
       // console.log('UiElement evaluated to nodeset: ', this.nodeset);
     }
@@ -226,7 +226,7 @@ export const foreElementMixin = superclass =>
         bubbles: true,
         detail,
       });
-      console.log('firing', event);
+      // console.log('firing', event);
       this.dispatchEvent(event);
     }
   };

package/src/actions/abstract-action.js

@@ -81,7 +81,9 @@ export class AbstractAction extends foreElementMixin(HTMLElement) {
 
     this.target = this.getAttribute('target');
     if (this.target) {
-      if (this.target === '#document') {
+      if (this.target === '#window') {
+        window.addEventListener(this.event, e => this.execute(e));
+      } else if (this.target === '#document') {
         document.addEventListener(this.event, e => this.execute(e));
       } else {
         this.targetElement = document.getElementById(this.target);
@@ -190,15 +192,14 @@ export class AbstractAction extends foreElementMixin(HTMLElement) {
       const model = this.getModel();
       model.recalculate();
       model.revalidate();
-      model.parentNode.refresh();
-      this._dispatchActionPerformed();
+      model.parentNode.refresh(true);
+      this.dispatchActionPerformed();
     }
   }
 
   /**
-   * @private
    */
-  _dispatchActionPerformed() {
+  dispatchActionPerformed() {
     console.log('action-performed ', this);
     this.dispatchEvent(
       new CustomEvent('action-performed', { composed: true, bubbles: true, detail: {} }),

package/src/actions/fx-action.js

@@ -46,6 +46,7 @@ export class FxAction extends AbstractAction {
         // action.perform();
         action.execute();
       });
+      this.dispatchActionPerformed();
       // this.needsUpdate = false;
     }
   }

package/src/actions/fx-dispatch.js

@@ -1,5 +1,6 @@
 import { AbstractAction } from './abstract-action.js';
-import { evaluateXPath } from '../xpath-evaluation.js';
+import { evaluateXPath, resolveId } from '../xpath-evaluation.js';
+import { XPathUtil } from '../xpath-util.js';
 
 /**
  * `fx-dispatch`
@@ -89,7 +90,14 @@ export class FxDispatch extends AbstractAction {
 
     // ### when targetid is given dispatch to that if present (throw an error if not) - otherwise dispatch to document
     if (this.targetid) {
-      const target = document.getElementById(this.targetid);
+      // const target = document.getElementById(this.targetid);
+      let target;
+      if (XPathUtil.isRepeated(this)) {
+        target = resolveId(this.targetid, this.parentNode, null);
+      } else {
+        target = document.getElementById(this.targetid);
+      }
+      console.log('target', target);
       if (!target) {
         throw new Error(`targetid ${this.targetid} does not exist in document`);
       }

package/src/actions/fx-insert.js

@@ -77,7 +77,7 @@ export class FxInsert extends AbstractAction {
   }
 
   perform() {
-    super.perform();
+    // super.perform();
 
     /*
          todo: !!! calling super here does not correctly give the nodeset - it's likely still a bug in ForeElementMixin !!!
@@ -90,7 +90,7 @@ export class FxInsert extends AbstractAction {
 
     // @ts-ignore
     const targetSequence = evaluateXPathToNodes(this.ref, inscope, this.getOwnerForm());
-    console.log('insert nodeset ', targetSequence);
+    // console.log('insert nodeset ', targetSequence);
 
     // ### obtaining originSequence
     /*
@@ -117,8 +117,8 @@ export class FxInsert extends AbstractAction {
     let insertLocationNode;
     let index;
 
-    const idx = this._getInsertIndex(inscope, targetSequence);
-    console.log('insert index', idx);
+    // const idx = this._getInsertIndex(inscope, targetSequence);
+    // console.log('insert index', idx);
 
     // if the targetSequence is empty but we got an originSequence use inscope as context and ignore 'at' and 'position'
     if (targetSequence.length === 0) {
@@ -151,7 +151,7 @@ export class FxInsert extends AbstractAction {
 
         insertLocationNode = targetSequence;
         const context = evaluateXPath('count(preceding::*)', targetSequence, this.getOwnerForm());
-        console.log('context', context);
+        // console.log('context', context);
         index = context + 1;
         // index = targetSequence.findIndex(insertLocationNode);
       }
@@ -171,10 +171,10 @@ export class FxInsert extends AbstractAction {
 
     // console.log('insert context item ', insertLocationNode);
     // console.log('parent ', insertLocationNode.parentNode);
-    console.log('instance ', this.getModel().getDefaultContext());
+    // console.log('instance ', this.getModel().getDefaultContext());
 
-    console.log('<<<<<<< at', this.at);
-    console.log('<<<<<<< index', index);
+    // console.log('<<<<<<< at', this.at);
+    // console.log('<<<<<<< index', index);
     // todo: this actually should dispatch to respective instance
     document.dispatchEvent(
       new CustomEvent('insert', {

package/src/actions/fx-send.js

@@ -17,7 +17,7 @@ class FxSend extends AbstractAction {
   connectedCallback() {
     // eslint-disable-next-line wc/guard-super-call
     super.connectedCallback();
-    console.log('connectedCallback ', this);
+    // console.log('connectedCallback ', this);
     this.submission = this.getAttribute('submission');
   }
 

package/src/actions/fx-setvalue.js

@@ -62,10 +62,8 @@ export default class FxSetvalue extends AbstractAction {
 
     if (item.value !== newVal) {
       item.value = newVal;
-      item.changed = true;
-
+      this.getModel().changed.push(modelItem);
       this.needsUpdate = true;
-
       console.log('setvalue[2] ', item, newVal);
     }
   }

package/src/dep_graph.js

@@ -320,6 +320,15 @@ DepGraph.prototype = {
     }
     throw new Error(`Node does not exist: ${node}`);
   },
+
+  /**
+   * Get an array of nodes that have no dependants (i.e. nothing depends on them).
+   */
+  entryNodes() {
+    const self = this;
+    return Object.keys(this.nodes).filter(node => self.incomingEdges[node].length === 0);
+  },
+
   /**
    * Construct the overall processing order for the dependency graph.
    *

package/src/drawdown.js

@@ -0,0 +1,172 @@
+/**
+ * drawdown.js
+ * (c) Adam Leggett
+ */
+
+function markdown(src) {
+  var rx_lt = /</g;
+  var rx_gt = />/g;
+  var rx_space = /\t|\r|\uf8ff/g;
+  var rx_escape = /\\([\\\|`*_{}\[\]()#+\-~])/g;
+  var rx_hr = /^([*\-=_] *){3,}$/gm;
+  var rx_blockquote = /\n *&gt; *([^]*?)(?=(\n|$){2})/g;
+  var rx_list = /\n( *)(?:[*\-+]|((\d+)|([a-z])|[A-Z])[.)]) +([^]*?)(?=(\n|$){2})/g;
+  var rx_listjoin = /<\/(ol|ul)>\n\n<\1>/g;
+  var rx_highlight = /(^|[^A-Za-z\d\\])(([*_])|(~)|(\^)|(--)|(\+\+)|`)(\2?)([^<]*?)\2\8(?!\2)(?=\W|_|$)/g;
+  var rx_code = /\n((```|~~~).*\n?([^]*?)\n?\2|((    .*?\n)+))/g;
+  var rx_link = /((!?)\[(.*?)\]\((.*?)( ".*")?\)|\\([\\`*_{}\[\]()#+\-.!~]))/g;
+  var rx_table = /\n(( *\|.*?\| *\n)+)/g;
+  var rx_thead = /^.*\n( *\|( *\:?-+\:?-+\:? *\|)* *\n|)/;
+  var rx_row = /.*\n/g;
+  var rx_cell = /\||(.*?[^\\])\|/g;
+  var rx_heading = /(?=^|>|\n)([>\s]*?)(#{1,6}) (.*?)( #*)? *(?=\n|$)/g;
+  var rx_para = /(?=^|>|\n)\s*\n+([^<]+?)\n+\s*(?=\n|<|$)/g;
+  var rx_stash = /-\d+\uf8ff/g;
+
+  function replace(rex, fn) {
+    src = src.replace(rex, fn);
+  }
+
+  function element(tag, content) {
+    return '<' + tag + '>' + content + '</' + tag + '>';
+  }
+
+  function blockquote(src) {
+    return src.replace(rx_blockquote, function(all, content) {
+      return element('blockquote', blockquote(highlight(content.replace(/^ *&gt; */gm, ''))));
+    });
+  }
+
+  function list(src) {
+    return src.replace(rx_list, function(all, ind, ol, num, low, content) {
+      var entry = element(
+        'li',
+        highlight(
+          content
+            .split(RegExp('\n ?' + ind + '(?:(?:\\d+|[a-zA-Z])[.)]|[*\\-+]) +', 'g'))
+            .map(list)
+            .join('</li><li>'),
+        ),
+      );
+
+      return (
+        '\n' +
+        (ol
+          ? '<ol start="' +
+            (num
+              ? ol + '">'
+              : parseInt(ol, 36) -
+                9 +
+                '" style="list-style-type:' +
+                (low ? 'low' : 'upp') +
+                'er-alpha">') +
+            entry +
+            '</ol>'
+          : element('ul', entry))
+      );
+    });
+  }
+
+  function highlight(src) {
+    return src.replace(rx_highlight, function(all, _, p1, emp, sub, sup, small, big, p2, content) {
+      return (
+        _ +
+        element(
+          emp
+            ? p2
+              ? 'strong'
+              : 'em'
+            : sub
+            ? p2
+              ? 's'
+              : 'sub'
+            : sup
+            ? 'sup'
+            : small
+            ? 'small'
+            : big
+            ? 'big'
+            : 'code',
+          highlight(content),
+        )
+      );
+    });
+  }
+
+  function unesc(str) {
+    return str.replace(rx_escape, '$1');
+  }
+
+  var stash = [];
+  var si = 0;
+
+  src = '\n' + src + '\n';
+
+  replace(rx_lt, '&lt;');
+  replace(rx_gt, '&gt;');
+  replace(rx_space, '  ');
+
+  // blockquote
+  src = blockquote(src);
+
+  // horizontal rule
+  replace(rx_hr, '<hr/>');
+
+  // list
+  src = list(src);
+  replace(rx_listjoin, '');
+
+  // code
+  replace(rx_code, function(all, p1, p2, p3, p4) {
+    stash[--si] = element('pre', element('code', p3 || p4.replace(/^    /gm, '')));
+    return si + '\uf8ff';
+  });
+
+  // link or image
+  replace(rx_link, function(all, p1, p2, p3, p4, p5, p6) {
+    stash[--si] = p4
+      ? p2
+        ? '<img src="' + p4 + '" alt="' + p3 + '"/>'
+        : '<a href="' + p4 + '">' + unesc(highlight(p3)) + '</a>'
+      : p6;
+    return si + '\uf8ff';
+  });
+
+  // table
+  replace(rx_table, function(all, table) {
+    var sep = table.match(rx_thead)[1];
+    return (
+      '\n' +
+      element(
+        'table',
+        table.replace(rx_row, function(row, ri) {
+          return row == sep
+            ? ''
+            : element(
+                'tr',
+                row.replace(rx_cell, function(all, cell, ci) {
+                  return ci ? element(sep && !ri ? 'th' : 'td', unesc(highlight(cell || ''))) : '';
+                }),
+              );
+        }),
+      )
+    );
+  });
+
+  // heading
+  replace(rx_heading, function(all, _, p1, p2) {
+    return _ + element('h' + p1.length, unesc(highlight(p2)));
+  });
+
+  // paragraph
+  replace(rx_para, function(all, content) {
+    return element('p', unesc(highlight(content)));
+  });
+
+  // stash
+  replace(rx_stash, function(all) {
+    return stash[parseInt(all)];
+  });
+
+  return src.trim();
+}

package/src/fore.js

@@ -34,6 +34,21 @@ export class Fore {
     ];
   }
 
+  static createUUID() {
+    // http://www.ietf.org/rfc/rfc4122.txt
+    const s = [];
+    const hexDigits = '0123456789abcdef';
+    for (let i = 0; i < 36; i += 1) {
+      s[i] = hexDigits.substr(Math.floor(Math.random() * 0x10), 1);
+    }
+    s[14] = '4'; // bits 12-15 of the time_hi_and_version field to 0010
+    s[19] = hexDigits.substr((s[19] & 0x3) | 0x8, 1); // bits 6-7 of the clock_seq_hi_and_reserved to 01
+    s[8] = s[13] = s[18] = s[23] = '-';
+
+    const uuid = s.join('');
+    return uuid;
+  }
+
   static get XFORMS_NAMESPACE_URI() {
     // todo: should be centralized somewhere as constant. Exists in several? places
     return 'http://www.w3.org/2002/xforms';
@@ -55,7 +70,7 @@ export class Fore {
       'FX-GROUP',
       'FX-HINT',
       'FX-INPUT',
-      'FX-ITEMSET',
+      'FX-ITEMS',
       'FX-LABEL',
       'FX-OUTPUT',
       'FX-RANGE',
@@ -79,15 +94,40 @@ export class Fore {
     return Fore.UI_ELEMENTS.includes(elementName);
   }
 
-  static async refreshChildren(startElement) {
+  /**
+   * recursively refreshes all UI Elements.
+   *
+   * todo: this could probably made more efficient with significant impact on rendering perf
+   *
+   * @param startElement
+   * @param force
+   * @returns {Promise<unknown>}
+   */
+  static async refreshChildren(startElement, force) {
     const refreshed = new Promise(resolve => {
+      /*
+      if there's an 'refresh-on-view' attribute the element wants to be handled by
+      handleIntersect function that calls the refresh of the respective element and
+      not the global one.
+       */
+      // if(!force && startElement.hasAttribute('refresh-on-view')) return;
+
+      /*  ### attempt with querySelectorAll is even slower than iterating recursively
+
+      const children = startElement.querySelectorAll('[ref]');
+      Array.from(children).forEach(uiElement => {
+        if (Fore.isUiElement(uiElement.nodeName) && typeof uiElement.refresh === 'function') {
+          uiElement.refresh();
+        }
+      });
+*/
       const { children } = startElement;
       if (children) {
         Array.from(children).forEach(element => {
           if (Fore.isUiElement(element.nodeName) && typeof element.refresh === 'function') {
             element.refresh();
           } else if (element.nodeName.toUpperCase() !== 'FX-MODEL') {
-            Fore.refreshChildren(element);
+            Fore.refreshChildren(element, force);
           }
         });
       }
@@ -167,6 +207,16 @@ export class Fore {
     return fadeOut();
   }
 
+  static dispatch(target, eventName, detail) {
+    const event = new CustomEvent(eventName, {
+      composed: true,
+      bubbles: true,
+      detail,
+    });
+    console.log('firing', event);
+    target.dispatchEvent(event);
+  }
+
   /**
    * clear all text nodes and attribute values to get a 'clean' template.
    * @param n

package/src/fx-bind.js

@@ -182,12 +182,11 @@ export class FxBind extends foreElementMixin(HTMLElement) {
     if (this.bindType === 'xml') {
       this.nodeset.forEach(node => {
         const path = XPathUtil.getPath(node);
+        this.model.mainGraph.addNode(path, node);
 
         if (this.calculate) {
           this.model.mainGraph.addNode(`${path}:calculate`, node);
           // Calculated values are a dependency of the model item.
-          // Make `model1` depend on `model1:calculate`
-          this.model.mainGraph.addNode(path, node);
           this.model.mainGraph.addDependency(path, `${path}:calculate`);
         }
 
@@ -196,11 +195,13 @@ export class FxBind extends foreElementMixin(HTMLElement) {
           this._addDependencies(calculateRefs, node, path, 'calculate');
         }
 
-        const readonlyRefs = this._getReferencesForProperty(this.readonly, node);
-        if (readonlyRefs.length !== 0) {
-          this._addDependencies(readonlyRefs, node, path, 'readonly');
-        } else if (this.readonly) {
-          this.model.mainGraph.addNode(`${path}:readonly`, node);
+        if (!this.calculate) {
+          const readonlyRefs = this._getReferencesForProperty(this.readonly, node);
+          if (readonlyRefs.length !== 0) {
+            this._addDependencies(readonlyRefs, node, path, 'readonly');
+          } else if (this.readonly) {
+            this.model.mainGraph.addNode(`${path}:readonly`, node);
+          }
         }
 
         // const requiredRefs = this.requiredReferences;