@cocreate/elements 1.37.1 → 1.38.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (6) hide show
  1. package/CHANGELOG.md +21 -0
  2. package/docs/index.html +330 -328
  3. package/package.json +1 -1
  4. package/prettier.config.js +16 -0
  5. package/src/form.js +166 -150
  6. package/src/index.js +1392 -1295
package/src/index.js CHANGED
@@ -22,15 +22,23 @@
22
22
  * For details, visit <https://cocreate.app/licenses/> or contact us at sales@cocreate.app.
23
23
  */
24
24
 
25
- import Observer from '@cocreate/observer';
26
- import Actions from '@cocreate/actions';
27
- import CRUD from '@cocreate/crud-client';
28
- import { dotNotationToObject, queryElements, queryData, sortData, getAttributes, getAttributeNames, checkValue } from '@cocreate/utils';
29
- import filter from '@cocreate/filter';
30
- import { render, renderValue, renderedNodes } from '@cocreate/render';
31
- import '@cocreate/element-prototype';
32
- import './fetchSrc';
33
- import { reset } from './form'
25
+ import Observer from "@cocreate/observer";
26
+ import Actions from "@cocreate/actions";
27
+ import CRUD from "@cocreate/crud-client";
28
+ import {
29
+ dotNotationToObject,
30
+ queryElements,
31
+ queryData,
32
+ sortData,
33
+ getAttributes,
34
+ getAttributeNames,
35
+ checkValue
36
+ } from "@cocreate/utils";
37
+ import filter from "@cocreate/filter";
38
+ import { render, renderValue, renderedNodes } from "@cocreate/render";
39
+ import "@cocreate/element-prototype";
40
+ import "./fetchSrc";
41
+ import { reset } from "./form";
34
42
 
35
43
  const selector = "[storage], [database], [array], [render-json]";
36
44
  const elements = new Map();
@@ -39,1389 +47,1478 @@ const forms = new Map();
39
47
  const debounce = new Map();
40
48
 
41
49
  /**
42
- * Initializes elements with specific CRUD attributes. If no parameter is provided, it queries and initializes all elements
50
+ * Initializes elements with specific CRUD attributes. If no parameter is provided, it queries and initializes all elements
43
51
  * that have certain CRUD-related attributes. It can also initialize a single element or an array of elements.
44
- *
52
+ *
45
53
  * Attributes used for initialization are:
46
54
  * - storage: Specifies the storage mechanism.
47
55
  * - database: Indicates the database to interact with.
48
56
  * - array: Defines the array to be used.
49
57
  * - render-json: Determines how JSON data is rendered.
50
- *
51
- * @param {(Element|Element[])} [elements] - Optional. A single element or an array of elements to initialize.
52
- * If omitted, the function queries and initializes all elements containing
58
+ *
59
+ * @param {(Element|Element[])} [elements] - Optional. A single element or an array of elements to initialize.
60
+ * If omitted, the function queries and initializes all elements containing
53
61
  * any of these CRUD attributes: "storage", "database", "array", "render-json".
54
62
  */
55
63
  async function init(element) {
56
- if (element && !(element instanceof HTMLCollection) && !(element instanceof NodeList) && !Array.isArray(element))
57
- element = [element]
58
- else if (!element) {
59
- element = document.querySelectorAll(selector)
60
- initSocket();
61
- }
62
-
63
- let dataObjects = new Map();
64
- for (let i = 0; i < element.length; i++) {
65
- if (elements.has(element[i]) || element[i].tagName === 'FORM' || element[i].getAttribute('crud') === 'false')
66
- continue
67
-
68
- let data = await initElement(element[i]);
69
- if (data) {
70
- let dataKey = initDataKey(element[i], data)
71
- dataObjects.set(dataKey.string, data)
72
- }
73
- }
74
-
75
- if (dataObjects && dataObjects.size > 0) {
76
- for (let key of dataObjects.keys()) {
77
- let { data, elements } = keys.get(key)
78
- read(Array.from(elements.keys()), data, { string: key });
79
- }
80
- }
81
-
82
- // const evt = new CustomEvent('elementsInitialized', { bubbles: true });
83
- // document.dispatchEvent(evt);
84
-
64
+ if (
65
+ element &&
66
+ !(element instanceof HTMLCollection) &&
67
+ !(element instanceof NodeList) &&
68
+ !Array.isArray(element)
69
+ )
70
+ element = [element];
71
+ else if (!element) {
72
+ element = document.querySelectorAll(selector);
73
+ initSocket();
74
+ }
75
+
76
+ let dataObjects = new Map();
77
+ for (let i = 0; i < element.length; i++) {
78
+ if (
79
+ elements.has(element[i]) ||
80
+ element[i].tagName === "FORM" ||
81
+ element[i].getAttribute("crud") === "false"
82
+ )
83
+ continue;
84
+
85
+ let data = await initElement(element[i]);
86
+ if (data) {
87
+ let dataKey = initDataKey(element[i], data);
88
+ dataObjects.set(dataKey.string, data);
89
+ }
90
+ }
91
+
92
+ if (dataObjects && dataObjects.size > 0) {
93
+ for (let key of dataObjects.keys()) {
94
+ let { data, elements } = keys.get(key);
95
+ read(Array.from(elements.keys()), data, { string: key });
96
+ }
97
+ }
98
+
99
+ // const evt = new CustomEvent('elementsInitialized', { bubbles: true });
100
+ // document.dispatchEvent(evt);
85
101
  }
86
102
 
87
103
  async function initElement(el) {
88
- let data = getObject(el);
89
- if (!data || !data.type)
90
- return
91
-
92
- if (data.object && data.object !== 'pending' && !(/^[0-9a-fA-F]{24}$/.test(data.object)))
93
- return
94
-
95
- if (!elements.has(el)) {
96
- elements.set(el, '')
97
-
98
- if (!el.elementsInputEvent) {
99
- el.elementsInputEvent = true;
100
-
101
- if (['INPUT', 'TEXTAREA', 'SELECT'].includes(el.tagName)
102
- || (el.hasAttribute('contenteditable') && el.getAttribute('contenteditable') !== 'false')
103
- || el.contenteditable) {
104
-
105
- if (el.tagName == 'IFRAME') {
106
- // ToDo: saving on contenteditable elements when an objectId does not exist in order to crud or crdt
107
- el = el.contentDocument.documentElement
108
- el.setAttribute('contenteditable', 'true')
109
-
110
- }
111
-
112
- el.addEventListener('input', function (e) {
113
- if (el.pendingObject) return
114
-
115
- const { object, key, isRealtime, isCrdt } = getAttributes(el);
116
- if (!isRealtime || isRealtime === "false" || key === "_id") return;
117
- if (isCrdt == "true" && object && object !== 'pending') return
118
- if (e.detail && e.detail.skip == true) return;
119
- if (data.type !== 'object' && data[data.type] === 'pending') return
120
-
121
- save(el);
122
- });
123
- }
124
- }
125
- }
126
- // let attributes = ['filter-key', 'filter-search', 'filter-sort-key', 'filter-on', 'filter-limit']
127
- // if (el.getFilter || attributes.some(attr => el.hasAttribute(attr))) {
128
-
129
- await filter.init()
130
- if (el.getFilter) {
131
- data.$filter = await el.getFilter();
132
-
133
- el.setFilter = (filter) => {
134
- data.$filter = filter
135
- el.hasRead = false
136
- // let dataKey = initDataKey(el, data)
137
- read(el, data)
138
- }
139
- }
140
-
141
- return data;
104
+ let data = getObject(el);
105
+ if (!data || !data.type) return;
106
+
107
+ if (
108
+ data.object &&
109
+ data.object !== "pending" &&
110
+ !/^[0-9a-fA-F]{24}$/.test(data.object)
111
+ )
112
+ return;
113
+
114
+ if (!elements.has(el)) {
115
+ elements.set(el, "");
116
+
117
+ if (!el.elementsInputEvent) {
118
+ el.elementsInputEvent = true;
119
+
120
+ if (
121
+ ["INPUT", "TEXTAREA", "SELECT"].includes(el.tagName) ||
122
+ (el.hasAttribute("contenteditable") &&
123
+ el.getAttribute("contenteditable") !== "false") ||
124
+ el.contenteditable
125
+ ) {
126
+ if (el.tagName == "IFRAME") {
127
+ // ToDo: saving on contenteditable elements when an objectId does not exist in order to crud or crdt
128
+ el = el.contentDocument.documentElement;
129
+ el.setAttribute("contenteditable", "true");
130
+ }
131
+
132
+ el.addEventListener("input", function (e) {
133
+ if (el.pendingObject) return;
134
+
135
+ const { object, key, isRealtime, isCrdt } =
136
+ getAttributes(el);
137
+ if (!isRealtime || isRealtime === "false" || key === "_id")
138
+ return;
139
+ if (isCrdt == "true" && object && object !== "pending")
140
+ return;
141
+ if (e.detail && e.detail.skip == true) return;
142
+ if (data.type !== "object" && data[data.type] === "pending")
143
+ return;
144
+
145
+ save(el);
146
+ });
147
+ }
148
+ }
149
+ }
150
+ // let attributes = ['filter-key', 'filter-search', 'filter-sort-key', 'filter-on', 'filter-limit']
151
+ // if (el.getFilter || attributes.some(attr => el.hasAttribute(attr))) {
152
+
153
+ await filter.init();
154
+ if (el.getFilter) {
155
+ data.$filter = await el.getFilter();
156
+
157
+ el.setFilter = (filter) => {
158
+ data.$filter = filter;
159
+ el.hasRead = false;
160
+ // let dataKey = initDataKey(el, data)
161
+ read(el, data);
162
+ };
163
+ }
164
+
165
+ return data;
142
166
  }
143
167
 
144
168
  function getObject(element) {
145
- const data = getAttributes(element);
146
- const crudType = ['storage', 'database', 'array', 'index', 'object']
147
-
148
- for (let i = 0; i < crudType.length; i++) {
149
- if (!checkValue(data[crudType[i]]))
150
- return
151
-
152
- if (data[crudType[i]] && data[crudType[i]].includes(",")) {
153
- const array = data[crudType[i]].split(',');
154
- data[crudType[i]] = []
155
-
156
- for (let j = 0; j < array.length; j++) {
157
- array[j].trim()
158
- if (crudType[i] === 'object') {
159
- data[crudType[i]].push({ _id: array[j] })
160
- } else {
161
- data[crudType[i]].push(array[j])
162
- }
163
- }
164
- }
165
- }
166
-
167
- if (data.object || data.object === '' || data.key || data.key === '') {
168
- if (!data.array || data.array && !data.array.length) return
169
- data.type = 'object'
170
- } else if (data.index || data.index === '') {
171
- if (!data.array || data.array && !data.array.length) return
172
- data.type = 'index'
173
- } else if (data.array || data.array === '')
174
- data.type = 'array'
175
- else if (data.database || data.database === '')
176
- data.type = 'database'
177
- else if (data.storage || data.storage === '')
178
- data.type = 'storage'
179
- else if (data.data)
180
- data.type = 'data'
181
-
182
- delete data.isRealtime
183
- return data
169
+ const data = getAttributes(element);
170
+ const crudType = ["storage", "database", "array", "index", "object"];
171
+
172
+ for (let i = 0; i < crudType.length; i++) {
173
+ if (!checkValue(data[crudType[i]])) return;
174
+
175
+ if (data[crudType[i]] && data[crudType[i]].includes(",")) {
176
+ const array = data[crudType[i]].split(",");
177
+ data[crudType[i]] = [];
178
+
179
+ for (let j = 0; j < array.length; j++) {
180
+ array[j].trim();
181
+ if (crudType[i] === "object") {
182
+ data[crudType[i]].push({ _id: array[j] });
183
+ } else {
184
+ data[crudType[i]].push(array[j]);
185
+ }
186
+ }
187
+ }
188
+ }
189
+
190
+ if (data.object || data.object === "" || data.key || data.key === "") {
191
+ if (!data.array || (data.array && !data.array.length)) return;
192
+ data.type = "object";
193
+ } else if (data.index || data.index === "") {
194
+ if (!data.array || (data.array && !data.array.length)) return;
195
+ data.type = "index";
196
+ } else if (data.array || data.array === "") data.type = "array";
197
+ else if (data.database || data.database === "") data.type = "database";
198
+ else if (data.storage || data.storage === "") data.type = "storage";
199
+ else if (data.data) data.type = "data";
200
+
201
+ delete data.isRealtime;
202
+ return data;
184
203
  }
185
204
 
