we should not have a mapView as root, add a div

because if we do a mapView of this view from the parent, it won't work
as the parent is swapped from underneath that binding and
it can't replace it
This commit is contained in:
Bruno Windels 2020-12-04 15:59:50 +01:00
parent 77fad9406b
commit 7bb2ba91c3
2 changed files with 8 additions and 4 deletions

View file

@ -20,13 +20,15 @@ import {ClientView} from "../open/ClientView.js";
export class PreviewView extends TemplateView { export class PreviewView extends TemplateView {
render(t, vm) { render(t, vm) {
return t.mapView(vm => vm.loading, loading => loading ? new LoadingPreviewView(vm) : new LoadedPreviewView(vm)); return t.div({className: "PreviewView"}, t.mapView(vm => vm.loading, loading => {
return loading ? new LoadingPreviewView(vm) : new LoadedPreviewView(vm);
}));
} }
} }
class LoadingPreviewView extends TemplateView { class LoadingPreviewView extends TemplateView {
render(t, vm) { render(t, vm) {
return t.div({className: "PreviewView"}, [ return t.div([
t.div({className: "avatarContainer"}, t.div({className: "avatar loading"}, t.div({className: "spinner"}))), t.div({className: "avatarContainer"}, t.div({className: "avatar loading"}, t.div({className: "spinner"}))),
t.h1(vm => vm.name), t.h1(vm => vm.name),
t.p({className: "identifier placeholder"}), t.p({className: "identifier placeholder"}),
@ -42,7 +44,7 @@ class LoadingPreviewView extends TemplateView {
class LoadedPreviewView extends TemplateView { class LoadedPreviewView extends TemplateView {
render(t, vm) { render(t, vm) {
return t.div({className: "PreviewView"}, [ return t.div([
t.div({className: "avatarContainer"}, t.img({className: "avatar", src: vm => vm.avatarUrl})), t.div({className: "avatarContainer"}, t.img({className: "avatar", src: vm => vm.avatarUrl})),
t.h1(vm => vm.name), t.h1(vm => vm.name),
t.p({className: {identifier: true, hidden: vm => !vm.identifier}}, vm => vm.identifier), t.p({className: {identifier: true, hidden: vm => !vm.identifier}}, vm => vm.identifier),

View file

@ -238,6 +238,8 @@ class TemplateBuilder {
const newNode = renderNode(node); const newNode = renderNode(node);
if (node.parentNode) { if (node.parentNode) {
node.parentNode.replaceChild(newNode, node); node.parentNode.replaceChild(newNode, node);
} else {
console.warn("Could not update parent of node binding");
} }
node = newNode; node = newNode;
} }
@ -342,4 +344,4 @@ for (const [ns, tags] of Object.entries(TAG_NAMES)) {
return this.elNS(ns, tag, attributes, children); return this.elNS(ns, tag, attributes, children);
}; };
} }
} }