Skip to content

Commit 66c0d64

Browse files
committed
version 3.2.0-alpha.45
1 parent 1e6c600 commit 66c0d64

File tree

9 files changed

+115
-96
lines changed

9 files changed

+115
-96
lines changed

package.json

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "cample",
3-
"version": "3.2.0-alpha.44",
3+
"version": "3.2.0-alpha.45",
44
"description": "Cample.js - fast modern javascript framework. Reactivity without virtual DOM!",
55
"main": "dist/index.js",
66
"types": "dist/index.d.ts",

src/core/cample.ts

+10-2
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,7 @@ import {
88
} from "../types/types";
99
import { renderTemplate } from "./functions/render/render-template";
1010
import { checkFunction, getExportData } from "../shared/utils";
11-
import { CLICK_FUNCTION_NAME } from "../config/config";
11+
import { CLICK_FUNCTION_NAME, EACH_INDEX_NAME } from "../config/config";
1212

1313
export class Cample {
1414
public selector: SelectorType;
@@ -43,12 +43,20 @@ export class Cample {
4343
current.composedPath !== undefined
4444
? current.composedPath()[0]
4545
: current.target;
46+
let isItemEvent: true | undefined = undefined;
4647
while (node !== null) {
4748
const eventListener = node[CLICK_FUNCTION_NAME];
4849
if (eventListener !== undefined && !node.disabled) {
49-
eventListener(current);
50+
eventListener[0](current);
51+
if (eventListener[1] !== undefined) isItemEvent = true;
5052
if (current.cancelBubble) return;
5153
}
54+
if (
55+
isItemEvent !== undefined &&
56+
node[EACH_INDEX_NAME] !== undefined
57+
) {
58+
return;
59+
}
5260
node = node.parentNode;
5361
}
5462
};

src/core/components/component/component.ts

+74-75
Original file line numberDiff line numberDiff line change
@@ -137,11 +137,12 @@ export class Component extends DataComponent {
137137
isDataFunction?: boolean
138138
) => {
139139
const data = renderDynamicData(importData, isDataFunction);
140+
const dynamicIndex = this._dynamic.data.data.values.length;
140141
const dynamicData = {
141142
value: data,
142-
id
143+
id,
144+
index: dynamicIndex
143145
};
144-
const dynamicIndex = this._dynamic.data.data.values.length;
145146
this._dynamic.data.data.values.push(dynamicData);
146147
return this._dynamic.data.data.values[dynamicIndex];
147148
};
@@ -163,7 +164,12 @@ export class Component extends DataComponent {
163164
}
164165
};
165166
const renderNewFunction = this._isDataFunctions
166-
? (id: IdType, index: number, data: any) => {
167+
? (
168+
id: IdType,
169+
index: number,
170+
data: any,
171+
currentComponent: ComponentDynamicNodeComponentType
172+
) => {
167173
try {
168174
renderDynamicNodes(index, data);
169175
} catch (err) {
@@ -174,7 +180,7 @@ export class Component extends DataComponent {
174180
id,
175181
this._objDataFuntions,
176182
index,
177-
false
183+
currentComponent
178184
);
179185
}
180186
: () => {
@@ -195,12 +201,11 @@ export class Component extends DataComponent {
195201
) => {
196202
if (id !== undefined) {
197203
if (data !== undefined) {
198-
const dataIndex = data;
199204
const val = data!.value!;
200205
const currentData = data.value;
201-
if (checkObject(dataIndex) && val[key] !== undefined) {
206+
if (checkObject(data) && val[key] !== undefined) {
202207
val[key] = attribute;
203-
renderNewFunction(id, index, currentData);
208+
renderNewFunction(id, index, currentData, currentComponent);
204209
renderDynamicExportData(
205210
currentComponent,
206211
currentIndex,
@@ -212,7 +217,7 @@ export class Component extends DataComponent {
212217
if (this.data && key && this.data[key]) {
213218
const currentData = data !== undefined ? data.value : undefined;
214219
this.data[key] = attribute;
215-
renderNewFunction(id, index, currentData);
220+
renderNewFunction(id, index, currentData, currentComponent);
216221
}
217222
}
218223
};
@@ -254,8 +259,10 @@ export class Component extends DataComponent {
254259
functions: FunctionsType
255260
) => {
256261
const renderNewData = (value: any) => {
257-
const val = renderComponentDynamicKeyData(data, value, false, value);
258-
return val;
262+
const { dynamicKey, renderDynamicKeyData } = value;
263+
const firstKeyData = data[dynamicKey];
264+
const newData = renderDynamicKeyData(firstKeyData);
265+
return newData;
259266
};
260267
const newObj: ExportTemplateDataType = {
261268
data: {},
@@ -291,7 +298,6 @@ export class Component extends DataComponent {
291298
functions: FunctionsType
292299
) => {
293300
const renderNewData = (value: string) => {
294-
// const values = getValues(index);
295301
const val = renderComponentDynamicKeyData(
296302
getData(this._dynamic.data.data.values, index),
297303
value
@@ -542,57 +548,44 @@ export class Component extends DataComponent {
542548
key: string,
543549
id: IdType,
544550
index: number,
545-
isRender: boolean = false
551+
component: ComponentDynamicNodeComponentType
546552
) => {
547553
const updateData = (attr = getDefaultData(id, key)) => {
548554
return attr;
549555
};
550-
const component = getComponent(index);
551-
if (component.dataFunctions[name] !== undefined && isRender) {
552-
createError("Function name is unique");
553-
} else {
554-
component.dataFunctions[name] = (attribute: any = updateData) => {
555-
let data: any = undefined;
556-
let currentIndex = -1;
557-
for (let i = 0; i < this._dynamic.data.data.values.length; i++) {
558-
const e = this._dynamic.data.data.values[i];
559-
if (e !== undefined && e.id === id) {
560-
data = e;
561-
currentIndex = i;
562-
break;
563-
}
564-
}
565-
if (typeof attribute === "function") {
566-
const defaultData =
567-
id !== undefined
568-
? data !== undefined && data.value
569-
? data.value[key]
570-
: undefined
571-
: this.data && this.data[key]
572-
? this.data[key]
573-
: undefined;
574-
newFunction(
575-
attribute(defaultData),
576-
key,
577-
id,
578-
index,
579-
component,
580-
currentIndex,
581-
data
582-
);
583-
} else {
584-
newFunction(
585-
attribute,
586-
key,
587-
id,
588-
index,
589-
component,
590-
currentIndex,
591-
data
592-
);
593-
}
594-
};
595-
}
556+
component.dataFunctions[name] = (attribute: any = updateData) => {
557+
const { value: data } = component;
558+
const { index: currentIndex } = data;
559+
if (typeof attribute === "function") {
560+
const defaultData =
561+
id !== undefined
562+
? data !== undefined && data.value
563+
? data.value[key]
564+
: undefined
565+
: this.data && this.data[key]
566+
? this.data[key]
567+
: undefined;
568+
newFunction(
569+
attribute(defaultData),
570+
key,
571+
id,
572+
index,
573+
component,
574+
currentIndex as number,
575+
data
576+
);
577+
} else {
578+
newFunction(
579+
attribute,
580+
key,
581+
id,
582+
index,
583+
component,
584+
currentIndex as number,
585+
data
586+
);
587+
}
588+
};
596589
};
597590
const renderScriptsAndStyles = (
598591
e: Element | null,
@@ -648,12 +641,14 @@ export class Component extends DataComponent {
648641
};
649642
const setDynamicNodeComponentType = (
650643
dataId: number,
651-
importObject: ImportObjectType | undefined
644+
importObject: ImportObjectType | undefined,
645+
value: DynamicDataType
652646
) => {
653647
const DynamicNodeComponent = createComponentDynamicNodeComponentType(
654648
dataId,
655649
getExportObject(dataId),
656-
importObject
650+
importObject,
651+
value
657652
);
658653
this._dynamic.data.data.components.push(DynamicNodeComponent);
659654
return DynamicNodeComponent;
@@ -932,23 +927,27 @@ export class Component extends DataComponent {
932927
renderScriptsAndStyles(el, "afterLoad", importData, index)
933928
);
934929
const currentId = this._dynamic.data.data.currentId;
935-
const data = setData(
936-
currentId,
937-
importData,
938-
this._isDataFunction
939-
)?.value;
930+
const value = setData(currentId, importData, this._isDataFunction);
931+
const data = value?.value;
932+
const currentComponent: ComponentDynamicNodeComponentType =
933+
setDynamicNodeComponentType(index, importObject, value);
940934
const setDataFunctions = () => {
941935
if (this._isDataFunctions)
942-
renderFunctionsData(
943-
updateFunction,
944-
this._dynamic.data.data.currentId,
945-
this._objDataFuntions,
946-
index,
947-
true
948-
);
936+
for (let i = 0; i < this._objDataFuntions.length; i++) {
937+
const { key, value } = this._objDataFuntions[i];
938+
if (currentComponent.dataFunctions[key] !== undefined) {
939+
createError("functionName is unique");
940+
} else {
941+
updateFunction(
942+
key,
943+
value,
944+
this._dynamic.data.data.currentId,
945+
index,
946+
currentComponent
947+
);
948+
}
949+
}
949950
};
950-
const currentComponent: ComponentDynamicNodeComponentType =
951-
setDynamicNodeComponentType(index, importObject);
952951
const runRenderFunction = () =>
953952
renderFunctions(
954953
currentComponent.functions,
@@ -1032,7 +1031,7 @@ export class Component extends DataComponent {
10321031
undefined,
10331032
this._objDataFuntions,
10341033
index,
1035-
true
1034+
currentComponent
10361035
);
10371036
}
10381037
renderHTML(e, el, functionsArray, "component");

src/core/components/each/each.ts

-2
Original file line numberDiff line numberDiff line change
@@ -721,7 +721,6 @@ export class Each extends DataComponent {
721721
key: string,
722722
dataId: IdType,
723723
index: number,
724-
_: boolean = false,
725724
currentComponent?: EachDynamicNodeComponentType
726725
) => {
727726
const updateData = (attr = getDefaultData(dataId)) => {
@@ -876,7 +875,6 @@ export class Each extends DataComponent {
876875
dataId,
877876
objDataFunctions,
878877
index,
879-
undefined,
880878
currentComponent
881879
);
882880
}
Original file line numberDiff line numberDiff line change
@@ -1,14 +1,16 @@
11
"use strict";
22
import {
33
ComponentDynamicNodeComponentType,
4+
DynamicDataType,
45
ExportObjectDataType,
56
ImportObjectType
67
} from "../../../types/types";
78

89
export const createComponentDynamicNodeComponentType = (
910
dataId: number,
1011
exportObject: ExportObjectDataType | undefined,
11-
currentImport: ImportObjectType | undefined
12+
currentImport: ImportObjectType | undefined,
13+
value: DynamicDataType
1214
): ComponentDynamicNodeComponentType => {
1315
const DynamicNodeComponentType: ComponentDynamicNodeComponentType = {
1416
id: dataId,
@@ -17,7 +19,8 @@ export const createComponentDynamicNodeComponentType = (
1719
nodes: [],
1820
exportData: undefined,
1921
import: currentImport,
20-
exportObject
22+
exportObject,
23+
value
2124
};
2225
return DynamicNodeComponentType;
2326
};

src/core/functions/parse/parse-template.ts

+14-6
Original file line numberDiff line numberDiff line change
@@ -311,7 +311,8 @@ export const parseTemplate = (
311311
getEventsFunction,
312312
renderedKey,
313313
id,
314-
key
314+
key,
315+
isItemEvent
315316
} of eventArray) {
316317
const fn = (getEventsFunction as EventEachGetFunctionType)?.(
317318
renderedKey.key,
@@ -322,6 +323,13 @@ export const parseTemplate = (
322323
if (!checkFunction(fn)) createError("Data key is of function type");
323324
let setEvent: any;
324325
const argsLength = args.length;
326+
const setClickEvent = isItemEvent
327+
? (element: Element, eventFn: (event: Event) => void) => {
328+
element[CLICK_FUNCTION_NAME] = [eventFn, true];
329+
}
330+
: (element: Element, eventFn: (event: Event) => void) => {
331+
element[CLICK_FUNCTION_NAME] = [eventFn];
332+
};
325333
if (isEach === true) {
326334
if (keyEvent === "click") {
327335
if (argsLength > 0) {
@@ -344,7 +352,7 @@ export const parseTemplate = (
344352
);
345353
fn(event)(newArg);
346354
};
347-
element[CLICK_FUNCTION_NAME] = eventFn;
355+
setClickEvent(element, eventFn);
348356
}
349357
};
350358
} else {
@@ -369,7 +377,7 @@ export const parseTemplate = (
369377
}
370378
fn(event)(...newArgs);
371379
};
372-
element[CLICK_FUNCTION_NAME] = eventFn;
380+
setClickEvent(element, eventFn);
373381
}
374382
};
375383
}
@@ -385,7 +393,7 @@ export const parseTemplate = (
385393
const eventFn = (event: Event) => {
386394
fn(event)();
387395
};
388-
element[CLICK_FUNCTION_NAME] = eventFn;
396+
setClickEvent(element, eventFn);
389397
}
390398
};
391399
}
@@ -471,7 +479,7 @@ export const parseTemplate = (
471479
const newArgs = args.map((e: any) => getEventsData1(e, id));
472480
fn(event)(...newArgs);
473481
};
474-
element[CLICK_FUNCTION_NAME] = eventFn;
482+
setClickEvent(element, eventFn);
475483
}
476484
};
477485
} else {
@@ -486,7 +494,7 @@ export const parseTemplate = (
486494
const eventFn = (event: Event) => {
487495
fn(event)();
488496
};
489-
element[CLICK_FUNCTION_NAME] = eventFn;
497+
setClickEvent(element, eventFn);
490498
}
491499
};
492500
}

0 commit comments

Comments
 (0)