refactored initialiseChildren into seperate file

This commit is contained in:
Michael Shanks 2020-01-25 06:24:48 +00:00
parent b0c1ace9f0
commit 80514d07bc
3 changed files with 79 additions and 65 deletions

View File

@ -1,58 +1,13 @@
import {
split,
last
} from "lodash/fp";
import {writable} from "svelte/store";
import { $ } from "./core/common";
import {
setupBinding
} from "./state/stateBinding";
import { createCoreApi } from "./core";
import { getStateOrValue } from "./state/getState";
import { setState, setStateFromBinding } from "./state/setState";
import { trimSlash } from "./common/trimSlash";
import { isBound } from "./state/isState";
import { _initialiseChildren } from "./render/initialiseChildren";
export const createApp = (componentLibraries, appDefinition, user) => {
const _initialiseChildren = (parentContext, hydrate) => (childrenProps, htmlElement, context, anchor=null) => {
const childComponents = [];
if(hydrate) {
while (htmlElement.firstChild) {
htmlElement.removeChild(htmlElement.firstChild);
}
}
for(let childProps of childrenProps) {
const {componentName, libName} = splitName(childProps._component);
if(!componentName || !libName) return;
const {initialProps, bind} = setupBinding(
store, childProps, coreApi,
context || parentContext, appDefinition.appRootPath);
const componentProps = {
...initialProps,
_bb:bb(context || parentContext, childProps)
};
const component = new (componentLibraries[libName][componentName])({
target: htmlElement,
props: componentProps,
hydrate:false,
anchor
});
bind(component);
childComponents.push(component);
}
return childComponents;
}
const coreApi = createCoreApi(appDefinition, user);
appDefinition.hierarchy = coreApi.templateApi.constructHierarchy(appDefinition.hierarchy);
@ -96,11 +51,18 @@ export const createApp = (componentLibraries, appDefinition, user) => {
if(isFunction(event)) event(context);
}
const initialiseChildrenParams = (parentContext, hydrate) => ({
bb, coreApi, store,
componentLibraries, appDefinition,
parentContext, hydrate
});
const bb = (context, props) => ({
hydrateChildren: _initialiseChildren(context, true),
appendChildren: _initialiseChildren(context, false),
hydrateChildren: _initialiseChildren(initialiseChildrenParams(context, true)),
appendChildren: _initialiseChildren(initialiseChildrenParams(context, false)),
insertChildren: (props, htmlElement, anchor, context) =>
_initialiseChildren(context, false)(props, htmlElement, context, anchor),
_initialiseChildren(initialiseChildrenParams(context, false))
(props, htmlElement, context, anchor),
store,
relativeUrl,
api,
@ -160,17 +122,3 @@ const buildBindings = (boundProps, boundArrays, contextBoundProps) => {
return bindings;
}
const splitName = fullname => {
const componentName = $(fullname, [
split("/"),
last
]);
const libName =fullname.substring(
0, fullname.length - componentName.length - 1);
return {libName, componentName};
}

View File

@ -0,0 +1,60 @@
import {
setupBinding
} from "../state/stateBinding";
import {
split,
last
} from "lodash/fp";
import { $ } from "../core/common";
export const _initialiseChildren = ({ bb, coreApi, store, componentLibraries, appDefinition, parentContext, hydrate }) =>
(childrenProps, htmlElement, context, anchor=null) => {
const childComponents = [];
if(hydrate) {
while (htmlElement.firstChild) {
htmlElement.removeChild(htmlElement.firstChild);
}
}
for(let childProps of childrenProps) {
const {componentName, libName} = splitName(childProps._component);
if(!componentName || !libName) return;
const {initialProps, bind} = setupBinding(
store, childProps, coreApi,
context || parentContext, appDefinition.appRootPath);
const componentProps = {
...initialProps,
_bb:bb(context || parentContext, childProps)
};
const component = new (componentLibraries[libName][componentName])({
target: htmlElement,
props: componentProps,
hydrate:false,
anchor
});
bind(component);
childComponents.push(component);
}
return childComponents;
}
const splitName = fullname => {
const componentName = $(fullname, [
split("/"),
last
]);
const libName =fullname.substring(
0, fullname.length - componentName.length - 1);
return {libName, componentName};
}

View File

@ -15,6 +15,12 @@ import {
const doNothing = () => {};
doNothing.isPlaceholder=true;
const isMetaProp = (propName) =>
propName === "_component"
|| propName === "_children"
|| propName === "_id"
|| propName === "_style";
export const setupBinding = (store, rootProps, coreApi, context, rootPath) => {
const rootInitialProps = {...rootProps};
@ -27,9 +33,9 @@ export const setupBinding = (store, rootProps, coreApi, context, rootPath) => {
for(let propName in props) {
if(propName === "_component") continue;
if(isMetaProp(propName)) continue;
const val = initialProps[propName];
const val = props[propName];
if(isBound(val) && takeStateFromStore(val)) {