refactored initialiseChildren into seperate file
This commit is contained in:
parent
b0c1ace9f0
commit
80514d07bc
|
@ -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};
|
||||
}
|
||||
|
||||
|
||||
|
|
|
@ -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};
|
||||
}
|
|
@ -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)) {
|
||||
|
||||
|
|
Loading…
Reference in New Issue