Skip to content

Commit 81fca18

Browse files
preliminary instance function implementation;
using plain fontoxpath again from node_modules
1 parent 4fcc6a0 commit 81fca18

13 files changed

+239
-40
lines changed

demo/hello-fonto.html

+16-5
Original file line numberDiff line numberDiff line change
@@ -16,12 +16,20 @@
1616
.dynamic{
1717
background: #76ff03;
1818
}
19+
xf-input[required]:after{
20+
content: "*";
21+
display: inline;
22+
color:red;
23+
}
24+
1925
</style>
2026
</head>
2127
<body unresolved="unresolved">
2228

2329

2430
<xf-form>
31+
<xf-message event="refresh-done">refresh has been done </xf-message>
32+
2533
<xf-model id="model1">
2634
<xf-instance>
2735
<data>
@@ -30,25 +38,28 @@
3038
<class>dynamic</class>
3139
</data>
3240
</xf-instance>
33-
<xf-bind id="b-greeting" ref="greeting" required="1 = 1"></xf-bind>
41+
<xf-bind id="b-greeting" ref="greeting" required="1 = 1">
42+
<!--
43+
<xf-bind constraint="string-length(.) > 2">
44+
<xf-alert>huh? too short!</xf-alert>
45+
</xf-bind>
46+
-->
47+
</xf-bind>
3448
<xf-bind ref="prop"></xf-bind>
3549

3650
<xf-instance id="second">
3751
<data>
3852
<outro>GoodBye</outro>
3953
</data>
4054
</xf-instance>
41-
<xf-bind instance="second" ref="outro"></xf-bind>
55+
<!-- <xf-bind instance="second" ref="outro"></xf-bind>-->
4256

4357
<xf-message event="model-construct-done">Hey model-construct is done</xf-message>
4458
<xf-message event="ready">Hey it's ready</xf-message>
4559
</xf-model>
4660
<xf-group>
4761

4862

49-
<!-- <xf-model id="model2"></xf-model>-->
50-
51-
5263
<!--
5364
<xf-message event="value-changed">value has changed</xf-message>
5465
<xf-message event="refresh-done">refresh has been done </xf-message>

demo/instances.html

+90
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,90 @@
1+
<!doctype html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="utf-8"/>
5+
<meta content="width=device-width, minimum-scale=1, initial-scale=1, user-scalable=yes" name="viewport"/>
6+
7+
<title>Hello World</title>
8+
9+
<script src="../../assets/@webcomponents/webcomponentsjs/webcomponents-loader.js"></script>
10+
<script type="module">
11+
import '../src/xf-form.js';
12+
</script>
13+
14+
<link rel="stylesheet" href="../resources/vars.css">
15+
<style>
16+
.dynamic{
17+
background: #76ff03;
18+
}
19+
xf-input[required]:after{
20+
content: "*";
21+
display: inline;
22+
color:red;
23+
}
24+
25+
</style>
26+
</head>
27+
<body unresolved="unresolved">
28+
29+
30+
<xf-form xmlns:xf="test" xmlns:xf="test">
31+
<xf-message event="refresh-done">refresh has been done </xf-message>
32+
33+
<xf-model id="model1">
34+
<xf-instance>
35+
<data>
36+
<greeting>Hello World!</greeting>
37+
</data>
38+
</xf-instance>
39+
40+
<xf-bind id="b-greeting" ref="greeting" required="1 = 1"></xf-bind>
41+
42+
<xf-instance id="second">
43+
<data>
44+
<outro>GoodBye</outro>
45+
<foo></foo>
46+
</data>
47+
</xf-instance>
48+
49+
<!--
50+
<xf-bind instance="second" ref="instance('outro')">
51+
<xf-bind ref="outro"></xf-bind>
52+
</xf-bind>
53+
-->
54+
55+
<xf-message event="model-construct-done">Hey model-construct is done</xf-message>
56+
<xf-message event="ready">Hey it's ready</xf-message>
57+
</xf-model>
58+
<xf-group>
59+
60+
61+
<!--
62+
<xf-message event="value-changed">value has changed</xf-message>
63+
<xf-message event="refresh-done">refresh has been done </xf-message>
64+
-->
65+
66+
<h1 class="{class}">
67+
Greeting: <xf-output ref="./greeting" id="output"></xf-output>
68+
<!-- Greeting: <xf-output ref="instance()/greeting" id="output"></xf-output>-->
69+
</h1>
70+
71+
<xf-input ref="greeting" label="Greeting"></xf-input>
72+
73+
<!--
74+
<h1>
75+
<xf-output bind="b-greeting" id="output"></xf-output>
76+
</h1>
77+
-->
78+
79+
<!--
80+
<xf-button label="say 'hello World'">
81+
<xf-setvalue bind="b-greeting" value="Hello World!"></xf-setvalue>
82+
</xf-button>
83+
<xf-button label="submit">
84+
<xf-submit></xf-submit>
85+
</xf-button>
86+
-->
87+
</xf-group>
88+
</xf-form>
89+
</body>
90+
</html>