186
205
  function initDataKey(element, data) {
187
- let dataKey = getDataKey(data)
188
- if (keys.has(dataKey.string))
189
- keys.get(dataKey.string).elements.set(element, '')
190
- else
191
- keys.set(dataKey.string, { elements: new Map([[element, '']]), data, dataKey });
192
-
193
- elements.set(element, dataKey.string)
194
-
195
- if (element.parentElement) {
196
- let form = element.parentElement.closest('form')
197
- if (form) {
198
- if (!form.save)
199
- form.save = () => save(form)
200
-
201
- if (!form.getData)
202
- form.getData = () => getData(form)
203
-
204
- let formObject = forms.get(form)
205
- if (formObject) {
206
- formObject.elements.set(element, data)
207
- if (formObject.types.has(data.type))
208
- formObject.types.get(data.type).set(element, data)
209
- else
210
- formObject.types.set(data.type, new Map([[element, data]]));
211
- } else
212
- forms.set(form, { elements: new Map([[element, data]]), types: new Map([[data.type, new Map([[element, data]])]]) });
213
- }
214
- }
215
-
216
- if (!element.read)
217
- element.read = () => read(element)
218
- if (!element.save)
219
- element.save = () => save(element)
220
-
221
- return dataKey
206
+ let dataKey = getDataKey(data);
207
+ if (keys.has(dataKey.string))
208
+ keys.get(dataKey.string).elements.set(element, "");
209
+ else
210
+ keys.set(dataKey.string, {
211
+ elements: new Map([[element, ""]]),
212
+ data,
213
+ dataKey
214
+ });
215
+
216
+ elements.set(element, dataKey.string);
217
+
218
+ if (element.parentElement) {
219
+ let form = element.parentElement.closest("form");
220
+ if (form) {
221
+ if (!form.save) form.save = () => save(form);
222
+
223
+ if (!form.getData) form.getData = () => getData(form);
224
+
225
+ let formObject = forms.get(form);
226
+ if (formObject) {
227
+ formObject.elements.set(element, data);
228
+ if (formObject.types.has(data.type))
229
+ formObject.types.get(data.type).set(element, data);
230
+ else
231
+ formObject.types.set(data.type, new Map([[element, data]]));
232
+ } else
233
+ forms.set(form, {
234
+ elements: new Map([[element, data]]),
235
+ types: new Map([[data.type, new Map([[element, data]])]])
236
+ });
237
+ }
238
+ }
239
+
240
+ if (!element.read) element.read = () => read(element);
241
+ if (!element.save) element.save = () => save(element);
242
+
243
+ return dataKey;
222
244
  }
223
245
 
224
246
  async function read(element, data, dataKey) {
225
- if (!dataKey)
226
- dataKey = { string: elements.get(element) }
227
- if (!data) {
228
- let existingData = keys.get(dataKey.string)
229
- if (existingData && existingData.dataKey && existingData.dataKey.object)
230
- data = { ...existingData.dataKey.object }
231
- }
232
-
233
- if (!dataKey || !data.type)
234
- return
235
- if (!data.$filter && (!data[data.type] || !data[data.type].length))
236
- return
237
-
238
- if (!(element instanceof HTMLCollection) && !Array.isArray(element))
239
- element = [element]
240
-
241
- let delay = debounce.get(dataKey.string)
242
- if (!delay)
243
- debounce.set(dataKey.string, delay = {})
244
-
245
- if (!delay.elements)
246
- delay.elements = new Map()
247
-
248
- for (let el of element) {
249
- const isRead = el.getAttribute('read');
250
- if (isRead !== 'false' && !el.hasRead && (!data.$filter || data.$filter && data.$filter.isFilter !== false)) {
251
- el.hasRead = true
252
- delay.elements.set(el, true)
253
- } else {
254
- // console.log('read skipped', el)
255
- }
256
- }
257
-
258
- if (!delay.elements.size)
259
- return
260
-
261
- clearTimeout(delay.timer);
262
- delay.timer = setTimeout(function () {
263
- // TODO: should server support string and string array for type object, methods create, read, delete
264
- if (!data.$filter && data.type === 'object') {
265
- if (!data.object)
266
- return
267
- else if (typeof data.object === 'string')
268
- data.object = { _id: data.object }
269
- else if (Array.isArray(data.object)) {
270
- if (data.object.length)
271
- data.object = { _id: data.object[0]._id }
272
- } else if (!data.object._id.match(/^[0-9a-fA-F]{24}$/))
273
- return
274
- // if (data.object._id.startsWith('$'))
275
- // return
276
- }
277
-
278
- // if (data.object && !Array.isArray(data.object) && data.object._id.startsWith('$'))
279
- // return
280
-
281
- // if (data.$filter && data.$filter.query) {
282
- // if (!Object.keys(data.$filter.query).length)
283
- // return
284
- // }
285
-
286
- data.method = data.type + '.read'
287
-
288
- CRUD.send(data).then((Data) => {
289
- debounce.delete(dataKey.string)
290
- let els = Array.from(delay.elements.keys())
291
- clearTimeout(delay.timer);
292
- delete delay.elements
293
- delete delay.timer
294
-
295
- setData(els, Data);
296
- })
297
- }, 500);
247
+ if (!dataKey) dataKey = { string: elements.get(element) };
248
+ if (!data) {
249
+ let existingData = keys.get(dataKey.string);
250
+ if (existingData && existingData.dataKey && existingData.dataKey.object)
251
+ data = { ...existingData.dataKey.object };
252
+ }
253
+
254
+ if (!dataKey || !data.type) return;
255
+ if (!data.$filter && (!data[data.type] || !data[data.type].length)) return;
256
+
257
+ if (!(element instanceof HTMLCollection) && !Array.isArray(element))
258
+ element = [element];
259
+
260
+ let delay = debounce.get(dataKey.string);
261
+ if (!delay) debounce.set(dataKey.string, (delay = {}));
262
+
263
+ if (!delay.elements) delay.elements = new Map();
264
+
265
+ for (let el of element) {
266
+ const isRead = el.getAttribute("read");
267
+ if (
268
+ isRead !== "false" &&
269
+ !el.hasRead &&
270
+ (!data.$filter || (data.$filter && data.$filter.isFilter !== false))
271
+ ) {
272
+ el.hasRead = true;
273
+ delay.elements.set(el, true);
274
+ } else {
275
+ // console.log('read skipped', el)
276
+ }
277
+ }
278
+
279
+ if (!delay.elements.size) return;
280
+
281
+ clearTimeout(delay.timer);
282
+ delay.timer = setTimeout(function () {
283
+ // TODO: should server support string and string array for type object, methods create, read, delete
284
+ if (!data.$filter && data.type === "object") {
285
+ if (!data.object) return;
286
+ else if (typeof data.object === "string")
287
+ data.object = { _id: data.object };
288
+ else if (Array.isArray(data.object)) {
289
+ if (data.object.length)
290
+ data.object = { _id: data.object[0]._id };
291
+ } else if (!data.object._id.match(/^[0-9a-fA-F]{24}$/)) return;
292
+ // if (data.object._id.startsWith('$'))
293
+ // return
294
+ }
295
+
296
+ // if (data.object && !Array.isArray(data.object) && data.object._id.startsWith('$'))
297
+ // return
298
+
299
+ // if (data.$filter && data.$filter.query) {
300
+ // if (!Object.keys(data.$filter.query).length)
301
+ // return
302
+ // }
303
+
304
+ data.method = data.type + ".read";
305
+
306
+ CRUD.send(data).then((Data) => {
307
+ debounce.delete(dataKey.string);
308
+ let els = Array.from(delay.elements.keys());
309
+ clearTimeout(delay.timer);
310
+ delete delay.elements;
311
+ delete delay.timer;
312
+
313
+ setData(els, Data);
314
+ });
315
+ }, 500);
298
316
  }
299
317
 
300
318
  function get$in(query, mergedValues = []) {
301
- for (let key of Object.keys(query)) {
302
- if (key === '$and' || key === '$or' || key === '$nor') {
303
- for (let i = 0; i < query[key].length; i++) {
304
- sort$in(query[key][i], mergedValues)
305
- }
306
- } else if (typeof query[key] === 'object' && !Array.isArray(query[key])) {
307
- if (query[key].$in)
308
- mergedValues = [...mergedValues, ...query[key].$in];
309
- }
310
- }
311
- return mergedValues
319
+ for (let key of Object.keys(query)) {
320
+ if (key === "$and" || key === "$or" || key === "$nor") {
321
+ for (let i = 0; i < query[key].length; i++) {
322
+ sort$in(query[key][i], mergedValues);
323
+ }
324
+ } else if (
325
+ typeof query[key] === "object" &&
326
+ !Array.isArray(query[key])
327
+ ) {
328
+ if (query[key].$in)
329
+ mergedValues = [...mergedValues, ...query[key].$in];
330
+ }
331
+ }
332
+ return mergedValues;
312
333
  }
313
334
 
314
335
  function sort$in(data, query) {
315
- let mergedValues = get$in(query);
316
-
317
- if (mergedValues.length) {
318
- const sorted = mergedValues
319
- .map(name => data.find(career => career.name === name))
320
- .filter(career => career !== undefined);
321
- return sorted
322
- }
336
+ let mergedValues = get$in(query);
337
+
338
+ if (mergedValues.length) {
339
+ const sorted = mergedValues
340
+ .map((name) => data.find((career) => career.name === name))
341
+ .filter((career) => career !== undefined);
342
+ return sorted;
343
+ }
323
344
  }
324
345
 
325
346
  async function setData(element, data) {
326
- if (!element) {
327
- element = getDataElements(data)
328
- if (!element.length) return
329
- }
330
- if (!(element instanceof HTMLCollection) && !Array.isArray(element))
331
- element = [element]
332
-
333
- let type = data.type
334
- if (!type && data.method) {
335
- type = data.method.split('.')[0]
336
- } else if (type == 'key')
337
- type = 'object'
338
-
339
- if (data.$filter && data.$filter.query) {
340
- let sortedData = sort$in(data[type], data.$filter.query)
341
- if (sortedData && sortedData.length)
342
- data[type] = sortedData
343
- }
344
-
345
- for (let el of element) {
346
- // if rendered in server side skip
347
- if (el.hasAttribute('rendered'))
348
- return el.removeAttribute('rendered');
349
- if (el.hasAttribute('render-json')) {
350
- // TODO find the json template in the text or attributes
351
- // if found add the node as an element, if the element has crud attributes also add as the element
352
- // for (let attribute of el.attributes) {
353
- // if (attribute.value.match(/{{(.*?)}}/)) {
354
- // let value = await renderValue(attribute, data[type][0], attribute.value)
355
- // if (value)
356
- // attribute.value = value
357
- // }
358
- // }
359
- // if (el.innerHTML.match(/{{(.*?)}}/)) {
360
- // let value = renderValue(el, data[type], el.innerHTML)
361
- // if (value)
362
- // el.innerHTML = value
363
- // }
364
-
365
- // if (el.textContent.match(/{{(.*?)}}/)) {
366
- // let value = renderValue(el, undefined, el.textContent)
367
- // if (value)
368
- // attribute.value = value
369
- // }
370
-
371
- // let Data = JSON.parse(match[1]);
372
- // Data.method = object.read
373
- // CRUD.send(Data)
374
- console.log('render-json', '')
375
-
376
- }
377
-
378
- let action = el.getAttribute('actions')
379
- if (action && ['database', 'array', 'object', 'key'].includes(action)) continue;
380
-
381
- const { key, isRead, isUpdate, isListen, isCrdt } = getAttributes(el);
382
- if (el.getFilter || el.renderValue)
383
- await filterData(el, data, type, key)
384
- else {
385
- if (!data[type] || !data[type].length)
386
- continue;
387
-
388
- if (key && checkValue(key)) {
389
- let value
390
- if (key.includes('$length')) {
391
- value = CRUD.getValueFromObject(data[type][0], key.replace(/\.\$length$/, ''))
392
- if (value)
393
- value = value.length
394
- else
395
- value = 0
396
- } else {
397
- let $update = data[type][0].$update
398
- if ($update) {
399
- delete data[type][0].$update
400
- data[type][0] = { ...data[type][0], ...$update }
401
- }
402
- value = CRUD.getValueFromObject(data[type][0], key)
403
- }
404
-
405
- if (!data[type].length) continue;
406
- if (isRead === "false" || isCrdt === "true") continue;
407
- if (isUpdate === "false" || isListen === "false" && !data.method.endsWith('.read')) continue;
408
- // TODO: object.update data returned from server will not include $operator
409
- el.setValue(value);
410
- }
411
- }
412
- }
347
+ if (!element) {
348
+ element = getDataElements(data);
349
+ if (!element.length) return;
350
+ }
351
+ if (!(element instanceof HTMLCollection) && !Array.isArray(element))
352
+ element = [element];
353
+
354
+ let type = data.type;
355
+ if (!type && data.method) {
356
+ type = data.method.split(".")[0];
357
+ } else if (type == "key") type = "object";
358
+
359
+ if (data.$filter && data.$filter.query) {
360
+ let sortedData = sort$in(data[type], data.$filter.query);
361
+ if (sortedData && sortedData.length) data[type] = sortedData;
362
+ }
363
+
364
+ for (let el of element) {
365
+ // if rendered in server side skip
366
+ if (el.hasAttribute("rendered")) return el.removeAttribute("rendered");
367
+ if (el.hasAttribute("render-json")) {
368
+ // TODO find the json template in the text or attributes
369
+ // if found add the node as an element, if the element has crud attributes also add as the element
370
+ // for (let attribute of el.attributes) {
371
+ // if (attribute.value.match(/{{(.*?)}}/)) {
372
+ // let value = await renderValue(attribute, data[type][0], attribute.value)
373
+ // if (value)
374
+ // attribute.value = value
375
+ // }
376
+ // }
377
+ // if (el.innerHTML.match(/{{(.*?)}}/)) {
378
+ // let value = renderValue(el, data[type], el.innerHTML)
379
+ // if (value)
380
+ // el.innerHTML = value
381
+ // }
382
+
383
+ // if (el.textContent.match(/{{(.*?)}}/)) {
384
+ // let value = renderValue(el, undefined, el.textContent)
385
+ // if (value)
386
+ // attribute.value = value
387
+ // }
388
+
389
+ // let Data = JSON.parse(match[1]);
390
+ // Data.method = object.read
391
+ // CRUD.send(Data)
392
+ console.log("render-json", "");
393
+ }
394
+
395
+ let action = el.getAttribute("actions");
396
+ if (action && ["database", "array", "object", "key"].includes(action))
397
+ continue;
398
+
399
+ const { key, isRead, isUpdate, isListen, isCrdt } = getAttributes(el);
400
+ if (el.getFilter || el.renderValue)
401
+ await filterData(el, data, type, key);
402
+ else {
403
+ if (!data[type] || !data[type].length) continue;
404
+
405
+ if (key && checkValue(key)) {
406
+ let value;
407
+ if (key.includes("$length")) {
408
+ value = CRUD.getValueFromObject(
409
+ data[type][0],
410
+ key.replace(/\.\$length$/, "")
411
+ );
412
+ if (value) value = value.length;
413
+ else value = 0;
414
+ } else {
415
+ let $update = data[type][0].$update;
416
+ if ($update) {
417
+ delete data[type][0].$update;
418
+ data[type][0] = { ...data[type][0], ...$update };
419
+ }
420
+ value = CRUD.getValueFromObject(data[type][0], key);
421
+ }
422
+
423
+ if (!data[type].length) continue;
424
+ if (isRead === "false" || isCrdt === "true") continue;
425
+ if (
426
+ isUpdate === "false" ||
427
+ (isListen === "false" && !data.method.endsWith(".read"))
428
+ )
429
+ continue;
430
+ // TODO: object.update data returned from server will not include $operator
431
+ el.setValue(value);
432
+ }
433
+ }
434
+ }
413
435
  }
