Skip to content

Commit 4ed5abc

Browse files
committed
v20 optimalization.
1 parent 459586e commit 4ed5abc

File tree

9 files changed

+72
-48
lines changed

9 files changed

+72
-48
lines changed

j-Configuration/component.js

Lines changed: 27 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -57,13 +57,19 @@ COMPONENT('configuration', 'dateformat:yyyy-MM-dd', function(self, config, cls)
5757
prev.element.aclass(cls + '-last');
5858
};
5959

60-
self.types = {};
60+
self.compilefn = function(fn) {
61+
var index = fn.indexOf('=>');
62+
if (index !== -1)
63+
fn = fn.substring(index + 2);
64+
return new Function('value', 'model', fn);
65+
};
6166

67+
self.types = {};
6268
self.types.template = function(item) {
6369

6470
var icon = '';
6571
if (item.icon)
66-
icon = '<i class="' + self.faicon(item.icon) + '"></i>';
72+
icon = '<i class="' + self.icon(item.icon) + '"></i>';
6773

6874
var builder = [];
6975
var align = item.align || 0;
@@ -101,30 +107,35 @@ COMPONENT('configuration', 'dateformat:yyyy-MM-dd', function(self, config, cls)
101107
val = T.prepare(val);
102108
if (old != val) {
103109
model[item.id] = val;
104-
if (empty)
105-
SET(self.path, model);
106-
else
107-
UPD(self.path + '.' + item.id, 2);
110+
111+
if (empty) {
112+
self.bind('@modified @touched', model);
113+
} else {
114+
self.bind('@modified @touched');
115+
UPD(self.path.toString() + '.' + item.id);
116+
}
117+
108118
self.change(true);
109119
return true;
110120
}
111121
};
112122

113123
var el = $(builder.join(''));
114124
item.required && el.aclass(cls + '-required');
125+
115126
var control = el.find(cls2 + '-item-control');
116127
var type = self.types[item.type || 'string'](item, control, set, get);
128+
117129
T = type;
118130
type.element = el;
119131
type.control = control;
120132
type.id = item.id;
121133
type.required = item.required;
122134

123-
var fndisable = item.disable ? FN(item.disable) : null;
124-
135+
var fndisable = item.disable ? self.compilefn(item.disable) : null;
125136
if (fndisable) {
126137
type.$disable = function(model) {
127-
var is = !!fndisable(model);
138+
var is = !!fndisable(model, model);
128139
item.button && type.element.find(cls2 + '-button button').prop('disabled', is);
129140
type.isdisabled = is;
130141
return is;
@@ -134,10 +145,10 @@ COMPONENT('configuration', 'dateformat:yyyy-MM-dd', function(self, config, cls)
134145
type.isdisabled = false;
135146
}
136147

137-
var fnvisible = item.visible ? FN(item.visible) : null;
148+
var fnvisible = item.visible ? self.compilefn(item.visible) : null;
138149
if (fnvisible) {
139150
type.$visible = function(model) {
140-
var is = !!fnvisible(model);
151+
var is = !!fnvisible(model, model);
141152
type.isvisible = is;
142153
return is;
143154
};
@@ -160,11 +171,11 @@ COMPONENT('configuration', 'dateformat:yyyy-MM-dd', function(self, config, cls)
160171
};
161172

162173
self.types.string = function(item, el, set, get) {
174+
163175
var obj = {};
164176

165177
obj.bind = function(val) {
166178
var input = el.find('input');
167-
168179
if (item.camouflage) {
169180
var arr = [];
170181
for (var i = 0; i < val.length; i++)
@@ -272,7 +283,7 @@ COMPONENT('configuration', 'dateformat:yyyy-MM-dd', function(self, config, cls)
272283

273284
var icon = '';
274285
if (item.icon)
275-
icon = '<i class="' + self.faicon(item.icon) + '"></i>';
286+
icon = '<i class="' + self.icon(item.icon) + '"></i>';
276287

277288
var builder = ['<div>'];
278289
builder.push('<div class="{0}-group">{1}</div>'.format(cls, icon + item.name || item.text));
@@ -576,7 +587,7 @@ COMPONENT('configuration', 'dateformat:yyyy-MM-dd', function(self, config, cls)
576587
var builder = [];
577588

578589
for (var i = 0; i < items.length; i++)
579-
builder.push('<div class="{0}-type-selectable-item"><i class="{icon}"></i><span>{name}</div>'.format(cls).arg(items[i]));
590+
builder.push('<div class="{0}-type-selectable-item"><i class="{icon}"></i><span>{name}</div>'.format(cls).args(items[i]));
580591

581592
el.append('<div class="{0}-type-selectable">{1}</div>'.format(cls, builder.join('')));
582593

@@ -667,7 +678,8 @@ COMPONENT('configuration', 'dateformat:yyyy-MM-dd', function(self, config, cls)
667678
if (!value)
668679
value = {};
669680

670-
var diff = path.substring(self.path.length + 1);
681+
var p = self.path.toString();
682+
var diff = path.substring(p.length + 1);
671683

672684
for (var key in value) {
673685
var val = value[key];

j-Configuration/component.json

Lines changed: 2 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,8 @@
11
{
22
"datecreated": "2021-06-16T23:29:13.000Z",
3-
"dateupdated": "2023-11-09T22:34:00.000Z",
3+
"dateupdated": "2023-11-09T22:34:01.000Z",
44
"name": "j-Configuration",
5-
"tags": [
6-
"config",
7-
"form"
8-
],
5+
"jcomponent": "19|20",
96
"color": "transparent",
107
"version": 1,
118
"responsive": true,

j-Configuration/readme.md

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
## j-Configuration
22

3-
- easy usage
3+
- jComponent `v19|v20`
44
- supports __dark mode__
55

66
__Configuration__:
@@ -28,8 +28,8 @@ __Allowed properties__:
2828
- `summary {String}` optional, a summarization
2929
- `note {String}` optional, a note
3030
- `required {Boolean}` optional, is the property required?
31-
- `disable {String}` optional, declaration of arrow function in the form `model => model.interval === 100`
32-
- `visible {String}` optional, declaration of arrow function in the form `model => model.interval === 100`
31+
- `disable {String}` optional, declaration of arrow function in the form `value.interval === 100`
32+
- `visible {String}` optional, declaration of arrow function in the form `value.interval === 100`
3333
- `button {String}` optional, creates a small button
3434
- `click {String}` optional, a link to the method (depends on the `button`)
3535
- `maxlength {Number}` optional, supports only `string` type

j-DatePicker/component.json

Lines changed: 2 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,8 @@
11
{
22
"datecreated": "2019-02-06T21:33:00.000Z",
3-
"dateupdated": "2024-05-02T15:40:01.000Z",
3+
"dateupdated": "2024-05-02T15:40:02.000Z",
44
"name": "j-DatePicker",
5-
"tags": [
6-
"datepicker",
7-
"calendar"
8-
],
5+
"jcomponent": "19|20",
96
"color": "white",
107
"version": 1,
118
"responsive": true,

j-DatePicker/example.html

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -17,6 +17,6 @@
1717
}, 1000);
1818
};
1919

20-
SETTER('datepicker', 'show', opt);
20+
SETTER('datepicker/show', opt);
2121
});
2222
</script>

j-DatePicker/readme.md

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,6 @@
11
## j-DatePicker
22

3+
- jComponent `v19|v20`
34
- it's improved clone of `j-Calendar`
45
- supports __dark mode__
56
- supports __touch gestures (swipe)__ and fixed full size on mobile

j-ListForm/component.js

Lines changed: 27 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -68,42 +68,54 @@ COMPONENT('listform', 'empty:---;default:1;', function(self, config, cls) {
6868
var el = $(this);
6969
var parent = el.closest(cls2 + '-item');
7070
var tmp;
71+
var fn;
7172

7273
if (parent.length) {
73-
var tmp = parent[0].$data;
74+
var data = parent[0].$data;
7475
self.cancel();
7576
e.stopPropagation();
7677
switch (this.name) {
7778
case 'up':
7879
case 'down':
79-
el.closest('.ui-listform-item').aclass('ui-listform-item-highlight');
80-
el.closest('.ui-listform-item').rclass(('ui-listform-item-highlight'), 1000);
81-
var index = items.indexOf(tmp);
82-
var tmp = index + (this.name === 'up' ? -1 : 1);
80+
tmp = parent.aclass(cls + '-item-highlight');
81+
tmp.rclass(cls + '-item-highlight', 1000);
82+
var index = items.indexOf(data);
83+
84+
tmp = index + (this.name === 'up' ? -1 : 1);
8385
if (tmp < 0 || tmp >= items.length)
8486
return;
87+
8588
var a = items[tmp];
8689
items[tmp] = items[index];
8790
items[index] = a;
8891
NODEMOVE(parent[0], this.name === 'up');
8992
skip = true;
90-
self.set(items, 2);
91-
self.change(true);
93+
self.bind('@modified @touched @setter', items);
9294
config.move && self.EXEC(config.move, items);
9395
break;
96+
9497
case 'remove':
95-
items.splice(items.indexOf(tmp), 1);
96-
skip = true;
97-
self.set(items, 2);
98-
self.change(true);
99-
parent.remove();
98+
99+
fn = function(is) {
100+
self.cancel();
101+
if (is !== false && data) {
102+
parent.remove();
103+
items.splice(items.indexOf(data), 1);
104+
skip = true;
105+
self.bind('@modified @touched @setter', items);
106+
}
107+
};
108+
109+
if (config.remove)
110+
self.EXEC(config.remove, data, fn, self.get());
111+
else
112+
fn();
100113
break;
101114
}
102115
return;
103116
}
104117

105118
var is = false;
106-
var fn;
107119

108120
switch (this.name) {
109121

@@ -150,8 +162,7 @@ COMPONENT('listform', 'empty:---;default:1;', function(self, config, cls) {
150162
self.create(tmp);
151163
}
152164
skip = true;
153-
self.set(items, 2);
154-
self.change(true);
165+
self.bind('@modified @touched @setter', items);
155166
}
156167
self.cancel();
157168
};
@@ -180,8 +191,7 @@ COMPONENT('listform', 'empty:---;default:1;', function(self, config, cls) {
180191
el.parentNode.removeChild(el);
181192
items.splice(items.indexOf(data), 1);
182193
skip = true;
183-
self.set(items, 2);
184-
self.change(true);
194+
self.bind('@modified @touched @setter', items);
185195
}
186196
};
187197

j-ListForm/component.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"datecreated": "2020-02-13T13:30:06.000Z",
3-
"dateupdated": "2024-06-14T13:10:00.000Z",
3+
"dateupdated": "2024-06-14T13:10:01.000Z",
44
"name": "j-ListForm",
55
"tags": [
66
"list",

j-ListForm/example.html

Lines changed: 8 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -13,7 +13,14 @@
1313

1414
<!-- LIST RENDERING -->
1515
<script type="text/html">
16-
<div>{{ name }}</div>
16+
<div>
17+
<div class="pull-right">
18+
<button name="up"><i class="ti ti-arrow-up"></i></button>
19+
<button name="down"><i class="ti ti-arrow-down"></i></button>
20+
<button name="remove"><i class="ti ti-remove"></i></button>
21+
</div>
22+
{{ name }}
23+
</div>
1724
</script>
1825

1926
<!-- FORM RENDERING -->

0 commit comments

Comments
 (0)