-
Notifications
You must be signed in to change notification settings - Fork 5
/
RadListViewElement.js
61 lines (61 loc) · 2.67 KB
/
RadListViewElement.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
import { ListViewViewType, RadListView } from 'nativescript-ui-listview';
import Application from '../../..';
import GlimmerResolverDelegate from '../../glimmer/context';
import { createElement } from '../element-registry';
import NativeElementNode from './NativeElementNode';
import TemplateElement from './TemplateElement';
export default class RadListViewElement extends NativeElementNode {
constructor() {
super('radlistview', RadListView, null);
let nativeView = this.nativeView;
nativeView.itemViewLoader = (viewType) => this.loadView(viewType);
this.nativeView.on(RadListView.itemLoadingEvent, (args) => {
this.updateListItem(args);
});
}
get itemTemplateComponent() {
const templateNode = this.childNodes.find((x) => x instanceof TemplateElement);
return templateNode ? templateNode.component : null;
}
loadView(viewType) {
if (viewType === ListViewViewType.ItemView) {
console.log('creating view for ', viewType);
let wrapper = createElement('StackLayout');
wrapper.setAttribute('class', 'list-view-item');
const template = this.itemTemplateComponent;
const component = GlimmerResolverDelegate.lookupComponent('my-insane-component');
const compiled = component.compilable.compile(Application.context);
const cursor = { element: wrapper, nextSibling: null };
// let component = Compilable(template.args.src);
// const compiled = component.compile(Application.context);
let componentInstance = Application._renderComponent(null, cursor, compiled, template.args);
let nativeEl = wrapper.nativeView;
nativeEl.__GlimmerComponent__ = componentInstance._meta.component;
return nativeEl;
}
}
updateListItem(args) {
let item;
let listView = this.nativeView;
let items = listView.items;
if (args.index >= items.length) {
console.log("Got request for item at index that didn't exists", items, args.index);
return;
}
if (items.getItem) {
item = items.getItem(args.index);
}
else {
item = items[args.index];
}
if (args.view && args.view.__GlimmerComponent__) {
let componentInstance = args.view.__GlimmerComponent__;
const oldState = componentInstance.state.value();
// Update the state with the new item
componentInstance.update(Object.assign({}, oldState, { item }));
}
else {
console.log('got invalid update call with', args.index, args.view);
}
}
}