jqtree 1.8.10 → 1.9.0
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/bower.json +3 -10
- package/eslint.config.mjs +47 -9
- package/package.json +50 -53
- package/pnpm-workspace.yaml +4 -0
- package/src/animation.ts +48 -0
- package/src/dataLoader.ts +38 -48
- package/src/dragAndDropHandler/dragElement.ts +11 -11
- package/src/dragAndDropHandler/generateHitAreas.ts +4 -3
- package/src/dragAndDropHandler/index.ts +119 -120
- package/src/dragAndDropHandler/iterateVisibleNodes.ts +1 -1
- package/src/dragAndDropHandler/types.ts +1 -1
- package/src/elementsRenderer.ts +71 -78
- package/src/jqtreeMethodTypes.ts +2 -2
- package/src/jqtreeOptions.ts +3 -2
- package/src/keyHandler.ts +34 -34
- package/src/mouseHandler.ts +125 -123
- package/src/node.ts +23 -27
- package/src/nodeElement/borderDropHint.ts +6 -6
- package/src/nodeElement/folderElement.ts +30 -22
- package/src/nodeElement/ghostDropHint.ts +24 -24
- package/src/nodeElement/index.ts +13 -14
- package/src/positionUtils.ts +18 -0
- package/src/saveStateHandler.ts +56 -55
- package/src/scrollHandler/containerScrollParent.ts +27 -124
- package/src/scrollHandler/createScrollParent.ts +1 -1
- package/src/scrollHandler/documentScrollParent.ts +43 -125
- package/src/scrollHandler/scrollParent.ts +117 -0
- package/src/scrollHandler.ts +24 -25
- package/src/selectNodeHandler.ts +28 -28
- package/src/simple.widget.ts +1 -3
- package/src/tree.jquery.ts +253 -279
- package/src/util.ts +0 -14
- package/src/version.ts +1 -1
- package/tree.jquery.debug.js +1044 -998
- package/tree.jquery.debug.js.map +1 -1
- package/tree.jquery.js +3 -3
- package/tree.jquery.js.map +1 -1
- package/.tool-versions +0 -2
- package/src/scrollHandler/types.ts +0 -7
package/src/tree.jquery.ts
CHANGED
|
@@ -1,19 +1,23 @@
|
|
|
1
|
-
import
|
|
1
|
+
import type { HandleFinishedLoading } from "./dataLoader";
|
|
2
|
+
import type { OnFinishOpenNode } from "./jqtreeMethodTypes";
|
|
3
|
+
import type { JQTreeOptions } from "./jqtreeOptions";
|
|
4
|
+
import type { PositionInfo } from "./mouseUtils";
|
|
5
|
+
import type { Position } from "./node";
|
|
6
|
+
import type { SavedState } from "./saveStateHandler";
|
|
7
|
+
|
|
8
|
+
import DataLoader from "./dataLoader";
|
|
2
9
|
import { DragAndDropHandler } from "./dragAndDropHandler";
|
|
3
10
|
import ElementsRenderer from "./elementsRenderer";
|
|
4
|
-
import { OnFinishOpenNode } from "./jqtreeMethodTypes";
|
|
5
|
-
import { JQTreeOptions } from "./jqtreeOptions";
|
|
6
11
|
import KeyHandler from "./keyHandler";
|
|
7
12
|
import MouseHandler from "./mouseHandler";
|
|
8
|
-
import {
|
|
9
|
-
import { Node, Position } from "./node";
|
|
13
|
+
import { Node } from "./node";
|
|
10
14
|
import NodeElement from "./nodeElement";
|
|
11
15
|
import FolderElement from "./nodeElement/folderElement";
|
|
12
|
-
import
|
|
16
|
+
import { getOffsetTop } from "./positionUtils";
|
|
17
|
+
import SaveStateHandler from "./saveStateHandler";
|
|
13
18
|
import ScrollHandler from "./scrollHandler";
|
|
14
19
|
import SelectNodeHandler from "./selectNodeHandler";
|
|
15
20
|
import SimpleWidget from "./simple.widget";
|
|
16
|
-
import { getOffsetTop, isFunction } from "./util";
|
|
17
21
|
import __version__ from "./version";
|
|
18
22
|
|
|
19
23
|
interface SelectNodeOptions {
|
|
@@ -64,18 +68,18 @@ export class JqTreeWidget extends SimpleWidget<JQTreeOptions> {
|
|
|
64
68
|
useContextMenu: true,
|
|
65
69
|
};
|
|
66
70
|
|
|
67
|
-
private
|
|
68
|
-
private
|
|
69
|
-
private
|
|
70
|
-
|
|
71
|
-
private
|
|
72
|
-
private
|
|
73
|
-
private
|
|
74
|
-
private
|
|
75
|
-
private
|
|
76
|
-
private
|
|
77
|
-
private
|
|
78
|
-
private
|
|
71
|
+
private _dataLoader: DataLoader;
|
|
72
|
+
private _dndHandler: DragAndDropHandler;
|
|
73
|
+
private _element: JQuery;
|
|
74
|
+
private _htmlElement: HTMLElement;
|
|
75
|
+
private _isInitialized: boolean;
|
|
76
|
+
private _keyHandler: KeyHandler;
|
|
77
|
+
private _mouseHandler: MouseHandler;
|
|
78
|
+
private _renderer: ElementsRenderer;
|
|
79
|
+
private _saveStateHandler: SaveStateHandler;
|
|
80
|
+
private _scrollHandler: ScrollHandler;
|
|
81
|
+
private _selectNodeHandler: SelectNodeHandler;
|
|
82
|
+
private _tree: Node;
|
|
79
83
|
|
|
80
84
|
public addNodeAfter(
|
|
81
85
|
newNodeInfo: NodeData,
|
|
@@ -84,7 +88,7 @@ export class JqTreeWidget extends SimpleWidget<JQTreeOptions> {
|
|
|
84
88
|
const newNode = existingNode.addAfter(newNodeInfo);
|
|
85
89
|
|
|
86
90
|
if (newNode) {
|
|
87
|
-
this.
|
|
91
|
+
this._refreshElements(existingNode.parent);
|
|
88
92
|
}
|
|
89
93
|
|
|
90
94
|
return newNode;
|
|
@@ -101,7 +105,7 @@ export class JqTreeWidget extends SimpleWidget<JQTreeOptions> {
|
|
|
101
105
|
const newNode = existingNode.addBefore(newNodeInfo);
|
|
102
106
|
|
|
103
107
|
if (newNode) {
|
|
104
|
-
this.
|
|
108
|
+
this._refreshElements(existingNode.parent);
|
|
105
109
|
}
|
|
106
110
|
|
|
107
111
|
return newNode;
|
|
@@ -118,7 +122,7 @@ export class JqTreeWidget extends SimpleWidget<JQTreeOptions> {
|
|
|
118
122
|
const newNode = existingNode.addParent(newNodeInfo);
|
|
119
123
|
|
|
120
124
|
if (newNode) {
|
|
121
|
-
this.
|
|
125
|
+
this._refreshElements(newNode.parent);
|
|
122
126
|
}
|
|
123
127
|
|
|
124
128
|
return newNode;
|
|
@@ -129,22 +133,22 @@ export class JqTreeWidget extends SimpleWidget<JQTreeOptions> {
|
|
|
129
133
|
throw Error(NODE_PARAM_IS_EMPTY);
|
|
130
134
|
}
|
|
131
135
|
|
|
132
|
-
this.
|
|
133
|
-
this.
|
|
136
|
+
this._selectNodeHandler.addToSelection(node);
|
|
137
|
+
this._openParents(node);
|
|
134
138
|
|
|
135
|
-
this.
|
|
139
|
+
this._getNodeElementForNode(node).select(mustSetFocus ?? true);
|
|
136
140
|
|
|
137
|
-
this.
|
|
141
|
+
this._saveState();
|
|
138
142
|
|
|
139
|
-
return this.
|
|
143
|
+
return this._element;
|
|
140
144
|
}
|
|
141
145
|
|
|
142
146
|
public appendNode(newNodeInfo: NodeData, parentNodeParam?: Node): Node {
|
|
143
|
-
const parentNode = parentNodeParam ?? this.
|
|
147
|
+
const parentNode = parentNodeParam ?? this._tree;
|
|
144
148
|
|
|
145
149
|
const node = parentNode.append(newNodeInfo);
|
|
146
150
|
|
|
147
|
-
this.
|
|
151
|
+
this._refreshElements(parentNode);
|
|
148
152
|
|
|
149
153
|
return node;
|
|
150
154
|
}
|
|
@@ -157,31 +161,31 @@ export class JqTreeWidget extends SimpleWidget<JQTreeOptions> {
|
|
|
157
161
|
const slide = slideParam ?? this.options.slide;
|
|
158
162
|
|
|
159
163
|
if (node.isFolder() || node.isEmptyFolder) {
|
|
160
|
-
this.
|
|
164
|
+
this._createFolderElement(node).close(
|
|
161
165
|
slide,
|
|
162
166
|
this.options.animationSpeed,
|
|
163
167
|
);
|
|
164
168
|
|
|
165
|
-
this.
|
|
169
|
+
this._saveState();
|
|
166
170
|
}
|
|
167
171
|
|
|
168
|
-
return this.
|
|
172
|
+
return this._element;
|
|
169
173
|
}
|
|
170
174
|
|
|
171
175
|
public deinit(): void {
|
|
172
|
-
this.
|
|
173
|
-
this.
|
|
176
|
+
this._htmlElement.textContent = "";
|
|
177
|
+
this._element.off();
|
|
174
178
|
|
|
175
|
-
this.
|
|
176
|
-
this.
|
|
179
|
+
this._keyHandler.deinit();
|
|
180
|
+
this._mouseHandler.deinit();
|
|
177
181
|
|
|
178
|
-
this.
|
|
182
|
+
this._tree = new Node({}, true);
|
|
179
183
|
|
|
180
184
|
super.deinit();
|
|
181
185
|
}
|
|
182
186
|
|
|
183
187
|
public getNodeByCallback(callback: (node: Node) => boolean): Node | null {
|
|
184
|
-
return this.
|
|
188
|
+
return this._tree.getNodeByCallback(callback);
|
|
185
189
|
}
|
|
186
190
|
|
|
187
191
|
public getNodeByHtmlElement(
|
|
@@ -190,49 +194,49 @@ export class JqTreeWidget extends SimpleWidget<JQTreeOptions> {
|
|
|
190
194
|
const element =
|
|
191
195
|
inputElement instanceof HTMLElement
|
|
192
196
|
? inputElement
|
|
193
|
-
: inputElement
|
|
197
|
+
: inputElement.get(0);
|
|
194
198
|
|
|
195
199
|
if (!element) {
|
|
196
200
|
return null;
|
|
197
201
|
}
|
|
198
202
|
|
|
199
|
-
return this.
|
|
203
|
+
return this._getNode(element);
|
|
200
204
|
}
|
|
201
205
|
|
|
202
206
|
public getNodeById(nodeId: NodeId): Node | null {
|
|
203
|
-
return this.
|
|
207
|
+
return this._tree.getNodeById(nodeId);
|
|
204
208
|
}
|
|
205
209
|
|
|
206
210
|
public getNodeByName(name: string): Node | null {
|
|
207
|
-
return this.
|
|
211
|
+
return this._tree.getNodeByName(name);
|
|
208
212
|
}
|
|
209
213
|
|
|
210
214
|
public getNodeByNameMustExist(name: string): Node {
|
|
211
|
-
return this.
|
|
215
|
+
return this._tree.getNodeByNameMustExist(name);
|
|
212
216
|
}
|
|
213
217
|
|
|
214
218
|
public getNodesByProperty(key: string, value: unknown): Node[] {
|
|
215
|
-
return this.
|
|
219
|
+
return this._tree.getNodesByProperty(key, value);
|
|
216
220
|
}
|
|
217
221
|
|
|
218
222
|
public getSelectedNode(): false | Node {
|
|
219
|
-
return this.
|
|
223
|
+
return this._selectNodeHandler.getSelectedNode();
|
|
220
224
|
}
|
|
221
225
|
|
|
222
226
|
public getSelectedNodes(): Node[] {
|
|
223
|
-
return this.
|
|
227
|
+
return this._selectNodeHandler.getSelectedNodes();
|
|
224
228
|
}
|
|
225
229
|
|
|
226
230
|
public getState(): null | SavedState {
|
|
227
|
-
return this.
|
|
231
|
+
return this._saveStateHandler.getState();
|
|
228
232
|
}
|
|
229
233
|
|
|
230
234
|
public getStateFromStorage(): null | SavedState {
|
|
231
|
-
return this.
|
|
235
|
+
return this._saveStateHandler.getStateFromStorage();
|
|
232
236
|
}
|
|
233
237
|
|
|
234
238
|
public getTree(): Node {
|
|
235
|
-
return this.
|
|
239
|
+
return this._tree;
|
|
236
240
|
}
|
|
237
241
|
|
|
238
242
|
public getVersion(): string {
|
|
@@ -242,22 +246,23 @@ export class JqTreeWidget extends SimpleWidget<JQTreeOptions> {
|
|
|
242
246
|
public init(): void {
|
|
243
247
|
super.init();
|
|
244
248
|
|
|
245
|
-
this.
|
|
246
|
-
this.
|
|
249
|
+
this._element = this.$el;
|
|
250
|
+
this._htmlElement = this._element.get(0) as HTMLElement;
|
|
251
|
+
this._isInitialized = false;
|
|
247
252
|
|
|
248
|
-
this.options.
|
|
253
|
+
this.options.dataUrl ??= this._element.data("url");
|
|
249
254
|
|
|
250
|
-
|
|
251
|
-
|
|
252
|
-
}
|
|
255
|
+
const dataRtl = this._element.data("rtl") as unknown;
|
|
256
|
+
this.options.rtl ??= dataRtl === '' ? true : Boolean(dataRtl);
|
|
253
257
|
|
|
254
|
-
this.
|
|
258
|
+
this.options.closedIcon ??= this._getDefaultClosedIcon();
|
|
255
259
|
|
|
256
|
-
this.
|
|
260
|
+
this._connectHandlers();
|
|
261
|
+
this._initData();
|
|
257
262
|
}
|
|
258
263
|
|
|
259
264
|
public isDragging(): boolean {
|
|
260
|
-
return this.
|
|
265
|
+
return this._dndHandler.isDragging;
|
|
261
266
|
}
|
|
262
267
|
|
|
263
268
|
public isNodeSelected(node?: Node): boolean {
|
|
@@ -265,12 +270,12 @@ export class JqTreeWidget extends SimpleWidget<JQTreeOptions> {
|
|
|
265
270
|
throw Error(NODE_PARAM_IS_EMPTY);
|
|
266
271
|
}
|
|
267
272
|
|
|
268
|
-
return this.
|
|
273
|
+
return this._selectNodeHandler.isNodeSelected(node);
|
|
269
274
|
}
|
|
270
275
|
|
|
271
276
|
public loadData(data: NodeData[], parentNode: Node | null): JQuery {
|
|
272
|
-
this.
|
|
273
|
-
return this.
|
|
277
|
+
this._doLoadData(data, parentNode);
|
|
278
|
+
return this._element;
|
|
274
279
|
}
|
|
275
280
|
|
|
276
281
|
/*
|
|
@@ -294,30 +299,30 @@ export class JqTreeWidget extends SimpleWidget<JQTreeOptions> {
|
|
|
294
299
|
): JQuery {
|
|
295
300
|
if (typeof param1 === "string") {
|
|
296
301
|
// first parameter is url
|
|
297
|
-
this.
|
|
302
|
+
this._doLoadDataFromUrl(
|
|
298
303
|
param1,
|
|
299
304
|
param2 as Node | null,
|
|
300
305
|
param3 ?? null,
|
|
301
306
|
);
|
|
302
307
|
} else {
|
|
303
308
|
// first parameter is not url
|
|
304
|
-
this.
|
|
309
|
+
this._doLoadDataFromUrl(
|
|
305
310
|
null,
|
|
306
311
|
param1,
|
|
307
312
|
param2 as HandleFinishedLoading | null,
|
|
308
313
|
);
|
|
309
314
|
}
|
|
310
315
|
|
|
311
|
-
return this.
|
|
316
|
+
return this._element;
|
|
312
317
|
}
|
|
313
318
|
|
|
314
319
|
public moveDown(): JQuery {
|
|
315
320
|
const selectedNode = this.getSelectedNode();
|
|
316
321
|
if (selectedNode) {
|
|
317
|
-
this.
|
|
322
|
+
this._keyHandler.moveDown(selectedNode);
|
|
318
323
|
}
|
|
319
324
|
|
|
320
|
-
return this.
|
|
325
|
+
return this._element;
|
|
321
326
|
}
|
|
322
327
|
|
|
323
328
|
public moveNode(
|
|
@@ -337,19 +342,19 @@ export class JqTreeWidget extends SimpleWidget<JQTreeOptions> {
|
|
|
337
342
|
throw Error(PARAM_IS_EMPTY + "position");
|
|
338
343
|
}
|
|
339
344
|
|
|
340
|
-
this.
|
|
341
|
-
this.
|
|
345
|
+
this._tree.moveNode(node, targetNode, position);
|
|
346
|
+
this._refreshElements(null);
|
|
342
347
|
|
|
343
|
-
return this.
|
|
348
|
+
return this._element;
|
|
344
349
|
}
|
|
345
350
|
|
|
346
351
|
public moveUp(): JQuery {
|
|
347
352
|
const selectedNode = this.getSelectedNode();
|
|
348
353
|
if (selectedNode) {
|
|
349
|
-
this.
|
|
354
|
+
this._keyHandler.moveUp(selectedNode);
|
|
350
355
|
}
|
|
351
356
|
|
|
352
|
-
return this.
|
|
357
|
+
return this._element;
|
|
353
358
|
}
|
|
354
359
|
|
|
355
360
|
public openNode(
|
|
@@ -365,50 +370,43 @@ export class JqTreeWidget extends SimpleWidget<JQTreeOptions> {
|
|
|
365
370
|
let onFinished: null | OnFinishOpenNode;
|
|
366
371
|
let slide: boolean | null;
|
|
367
372
|
|
|
368
|
-
if (
|
|
369
|
-
onFinished = param1
|
|
373
|
+
if (typeof param1 === "function") {
|
|
374
|
+
onFinished = param1;
|
|
370
375
|
slide = null;
|
|
371
376
|
} else {
|
|
372
377
|
slide = param1 as boolean;
|
|
373
378
|
onFinished = param2 as OnFinishOpenNode;
|
|
374
379
|
}
|
|
375
380
|
|
|
376
|
-
|
|
377
|
-
slide = this.options.slide;
|
|
378
|
-
}
|
|
381
|
+
slide ??= this.options.slide;
|
|
379
382
|
|
|
380
383
|
return [slide, onFinished];
|
|
381
384
|
};
|
|
382
385
|
|
|
383
386
|
const [slide, onFinished] = parseParams();
|
|
384
387
|
|
|
385
|
-
this.
|
|
386
|
-
return this.
|
|
388
|
+
this._openNodeInternal(node, slide, onFinished);
|
|
389
|
+
return this._element;
|
|
387
390
|
}
|
|
388
391
|
|
|
389
392
|
public prependNode(newNodeInfo: NodeData, parentNodeParam?: Node): Node {
|
|
390
|
-
const parentNode = parentNodeParam ?? this.
|
|
393
|
+
const parentNode = parentNodeParam ?? this._tree;
|
|
391
394
|
|
|
392
395
|
const node = parentNode.prepend(newNodeInfo);
|
|
393
396
|
|
|
394
|
-
this.
|
|
397
|
+
this._refreshElements(parentNode);
|
|
395
398
|
|
|
396
399
|
return node;
|
|
397
400
|
}
|
|
398
401
|
|
|
399
402
|
public refresh(): JQuery {
|
|
400
|
-
this.
|
|
401
|
-
return this.
|
|
402
|
-
}
|
|
403
|
-
|
|
404
|
-
public refreshHitAreas(): JQuery {
|
|
405
|
-
this.dndHandler.refresh();
|
|
406
|
-
return this.element;
|
|
403
|
+
this._refreshElements(null);
|
|
404
|
+
return this._element;
|
|
407
405
|
}
|
|
408
406
|
|
|
409
407
|
public reload(onFinished: HandleFinishedLoading | null): JQuery {
|
|
410
|
-
this.
|
|
411
|
-
return this.
|
|
408
|
+
this._doLoadDataFromUrl(null, null, onFinished);
|
|
409
|
+
return this._element;
|
|
412
410
|
}
|
|
413
411
|
|
|
414
412
|
public removeFromSelection(node?: Node): JQuery {
|
|
@@ -416,12 +414,12 @@ export class JqTreeWidget extends SimpleWidget<JQTreeOptions> {
|
|
|
416
414
|
throw Error(NODE_PARAM_IS_EMPTY);
|
|
417
415
|
}
|
|
418
416
|
|
|
419
|
-
this.
|
|
417
|
+
this._selectNodeHandler.removeFromSelection(node);
|
|
420
418
|
|
|
421
|
-
this.
|
|
422
|
-
this.
|
|
419
|
+
this._getNodeElementForNode(node).deselect();
|
|
420
|
+
this._saveState();
|
|
423
421
|
|
|
424
|
-
return this.
|
|
422
|
+
return this._element;
|
|
425
423
|
}
|
|
426
424
|
|
|
427
425
|
public removeNode(node?: Node): JQuery {
|
|
@@ -433,13 +431,13 @@ export class JqTreeWidget extends SimpleWidget<JQTreeOptions> {
|
|
|
433
431
|
throw Error("Node has no parent");
|
|
434
432
|
}
|
|
435
433
|
|
|
436
|
-
this.
|
|
434
|
+
this._selectNodeHandler.removeFromSelection(node, true); // including children
|
|
437
435
|
|
|
438
436
|
const parent = node.parent;
|
|
439
437
|
node.remove();
|
|
440
|
-
this.
|
|
438
|
+
this._refreshElements(parent);
|
|
441
439
|
|
|
442
|
-
return this.
|
|
440
|
+
return this._element;
|
|
443
441
|
}
|
|
444
442
|
|
|
445
443
|
public scrollToNode(node?: Node): JQuery {
|
|
@@ -448,38 +446,38 @@ export class JqTreeWidget extends SimpleWidget<JQTreeOptions> {
|
|
|
448
446
|
}
|
|
449
447
|
|
|
450
448
|
if (!node.element) {
|
|
451
|
-
return this.
|
|
449
|
+
return this._element;
|
|
452
450
|
}
|
|
453
451
|
|
|
454
452
|
const top =
|
|
455
453
|
getOffsetTop(node.element) -
|
|
456
|
-
getOffsetTop(this
|
|
454
|
+
getOffsetTop(this._htmlElement);
|
|
457
455
|
|
|
458
|
-
this.
|
|
456
|
+
this._scrollHandler.scrollToY(top);
|
|
459
457
|
|
|
460
|
-
return this.
|
|
458
|
+
return this._element;
|
|
461
459
|
}
|
|
462
460
|
|
|
463
461
|
public selectNode(
|
|
464
462
|
node: Node | null,
|
|
465
463
|
optionsParam?: SelectNodeOptions,
|
|
466
464
|
): JQuery {
|
|
467
|
-
this.
|
|
468
|
-
return this.
|
|
465
|
+
this._doSelectNode(node, optionsParam);
|
|
466
|
+
return this._element;
|
|
469
467
|
}
|
|
470
468
|
|
|
471
469
|
public setOption(option: string, value: unknown): JQuery {
|
|
472
470
|
(this.options as unknown as Record<string, unknown>)[option] = value;
|
|
473
|
-
return this.
|
|
471
|
+
return this._element;
|
|
474
472
|
}
|
|
475
473
|
|
|
476
474
|
public setState(state?: SavedState): JQuery {
|
|
477
475
|
if (state) {
|
|
478
|
-
this.
|
|
479
|
-
this.
|
|
476
|
+
this._saveStateHandler.setInitialState(state);
|
|
477
|
+
this._refreshElements(null);
|
|
480
478
|
}
|
|
481
479
|
|
|
482
|
-
return this.
|
|
480
|
+
return this._element;
|
|
483
481
|
}
|
|
484
482
|
|
|
485
483
|
public toggle(node?: Node, slideParam: boolean | null = null): JQuery {
|
|
@@ -495,11 +493,11 @@ export class JqTreeWidget extends SimpleWidget<JQTreeOptions> {
|
|
|
495
493
|
this.openNode(node, slide);
|
|
496
494
|
}
|
|
497
495
|
|
|
498
|
-
return this.
|
|
496
|
+
return this._element;
|
|
499
497
|
}
|
|
500
498
|
|
|
501
499
|
public toJson(): string {
|
|
502
|
-
return JSON.stringify(this.
|
|
500
|
+
return JSON.stringify(this._tree.getData());
|
|
503
501
|
}
|
|
504
502
|
|
|
505
503
|
public updateNode(node?: Node, data?: NodeData): JQuery {
|
|
@@ -508,20 +506,20 @@ export class JqTreeWidget extends SimpleWidget<JQTreeOptions> {
|
|
|
508
506
|
}
|
|
509
507
|
|
|
510
508
|
if (!data) {
|
|
511
|
-
return this.
|
|
509
|
+
return this._element;
|
|
512
510
|
}
|
|
513
511
|
|
|
514
512
|
const idIsChanged =
|
|
515
513
|
typeof data === "object" && data.id && data.id !== node.id;
|
|
516
514
|
|
|
517
515
|
if (idIsChanged) {
|
|
518
|
-
this.
|
|
516
|
+
this._tree.removeNodeFromIndex(node);
|
|
519
517
|
}
|
|
520
518
|
|
|
521
519
|
node.setData(data);
|
|
522
520
|
|
|
523
521
|
if (idIsChanged) {
|
|
524
|
-
this.
|
|
522
|
+
this._tree.addNodeToIndex(node);
|
|
525
523
|
}
|
|
526
524
|
|
|
527
525
|
if (
|
|
@@ -532,16 +530,16 @@ export class JqTreeWidget extends SimpleWidget<JQTreeOptions> {
|
|
|
532
530
|
node.removeChildren();
|
|
533
531
|
|
|
534
532
|
if (data.children.length) {
|
|
535
|
-
node.loadFromData(data.children
|
|
533
|
+
node.loadFromData(data.children);
|
|
536
534
|
}
|
|
537
535
|
}
|
|
538
536
|
|
|
539
|
-
this.
|
|
537
|
+
this._refreshElements(node);
|
|
540
538
|
|
|
541
|
-
return this.
|
|
539
|
+
return this._element;
|
|
542
540
|
}
|
|
543
541
|
|
|
544
|
-
private
|
|
542
|
+
private _connectHandlers() {
|
|
545
543
|
const {
|
|
546
544
|
autoEscape,
|
|
547
545
|
buttonLeft,
|
|
@@ -569,20 +567,18 @@ export class JqTreeWidget extends SimpleWidget<JQTreeOptions> {
|
|
|
569
567
|
} = this.options;
|
|
570
568
|
|
|
571
569
|
const closeNode = this.closeNode.bind(this);
|
|
572
|
-
const getNodeElement = this.
|
|
573
|
-
const getNodeElementForNode = this.
|
|
570
|
+
const getNodeElement = this._getNodeElement.bind(this);
|
|
571
|
+
const getNodeElementForNode = this._getNodeElementForNode.bind(this);
|
|
574
572
|
const getNodeById = this.getNodeById.bind(this);
|
|
575
573
|
const getSelectedNode = this.getSelectedNode.bind(this);
|
|
576
574
|
const getTree = this.getTree.bind(this);
|
|
577
|
-
const isFocusOnTree = this.
|
|
575
|
+
const isFocusOnTree = this._isFocusOnTree.bind(this);
|
|
578
576
|
const loadData = this.loadData.bind(this);
|
|
579
|
-
const openNode = this.
|
|
580
|
-
const refreshElements = this.
|
|
581
|
-
const refreshHitAreas = this.refreshHitAreas.bind(this);
|
|
577
|
+
const openNode = this._openNodeInternal.bind(this);
|
|
578
|
+
const refreshElements = this._refreshElements.bind(this);
|
|
582
579
|
const selectNode = this.selectNode.bind(this);
|
|
583
|
-
const
|
|
584
|
-
const
|
|
585
|
-
const triggerEvent = this.triggerEvent.bind(this);
|
|
580
|
+
const treeElement = this._htmlElement;
|
|
581
|
+
const triggerEvent = this._triggerEvent.bind(this);
|
|
586
582
|
|
|
587
583
|
const selectNodeHandler = new SelectNodeHandler({
|
|
588
584
|
getNodeById,
|
|
@@ -598,6 +594,10 @@ export class JqTreeWidget extends SimpleWidget<JQTreeOptions> {
|
|
|
598
594
|
selectNodeHandler.removeFromSelection.bind(selectNodeHandler);
|
|
599
595
|
const getMouseDelay = () => this.options.startDndDelay ?? 0;
|
|
600
596
|
|
|
597
|
+
const refreshHitAreas = () => {
|
|
598
|
+
dndHandler.refresh();
|
|
599
|
+
}
|
|
600
|
+
|
|
601
601
|
const dataLoader = new DataLoader({
|
|
602
602
|
dataFilter,
|
|
603
603
|
loadData,
|
|
@@ -656,12 +656,12 @@ export class JqTreeWidget extends SimpleWidget<JQTreeOptions> {
|
|
|
656
656
|
});
|
|
657
657
|
|
|
658
658
|
const renderer = new ElementsRenderer({
|
|
659
|
-
$element: $treeElement,
|
|
660
659
|
autoEscape,
|
|
661
660
|
buttonLeft,
|
|
662
661
|
closedIcon,
|
|
663
662
|
dragAndDrop,
|
|
664
663
|
getTree,
|
|
664
|
+
htmlElement: treeElement,
|
|
665
665
|
isNodeSelected,
|
|
666
666
|
onCreateLi,
|
|
667
667
|
openedIcon,
|
|
@@ -670,18 +670,18 @@ export class JqTreeWidget extends SimpleWidget<JQTreeOptions> {
|
|
|
670
670
|
tabIndex,
|
|
671
671
|
});
|
|
672
672
|
|
|
673
|
-
const getNode = this.
|
|
674
|
-
const onMouseCapture = this.
|
|
675
|
-
const onMouseDrag = this.
|
|
676
|
-
const onMouseStart = this.
|
|
677
|
-
const onMouseStop = this.
|
|
673
|
+
const getNode = this._getNode.bind(this);
|
|
674
|
+
const onMouseCapture = this._mouseCapture.bind(this);
|
|
675
|
+
const onMouseDrag = this._mouseDrag.bind(this);
|
|
676
|
+
const onMouseStart = this._mouseStart.bind(this);
|
|
677
|
+
const onMouseStop = this._mouseStop.bind(this);
|
|
678
678
|
|
|
679
679
|
const mouseHandler = new MouseHandler({
|
|
680
680
|
element: treeElement,
|
|
681
681
|
getMouseDelay,
|
|
682
682
|
getNode,
|
|
683
683
|
onClickButton: this.toggle.bind(this),
|
|
684
|
-
onClickTitle: this.
|
|
684
|
+
onClickTitle: this._doSelectNode.bind(this),
|
|
685
685
|
onMouseCapture,
|
|
686
686
|
onMouseDrag,
|
|
687
687
|
onMouseStart,
|
|
@@ -690,31 +690,30 @@ export class JqTreeWidget extends SimpleWidget<JQTreeOptions> {
|
|
|
690
690
|
useContextMenu: this.options.useContextMenu,
|
|
691
691
|
});
|
|
692
692
|
|
|
693
|
-
this.
|
|
694
|
-
this.
|
|
695
|
-
this.
|
|
696
|
-
this.
|
|
697
|
-
this.
|
|
698
|
-
this.
|
|
699
|
-
this.
|
|
700
|
-
this.
|
|
693
|
+
this._dataLoader = dataLoader;
|
|
694
|
+
this._dndHandler = dndHandler;
|
|
695
|
+
this._keyHandler = keyHandler;
|
|
696
|
+
this._mouseHandler = mouseHandler;
|
|
697
|
+
this._renderer = renderer;
|
|
698
|
+
this._saveStateHandler = saveStateHandler;
|
|
699
|
+
this._scrollHandler = scrollHandler;
|
|
700
|
+
this._selectNodeHandler = selectNodeHandler;
|
|
701
701
|
}
|
|
702
702
|
|
|
703
|
-
private
|
|
704
|
-
const node = this.
|
|
703
|
+
private _containsElement(element: HTMLElement): boolean {
|
|
704
|
+
const node = this._getNode(element);
|
|
705
705
|
|
|
706
|
-
return node
|
|
706
|
+
return node?.tree === this._tree;
|
|
707
707
|
}
|
|
708
708
|
|
|
709
|
-
private
|
|
710
|
-
const closedIconElement = this.
|
|
711
|
-
const getScrollLeft = this.
|
|
712
|
-
this.
|
|
709
|
+
private _createFolderElement(node: Node) {
|
|
710
|
+
const closedIconElement = this._renderer.closedIconElement;
|
|
711
|
+
const getScrollLeft = this._scrollHandler.getScrollLeft.bind(
|
|
712
|
+
this._scrollHandler,
|
|
713
713
|
);
|
|
714
|
-
const openedIconElement = this.
|
|
714
|
+
const openedIconElement = this._renderer.openedIconElement;
|
|
715
715
|
const tabIndex = this.options.tabIndex;
|
|
716
|
-
const
|
|
717
|
-
const triggerEvent = this.triggerEvent.bind(this);
|
|
716
|
+
const triggerEvent = this._triggerEvent.bind(this);
|
|
718
717
|
|
|
719
718
|
return new FolderElement({
|
|
720
719
|
closedIconElement,
|
|
@@ -722,84 +721,83 @@ export class JqTreeWidget extends SimpleWidget<JQTreeOptions> {
|
|
|
722
721
|
node,
|
|
723
722
|
openedIconElement,
|
|
724
723
|
tabIndex,
|
|
725
|
-
treeElement,
|
|
724
|
+
treeElement: this._htmlElement,
|
|
726
725
|
triggerEvent,
|
|
727
726
|
});
|
|
728
727
|
}
|
|
729
728
|
|
|
730
|
-
private
|
|
731
|
-
const getScrollLeft = this.
|
|
732
|
-
this.
|
|
729
|
+
private _createNodeElement(node: Node) {
|
|
730
|
+
const getScrollLeft = this._scrollHandler.getScrollLeft.bind(
|
|
731
|
+
this._scrollHandler,
|
|
733
732
|
);
|
|
734
733
|
const tabIndex = this.options.tabIndex;
|
|
735
|
-
const treeElement = this.element.get(0) as HTMLElement;
|
|
736
734
|
|
|
737
735
|
return new NodeElement({
|
|
738
736
|
getScrollLeft,
|
|
739
737
|
node,
|
|
740
738
|
tabIndex,
|
|
741
|
-
treeElement
|
|
739
|
+
treeElement: this._htmlElement
|
|
742
740
|
});
|
|
743
741
|
}
|
|
744
742
|
|
|
745
|
-
private
|
|
743
|
+
private _deselectCurrentNode(): void {
|
|
746
744
|
const node = this.getSelectedNode();
|
|
747
745
|
if (node) {
|
|
748
746
|
this.removeFromSelection(node);
|
|
749
747
|
}
|
|
750
748
|
}
|
|
751
749
|
|
|
752
|
-
private
|
|
750
|
+
private _deselectNodes(parentNode: Node): void {
|
|
753
751
|
const selectedNodesUnderParent =
|
|
754
|
-
this.
|
|
752
|
+
this._selectNodeHandler.getSelectedNodesUnder(parentNode);
|
|
755
753
|
for (const n of selectedNodesUnderParent) {
|
|
756
|
-
this.
|
|
754
|
+
this._selectNodeHandler.removeFromSelection(n);
|
|
757
755
|
}
|
|
758
756
|
}
|
|
759
757
|
|
|
760
|
-
private
|
|
758
|
+
private _doLoadData(data: NodeData[] | null, parentNode: Node | null): void {
|
|
761
759
|
if (data) {
|
|
762
760
|
if (parentNode) {
|
|
763
|
-
this.
|
|
764
|
-
this.
|
|
761
|
+
this._deselectNodes(parentNode);
|
|
762
|
+
this._loadSubtree(data, parentNode);
|
|
765
763
|
} else {
|
|
766
|
-
this.
|
|
764
|
+
this._initTree(data);
|
|
767
765
|
}
|
|
768
766
|
|
|
769
767
|
if (this.isDragging()) {
|
|
770
|
-
this.
|
|
768
|
+
this._dndHandler.refresh();
|
|
771
769
|
}
|
|
772
770
|
}
|
|
773
771
|
|
|
774
|
-
this.
|
|
772
|
+
this._triggerEvent("tree.load_data", {
|
|
775
773
|
parent_node: parentNode,
|
|
776
774
|
tree_data: data,
|
|
777
775
|
});
|
|
778
776
|
}
|
|
779
777
|
|
|
780
|
-
private
|
|
778
|
+
private _doLoadDataFromUrl(
|
|
781
779
|
urlInfoParam: JQuery.AjaxSettings | null | string,
|
|
782
780
|
parentNode: Node | null,
|
|
783
781
|
onFinished: HandleFinishedLoading | null,
|
|
784
782
|
): void {
|
|
785
|
-
const urlInfo = urlInfoParam ?? this.
|
|
783
|
+
const urlInfo = urlInfoParam ?? this._getDataUrlInfo(parentNode);
|
|
786
784
|
|
|
787
|
-
this.
|
|
785
|
+
this._dataLoader.loadFromUrl(urlInfo, parentNode, onFinished);
|
|
788
786
|
}
|
|
789
787
|
|
|
790
|
-
private
|
|
788
|
+
private _doSelectNode(
|
|
791
789
|
node: Node | null,
|
|
792
790
|
optionsParam?: SelectNodeOptions,
|
|
793
791
|
): void {
|
|
794
792
|
const saveState = (): void => {
|
|
795
793
|
if (this.options.saveState) {
|
|
796
|
-
this.
|
|
794
|
+
this._saveStateHandler.saveState();
|
|
797
795
|
}
|
|
798
796
|
};
|
|
799
797
|
|
|
800
798
|
if (!node) {
|
|
801
799
|
// Called with empty node -> deselect current node
|
|
802
|
-
this.
|
|
800
|
+
this._deselectCurrentNode();
|
|
803
801
|
saveState();
|
|
804
802
|
return;
|
|
805
803
|
}
|
|
@@ -821,30 +819,30 @@ export class JqTreeWidget extends SimpleWidget<JQTreeOptions> {
|
|
|
821
819
|
return;
|
|
822
820
|
}
|
|
823
821
|
|
|
824
|
-
if (this.
|
|
822
|
+
if (this._selectNodeHandler.isNodeSelected(node)) {
|
|
825
823
|
if (selectOptions.mustToggle) {
|
|
826
|
-
this.
|
|
827
|
-
this.
|
|
824
|
+
this._deselectCurrentNode();
|
|
825
|
+
this._triggerEvent("tree.select", {
|
|
828
826
|
node: null,
|
|
829
827
|
previous_node: node,
|
|
830
828
|
});
|
|
831
829
|
}
|
|
832
830
|
} else {
|
|
833
831
|
const deselectedNode = this.getSelectedNode() || null;
|
|
834
|
-
this.
|
|
832
|
+
this._deselectCurrentNode();
|
|
835
833
|
this.addToSelection(node, selectOptions.mustSetFocus);
|
|
836
834
|
|
|
837
|
-
this.
|
|
835
|
+
this._triggerEvent("tree.select", {
|
|
838
836
|
deselected_node: deselectedNode,
|
|
839
837
|
node,
|
|
840
838
|
});
|
|
841
|
-
this.
|
|
839
|
+
this._openParents(node);
|
|
842
840
|
}
|
|
843
841
|
|
|
844
842
|
saveState();
|
|
845
843
|
}
|
|
846
844
|
|
|
847
|
-
private
|
|
845
|
+
private _getAutoOpenMaxLevel(): number {
|
|
848
846
|
if (this.options.autoOpen === true) {
|
|
849
847
|
return -1;
|
|
850
848
|
} else if (typeof this.options.autoOpen === "number") {
|
|
@@ -856,10 +854,7 @@ export class JqTreeWidget extends SimpleWidget<JQTreeOptions> {
|
|
|
856
854
|
}
|
|
857
855
|
}
|
|
858
856
|
|
|
859
|
-
private
|
|
860
|
-
const dataUrl =
|
|
861
|
-
this.options.dataUrl ?? (this.element.data("url") as null | string);
|
|
862
|
-
|
|
857
|
+
private _getDataUrlInfo(node: Node | null): JQuery.AjaxSettings | null {
|
|
863
858
|
const getUrlFromString = (url: string): JQuery.AjaxSettings => {
|
|
864
859
|
const urlInfo: JQuery.AjaxSettings = { url };
|
|
865
860
|
|
|
@@ -875,7 +870,7 @@ export class JqTreeWidget extends SimpleWidget<JQTreeOptions> {
|
|
|
875
870
|
urlInfo.data = data;
|
|
876
871
|
} else {
|
|
877
872
|
// Add selected_node parameter
|
|
878
|
-
const selectedNodeId = this.
|
|
873
|
+
const selectedNodeId = this._getNodeIdToBeSelected();
|
|
879
874
|
if (selectedNodeId) {
|
|
880
875
|
const data = { selected_node: selectedNodeId };
|
|
881
876
|
urlInfo.data = data;
|
|
@@ -883,6 +878,7 @@ export class JqTreeWidget extends SimpleWidget<JQTreeOptions> {
|
|
|
883
878
|
}
|
|
884
879
|
};
|
|
885
880
|
|
|
881
|
+
const dataUrl = this.options.dataUrl;
|
|
886
882
|
if (typeof dataUrl === "function") {
|
|
887
883
|
return dataUrl(node);
|
|
888
884
|
} else if (typeof dataUrl === "string") {
|
|
@@ -895,7 +891,7 @@ export class JqTreeWidget extends SimpleWidget<JQTreeOptions> {
|
|
|
895
891
|
}
|
|
896
892
|
}
|
|
897
893
|
|
|
898
|
-
private
|
|
894
|
+
private _getDefaultClosedIcon(): string {
|
|
899
895
|
if (this.options.rtl) {
|
|
900
896
|
// triangle to the left
|
|
901
897
|
return "◀";
|
|
@@ -905,7 +901,7 @@ export class JqTreeWidget extends SimpleWidget<JQTreeOptions> {
|
|
|
905
901
|
}
|
|
906
902
|
}
|
|
907
903
|
|
|
908
|
-
private
|
|
904
|
+
private _getNode(element: HTMLElement): Node | null {
|
|
909
905
|
const liElement = element.closest("li.jqtree_common");
|
|
910
906
|
|
|
911
907
|
if (liElement) {
|
|
@@ -915,104 +911,82 @@ export class JqTreeWidget extends SimpleWidget<JQTreeOptions> {
|
|
|
915
911
|
}
|
|
916
912
|
}
|
|
917
913
|
|
|
918
|
-
private
|
|
919
|
-
const node = this.
|
|
914
|
+
private _getNodeElement(element: HTMLElement): NodeElement | null {
|
|
915
|
+
const node = this._getNode(element);
|
|
920
916
|
if (node) {
|
|
921
|
-
return this.
|
|
917
|
+
return this._getNodeElementForNode(node);
|
|
922
918
|
} else {
|
|
923
919
|
return null;
|
|
924
920
|
}
|
|
925
921
|
}
|
|
926
922
|
|
|
927
|
-
private
|
|
923
|
+
private _getNodeElementForNode(node: Node): NodeElement {
|
|
928
924
|
if (node.isFolder()) {
|
|
929
|
-
return this.
|
|
925
|
+
return this._createFolderElement(node);
|
|
930
926
|
} else {
|
|
931
|
-
return this.
|
|
927
|
+
return this._createNodeElement(node);
|
|
932
928
|
}
|
|
933
929
|
}
|
|
934
930
|
|
|
935
|
-
private
|
|
931
|
+
private _getNodeIdToBeSelected(): NodeId | null {
|
|
936
932
|
if (this.options.saveState) {
|
|
937
|
-
return this.
|
|
933
|
+
return this._saveStateHandler.getNodeIdToBeSelected();
|
|
938
934
|
} else {
|
|
939
935
|
return null;
|
|
940
936
|
}
|
|
941
937
|
}
|
|
942
938
|
|
|
943
|
-
private
|
|
944
|
-
if (this.options.rtl != null) {
|
|
945
|
-
return this.options.rtl;
|
|
946
|
-
} else {
|
|
947
|
-
const dataRtl = this.element.data("rtl") as unknown;
|
|
948
|
-
|
|
949
|
-
if (
|
|
950
|
-
dataRtl !== null &&
|
|
951
|
-
dataRtl !== false &&
|
|
952
|
-
dataRtl !== undefined
|
|
953
|
-
) {
|
|
954
|
-
return true;
|
|
955
|
-
} else {
|
|
956
|
-
return false;
|
|
957
|
-
}
|
|
958
|
-
}
|
|
959
|
-
}
|
|
960
|
-
|
|
961
|
-
private initData(): void {
|
|
939
|
+
private _initData(): void {
|
|
962
940
|
if (this.options.data) {
|
|
963
|
-
this.
|
|
941
|
+
this._doLoadData(this.options.data, null);
|
|
964
942
|
} else {
|
|
965
|
-
const dataUrl = this.
|
|
943
|
+
const dataUrl = this._getDataUrlInfo(null);
|
|
966
944
|
|
|
967
945
|
if (dataUrl) {
|
|
968
|
-
this.
|
|
946
|
+
this._doLoadDataFromUrl(null, null, null);
|
|
969
947
|
} else {
|
|
970
|
-
this.
|
|
948
|
+
this._doLoadData([], null);
|
|
971
949
|
}
|
|
972
950
|
}
|
|
973
951
|
}
|
|
974
952
|
|
|
975
|
-
private
|
|
953
|
+
private _initTree(data: NodeData[]): void {
|
|
976
954
|
const doInit = (): void => {
|
|
977
|
-
if (!this.
|
|
978
|
-
this.
|
|
979
|
-
this.
|
|
955
|
+
if (!this._isInitialized) {
|
|
956
|
+
this._isInitialized = true;
|
|
957
|
+
this._triggerEvent("tree.init");
|
|
980
958
|
}
|
|
981
959
|
};
|
|
982
960
|
|
|
983
|
-
this.
|
|
961
|
+
this._tree = new this.options.nodeClass(
|
|
984
962
|
null,
|
|
985
963
|
true,
|
|
986
964
|
this.options.nodeClass,
|
|
987
965
|
);
|
|
988
966
|
|
|
989
|
-
this.
|
|
967
|
+
this._selectNodeHandler.clear();
|
|
990
968
|
|
|
991
|
-
this.
|
|
969
|
+
this._tree.loadFromData(data);
|
|
992
970
|
|
|
993
|
-
const mustLoadOnDemand = this.
|
|
971
|
+
const mustLoadOnDemand = this._setInitialState();
|
|
994
972
|
|
|
995
|
-
this.
|
|
973
|
+
this._refreshElements(null);
|
|
996
974
|
|
|
997
975
|
if (!mustLoadOnDemand) {
|
|
998
976
|
doInit();
|
|
999
977
|
} else {
|
|
1000
978
|
// Load data on demand and then init the tree
|
|
1001
|
-
this.
|
|
979
|
+
this._setInitialStateOnDemand(doInit);
|
|
1002
980
|
}
|
|
1003
981
|
}
|
|
1004
982
|
|
|
1005
|
-
private
|
|
983
|
+
private _isFocusOnTree(): boolean {
|
|
1006
984
|
const activeElement = document.activeElement;
|
|
1007
985
|
|
|
1008
|
-
return
|
|
1009
|
-
activeElement &&
|
|
1010
|
-
activeElement.tagName === "SPAN" &&
|
|
1011
|
-
this.containsElement(activeElement as HTMLElement),
|
|
1012
|
-
);
|
|
986
|
+
return activeElement?.tagName === "SPAN" && this._containsElement(activeElement as HTMLElement);
|
|
1013
987
|
}
|
|
1014
988
|
|
|
1015
|
-
private
|
|
989
|
+
private _isSelectedNodeInSubtree(subtree: Node): boolean {
|
|
1016
990
|
const selectedNode = this.getSelectedNode();
|
|
1017
991
|
|
|
1018
992
|
if (!selectedNode) {
|
|
@@ -1022,64 +996,64 @@ export class JqTreeWidget extends SimpleWidget<JQTreeOptions> {
|
|
|
1022
996
|
}
|
|
1023
997
|
}
|
|
1024
998
|
|
|
1025
|
-
private
|
|
999
|
+
private _loadFolderOnDemand(
|
|
1026
1000
|
node: Node,
|
|
1027
1001
|
slide = true,
|
|
1028
1002
|
onFinished?: OnFinishOpenNode,
|
|
1029
1003
|
): void {
|
|
1030
1004
|
node.is_loading = true;
|
|
1031
1005
|
|
|
1032
|
-
this.
|
|
1033
|
-
this.
|
|
1006
|
+
this._doLoadDataFromUrl(null, node, () => {
|
|
1007
|
+
this._openNodeInternal(node, slide, onFinished);
|
|
1034
1008
|
});
|
|
1035
1009
|
}
|
|
1036
1010
|
|
|
1037
|
-
private
|
|
1011
|
+
private _loadSubtree(data: NodeData[], parentNode: Node): void {
|
|
1038
1012
|
parentNode.loadFromData(data);
|
|
1039
1013
|
|
|
1040
1014
|
parentNode.load_on_demand = false;
|
|
1041
1015
|
parentNode.is_loading = false;
|
|
1042
1016
|
|
|
1043
|
-
this.
|
|
1017
|
+
this._refreshElements(parentNode);
|
|
1044
1018
|
}
|
|
1045
1019
|
|
|
1046
|
-
private
|
|
1020
|
+
private _mouseCapture(positionInfo: PositionInfo): boolean | null {
|
|
1047
1021
|
if (this.options.dragAndDrop) {
|
|
1048
|
-
return this.
|
|
1022
|
+
return this._dndHandler.mouseCapture(positionInfo);
|
|
1049
1023
|
} else {
|
|
1050
1024
|
return false;
|
|
1051
1025
|
}
|
|
1052
1026
|
}
|
|
1053
1027
|
|
|
1054
|
-
private
|
|
1028
|
+
private _mouseDrag(positionInfo: PositionInfo): boolean {
|
|
1055
1029
|
if (this.options.dragAndDrop) {
|
|
1056
|
-
const result = this.
|
|
1030
|
+
const result = this._dndHandler.mouseDrag(positionInfo);
|
|
1057
1031
|
|
|
1058
|
-
this.
|
|
1032
|
+
this._scrollHandler.checkScrolling(positionInfo);
|
|
1059
1033
|
return result;
|
|
1060
1034
|
} else {
|
|
1061
1035
|
return false;
|
|
1062
1036
|
}
|
|
1063
1037
|
}
|
|
1064
1038
|
|
|
1065
|
-
private
|
|
1039
|
+
private _mouseStart(positionInfo: PositionInfo): boolean {
|
|
1066
1040
|
if (this.options.dragAndDrop) {
|
|
1067
|
-
return this.
|
|
1041
|
+
return this._dndHandler.mouseStart(positionInfo);
|
|
1068
1042
|
} else {
|
|
1069
1043
|
return false;
|
|
1070
1044
|
}
|
|
1071
1045
|
}
|
|
1072
1046
|
|
|
1073
|
-
private
|
|
1047
|
+
private _mouseStop(positionInfo: PositionInfo): boolean {
|
|
1074
1048
|
if (this.options.dragAndDrop) {
|
|
1075
|
-
this.
|
|
1076
|
-
return this.
|
|
1049
|
+
this._scrollHandler.stopScrolling();
|
|
1050
|
+
return this._dndHandler.mouseStop(positionInfo);
|
|
1077
1051
|
} else {
|
|
1078
1052
|
return false;
|
|
1079
1053
|
}
|
|
1080
1054
|
}
|
|
1081
1055
|
|
|
1082
|
-
private
|
|
1056
|
+
private _openNodeInternal(
|
|
1083
1057
|
node: Node,
|
|
1084
1058
|
slide = true,
|
|
1085
1059
|
onFinished?: OnFinishOpenNode,
|
|
@@ -1093,7 +1067,7 @@ export class JqTreeWidget extends SimpleWidget<JQTreeOptions> {
|
|
|
1093
1067
|
return;
|
|
1094
1068
|
}
|
|
1095
1069
|
|
|
1096
|
-
const folderElement = this.
|
|
1070
|
+
const folderElement = this._createFolderElement(_node);
|
|
1097
1071
|
folderElement.open(
|
|
1098
1072
|
_onFinished,
|
|
1099
1073
|
_slide,
|
|
@@ -1103,7 +1077,7 @@ export class JqTreeWidget extends SimpleWidget<JQTreeOptions> {
|
|
|
1103
1077
|
|
|
1104
1078
|
if (node.isFolder() || node.isEmptyFolder) {
|
|
1105
1079
|
if (node.load_on_demand) {
|
|
1106
|
-
this.
|
|
1080
|
+
this._loadFolderOnDemand(node, slide, onFinished);
|
|
1107
1081
|
} else {
|
|
1108
1082
|
let parent = node.parent;
|
|
1109
1083
|
|
|
@@ -1116,12 +1090,12 @@ export class JqTreeWidget extends SimpleWidget<JQTreeOptions> {
|
|
|
1116
1090
|
}
|
|
1117
1091
|
|
|
1118
1092
|
doOpenNode(node, slide, onFinished);
|
|
1119
|
-
this.
|
|
1093
|
+
this._saveState();
|
|
1120
1094
|
}
|
|
1121
1095
|
}
|
|
1122
1096
|
}
|
|
1123
1097
|
|
|
1124
|
-
private
|
|
1098
|
+
private _openParents(node: Node) {
|
|
1125
1099
|
const parent = node.parent;
|
|
1126
1100
|
|
|
1127
1101
|
if (parent?.parent && !parent.is_open) {
|
|
@@ -1133,50 +1107,50 @@ export class JqTreeWidget extends SimpleWidget<JQTreeOptions> {
|
|
|
1133
1107
|
Redraw the tree or part of the tree.
|
|
1134
1108
|
from_node: redraw this subtree
|
|
1135
1109
|
*/
|
|
1136
|
-
private
|
|
1137
|
-
const mustSetFocus = this.
|
|
1110
|
+
private _refreshElements(fromNode: Node | null): void {
|
|
1111
|
+
const mustSetFocus = this._isFocusOnTree();
|
|
1138
1112
|
const mustSelect = fromNode
|
|
1139
|
-
? this.
|
|
1113
|
+
? this._isSelectedNodeInSubtree(fromNode)
|
|
1140
1114
|
: false;
|
|
1141
1115
|
|
|
1142
|
-
this.
|
|
1116
|
+
this._renderer.render(fromNode);
|
|
1143
1117
|
|
|
1144
1118
|
if (mustSelect) {
|
|
1145
|
-
this.
|
|
1119
|
+
this._selectCurrentNode(mustSetFocus);
|
|
1146
1120
|
}
|
|
1147
1121
|
|
|
1148
|
-
this.
|
|
1122
|
+
this._triggerEvent("tree.refresh");
|
|
1149
1123
|
}
|
|
1150
1124
|
|
|
1151
|
-
private
|
|
1125
|
+
private _saveState(): void {
|
|
1152
1126
|
if (this.options.saveState) {
|
|
1153
|
-
this.
|
|
1127
|
+
this._saveStateHandler.saveState();
|
|
1154
1128
|
}
|
|
1155
1129
|
}
|
|
1156
1130
|
|
|
1157
|
-
private
|
|
1131
|
+
private _selectCurrentNode(mustSetFocus: boolean): void {
|
|
1158
1132
|
const node = this.getSelectedNode();
|
|
1159
1133
|
if (node) {
|
|
1160
|
-
const nodeElement = this.
|
|
1134
|
+
const nodeElement = this._getNodeElementForNode(node);
|
|
1161
1135
|
nodeElement.select(mustSetFocus);
|
|
1162
1136
|
}
|
|
1163
1137
|
}
|
|
1164
1138
|
|
|
1165
1139
|
// Set initial state, either by restoring the state or auto-opening nodes
|
|
1166
1140
|
// result: must load nodes on demand?
|
|
1167
|
-
private
|
|
1141
|
+
private _setInitialState(): boolean {
|
|
1168
1142
|
const restoreState = (): [boolean, boolean] => {
|
|
1169
1143
|
// result: is state restored, must load on demand?
|
|
1170
1144
|
if (!this.options.saveState) {
|
|
1171
1145
|
return [false, false];
|
|
1172
1146
|
} else {
|
|
1173
|
-
const state = this.
|
|
1147
|
+
const state = this._saveStateHandler.getStateFromStorage();
|
|
1174
1148
|
|
|
1175
1149
|
if (!state) {
|
|
1176
1150
|
return [false, false];
|
|
1177
1151
|
} else {
|
|
1178
1152
|
const mustLoadOnDemand =
|
|
1179
|
-
this.
|
|
1153
|
+
this._saveStateHandler.setInitialState(state);
|
|
1180
1154
|
|
|
1181
1155
|
// return true: the state is restored
|
|
1182
1156
|
return [true, mustLoadOnDemand];
|
|
@@ -1190,10 +1164,10 @@ export class JqTreeWidget extends SimpleWidget<JQTreeOptions> {
|
|
|
1190
1164
|
return false;
|
|
1191
1165
|
}
|
|
1192
1166
|
|
|
1193
|
-
const maxLevel = this.
|
|
1167
|
+
const maxLevel = this._getAutoOpenMaxLevel();
|
|
1194
1168
|
let mustLoadOnDemand = false;
|
|
1195
1169
|
|
|
1196
|
-
this.
|
|
1170
|
+
this._tree.iterate((node: Node, level: number) => {
|
|
1197
1171
|
if (node.load_on_demand) {
|
|
1198
1172
|
mustLoadOnDemand = true;
|
|
1199
1173
|
return false;
|
|
@@ -1219,17 +1193,17 @@ export class JqTreeWidget extends SimpleWidget<JQTreeOptions> {
|
|
|
1219
1193
|
|
|
1220
1194
|
// Set the initial state for nodes that are loaded on demand
|
|
1221
1195
|
// Call cb_finished when done
|
|
1222
|
-
private
|
|
1196
|
+
private _setInitialStateOnDemand(cbFinished: () => void): void {
|
|
1223
1197
|
const restoreState = (): boolean => {
|
|
1224
1198
|
if (!this.options.saveState) {
|
|
1225
1199
|
return false;
|
|
1226
1200
|
} else {
|
|
1227
|
-
const state = this.
|
|
1201
|
+
const state = this._saveStateHandler.getStateFromStorage();
|
|
1228
1202
|
|
|
1229
1203
|
if (!state) {
|
|
1230
1204
|
return false;
|
|
1231
1205
|
} else {
|
|
1232
|
-
this.
|
|
1206
|
+
this._saveStateHandler.setInitialStateOnDemand(
|
|
1233
1207
|
state,
|
|
1234
1208
|
cbFinished,
|
|
1235
1209
|
);
|
|
@@ -1240,19 +1214,19 @@ export class JqTreeWidget extends SimpleWidget<JQTreeOptions> {
|
|
|
1240
1214
|
};
|
|
1241
1215
|
|
|
1242
1216
|
const autoOpenNodes = (): void => {
|
|
1243
|
-
const maxLevel = this.
|
|
1217
|
+
const maxLevel = this._getAutoOpenMaxLevel();
|
|
1244
1218
|
let loadingCount = 0;
|
|
1245
1219
|
|
|
1246
1220
|
const loadAndOpenNode = (node: Node): void => {
|
|
1247
1221
|
loadingCount += 1;
|
|
1248
|
-
this.
|
|
1222
|
+
this._openNodeInternal(node, false, () => {
|
|
1249
1223
|
loadingCount -= 1;
|
|
1250
1224
|
openNodes();
|
|
1251
1225
|
});
|
|
1252
1226
|
};
|
|
1253
1227
|
|
|
1254
1228
|
const openNodes = (): void => {
|
|
1255
|
-
this.
|
|
1229
|
+
this._tree.iterate((node: Node, level: number) => {
|
|
1256
1230
|
if (node.load_on_demand) {
|
|
1257
1231
|
if (!node.is_loading) {
|
|
1258
1232
|
loadAndOpenNode(node);
|
|
@@ -1260,7 +1234,7 @@ export class JqTreeWidget extends SimpleWidget<JQTreeOptions> {
|
|
|
1260
1234
|
|
|
1261
1235
|
return false;
|
|
1262
1236
|
} else {
|
|
1263
|
-
this.
|
|
1237
|
+
this._openNodeInternal(node, false);
|
|
1264
1238
|
|
|
1265
1239
|
return level !== maxLevel;
|
|
1266
1240
|
}
|
|
@@ -1279,13 +1253,13 @@ export class JqTreeWidget extends SimpleWidget<JQTreeOptions> {
|
|
|
1279
1253
|
}
|
|
1280
1254
|
}
|
|
1281
1255
|
|
|
1282
|
-
private
|
|
1256
|
+
private _triggerEvent(
|
|
1283
1257
|
eventName: string,
|
|
1284
1258
|
values?: Record<string, unknown>,
|
|
1285
|
-
):
|
|
1259
|
+
): boolean {
|
|
1286
1260
|
const event = jQuery.Event(eventName, values);
|
|
1287
|
-
this.
|
|
1288
|
-
return event;
|
|
1261
|
+
this._element.trigger(event);
|
|
1262
|
+
return !event.isDefaultPrevented();
|
|
1289
1263
|
}
|
|
1290
1264
|
}
|
|
1291
1265
|
|