414
436
 
415
437
  async function filterData(element, data, type, key) {
416
- let operator = '', value
417
-
418
- if (key && !key.includes('$length') && key !== '{}') {
419
- if (!data || !type) return
420
-
421
- if (key.startsWith('$')) {
422
- operator = key.split('.')[0] || ''
423
- }
424
-
425
- let property = key.replace(operator + '.', '')
426
-
427
- if (Array.isArray(data[type])) {
428
- let Data = [], isObject
429
- for (let doc of data[type]) {
430
- if (!doc.$storage)
431
- continue
432
- // TODO: should have been handled by getDataElements()
433
- if (type === 'object') {
434
- let _id = element.getAttribute('object')
435
- if (_id && doc._id !== _id)
436
- continue
437
- let $update = doc.$update
438
- if ($update) {
439
- delete doc.$update
440
- doc = { ...doc, ...$update }
441
- }
442
-
443
- }
444
- if (doc[property]) {
445
- if (Array.isArray(doc[property]))
446
- Data.push(...doc[property])
447
- else {
448
- isObject = true
449
- Data.push(doc[property])
450
- }
451
- } else
452
- continue
453
- }
454
-
455
- // if (isObject && Data.length === 1) {
456
- // data = { [property]: Data[0] }
457
- // } else
458
- if (!operator)
459
- data = Data
460
- else if (operator === '$sum') {
461
- value = Data.reduce((accumulator, currentValue) => {
462
- return accumulator + currentValue;
463
- }, 0);
464
- }
465
- } else {
466
- data = { [property]: data[type][property] }
467
- }
468
- }
469
-
470
- let isRendered = element.querySelector('[render-clone]');
471
- if (operator) {
472
- element.setValue(value);
473
- } else if (element.renderValue && data.method && data.method.endsWith('.read') && data.$filter && (data.$filter.overwrite || !isRendered)) {
474
- await element.renderValue(data);
475
- } else if (data.$filter && data.$filter.loadmore || data.method && data.method.endsWith('.read') && isRendered) {
476
- await loadMore(element, data, type)
477
- } else if (element.getFilter && data.method && !data.method.endsWith('.read')) {
478
- await checkFilters(element, data, type)
479
- } else if (element.renderValue) {
480
- await element.renderValue(data);
481
- } else if (key === '$length') {
482
- element.setValue(data[type].length);
483
- } else if (key && key.includes('$length')) {
484
- let value = CRUD.getValueFromObject(data[type][0], key.replace(/\.\$length$/, ''))
485
- element.setValue(value.length);
486
- } else if (key === '{}') {
487
- element.setValue(data[type])
488
- } else if (data)
489
- element.setValue(data)
490
-
491
- if (data.$filter) {
492
- let filterElement = filter.filters.get(element)
493
- if (filterElement)
494
- filterElement.index = data.$filter.index
495
- }
496
-
497
- if (!data[type] || !Array.isArray(data[type]) || !data[type].length)
498
- return
499
-
500
- const evt = new CustomEvent('fetchedData', { bubbles: true });
501
- element.dispatchEvent(evt);
438
+ let operator = "",
439
+ value;
440
+
441
+ if (key && !key.includes("$length") && key !== "{}") {
442
+ if (!data || !type) return;
443
+
444
+ if (key.startsWith("$")) {
445
+ operator = key.split(".")[0] || "";
446
+ }
447
+
448
+ let property = key.replace(operator + ".", "");
449
+
450
+ if (Array.isArray(data[type])) {
451
+ let Data = [],
452
+ isObject;
453
+ for (let doc of data[type]) {
454
+ if (!doc.$storage) continue;
455
+ // TODO: should have been handled by getDataElements()
456
+ if (type === "object") {
457
+ let _id = element.getAttribute("object");
458
+ if (_id && doc._id !== _id) continue;
459
+ let $update = doc.$update;
460
+ if ($update) {
461
+ delete doc.$update;
462
+ doc = { ...doc, ...$update };
463
+ }
464
+ }
465
+ if (doc[property]) {
466
+ if (Array.isArray(doc[property]))
467
+ Data.push(...doc[property]);
468
+ else {
469
+ isObject = true;
470
+ Data.push(doc[property]);
471
+ }
472
+ } else continue;
473
+ }
474
+
475
+ // if (isObject && Data.length === 1) {
476
+ // data = { [property]: Data[0] }
477
+ // } else
478
+ if (!operator) data = Data;
479
+ else if (operator === "$sum") {
480
+ value = Data.reduce((accumulator, currentValue) => {
481
+ return accumulator + currentValue;
482
+ }, 0);
483
+ }
484
+ } else {
485
+ data = { [property]: data[type][property] };
486
+ }
487
+ }
488
+
489
+ let isRendered = element.querySelector("[render-clone]");
490
+ if (operator) {
491
+ element.setValue(value);
492
+ } else if (
493
+ element.renderValue &&
494
+ data.method &&
495
+ data.method.endsWith(".read") &&
496
+ data.$filter &&
497
+ (data.$filter.overwrite || !isRendered)
498
+ ) {
499
+ await element.renderValue(data);
500
+ } else if (
501
+ (data.$filter && data.$filter.loadmore) ||
502
+ (data.method && data.method.endsWith(".read") && isRendered)
503
+ ) {
504
+ await loadMore(element, data, type);
505
+ } else if (
506
+ element.getFilter &&
507
+ data.method &&
508
+ !data.method.endsWith(".read")
509
+ ) {
510
+ await checkFilters(element, data, type);
511
+ } else if (element.renderValue) {
512
+ await element.renderValue(data);
513
+ } else if (key === "$length") {
514
+ element.setValue(data[type].length);
515
+ } else if (key && key.includes("$length")) {
516
+ let value = CRUD.getValueFromObject(
517
+ data[type][0],
518
+ key.replace(/\.\$length$/, "")
519
+ );
520
+ element.setValue(value.length);
521
+ } else if (key === "{}") {
522
+ element.setValue(data[type]);
523
+ } else if (data) element.setValue(data);
524
+
525
+ if (data.$filter) {
526
+ let filterElement = filter.filters.get(element);
527
+ if (filterElement) filterElement.index = data.$filter.index;
528
+ }
529
+
530
+ if (!data[type] || !Array.isArray(data[type]) || !data[type].length) return;
531
+
532
+ const evt = new CustomEvent("fetchedData", { bubbles: true });
533
+ element.dispatchEvent(evt);
502
534
  }
503
535
 
504
536
  async function loadMore(element, data, type, sort) {
505
- let Data = { ...data };
506
- let renderedData = await element.getData();
507
- if (!renderedData || !renderedData[type]) {
508
- return;
509
- }
510
- for (let i = 0; i < Data[type].length; i++) {
511
- let index;
512
- if (type === 'object') {
513
- index = renderedData[type].findIndex(obj => obj._id === Data[type][i]._id);
514
- } else {
515
- index = renderedData[type].findIndex(obj => obj.name === Data[type][i].name);
516
- }
517
-
518
- if (index >= 0) {
519
- Data[type].splice(i, 1);
520
- i--; // Adjust the index to account for the removed item
521
- }
522
- }
523
- if (Data[type].length > 0) {
524
- await element.renderValue(Data);
525
- }
537
+ let Data = { ...data };
538
+ let renderedData = await element.getData();
539
+ if (!renderedData || !renderedData[type]) {
540
+ return;
541
+ }
542
+ for (let i = 0; i < Data[type].length; i++) {
543
+ let index;
544
+ if (type === "object") {
545
+ index = renderedData[type].findIndex(
546
+ (obj) => obj._id === Data[type][i]._id
547
+ );
548
+ } else {
549
+ index = renderedData[type].findIndex(
550
+ (obj) => obj.name === Data[type][i].name
551
+ );
552
+ }
553
+
554
+ if (index >= 0) {
555
+ Data[type].splice(i, 1);
556
+ i--; // Adjust the index to account for the removed item
557
+ }
558
+ }
559
+ if (Data[type].length > 0) {
560
+ await element.renderValue(Data);
561
+ }
526
562
  }
527
563
 