doc/index.html

+1-1
Original file line numberDiff line numberDiff line change
@@ -88,7 +88,7 @@
8888
<app-drawer class="drawer" slot="drawer">
8989
<div class="header">
9090
<span class="title">Fore</span>
91-
<span class="subtitle">Forms for eXist-db</span>
91+
<span class="subtitle">Forms for the Web</span>
9292
</div>
9393
<div class="topics">
9494
<a href="introduction.html" target="topic">Introduction</a>

doc/introduction.html

+1-2
Original file line numberDiff line numberDiff line change
@@ -40,12 +40,11 @@ <h1>Introduction</h1>
4040
<li>MVC architecture</li>
4141
<li>declarative HTML syntax</li>
4242
<li>binding facility to seemlessly work with XML data in HTML</li>
43-
<li>server-side calculation and validation</li>
4443
<li>UI fully implemented in Web Components</li>
4544
</ul>
4645

4746
<p>
48-
Fore is loosely related to <a href="https://www.w3.org/community/xformsusers/wiki/XForms_2.0" target="_blank">XForms 2.0</a>
47+
Fore is related to <a href="https://www.w3.org/community/xformsusers/wiki/XForms_2.0" target="_blank">XForms 2.0</a>
4948
taking the major ideas of it but not trying to be a complete implementation. Instead the development will be
5049
driven by user request, adding features as they become relevant.
5150
</p>

fontoxpath.rollup.config-old.js

+16
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,16 @@
1+
import commonjs from 'plugin-commonjs'
2+
3+
export default {
4+
input: './node_modules/fontoxpath/dist/fontoxpath.js',
5+
output: {
6+
file: './assets/fontoxpath.esm.js',
7+
format: 'es',
8+
},
9+
plugins: [
10+
commonjs({
11+
namedExports: {
12+
'fontoxpath': ['fontoxpath']
13+
}
14+
})
15+
],
16+
}

fontoxpath.rollup.config.js

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import commonjs from 'plugin-commonjs'
1+
import commonjs from '@rollup/plugin-commonjs'
22

