neo.mjs 8.0.0-alpha.1 → 8.0.0-beta.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.
- package/.github/CODING_GUIDELINES.md +5 -5
- package/.github/CONCEPT.md +10 -10
- package/apps/ServiceWorker.mjs +2 -2
- package/apps/covid/view/MainContainer.mjs +14 -14
- package/apps/covid/view/TableContainer.mjs +2 -2
- package/apps/portal/index.html +1 -1
- package/apps/portal/view/ViewportController.mjs +2 -2
- package/apps/portal/view/examples/TabContainer.mjs +11 -11
- package/apps/portal/view/home/FooterContainer.mjs +1 -1
- package/apps/portal/view/home/parts/MainNeo.mjs +6 -2
- package/apps/realworld/view/article/CreateComponent.mjs +1 -1
- package/apps/realworld2/view/HomeContainer.mjs +7 -7
- package/apps/sharedcovid/view/MainContainer.mjs +17 -17
- package/apps/sharedcovid/view/TableContainer.mjs +2 -2
- package/buildScripts/createApp.mjs +2 -2
- package/buildScripts/createClass.mjs +4 -6
- package/docs/app/view/ContentTabContainer.mjs +1 -1
- package/docs/app/view/MainContainer.mjs +3 -3
- package/docs/app/view/MainContainerController.mjs +9 -9
- package/examples/ServiceWorker.mjs +2 -2
- package/examples/component/mwc/buttons/MainContainer.mjs +2 -2
- package/examples/component/mwc/textFields/MainContainer.mjs +2 -2
- package/examples/fields/MainContainer.mjs +197 -228
- package/examples/preloadingAssets/view/MainContainer.mjs +2 -2
- package/examples/tab/container/MainContainer.mjs +7 -9
- package/examples/tabs/MainContainer.mjs +3 -3
- package/examples/tabs/MainContainer2.mjs +4 -4
- package/examples/videoMove/MainContainer.mjs +14 -7
- package/examples/viewport/MainContainer.mjs +3 -3
- package/package.json +6 -6
- package/resources/data/deck/learnneo/pages/benefits/FormsEngine.md +13 -13
- package/resources/data/deck/learnneo/pages/benefits/Speed.md +5 -4
- package/resources/data/deck/training/pages/2022-12-27T21-55-23-144Z.md +2 -2
- package/resources/data/deck/training/pages/2022-12-28T17-11-34-653Z.md +6 -6
- package/resources/data/deck/training/pages/2022-12-29T18-36-08-226Z.md +2 -2
- package/resources/data/deck/training/pages/2022-12-29T18-36-56-893Z.md +2 -2
- package/resources/data/deck/training/pages/2022-12-29T20-37-08-919Z.md +2 -2
- package/resources/data/deck/training/pages/2022-12-29T20-37-20-344Z.md +2 -2
- package/resources/data/deck/training/pages/2023-01-01T21-11-58-025Z.md +3 -3
- package/resources/data/deck/training/pages/2023-01-16T20-24-09-690Z.md +4 -4
- package/resources/data/deck/training/pages/2023-02-05T17-44-53-815Z.md +3 -3
- package/resources/data/deck/training/pages/2023-02-05T17-45-40-114Z.md +1 -1
- package/resources/scss/src/calendar/view/week/Component.scss +6 -0
- package/resources/scss/src/component/DateSelector.scss +1 -0
- package/src/DefaultConfig.mjs +2 -2
- package/src/calendar/view/MainContainer.mjs +4 -1
- package/src/calendar/view/SettingsContainer.mjs +13 -28
- package/src/calendar/view/YearComponent.mjs +0 -3
- package/src/calendar/view/calendars/ColorsList.mjs +5 -0
- package/src/calendar/view/calendars/List.mjs +8 -0
- package/src/code/LivePreview.mjs +10 -10
- package/src/component/Base.mjs +88 -55
- package/src/container/Base.mjs +2 -2
- package/src/form/field/Text.mjs +1 -1
- package/src/form/field/Time.mjs +5 -3
- package/src/form/field/trigger/Time.mjs +2 -1
- package/src/layout/Card.mjs +10 -6
- package/src/layout/Cube.mjs +15 -4
- package/src/list/Base.mjs +7 -1
- package/src/list/Color.mjs +3 -3
- package/src/main/DomEvents.mjs +1 -1
- package/src/main/DomUtils.mjs +39 -36
- package/src/tab/Container.mjs +3 -5
- package/src/toolbar/Base.mjs +26 -8
- package/src/util/VNode.mjs +6 -8
- package/src/vdom/Helper.mjs +19 -6
@@ -29,260 +29,229 @@ class MainContainer extends Container {
|
|
29
29
|
margin: '20px'
|
30
30
|
},
|
31
31
|
|
32
|
-
items: [
|
33
|
-
|
34
|
-
ntype: 'container',
|
32
|
+
items: [{
|
33
|
+
ntype: 'container',
|
35
34
|
|
36
|
-
|
37
|
-
|
38
|
-
|
39
|
-
|
40
|
-
|
41
|
-
layout: {
|
42
|
-
ntype: 'vbox'
|
43
|
-
},
|
35
|
+
itemDefaults: {
|
36
|
+
flex : '0 1 auto',
|
37
|
+
labelWidth: '70px'
|
38
|
+
},
|
44
39
|
|
45
|
-
|
46
|
-
|
47
|
-
|
48
|
-
id : 'myPickerfield',
|
49
|
-
labelText: 'Picker',
|
50
|
-
width : 220
|
51
|
-
},
|
52
|
-
{
|
53
|
-
module : Button,
|
54
|
-
iconCls: 'fa fa-minus',
|
55
|
-
style : {marginTop: '20px'},
|
56
|
-
text : 'Remove Triggers',
|
57
|
-
width : 120,
|
58
|
-
handler: function() {
|
59
|
-
let field = Neo.getComponent('myPickerfield');
|
60
|
-
field.triggers = [];
|
61
|
-
}
|
62
|
-
},
|
63
|
-
{
|
64
|
-
module : Button,
|
65
|
-
iconCls: 'fa fa-plus',
|
66
|
-
text : 'Add Trigger',
|
67
|
-
width : 120,
|
68
|
-
handler: function() {
|
69
|
-
let field = Neo.getComponent('myPickerfield'),
|
70
|
-
fieldTriggers = field.triggers || [],
|
71
|
-
triggers = [...fieldTriggers]; // ensure to clone the array to not edit the internal oldValue by reference
|
40
|
+
layout: {
|
41
|
+
ntype: 'vbox'
|
42
|
+
},
|
72
43
|
|
73
|
-
|
74
|
-
|
75
|
-
|
76
|
-
|
77
|
-
|
44
|
+
items: [{
|
45
|
+
ntype : 'pickerfield',
|
46
|
+
id : 'myPickerfield',
|
47
|
+
labelText: 'Picker',
|
48
|
+
width : 220
|
49
|
+
}, {
|
50
|
+
module : Button,
|
51
|
+
iconCls: 'fa fa-minus',
|
52
|
+
style : {marginTop: '20px'},
|
53
|
+
text : 'Remove Triggers',
|
54
|
+
width : 120,
|
55
|
+
handler: function() {
|
56
|
+
let field = Neo.getComponent('myPickerfield');
|
57
|
+
field.triggers = [];
|
58
|
+
}
|
59
|
+
}, {
|
60
|
+
module : Button,
|
61
|
+
iconCls: 'fa fa-plus',
|
62
|
+
text : 'Add Trigger',
|
63
|
+
width : 120,
|
64
|
+
handler: function() {
|
65
|
+
let field = Neo.getComponent('myPickerfield'),
|
66
|
+
fieldTriggers = field.triggers || [],
|
67
|
+
triggers = [...fieldTriggers]; // ensure to clone the array to not edit the internal oldValue by reference
|
78
68
|
|
79
|
-
|
80
|
-
|
81
|
-
|
82
|
-
|
69
|
+
triggers.push({
|
70
|
+
id : Neo.getId('picker'),
|
71
|
+
cls : 'fa fa-caret-down',
|
72
|
+
handler: 'onPickerTriggerClick'
|
73
|
+
});
|
83
74
|
|
84
|
-
|
85
|
-
iconCls: 'fas fa-list',
|
86
|
-
text : 'Picker'
|
75
|
+
field.triggers = triggers;
|
87
76
|
}
|
77
|
+
}],
|
78
|
+
|
79
|
+
header: {
|
80
|
+
iconCls: 'fas fa-list',
|
81
|
+
text : 'Picker'
|
82
|
+
}
|
83
|
+
}, {
|
84
|
+
ntype: 'container',
|
85
|
+
|
86
|
+
itemDefaults: {
|
87
|
+
flex : '0 1 auto',
|
88
|
+
labelWidth: '70px'
|
88
89
|
},
|
89
|
-
{
|
90
|
-
ntype: 'container',
|
91
90
|
|
92
|
-
|
93
|
-
|
94
|
-
|
95
|
-
},
|
91
|
+
layout: {
|
92
|
+
ntype: 'vbox'
|
93
|
+
},
|
96
94
|
|
97
|
-
|
98
|
-
|
99
|
-
|
95
|
+
items: [{
|
96
|
+
ntype : 'checkboxfield',
|
97
|
+
checked : true,
|
98
|
+
labelText: 'Option 1',
|
99
|
+
name : 'group1'
|
100
|
+
}, {
|
101
|
+
ntype : 'checkboxfield',
|
102
|
+
labelText: 'Option 2',
|
103
|
+
name : 'group1'
|
104
|
+
}, {
|
105
|
+
ntype : 'checkboxfield',
|
106
|
+
labelText: 'Option 3',
|
107
|
+
name : 'group1'
|
108
|
+
}, {
|
109
|
+
ntype : 'checkboxfield',
|
110
|
+
checked : true,
|
111
|
+
hideValueLabel: false,
|
112
|
+
labelText : 'Group 2',
|
113
|
+
name : 'group2',
|
114
|
+
style : {marginTop: '20px'},
|
115
|
+
valueLabelText: 'Option 1'
|
116
|
+
}, {
|
117
|
+
ntype : 'checkboxfield',
|
118
|
+
hideValueLabel: false,
|
119
|
+
labelText : '',
|
120
|
+
name : 'group2',
|
121
|
+
valueLabelText: 'Option 2'
|
122
|
+
}, {
|
123
|
+
ntype : 'checkboxfield',
|
124
|
+
hideValueLabel: false,
|
125
|
+
labelText : '',
|
126
|
+
name : 'group2',
|
127
|
+
valueLabelText: 'Option 3'
|
128
|
+
}],
|
100
129
|
|
101
|
-
|
102
|
-
|
103
|
-
|
104
|
-
|
105
|
-
|
106
|
-
|
107
|
-
},
|
108
|
-
{
|
109
|
-
ntype : 'checkboxfield',
|
110
|
-
labelText: 'Option 2',
|
111
|
-
name : 'group1'
|
112
|
-
},
|
113
|
-
{
|
114
|
-
ntype : 'checkboxfield',
|
115
|
-
labelText: 'Option 3',
|
116
|
-
name : 'group1'
|
117
|
-
},
|
118
|
-
{
|
119
|
-
ntype : 'checkboxfield',
|
120
|
-
checked : true,
|
121
|
-
hideValueLabel: false,
|
122
|
-
labelText : 'Group 2',
|
123
|
-
name : 'group2',
|
124
|
-
style : {marginTop: '20px'},
|
125
|
-
valueLabelText: 'Option 1'
|
126
|
-
},
|
127
|
-
{
|
128
|
-
ntype : 'checkboxfield',
|
129
|
-
hideValueLabel: false,
|
130
|
-
labelText : '',
|
131
|
-
name : 'group2',
|
132
|
-
valueLabelText: 'Option 2'
|
133
|
-
},
|
134
|
-
{
|
135
|
-
ntype : 'checkboxfield',
|
136
|
-
hideValueLabel: false,
|
137
|
-
labelText : '',
|
138
|
-
name : 'group2',
|
139
|
-
valueLabelText: 'Option 3'
|
140
|
-
}
|
141
|
-
],
|
130
|
+
header: {
|
131
|
+
iconCls: 'fas fa-check-square',
|
132
|
+
text : 'CheckBox'
|
133
|
+
}
|
134
|
+
}, {
|
135
|
+
ntype: 'container',
|
142
136
|
|
143
|
-
|
144
|
-
|
145
|
-
|
146
|
-
}
|
137
|
+
itemDefaults: {
|
138
|
+
flex : '0 1 auto',
|
139
|
+
labelWidth: '70px'
|
147
140
|
},
|
148
|
-
{
|
149
|
-
ntype: 'container',
|
150
141
|
|
151
|
-
|
152
|
-
|
153
|
-
|
154
|
-
},
|
142
|
+
layout: {
|
143
|
+
ntype: 'vbox'
|
144
|
+
},
|
155
145
|
|
156
|
-
|
157
|
-
|
158
|
-
|
146
|
+
items: [{
|
147
|
+
ntype : 'radiofield',
|
148
|
+
checked : true,
|
149
|
+
labelText: 'Option 1',
|
150
|
+
name : 'group1'
|
151
|
+
}, {
|
152
|
+
ntype : 'radiofield',
|
153
|
+
labelText: 'Option 2',
|
154
|
+
name : 'group1'
|
155
|
+
}, {
|
156
|
+
ntype : 'radiofield',
|
157
|
+
labelText: 'Option 3',
|
158
|
+
name : 'group1'
|
159
|
+
}, {
|
160
|
+
ntype : 'radiofield',
|
161
|
+
checked : true,
|
162
|
+
hideValueLabel: false,
|
163
|
+
labelText : 'Group 2',
|
164
|
+
name : 'group2',
|
165
|
+
style : {marginTop: '20px'},
|
166
|
+
valueLabelText: 'Option 1'
|
167
|
+
}, {
|
168
|
+
ntype : 'radiofield',
|
169
|
+
hideValueLabel: false,
|
170
|
+
labelText : '',
|
171
|
+
name : 'group2',
|
172
|
+
valueLabelText: 'Option 2'
|
173
|
+
}, {
|
174
|
+
ntype : 'radiofield',
|
175
|
+
hideValueLabel: false,
|
176
|
+
labelText : '',
|
177
|
+
name : 'group2',
|
178
|
+
valueLabelText: 'Option 3'
|
179
|
+
}],
|
159
180
|
|
160
|
-
|
161
|
-
|
162
|
-
|
163
|
-
|
164
|
-
|
165
|
-
|
166
|
-
},
|
167
|
-
{
|
168
|
-
ntype : 'radiofield',
|
169
|
-
labelText: 'Option 2',
|
170
|
-
name : 'group1'
|
171
|
-
},
|
172
|
-
{
|
173
|
-
ntype : 'radiofield',
|
174
|
-
labelText: 'Option 3',
|
175
|
-
name : 'group1'
|
176
|
-
},
|
177
|
-
{
|
178
|
-
ntype : 'radiofield',
|
179
|
-
checked : true,
|
180
|
-
hideValueLabel: false,
|
181
|
-
labelText : 'Group 2',
|
182
|
-
name : 'group2',
|
183
|
-
style : {marginTop: '20px'},
|
184
|
-
valueLabelText: 'Option 1'
|
185
|
-
},
|
186
|
-
{
|
187
|
-
ntype : 'radiofield',
|
188
|
-
hideValueLabel: false,
|
189
|
-
labelText : '',
|
190
|
-
name : 'group2',
|
191
|
-
valueLabelText: 'Option 2'
|
192
|
-
},
|
193
|
-
{
|
194
|
-
ntype : 'radiofield',
|
195
|
-
hideValueLabel: false,
|
196
|
-
labelText : '',
|
197
|
-
name : 'group2',
|
198
|
-
valueLabelText: 'Option 3'
|
199
|
-
}
|
200
|
-
],
|
181
|
+
header: {
|
182
|
+
iconCls: 'far fa-circle',
|
183
|
+
text : 'Radio'
|
184
|
+
}
|
185
|
+
}, {
|
186
|
+
ntype: 'container',
|
201
187
|
|
202
|
-
|
203
|
-
|
204
|
-
|
205
|
-
}
|
188
|
+
itemDefaults: {
|
189
|
+
flex : '0 1 auto',
|
190
|
+
labelWidth: '120px'
|
206
191
|
},
|
207
|
-
{
|
208
|
-
ntype: 'container',
|
209
192
|
|
210
|
-
|
211
|
-
|
212
|
-
|
213
|
-
},
|
193
|
+
layout: {
|
194
|
+
ntype: 'vbox'
|
195
|
+
},
|
214
196
|
|
215
|
-
|
216
|
-
|
217
|
-
|
197
|
+
items: [{
|
198
|
+
ntype : 'rangefield',
|
199
|
+
labelText: '0-20, Step 1',
|
200
|
+
maxValue : 20,
|
201
|
+
minValue : 0,
|
202
|
+
value : 10
|
203
|
+
}, {
|
204
|
+
ntype : 'rangefield',
|
205
|
+
labelText: '0-20, Step 5',
|
206
|
+
maxValue : 20,
|
207
|
+
minValue : 0,
|
208
|
+
stepSize : 5,
|
209
|
+
value : 10
|
210
|
+
}],
|
218
211
|
|
219
|
-
|
220
|
-
|
221
|
-
|
222
|
-
|
223
|
-
|
224
|
-
|
225
|
-
value : 10
|
226
|
-
},
|
227
|
-
{
|
228
|
-
ntype : 'rangefield',
|
229
|
-
labelText: '0-20, Step 5',
|
230
|
-
maxValue : 20,
|
231
|
-
minValue : 0,
|
232
|
-
stepSize : 5,
|
233
|
-
value : 10
|
234
|
-
}
|
235
|
-
],
|
212
|
+
header: {
|
213
|
+
iconCls: 'fa fa-exchange-alt',
|
214
|
+
text : 'Range'
|
215
|
+
}
|
216
|
+
}, {
|
217
|
+
ntype: 'container',
|
236
218
|
|
237
|
-
|
238
|
-
|
239
|
-
|
240
|
-
}
|
219
|
+
itemDefaults: {
|
220
|
+
flex : '0 1 auto',
|
221
|
+
labelWidth: '120px'
|
241
222
|
},
|
242
|
-
{
|
243
|
-
ntype: 'container',
|
244
223
|
|
245
|
-
|
246
|
-
|
247
|
-
|
248
|
-
},
|
249
|
-
|
250
|
-
layout: {
|
251
|
-
ntype: 'vbox'
|
252
|
-
},
|
224
|
+
layout: {
|
225
|
+
ntype: 'vbox'
|
226
|
+
},
|
253
227
|
|
254
|
-
|
255
|
-
|
256
|
-
|
257
|
-
|
258
|
-
|
259
|
-
|
260
|
-
|
261
|
-
|
262
|
-
|
263
|
-
|
264
|
-
|
265
|
-
|
266
|
-
|
267
|
-
|
268
|
-
|
269
|
-
|
270
|
-
|
271
|
-
|
272
|
-
|
273
|
-
|
274
|
-
|
228
|
+
items: [{
|
229
|
+
ntype : 'numberfield',
|
230
|
+
labelText: '0-20, Step 1',
|
231
|
+
maxValue : 20,
|
232
|
+
minValue : 0,
|
233
|
+
value : 10
|
234
|
+
}, {
|
235
|
+
ntype : 'numberfield',
|
236
|
+
labelText: '0-20, Step 5',
|
237
|
+
maxValue : 20,
|
238
|
+
minValue : 0,
|
239
|
+
stepSize : 5,
|
240
|
+
value : 10
|
241
|
+
}],
|
242
|
+
header: {
|
243
|
+
iconCls: 'fa fa-sort-numeric-up',
|
244
|
+
text : 'Number'
|
245
|
+
}
|
246
|
+
}, {
|
247
|
+
header: {
|
248
|
+
iconCls: 'fa fa-calendar',
|
249
|
+
text : 'Date'
|
275
250
|
},
|
276
|
-
{
|
277
|
-
|
278
|
-
iconCls: 'fa fa-calendar',
|
279
|
-
text : 'Date'
|
280
|
-
},
|
281
|
-
vdom: {
|
282
|
-
innerHTML: 'todo'
|
283
|
-
}
|
251
|
+
vdom: {
|
252
|
+
innerHTML: 'todo'
|
284
253
|
}
|
285
|
-
]
|
254
|
+
}]
|
286
255
|
}
|
287
256
|
}
|
288
257
|
|
@@ -37,7 +37,7 @@ class MainContainer extends Viewport {
|
|
37
37
|
},
|
38
38
|
|
39
39
|
items: [{
|
40
|
-
|
40
|
+
header: {
|
41
41
|
iconCls: 'fa fa-user-astronaut',
|
42
42
|
text : 'Bob'
|
43
43
|
},
|
@@ -47,7 +47,7 @@ class MainContainer extends Viewport {
|
|
47
47
|
src: 'https://raw.githubusercontent.com/neomjs/pages/main/resources_pub/examples/ai_images/000150.jpg'
|
48
48
|
}
|
49
49
|
}, {
|
50
|
-
|
50
|
+
header: {
|
51
51
|
iconCls: 'fa fa-user-ninja',
|
52
52
|
text : 'Alice'
|
53
53
|
},
|
@@ -174,20 +174,18 @@ class MainContainer extends ConfigurationViewport {
|
|
174
174
|
itemDefaults: {
|
175
175
|
ntype: 'component',
|
176
176
|
cls : ['neo-examples-tab-component'],
|
177
|
-
style: {
|
178
|
-
padding: '20px'
|
179
|
-
}
|
177
|
+
style: {padding: '20px'}
|
180
178
|
},
|
181
179
|
|
182
180
|
items: [{
|
183
|
-
|
184
|
-
vdom
|
181
|
+
header: {iconCls: 'fa fa-home', text: 'Tab 1', flag: 'tab1',},
|
182
|
+
vdom : {innerHTML: 'Tab 1 Content'}
|
185
183
|
}, {
|
186
|
-
|
187
|
-
vdom
|
184
|
+
header: {iconCls: 'fa fa-play-circle', text: 'Tab 2'},
|
185
|
+
vdom : {innerHTML: 'Tab 2 Content'}
|
188
186
|
}, {
|
189
|
-
|
190
|
-
vdom
|
187
|
+
header: {iconCls: 'fa fa-user', text: 'Tab 3', badgeText: 'hello'},
|
188
|
+
vdom : {innerHTML: 'Tab 3 Content'}
|
191
189
|
}],
|
192
190
|
|
193
191
|
listeners: {
|
@@ -142,12 +142,12 @@ class MainContainer extends TabContainer {
|
|
142
142
|
}]
|
143
143
|
}],
|
144
144
|
|
145
|
-
|
145
|
+
header: {
|
146
146
|
iconCls: 'fa fa-home',
|
147
147
|
text : 'Tab 1'
|
148
148
|
}
|
149
149
|
}, {
|
150
|
-
|
150
|
+
header: {
|
151
151
|
iconCls: 'fa fa-play-circle',
|
152
152
|
text : 'Tab 2'
|
153
153
|
},
|
@@ -155,7 +155,7 @@ class MainContainer extends TabContainer {
|
|
155
155
|
innerHTML: 'Test 2'
|
156
156
|
}
|
157
157
|
}, {
|
158
|
-
|
158
|
+
header: {
|
159
159
|
iconCls: 'fa fa-user',
|
160
160
|
text : 'Tab 3'
|
161
161
|
},
|
@@ -32,7 +32,7 @@ class MainContainer2 extends Container {
|
|
32
32
|
},
|
33
33
|
|
34
34
|
items: [{
|
35
|
-
|
35
|
+
header: {
|
36
36
|
iconCls: 'fa fa-home',
|
37
37
|
text : 'Tab 1'
|
38
38
|
},
|
@@ -40,7 +40,7 @@ class MainContainer2 extends Container {
|
|
40
40
|
innerHTML: 'Tab Content 1'
|
41
41
|
}
|
42
42
|
}, {
|
43
|
-
|
43
|
+
header: {
|
44
44
|
iconCls: 'fa fa-play-circle',
|
45
45
|
text : 'Tab 2'
|
46
46
|
},
|
@@ -88,7 +88,7 @@ class MainContainer2 extends Container {
|
|
88
88
|
}]
|
89
89
|
}],
|
90
90
|
|
91
|
-
|
91
|
+
header: {
|
92
92
|
iconCls: 'fa fa-user',
|
93
93
|
text : 'Tab 3'
|
94
94
|
}
|
@@ -128,7 +128,7 @@ class MainContainer2 extends Container {
|
|
128
128
|
this.tabCount++;
|
129
129
|
|
130
130
|
tabContainer.insert(3, {
|
131
|
-
|
131
|
+
header: {
|
132
132
|
iconCls: 'fa fa-user',
|
133
133
|
text : 'Dynamic Tab ' + this.tabCount
|
134
134
|
},
|
@@ -13,9 +13,10 @@ class MainContainer extends Viewport {
|
|
13
13
|
layout : {ntype: 'vbox', align: 'stretch'},
|
14
14
|
|
15
15
|
items: [{
|
16
|
-
ntype
|
17
|
-
cls
|
18
|
-
layout: {ntype: 'hbox', align: 'stretch'},
|
16
|
+
ntype : 'container',
|
17
|
+
cls : ['video-wrapper'],
|
18
|
+
layout : {ntype: 'hbox', align: 'stretch'},
|
19
|
+
reference: 'video-wrapper',
|
19
20
|
|
20
21
|
itemDefaults: {
|
21
22
|
ntype : 'container',
|
@@ -51,9 +52,10 @@ class MainContainer extends Viewport {
|
|
51
52
|
* @param {Object} data
|
52
53
|
*/
|
53
54
|
onMoveVideoButtonClick(data) {
|
54
|
-
let me
|
55
|
-
container1
|
56
|
-
container2
|
55
|
+
let me = this,
|
56
|
+
container1 = me.getReference('container-1'),
|
57
|
+
container2 = me.getReference('container-2'),
|
58
|
+
videoWrapper = me.getReference('video-wrapper');
|
57
59
|
|
58
60
|
container1.silentVdomUpdate = true;
|
59
61
|
container2.silentVdomUpdate = true;
|
@@ -64,7 +66,12 @@ class MainContainer extends Viewport {
|
|
64
66
|
container1.add(container2.removeAt(0, false))
|
65
67
|
}
|
66
68
|
|
67
|
-
|
69
|
+
// include 2 level of children:
|
70
|
+
// level 1 => container-1, container-2
|
71
|
+
// level 2 => video element(s)
|
72
|
+
videoWrapper.updateDepth = 3;
|
73
|
+
|
74
|
+
videoWrapper.promiseUpdate().then(() => {
|
68
75
|
container1.silentVdomUpdate = false;
|
69
76
|
container2.silentVdomUpdate = false
|
70
77
|
})
|
@@ -68,12 +68,12 @@ class MainContainer extends Viewport {
|
|
68
68
|
text : 'Left'
|
69
69
|
}],
|
70
70
|
|
71
|
-
|
71
|
+
header: {
|
72
72
|
iconCls: 'fa fa-home',
|
73
73
|
text : 'Tab 1'
|
74
74
|
}
|
75
75
|
}, {
|
76
|
-
|
76
|
+
header: {
|
77
77
|
iconCls: 'fa fa-play-circle',
|
78
78
|
text : 'Tab 2'
|
79
79
|
},
|
@@ -81,7 +81,7 @@ class MainContainer extends Viewport {
|
|
81
81
|
innerHTML: 'Test 2'
|
82
82
|
}
|
83
83
|
}, {
|
84
|
-
|
84
|
+
header: {
|
85
85
|
iconCls: 'fa fa-user',
|
86
86
|
text : 'Tab 3'
|
87
87
|
},
|
package/package.json
CHANGED
@@ -1,6 +1,6 @@
|
|
1
1
|
{
|
2
2
|
"name": "neo.mjs",
|
3
|
-
"version": "8.0.0-
|
3
|
+
"version": "8.0.0-beta.1",
|
4
4
|
"description": "The webworkers driven UI framework",
|
5
5
|
"type": "module",
|
6
6
|
"repository": {
|
@@ -45,7 +45,7 @@
|
|
45
45
|
},
|
46
46
|
"homepage": "https://neomjs.com/",
|
47
47
|
"devDependencies": {
|
48
|
-
"@fortawesome/fontawesome-free": "^6.
|
48
|
+
"@fortawesome/fontawesome-free": "^6.7.1",
|
49
49
|
"autoprefixer": "^10.4.20",
|
50
50
|
"chalk": "^5.3.0",
|
51
51
|
"clean-webpack-plugin": "^4.0.0",
|
@@ -54,13 +54,13 @@
|
|
54
54
|
"envinfo": "^7.14.0",
|
55
55
|
"fs-extra": "^11.2.0",
|
56
56
|
"highlightjs-line-numbers.js": "^2.9.0",
|
57
|
-
"inquirer": "^12.0
|
58
|
-
"marked": "^
|
57
|
+
"inquirer": "^12.1.0",
|
58
|
+
"marked": "^15.0.2",
|
59
59
|
"monaco-editor": "0.50.0",
|
60
60
|
"neo-jsdoc": "1.0.1",
|
61
61
|
"neo-jsdoc-x": "1.0.5",
|
62
|
-
"postcss": "^8.4.
|
63
|
-
"sass": "^1.
|
62
|
+
"postcss": "^8.4.49",
|
63
|
+
"sass": "^1.81.0",
|
64
64
|
"siesta-lite": "5.5.2",
|
65
65
|
"url": "^0.11.4",
|
66
66
|
"webpack": "^5.96.1",
|