528
564
  async function checkFilters(element, data, type) {
529
- let Data
530
- if (!element.getData) {
531
- // TODO: fix: getObject as this is related to render or form, but filter could exist on an input which does not have getObject
532
- // TODO: generate an object of current element key: value to use with filter. because filter is used object is not defined
533
- Data = getObject(element)
534
- if (Array.isArray(Data[type]))
535
- Data = Data[type][0]
536
- } else
537
- Data = await element.getData()
538
-
539
- if (!Data) return
540
-
541
- let newData
542
- if (type) {
543
- Data = Data[type]
544
- newData = data[type]
545
- } else
546
- newData = data
547
-
548
- let filter = await element.getFilter()
549
- if (filter && filter.query) {
550
- for (let i = 0; i < newData.length; i++) {
551
- let isMatch = queryData(newData[i], filter.query)
552
- if (!isMatch)
553
- newData.slice(i, 1)
554
- }
555
-
556
- }
557
-
558
- if (!newData || !newData.length)
559
- return
560
-
561
- if (Array.isArray(Data)) {
562
- if (Array.isArray(newData)) {
563
- for (let i = 0; i < newData.length; i++) {
564
- checkIndex(element, data, Data, newData[i], type, filter)
565
- }
566
- } else {
567
- checkIndex(element, data, Data, newData, type, filter)
568
- }
569
- } else {
570
- let primaryKey
571
- if (type === 'object') {
572
- primaryKey = '_id';
573
- } else {
574
- primaryKey = 'name';
575
- }
576
-
577
- if (Array.isArray(newData)) {
578
- for (let i = 0; i < newData.length; i++) {
579
- if (typeof Data === 'string' && Data === newData[i][primaryKey]) {
580
- Data = newData[i]
581
- } else if (Data[primaryKey] === newData[i][primaryKey]) {
582
- Data = dotNotationToObject(newData[i], Data)
583
- }
584
- }
585
- } else if (typeof Data === 'string' && Data === newData[primaryKey]) {
586
- Data = newData
587
- } else if (Data[primaryKey] === newData[primaryKey]) {
588
- Data = dotNotationToObject(newData, Data)
589
- }
590
-
591
- if (element.renderValue)
592
- element.renderValue(data);
593
- // render({ element, data, key: type });
594
- else if (data)
595
- element.setValue(data)
596
- }
565
+ let Data;
566
+ if (!element.getData) {
567
+ // TODO: fix: getObject as this is related to render or form, but filter could exist on an input which does not have getObject
568
+ // TODO: generate an object of current element key: value to use with filter. because filter is used object is not defined
569
+ Data = getObject(element);
570
+ if (Array.isArray(Data[type])) Data = Data[type][0];
571
+ } else Data = await element.getData();
572
+
573
+ if (!Data) return;
574
+
575
+ let newData;
576
+ if (type) {
577
+ Data = Data[type];
578
+ newData = data[type];
579
+ } else newData = data;
580
+
581
+ let filter = await element.getFilter();
582
+ if (filter && filter.query) {
583
+ for (let i = 0; i < newData.length; i++) {
584
+ let isMatch = queryData(newData[i], filter.query);
585
+ if (!isMatch) newData.slice(i, 1);
586
+ }
587
+ }
588
+
589
+ if (!newData || !newData.length) return;
590
+
591
+ if (Array.isArray(Data)) {
592
+ if (Array.isArray(newData)) {
593
+ for (let i = 0; i < newData.length; i++) {
594
+ checkIndex(element, data, Data, newData[i], type, filter);
595
+ }
596
+ } else {
597
+ checkIndex(element, data, Data, newData, type, filter);
598
+ }
599
+ } else {
600
+ let primaryKey;
601
+ if (type === "object") {
602
+ primaryKey = "_id";
603
+ } else {
604
+ primaryKey = "name";
605
+ }
606
+
607
+ if (Array.isArray(newData)) {
608
+ for (let i = 0; i < newData.length; i++) {
609
+ if (
610
+ typeof Data === "string" &&
611
+ Data === newData[i][primaryKey]
612
+ ) {
613
+ Data = newData[i];
614
+ } else if (Data[primaryKey] === newData[i][primaryKey]) {
615
+ Data = dotNotationToObject(newData[i], Data);
616
+ }
617
+ }
618
+ } else if (typeof Data === "string" && Data === newData[primaryKey]) {
619
+ Data = newData;
620
+ } else if (Data[primaryKey] === newData[primaryKey]) {
621
+ Data = dotNotationToObject(newData, Data);
622
+ }
623
+
624
+ if (element.renderValue) element.renderValue(data);
625
+ // render({ element, data, key: type });
626
+ else if (data) element.setValue(data);
627
+ }
597
628
  }
598
629
 
599
630
  function checkIndex(element, data, Data, newData, type, filter) {
600
- let index
601
- if (type === 'object') {
602
- index = Data.findIndex(obj => obj._id === newData._id);
603
- } else {
604
- index = Data.findIndex(obj => obj.name === newData.name);
605
- }
606
-
607
- if (!data.$filter)
608
- data.$filter = {}
609
-
610
- if (data.method.endsWith('.delete')) {
611
- if (!index && index !== 0)
612
- return
613
- data.$filter.remove = true
614
- } else {
615
- if (data.method.endsWith('.create')) {
616
- if (index === -1) {
617
- data.$filter.create = true
618
- if (filter && filter.sort)
619
- newData.isNewData = true
620
- else
621
- index = Data.length
622
- Data.push(newData)
623
- }
624
- } else {
625
- data.$filter.update = true
626
- data.$filter.currentIndex = index
627
- Data[index] = dotNotationToObject(newData, Data[index])
628
- if (filter && filter.sort) {
629
- Data[index].isNewData = true
630
- }
631
- }
632
-
633
- if (filter && filter.sort) {
634
- Data = sortData(Data, filter.sort)
635
- index = Data.findIndex(obj => obj.isNewData);
636
- }
637
-
638
- }
639
-
640
- if (index >= 0) {
641
- if (data.$filter.currentIndex === index)
642
- delete data.$filter.currentIndex
643
- data.$filter.index = index
644
- if (element.renderValue)
645
- element.renderValue(data);
646
- else if (data)
647
- element.setValue(data)
648
- }
649
-
631
+ let index;
632
+ if (type === "object") {
633
+ index = Data.findIndex((obj) => obj._id === newData._id);
634
+ } else {
635
+ index = Data.findIndex((obj) => obj.name === newData.name);
636
+ }
637
+
638
+ if (!data.$filter) data.$filter = {};
639
+
640
+ if (data.method.endsWith(".delete")) {
641
+ if (!index && index !== 0) return;
642
+ data.$filter.remove = true;
643
+ } else {
644
+ if (data.method.endsWith(".create")) {
645
+ if (index === -1) {
646
+ data.$filter.create = true;
647
+ if (filter && filter.sort) newData.isNewData = true;
648
+ else index = Data.length;
649
+ Data.push(newData);
650
+ }
651
+ } else {
652
+ data.$filter.update = true;
653
+ data.$filter.currentIndex = index;
654
+ Data[index] = dotNotationToObject(newData, Data[index]);
655
+ if (filter && filter.sort) {
656
+ Data[index].isNewData = true;
657
+ }
658
+ }
659
+
660
+ if (filter && filter.sort) {
661
+ Data = sortData(Data, filter.sort);
662
+ index = Data.findIndex((obj) => obj.isNewData);
663
+ }
664
+ }
665
+
666
+ if (index >= 0) {
667
+ if (data.$filter.currentIndex === index)
668
+ delete data.$filter.currentIndex;
669
+ data.$filter.index = index;
670
+ if (element.renderValue) element.renderValue(data);
671
+ else if (data) element.setValue(data);
672
+ }
650
673
  }
651
674
 
652
675
  function getDataKey(data) {
653
- let dataKey = {};
654
- let attributes = ["host", "organization_id", "apikey", "method", "type", "storage", "database", "array", "index", "object", "key", "updateKey", "$filter", "upsert", "namespace", "room", "broadcast", "broadcastSender", "broadcastBrowser"];
655
-
656
- for (let attribute of attributes) {
657
- if (attribute === 'key' && data.type === 'object')
658
- continue
659
- let value = data[attribute];
660
- if (value) {
661
- if (Array.isArray(value)) {
662
- dataKey[attribute] = [...value];
663
- if (typeof value[0] === 'string')
664
- dataKey[attribute].sort(); // Sort the values alphabetically
665
- } else {
666
- dataKey[attribute] = value;
667
- }
668
- }
669
- }
670
-
671
- const object = Object.fromEntries(Object.entries(dataKey).sort(([a], [b]) => a.localeCompare(b)));
672
- const string = JSON.stringify(object);
673
-
674
- return { string, object };
676
+ let dataKey = {};
677
+ let attributes = [
678
+ "host",
679
+ "organization_id",
680
+ "apikey",
681
+ "method",
682
+ "type",
683
+ "storage",
684
+ "database",
685
+ "array",
686
+ "index",
687
+ "object",
688
+ "key",
689
+ "updateKey",
690
+ "$filter",
691
+ "upsert",
692
+ "namespace",
693
+ "room",
694
+ "broadcast",
695
+ "broadcastSender",
696
+ "broadcastBrowser"
697
+ ];
698
+
699
+ for (let attribute of attributes) {
700
+ if (attribute === "key" && data.type === "object") continue;
701
+ let value = data[attribute];
702
+ if (value) {
703
+ if (Array.isArray(value)) {
704
+ dataKey[attribute] = [...value];
705
+ if (typeof value[0] === "string") dataKey[attribute].sort(); // Sort the values alphabetically
706
+ } else {
707
+ dataKey[attribute] = value;
708
+ }
709
+ }
710
+ }
711
+
712
+ const object = Object.fromEntries(
713
+ Object.entries(dataKey).sort(([a], [b]) => a.localeCompare(b))
714
+ );
715
+ const string = JSON.stringify(object);
716
+
717
+ return { string, object };
675
718
  }
676
719
 
677
720
  function getDataElements(data) {
678
- let element = []
679
- let matchingKeys = getDataKeys(data)
680
- for (let i = 0; i < matchingKeys.length; i++) {
681
- let matchingElements = keys.get(matchingKeys[i])
682
- if (matchingElements && matchingElements.elements && matchingElements.elements.size)
683
- element.push(...matchingElements.elements.keys())
684
- }
685
- return element
721
+ let element = [];
722
+ let matchingKeys = getDataKeys(data);
723
+ for (let i = 0; i < matchingKeys.length; i++) {
724
+ let matchingElements = keys.get(matchingKeys[i]);
725
+ if (
726
+ matchingElements &&
727
+ matchingElements.elements &&
728
+ matchingElements.elements.size
729
+ )
730
+ element.push(...matchingElements.elements.keys());
731
+ }
732
+ return element;
686
733
  }
687
734
 
688
- // TODO: Correctly check for matches
735
+ // TODO: Correctly check for matches
689
736
  function getDataKeys(data) {
690
- const matchingKeyStrings = [];
691
- const targetKeys = ["type", "storage", "database", "array", "index", "object", '$filter'];
692
-
693
- for (const [keyString, sortedKey] of keys.entries()) {
694
- let hasMatch = true;
695
-
696
- for (const key of targetKeys) {
697
- if (!data.$filter && key === '$filter' && sortedKey.data.hasOwnProperty(key))
698
- hasMatch = true
699
- else if (data.hasOwnProperty(key)) {
700
- if (!sortedKey.data.hasOwnProperty(key)) {
701
- hasMatch = false;
702
- break;
703
- }
704
- if (Array.isArray(sortedKey.data[key]) && Array.isArray(data[key])) {
705
- // if key is object check _id
706
- if (key === 'object' && sortedKey.data.$filter)
707
- hasMatch = true
708
- else {
709
- const matches = sortedKey.data[key].some(value => {
710
- if (key === 'object') {
711
- return data[key].some(obj => {
712
- return obj._id === value._id
713
- });
714
- } else {
715
- return data[key].includes(value)
716
- }
717
- });
718
-
719
- if (!matches) {
720
- hasMatch = false;
721
- break;
722
- }
723
-
724
- }
725
-
726
-
727
- } else if (sortedKey.data[key] !== data[key]) {
728
- hasMatch = false;
729
- break;
730
- }
731
- }
732
- }
733
-
734
- if (hasMatch) {
735
- matchingKeyStrings.push(keyString);
736
- }
737
- }
738
-
739
- return matchingKeyStrings;
737
+ const matchingKeyStrings = [];
738
+ const targetKeys = [
739
+ "type",
740
+ "storage",
741
+ "database",
742
+ "array",
743
+ "index",
744
+ "object",
745
+ "$filter"
746
+ ];
747
+
748
+ for (const [keyString, sortedKey] of keys.entries()) {
749
+ let hasMatch = true;
750
+
751
+ for (const key of targetKeys) {
752
+ if (
753
+ !data.$filter &&
754
+ key === "$filter" &&
755
+ sortedKey.data.hasOwnProperty(key)
756
+ )
757
+ hasMatch = true;
758
+ else if (data.hasOwnProperty(key)) {
759
+ if (!sortedKey.data.hasOwnProperty(key)) {
760
+ hasMatch = false;
761
+ break;
762
+ }
763
+ if (
764
+ Array.isArray(sortedKey.data[key]) &&
765
+ Array.isArray(data[key])
766
+ ) {
767
+ // if key is object check _id
768
+ if (key === "object" && sortedKey.data.$filter)
769
+ hasMatch = true;
770
+ else {
771
+ const matches = sortedKey.data[key].some((value) => {
772
+ if (key === "object") {
773
+ return data[key].some((obj) => {
774
+ return obj._id === value._id;
775
+ });
776
+ } else {
777
+ return data[key].includes(value);
778
+ }
779
+ });
780
+
781
+ if (!matches) {
782
+ hasMatch = false;
783
+ break;
784
+ }
785
+ }
786
+ } else if (sortedKey.data[key] !== data[key]) {
787
+ hasMatch = false;
788
+ break;
789
+ }
790
+ }
791
+ }
792
+
793
+ if (hasMatch) {
794
+ matchingKeyStrings.push(keyString);
795
+ }
796
+ }
797
+
798
+ return matchingKeyStrings;
740
799
  }
