syndicate-lang
/
syndicate-js
1
0
Fork 0
Code Issues 1 Pull Requests Projects Releases Wiki Activity

Experimental ValueWidget

This commit is contained in:
Tony Garnock-Jones 2023-12-03 12:29:17 +01:00
parent 24a75e935a
commit 9197d7ef3a
1 changed files with 47 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

48
packages/html2/src/index.ts
View File

@ -17,6 +17,8 @@ type Wrapped = {
options?: AddEventListenerOptions | boolean,
};
export type NodeGenerator = (t: HtmlFragmentsTemplate) => HtmlFragment;
export class Widget implements EventTarget {
facet: Facet;
node: Dataflow.Field<ChildNode | null>;
@ -24,7 +26,7 @@ export class Widget implements EventTarget {
new Map<string, Map<EventListenerOrEventListenerObject, Wrapped>>();
_parent: Dataflow.Field<ParentNode | null>;
constructor (private nodeGenerator: (t: HtmlFragmentsTemplate) => HtmlFragment) {
constructor (private nodeGenerator: NodeGenerator) {
this.facet = Turn.activeFacet;
on stop {
@ -170,6 +172,50 @@ export class Widget implements EventTarget {
}
}
export class ValueWidget extends Widget {
_value: Dataflow.Field<string>;
_valueAsNumber: Dataflow.Field<number>;
constructor (nodeGenerator: NodeGenerator) {
super(nodeGenerator);
field value: string = '';
this._value = value;
field valueAsNumber: number = NaN;
this._valueAsNumber = valueAsNumber;
const readValues = (n: any) => {
this._value.value = n?.value ?? '';
this._valueAsNumber.value = n?.valueAsNumber ?? NaN;
};
this.on('change', e => readValues(e.target));
dataflow {
if (this.node.value && 'value' in this.node.value) {
readValues(this.node.value);
}
}
dataflow {
if (this.node.value && 'value' in this.node.value) {
(this.node.value as any).value = '' + this._valueAsNumber.value;
}
}
dataflow {
if (this.node.value && 'value' in this.node.value) {
this.node.value.value = this._value.value;
}
}
}
get value(): string { return this._value.value; }
set value(v: string) { this._value.value = v; }
get valueAsNumber(): number { return this._valueAsNumber.value; }
set valueAsNumber(v: number) { this._valueAsNumber.value = v; }
}
function spawnLocationHashTracker(ds: Ref) {
spawn named 'LocationHashTracker' {
at ds {