mirror of
https://github.com/vector-im/hydrogen-web.git
synced 2024-12-23 03:25:12 +01:00
where ResizeObserver is support, restore anchored node on resize
This commit is contained in:
parent
04edff29cf
commit
2c415e37e7
@ -69,6 +69,7 @@ export class TimelineView extends TemplateView<TimelineViewModel> {
|
|||||||
private anchoredBottom: number = 0;
|
private anchoredBottom: number = 0;
|
||||||
private stickToBottom: boolean = true;
|
private stickToBottom: boolean = true;
|
||||||
private tilesView?: TilesListView;
|
private tilesView?: TilesListView;
|
||||||
|
private resizeObserver?: ResizeObserver;
|
||||||
|
|
||||||
render(t: TemplateBuilder, vm: TimelineViewModel) {
|
render(t: TemplateBuilder, vm: TimelineViewModel) {
|
||||||
// assume this view will be mounted in the parent DOM straight away
|
// assume this view will be mounted in the parent DOM straight away
|
||||||
@ -77,9 +78,26 @@ export class TimelineView extends TemplateView<TimelineViewModel> {
|
|||||||
this.restoreScrollPosition();
|
this.restoreScrollPosition();
|
||||||
});
|
});
|
||||||
this.tilesView = new TilesListView(vm.tiles, () => this.restoreScrollPosition());
|
this.tilesView = new TilesListView(vm.tiles, () => this.restoreScrollPosition());
|
||||||
return t.div({className: "Timeline bottom-aligned-scroll", onScroll: () => this.onScroll()}, [
|
const root = t.div({className: "Timeline bottom-aligned-scroll", onScroll: () => this.onScroll()}, [
|
||||||
t.view(this.tilesView)
|
t.view(this.tilesView)
|
||||||
]);
|
]);
|
||||||
|
|
||||||
|
if (typeof ResizeObserver === "function") {
|
||||||
|
this.resizeObserver = new ResizeObserver(() => {
|
||||||
|
this.restoreScrollPosition();
|
||||||
|
});
|
||||||
|
this.resizeObserver.observe(root);
|
||||||
|
}
|
||||||
|
|
||||||
|
return root;
|
||||||
|
}
|
||||||
|
|
||||||
|
public unmount() {
|
||||||
|
super.unmount();
|
||||||
|
if (this.resizeObserver) {
|
||||||
|
this.resizeObserver.unobserve(this.root());
|
||||||
|
this.resizeObserver = null;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
private restoreScrollPosition() {
|
private restoreScrollPosition() {
|
||||||
|
Loading…
Reference in New Issue
Block a user