741
800
 
742
801
  async function getData(form) {
743
- let dataKeys = new Map()
744
- let formObject = forms.get(form)
745
- if (!formObject) {
746
- let elements = form.querySelectorAll(selector)
747
- await init(elements)
748
- return await getData(form)
749
- }
750
-
751
- for (let type of formObject.types.values()) {
752
- for (let [element, data] of type.entries()) {
753
- if (!element.hasAttribute('key') || element.getAttribute('save') === 'false')
754
- continue
755
-
756
- if (element.hasAttribute('actions')) {
757
- let attribute = element.getAttribute('actions')
758
- if (attribute.includes('save', 'delete'))
759
- continue
760
- }
761
- let Data = { ...data }
762
- let dataKey = elements.get(element)
763
- let value = await element.getValue()
764
-
765
- // console.log(type, value, data)
766
- if (!Data[Data.type] && Data.key) {
767
- if (!value)
768
- continue
769
- else if (Array.isArray(value) && !value.length)
770
- continue
771
-
772
- Data.method = Data.type + '.create'
773
- if (Data.type === 'object') {
774
- if (!Data.object)
775
- Data.object = {}
776
- else if (typeof Data.object === 'string')
777
- Data.object = { _id: Data.object }
778
-
779
-
780
- if (Data.key) {
781
- if (Data.key == '{}') {
782
- if (Array.isArray(value)) {
783
- Data.object = value
784
- } else
785
- Data.object = { ...Data.object, ...value }
786
- } else
787
- Data.object[Data.key] = value
788
- }
789
- if (Data.isUpsert && Data.$filter)
790
- Data.method = 'object.update'
791
-
792
- } else
793
- Data[Data.type] = value
794
-
795
- } else if (Data[Data.type] && Data.key) {
796
- let attributes = element.attributes
797
- if (Data.key.startsWith('$')) {
798
- for (let i = 0; i < attributes.length; i++) {
799
- let operators = ['$rename', '$inc', '$push', '$each', '$splice', '$unset', '$delete', '$slice', '$pop', '$shift', '$addToSet', '$pull']
800
- if (operators.includes(attributes[i].name)) {
801
- Data.key = attributes[i].name + '.' + Data.key
802
- break;
803
- }
804
- }
805
- }
806
-
807
- if (Data.type = 'object') {
808
- if (Data.key == '{}') {
809
- if (!value)
810
- continue
811
- else if (Array.isArray(value) && !value.length)
812
- continue
813
- }
814
-
815
- if (typeof Data[Data.type] === 'string')
816
- if (Data.key == '{}') {
817
- // TODO: handle if array length more than 1
818
- if (Array.isArray(value))
819
- Data[Data.type] = { _id: Data[Data.type], ...value[0] }
820
- else
821
- Data[Data.type] = { _id: Data[Data.type], ...value }
822
- } else
823
- Data[Data.type] = { _id: Data[Data.type], [Data.key]: value }
824
- else if (Array.isArray(Data[Data.type]))
825
- if (Data.key == '{}')
826
- Data[Data.type][0] = { ...Data[Data.type][0], ...value }
827
- else {
828
- Data[Data.type][0][Data.key] = value
829
- if (!Data[Data.type][0]._id)
830
- Data.method = Data.type + '.create'
831
- }
832
- else if (typeof Data[Data.type] === 'object')
833
- if (Data.key == '{}')
834
- Data[Data.type] = { ...Data[Data.type], ...value }
835
- else {
836
- Data[Data.type][Data.key] = value
837
- if (!Data[Data.type]._id)
838
- Data.method = Data.type + '.create'
839
- }
840
- } else {
841
- Data[Data.type] = { [Data[Data.type]]: value }
842
- }
843
-
844
- if (Data.isUpdate || Data.isUpdate === '') {
845
- if (!Data.key) return
846
- delete Data.isUpdate
847
- Data.updateKey = { [Data.key]: value }
848
- Data.method = Data.type + '.update'
849
- } else if (Data.isDelete || Data.isDelete === '') {
850
- delete Data.isDelete
851
- if (Data.type == 'object' && Data.key) {
852
- Data.method = Data.type + '.update'
853
- // TODO: Data.type can be a string _id or an array for string _id needs to be converted to object
854
- if (typeof Data[Data.type] === 'string')
855
- Data[Data.type] = { _id: Data[Data.type], [Data.key]: undefined }
856
- else if (Array.isArray(Data[Data.type])) {
857
- console.log('Data.type is an array function incomplete')
858
- } else if (typeof Data[Data.type] === 'object')
859
- Data[Data.type][Data.key] = undefined
860
- } else {
861
- Data.method = Data.type + '.delete'
862
- }
863
- } else if (Data.type !== 'object' && Data[Data.type] === '') {
864
- // if (!Data.key)
865
- // Data.method = Data.type + '.read'
866
- // else if (Data.key === 'name')
867
- // Data.method = Data.type + '.create'
868
- } else if (Data.type !== 'object' && Data[Data.type]) {
869
- // if (Data.key)
870
- // Data.method = Data.type + '.update'
871
- }
872
-
873
- }
874
-
875
- //dataKey should be used to group
876
- let key = dataKey + Data.method
877
- if (dataKeys.has(key)) {
878
- let storedData = dataKeys.get(key)[Data.type]
879
- dataKeys.get(key)[Data.type] = { ...storedData, ...Data[Data.type] }
880
- } else {
881
- dataKeys.set(key, Data)
882
- }
883
- }
884
- }
885
-
886
- // TODO: group by methods so we can make one crud request per method
887
- let dataArray = Array.from(dataKeys.values())
888
-
889
- return dataArray
802
+ let dataKeys = new Map();
803
+ let formObject = forms.get(form);
804
+ if (!formObject) {
805
+ let elements = form.querySelectorAll(selector);
806
+ await init(elements);
807
+ return await getData(form);
808
+ }
809
+
810
+ for (let type of formObject.types.values()) {
811
+ for (let [element, data] of type.entries()) {
812
+ if (
813
+ !element.hasAttribute("key") ||
814
+ element.getAttribute("save") === "false"
815
+ )
816
+ continue;
817
+
818
+ if (element.hasAttribute("actions")) {
819
+ let attribute = element.getAttribute("actions");
820
+ if (attribute.includes("save", "delete")) continue;
821
+ }
822
+ let Data = { ...data };
823
+ let dataKey = elements.get(element);
824
+ let value = await element.getValue();
825
+
826
+ // console.log(type, value, data)
827
+ if (!Data[Data.type] && Data.key) {
828
+ if (!value) continue;
829
+ else if (Array.isArray(value) && !value.length) continue;
830
+
831
+ Data.method = Data.type + ".create";
832
+ if (Data.type === "object") {
833
+ if (!Data.object) Data.object = {};
834
+ else if (typeof Data.object === "string")
835
+ Data.object = { _id: Data.object };
836
+
837
+ if (Data.key) {
838
+ if (Data.key == "{}") {
839
+ if (Array.isArray(value)) {
840
+ Data.object = value;
841
+ } else Data.object = { ...Data.object, ...value };
842
+ } else Data.object[Data.key] = value;
843
+ }
844
+ if (Data.isUpsert && Data.$filter)
845
+ Data.method = "object.update";
846
+ } else Data[Data.type] = value;
847
+ } else if (Data[Data.type] && Data.key) {
848
+ let attributes = element.attributes;
849
+ if (Data.key.startsWith("$")) {
850
+ for (let i = 0; i < attributes.length; i++) {
851
+ let operators = [
852
+ "$rename",
853
+ "$inc",
854
+ "$push",
855
+ "$each",
856
+ "$splice",
857
+ "$unset",
858
+ "$delete",
859
+ "$slice",
860
+ "$pop",
861
+ "$shift",
862
+ "$addToSet",
863
+ "$pull"
864
+ ];
865
+ if (operators.includes(attributes[i].name)) {
866
+ Data.key = attributes[i].name + "." + Data.key;
867
+ break;
868
+ }
869
+ }
870
+ }
871
+
872
+ if ((Data.type = "object")) {
873
+ if (Data.key == "{}") {
874
+ if (!value) continue;
875
+ else if (Array.isArray(value) && !value.length)
876
+ continue;
877
+ }
878
+
879
+ if (typeof Data[Data.type] === "string")
880
+ if (Data.key == "{}") {
881
+ // TODO: handle if array length more than 1
882
+ if (Array.isArray(value))
883
+ Data[Data.type] = {
884
+ _id: Data[Data.type],
885
+ ...value[0]
886
+ };
887
+ else
888
+ Data[Data.type] = {
889
+ _id: Data[Data.type],
890
+ ...value
891
+ };
892
+ } else
893
+ Data[Data.type] = {
894
+ _id: Data[Data.type],
895
+ [Data.key]: value
896
+ };
897
+ else if (Array.isArray(Data[Data.type]))
898
+ if (Data.key == "{}")
899
+ Data[Data.type][0] = {
900
+ ...Data[Data.type][0],
901
+ ...value
902
+ };
903
+ else {
904
+ Data[Data.type][0][Data.key] = value;
905
+ if (!Data[Data.type][0]._id)
906
+ Data.method = Data.type + ".create";
907
+ }
908
+ else if (typeof Data[Data.type] === "object")
909
+ if (Data.key == "{}")
910
+ Data[Data.type] = { ...Data[Data.type], ...value };
911
+ else {
912
+ Data[Data.type][Data.key] = value;
913
+ if (!Data[Data.type]._id)
914
+ Data.method = Data.type + ".create";
915
+ }
916
+ } else {
917
+ Data[Data.type] = { [Data[Data.type]]: value };
918
+ }
919
+
920
+ if (Data.isUpdate || Data.isUpdate === "") {
921
+ if (!Data.key) return;
922
+ delete Data.isUpdate;
923
+ Data.updateKey = { [Data.key]: value };
924
+ Data.method = Data.type + ".update";
925
+ } else if (Data.isDelete || Data.isDelete === "") {
926
+ delete Data.isDelete;
927
+ if (Data.type == "object" && Data.key) {
928
+ Data.method = Data.type + ".update";
929
+ // TODO: Data.type can be a string _id or an array for string _id needs to be converted to object
930
+ if (typeof Data[Data.type] === "string")
931
+ Data[Data.type] = {
932
+ _id: Data[Data.type],
933
+ [Data.key]: undefined
934
+ };
935
+ else if (Array.isArray(Data[Data.type])) {
936
+ console.log(
937
+ "Data.type is an array function incomplete"
938
+ );
939
+ } else if (typeof Data[Data.type] === "object")
940
+ Data[Data.type][Data.key] = undefined;
941
+ } else {
942
+ Data.method = Data.type + ".delete";
943
+ }
944
+ } else if (Data.type !== "object" && Data[Data.type] === "") {
945
+ // if (!Data.key)
946
+ // Data.method = Data.type + '.read'
947
+ // else if (Data.key === 'name')
948
+ // Data.method = Data.type + '.create'
949
+ } else if (Data.type !== "object" && Data[Data.type]) {
950
+ // if (Data.key)
951
+ // Data.method = Data.type + '.update'
952
+ }
953
+ }
954
+
955
+ //dataKey should be used to group
956
+ let key = dataKey + Data.method;
957
+ if (dataKeys.has(key)) {
958
+ let storedData = dataKeys.get(key)[Data.type];
959
+ dataKeys.get(key)[Data.type] = {
960
+ ...storedData,
961
+ ...Data[Data.type]
962
+ };
963
+ } else {
964
+ dataKeys.set(key, Data);
965
+ }
966
+ }
967
+ }
968
+
969
+ // TODO: group by methods so we can make one crud request per method
970
+ let dataArray = Array.from(dataKeys.values());
971
+
972
+ return dataArray;
890
973
  }
891
974
 