33
export default {
44
input: './node_modules/fontoxpath/dist/fontoxpath.js',

package-lock.json

+14-20
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

package.json

+1-1
Original file line numberDiff line numberDiff line change
@@ -20,7 +20,7 @@
2020
"@open-wc/testing": "^2.0.0",
2121
"@open-wc/testing-karma": "^3.0.0",
2222
"@open-wc/testing-karma-bs": "^1.0.0",
23-
"@rollup/plugin-commonjs": "^11.0.2",
23+
"@rollup/plugin-commonjs": "^11.1.0",
2424
"@rollup/plugin-node-resolve": "^6.1.0",
2525
"deepmerge": "^3.2.0",
2626
"es-dev-server": "^1.40.0",

src/xf-bind.js

+47-5
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,18 @@
11
import {LitElement, html, css} from 'lit-element';
22

3+
4+
/*
5+
import {
6+
evaluateXPath,
7+
evaluateXPathToFirstNode,
8+
registerCustomXPathFunction } from 'fontoxpath';
9+
*/
10+
311
import fx from '../output/fontoxpath.js';
4-
import evaluateXPathToBoolean from '../output/fontoxpath.js';
5-
import evaluateXPathToString from '../output/fontoxpath.js';
612
import evaluateXPathToFirstNode from '../output/fontoxpath.js';
713
import evaluateXPath from '../output/fontoxpath.js';
14+
import registerCustomXPathFunction from '../output/fontoxpath.js';
15+
816

917
export class XfBind extends LitElement {
1018

@@ -67,6 +75,7 @@ export class XfBind extends LitElement {
6775
this.nodeset = [];
6876
this.model = {};
6977
this.contextNode = {};
78+
this.inited = false;
7079
}
7180

7281
render() {
@@ -77,17 +86,38 @@ export class XfBind extends LitElement {
7786

7887
firstUpdated(_changedProperties) {
7988
super.firstUpdated(_changedProperties);
89+
90+
8091
}
8192

93+
namespaceResolver(prefix) {
94+
console.log('namespaceResolver prefix', prefix);
95+
var ns = {
96+
'xhtml' : 'http://www.w3.org/1999/xhtml',
97+
};
98+
return ns[prefix] || null;
99+
// return null;
100+
}
101+
102+
82103
init(model){
83104
this.model = model;
84105

106+
//if no ref use
107+
// a. the nodeset of your parent bind
108+
// b. if no parent use default context
109+
110+
111+
112+
113+
114+
85115
console.log('init binding ', this);
86116
if(this.parentNode.nodeName === 'XF-MODEL'){
87117
/*
88118
* if we have an outermost bind having model as parent the default instance data are used as context.
89119
*/
90-
this.nodeset = fx.evaluateXPath(this.ref, model.getDefaultInstanceData(), null, {});
120+
this.nodeset = fx.evaluateXPath(this.ref, model.getDefaultContext(), null, {namespaceResolver: this.namespaceResolver});
91121
}else{
92122
// console.log('parent nodeset ', this.parentNode.nodeset);
93123

@@ -98,7 +128,7 @@ export class XfBind extends LitElement {
98128
if(this.ref !== './text()'
99129
&& this.ref !== 'text()'
100130
){
101-
const local = fx.evaluateXPathToFirstNode(this.ref, n, null, {});
131+
const local = fx.evaluateXPathToFirstNode(this.ref, n, null, {namespaceResolver: this.namespaceResolver});
102132
// console.log('>>>>>>>>>>< local: ', local);
103133

104134
// console.log('local type ', local.nodeType);
@@ -109,11 +139,23 @@ export class XfBind extends LitElement {
109139
});
110140

111141
}else{
112-
this.nodeset = fx.evaluateXPathToFirstNode(this.ref, this.parentNode.nodeset, null, {});
142+
this.nodeset = fx.evaluateXPathToFirstNode(this.ref, this.parentNode.nodeset, null, {namespaceResolver: this.namespaceResolver});
113143
}
114144

115145
}
116146

147+
// console.log('model namespace ', this.model.isDefaultNamespace(""));
148+
// console.log('model namespace ', this.model.lookupNamespaceURI(""));
149+
// console.log('nodeset ', this.nodeset);
150+
151+
let result = fx.evaluateXPath('Q{xf}instance("second")',this.nodeset,null,{});
152+
// console.log('????? result ',result);
153+
154+
// result = fx.evaluateXPath('Q{xf}instance("second")//outro',this.nodeset,null,null,null, {namespaceResolver: this.namespaceResolver});
155+
result = fx.evaluateXPath('Q{xf}instance("second")/outro',this.nodeset,null,null,null, {});
156+
console.log('????? result ',result);
157+
158+
117159
// console.log('xf-bind init nodeset ', this.nodeset);
118160

119161
this._createModelItems();

0 commit comments

Comments
 (0)