x4js 1.4.2 → 1.4.5
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/lib/application.js +10 -6
- package/lib/base64.js +5 -1
- package/lib/base_component.js +7 -3
- package/lib/button.js +24 -18
- package/lib/calendar.js +44 -39
- package/lib/canvas.js +9 -5
- package/lib/cardview.js +11 -7
- package/lib/checkbox.js +12 -8
- package/lib/color.js +7 -3
- package/lib/colorpicker.js +86 -80
- package/lib/combobox.js +26 -22
- package/lib/component.js +65 -48
- package/lib/datastore.js +29 -20
- package/lib/dialog.js +41 -36
- package/lib/dom_events.js +2 -1
- package/lib/drag_manager.js +4 -1
- package/lib/drawtext.js +9 -5
- package/lib/fileupload.js +19 -12
- package/lib/form.js +29 -25
- package/lib/formatters.js +19 -10
- package/lib/gridview.js +40 -35
- package/lib/hosts/host.js +7 -3
- package/lib/i18n.js +11 -5
- package/lib/icon.js +16 -11
- package/lib/image.js +7 -3
- package/lib/index.d.ts +55 -0
- package/lib/index.js +71 -1
- package/lib/input.js +6 -2
- package/lib/label.js +15 -11
- package/lib/layout.js +23 -13
- package/lib/link.js +9 -5
- package/lib/listview.js +34 -27
- package/lib/md5.js +5 -1
- package/lib/menu.js +27 -19
- package/lib/messagebox.js +22 -17
- package/lib/panel.js +13 -9
- package/lib/popup.js +25 -20
- package/lib/property_editor.js +20 -16
- package/lib/radiobtn.js +13 -9
- package/lib/rating.js +13 -9
- package/lib/request.js +16 -9
- package/lib/router.d.ts +1 -8
- package/lib/router.js +4 -0
- package/lib/settings.js +8 -4
- package/lib/sidebarview.js +12 -8
- package/lib/smartedit.js +16 -11
- package/lib/spreadsheet.js +35 -31
- package/lib/styles.js +15 -9
- package/lib/svgcomponent.js +8 -3
- package/lib/tabbar.js +10 -6
- package/lib/tabview.js +10 -6
- package/lib/textarea.js +10 -6
- package/lib/textedit.js +39 -35
- package/lib/texthiliter.js +8 -4
- package/lib/toaster.js +8 -4
- package/lib/tools.js +97 -51
- package/lib/tooltips.js +14 -9
- package/lib/treeview.js +30 -26
- package/lib/x4_events.js +21 -9
- package/package.json +2 -1
- package/src/index.ts +55 -0
- package/src/router.ts +1 -1
- package/tsconfig.json +2 -1
package/lib/application.js
CHANGED
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
"use strict";
|
|
1
2
|
/**
|
|
2
3
|
* ___ ___ __
|
|
3
4
|
* \ \/ / / _
|
|
@@ -22,9 +23,11 @@
|
|
|
22
23
|
*
|
|
23
24
|
* You should have received a copy of the GNU General Public License along with this program. If not, see <https://www.gnu.org/licenses/>.
|
|
24
25
|
**/
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
26
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
27
|
+
exports.Application = void 0;
|
|
28
|
+
const base_component_1 = require("./base_component");
|
|
29
|
+
const settings_1 = require("./settings");
|
|
30
|
+
const tools_1 = require("./tools");
|
|
28
31
|
/**
|
|
29
32
|
* Represents an x4 application, which is typically a single page app.
|
|
30
33
|
* You should inherit Application to define yours.
|
|
@@ -44,7 +47,7 @@ import { deferCall } from './tools';
|
|
|
44
47
|
* app.events.close.emit( new Events.close() );
|
|
45
48
|
* }
|
|
46
49
|
*/
|
|
47
|
-
|
|
50
|
+
class Application extends base_component_1.BaseComponent {
|
|
48
51
|
static self = null;
|
|
49
52
|
/**
|
|
50
53
|
* the application singleton
|
|
@@ -65,7 +68,7 @@ export class Application extends BaseComponent {
|
|
|
65
68
|
this.m_app_version = props.app_version ?? '1.0';
|
|
66
69
|
this.m_app_uid = props.app_uid ?? 'application';
|
|
67
70
|
let settings_name = `${this.m_app_name}.${this.m_app_version}.settings`;
|
|
68
|
-
this.m_local_storage = new Settings(settings_name);
|
|
71
|
+
this.m_local_storage = new settings_1.Settings(settings_name);
|
|
69
72
|
this.m_user_data = {};
|
|
70
73
|
Application.self = this;
|
|
71
74
|
if ('onload' in globalThis) {
|
|
@@ -113,7 +116,7 @@ export class Application extends BaseComponent {
|
|
|
113
116
|
*/
|
|
114
117
|
set mainView(root) {
|
|
115
118
|
this.m_mainView = root;
|
|
116
|
-
deferCall(() => {
|
|
119
|
+
(0, tools_1.deferCall)(() => {
|
|
117
120
|
document.body.appendChild(root._build());
|
|
118
121
|
});
|
|
119
122
|
}
|
|
@@ -134,4 +137,5 @@ export class Application extends BaseComponent {
|
|
|
134
137
|
enterModal(enter) {
|
|
135
138
|
}
|
|
136
139
|
}
|
|
140
|
+
exports.Application = Application;
|
|
137
141
|
;
|
package/lib/base64.js
CHANGED
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
"use strict";
|
|
1
2
|
/**
|
|
2
3
|
* ___ ___ __
|
|
3
4
|
* \ \/ / / _
|
|
@@ -22,9 +23,11 @@
|
|
|
22
23
|
*
|
|
23
24
|
* You should have received a copy of the GNU General Public License along with this program. If not, see <https://www.gnu.org/licenses/>.
|
|
24
25
|
**/
|
|
26
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
27
|
+
exports.Base64 = void 0;
|
|
25
28
|
const _alphabet = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/=';
|
|
26
29
|
let _lookup = null;
|
|
27
|
-
|
|
30
|
+
class Base64 {
|
|
28
31
|
lookup = null;
|
|
29
32
|
static encode(s) {
|
|
30
33
|
let buffer;
|
|
@@ -133,3 +136,4 @@ export class Base64 {
|
|
|
133
136
|
return buffer;
|
|
134
137
|
}
|
|
135
138
|
}
|
|
139
|
+
exports.Base64 = Base64;
|
package/lib/base_component.js
CHANGED
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
"use strict";
|
|
1
2
|
/**
|
|
2
3
|
* ___ ___ __
|
|
3
4
|
* \ \/ / / _
|
|
@@ -10,11 +11,13 @@
|
|
|
10
11
|
* @copyright (c) 2022 R-libre ingenierie, all rights reserved.
|
|
11
12
|
*
|
|
12
13
|
**/
|
|
13
|
-
|
|
14
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
15
|
+
exports.BaseComponent = void 0;
|
|
16
|
+
const x4_events_1 = require("./x4_events");
|
|
14
17
|
/**
|
|
15
18
|
* BaseComponent class
|
|
16
19
|
*/
|
|
17
|
-
|
|
20
|
+
class BaseComponent extends x4_events_1.EventSource {
|
|
18
21
|
m_props;
|
|
19
22
|
#m_timers;
|
|
20
23
|
constructor(props) {
|
|
@@ -44,7 +47,7 @@ export class BaseComponent extends EventSource {
|
|
|
44
47
|
callback(name, tm);
|
|
45
48
|
}
|
|
46
49
|
else {
|
|
47
|
-
this.emit('timer', EvTimer(name, tm));
|
|
50
|
+
this.emit('timer', (0, x4_events_1.EvTimer)(name, tm));
|
|
48
51
|
}
|
|
49
52
|
}, timeout);
|
|
50
53
|
this.#m_timers.set(name, () => { (repeat ? clearInterval : clearTimeout)(id); });
|
|
@@ -75,3 +78,4 @@ export class BaseComponent extends EventSource {
|
|
|
75
78
|
setTimeout(callback, timeout);
|
|
76
79
|
}
|
|
77
80
|
}
|
|
81
|
+
exports.BaseComponent = BaseComponent;
|
package/lib/button.js
CHANGED
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
"use strict";
|
|
1
2
|
/**
|
|
2
3
|
* ___ ___ __
|
|
3
4
|
* \ \/ / / _
|
|
@@ -22,16 +23,18 @@
|
|
|
22
23
|
*
|
|
23
24
|
* You should have received a copy of the GNU General Public License along with this program. If not, see <https://www.gnu.org/licenses/>.
|
|
24
25
|
**/
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
26
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
27
|
+
exports.ToggleButton = exports.Button = exports.BaseButton = void 0;
|
|
28
|
+
const component_1 = require("./component");
|
|
29
|
+
const x4_events_1 = require("./x4_events");
|
|
30
|
+
const icon_1 = require("./icon");
|
|
31
|
+
const label_1 = require("./label");
|
|
32
|
+
const menu_1 = require("./menu");
|
|
33
|
+
const tools_1 = require("./tools");
|
|
31
34
|
/**
|
|
32
35
|
* Base button
|
|
33
36
|
*/
|
|
34
|
-
|
|
37
|
+
class BaseButton extends component_1.Component {
|
|
35
38
|
constructor(props) {
|
|
36
39
|
super(props);
|
|
37
40
|
this.setProp('tag', 'button');
|
|
@@ -42,9 +45,9 @@ export class BaseButton extends Component {
|
|
|
42
45
|
this.mapPropEvents(props, 'click');
|
|
43
46
|
}
|
|
44
47
|
render(props) {
|
|
45
|
-
let icon = props.icon ? new Icon({ icon: props.icon, cls: 'left', ref: 'l_icon' }) : null;
|
|
46
|
-
let label = new Label({ flex: 1, text: props.text ?? '', align: props.align, ref: 'label' });
|
|
47
|
-
let ricon = props.rightIcon ? new Icon({ icon: props.rightIcon, cls: 'right', ref: 'r_icon' }) : null;
|
|
48
|
+
let icon = props.icon ? new icon_1.Icon({ icon: props.icon, cls: 'left', ref: 'l_icon' }) : null;
|
|
49
|
+
let label = new label_1.Label({ flex: 1, text: props.text ?? '', align: props.align, ref: 'label' });
|
|
50
|
+
let ricon = props.rightIcon ? new icon_1.Icon({ icon: props.rightIcon, cls: 'right', ref: 'r_icon' }) : null;
|
|
48
51
|
this.setContent([icon, label, ricon]);
|
|
49
52
|
this._setTabIndex(props.tabIndex);
|
|
50
53
|
}
|
|
@@ -83,8 +86,8 @@ export class BaseButton extends Component {
|
|
|
83
86
|
*/
|
|
84
87
|
_handleClick(ev) {
|
|
85
88
|
if (this.m_props.menu) {
|
|
86
|
-
let menu = new Menu({
|
|
87
|
-
items: isFunction(this.m_props.menu) ? this.m_props.menu() : this.m_props.menu
|
|
89
|
+
let menu = new menu_1.Menu({
|
|
90
|
+
items: (0, tools_1.isFunction)(this.m_props.menu) ? this.m_props.menu() : this.m_props.menu
|
|
88
91
|
});
|
|
89
92
|
let rc = this.getBoundingRect();
|
|
90
93
|
menu.displayAt(rc.left, rc.bottom, 'tl');
|
|
@@ -100,14 +103,14 @@ export class BaseButton extends Component {
|
|
|
100
103
|
*/
|
|
101
104
|
_sendClick() {
|
|
102
105
|
if (this.m_props.menu) {
|
|
103
|
-
let menu = new Menu({
|
|
104
|
-
items: isFunction(this.m_props.menu) ? this.m_props.menu() : this.m_props.menu
|
|
106
|
+
let menu = new menu_1.Menu({
|
|
107
|
+
items: (0, tools_1.isFunction)(this.m_props.menu) ? this.m_props.menu() : this.m_props.menu
|
|
105
108
|
});
|
|
106
109
|
let rc = this.getBoundingRect();
|
|
107
110
|
menu.displayAt(rc.left, rc.bottom, 'tl');
|
|
108
111
|
}
|
|
109
112
|
else {
|
|
110
|
-
this.emit('click', EvClick());
|
|
113
|
+
this.emit('click', (0, x4_events_1.EvClick)());
|
|
111
114
|
}
|
|
112
115
|
}
|
|
113
116
|
/**
|
|
@@ -190,16 +193,18 @@ export class BaseButton extends Component {
|
|
|
190
193
|
this.m_props.menu = items;
|
|
191
194
|
}
|
|
192
195
|
}
|
|
196
|
+
exports.BaseButton = BaseButton;
|
|
193
197
|
// :: BUTTON ::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::
|
|
194
198
|
/**
|
|
195
199
|
*
|
|
196
200
|
*/
|
|
197
|
-
|
|
201
|
+
class Button extends BaseButton {
|
|
198
202
|
}
|
|
203
|
+
exports.Button = Button;
|
|
199
204
|
/**
|
|
200
205
|
*
|
|
201
206
|
*/
|
|
202
|
-
|
|
207
|
+
class ToggleButton extends BaseButton {
|
|
203
208
|
constructor(props) {
|
|
204
209
|
super(props);
|
|
205
210
|
}
|
|
@@ -220,7 +225,7 @@ export class ToggleButton extends BaseButton {
|
|
|
220
225
|
super._sendClick();
|
|
221
226
|
this.m_props.checked = !this.m_props.checked;
|
|
222
227
|
this.setClass('checked', this.m_props.checked);
|
|
223
|
-
this.emit('change', EvChange(this.m_props.checked));
|
|
228
|
+
this.emit('change', (0, x4_events_1.EvChange)(this.m_props.checked));
|
|
224
229
|
this._updateIcon();
|
|
225
230
|
}
|
|
226
231
|
_updateIcon() {
|
|
@@ -233,3 +238,4 @@ export class ToggleButton extends BaseButton {
|
|
|
233
238
|
}
|
|
234
239
|
}
|
|
235
240
|
}
|
|
241
|
+
exports.ToggleButton = ToggleButton;
|
package/lib/calendar.js
CHANGED
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
"use strict";
|
|
1
2
|
/**
|
|
2
3
|
* ___ ___ __
|
|
3
4
|
* \ \/ / / _
|
|
@@ -22,22 +23,24 @@
|
|
|
22
23
|
*
|
|
23
24
|
* You should have received a copy of the GNU General Public License along with this program. If not, see <https://www.gnu.org/licenses/>.
|
|
24
25
|
**/
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
26
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
27
|
+
exports.PopupCalendar = exports.Calendar = void 0;
|
|
28
|
+
const button_1 = require("./button");
|
|
29
|
+
const popup_1 = require("./popup");
|
|
30
|
+
const component_1 = require("./component");
|
|
31
|
+
const x4_events_1 = require("./x4_events");
|
|
32
|
+
const i18n_1 = require("./i18n");
|
|
33
|
+
const label_1 = require("./label");
|
|
34
|
+
const layout_1 = require("./layout");
|
|
35
|
+
const tools_1 = require("./tools");
|
|
36
|
+
const menu_1 = require("./menu");
|
|
34
37
|
/**
|
|
35
38
|
* default calendar control
|
|
36
39
|
*
|
|
37
40
|
* fires:
|
|
38
41
|
* EventChange ( value = Date )
|
|
39
42
|
*/
|
|
40
|
-
|
|
43
|
+
class Calendar extends layout_1.VLayout {
|
|
41
44
|
m_date;
|
|
42
45
|
constructor(props) {
|
|
43
46
|
super(props);
|
|
@@ -46,42 +49,42 @@ export class Calendar extends VLayout {
|
|
|
46
49
|
}
|
|
47
50
|
/** @ignore */
|
|
48
51
|
render(props) {
|
|
49
|
-
let month_start = date_clone(this.m_date);
|
|
52
|
+
let month_start = (0, tools_1.date_clone)(this.m_date);
|
|
50
53
|
month_start.setDate(1);
|
|
51
54
|
let day = month_start.getDay();
|
|
52
55
|
if (day == 0) {
|
|
53
56
|
day = 7;
|
|
54
57
|
}
|
|
55
58
|
month_start.setDate(-day + 1 + 1);
|
|
56
|
-
let dte = date_clone(month_start);
|
|
59
|
+
let dte = (0, tools_1.date_clone)(month_start);
|
|
57
60
|
let today = this.m_date.hash();
|
|
58
|
-
let month_end = date_clone(this.m_date);
|
|
61
|
+
let month_end = (0, tools_1.date_clone)(this.m_date);
|
|
59
62
|
month_end.setDate(1);
|
|
60
63
|
month_end.setMonth(month_end.getMonth() + 1);
|
|
61
64
|
month_end.setDate(0);
|
|
62
|
-
let end_of_month = date_hash(month_end);
|
|
65
|
+
let end_of_month = (0, tools_1.date_hash)(month_end);
|
|
63
66
|
let rows = [];
|
|
64
67
|
// month selector
|
|
65
|
-
let header = new HLayout({
|
|
68
|
+
let header = new layout_1.HLayout({
|
|
66
69
|
cls: 'month-sel',
|
|
67
70
|
content: [
|
|
68
|
-
new Label({
|
|
71
|
+
new label_1.Label({
|
|
69
72
|
cls: 'month',
|
|
70
|
-
text: formatIntlDate(this.m_date, 'O'),
|
|
73
|
+
text: (0, tools_1.formatIntlDate)(this.m_date, 'O'),
|
|
71
74
|
dom_events: {
|
|
72
75
|
click: () => this._choose('month')
|
|
73
76
|
}
|
|
74
77
|
}),
|
|
75
|
-
new Label({
|
|
78
|
+
new label_1.Label({
|
|
76
79
|
cls: 'year',
|
|
77
|
-
text: formatIntlDate(this.m_date, 'Y'),
|
|
80
|
+
text: (0, tools_1.formatIntlDate)(this.m_date, 'Y'),
|
|
78
81
|
dom_events: {
|
|
79
82
|
click: () => this._choose('year')
|
|
80
83
|
}
|
|
81
84
|
}),
|
|
82
|
-
new Flex(),
|
|
83
|
-
new Button({ text: '<', click: () => this._next(false) }),
|
|
84
|
-
new Button({ text: '>', click: () => this._next(true) })
|
|
85
|
+
new component_1.Flex(),
|
|
86
|
+
new button_1.Button({ text: '<', click: () => this._next(false) }),
|
|
87
|
+
new button_1.Button({ text: '>', click: () => this._next(true) })
|
|
85
88
|
]
|
|
86
89
|
});
|
|
87
90
|
rows.push(header);
|
|
@@ -89,26 +92,26 @@ export class Calendar extends VLayout {
|
|
|
89
92
|
let day_names = [];
|
|
90
93
|
// day names
|
|
91
94
|
// empty week num
|
|
92
|
-
day_names.push(new HLayout({
|
|
95
|
+
day_names.push(new layout_1.HLayout({
|
|
93
96
|
cls: 'weeknum cell',
|
|
94
97
|
}));
|
|
95
98
|
for (let d = 0; d < 7; d++) {
|
|
96
|
-
day_names.push(new Label({
|
|
99
|
+
day_names.push(new label_1.Label({
|
|
97
100
|
cls: 'cell',
|
|
98
101
|
flex: 1,
|
|
99
|
-
text: _tr.global.day_short[(d + 1) % 7]
|
|
102
|
+
text: i18n_1._tr.global.day_short[(d + 1) % 7]
|
|
100
103
|
}));
|
|
101
104
|
}
|
|
102
|
-
rows.push(new HLayout({
|
|
105
|
+
rows.push(new layout_1.HLayout({
|
|
103
106
|
cls: 'week header',
|
|
104
107
|
content: day_names
|
|
105
108
|
}));
|
|
106
109
|
let cmonth = this.m_date.getMonth();
|
|
107
110
|
// weeks
|
|
108
111
|
let first = true;
|
|
109
|
-
while (date_hash(dte) <= end_of_month) {
|
|
112
|
+
while ((0, tools_1.date_hash)(dte) <= end_of_month) {
|
|
110
113
|
let days = [
|
|
111
|
-
new HLayout({ cls: 'weeknum cell', content: new Component({ tag: 'span', content: formatIntlDate(dte, 'w') }) })
|
|
114
|
+
new layout_1.HLayout({ cls: 'weeknum cell', content: new component_1.Component({ tag: 'span', content: (0, tools_1.formatIntlDate)(dte, 'w') }) })
|
|
112
115
|
];
|
|
113
116
|
// days
|
|
114
117
|
for (let d = 0; d < 7; d++) {
|
|
@@ -119,12 +122,12 @@ export class Calendar extends VLayout {
|
|
|
119
122
|
if (dte.getMonth() != cmonth) {
|
|
120
123
|
cls += ' out';
|
|
121
124
|
}
|
|
122
|
-
days.push(new HLayout({
|
|
125
|
+
days.push(new layout_1.HLayout({
|
|
123
126
|
cls,
|
|
124
127
|
flex: 1,
|
|
125
|
-
content: new Component({
|
|
128
|
+
content: new component_1.Component({
|
|
126
129
|
tag: 'span',
|
|
127
|
-
content: formatIntlDate(dte, 'd'),
|
|
130
|
+
content: (0, tools_1.formatIntlDate)(dte, 'd'),
|
|
128
131
|
}),
|
|
129
132
|
dom_events: {
|
|
130
133
|
click: () => this.select(dte.clone())
|
|
@@ -133,7 +136,7 @@ export class Calendar extends VLayout {
|
|
|
133
136
|
dte.setDate(dte.getDate() + 1);
|
|
134
137
|
first = false;
|
|
135
138
|
}
|
|
136
|
-
rows.push(new HLayout({
|
|
139
|
+
rows.push(new layout_1.HLayout({
|
|
137
140
|
cls: 'week',
|
|
138
141
|
flex: 1,
|
|
139
142
|
content: days
|
|
@@ -147,7 +150,7 @@ export class Calendar extends VLayout {
|
|
|
147
150
|
*/
|
|
148
151
|
select(date) {
|
|
149
152
|
this.m_date = date;
|
|
150
|
-
this.emit('change', EvChange(date));
|
|
153
|
+
this.emit('change', (0, x4_events_1.EvChange)(date));
|
|
151
154
|
this.update();
|
|
152
155
|
}
|
|
153
156
|
/**
|
|
@@ -164,8 +167,8 @@ export class Calendar extends VLayout {
|
|
|
164
167
|
let items = [];
|
|
165
168
|
if (type == 'month') {
|
|
166
169
|
for (let m = 0; m < 12; m++) {
|
|
167
|
-
items.push(new MenuItem({
|
|
168
|
-
text: _tr.global.month_long[m],
|
|
170
|
+
items.push(new menu_1.MenuItem({
|
|
171
|
+
text: i18n_1._tr.global.month_long[m],
|
|
169
172
|
click: () => { this.m_date.setMonth(m); this.update(); }
|
|
170
173
|
}));
|
|
171
174
|
}
|
|
@@ -174,13 +177,13 @@ export class Calendar extends VLayout {
|
|
|
174
177
|
let min = this.m_props.minDate?.getFullYear() ?? 1900;
|
|
175
178
|
let max = this.m_props.maxDate?.getFullYear() ?? 2037;
|
|
176
179
|
for (let m = min; m < max; m++) {
|
|
177
|
-
items.push(new MenuItem({
|
|
180
|
+
items.push(new menu_1.MenuItem({
|
|
178
181
|
text: '' + m,
|
|
179
182
|
click: () => { this.m_date.setFullYear(m); this.update(); }
|
|
180
183
|
}));
|
|
181
184
|
}
|
|
182
185
|
}
|
|
183
|
-
let menu = new Menu({
|
|
186
|
+
let menu = new menu_1.Menu({
|
|
184
187
|
items
|
|
185
188
|
});
|
|
186
189
|
let rc = this.getBoundingRect();
|
|
@@ -194,10 +197,11 @@ export class Calendar extends VLayout {
|
|
|
194
197
|
this.update();
|
|
195
198
|
}
|
|
196
199
|
}
|
|
200
|
+
exports.Calendar = Calendar;
|
|
197
201
|
/**
|
|
198
202
|
* default popup calendar
|
|
199
203
|
*/
|
|
200
|
-
|
|
204
|
+
class PopupCalendar extends popup_1.Popup {
|
|
201
205
|
m_cal;
|
|
202
206
|
constructor(props) {
|
|
203
207
|
super({ tabIndex: 1 });
|
|
@@ -217,7 +221,7 @@ export class PopupCalendar extends Popup {
|
|
|
217
221
|
return;
|
|
218
222
|
}
|
|
219
223
|
// menu: ok
|
|
220
|
-
let dest = Component.getElement(newfocus, MenuItem);
|
|
224
|
+
let dest = component_1.Component.getElement(newfocus, menu_1.MenuItem);
|
|
221
225
|
if (dest) {
|
|
222
226
|
return;
|
|
223
227
|
}
|
|
@@ -234,3 +238,4 @@ export class PopupCalendar extends Popup {
|
|
|
234
238
|
super.close();
|
|
235
239
|
}
|
|
236
240
|
}
|
|
241
|
+
exports.PopupCalendar = PopupCalendar;
|
package/lib/canvas.js
CHANGED
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
"use strict";
|
|
1
2
|
/**
|
|
2
3
|
* ___ ___ __
|
|
3
4
|
* \ \/ / / _
|
|
@@ -22,10 +23,12 @@
|
|
|
22
23
|
*
|
|
23
24
|
* You should have received a copy of the GNU General Public License along with this program. If not, see <https://www.gnu.org/licenses/>.
|
|
24
25
|
**/
|
|
25
|
-
|
|
26
|
-
|
|
26
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
27
|
+
exports.Canvas = void 0;
|
|
28
|
+
const component_1 = require("./component");
|
|
29
|
+
const x4_events_1 = require("./x4_events");
|
|
27
30
|
function EvPaint(ctx) {
|
|
28
|
-
return BasicEvent({ ctx });
|
|
31
|
+
return (0, x4_events_1.BasicEvent)({ ctx });
|
|
29
32
|
}
|
|
30
33
|
function mkPainter(c2d, w, h) {
|
|
31
34
|
let cp = c2d;
|
|
@@ -218,7 +221,7 @@ function circle(x, y, radius) {
|
|
|
218
221
|
/**
|
|
219
222
|
* Standard Canvas
|
|
220
223
|
*/
|
|
221
|
-
|
|
224
|
+
class Canvas extends component_1.Component {
|
|
222
225
|
m_iwidth = -1;
|
|
223
226
|
m_iheight = -1;
|
|
224
227
|
m_scale = 1.0;
|
|
@@ -245,7 +248,7 @@ export class Canvas extends Component {
|
|
|
245
248
|
render() {
|
|
246
249
|
this.m_iwidth = -1;
|
|
247
250
|
this.m_iheight = -1;
|
|
248
|
-
this.m_canvas = new Component({
|
|
251
|
+
this.m_canvas = new component_1.Component({
|
|
249
252
|
tag: 'canvas'
|
|
250
253
|
});
|
|
251
254
|
this.setContent(this.m_canvas);
|
|
@@ -352,3 +355,4 @@ export class Canvas extends Component {
|
|
|
352
355
|
}
|
|
353
356
|
}
|
|
354
357
|
}
|
|
358
|
+
exports.Canvas = Canvas;
|
package/lib/cardview.js
CHANGED
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
"use strict";
|
|
1
2
|
/**
|
|
2
3
|
* ___ ___ __
|
|
3
4
|
* \ \/ / / _
|
|
@@ -22,16 +23,18 @@
|
|
|
22
23
|
*
|
|
23
24
|
* You should have received a copy of the GNU General Public License along with this program. If not, see <https://www.gnu.org/licenses/>.
|
|
24
25
|
**/
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
26
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
27
|
+
exports.CardView = void 0;
|
|
28
|
+
const component_1 = require("./component");
|
|
29
|
+
const x4_events_1 = require("./x4_events");
|
|
30
|
+
const tools_1 = require("./tools");
|
|
28
31
|
/**
|
|
29
32
|
* Standard CardView class
|
|
30
33
|
* a card view is composed of multiples pages with only one visible at a time.
|
|
31
34
|
* pages can be selected by a component (like tabs ou sidebar).
|
|
32
35
|
* or by code.
|
|
33
36
|
*/
|
|
34
|
-
|
|
37
|
+
class CardView extends component_1.Component {
|
|
35
38
|
m_cards;
|
|
36
39
|
m_ipage; // initialy selected page
|
|
37
40
|
m_cpage; // currently selected page
|
|
@@ -82,7 +85,7 @@ export class CardView extends Component {
|
|
|
82
85
|
this.m_cpage = this.m_cards.find((card) => card.name == name);
|
|
83
86
|
if (this.m_cpage) {
|
|
84
87
|
if (this.m_cpage.page) {
|
|
85
|
-
if (isFunction(this.m_cpage.page)) {
|
|
88
|
+
if ((0, tools_1.isFunction)(this.m_cpage.page)) {
|
|
86
89
|
this.m_cpage.page = this.m_cpage.page();
|
|
87
90
|
console.assert(this.m_cpage.page != null, 'You must return a valid component');
|
|
88
91
|
}
|
|
@@ -93,7 +96,7 @@ export class CardView extends Component {
|
|
|
93
96
|
this._preparePage(page);
|
|
94
97
|
}
|
|
95
98
|
}
|
|
96
|
-
this.emit('change', EvChange(this.m_cpage.name));
|
|
99
|
+
this.emit('change', (0, x4_events_1.EvChange)(this.m_cpage.name));
|
|
97
100
|
}
|
|
98
101
|
}
|
|
99
102
|
/**
|
|
@@ -102,7 +105,7 @@ export class CardView extends Component {
|
|
|
102
105
|
setPages(pages) {
|
|
103
106
|
let active = this._initTabs(pages);
|
|
104
107
|
if (active) {
|
|
105
|
-
asap(() => {
|
|
108
|
+
(0, tools_1.asap)(() => {
|
|
106
109
|
this.switchTo(active);
|
|
107
110
|
this.update();
|
|
108
111
|
});
|
|
@@ -150,3 +153,4 @@ export class CardView extends Component {
|
|
|
150
153
|
page.addClass('@tab-page');
|
|
151
154
|
}
|
|
152
155
|
}
|
|
156
|
+
exports.CardView = CardView;
|
package/lib/checkbox.js
CHANGED
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
"use strict";
|
|
1
2
|
/**
|
|
2
3
|
* ___ ___ __
|
|
3
4
|
* \ \/ / / _
|
|
@@ -22,14 +23,16 @@
|
|
|
22
23
|
*
|
|
23
24
|
* You should have received a copy of the GNU General Public License along with this program. If not, see <https://www.gnu.org/licenses/>.
|
|
24
25
|
**/
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
26
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
27
|
+
exports.CheckBox = void 0;
|
|
28
|
+
const component_1 = require("./component");
|
|
29
|
+
const x4_events_1 = require("./x4_events");
|
|
30
|
+
const input_1 = require("./input");
|
|
31
|
+
const label_1 = require("./label");
|
|
29
32
|
/**
|
|
30
33
|
* Standard CheckBox
|
|
31
34
|
*/
|
|
32
|
-
|
|
35
|
+
class CheckBox extends component_1.Component {
|
|
33
36
|
constructor(props) {
|
|
34
37
|
super(props);
|
|
35
38
|
this.setDomEvent('focus', () => this._setFocus());
|
|
@@ -44,7 +47,7 @@ export class CheckBox extends Component {
|
|
|
44
47
|
this.addClass(props.align ?? 'left');
|
|
45
48
|
this.setProp('tag', 'label');
|
|
46
49
|
this.setContent([
|
|
47
|
-
new Input({
|
|
50
|
+
new input_1.Input({
|
|
48
51
|
ref: 'input',
|
|
49
52
|
type: 'checkbox',
|
|
50
53
|
name: props.name,
|
|
@@ -58,7 +61,7 @@ export class CheckBox extends Component {
|
|
|
58
61
|
change: this._change.bind(this),
|
|
59
62
|
}
|
|
60
63
|
}),
|
|
61
|
-
new Label({
|
|
64
|
+
new label_1.Label({
|
|
62
65
|
text: props.text ?? '',
|
|
63
66
|
width: labelWidth < 0 ? undefined : labelWidth,
|
|
64
67
|
flex: labelWidth < 0 ? -labelWidth : undefined,
|
|
@@ -76,7 +79,7 @@ export class CheckBox extends Component {
|
|
|
76
79
|
* check state changed
|
|
77
80
|
*/
|
|
78
81
|
_change() {
|
|
79
|
-
this.emit('change', EvChange(this.check));
|
|
82
|
+
this.emit('change', (0, x4_events_1.EvChange)(this.check));
|
|
80
83
|
}
|
|
81
84
|
/**
|
|
82
85
|
* focus gained/loosed
|
|
@@ -124,3 +127,4 @@ export class CheckBox extends Component {
|
|
|
124
127
|
this.check = !this.check;
|
|
125
128
|
}
|
|
126
129
|
}
|
|
130
|
+
exports.CheckBox = CheckBox;
|
package/lib/color.js
CHANGED
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
"use strict";
|
|
1
2
|
/**
|
|
2
3
|
* ___ ___ __
|
|
3
4
|
* \ \/ / / _
|
|
@@ -22,7 +23,9 @@
|
|
|
22
23
|
*
|
|
23
24
|
* You should have received a copy of the GNU General Public License along with this program. If not, see <https://www.gnu.org/licenses/>.
|
|
24
25
|
**/
|
|
25
|
-
|
|
26
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
27
|
+
exports.Color = void 0;
|
|
28
|
+
const styles_1 = require("./styles");
|
|
26
29
|
const colorValues = {
|
|
27
30
|
'lightsalmon': 0xFFFFA07A,
|
|
28
31
|
'lightseagreen': 0xFF20B2AA,
|
|
@@ -167,7 +170,7 @@ const colorValues = {
|
|
|
167
170
|
'none': 0,
|
|
168
171
|
'transparent': 0,
|
|
169
172
|
};
|
|
170
|
-
|
|
173
|
+
class Color {
|
|
171
174
|
m_value;
|
|
172
175
|
static custom = [];
|
|
173
176
|
constructor(r, g, b, a) {
|
|
@@ -495,7 +498,7 @@ export class Color {
|
|
|
495
498
|
Color.custom[name] = value;
|
|
496
499
|
}
|
|
497
500
|
static addCssColor(name) {
|
|
498
|
-
let c = Stylesheet.getVar(name);
|
|
501
|
+
let c = styles_1.Stylesheet.getVar(name);
|
|
499
502
|
Color.custom['css:' + name] = Color.parse(c.trim());
|
|
500
503
|
}
|
|
501
504
|
static parse(str) {
|
|
@@ -579,6 +582,7 @@ export class Color {
|
|
|
579
582
|
return new Color(varName).toString();
|
|
580
583
|
}
|
|
581
584
|
}
|
|
585
|
+
exports.Color = Color;
|
|
582
586
|
function _hx(n) {
|
|
583
587
|
return ('00' + n.toString(16)).substr(-2).toUpperCase();
|
|
584
588
|
}
|