892
975
  async function save(element) {
893
- if (!element) return;
894
- let data, value
895
- let upsert = element.getAttribute('upsert')
896
- if (upsert && upsert !== 'false')
897
- upsert = true
898
- if (element.tagName === "FORM") {
899
- data = await element.getData()
900
- } else {
901
- let isSave = element.getAttribute('save')
902
- if (isSave === 'false') return
903
-
904
- let form = element.closest('form');
905
- if (form)
906
- return save(form);
907
-
908
- let dataKey = elements.get(element)
909
- data = { ...keys.get(dataKey).dataKey.object }
910
-
911
- value = await element.getValue();
912
- let key = element.getAttribute('key')
913
-
914
- if (typeof data[data.type] === 'string')
915
- if (key == '{}')
916
- data[data.type] = { _id: data[data.type], ...value }
917
- else
918
- data[data.type] = { _id: data[data.type], [key]: value }
919
- else if (typeof data[data.type] === 'object')
920
- if (key == '{}')
921
- data[data.type] = { ...data[data.type], ...value }
922
- else
923
- data[data.type][key] = value
924
-
925
- if (/\.([0-9]*)/g.test(data.key)) {
926
- let splice = element.getAttribute('splice')
927
- let slice = element.getAttribute('slice')
928
- let update = element.getAttribute('update')
929
-
930
- if (splice || splice === "") {
931
- data[data.type][key] = { $splice: value }
932
- } else if (slice) {
933
- data[data.type][key] = '$delete'
934
- } else if (update) {
935
- value = data.key.replace(/\[.*?\]/, '[' + value + ']')
936
- data.updateKey[key] = value
937
- data[data.type][key] = { $update: value } // $update is string use the value as the key name
938
-
939
- // data[data.type][key] = { $update: {[value]: value} } // $update is an object use the key as the value to use for the new key
940
- }
941
-
942
- }
943
-
944
- data = [data]
945
- }
946
-
947
-
948
- let Data = []
949
- for (let i = 0; i < data.length; i++) {
950
- if (data[i].type === 'object') {
951
- if (typeof data[i].object === 'string') {
952
- if (!data[i]._id)
953
- data[i].method = 'object.create'
954
- else {
955
- data[i].method = 'object.update'
956
- if (upsert)
957
- data[i].upsert = true
958
- }
959
- } else if (Array.isArray(data[i].object)) {
960
- if (!data[i].object[0]._id)
961
- data[i].method = 'object.create'
962
- else {
963
- data[i].method = 'object.update'
964
- if (upsert)
965
- data[i].upsert = true
966
- }
967
- } else if (typeof data[i].object === 'object') {
968
- if (!data[i].object._id)
969
- data[i].method = 'object.create'
970
- else {
971
- data[i].method = 'object.update'
972
- if (upsert)
973
- data[i].upsert = true
974
- }
975
- }
976
- }
977
-
978
- if (data[i].isUpsert) {
979
- data[i].upsert = true
980
- delete data[i].isUpsert
981
- }
982
-
983
- if (data[i].method && data[i].method.endsWith('.create')) {
984
- element.setAttribute(data[i].type, 'pending');
985
- } else if (data[i].method && data[i].method.endsWith('.update') && data[i].type == 'object' && typeof value == 'string' && window.CoCreate.crdt && !'crdt') {
986
- return window.CoCreate.crdt.replaceText({
987
- array: data[i].array,
988
- key: data[i].key,
989
- object: data[i].object._id,
990
- value
991
- });
992
- }
993
-
994
-
995
- data[i] = await CRUD.send(data[i]);
996
-
997
- Data.push(data[i])
998
-
999
- if (data[i] && (data[i].method.endsWith('.create') || data[i].type !== 'object' && data[i].method.endsWith('.update'))) {
1000
- setTypeValue(element, data[i])
1001
- } else if (data[i])
1002
- document.dispatchEvent(new CustomEvent('saved', {
1003
- detail: data[i]
1004
- }));
1005
-
1006
- }
1007
-
1008
- return Data
976
+ if (!element) return;
977
+ let data, value;
978
+ let upsert = element.getAttribute("upsert");
979
+ if (upsert && upsert !== "false") upsert = true;
980
+ if (element.tagName === "FORM") {
981
+ data = await element.getData();
982
+ } else {
983
+ let isSave = element.getAttribute("save");
984
+ if (isSave === "false") return;
985
+
986
+ let form = element.closest("form");
987
+ if (form) return save(form);
988
+
989
+ let dataKey = elements.get(element);
990
+ data = { ...keys.get(dataKey).dataKey.object };
991
+
992
+ value = await element.getValue();
993
+ let key = element.getAttribute("key");
994
+
995
+ if (typeof data[data.type] === "string")
996
+ if (key == "{}")
997
+ data[data.type] = { _id: data[data.type], ...value };
998
+ else data[data.type] = { _id: data[data.type], [key]: value };
999
+ else if (typeof data[data.type] === "object")
1000
+ if (key == "{}") data[data.type] = { ...data[data.type], ...value };
1001
+ else data[data.type][key] = value;
1002
+
1003
+ if (/\.([0-9]*)/g.test(data.key)) {
1004
+ let splice = element.getAttribute("splice");
1005
+ let slice = element.getAttribute("slice");
1006
+ let update = element.getAttribute("update");
1007
+
1008
+ if (splice || splice === "") {
1009
+ data[data.type][key] = { $splice: value };
1010
+ } else if (slice) {
1011
+ data[data.type][key] = "$delete";
1012
+ } else if (update) {
1013
+ value = data.key.replace(/\[.*?\]/, "[" + value + "]");
1014
+ data.updateKey[key] = value;
1015
+ data[data.type][key] = { $update: value }; // $update is string use the value as the key name
1016
+
1017
+ // data[data.type][key] = { $update: {[value]: value} } // $update is an object use the key as the value to use for the new key
1018
+ }
1019
+ }
1020
+
1021
+ data = [data];
1022
+ }
1023
+
1024
+ let Data = [];
1025
+ for (let i = 0; i < data.length; i++) {
1026
+ if (data[i].type === "object") {
1027
+ if (typeof data[i].object === "string") {
1028
+ if (!data[i]._id) data[i].method = "object.create";
1029
+ else {
1030
+ data[i].method = "object.update";
1031
+ if (upsert) data[i].upsert = true;
1032
+ }
1033
+ } else if (Array.isArray(data[i].object)) {
1034
+ if (!data[i].object[0]._id) data[i].method = "object.create";
1035
+ else {
1036
+ data[i].method = "object.update";
1037
+ if (upsert) data[i].upsert = true;
1038
+ }
1039
+ } else if (typeof data[i].object === "object") {
1040
+ if (!data[i].object._id) data[i].method = "object.create";
1041
+ else {
1042
+ data[i].method = "object.update";
1043
+ if (upsert) data[i].upsert = true;
1044
+ }
1045
+ }
1046
+ }
1047
+
1048
+ if (data[i].isUpsert) {
1049
+ data[i].upsert = true;
1050
+ delete data[i].isUpsert;
1051
+ }
1052
+
1053
+ if (data[i].method && data[i].method.endsWith(".create")) {
1054
+ element.setAttribute(data[i].type, "pending");
1055
+ } else if (
1056
+ data[i].method &&
1057
+ data[i].method.endsWith(".update") &&
1058
+ data[i].type == "object" &&
1059
+ typeof value == "string" &&
1060
+ window.CoCreate.crdt &&
1061
+ !"crdt"
1062
+ ) {
1063
+ return window.CoCreate.crdt.replaceText({
1064
+ array: data[i].array,
1065
+ key: data[i].key,
1066
+ object: data[i].object._id,
1067
+ value
1068
+ });
1069
+ }
1070
+
1071
+ data[i] = await CRUD.send(data[i]);
1072
+
1073
+ Data.push(data[i]);
1074
+
1075
+ if (
1076
+ data[i] &&
1077
+ (data[i].method.endsWith(".create") ||
1078
+ (data[i].type !== "object" &&
1079
+ data[i].method.endsWith(".update")))
1080
+ ) {
1081
+ setTypeValue(element, data[i]);
1082
+ } else if (data[i])
1083
+ document.dispatchEvent(
1084
+ new CustomEvent("saved", {
1085
+ detail: data[i]
1086
+ })
1087
+ );
1088
+ }
1089
+
1090
+ return Data;
1009
1091
  }
1010
1092
 
1011
1093
  function setTypeValue(element, data) {
1012
- // TODO: if an array name is updated, the attibute array="" needs to be updated.
1013
-
1014
- if (!data) return;
1015
-
1016
- let form
1017
- if (element.tagName === "FORM")
1018
- form = element
1019
- else if (element.parentElement)
1020
- form = element.parentElement.closest('form')
1021
-
1022
- if (!form) {
1023
- if (data.type === 'object') {
1024
- element.setAttribute('object', data.object[0]._id)
1025
- } else {
1026
- element.setAttribute(data.type, data[data.type].name)
1027
- }
1028
- } else {
1029
- let formObject = forms.get(form)
1030
- if (form.getAttribute('object') === 'pending')
1031
- form.setAttribute('object', data.object[0]._id)
1032
-
1033
- let elements = formObject.types.get(data.type)
1034
-
1035
- for (let [el, Data] of elements.entries()) {
1036
- if (data.type === 'object') {
1037
- if (!Data.object || Data.object === 'pending') {
1038
- Data.object = data.object[0]._id
1039
- el.setAttribute('object', data.object[0]._id)
1040
- }
1041
- } else if (!Data[data.type]) {
1042
- Data[data.type] = data[data.type].name
1043
- el.setAttribute(data.type, data[data.type].name)
1044
- }
1045
- }
1046
- setData(Array.from(elements.keys()), data)
1047
-
1048
-
1049
- // const state_ids = new Map();
1050
-
1051
- // let state_id = form.getAttribute('state_id');
1052
- // if (state_id) {
1053
- // // Set state_ids to state_ids if array is not set
1054
- // if (form.getAttribute('array') == array)
1055
- // state_ids.set(state_id, '');
1056
- // }
1057
-
1058
- // let objectId = el.getAttribute('object');
1059
- // let key = el.getAttribute('key')
1060
- // // set object and state_id attributes to the object id if the object id is pending
1061
- // if (key && (objectId == '' || objectId == 'pending')) {
1062
- // el.setAttribute('object', id);
1063
- // // Set the id attribute of the element
1064
- // if (key == '_id')
1065
- // el.setValue(id)
1066
- // let state_id = el.getAttribute('state_id');
1067
- // // Set the state id to the state_ids.
1068
- // if (state_id) {
1069
- // state_ids.set(state_id, '');
1070
- // }
1071
-
1072
- // if (el.hasAttribute('state-object')) {
1073
- // let stateObjectId = el.getAttribute('state-object');
1074
- // // Set the state object id if not set.
1075
- // if (stateObjectId == '') {
1076
- // el.setAttribute('state-object', id);
1077
- // let state_id = el.getAttribute('state_id');
1078
- // // Set the state id to the state_ids.
1079
- // if (state_id) {
1080
- // state_ids.set(state_id, '');
1081
- // }
1082
- // }
1083
- // }
1084
-
1085
- // // Set the object attribute of all state_ids to the object attribute of all state_ids
1086
- // if (state_ids.size > 0) {
1087
- // for (let key of state_ids.keys()) {
1088
- // let stateEls = document.querySelectorAll(`[state_id="${key}"]`)
1089
- // for (let stateEl of stateEls) {
1090
- // // if (stateEl.getAttribute('array') == array){
1091
- // // Set the object id attribute to the stateEl s object if it is not set.
1092
- // if (stateEl.getAttribute('object') == '') {
1093
- // stateEl.setAttribute('object', id);
1094
- // }
1095
- // // }
1096
- // }
1097
- // }
1098
- // }
1099
- // }
1100
- }
1101
-
1102
- document.dispatchEvent(new CustomEvent('saved', {
1103
- detail: data
1104
- }));
1105
-
1094
+ // TODO: if an array name is updated, the attibute array="" needs to be updated.
1095
+
1096
+ if (!data) return;
1097
+
1098
+ let form;
1099
+ if (element.tagName === "FORM") form = element;
1100
+ else if (element.parentElement)
1101
+ form = element.parentElement.closest("form");
1102
+
1103
+ if (!form) {
1104
+ if (data.type === "object") {
1105
+ element.setAttribute("object", data.object[0]._id);
1106
+ } else {
1107
+ element.setAttribute(data.type, data[data.type].name);
1108
+ }
1109
+ } else {
1110
+ let formObject = forms.get(form);
1111
+ if (form.getAttribute("object") === "pending")
1112
+ form.setAttribute("object", data.object[0]._id);
1113
+
1114
+ let elements = formObject.types.get(data.type);
1115
+
1116
+ for (let [el, Data] of elements.entries()) {
1117
+ if (data.type === "object") {
1118
+ if (!Data.object || Data.object === "pending") {
1119
+ Data.object = data.object[0]._id;
1120
+ el.setAttribute("object", data.object[0]._id);
1121
+ }
1122
+ } else if (!Data[data.type]) {
1123
+ Data[data.type] = data[data.type].name;
1124
+ el.setAttribute(data.type, data[data.type].name);
1125
+ }
1126
+ }
1127
+ setData(Array.from(elements.keys()), data);
1128
+
1129
+ // const state_ids = new Map();
1130
+
1131
+ // let state_id = form.getAttribute('state_id');
1132
+ // if (state_id) {
1133
+ // // Set state_ids to state_ids if array is not set
1134
+ // if (form.getAttribute('array') == array)
1135
+ // state_ids.set(state_id, '');
1136
+ // }
1137
+
1138
+ // let objectId = el.getAttribute('object');
1139
+ // let key = el.getAttribute('key')
1140
+ // // set object and state_id attributes to the object id if the object id is pending
1141
+ // if (key && (objectId == '' || objectId == 'pending')) {
1142
+ // el.setAttribute('object', id);
1143
+ // // Set the id attribute of the element
1144
+ // if (key == '_id')
1145
+ // el.setValue(id)
1146
+ // let state_id = el.getAttribute('state_id');
1147
+ // // Set the state id to the state_ids.
1148
+ // if (state_id) {
1149
+ // state_ids.set(state_id, '');
1150
+ // }
1151
+
1152
+ // if (el.hasAttribute('state-object')) {
1153
+ // let stateObjectId = el.getAttribute('state-object');
1154
+ // // Set the state object id if not set.
1155
+ // if (stateObjectId == '') {
1156
+ // el.setAttribute('state-object', id);
1157
+ // let state_id = el.getAttribute('state_id');
1158
+ // // Set the state id to the state_ids.
1159
+ // if (state_id) {
1160
+ // state_ids.set(state_id, '');
1161
+ // }
1162
+ // }
1163
+ // }
1164
+
1165
+ // // Set the object attribute of all state_ids to the object attribute of all state_ids
1166
+ // if (state_ids.size > 0) {
1167
+ // for (let key of state_ids.keys()) {
1168
+ // let stateEls = document.querySelectorAll(`[state_id="${key}"]`)
1169
+ // for (let stateEl of stateEls) {
1170
+ // // if (stateEl.getAttribute('array') == array){
1171
+ // // Set the object id attribute to the stateEl s object if it is not set.
1172
+ // if (stateEl.getAttribute('object') == '') {
1173
+ // stateEl.setAttribute('object', id);
1174
+ // }
1175
+ // // }
1176
+ // }
1177
+ // }
1178
+ // }
1179
+ // }
1180
+ }
1181
+
1182
+ document.dispatchEvent(
1183
+ new CustomEvent("saved", {
1184
+ detail: data
1185
+ })
1186
+ );
1106
1187
  }
