dom-render 1.0.91 → 1.0.92
Sign up to get free protection for your applications and to get access to all the features.
- package/DomRender.js +5 -1
- package/DomRenderProxy.d.ts +1 -1
- package/DomRenderProxy.js +121 -63
- package/README.MD +14 -2
- package/configs/TargetElement.d.ts +1 -1
- package/dist/bundle.js +1189 -835
- package/events/EventManager.js +1 -0
- package/operators/Dr.d.ts +1 -1
- package/operators/Dr.js +58 -17
- package/operators/DrAppender.d.ts +1 -1
- package/operators/DrAppender.js +61 -21
- package/operators/DrFor.d.ts +1 -1
- package/operators/DrFor.js +58 -17
- package/operators/DrForOf.d.ts +1 -1
- package/operators/DrForOf.js +61 -20
- package/operators/DrForm.d.ts +1 -1
- package/operators/DrForm.js +87 -46
- package/operators/DrIf.d.ts +1 -1
- package/operators/DrIf.js +62 -23
- package/operators/DrInnerHTML.d.ts +1 -1
- package/operators/DrInnerHTML.js +56 -15
- package/operators/DrInnerText.d.ts +1 -1
- package/operators/DrInnerText.js +54 -13
- package/operators/DrPre.d.ts +1 -1
- package/operators/DrPre.js +41 -1
- package/operators/DrRepeat.d.ts +1 -1
- package/operators/DrRepeat.js +58 -17
- package/operators/DrTargetAttr.d.ts +1 -1
- package/operators/DrTargetAttr.js +64 -23
- package/operators/DrTargetElement.d.ts +1 -1
- package/operators/DrTargetElement.js +78 -34
- package/operators/DrThis.d.ts +1 -1
- package/operators/DrThis.js +73 -23
- package/operators/OperatorExecuter.d.ts +3 -2
- package/operators/OperatorExecuter.js +60 -14
- package/operators/OperatorExecuterAttrRequire.d.ts +2 -2
- package/operators/OperatorExecuterAttrRequire.js +48 -24
- package/package.json +1 -1
- package/rawsets/RawSet.d.ts +3 -3
- package/rawsets/RawSet.js +458 -315
- package/routers/HashRouter.js +1 -1
- package/routers/PathRouter.js +1 -1
- package/routers/Router.d.ts +3 -0
- package/routers/Router.js +10 -0
package/rawsets/RawSet.js
CHANGED
@@ -10,6 +10,42 @@ var __assign = (this && this.__assign) || function () {
|
|
10
10
|
};
|
11
11
|
return __assign.apply(this, arguments);
|
12
12
|
};
|
13
|
+
var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
|
14
|
+
function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
|
15
|
+
return new (P || (P = Promise))(function (resolve, reject) {
|
16
|
+
function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
|
17
|
+
function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
|
18
|
+
function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
|
19
|
+
step((generator = generator.apply(thisArg, _arguments || [])).next());
|
20
|
+
});
|
21
|
+
};
|
22
|
+
var __generator = (this && this.__generator) || function (thisArg, body) {
|
23
|
+
var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
|
24
|
+
return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
|
25
|
+
function verb(n) { return function (v) { return step([n, v]); }; }
|
26
|
+
function step(op) {
|
27
|
+
if (f) throw new TypeError("Generator is already executing.");
|
28
|
+
while (_) try {
|
29
|
+
if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
|
30
|
+
if (y = 0, t) op = [op[0] & 2, t.value];
|
31
|
+
switch (op[0]) {
|
32
|
+
case 0: case 1: t = op; break;
|
33
|
+
case 4: _.label++; return { value: op[1], done: false };
|
34
|
+
case 5: _.label++; y = op[1]; op = [0]; continue;
|
35
|
+
case 7: op = _.ops.pop(); _.trys.pop(); continue;
|
36
|
+
default:
|
37
|
+
if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
|
38
|
+
if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
|
39
|
+
if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
|
40
|
+
if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
|
41
|
+
if (t[2]) _.ops.pop();
|
42
|
+
_.trys.pop(); continue;
|
43
|
+
}
|
44
|
+
op = body.call(thisArg, _);
|
45
|
+
} catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
|
46
|
+
if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
|
47
|
+
}
|
48
|
+
};
|
13
49
|
var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
|
14
50
|
if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
|
15
51
|
if (ar || !(i in from)) {
|
@@ -109,167 +145,185 @@ var RawSet = /** @class */ (function () {
|
|
109
145
|
};
|
110
146
|
// 중요 render 처리 부분
|
111
147
|
RawSet.prototype.render = function (obj, config) {
|
112
|
-
var _this = this;
|
113
148
|
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x;
|
114
|
-
|
115
|
-
|
116
|
-
|
117
|
-
|
118
|
-
|
119
|
-
|
120
|
-
|
121
|
-
|
122
|
-
|
123
|
-
|
124
|
-
|
125
|
-
|
126
|
-
|
127
|
-
|
128
|
-
|
129
|
-
|
130
|
-
|
131
|
-
|
132
|
-
|
133
|
-
|
134
|
-
|
135
|
-
|
136
|
-
|
137
|
-
|
138
|
-
|
139
|
-
|
140
|
-
|
141
|
-
|
142
|
-
|
143
|
-
|
144
|
-
|
145
|
-
|
146
|
-
|
147
|
-
|
148
|
-
|
149
|
-
|
150
|
-
|
151
|
-
|
152
|
-
|
153
|
-
|
154
|
-
|
155
|
-
|
156
|
-
|
157
|
-
|
158
|
-
|
159
|
-
|
160
|
-
|
161
|
-
|
162
|
-
|
163
|
-
|
164
|
-
|
165
|
-
|
166
|
-
|
167
|
-
|
168
|
-
|
169
|
-
|
170
|
-
|
171
|
-
|
172
|
-
|
173
|
-
|
174
|
-
|
175
|
-
|
176
|
-
|
177
|
-
|
178
|
-
|
179
|
-
|
180
|
-
|
181
|
-
|
182
|
-
|
183
|
-
|
184
|
-
|
185
|
-
|
186
|
-
|
187
|
-
|
188
|
-
|
189
|
-
|
190
|
-
|
191
|
-
|
192
|
-
|
193
|
-
|
194
|
-
|
195
|
-
|
196
|
-
|
197
|
-
|
198
|
-
|
199
|
-
|
200
|
-
|
201
|
-
|
202
|
-
|
203
|
-
|
204
|
-
|
205
|
-
|
206
|
-
|
207
|
-
|
208
|
-
|
209
|
-
|
210
|
-
|
211
|
-
|
212
|
-
|
213
|
-
|
214
|
-
|
215
|
-
|
216
|
-
|
217
|
-
|
218
|
-
|
219
|
-
|
220
|
-
|
221
|
-
|
222
|
-
|
223
|
-
|
224
|
-
|
225
|
-
|
226
|
-
|
227
|
-
|
228
|
-
|
229
|
-
|
230
|
-
|
231
|
-
|
232
|
-
|
233
|
-
|
234
|
-
|
235
|
-
|
236
|
-
|
237
|
-
|
238
|
-
|
239
|
-
|
240
|
-
|
241
|
-
|
242
|
-
|
243
|
-
|
244
|
-
|
245
|
-
|
246
|
-
|
247
|
-
|
248
|
-
|
249
|
-
|
250
|
-
|
251
|
-
|
252
|
-
|
253
|
-
|
254
|
-
|
255
|
-
|
256
|
-
|
257
|
-
|
258
|
-
|
259
|
-
|
260
|
-
|
261
|
-
|
262
|
-
|
263
|
-
|
264
|
-
|
265
|
-
|
266
|
-
|
267
|
-
|
268
|
-
|
149
|
+
return __awaiter(this, void 0, void 0, function () {
|
150
|
+
var genNode, raws, onAttrInitCallBacks, onElementInitCallBacks, onThisComponentSetCallBacks, drAttrs, _i, _y, cNode, attribute, __render, fag, textContent, runText, newNode, r, template, r, element, drAttr, operators, _z, operators_1, operator, state, _0, onThisComponentSetCallBacks_1, it_1, _1, onElementInitCallBacks_1, it_2, oninit, param, script, _2, onAttrInitCallBacks_1, it_3;
|
151
|
+
var _this = this;
|
152
|
+
return __generator(this, function (_3) {
|
153
|
+
switch (_3.label) {
|
154
|
+
case 0:
|
155
|
+
genNode = config.window.document.importNode(this.fragment, true);
|
156
|
+
raws = [];
|
157
|
+
onAttrInitCallBacks = [];
|
158
|
+
onElementInitCallBacks = [];
|
159
|
+
onThisComponentSetCallBacks = [];
|
160
|
+
drAttrs = [];
|
161
|
+
_i = 0, _y = Array.from(genNode.childNodes.values());
|
162
|
+
_3.label = 1;
|
163
|
+
case 1:
|
164
|
+
if (!(_i < _y.length)) return [3 /*break*/, 7];
|
165
|
+
cNode = _y[_i];
|
166
|
+
attribute = {};
|
167
|
+
if (cNode.nodeType === Node.ELEMENT_NODE) {
|
168
|
+
attribute = DomUtils_1.DomUtils.getAttributeToObject(cNode);
|
169
|
+
}
|
170
|
+
__render = Object.freeze({
|
171
|
+
rawset: this,
|
172
|
+
scripts: EventManager_1.EventManager.setBindProperty(config === null || config === void 0 ? void 0 : config.scripts, obj),
|
173
|
+
router: config === null || config === void 0 ? void 0 : config.router,
|
174
|
+
range: Range_1.Range.range,
|
175
|
+
element: cNode,
|
176
|
+
attribute: attribute,
|
177
|
+
bindScript: "\n const ".concat(EventManager_1.EventManager.SCRIPTS_VARNAME, " = this.__render.scripts;\n const ").concat(EventManager_1.EventManager.RAWSET_VARNAME, " = this.__render.rawset;\n const ").concat(EventManager_1.EventManager.ELEMENT_VARNAME, " = this.__render.element;\n const ").concat(EventManager_1.EventManager.ATTRIBUTE_VARNAME, " = this.__render.attribute;\n const ").concat(EventManager_1.EventManager.RANGE_VARNAME, " = this.__render.range;\n const ").concat(EventManager_1.EventManager.ROUTER_VARNAME, " = this.__render.router;\n ")
|
178
|
+
// eslint-disable-next-line no-use-before-define
|
179
|
+
});
|
180
|
+
fag = config.window.document.createDocumentFragment();
|
181
|
+
if (!(cNode.nodeType === Node.TEXT_NODE && cNode.textContent)) return [3 /*break*/, 2];
|
182
|
+
textContent = cNode.textContent;
|
183
|
+
runText = RawSet.exporesionGrouops(textContent)[0][1];
|
184
|
+
newNode = void 0;
|
185
|
+
if (textContent === null || textContent === void 0 ? void 0 : textContent.startsWith('#')) {
|
186
|
+
r = ScriptUtils_1.ScriptUtils.eval("".concat(__render.bindScript, " return ").concat(runText), Object.assign(obj, { __render: __render }));
|
187
|
+
template = config.window.document.createElement('template');
|
188
|
+
template.innerHTML = r;
|
189
|
+
newNode = template.content;
|
190
|
+
}
|
191
|
+
else {
|
192
|
+
r = ScriptUtils_1.ScriptUtils.eval("".concat(__render.bindScript, " return ").concat(runText), Object.assign(obj, { __render: __render }));
|
193
|
+
newNode = config.window.document.createTextNode(r);
|
194
|
+
}
|
195
|
+
(_a = cNode.parentNode) === null || _a === void 0 ? void 0 : _a.replaceChild(newNode, cNode);
|
196
|
+
// console.log('-------', this.point.start.parentNode.nodeName)
|
197
|
+
// 중요 style value change 됐을때 다시 처리해야되기떄문에: 마지막에 completed 없는 attr 가지고 판단 하니깐
|
198
|
+
if (this.type === RawSetType_1.RawSetType.STYLE_TEXT && this.point.parent) {
|
199
|
+
this.point.parent.removeAttribute('completed');
|
200
|
+
}
|
201
|
+
return [3 /*break*/, 6];
|
202
|
+
case 2:
|
203
|
+
if (!(cNode.nodeType === Node.ELEMENT_NODE)) return [3 /*break*/, 6];
|
204
|
+
element = cNode;
|
205
|
+
drAttr = {
|
206
|
+
dr: this.getAttributeAndDelete(element, RawSet.DR_NAME),
|
207
|
+
drIf: this.getAttributeAndDelete(element, RawSet.DR_IF_NAME),
|
208
|
+
drFor: this.getAttributeAndDelete(element, RawSet.DR_FOR_NAME),
|
209
|
+
drForOf: this.getAttributeAndDelete(element, RawSet.DR_FOR_OF_NAME),
|
210
|
+
drAppender: this.getAttributeAndDelete(element, RawSet.DR_APPENDER_NAME),
|
211
|
+
drRepeat: this.getAttributeAndDelete(element, RawSet.DR_REPEAT_NAME),
|
212
|
+
drThis: this.getAttributeAndDelete(element, RawSet.DR_THIS_NAME),
|
213
|
+
drForm: this.getAttributeAndDelete(element, RawSet.DR_FORM_NAME),
|
214
|
+
drPre: this.getAttributeAndDelete(element, RawSet.DR_PRE_NAME),
|
215
|
+
drInnerHTML: this.getAttributeAndDelete(element, RawSet.DR_INNERHTML_NAME),
|
216
|
+
drInnerText: this.getAttributeAndDelete(element, RawSet.DR_INNERTEXT_NAME),
|
217
|
+
drItOption: this.getAttributeAndDelete(element, RawSet.DR_IT_OPTIONNAME),
|
218
|
+
drVarOption: this.getAttributeAndDelete(element, RawSet.DR_VAR_OPTIONNAME),
|
219
|
+
drNextOption: this.getAttributeAndDelete(element, RawSet.DR_NEXT_OPTIONNAME),
|
220
|
+
drAfterOption: this.getAttributeAndDelete(element, RawSet.DR_AFTER_OPTIONNAME),
|
221
|
+
drBeforeOption: this.getAttributeAndDelete(element, RawSet.DR_BEFORE_OPTIONNAME),
|
222
|
+
drCompleteOption: this.getAttributeAndDelete(element, RawSet.DR_COMPLETE_OPTIONNAME),
|
223
|
+
drStripOption: this.getAttributeAndDelete(element, RawSet.DR_STRIP_OPTIONNAME),
|
224
|
+
drDestroyOption: this.getAttributeAndDelete(element, RawSet.DR_DESTROY_OPTIONNAME)
|
225
|
+
};
|
226
|
+
drAttrs.push(drAttr);
|
227
|
+
operators = [
|
228
|
+
new DrPre_1.DrPre(this, __render, { raws: raws, fag: fag }, { element: element, attrName: RawSet.DR_PRE_NAME, attr: drAttr.drPre, attrs: drAttr }, { config: config, obj: obj, operatorAround: (_b = config.operatorAround) === null || _b === void 0 ? void 0 : _b.drPre }, { onAttrInitCallBacks: onAttrInitCallBacks, onElementInitCallBacks: onElementInitCallBacks, onThisComponentSetCallBacks: onThisComponentSetCallBacks }),
|
229
|
+
new Dr_1.Dr(this, __render, { raws: raws, fag: fag }, { element: element, attrName: RawSet.DR_NAME, attr: drAttr.dr, attrs: drAttr }, { config: config, obj: obj, operatorAround: (_c = config.operatorAround) === null || _c === void 0 ? void 0 : _c.dr }, { onAttrInitCallBacks: onAttrInitCallBacks, onElementInitCallBacks: onElementInitCallBacks, onThisComponentSetCallBacks: onThisComponentSetCallBacks }),
|
230
|
+
new DrIf_1.DrIf(this, __render, { raws: raws, fag: fag }, { element: element, attrName: RawSet.DR_IF_NAME, attr: drAttr.drIf, attrs: drAttr }, { config: config, obj: obj, operatorAround: (_d = config.operatorAround) === null || _d === void 0 ? void 0 : _d.drIf }, { onAttrInitCallBacks: onAttrInitCallBacks, onElementInitCallBacks: onElementInitCallBacks, onThisComponentSetCallBacks: onThisComponentSetCallBacks }),
|
231
|
+
new DrThis_1.DrThis(this, __render, { raws: raws, fag: fag }, { element: element, attrName: RawSet.DR_THIS_NAME, attr: drAttr.drThis, attrs: drAttr }, { config: config, obj: obj, operatorAround: (_e = config.operatorAround) === null || _e === void 0 ? void 0 : _e.drThis }, { onAttrInitCallBacks: onAttrInitCallBacks, onElementInitCallBacks: onElementInitCallBacks, onThisComponentSetCallBacks: onThisComponentSetCallBacks }),
|
232
|
+
new DrForm_1.DrForm(this, __render, { raws: raws, fag: fag }, { element: element, attrName: RawSet.DR_FOR_NAME, attr: drAttr.drForm, attrs: drAttr }, { config: config, obj: obj, operatorAround: (_f = config.operatorAround) === null || _f === void 0 ? void 0 : _f.drForm }, { onAttrInitCallBacks: onAttrInitCallBacks, onElementInitCallBacks: onElementInitCallBacks, onThisComponentSetCallBacks: onThisComponentSetCallBacks }),
|
233
|
+
new DrInnerText_1.DrInnerText(this, __render, { raws: raws, fag: fag }, { element: element, attrName: RawSet.DR_INNERTEXT_NAME, attr: drAttr.drInnerText, attrs: drAttr }, { config: config, obj: obj, operatorAround: (_g = config.operatorAround) === null || _g === void 0 ? void 0 : _g.drInnerText }, { onAttrInitCallBacks: onAttrInitCallBacks, onElementInitCallBacks: onElementInitCallBacks, onThisComponentSetCallBacks: onThisComponentSetCallBacks }),
|
234
|
+
new DrInnerHTML_1.DrInnerHTML(this, __render, { raws: raws, fag: fag }, { element: element, attrName: RawSet.DR_INNERHTML_NAME, attr: drAttr.drInnerHTML, attrs: drAttr }, { config: config, obj: obj, operatorAround: (_h = config.operatorAround) === null || _h === void 0 ? void 0 : _h.drInnerHTML }, { onAttrInitCallBacks: onAttrInitCallBacks, onElementInitCallBacks: onElementInitCallBacks, onThisComponentSetCallBacks: onThisComponentSetCallBacks }),
|
235
|
+
new DrFor_1.DrFor(this, __render, { raws: raws, fag: fag }, { element: element, attrName: RawSet.DR_FOR_NAME, attr: drAttr.drFor, attrs: drAttr }, { config: config, obj: obj, operatorAround: (_j = config.operatorAround) === null || _j === void 0 ? void 0 : _j.drFor }, { onAttrInitCallBacks: onAttrInitCallBacks, onElementInitCallBacks: onElementInitCallBacks, onThisComponentSetCallBacks: onThisComponentSetCallBacks }),
|
236
|
+
new DrForOf_1.DrForOf(this, __render, { raws: raws, fag: fag }, { element: element, attrName: RawSet.DR_FOR_OF_NAME, attr: drAttr.drForOf, attrs: drAttr }, { config: config, obj: obj, operatorAround: (_k = config.operatorAround) === null || _k === void 0 ? void 0 : _k.drForOf }, { onAttrInitCallBacks: onAttrInitCallBacks, onElementInitCallBacks: onElementInitCallBacks, onThisComponentSetCallBacks: onThisComponentSetCallBacks }),
|
237
|
+
new DrAppender_1.DrAppender(this, __render, { raws: raws, fag: fag }, { element: element, attrName: RawSet.DR_APPENDER_NAME, attr: drAttr.drAppender, attrs: drAttr }, { config: config, obj: obj, operatorAround: (_l = config.operatorAround) === null || _l === void 0 ? void 0 : _l.drAppender }, { onAttrInitCallBacks: onAttrInitCallBacks, onElementInitCallBacks: onElementInitCallBacks, onThisComponentSetCallBacks: onThisComponentSetCallBacks }),
|
238
|
+
new DrRepeat_1.DrRepeat(this, __render, { raws: raws, fag: fag }, { element: element, attrName: RawSet.DR_REPEAT_NAME, attr: drAttr.drRepeat, attrs: drAttr }, { config: config, obj: obj, operatorAround: (_m = config.operatorAround) === null || _m === void 0 ? void 0 : _m.drRepeat }, { onAttrInitCallBacks: onAttrInitCallBacks, onElementInitCallBacks: onElementInitCallBacks, onThisComponentSetCallBacks: onThisComponentSetCallBacks }),
|
239
|
+
new DrTargetElement_1.DrTargetElement(this, __render, { raws: raws, fag: fag }, { element: element, attrs: drAttr }, { config: config, obj: obj }, { onAttrInitCallBacks: onAttrInitCallBacks, onElementInitCallBacks: onElementInitCallBacks, onThisComponentSetCallBacks: onThisComponentSetCallBacks }),
|
240
|
+
new DrTargetAttr_1.DrTargetAttr(this, __render, { raws: raws, fag: fag }, { element: element, attrs: drAttr }, { config: config, obj: obj }, { onAttrInitCallBacks: onAttrInitCallBacks, onElementInitCallBacks: onElementInitCallBacks, onThisComponentSetCallBacks: onThisComponentSetCallBacks })
|
241
|
+
];
|
242
|
+
_z = 0, operators_1 = operators;
|
243
|
+
_3.label = 3;
|
244
|
+
case 3:
|
245
|
+
if (!(_z < operators_1.length)) return [3 /*break*/, 6];
|
246
|
+
operator = operators_1[_z];
|
247
|
+
return [4 /*yield*/, operator.start()];
|
248
|
+
case 4:
|
249
|
+
state = _3.sent();
|
250
|
+
if (state === OperatorExecuter_1.ExecuteState.EXECUTE) {
|
251
|
+
return [3 /*break*/, 6];
|
252
|
+
}
|
253
|
+
else if (state === OperatorExecuter_1.ExecuteState.STOP) {
|
254
|
+
return [2 /*return*/, raws];
|
255
|
+
}
|
256
|
+
_3.label = 5;
|
257
|
+
case 5:
|
258
|
+
_z++;
|
259
|
+
return [3 /*break*/, 3];
|
260
|
+
case 6:
|
261
|
+
_i++;
|
262
|
+
return [3 /*break*/, 1];
|
263
|
+
case 7:
|
264
|
+
this.applyEvent(obj, genNode, config);
|
265
|
+
this.replaceBody(genNode); // 중요 여기서 마지막에 연션된 값을 그려준다.
|
266
|
+
drAttrs.forEach(function (it) {
|
267
|
+
if (it.drCompleteOption) {
|
268
|
+
// genNode.childNodes
|
269
|
+
var render = Object.freeze({
|
270
|
+
rawset: _this,
|
271
|
+
fag: genNode,
|
272
|
+
scripts: EventManager_1.EventManager.setBindProperty(config === null || config === void 0 ? void 0 : config.scripts, obj)
|
273
|
+
});
|
274
|
+
ScriptUtils_1.ScriptUtils.eval("\n const ".concat(EventManager_1.EventManager.FAG_VARNAME, " = this.__render.fag;\n const ").concat(EventManager_1.EventManager.SCRIPTS_VARNAME, " = this.__render.scripts;\n const ").concat(EventManager_1.EventManager.RAWSET_VARNAME, " = this.__render.rawset;\n ").concat(it.drCompleteOption), Object.assign(obj, { __render: render }));
|
275
|
+
}
|
276
|
+
});
|
277
|
+
// 중요 style isolation 나중에 :scope로 대체 가능할듯.
|
278
|
+
RawSet.generateStyleSheetsLocal();
|
279
|
+
for (_0 = 0, onThisComponentSetCallBacks_1 = onThisComponentSetCallBacks; _0 < onThisComponentSetCallBacks_1.length; _0++) {
|
280
|
+
it_1 = onThisComponentSetCallBacks_1[_0];
|
281
|
+
(_p = (_o = it_1.obj) === null || _o === void 0 ? void 0 : _o.onInitRender) === null || _p === void 0 ? void 0 : _p.call(_o);
|
282
|
+
}
|
283
|
+
for (_1 = 0, onElementInitCallBacks_1 = onElementInitCallBacks; _1 < onElementInitCallBacks_1.length; _1++) {
|
284
|
+
it_2 = onElementInitCallBacks_1[_1];
|
285
|
+
if (((_r = (_q = it_2.targetElement) === null || _q === void 0 ? void 0 : _q.__render) === null || _r === void 0 ? void 0 : _r.element) && ((_t = (_s = it_2.targetElement) === null || _s === void 0 ? void 0 : _s.__render) === null || _t === void 0 ? void 0 : _t.component)) {
|
286
|
+
oninit = it_2.targetElement.__render.element.getAttribute(RawSet.DR_ON_INIT_ARGUMENTS_OPTIONNAME);
|
287
|
+
param = [];
|
288
|
+
if (oninit) {
|
289
|
+
script = "".concat(it_2.targetElement.__render.renderScript, " return ").concat(oninit, " ");
|
290
|
+
param = ScriptUtils_1.ScriptUtils.eval(script, Object.assign(obj, {
|
291
|
+
__render: it_2.targetElement.__render
|
292
|
+
}));
|
293
|
+
if (!Array.isArray(param)) {
|
294
|
+
param = [param];
|
295
|
+
}
|
296
|
+
}
|
297
|
+
(_v = (_u = it_2.targetElement.__render.component).onInitRender) === null || _v === void 0 ? void 0 : _v.call.apply(_v, __spreadArray([_u], param, false));
|
298
|
+
}
|
299
|
+
(_w = config === null || config === void 0 ? void 0 : config.onElementInit) === null || _w === void 0 ? void 0 : _w.call(config, it_2.name, obj, this, it_2.targetElement);
|
300
|
+
}
|
301
|
+
// TODO: 이부분도 위에 targetElement 처럼 해야될까?
|
302
|
+
for (_2 = 0, onAttrInitCallBacks_1 = onAttrInitCallBacks; _2 < onAttrInitCallBacks_1.length; _2++) {
|
303
|
+
it_3 = onAttrInitCallBacks_1[_2];
|
304
|
+
(_x = config === null || config === void 0 ? void 0 : config.onAttrInit) === null || _x === void 0 ? void 0 : _x.call(config, it_3.attrName, it_3.attrValue, obj, this);
|
305
|
+
}
|
306
|
+
// component destroy
|
307
|
+
if (obj.__domrender_components) {
|
308
|
+
Object.entries(obj.__domrender_components).forEach(function (_a) {
|
309
|
+
var _b, _c;
|
310
|
+
var key = _a[0], value = _a[1];
|
311
|
+
var domrenderComponentNew = value.__domrender_component_new;
|
312
|
+
var rawSet = domrenderComponentNew === null || domrenderComponentNew === void 0 ? void 0 : domrenderComponentNew.rawSet;
|
313
|
+
var drAttrs = domrenderComponentNew === null || domrenderComponentNew === void 0 ? void 0 : domrenderComponentNew.drAttrs;
|
314
|
+
if (rawSet && !rawSet.isConnected) {
|
315
|
+
// const domrenderComponent = obj.__domrender_components[key];
|
316
|
+
// console.log('component destroy--->', key, rawSet, rawSet.isConnected, domrenderComponent.name, domrenderComponent);
|
317
|
+
var destroyOptions = (_c = (_b = drAttrs === null || drAttrs === void 0 ? void 0 : drAttrs.drDestroyOption) === null || _b === void 0 ? void 0 : _b.split(',')) !== null && _c !== void 0 ? _c : [];
|
318
|
+
RawSet.destroy(obj.__domrender_components[key], [domrenderComponentNew], config, destroyOptions);
|
319
|
+
delete obj.__domrender_components[key];
|
320
|
+
}
|
321
|
+
});
|
322
|
+
}
|
323
|
+
return [2 /*return*/, raws];
|
269
324
|
}
|
270
325
|
});
|
271
|
-
}
|
272
|
-
return raws;
|
326
|
+
});
|
273
327
|
};
|
274
328
|
RawSet.generateStyleSheetsLocal = function () {
|
275
329
|
Array.from(window.document.styleSheets).filter(function (it) { return it.ownerNode && it.ownerNode instanceof Element && it.ownerNode.hasAttribute('domstyle') && it.ownerNode.getAttribute('id') && !it.ownerNode.getAttribute('completed'); }).forEach(function (it) {
|
@@ -633,54 +687,95 @@ var RawSet = /** @class */ (function () {
|
|
633
687
|
});
|
634
688
|
};
|
635
689
|
RawSet.drThisCreate = function (rawSet, element, drThis, drVarOption, drStripOption, obj, config, set) {
|
636
|
-
var _a, _b, _c, _d;
|
637
|
-
|
638
|
-
|
639
|
-
|
640
|
-
|
641
|
-
|
642
|
-
|
643
|
-
|
644
|
-
|
645
|
-
|
646
|
-
|
647
|
-
|
648
|
-
|
649
|
-
|
650
|
-
|
651
|
-
|
652
|
-
|
653
|
-
|
654
|
-
|
655
|
-
|
690
|
+
var _a, _b, _c, _d, _e;
|
691
|
+
return __awaiter(this, void 0, void 0, function () {
|
692
|
+
var fag, n, stylePromises, templatePromise, _f, i, it_5, _g, _h, _j, _k, _l, style, onCreate, renderScript, createParam, script, oninit, script, thisRandom, vars;
|
693
|
+
return __generator(this, function (_m) {
|
694
|
+
switch (_m.label) {
|
695
|
+
case 0:
|
696
|
+
fag = config.window.document.createDocumentFragment();
|
697
|
+
n = element.cloneNode(true);
|
698
|
+
if (!set) return [3 /*break*/, 12];
|
699
|
+
stylePromises = [];
|
700
|
+
if (!(set.template && set.template.startsWith('lazy://'))) return [3 /*break*/, 2];
|
701
|
+
return [4 /*yield*/, fetch(set.template.substring(6))];
|
702
|
+
case 1:
|
703
|
+
_f = (_m.sent()).text();
|
704
|
+
return [3 /*break*/, 3];
|
705
|
+
case 2:
|
706
|
+
_f = Promise.resolve(set.template);
|
707
|
+
_m.label = 3;
|
708
|
+
case 3:
|
709
|
+
templatePromise = (_f);
|
710
|
+
i = 0;
|
711
|
+
_m.label = 4;
|
712
|
+
case 4:
|
713
|
+
if (!(set.styles && i < ((_a = set.styles.length) !== null && _a !== void 0 ? _a : 0))) return [3 /*break*/, 9];
|
714
|
+
it_5 = set.styles[i];
|
715
|
+
_h = (_g = stylePromises).push;
|
716
|
+
if (!it_5.startsWith('lazy://')) return [3 /*break*/, 6];
|
717
|
+
return [4 /*yield*/, fetch(it_5.substring(6))];
|
718
|
+
case 5:
|
719
|
+
_j = (_m.sent()).text();
|
720
|
+
return [3 /*break*/, 7];
|
721
|
+
case 6:
|
722
|
+
_j = Promise.resolve(it_5);
|
723
|
+
_m.label = 7;
|
724
|
+
case 7:
|
725
|
+
_h.apply(_g, [_j]);
|
726
|
+
_m.label = 8;
|
727
|
+
case 8:
|
728
|
+
i++;
|
729
|
+
return [3 /*break*/, 4];
|
730
|
+
case 9:
|
731
|
+
_k = set;
|
732
|
+
return [4 /*yield*/, templatePromise];
|
733
|
+
case 10:
|
734
|
+
_k.template = _m.sent();
|
735
|
+
_l = set;
|
736
|
+
return [4 /*yield*/, Promise.all(stylePromises)];
|
737
|
+
case 11:
|
738
|
+
_l.styles = _m.sent();
|
739
|
+
style = RawSet.generateStyleTransform((_b = set.styles) !== null && _b !== void 0 ? _b : [], rawSet.uuid, true);
|
740
|
+
n.innerHTML = style + ((_c = set.template) !== null && _c !== void 0 ? _c : '');
|
741
|
+
onCreate = element.getAttribute(RawSet.DR_ON_CREATE_ARGUMENTS_OPTIONNAME);
|
742
|
+
renderScript = '';
|
743
|
+
createParam = [];
|
744
|
+
if (onCreate) {
|
745
|
+
script = "".concat(renderScript, " return ").concat(onCreate, " ");
|
746
|
+
createParam = ScriptUtils_1.ScriptUtils.eval(script, obj);
|
747
|
+
if (!Array.isArray(createParam)) {
|
748
|
+
createParam = [createParam];
|
749
|
+
}
|
750
|
+
}
|
751
|
+
(_e = (_d = set.obj) === null || _d === void 0 ? void 0 : _d.onCreateRender) === null || _e === void 0 ? void 0 : _e.call.apply(_e, __spreadArray([_d], createParam, false));
|
752
|
+
oninit = element.getAttribute(RawSet.DR_ON_CREATED_CALLBACK_OPTIONNAME);
|
753
|
+
if (oninit) {
|
754
|
+
script = "".concat(renderScript, " ").concat(oninit, " ");
|
755
|
+
ScriptUtils_1.ScriptUtils.eval(script, obj);
|
756
|
+
}
|
757
|
+
_m.label = 12;
|
758
|
+
case 12:
|
759
|
+
n.querySelectorAll(EventManager_1.eventManager.attrNames.map(function (it) { return "[".concat(it, "]"); }).join(',')).forEach(function (it) {
|
760
|
+
it.setAttribute(EventManager_1.EventManager.ownerVariablePathAttrName, 'this');
|
761
|
+
});
|
762
|
+
thisRandom = this.drThisEncoding(n, drThis);
|
763
|
+
vars = this.drVarEncoding(n, drVarOption);
|
764
|
+
this.drVarDecoding(n, vars);
|
765
|
+
this.drThisDecoding(n, thisRandom);
|
766
|
+
if (drStripOption && (drStripOption === true || drStripOption === 'true')) {
|
767
|
+
// console.log('------childNodes', Array.from(n.childNodes))
|
768
|
+
Array.from(n.childNodes).forEach(function (it) { return fag.append(it); });
|
769
|
+
}
|
770
|
+
else {
|
771
|
+
fag.append(n);
|
772
|
+
}
|
773
|
+
fag.__domrender_this_variable_name = drThis;
|
774
|
+
// console.log('set __domrender_this_variable_name', (fag as any).__domrender_this_variable_name)
|
775
|
+
return [2 /*return*/, fag];
|
656
776
|
}
|
657
|
-
}
|
658
|
-
(_d = (_c = set.obj) === null || _c === void 0 ? void 0 : _c.onCreateRender) === null || _d === void 0 ? void 0 : _d.call.apply(_d, __spreadArray([_c], createParam, false));
|
659
|
-
// dr-on-component-init
|
660
|
-
// const oninit = element.getAttribute(`${EventManager.attrPrefix}on-component-init`); // dr-on-component-init
|
661
|
-
var oninit = element.getAttribute(RawSet.DR_ON_CREATED_CALLBACK_OPTIONNAME); // dr-on-component-init
|
662
|
-
if (oninit) {
|
663
|
-
var script = "".concat(renderScript, " ").concat(oninit, " ");
|
664
|
-
ScriptUtils_1.ScriptUtils.eval(script, obj);
|
665
|
-
}
|
666
|
-
}
|
667
|
-
n.querySelectorAll(EventManager_1.eventManager.attrNames.map(function (it) { return "[".concat(it, "]"); }).join(',')).forEach(function (it) {
|
668
|
-
it.setAttribute(EventManager_1.EventManager.ownerVariablePathAttrName, 'this');
|
777
|
+
});
|
669
778
|
});
|
670
|
-
var thisRandom = this.drThisEncoding(n, drThis);
|
671
|
-
var vars = this.drVarEncoding(n, drVarOption);
|
672
|
-
this.drVarDecoding(n, vars);
|
673
|
-
this.drThisDecoding(n, thisRandom);
|
674
|
-
if (drStripOption && (drStripOption === true || drStripOption === 'true')) {
|
675
|
-
// console.log('------childNodes', Array.from(n.childNodes))
|
676
|
-
Array.from(n.childNodes).forEach(function (it) { return fag.append(it); });
|
677
|
-
}
|
678
|
-
else {
|
679
|
-
fag.append(n);
|
680
|
-
}
|
681
|
-
fag.__domrender_this_variable_name = drThis;
|
682
|
-
// console.log('set __domrender_this_variable_name', (fag as any).__domrender_this_variable_name)
|
683
|
-
return fag;
|
684
779
|
};
|
685
780
|
RawSet.createComponentTargetAttribute = function (name, getThisObj, factory) {
|
686
781
|
var targetAttribute = {
|
@@ -711,115 +806,163 @@ var RawSet = /** @class */ (function () {
|
|
711
806
|
styles: styles,
|
712
807
|
template: template,
|
713
808
|
callBack: function (element, obj, rawSet, attrs, config) {
|
714
|
-
var _a, _b, _c, _d, _e, _f;
|
715
|
-
|
716
|
-
|
717
|
-
|
718
|
-
|
719
|
-
|
720
|
-
|
721
|
-
|
722
|
-
|
723
|
-
|
724
|
-
|
725
|
-
|
726
|
-
|
727
|
-
|
728
|
-
|
729
|
-
|
730
|
-
|
731
|
-
|
732
|
-
|
733
|
-
|
734
|
-
|
735
|
-
|
736
|
-
|
737
|
-
|
738
|
-
|
739
|
-
|
740
|
-
|
741
|
-
|
742
|
-
|
743
|
-
|
744
|
-
|
745
|
-
|
746
|
-
|
747
|
-
|
748
|
-
|
749
|
-
|
750
|
-
|
751
|
-
|
752
|
-
|
753
|
-
|
754
|
-
|
755
|
-
|
756
|
-
|
757
|
-
|
758
|
-
|
759
|
-
|
760
|
-
|
761
|
-
|
762
|
-
|
763
|
-
|
764
|
-
|
765
|
-
|
766
|
-
|
767
|
-
|
768
|
-
|
769
|
-
|
770
|
-
|
809
|
+
var _a, _b, _c, _d, _e, _f, _g;
|
810
|
+
return __awaiter(this, void 0, void 0, function () {
|
811
|
+
var stylePromises, templatePromise, _h, i_1, it_6, _j, _k, _l, _m, _o, domrenderComponents, componentKey, attribute, renderScript, render, constructor, constructorParam, script, param, instance, i, normalAttrMap, onCreate, createParam, script, applayTemplate, innerHTMLThisRandom, componentName, innerHTMLName, oninit, script, style, data, template_1;
|
812
|
+
return __generator(this, function (_p) {
|
813
|
+
switch (_p.label) {
|
814
|
+
case 0:
|
815
|
+
stylePromises = [];
|
816
|
+
if (!(this.template && this.template.startsWith('lazy://'))) return [3 /*break*/, 2];
|
817
|
+
return [4 /*yield*/, fetch(this.template.substring(6))];
|
818
|
+
case 1:
|
819
|
+
_h = (_p.sent()).text();
|
820
|
+
return [3 /*break*/, 3];
|
821
|
+
case 2:
|
822
|
+
_h = Promise.resolve(this.template);
|
823
|
+
_p.label = 3;
|
824
|
+
case 3:
|
825
|
+
templatePromise = (_h);
|
826
|
+
i_1 = 0;
|
827
|
+
_p.label = 4;
|
828
|
+
case 4:
|
829
|
+
if (!(this.styles && i_1 < this.styles.length)) return [3 /*break*/, 9];
|
830
|
+
it_6 = this.styles[i_1];
|
831
|
+
_k = (_j = stylePromises).push;
|
832
|
+
if (!it_6.startsWith('lazy://')) return [3 /*break*/, 6];
|
833
|
+
return [4 /*yield*/, fetch(it_6.substring(6))];
|
834
|
+
case 5:
|
835
|
+
_l = (_p.sent()).text();
|
836
|
+
return [3 /*break*/, 7];
|
837
|
+
case 6:
|
838
|
+
_l = Promise.resolve(it_6);
|
839
|
+
_p.label = 7;
|
840
|
+
case 7:
|
841
|
+
_k.apply(_j, [_l]);
|
842
|
+
_p.label = 8;
|
843
|
+
case 8:
|
844
|
+
i_1++;
|
845
|
+
return [3 /*break*/, 4];
|
846
|
+
case 9:
|
847
|
+
// const templateResponse = await templatePromise;
|
848
|
+
// const styleResponses = await Promise.all(stylePromises);
|
849
|
+
_m = this;
|
850
|
+
return [4 /*yield*/, templatePromise];
|
851
|
+
case 10:
|
852
|
+
// const templateResponse = await templatePromise;
|
853
|
+
// const styleResponses = await Promise.all(stylePromises);
|
854
|
+
_m.template = _p.sent();
|
855
|
+
_o = this;
|
856
|
+
return [4 /*yield*/, Promise.all(stylePromises)];
|
857
|
+
case 11:
|
858
|
+
_o.styles = _p.sent();
|
859
|
+
// console.log('targetsub-22-', this.styles)
|
860
|
+
// console.log('targetsub-222-', this.template, this.styles)
|
861
|
+
// Promise.all(promises).then([])
|
862
|
+
// console.log('callback------->', element)
|
863
|
+
if (!obj.__domrender_components) {
|
864
|
+
obj.__domrender_components = {};
|
865
|
+
}
|
866
|
+
domrenderComponents = obj.__domrender_components;
|
867
|
+
componentKey = rawSet.uuid;
|
868
|
+
attribute = DomUtils_1.DomUtils.getAttributeToObject(element);
|
869
|
+
renderScript = 'var $component = this.__render.component; var $element = this.__render.element; var $router = this.__render.router; var $innerHTML = this.__render.innerHTML; var $attribute = this.__render.attribute; var $creatorMetaData = this.__render.creatorMetaData;';
|
870
|
+
render = Object.freeze({
|
871
|
+
renderScript: renderScript,
|
872
|
+
element: element,
|
873
|
+
innerHTML: element.innerHTML,
|
874
|
+
attribute: attribute,
|
875
|
+
rawset: rawSet,
|
876
|
+
router: config.router,
|
877
|
+
componentKey: componentKey,
|
878
|
+
scripts: EventManager_1.EventManager.setBindProperty((_a = config.scripts) !== null && _a !== void 0 ? _a : {}, obj)
|
879
|
+
// eslint-disable-next-line no-use-before-define
|
880
|
+
});
|
881
|
+
constructor = element.getAttribute(RawSet.DR_ON_CONSTRUCTOR_ARGUMENTS_OPTIONNAME);
|
882
|
+
constructorParam = [];
|
883
|
+
// dr-constructor
|
884
|
+
if (constructor) {
|
885
|
+
script = "".concat(renderScript, " return ").concat(constructor, " ");
|
886
|
+
param = (_b = ScriptUtils_1.ScriptUtils.eval(script, Object.assign(obj, { __render: render }))) !== null && _b !== void 0 ? _b : [];
|
887
|
+
if (!Array.isArray(param)) {
|
888
|
+
param = [param];
|
889
|
+
}
|
890
|
+
constructorParam = param;
|
891
|
+
}
|
892
|
+
// console.log('------22', attrs);
|
893
|
+
domrenderComponents[componentKey] = objFactory(element, obj, rawSet, constructorParam);
|
894
|
+
instance = domrenderComponents[componentKey];
|
895
|
+
i = instance.__domrender_component_new = ((_c = instance.__domrender_component_new) !== null && _c !== void 0 ? _c : new Proxy({}, new Types_1.DomRenderFinalProxy()));
|
896
|
+
i.thisVariableName = rawSet.point.thisVariableName;
|
897
|
+
i.thisFullVariableName = "this.__domrender_components.".concat(componentKey);
|
898
|
+
i.componentKey = componentKey;
|
899
|
+
i.rawSet = rawSet;
|
900
|
+
i.attribute = attribute;
|
901
|
+
i.router = config.router;
|
902
|
+
i.scripts = render.scripts;
|
903
|
+
i.drAttrs = attrs;
|
904
|
+
i.innerHTML = element.innerHTML;
|
905
|
+
i.rootCreator = new Proxy(obj, new Types_1.DomRenderFinalProxy());
|
906
|
+
i.creator = new Proxy(rawSet.point.thisVariableName ? ScriptUtils_1.ScriptUtils.evalReturn(rawSet.point.thisVariableName, obj) : obj, new Types_1.DomRenderFinalProxy());
|
907
|
+
this.__creatorMetaData = i;
|
908
|
+
render = __assign({ component: instance, creatorMetaData: i }, render);
|
909
|
+
normalAttrMap = element.getAttribute(EventManager_1.EventManager.normalAttrMapAttrName);
|
910
|
+
if (instance.onChangeAttrRender && normalAttrMap) {
|
911
|
+
new Map(JSON.parse(normalAttrMap)).forEach(function (value, key) {
|
912
|
+
var script = "".concat(renderScript, " return ").concat(value, " ");
|
913
|
+
var cval = ScriptUtils_1.ScriptUtils.eval(script, Object.assign(obj, { __render: render }));
|
914
|
+
// element.setAttribute(key, cval);
|
915
|
+
instance.onChangeAttrRender(key, cval);
|
916
|
+
});
|
917
|
+
}
|
918
|
+
onCreate = element.getAttribute(RawSet.DR_ON_CREATE_ARGUMENTS_OPTIONNAME);
|
919
|
+
this.__render = render;
|
920
|
+
createParam = [];
|
921
|
+
if (onCreate) {
|
922
|
+
script = "".concat(renderScript, " return ").concat(onCreate, " ");
|
923
|
+
createParam = ScriptUtils_1.ScriptUtils.eval(script, Object.assign(obj, { __render: render }));
|
924
|
+
if (!Array.isArray(createParam)) {
|
925
|
+
createParam = [createParam];
|
926
|
+
}
|
927
|
+
}
|
928
|
+
(_d = instance === null || instance === void 0 ? void 0 : instance.onCreateRender) === null || _d === void 0 ? void 0 : _d.call.apply(_d, __spreadArray([instance], createParam, false));
|
929
|
+
applayTemplate = element.innerHTML;
|
930
|
+
componentName = (_e = element.getAttribute(RawSet.DR_COMPONENT_NAME_OPTIONNAME)) !== null && _e !== void 0 ? _e : 'component';
|
931
|
+
innerHTMLName = (_f = element.getAttribute(RawSet.DR_COMPONENT_INNER_HTML_NAME_OPTIONNAME)) !== null && _f !== void 0 ? _f : 'innerHTML';
|
932
|
+
if (applayTemplate) {
|
933
|
+
// if (rawSet.point.thisVariableName) {
|
934
|
+
// 넘어온 innerHTML에 this가 있으면 해당안되게 우선 치환.
|
935
|
+
innerHTMLThisRandom = RandomUtils_1.RandomUtils.uuid();
|
936
|
+
applayTemplate = applayTemplate.replace(/this\./g, innerHTMLThisRandom);
|
937
|
+
// }
|
938
|
+
applayTemplate = applayTemplate.replace(RegExp("#".concat(componentName, "#"), 'g'), 'this');
|
939
|
+
}
|
940
|
+
// applayTemplate = template.replace(RegExp(`#${innerHTMLName}#`, 'g'), applayTemplate);
|
941
|
+
applayTemplate = ((_g = this.template) !== null && _g !== void 0 ? _g : '').replace(RegExp("#".concat(innerHTMLName, "#"), 'g'), applayTemplate);
|
942
|
+
oninit = element.getAttribute(RawSet.DR_ON_CREATED_CALLBACK_OPTIONNAME);
|
943
|
+
if (oninit) {
|
944
|
+
script = "".concat(renderScript, " ").concat(oninit, " ");
|
945
|
+
ScriptUtils_1.ScriptUtils.eval(script, Object.assign(obj, {
|
946
|
+
__render: render
|
947
|
+
}));
|
948
|
+
}
|
949
|
+
style = RawSet.generateStyleTransform(this.styles, componentKey, true);
|
950
|
+
element.innerHTML = style + (applayTemplate !== null && applayTemplate !== void 0 ? applayTemplate : '');
|
951
|
+
return [4 /*yield*/, RawSet.drThisCreate(rawSet, element, "this.__domrender_components.".concat(componentKey), '', true, obj, config)];
|
952
|
+
case 12:
|
953
|
+
data = _p.sent();
|
954
|
+
// 넘어온 innerHTML에 this가 있는걸 다시 복호화해서 제대로 작동하도록한다.
|
955
|
+
if (innerHTMLThisRandom) {
|
956
|
+
template_1 = config.window.document.createElement('template');
|
957
|
+
template_1.content.append(data);
|
958
|
+
template_1.innerHTML = template_1.innerHTML.replace(RegExp(innerHTMLThisRandom, 'g'), 'this.');
|
959
|
+
data = template_1.content;
|
960
|
+
}
|
961
|
+
data.render = render;
|
962
|
+
return [2 /*return*/, data];
|
963
|
+
}
|
771
964
|
});
|
772
|
-
}
|
773
|
-
// dr-on-create onCreateRender
|
774
|
-
var onCreate = element.getAttribute(RawSet.DR_ON_CREATE_ARGUMENTS_OPTIONNAME);
|
775
|
-
this.__render = render;
|
776
|
-
var createParam = [];
|
777
|
-
if (onCreate) {
|
778
|
-
var script = "".concat(renderScript, " return ").concat(onCreate, " ");
|
779
|
-
createParam = ScriptUtils_1.ScriptUtils.eval(script, Object.assign(obj, { __render: render }));
|
780
|
-
if (!Array.isArray(createParam)) {
|
781
|
-
createParam = [createParam];
|
782
|
-
}
|
783
|
-
}
|
784
|
-
(_d = instance === null || instance === void 0 ? void 0 : instance.onCreateRender) === null || _d === void 0 ? void 0 : _d.call.apply(_d, __spreadArray([instance], createParam, false));
|
785
|
-
var applayTemplate = element.innerHTML;
|
786
|
-
var innerHTMLThisRandom;
|
787
|
-
var componentName = (_e = element.getAttribute(RawSet.DR_COMPONENT_NAME_OPTIONNAME)) !== null && _e !== void 0 ? _e : 'component';
|
788
|
-
var innerHTMLName = (_f = element.getAttribute(RawSet.DR_COMPONENT_INNER_HTML_NAME_OPTIONNAME)) !== null && _f !== void 0 ? _f : 'innerHTML';
|
789
|
-
if (applayTemplate) {
|
790
|
-
// if (rawSet.point.thisVariableName) {
|
791
|
-
// 넘어온 innerHTML에 this가 있으면 해당안되게 우선 치환.
|
792
|
-
innerHTMLThisRandom = RandomUtils_1.RandomUtils.uuid();
|
793
|
-
applayTemplate = applayTemplate.replace(/this\./g, innerHTMLThisRandom);
|
794
|
-
// }
|
795
|
-
applayTemplate = applayTemplate.replace(RegExp("#".concat(componentName, "#"), 'g'), 'this');
|
796
|
-
}
|
797
|
-
applayTemplate = template.replace(RegExp("#".concat(innerHTMLName, "#"), 'g'), applayTemplate);
|
798
|
-
// dr-on-component-init
|
799
|
-
// const oninit = element.getAttribute(`${EventManager.attrPrefix}on-component-init`); // dr-on-component-init
|
800
|
-
var oninit = element.getAttribute(RawSet.DR_ON_CREATED_CALLBACK_OPTIONNAME); // dr-on-component-init
|
801
|
-
if (oninit) {
|
802
|
-
var script = "".concat(renderScript, " ").concat(oninit, " ");
|
803
|
-
ScriptUtils_1.ScriptUtils.eval(script, Object.assign(obj, {
|
804
|
-
__render: render
|
805
|
-
}));
|
806
|
-
}
|
807
|
-
var style = RawSet.generateStyleTransform(styles, componentKey, true);
|
808
|
-
element.innerHTML = style + (applayTemplate !== null && applayTemplate !== void 0 ? applayTemplate : '');
|
809
|
-
// const metaStart = RawSet.metaStart(componentKey);
|
810
|
-
// const metaEnd = RawSet.metaEnd(componentKey);
|
811
|
-
// element.innerHTML = metaStart + style + (applayTemplate ?? '') + metaEnd;
|
812
|
-
// console.log('------>', element.innerHTML, obj)
|
813
|
-
var data = RawSet.drThisCreate(rawSet, element, "this.__domrender_components.".concat(componentKey), '', true, obj, config);
|
814
|
-
// 넘어온 innerHTML에 this가 있는걸 다시 복호화해서 제대로 작동하도록한다.
|
815
|
-
if (innerHTMLThisRandom) {
|
816
|
-
var template_1 = config.window.document.createElement('template');
|
817
|
-
template_1.content.append(data);
|
818
|
-
template_1.innerHTML = template_1.innerHTML.replace(RegExp(innerHTMLThisRandom, 'g'), 'this.');
|
819
|
-
data = template_1.content;
|
820
|
-
}
|
821
|
-
data.render = render;
|
822
|
-
return data;
|
965
|
+
});
|
823
966
|
}
|
824
967
|
// complete
|
825
968
|
};
|
@@ -855,7 +998,7 @@ var RawSet = /** @class */ (function () {
|
|
855
998
|
}
|
856
999
|
}
|
857
1000
|
};
|
858
|
-
RawSet.
|
1001
|
+
RawSet.DR_NAME = 'dr';
|
859
1002
|
RawSet.DR_IF_NAME = 'dr-if';
|
860
1003
|
RawSet.DR_FOR_NAME = 'dr-for';
|
861
1004
|
RawSet.DR_FOR_OF_NAME = 'dr-for-of';
|
@@ -882,7 +1025,7 @@ var RawSet = /** @class */ (function () {
|
|
882
1025
|
RawSet.DR_ON_INIT_ARGUMENTS_OPTIONNAME = 'dr-on-init:arguments';
|
883
1026
|
RawSet.DR_ON_CONSTRUCTOR_ARGUMENTS_OPTIONNAME = 'dr-on-constructor:arguments';
|
884
1027
|
RawSet.drAttrsOriginName = {
|
885
|
-
dr: RawSet.
|
1028
|
+
dr: RawSet.DR_NAME,
|
886
1029
|
drIf: RawSet.DR_IF_NAME,
|
887
1030
|
drFor: RawSet.DR_FOR_NAME,
|
888
1031
|
drForOf: RawSet.DR_FOR_OF_NAME,
|
@@ -903,7 +1046,7 @@ var RawSet = /** @class */ (function () {
|
|
903
1046
|
drDestroyOption: RawSet.DR_DESTROY_OPTIONNAME
|
904
1047
|
};
|
905
1048
|
RawSet.DR_TAGS = [];
|
906
|
-
RawSet.DR_ATTRIBUTES = [RawSet.
|
1049
|
+
RawSet.DR_ATTRIBUTES = [RawSet.DR_NAME, RawSet.DR_APPENDER_NAME, RawSet.DR_IF_NAME, RawSet.DR_FOR_OF_NAME, RawSet.DR_FOR_NAME, RawSet.DR_THIS_NAME, RawSet.DR_FORM_NAME, RawSet.DR_PRE_NAME, RawSet.DR_INNERHTML_NAME, RawSet.DR_INNERTEXT_NAME, RawSet.DR_REPEAT_NAME, RawSet.DR_DETECT_NAME];
|
907
1050
|
return RawSet;
|
908
1051
|
}());
|
909
1052
|
exports.RawSet = RawSet;
|