@dooboostore/dom-render
Version:
html view template engine
115 lines • 6.28 kB
JavaScript
import { DomRenderProxy } from './DomRenderProxy';
import { PathRouter } from './routers/PathRouter';
import { HashRouter } from './routers/HashRouter';
import { DomRenderFinalProxy } from './types/Types';
import { RawSet } from './rawsets/RawSet';
import { DefaultMessenger } from './messenger/DefaultMessenger';
import { drComponent } from './components';
export class DomRender {
static run({ rootObject, target, config }) {
var _a, _b, _c;
rootObject = typeof rootObject === 'function' ? rootObject() : rootObject;
const targetConfig = Object.assign({}, config);
let targetObject = rootObject;
if ('_DomRender_isProxy' in rootObject) {
if (target) {
rootObject._DomRender_proxy.initRender(target);
}
targetObject = rootObject;
return targetObject; // { rootObject: targetObject, target, config: targetConfig };
}
// const domRenderConfig = Object.assign()
// if (config && !config.window) {
// config.window = window;
// }
// config.routerType = config.routerType || 'none';
targetConfig.messenger = DomRenderFinalProxy.final((_a = targetConfig.messenger) !== null && _a !== void 0 ? _a : new DefaultMessenger(targetConfig));
targetConfig.proxyExcludeTyps = (_b = targetConfig.proxyExcludeTyps) !== null && _b !== void 0 ? _b : [];
(_c = targetConfig.targetElements) !== null && _c !== void 0 ? _c : (targetConfig.targetElements = []);
for (const value of Object.values(drComponent)) {
const a = value(config);
if (!targetConfig.targetElements.find(it => it.name === a.name)) {
targetConfig.targetElements.push(a);
}
// if (targetConfig.targetElements.indexOf(value) === -1) {
// }
}
// console.log('----------', targetConfig.proxyExcludeTyps)
// console.log('----------', targetConfig.targetElements)
if (typeof Window !== 'undefined' && targetConfig.proxyExcludeTyps.indexOf(Window) === -1) {
targetConfig.proxyExcludeTyps.push(Window);
}
if (typeof Map !== 'undefined' && targetConfig.proxyExcludeTyps.indexOf(Map) === -1) {
targetConfig.proxyExcludeTyps.push(Map);
}
if (typeof Set !== 'undefined' && targetConfig.proxyExcludeTyps.indexOf(Set) === -1) {
targetConfig.proxyExcludeTyps.push(Set);
}
if (typeof Promise !== 'undefined' && targetConfig.proxyExcludeTyps.indexOf(Promise) === -1) {
targetConfig.proxyExcludeTyps.push(Promise);
}
if (typeof ImageBitmap !== 'undefined' && targetConfig.proxyExcludeTyps.indexOf(ImageBitmap) === -1) {
targetConfig.proxyExcludeTyps.push(ImageBitmap);
}
if (typeof CanvasRenderingContext2D !== 'undefined' && targetConfig.proxyExcludeTyps.indexOf(CanvasRenderingContext2D) === -1) {
targetConfig.proxyExcludeTyps.push(CanvasRenderingContext2D);
}
if (typeof HTMLCanvasElement !== 'undefined' && targetConfig.proxyExcludeTyps.indexOf(HTMLCanvasElement) === -1) {
targetConfig.proxyExcludeTyps.push(HTMLCanvasElement);
}
if (targetConfig.proxyExcludeTyps.indexOf(RawSet) === -1) {
targetConfig.proxyExcludeTyps.push(RawSet);
}
const domRender = new DomRenderProxy(rootObject, target, targetConfig);
const dest = new Proxy(rootObject, domRender);
targetObject = dest;
// proxy 된 targetObject를 넣어줘야되서 뒤쪽에서 router를 생성해야함
let targetRouter;
if ((config === null || config === void 0 ? void 0 : config.routerType) === 'hash') {
targetRouter = new HashRouter({ rootObject: targetObject, window: targetConfig.window });
}
else if ((config === null || config === void 0 ? void 0 : config.routerType) === 'path') {
targetRouter = new PathRouter({ rootObject: targetObject, window: targetConfig.window });
}
else if (typeof (config === null || config === void 0 ? void 0 : config.routerType) === 'function') {
targetRouter = config.routerType(targetObject, targetConfig.window);
}
else if (typeof (config === null || config === void 0 ? void 0 : config.routerType) === 'object') {
targetRouter = config.routerType;
}
targetConfig.router = targetRouter;
// console.log('cccccccccccccccccc', targetRouter)
// targetRouter.go({path: targetRouter.getUrl()})
// if (!config.router) {
// if (config.routerType === 'path') {
// config.router = new PathRouter(targetObject, config.window);
// } else if (config.routerType === 'hash') {
// config.router = new HashRouter(targetObject, config.window);
// } else { // none
// config.router = new HashRouter(targetObject, config.window);
// }
// }
domRender.run(targetObject);
return targetObject; // { rootObject: targetObject, config: targetConfig, target };
}
static createComponent(param) {
var _a, _b;
// console.log('===>', typeof param.type, param.type.name, param.type.constructor.name)
const component = RawSet.createComponentTargetElement({
name: (_a = param.tagName) !== null && _a !== void 0 ? _a : (typeof param.type === 'function' ? param.type.name : param.type.constructor.name),
objFactory: (e, o, r2, counstructorParam) => {
return typeof param.type === 'function' ? new param.type(...counstructorParam) : param.type;
},
noStrip: param.noStrip,
template: (_b = param.template) !== null && _b !== void 0 ? _b : '',
styles: Array.isArray(param.styles) ? param.styles : (param.styles ? [param.styles] : undefined)
});
return component;
}
// ?? 언제 쓰는거지?? 훔..
static createAttribute(attrName, getThisObj, factory) {
const targetAttribute = RawSet.createComponentTargetAttribute(attrName, getThisObj, factory);
return targetAttribute;
}
}
//# sourceMappingURL=DomRender.js.map