1107
1188
 
1108
1189
  async function remove(element) {
1109
- if (element && !(element instanceof HTMLCollection) && !Array.isArray(element))
1110
- element = [element]
1111
- for (let i = 0; i < element.length; i++) {
1112
- if (element[i].tagName === 'FORM') {
1113
- let form = forms.get(element[i])
1114
- if (!form) return
1115
-
1116
- form = form.elements
1117
- for (let el of form.keys()) {
1118
- let key = elements.get(el)
1119
- if (key) {
1120
- keys.get(key).elements.delete(el)
1121
- elements.delete(el)
1122
- // debounce.delete(key)
1123
- }
1124
- }
1125
- let key = elements.get(element[i])
1126
- if (key) {
1127
- keys.get(key).elements.delete(element[i])
1128
- if (!keys.get(key).elements.size)
1129
- keys.delete(key)
1130
- }
1131
- elements.delete(element[i])
1132
- forms.delete(element[i])
1133
- } else {
1134
-
1135
- let key = elements.get(element[i])
1136
- if (key) {
1137
- if (element[i].getFilter)
1138
- filter.filters.delete(element[i])
1139
- keys.get(key).elements.delete(element[i])
1140
- elements.delete(element[i])
1141
- if (!keys.get(key).elements.size)
1142
- keys.delete(key)
1143
-
1144
- // debounce.delete(key)
1145
- let form = element[i].closest('form')
1146
- form = forms.get(form)
1147
- if (form) {
1148
- form.elements.delete(element[i])
1149
- if (!form.elements.size)
1150
- forms.delete(form)
1151
- }
1152
- } else
1153
- elements.delete(element[i])
1154
-
1155
- }
1156
- }
1190
+ if (
1191
+ element &&
1192
+ !(element instanceof HTMLCollection) &&
1193
+ !Array.isArray(element)
1194
+ )
1195
+ element = [element];
1196
+ for (let i = 0; i < element.length; i++) {
1197
+ if (element[i].tagName === "FORM") {
1198
+ let form = forms.get(element[i]);
1199
+ if (!form) return;
1200
+
1201
+ form = form.elements;
1202
+ for (let el of form.keys()) {
1203
+ let key = elements.get(el);
1204
+ if (key) {
1205
+ keys.get(key).elements.delete(el);
1206
+ elements.delete(el);
1207
+ // debounce.delete(key)
1208
+ }
1209
+ }
1210
+ let key = elements.get(element[i]);
1211
+ if (key) {
1212
+ keys.get(key).elements.delete(element[i]);
1213
+ if (!keys.get(key).elements.size) keys.delete(key);
1214
+ }
1215
+ elements.delete(element[i]);
1216
+ forms.delete(element[i]);
1217
+ } else {
1218
+ let key = elements.get(element[i]);
1219
+ if (key) {
1220
+ if (element[i].getFilter) filter.filters.delete(element[i]);
1221
+ keys.get(key).elements.delete(element[i]);
1222
+ elements.delete(element[i]);
1223
+ if (!keys.get(key).elements.size) keys.delete(key);
1224
+
1225
+ // debounce.delete(key)
1226
+ let form = element[i].closest("form");
1227
+ form = forms.get(form);
1228
+ if (form) {
1229
+ form.elements.delete(element[i]);
1230
+ if (!form.elements.size) forms.delete(form);
1231
+ }
1232
+ } else elements.delete(element[i]);
1233
+ }
1234
+ }
1157
1235
  }
1158
1236
 
1159
1237
  function initSocket() {
1160
- const type = ["storage", "database", "array", "index", "object", 'filter'];
1161
- const method = ['create', 'update', 'delete'];
1162
-
1163
- for (let i = 0; i < type.length; i++) {
1164
- for (let j = 0; j < method.length; j++) {
1165
- const action = type[i] + '.' + method[j];
1166
-
1167
- CRUD.listen(action, function (data) {
1168
- if (data.resolved && data.status === 'received' && CRUD.socket.clientId === data.clientId)
1169
- return
1170
- if (data.rendered)
1171
- return
1172
-
1173
- data.rendered = true
1174
-
1175
- setData(null, data);
1176
- });
1177
- }
1178
- }
1238
+ const type = ["storage", "database", "array", "index", "object", "filter"];
1239
+ const method = ["create", "update", "delete"];
1240
+
1241
+ for (let i = 0; i < type.length; i++) {
1242
+ for (let j = 0; j < method.length; j++) {
1243
+ const action = type[i] + "." + method[j];
1244
+
1245
+ CRUD.listen(action, function (data) {
1246
+ if (
1247
+ data.resolved &&
1248
+ data.status === "received" &&
1249
+ CRUD.socket.clientId === data.clientId
1250
+ )
1251
+ return;
1252
+ if (data.rendered) return;
1253
+
1254
+ data.rendered = true;
1255
+
1256
+ setData(null, data);
1257
+ });
1258
+ }
1259
+ }
1179
1260
  }
1180
1261
 
1181
1262
  Observer.init({
1182
- name: 'render',
1183
- observe: ['addedNodes'],
1184
- selector: '[render-clone]',
1185
- callback: function (mutation) {
1186
- if (!mutation.parentElement.hasAttribute('dnd'))
1187
- return
1188
- let delayTimer = debounce.get(mutation)
1189
- clearTimeout(delayTimer);
1190
- debounce.delete(mutation.target)
1191
-
1192
- let renderedNode = renderedNodes.get(mutation.target)
1193
- if (!renderedNode) return
1194
-
1195
- if (!mutation.movedFrom) return
1196
- let draggedEl = mutation.target
1197
- let draggedFrom = mutation.movedFrom.parentElement
1198
- let droppedEl = mutation.target.nextElementSibling || mutation.target.previousElementSibling
1199
- let droppedIn = mutation.parentElement
1200
-
1201
- if (!draggedFrom || !droppedIn) return
1202
- dndCrud(draggedEl, draggedFrom, droppedEl, droppedIn)
1203
- }
1204
- })
1263
+ name: "render",
1264
+ observe: ["addedNodes"],
1265
+ selector: "[render-clone]",
1266
+ callback: function (mutation) {
1267
+ if (!mutation.parentElement.hasAttribute("dnd")) return;
1268
+ let delayTimer = debounce.get(mutation);
1269
+ clearTimeout(delayTimer);
1270
+ debounce.delete(mutation.target);
1271
+
1272
+ let renderedNode = renderedNodes.get(mutation.target);
1273
+ if (!renderedNode) return;
1274
+
1275
+ if (!mutation.movedFrom) return;
1276
+ let draggedEl = mutation.target;
1277
+ let draggedFrom = mutation.movedFrom.parentElement;
1278
+ let droppedEl =
1279
+ mutation.target.nextElementSibling ||
1280
+ mutation.target.previousElementSibling;
1281
+ let droppedIn = mutation.parentElement;
1282
+
1283
+ if (!draggedFrom || !droppedIn) return;
1284
+ dndCrud(draggedEl, draggedFrom, droppedEl, droppedIn);
1285
+ }
1286
+ });
1205
1287
 
1206
1288
  // TODO: has the potential to work on most of the crud elements specifically if the value is an object or an array
1207
1289
  async function dndCrud(draggedEl, draggedFrom, droppedEl, droppedIn) {
1208
- let from = await dndCrudData(draggedEl, draggedFrom, 'remove')
1209
- let to = await dndCrudData(droppedEl, droppedIn, 'add')
1210
-
1211
- if (from && to && !draggedFrom.isSameNode(droppedIn)) {
1212
- let element = getDataElements(from.data)
1213
- if (!element.length) return
1214
-
1215
- let match = element.find(obj => obj === droppedIn);
1216
- if (!match) {
1217
- if (from.keyPath.includes('.')) {
1218
- let test = { [from.keyPath]: undefined }
1219
-
1220
- from.newData = dotNotationToObject(test, from.newData)
1221
- dndCrudSend(from.newData, 'update')
1222
- } else {
1223
- const index = from.keyPath.match(/\[(\d+)\]/)
1224
- let removeData = from.newData[from.newData.type].splice(index, 1)[0];
1225
- if (removeData) {
1226
- removeData.type = from.newData.type
1227
- removeData[removeData.type] = removeData
1228
- dndCrudSend(removeData, 'delete')
1229
- }
1230
-
1231
- if (from.newData[from.newData.type].length)
1232
- dndCrudSend(from.newData, 'update')
1233
-
1234
- }
1235
- }
1236
- }
1237
-
1238
- if (to)
1239
- dndCrudSend(to.newData, 'update')
1240
-
1290
+ let from = await dndCrudData(draggedEl, draggedFrom, "remove");
1291
+ let to = await dndCrudData(droppedEl, droppedIn, "add");
1292
+
1293
+ if (from && to && !draggedFrom.isSameNode(droppedIn)) {
1294
+ let element = getDataElements(from.data);
1295
+ if (!element.length) return;
1296
+
1297
+ let match = element.find((obj) => obj === droppedIn);
1298
+ if (!match) {
1299
+ if (from.keyPath.includes(".")) {
1300
+ let test = { [from.keyPath]: undefined };
1301
+
1302
+ from.newData = dotNotationToObject(test, from.newData);
1303
+ dndCrudSend(from.newData, "update");
1304
+ } else {
1305
+ const index = from.keyPath.match(/\[(\d+)\]/);
1306
+ let removeData = from.newData[from.newData.type].splice(
1307
+ index,
1308
+ 1
1309
+ )[0];
1310
+ if (removeData) {
1311
+ removeData.type = from.newData.type;
1312
+ removeData[removeData.type] = removeData;
1313
+ dndCrudSend(removeData, "delete");
1314
+ }
1315
+
1316
+ if (from.newData[from.newData.type].length)
1317
+ dndCrudSend(from.newData, "update");
1318
+ }
1319
+ }
1320
+ }
1321
+
1322
+ if (to) dndCrudSend(to.newData, "update");
1241
1323
  }
1242
1324
 
1243
1325
  async function dndCrudData(element, parent, operator) {
1244
- if (!elements.has(parent)) return
1245
- let data = await parent.getData()
1246
- let newData = getObject(parent)
1247
-
1248
- let { Data, sortName, sortDirection, keyPath, clones, index } = dndNewData(element, data)
1249
- newData[newData.type] = []
1250
-
1251
- if (sortName) {
1252
- for (let i = 0; i < clones.length; i++) {
1253
- if (i > index) {
1254
- let previousData = data[data.type][index]
1255
- if (operator === 'add')
1256
- Data[sortName] = i + 1
1257
- else if (operator === 'remove')
1258
- Data[sortName] = i - 1
1259
-
1260
- newData[newData.type].push({ ...previousData, ...Data })
1261
- }
1262
- }
1263
-
1264
-
1265
- } else {
1266
- newData[newData.type] = [{ ...data[data.type][index], ...Data }]
1267
- }
1268
-
1269
- return { data, newData, keyPath, clones, index }
1326
+ if (!elements.has(parent)) return;
1327
+ let data = await parent.getData();
1328
+ let newData = getObject(parent);
1329
+
1330
+ let { Data, sortName, sortDirection, keyPath, clones, index } = dndNewData(
1331
+ element,
1332
+ data
1333
+ );
1334
+ newData[newData.type] = [];
1335
+
1336
+ if (sortName) {
1337
+ for (let i = 0; i < clones.length; i++) {
1338
+ if (i > index) {
1339
+ let previousData = data[data.type][index];
1340
+ if (operator === "add") Data[sortName] = i + 1;
1341
+ else if (operator === "remove") Data[sortName] = i - 1;
1342
+
1343
+ newData[newData.type].push({ ...previousData, ...Data });
1344
+ }
1345
+ }
1346
+ } else {
1347
+ newData[newData.type] = [{ ...data[data.type][index], ...Data }];
1348
+ }
1349
+
1350
+ return { data, newData, keyPath, clones, index };
1270
1351
  }
1271
1352
 
1272
1353
  function dndNewData(element, data) {
1273
- let Data = {}
1274
- if (data.$filter.query) {
1275
- dndNewDataUpdate(Data, data.$filter.query)
1276
- }
1277
-
1278
- let sortName, sortDirection
1279
- let sort = data.$filter.sort
1280
- if (sort && sort.length) {
1281
- // for (let i = 0; i < sort.length; i++) {
1282
- for (let i = sort.length - 1; i >= 0; i--) {
1283
- if (typeof data[sort.key] === 'number') {
1284
- sortName = sort.key
1285
- sortDirection = sort.direction
1286
- break
1287
- }
1288
- }
1289
- }
1290
-
1291
- let keyPath, clonesMap, clones, index
1292
-
1293
- let renderedNode = renderedNodes.get(element)
1294
- if (renderedNode) {
1295
- keyPath = renderedNode.keyPath
1296
- clonesMap = renderedNode.template.clones
1297
- clones = Array.from(clonesMap.values());
1298
- index = clones.indexOf(element);
1299
- }
1300
-
1301
- return { Data, sortName, sortDirection, keyPath, clones, index }
1302
-
1354
+ let Data = {};
1355
+ if (data.$filter.query) {
1356
+ dndNewDataUpdate(Data, data.$filter.query);
1357
+ }
1358
+
1359
+ let sortName, sortDirection;
1360
+ let sort = data.$filter.sort;
1361
+ if (sort && sort.length) {
1362
+ // for (let i = 0; i < sort.length; i++) {
1363
+ for (let i = sort.length - 1; i >= 0; i--) {
1364
+ if (typeof data[sort.key] === "number") {
1365
+ sortName = sort.key;
1366
+ sortDirection = sort.direction;
1367
+ break;
1368
+ }
1369
+ }
1370
+ }
1371
+
1372
+ let keyPath, clonesMap, clones, index;
1373
+
1374
+ let renderedNode = renderedNodes.get(element);
1375
+ if (renderedNode) {
1376
+ keyPath = renderedNode.keyPath;
1377
+ clonesMap = renderedNode.template.clones;
1378
+ clones = Array.from(clonesMap.values());
1379
+ index = clones.indexOf(element);
1380
+ }
1381
+
1382
+ return { Data, sortName, sortDirection, keyPath, clones, index };
1303
1383
  }
1304
1384
 
1305
1385
  function dndNewDataUpdate(Data, query) {
1306
- for (let key of Object.keys(query)) {
1307
- if (key === '$and' || key === '$or' || key === '$nor') {
1308
- for (let i = 0; i < query[key].length; i++) {
1309
- dndNewDataUpdate(Data, query[key][i])
1310
- }
1311
- } else if (typeof query[key] === 'object' && !Array.isArray(query[key])) {
1312
- if (query[key].$eq)
1313
- Data[key] = query[key].$eq
1314
- if (query[key].$ne)
1315
- Data[key] = query[key].$ne
1316
- } else {
1317
- Data[key] = query[key]
1318
- }
1319
- }
1386
+ for (let key of Object.keys(query)) {
1387
+ if (key === "$and" || key === "$or" || key === "$nor") {
1388
+ for (let i = 0; i < query[key].length; i++) {
1389
+ dndNewDataUpdate(Data, query[key][i]);
1390
+ }
1391
+ } else if (
1392
+ typeof query[key] === "object" &&
1393
+ !Array.isArray(query[key])
1394
+ ) {
1395
+ if (query[key].$eq) Data[key] = query[key].$eq;
1396
+ if (query[key].$ne) Data[key] = query[key].$ne;
1397
+ } else {
1398
+ Data[key] = query[key];
1399
+ }
1400
+ }
1320
1401
  }
1321
1402
 
1322
1403
  function dndCrudSend(data, crudType) {
1323
- if (CRUD) {
1324
- let action = data.type;
1325
- action = action.charAt(0).toUpperCase() + action.slice(1);
1326
- CRUD[crudType + action](data)
1327
- } else
1328
- console.log('dnd reordered data set as crud is unavailable')
1404
+ if (CRUD) {
1405
+ let action = data.type;
1406
+ action = action.charAt(0).toUpperCase() + action.slice(1);
1407
+ CRUD[crudType + action](data);
1408
+ } else console.log("dnd reordered data set as crud is unavailable");
1329
1409
  }
1330
1410
 
1331
1411
  Observer.init({
1332
- name: 'CoCreateElementsChildList',
1333
- observe: ['childList'],
1334
- selector: selector,
1335
- callback: function (mutation) {
1336
- init(mutation.addedNodes);
1337
- }
1412
+ name: "CoCreateElementsChildList",
1413
+ observe: ["childList"],
1414
+ selector: selector,
1415
+ callback: function (mutation) {
1416
+ init(mutation.addedNodes);
1417
+ }
1338
1418
  });
1339
1419
 
1340
1420
  Observer.init({
1341
- name: 'CoCreateElementsRemovedNodes',
1342
- observe: ['removedNodes'],
1343
- selector: selector,
1344
- callback: function (mutation) {
1345
- // if (mutation.target.parentElement) return
1346
- // if (mutation.target.parentElement) {
1347
- // let delayTimer = setTimeout(function () {
1348
- // debounce.delete(mutation.target)
1349
- // remove(mutation.target)
1350
- // }, 3000);
1351
- // debounce.set(mutation.target, delayTimer)
1352
- // } else
1353
- if (mutation.target.hasAttribute('render-clone'))
1354
- return
1355
- remove(mutation.target)
1356
- }
1421
+ name: "CoCreateElementsRemovedNodes",
1422
+ observe: ["removedNodes"],
1423
+ selector: selector,
1424
+ callback: function (mutation) {
1425
+ // if (mutation.target.parentElement) return
1426
+ // if (mutation.target.parentElement) {
1427
+ // let delayTimer = setTimeout(function () {
1428
+ // debounce.delete(mutation.target)
1429
+ // remove(mutation.target)
1430
+ // }, 3000);
1431
+ // debounce.set(mutation.target, delayTimer)
1432
+ // } else
1433
+ if (mutation.target.hasAttribute("render-clone")) return;
1434
+ remove(mutation.target);
1435
+ }
1357
1436
  });
1358
1437
 
1359
1438
  Observer.init({
1360
- name: 'CoCreateElementsAttributes',
1361
- observe: ['attributes'],
1362
- attributeName: ['storage', 'database', 'array', 'index', 'object', 'key'],
1363
- // target: selector, // blocks mutations when applied
1364
- callback: function (mutation) {
1365
- let currentValue = mutation.target.getAttribute(mutation.attributeName)
1366
- if (currentValue !== mutation.oldValue) {
1367
- remove(mutation.target)
1368
- if (mutation.target.tagName === 'FORM')
1369
- return
1370
- init([mutation.target])
1371
- }
1372
- }
1439
+ name: "CoCreateElementsAttributes",
1440
+ observe: ["attributes"],
1441
+ attributeName: ["storage", "database", "array", "index", "object", "key"],
1442
+ // target: selector, // blocks mutations when applied
1443
+ callback: function (mutation) {
1444
+ let currentValue = mutation.target.getAttribute(mutation.attributeName);
1445
+ if (currentValue !== mutation.oldValue) {
1446
+ remove(mutation.target);
1447
+ if (mutation.target.tagName === "FORM") return;
1448
+ init([mutation.target]);
1449
+ }
1450
+ }
1373
1451
  });
1374
1452
 
1375
1453
  Actions.init([
1376
- {
1377
- name: "save",
1378
- endEvent: "saved",
1379
- callback: (action) => {
1380
- if (action.form)
1381
- save(action.form);
1382
- }
1383
- },
1384
- {
1385
- name: "delete",
1386
- endEvent: "deleted",
1387
- callback: async (action) => {
1388
- let elements = queryElements({ element: action.element, prefix: 'delete' });
1389
- if (elements === false)
1390
- elements = [action.element]
1391
-
1392
- for (let i = 0; i < elements.length; i++) {
1393
- const data = getObject(elements[i]);
1394
- if (!data) return
1395
- data.method = data.type + '.delete'
1396
-
1397
- if (elements[i].renderValue) {
1398
- let selected = elements[i].querySelectorAll('.selected')
1399
- data[data.type] = []
1400
- for (let j = 0; j < selected.length; j++) {
1401
- let attribute = selected[j].getAttribute(data.type)
1402
- if (attribute) {
1403
- attribute = attribute.split(',')
1404
- for (let k = 0; k < attribute.length; k++) {
1405
- if (data.type === 'object')
1406
- data[data.type].push({ _id: attribute[k] })
1407
- else {
1408
- data[data.type].push(attribute[k])
1409
- }
1410
- }
1411
- }
1412
- }
1413
- } else if (data.type === 'object' && typeof data[data.type] === 'string')
1414
- data[data.type] = { _id: data[data.type] }
1415
-
1416
- let response = await CRUD.send(data)
1417
- document.dispatchEvent(new CustomEvent('deleted', {
1418
- detail: response
1419
- }));
1420
- }
1421
- }
1422
- }
1454
+ {
1455
+ name: "save",
1456
+ endEvent: "saved",
1457
+ callback: (action) => {
1458
+ if (action.form) save(action.form);
1459
+ }
1460
+ },
1461
+ {
1462
+ name: "delete",
1463
+ endEvent: "deleted",
1464
+ callback: async (action) => {
1465
+ let elements = queryElements({
1466
+ element: action.element,
1467
+ prefix: "delete"
1468
+ });
1469
+ if (elements === false) elements = [action.element];
1470
+
1471
+ for (let i = 0; i < elements.length; i++) {
1472
+ const data = getObject(elements[i]);
1473
+ if (!data) return;
1474
+ data.method = data.type + ".delete";
1475
+
1476
+ if (elements[i].renderValue) {
1477
+ let selected = elements[i].querySelectorAll(".selected");
1478
+ data[data.type] = [];
1479
+ for (let j = 0; j < selected.length; j++) {
1480
+ let attribute = selected[j].getAttribute(data.type);
1481
+ if (attribute) {
1482
+ attribute = attribute.split(",");
1483
+ for (let k = 0; k < attribute.length; k++) {
1484
+ if (data.type === "object")
1485
+ data[data.type].push({ _id: attribute[k] });
1486
+ else {
1487
+ data[data.type].push(attribute[k]);
1488
+ }
1489
+ }
1490
+ }
1491
+ }
1492
+ } else if (
1493
+ data.type === "object" &&
1494
+ typeof data[data.type] === "string"
1495
+ )
1496
+ data[data.type] = { _id: data[data.type] };
1497
+
1498
+ let response = await CRUD.send(data);
1499
+ document.dispatchEvent(
1500
+ new CustomEvent("deleted", {
1501
+ detail: response
1502
+ })
1503
+ );
1504
+ }
1505
+ }
1506
+ }
1423
1507
  ]);
1424
1508
 
1425
1509
  init();
1426
1510
 
1427
- export default { init, read, save, getData, getObject, reset, elements, keys, forms, debounce, getAttributes, setTypeValue };
1511
+ export default {
1512
+ init,
1513
+ read,
1514
+ save,
1515
+ getData,
1516
+ getObject,
1517
+ reset,
1518
+ elements,
1519
+ keys,
1520
+ forms,
1521
+ debounce,
1522
+ getAttributes,
1523
+ setTypeValue
1524
+ };