@hpcc-js/eclwatch 3.2.19 → 3.3.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/dist/index.js +685 -334
- package/dist/index.js.map +1 -1
- package/dist/index.umd.cjs +2 -5
- package/dist/index.umd.cjs.map +1 -1
- package/package.json +11 -11
- package/src/WUResult.ts +8 -0
- package/types/WUResult.d.ts +2 -0
package/dist/index.js
CHANGED
|
@@ -1,6 +1,5 @@
|
|
|
1
1
|
var __defProp = Object.defineProperty;
|
|
2
|
-
var
|
|
3
|
-
var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key != "symbol" ? key + "" : key, value);
|
|
2
|
+
var __name = (target, value) => __defProp(target, "name", { value, configurable: true });
|
|
4
3
|
import { Editor } from "@hpcc-js/codemirror";
|
|
5
4
|
import { Workunit, BaseScope, Result, WUStateID } from "@hpcc-js/comms";
|
|
6
5
|
import { SplitPanel } from "@hpcc-js/phosphor";
|
|
@@ -11,14 +10,16 @@ import { Table, RowFormatter, domConstruct, Deferred, QueryResults, Common } fro
|
|
|
11
10
|
import { Vertex, Subgraph as Subgraph$1, Edge as Edge$1, Graph } from "@hpcc-js/graph";
|
|
12
11
|
import { Legend, ChartPanel, Carousel } from "@hpcc-js/layout";
|
|
13
12
|
import { ReactTimelineSeries } from "@hpcc-js/timeline";
|
|
14
|
-
const PKG_NAME = "@hpcc-js/eclwatch"
|
|
15
|
-
|
|
13
|
+
const PKG_NAME = "@hpcc-js/eclwatch";
|
|
14
|
+
const PKG_VERSION = "3.1.1";
|
|
15
|
+
const BUILD_VERSION = "3.2.1";
|
|
16
|
+
const _ECLArchiveViewer = class _ECLArchiveViewer extends SplitPanel {
|
|
17
|
+
_prevHash;
|
|
18
|
+
_contentStr;
|
|
19
|
+
_directoryPane = new DirectoryTree();
|
|
20
|
+
_fileEditorPane = new Editor().text("");
|
|
16
21
|
constructor() {
|
|
17
22
|
super("horizontal");
|
|
18
|
-
__publicField(this, "_prevHash");
|
|
19
|
-
__publicField(this, "_contentStr");
|
|
20
|
-
__publicField(this, "_directoryPane", new DirectoryTree());
|
|
21
|
-
__publicField(this, "_fileEditorPane", new Editor().text(""));
|
|
22
23
|
this._directoryPane.rowClick = (text) => {
|
|
23
24
|
this._fileEditorPane.text(text).render();
|
|
24
25
|
};
|
|
@@ -28,7 +29,7 @@ class ECLArchiveViewer extends SplitPanel {
|
|
|
28
29
|
label: json.name,
|
|
29
30
|
children: json._children.map(transformNode).filter((n) => n)
|
|
30
31
|
};
|
|
31
|
-
if (ret.children && ret.children[0] && ret.children[0].label === "html")
|
|
32
|
+
if (ret.children && ret.children[0] && ret.children[0].label === "html") {
|
|
32
33
|
return {
|
|
33
34
|
label: "root",
|
|
34
35
|
children: [
|
|
@@ -38,33 +39,41 @@ class ECLArchiveViewer extends SplitPanel {
|
|
|
38
39
|
}
|
|
39
40
|
]
|
|
40
41
|
};
|
|
42
|
+
}
|
|
41
43
|
return ret;
|
|
42
44
|
function transformNode(node) {
|
|
43
45
|
const _node = {};
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
46
|
+
_node.label = node.name + (node["$"] && node["$"].key ? ` (${node["$"].key})` : "");
|
|
47
|
+
if (node._children && node._children.length > 0) {
|
|
48
|
+
_node.children = node._children.map((_node2) => {
|
|
49
|
+
return transformNode(_node2);
|
|
50
|
+
}).filter((n) => n);
|
|
51
|
+
} else if (typeof node.content === "string" && node.content.trim()) {
|
|
47
52
|
_node.content = node.content;
|
|
48
|
-
else
|
|
49
|
-
return
|
|
53
|
+
} else {
|
|
54
|
+
return false;
|
|
55
|
+
}
|
|
50
56
|
return _node;
|
|
51
57
|
}
|
|
58
|
+
__name(transformNode, "transformNode");
|
|
52
59
|
}
|
|
53
60
|
updateDirectoryPane(contentStr) {
|
|
54
61
|
let json;
|
|
55
|
-
if (contentStr)
|
|
62
|
+
if (contentStr) {
|
|
56
63
|
try {
|
|
57
64
|
json = JSON.parse(contentStr);
|
|
58
|
-
} catch {
|
|
65
|
+
} catch (e) {
|
|
59
66
|
json = xml2json(contentStr);
|
|
60
67
|
}
|
|
68
|
+
}
|
|
61
69
|
if (json) {
|
|
62
70
|
const _data = this.transformArchiveTreeData(json);
|
|
63
71
|
this._directoryPane.data(_data).render();
|
|
64
72
|
}
|
|
65
73
|
}
|
|
66
74
|
enter(domNode, element) {
|
|
67
|
-
super.enter(domNode, element)
|
|
75
|
+
super.enter(domNode, element);
|
|
76
|
+
this.addWidget(this._directoryPane).addWidget(this._fileEditorPane);
|
|
68
77
|
}
|
|
69
78
|
update(domNode, element) {
|
|
70
79
|
super.update(domNode, element);
|
|
@@ -72,11 +81,20 @@ class ECLArchiveViewer extends SplitPanel {
|
|
|
72
81
|
baseUrl: this.baseUrl(),
|
|
73
82
|
wuid: this.wuid()
|
|
74
83
|
});
|
|
75
|
-
this._prevHash !== hash || typeof this._contentStr
|
|
76
|
-
|
|
77
|
-
|
|
84
|
+
if (this._prevHash !== hash || typeof this._contentStr === "undefined") {
|
|
85
|
+
Workunit.attach({ baseUrl: this.baseUrl() }, this.wuid()).fetchArchive().then((resp) => {
|
|
86
|
+
this._contentStr = resp;
|
|
87
|
+
this.updateDirectoryPane(this._contentStr);
|
|
88
|
+
this._prevHash = hash;
|
|
89
|
+
});
|
|
90
|
+
} else {
|
|
91
|
+
this.updateDirectoryPane(this._contentStr);
|
|
92
|
+
}
|
|
93
|
+
this.relativeSizes([this.directoryWidthRatio(), 1 - this.directoryWidthRatio()]);
|
|
78
94
|
}
|
|
79
|
-
}
|
|
95
|
+
};
|
|
96
|
+
__name(_ECLArchiveViewer, "ECLArchiveViewer");
|
|
97
|
+
let ECLArchiveViewer = _ECLArchiveViewer;
|
|
80
98
|
ECLArchiveViewer.prototype._class += " eclwatch_ECLArchiveViewer";
|
|
81
99
|
ECLArchiveViewer.prototype.publish("baseUrl", "", "string", "HPCC Platform Base URL");
|
|
82
100
|
ECLArchiveViewer.prototype.publish("wuid", "", "string", "Workunit ID");
|
|
@@ -93,51 +111,59 @@ ECLArchiveViewer.prototype.publishProxy("folderIconClosed", "_directoryPane");
|
|
|
93
111
|
ECLArchiveViewer.prototype.publishProxy("textFileIcon", "_directoryPane");
|
|
94
112
|
ECLArchiveViewer.prototype.publishProxy("codeFileIcon", "_directoryPane");
|
|
95
113
|
ECLArchiveViewer.prototype.publishProxy("verticalScroll", "_directoryPane");
|
|
96
|
-
class
|
|
114
|
+
const _LegendVertex = class _LegendVertex extends Vertex {
|
|
97
115
|
constructor() {
|
|
98
116
|
super();
|
|
99
117
|
}
|
|
100
118
|
enter(domNode, element) {
|
|
101
|
-
super.enter(domNode, element)
|
|
119
|
+
super.enter(domNode, element);
|
|
120
|
+
this._icon.on("click", () => {
|
|
102
121
|
this.click(this.data());
|
|
103
122
|
});
|
|
104
123
|
}
|
|
105
124
|
click(kind) {
|
|
106
125
|
}
|
|
107
|
-
}
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
}
|
|
126
|
+
};
|
|
127
|
+
__name(_LegendVertex, "LegendVertex");
|
|
128
|
+
let LegendVertex = _LegendVertex;
|
|
129
|
+
const _WUGraphLegend = class _WUGraphLegend extends Legend {
|
|
130
|
+
icon = local();
|
|
131
|
+
_disabled2 = {
|
|
132
|
+
/* TODO: Default some to disabled?
|
|
133
|
+
43: true,
|
|
134
|
+
71: true,
|
|
135
|
+
82: true,
|
|
136
|
+
88: true
|
|
137
|
+
*/
|
|
138
|
+
};
|
|
121
139
|
disabled(_) {
|
|
122
140
|
if (!arguments.length) {
|
|
123
141
|
const retVal = [];
|
|
124
|
-
for (const key in this._disabled2)
|
|
125
|
-
this._disabled2[key]
|
|
142
|
+
for (const key in this._disabled2) {
|
|
143
|
+
if (this._disabled2[key]) {
|
|
144
|
+
retVal.push(key);
|
|
145
|
+
}
|
|
146
|
+
}
|
|
126
147
|
return retVal;
|
|
127
148
|
}
|
|
128
|
-
|
|
149
|
+
this._disabled2 = {};
|
|
150
|
+
_.forEach((kind) => this._disabled2[kind] = true);
|
|
151
|
+
return this;
|
|
129
152
|
}
|
|
130
153
|
toggle(kind) {
|
|
131
154
|
this._disabled2[kind] = !this._disabled2[kind];
|
|
132
155
|
}
|
|
133
156
|
update(domNode, element) {
|
|
134
157
|
super.update(domNode, element);
|
|
135
|
-
const context = this
|
|
158
|
+
const context = this;
|
|
159
|
+
const items = this._g.selectAll(".legendItem").data(this.data(), (d) => d.kind);
|
|
136
160
|
items.enter().append("g").attr("class", "legendItem").each(function(d) {
|
|
137
161
|
context.icon.set(
|
|
138
162
|
this,
|
|
139
163
|
new LegendVertex().target(this).data(d.kind).textbox_shape_colorStroke("none").textbox_shape_colorFill("none").iconAnchor("left").faChar(d.faChar).text(`${d.label} (${d.count})`).tooltip(`${d.kind} - ${d.label}`).on("click", (kind) => {
|
|
140
|
-
context.toggle(kind)
|
|
164
|
+
context.toggle(kind);
|
|
165
|
+
context.render();
|
|
166
|
+
context.click(kind);
|
|
141
167
|
}).on("mouseover", (kind) => {
|
|
142
168
|
context.mouseover(kind);
|
|
143
169
|
}).on("mouseout", (kind) => {
|
|
@@ -147,10 +173,11 @@ class WUGraphLegend extends Legend {
|
|
|
147
173
|
}).merge(items).each(function(d, i) {
|
|
148
174
|
const bbox2 = context.icon.get(this).icon_shape_colorFill(context._disabled2[d.kind] ? "gray" : null).render().getBBox();
|
|
149
175
|
select(this).attr("transform", `translate(${+bbox2.width / 2}, ${i * 30})`);
|
|
150
|
-
})
|
|
176
|
+
});
|
|
177
|
+
items.exit().each(function(d) {
|
|
151
178
|
context.icon.get(this).target(null).render();
|
|
152
179
|
}).remove();
|
|
153
|
-
const bbox = this.getBBox(
|
|
180
|
+
const bbox = this.getBBox(true, true);
|
|
154
181
|
this._g.attr("transform", `translate(16, ${this.height() / 2 - bbox.height / 2})`);
|
|
155
182
|
}
|
|
156
183
|
// Events ---
|
|
@@ -160,118 +187,171 @@ class WUGraphLegend extends Legend {
|
|
|
160
187
|
}
|
|
161
188
|
mouseout(kind) {
|
|
162
189
|
}
|
|
163
|
-
}
|
|
190
|
+
};
|
|
191
|
+
__name(_WUGraphLegend, "WUGraphLegend");
|
|
192
|
+
let WUGraphLegend = _WUGraphLegend;
|
|
164
193
|
WUGraphLegend.prototype._class += " eclwatch_WUGraphLegend";
|
|
165
194
|
function faCharFactory(kind) {
|
|
166
195
|
switch (kind) {
|
|
167
196
|
case "2":
|
|
168
197
|
return "";
|
|
198
|
+
// Disk Write
|
|
169
199
|
case "3":
|
|
170
200
|
return "";
|
|
201
|
+
// sort
|
|
171
202
|
case "5":
|
|
172
203
|
return "";
|
|
204
|
+
// Filter
|
|
173
205
|
case "6":
|
|
174
206
|
return "";
|
|
207
|
+
// Split
|
|
175
208
|
case "12":
|
|
176
209
|
return "";
|
|
210
|
+
// First N
|
|
177
211
|
case "15":
|
|
178
212
|
return "";
|
|
213
|
+
// Lightweight Join
|
|
179
214
|
case "17":
|
|
180
215
|
return "";
|
|
216
|
+
// Lookup Join
|
|
181
217
|
case "22":
|
|
182
218
|
return "";
|
|
219
|
+
// Pipe Output
|
|
183
220
|
case "23":
|
|
184
221
|
return "";
|
|
222
|
+
// Funnel
|
|
185
223
|
case "25":
|
|
186
224
|
return "";
|
|
225
|
+
// Inline Dataset
|
|
187
226
|
case "26":
|
|
188
227
|
return "";
|
|
228
|
+
// distribute
|
|
189
229
|
case "29":
|
|
190
230
|
return "";
|
|
231
|
+
// Store Internal Result
|
|
191
232
|
case "36":
|
|
192
233
|
return "";
|
|
234
|
+
// If
|
|
193
235
|
case "44":
|
|
194
236
|
return "";
|
|
237
|
+
// write csv
|
|
195
238
|
case "47":
|
|
196
239
|
return "";
|
|
240
|
+
// write
|
|
197
241
|
case "54":
|
|
198
242
|
return "";
|
|
243
|
+
// Workunit Read
|
|
199
244
|
case "56":
|
|
200
245
|
return "";
|
|
246
|
+
// Spill
|
|
201
247
|
case "59":
|
|
202
248
|
return "";
|
|
249
|
+
// Merge
|
|
203
250
|
case "61":
|
|
204
251
|
return "";
|
|
252
|
+
// write xml
|
|
205
253
|
case "82":
|
|
206
254
|
return "";
|
|
255
|
+
// Projected Disk Read Spill
|
|
207
256
|
case "88":
|
|
208
257
|
return "";
|
|
258
|
+
// Projected Disk Read Spill
|
|
209
259
|
case "92":
|
|
210
260
|
return "";
|
|
261
|
+
// Limted Index Read
|
|
211
262
|
case "93":
|
|
212
263
|
return "";
|
|
264
|
+
// Limted Index Read
|
|
213
265
|
case "99":
|
|
214
266
|
return "";
|
|
267
|
+
// CSV Read
|
|
215
268
|
case "105":
|
|
216
269
|
return "";
|
|
270
|
+
// CSV Read
|
|
217
271
|
case "7":
|
|
218
272
|
return "";
|
|
273
|
+
// Project
|
|
219
274
|
case "9":
|
|
220
275
|
return "";
|
|
276
|
+
// Local Iterate
|
|
221
277
|
case "16":
|
|
222
278
|
return "";
|
|
279
|
+
// Output Internal
|
|
223
280
|
case "19":
|
|
224
281
|
return "";
|
|
282
|
+
// Hash Distribute
|
|
225
283
|
case "21":
|
|
226
284
|
return "";
|
|
285
|
+
// Normalize
|
|
227
286
|
case "35":
|
|
228
287
|
return "";
|
|
288
|
+
// CSV Write
|
|
229
289
|
case "37":
|
|
230
290
|
return "";
|
|
291
|
+
// Index Write
|
|
231
292
|
case "71":
|
|
232
293
|
return "";
|
|
294
|
+
// Disk Read Spill
|
|
233
295
|
case "133":
|
|
234
296
|
return "";
|
|
297
|
+
// Inline Dataset
|
|
235
298
|
case "148":
|
|
236
299
|
return "";
|
|
300
|
+
// Inline Dataset
|
|
237
301
|
case "168":
|
|
238
302
|
return "";
|
|
239
303
|
}
|
|
240
304
|
return "";
|
|
241
305
|
}
|
|
242
|
-
|
|
306
|
+
__name(faCharFactory, "faCharFactory");
|
|
307
|
+
const _WUScopeController = class _WUScopeController {
|
|
308
|
+
graphDB;
|
|
309
|
+
subgraphsMap = {};
|
|
310
|
+
rSubgraphsMap = {};
|
|
311
|
+
verticesMap = {};
|
|
312
|
+
rVerticesMap = {};
|
|
313
|
+
edgesMap = {};
|
|
314
|
+
rEdgesMap = {};
|
|
315
|
+
kindMap = {};
|
|
316
|
+
_disabled = {};
|
|
243
317
|
constructor() {
|
|
244
|
-
__publicField(this, "graphDB");
|
|
245
|
-
__publicField(this, "subgraphsMap", {});
|
|
246
|
-
__publicField(this, "rSubgraphsMap", {});
|
|
247
|
-
__publicField(this, "verticesMap", {});
|
|
248
|
-
__publicField(this, "rVerticesMap", {});
|
|
249
|
-
__publicField(this, "edgesMap", {});
|
|
250
|
-
__publicField(this, "rEdgesMap", {});
|
|
251
|
-
__publicField(this, "kindMap", {});
|
|
252
|
-
__publicField(this, "_disabled", {});
|
|
253
318
|
}
|
|
254
319
|
clear() {
|
|
255
|
-
this.subgraphsMap = {}
|
|
320
|
+
this.subgraphsMap = {};
|
|
321
|
+
this.rSubgraphsMap = {};
|
|
322
|
+
this.verticesMap = {};
|
|
323
|
+
this.rVerticesMap = {};
|
|
324
|
+
this.edgesMap = {};
|
|
325
|
+
this.rEdgesMap = {};
|
|
256
326
|
}
|
|
257
327
|
set(masterGraph) {
|
|
258
|
-
this.graphDB = masterGraph
|
|
259
|
-
|
|
260
|
-
|
|
261
|
-
|
|
262
|
-
|
|
328
|
+
this.graphDB = masterGraph;
|
|
329
|
+
this.graphGui(this.graphDB);
|
|
330
|
+
this.kindMap = {};
|
|
331
|
+
this.graphDB.walk((item) => {
|
|
332
|
+
if (item instanceof Subgraph) ;
|
|
333
|
+
else if (item instanceof Vertex$1) {
|
|
334
|
+
const kind = item._.attr("Kind").RawValue;
|
|
335
|
+
if (!this.kindMap[kind]) {
|
|
336
|
+
this.kindMap[kind] = [];
|
|
263
337
|
}
|
|
264
|
-
|
|
338
|
+
this.kindMap[kind].push(item);
|
|
339
|
+
} else ;
|
|
265
340
|
});
|
|
266
341
|
}
|
|
267
342
|
disabled(_) {
|
|
268
343
|
if (!arguments.length) {
|
|
269
344
|
const retVal = [];
|
|
270
|
-
for (const key in this._disabled)
|
|
271
|
-
this._disabled[key]
|
|
345
|
+
for (const key in this._disabled) {
|
|
346
|
+
if (this._disabled[key]) {
|
|
347
|
+
retVal.push(key);
|
|
348
|
+
}
|
|
349
|
+
}
|
|
272
350
|
return retVal;
|
|
273
351
|
}
|
|
274
|
-
|
|
352
|
+
this._disabled = {};
|
|
353
|
+
_.forEach((kind) => this._disabled[kind] = true);
|
|
354
|
+
return this;
|
|
275
355
|
}
|
|
276
356
|
graphGui(graphDB) {
|
|
277
357
|
const graphGui = {
|
|
@@ -280,31 +360,46 @@ class WUScopeController {
|
|
|
280
360
|
edges: [],
|
|
281
361
|
hierarchy: []
|
|
282
362
|
};
|
|
283
|
-
|
|
363
|
+
graphDB.walk((item) => {
|
|
284
364
|
if (item instanceof Subgraph) {
|
|
285
365
|
const subgraph = this.appendSubgraph(item, graphGui.hierarchy, graphGui.subgraphs);
|
|
286
366
|
subgraph.showMinMax(item.vertices.length > 3 || subgraph.minState() !== "normal");
|
|
287
|
-
} else item instanceof Vertex$1
|
|
288
|
-
|
|
367
|
+
} else if (item instanceof Vertex$1) {
|
|
368
|
+
this.appendVertex(item, graphGui.hierarchy, graphGui.vertices);
|
|
369
|
+
} else if (item instanceof Edge) {
|
|
370
|
+
this.appendEdge(item, graphGui.edges);
|
|
371
|
+
}
|
|
372
|
+
});
|
|
373
|
+
return graphGui;
|
|
289
374
|
}
|
|
290
375
|
format(labelTpl, obj) {
|
|
291
|
-
let retVal = ""
|
|
292
|
-
|
|
293
|
-
|
|
376
|
+
let retVal = "";
|
|
377
|
+
let lpos = labelTpl.indexOf("%");
|
|
378
|
+
let rpos = -1;
|
|
379
|
+
while (lpos >= 0) {
|
|
380
|
+
retVal += labelTpl.substring(rpos + 1, lpos);
|
|
381
|
+
rpos = labelTpl.indexOf("%", lpos + 1);
|
|
382
|
+
if (rpos < 0) {
|
|
294
383
|
console.warn("Invalid Label Template");
|
|
295
384
|
break;
|
|
296
385
|
}
|
|
297
386
|
const key = labelTpl.substring(lpos + 1, rpos);
|
|
298
|
-
retVal += key ? obj[labelTpl.substring(lpos + 1, rpos)] || ""
|
|
387
|
+
retVal += !key ? "%" : obj[labelTpl.substring(lpos + 1, rpos)] || "";
|
|
388
|
+
lpos = labelTpl.indexOf("%", rpos + 1);
|
|
299
389
|
}
|
|
300
|
-
|
|
301
|
-
|
|
390
|
+
retVal += labelTpl.substring(rpos + 1, labelTpl.length);
|
|
391
|
+
return retVal.split("\\n").join("\n");
|
|
302
392
|
}
|
|
303
393
|
createSubgraph(subgraph) {
|
|
304
394
|
let sg = this.subgraphsMap[subgraph._.Id];
|
|
305
|
-
|
|
306
|
-
|
|
307
|
-
|
|
395
|
+
if (!sg) {
|
|
396
|
+
sg = new Subgraph$1().title(subgraph._.Id).on("minClick", () => {
|
|
397
|
+
this.minClick(sg);
|
|
398
|
+
});
|
|
399
|
+
this.subgraphsMap[subgraph._.Id] = sg;
|
|
400
|
+
this.rSubgraphsMap[sg.id()] = subgraph;
|
|
401
|
+
}
|
|
402
|
+
return sg;
|
|
308
403
|
}
|
|
309
404
|
createVertex(vertex) {
|
|
310
405
|
let v = this.verticesMap[vertex._.Id];
|
|
@@ -313,31 +408,40 @@ class WUScopeController {
|
|
|
313
408
|
if (vertex._.ScopeType === "dummy") {
|
|
314
409
|
const parent = this.subgraphsMap[vertex.parent._.Id];
|
|
315
410
|
v = new Icon().shape_colorFill("darkred").shape_colorStroke("darkred").image_colorFill("white").faChar("").on("click", () => {
|
|
316
|
-
parent.minState("normal")
|
|
411
|
+
parent.minState("normal");
|
|
412
|
+
this.minClick(parent);
|
|
317
413
|
});
|
|
318
414
|
} else {
|
|
319
|
-
v = new Vertex().icon_shape_colorFill("#1f77b4").icon_image_colorFill("white").faChar(faCharFactory(attrs
|
|
415
|
+
v = new Vertex().icon_shape_colorFill("#1f77b4").icon_image_colorFill("white").faChar(faCharFactory(attrs["Kind"])).text(attrs["Label"]);
|
|
320
416
|
const annotations = [];
|
|
321
|
-
vertex._.hasAttr("Definition")
|
|
322
|
-
|
|
323
|
-
|
|
324
|
-
|
|
325
|
-
|
|
326
|
-
|
|
327
|
-
|
|
328
|
-
|
|
329
|
-
|
|
330
|
-
|
|
331
|
-
|
|
332
|
-
|
|
333
|
-
|
|
417
|
+
if (vertex._.hasAttr("Definition")) {
|
|
418
|
+
annotations.push({
|
|
419
|
+
faChar: "",
|
|
420
|
+
tooltip: "Definition",
|
|
421
|
+
shape_colorFill: "lightgray",
|
|
422
|
+
shape_colorStroke: "lightgray",
|
|
423
|
+
image_colorFill: "black"
|
|
424
|
+
});
|
|
425
|
+
}
|
|
426
|
+
if (vertex._.hasAttr("IsInternal")) {
|
|
427
|
+
annotations.push({
|
|
428
|
+
faChar: "",
|
|
429
|
+
tooltip: "IsInternal",
|
|
430
|
+
shape_colorFill: "red",
|
|
431
|
+
shape_colorStroke: "red",
|
|
432
|
+
image_colorFill: "white"
|
|
433
|
+
});
|
|
434
|
+
}
|
|
435
|
+
v.annotationIcons(annotations);
|
|
334
436
|
}
|
|
335
|
-
this.verticesMap[vertex._.Id] = v
|
|
437
|
+
this.verticesMap[vertex._.Id] = v;
|
|
438
|
+
this.rVerticesMap[v.id()] = vertex;
|
|
336
439
|
}
|
|
337
440
|
return v;
|
|
338
441
|
}
|
|
339
442
|
isSpill(edge) {
|
|
340
|
-
const sourceKind = edge.source._.attr("Kind").RawValue
|
|
443
|
+
const sourceKind = edge.source._.attr("Kind").RawValue;
|
|
444
|
+
const targetKind = edge.target._.attr("Kind").RawValue;
|
|
341
445
|
return sourceKind === "2" || targetKind === "71";
|
|
342
446
|
}
|
|
343
447
|
spansSubgraph(edge) {
|
|
@@ -346,12 +450,30 @@ class WUScopeController {
|
|
|
346
450
|
createEdge(edge) {
|
|
347
451
|
let e = this.edgesMap[edge._.Id];
|
|
348
452
|
if (!e) {
|
|
349
|
-
const attrs = edge._.rawAttrs()
|
|
453
|
+
const attrs = edge._.rawAttrs();
|
|
454
|
+
const sourceV = this.verticesMap[edge.source._.Id];
|
|
455
|
+
const targetV = this.verticesMap[edge.target._.Id];
|
|
350
456
|
if (sourceV && targetV) {
|
|
351
|
-
const isSpill = this.isSpill(edge)
|
|
352
|
-
|
|
353
|
-
|
|
354
|
-
|
|
457
|
+
const isSpill = this.isSpill(edge);
|
|
458
|
+
const spansSubgraph = this.spansSubgraph(edge);
|
|
459
|
+
const label = this.format("%Label%\n%NumRowsProcessed%", attrs);
|
|
460
|
+
let strokeDasharray = null;
|
|
461
|
+
let weight = 100;
|
|
462
|
+
if (attrs["IsDependency"]) {
|
|
463
|
+
weight = 10;
|
|
464
|
+
strokeDasharray = "1,5";
|
|
465
|
+
} else if (attrs["_childGraph"]) {
|
|
466
|
+
strokeDasharray = "5,5";
|
|
467
|
+
} else if (isSpill) {
|
|
468
|
+
weight = 25;
|
|
469
|
+
strokeDasharray = "5,5,10,5";
|
|
470
|
+
} else if (spansSubgraph) {
|
|
471
|
+
weight = 5;
|
|
472
|
+
strokeDasharray = "5,5";
|
|
473
|
+
}
|
|
474
|
+
e = new Edge$1().sourceVertex(sourceV).targetVertex(targetV).sourceMarker("circle").targetMarker("arrow").weight(weight).strokeDasharray(strokeDasharray).text(label);
|
|
475
|
+
this.edgesMap[edge._.Id] = e;
|
|
476
|
+
this.rEdgesMap[e.id()] = edge;
|
|
355
477
|
}
|
|
356
478
|
}
|
|
357
479
|
return e;
|
|
@@ -360,42 +482,64 @@ class WUScopeController {
|
|
|
360
482
|
const sg = this.createSubgraph(subgraph);
|
|
361
483
|
subgraphs.push(sg);
|
|
362
484
|
const parent = this.subgraphsMap[subgraph.parent._.Id];
|
|
363
|
-
|
|
485
|
+
if (parent) {
|
|
486
|
+
hierarchy.push({ parent, child: sg });
|
|
487
|
+
}
|
|
488
|
+
return sg;
|
|
364
489
|
}
|
|
365
490
|
appendVertex(vertex, hierarchy, vertices) {
|
|
366
491
|
const v = this.createVertex(vertex);
|
|
367
492
|
vertices.push(v);
|
|
368
493
|
const parent = this.subgraphsMap[vertex.parent._.Id];
|
|
369
|
-
|
|
494
|
+
if (parent) {
|
|
495
|
+
hierarchy.push({ parent, child: v });
|
|
496
|
+
}
|
|
497
|
+
return v;
|
|
370
498
|
}
|
|
371
499
|
appendEdge(edge, edges) {
|
|
372
500
|
const e = this.createEdge(edge);
|
|
373
|
-
|
|
501
|
+
if (e) {
|
|
502
|
+
edges.push(e);
|
|
503
|
+
}
|
|
504
|
+
return e;
|
|
374
505
|
}
|
|
375
506
|
filterLegend(graphDB) {
|
|
376
507
|
for (let i = graphDB.vertices.length - 1; i >= 0; --i) {
|
|
377
|
-
const vertex = graphDB.vertices[i]
|
|
378
|
-
|
|
379
|
-
|
|
380
|
-
|
|
381
|
-
|
|
382
|
-
|
|
383
|
-
|
|
384
|
-
|
|
385
|
-
|
|
386
|
-
|
|
387
|
-
|
|
388
|
-
|
|
389
|
-
|
|
508
|
+
const vertex = graphDB.vertices[i];
|
|
509
|
+
const kind = vertex._.attr("Kind").RawValue;
|
|
510
|
+
if (this._disabled[kind]) {
|
|
511
|
+
vertex.remove(false, (source, target) => {
|
|
512
|
+
return new BaseScope({
|
|
513
|
+
ScopeName: vertex._.ScopeName + ":in",
|
|
514
|
+
Id: source.Id + "->" + target.Id,
|
|
515
|
+
ScopeType: "dummy-edge",
|
|
516
|
+
Properties: {
|
|
517
|
+
Property: [vertex._.attr("Label")]
|
|
518
|
+
},
|
|
519
|
+
Notes: {
|
|
520
|
+
Note: []
|
|
521
|
+
},
|
|
522
|
+
SinkActivity: ""
|
|
523
|
+
});
|
|
524
|
+
});
|
|
525
|
+
}
|
|
390
526
|
}
|
|
391
527
|
}
|
|
392
528
|
filterPartial(graphDB) {
|
|
393
|
-
for (const subgraph of graphDB.subgraphs)
|
|
394
|
-
|
|
529
|
+
for (const subgraph of graphDB.subgraphs) {
|
|
530
|
+
const sg = this.subgraphsMap[subgraph._.Id];
|
|
531
|
+
switch (sg.minState()) {
|
|
395
532
|
case "partial":
|
|
396
|
-
const childVertices = subgraph.vertices
|
|
397
|
-
|
|
398
|
-
|
|
533
|
+
const childVertices = subgraph.vertices;
|
|
534
|
+
const vShow = [];
|
|
535
|
+
const vHide = [];
|
|
536
|
+
for (const vertex of childVertices) {
|
|
537
|
+
if (vertex.inEdges.length === 0 || vertex.inEdges.some((edge) => edge.source.parent !== edge.target.parent) || vertex.outEdges.length === 0 || vertex.outEdges.some((edge) => edge.source.parent !== edge.target.parent)) {
|
|
538
|
+
vShow.push(vertex);
|
|
539
|
+
} else {
|
|
540
|
+
vHide.push(vertex);
|
|
541
|
+
}
|
|
542
|
+
}
|
|
399
543
|
if (vHide.length > 1) {
|
|
400
544
|
const dummyDetails = {
|
|
401
545
|
ScopeName: subgraph._.ScopeName,
|
|
@@ -415,9 +559,11 @@ class WUScopeController {
|
|
|
415
559
|
Note: []
|
|
416
560
|
},
|
|
417
561
|
SinkActivity: ""
|
|
418
|
-
}
|
|
562
|
+
};
|
|
563
|
+
const dummyScope = new BaseScope(dummyDetails);
|
|
564
|
+
const dummyVertex = subgraph.createVertex(dummyScope);
|
|
419
565
|
for (const vertex of vHide) {
|
|
420
|
-
for (const edge of vertex.inEdges)
|
|
566
|
+
for (const edge of vertex.inEdges) {
|
|
421
567
|
if (vShow.indexOf(edge.source) >= 0) {
|
|
422
568
|
const dummyEdgeScope = new BaseScope({
|
|
423
569
|
ScopeName: edge.source._.ScopeName,
|
|
@@ -433,7 +579,8 @@ class WUScopeController {
|
|
|
433
579
|
});
|
|
434
580
|
subgraph.createEdge(edge.source, dummyVertex, dummyEdgeScope);
|
|
435
581
|
}
|
|
436
|
-
|
|
582
|
+
}
|
|
583
|
+
for (const edge of vertex.outEdges) {
|
|
437
584
|
if (vShow.indexOf(edge.target) >= 0) {
|
|
438
585
|
const dummyEdgeScope = new BaseScope({
|
|
439
586
|
ScopeName: edge.target._.ScopeName,
|
|
@@ -449,89 +596,117 @@ class WUScopeController {
|
|
|
449
596
|
});
|
|
450
597
|
subgraph.createEdge(dummyVertex, edge.target, dummyEdgeScope);
|
|
451
598
|
}
|
|
599
|
+
}
|
|
452
600
|
}
|
|
453
|
-
vHide.forEach((vertex) => vertex.remove(
|
|
601
|
+
vHide.forEach((vertex) => vertex.remove(true));
|
|
454
602
|
}
|
|
455
603
|
break;
|
|
456
604
|
}
|
|
605
|
+
}
|
|
457
606
|
}
|
|
458
607
|
filterEmptySubgraphs(graphDB) {
|
|
459
|
-
|
|
608
|
+
while (true) {
|
|
460
609
|
const emptySubgraphs = graphDB.subgraphs.filter((subgraph) => subgraph.subgraphs.length === 0 && subgraph.vertices.length === 0);
|
|
461
610
|
if (emptySubgraphs.length === 0) break;
|
|
462
|
-
emptySubgraphs.forEach((subgraph) => subgraph.remove(
|
|
611
|
+
emptySubgraphs.forEach((subgraph) => subgraph.remove(true));
|
|
463
612
|
}
|
|
464
613
|
}
|
|
465
614
|
removeObsoleteSubgraphs(graphDB) {
|
|
466
|
-
for (const subgraph of [...graphDB.subgraphs])
|
|
467
|
-
subgraph.vertices.length === 0
|
|
615
|
+
for (const subgraph of [...graphDB.subgraphs]) {
|
|
616
|
+
if (subgraph.vertices.length === 0) {
|
|
617
|
+
subgraph.remove(false);
|
|
618
|
+
}
|
|
619
|
+
}
|
|
468
620
|
}
|
|
469
621
|
graphData() {
|
|
470
622
|
const graphDB = this.graphDB.clone();
|
|
471
|
-
|
|
623
|
+
this.filterLegend(graphDB);
|
|
624
|
+
this.filterPartial(graphDB);
|
|
625
|
+
this.filterEmptySubgraphs(graphDB);
|
|
626
|
+
this.removeObsoleteSubgraphs(graphDB);
|
|
627
|
+
return this.graphGui(graphDB);
|
|
472
628
|
}
|
|
473
629
|
calcLegend() {
|
|
474
630
|
const retVal = [];
|
|
475
|
-
for (const kind in this.kindMap)
|
|
631
|
+
for (const kind in this.kindMap) {
|
|
476
632
|
retVal.push({
|
|
477
633
|
kind: parseInt(kind),
|
|
478
634
|
faChar: faCharFactory(kind),
|
|
479
|
-
label: this.kindMap[kind][0]._.attr("Label").RawValue.split(
|
|
480
|
-
`)[0],
|
|
635
|
+
label: this.kindMap[kind][0]._.attr("Label").RawValue.split("\n")[0],
|
|
481
636
|
count: this.kindMap[kind].length
|
|
482
637
|
});
|
|
638
|
+
}
|
|
483
639
|
return retVal;
|
|
484
640
|
}
|
|
485
641
|
vertices(kind) {
|
|
486
642
|
const retVal = [];
|
|
487
|
-
for (const v of this.kindMap[kind])
|
|
643
|
+
for (const v of this.kindMap[kind]) {
|
|
488
644
|
retVal.push(this.verticesMap[v._.Id]);
|
|
645
|
+
}
|
|
489
646
|
return retVal;
|
|
490
647
|
}
|
|
491
648
|
formatRow(item, columns2, row) {
|
|
492
649
|
const attrs = item._.formattedAttrs();
|
|
493
650
|
for (const key in attrs) {
|
|
494
651
|
const idx = columns2.indexOf(key);
|
|
495
|
-
idx === -1
|
|
652
|
+
if (idx === -1) {
|
|
653
|
+
columns2.push(key);
|
|
654
|
+
row.push(attrs[key]);
|
|
655
|
+
} else {
|
|
656
|
+
row[idx] = attrs[key];
|
|
657
|
+
}
|
|
658
|
+
}
|
|
659
|
+
for (let i = 0; i < 100; ++i) {
|
|
660
|
+
if (row[i] === void 0) {
|
|
661
|
+
row[i] = "";
|
|
662
|
+
}
|
|
496
663
|
}
|
|
497
|
-
for (let i = 0; i < 100; ++i)
|
|
498
|
-
row[i] === void 0 && (row[i] = "");
|
|
499
664
|
return row;
|
|
500
665
|
}
|
|
501
666
|
activityData() {
|
|
502
|
-
const columns2 = ["Id", "Kind", "Label"]
|
|
667
|
+
const columns2 = ["Id", "Kind", "Label"];
|
|
668
|
+
const data = this.graphDB.vertices.map((v) => {
|
|
503
669
|
const row = [parseInt(v._.Id.split("a")[1])];
|
|
504
670
|
return this.formatRow(v, columns2, row);
|
|
505
671
|
});
|
|
506
672
|
return { columns: columns2, data };
|
|
507
673
|
}
|
|
508
674
|
edgeData() {
|
|
509
|
-
const columns2 = ["Id", "Label"]
|
|
675
|
+
const columns2 = ["Id", "Label"];
|
|
676
|
+
const data = this.graphDB.edges.map((e) => {
|
|
510
677
|
const row = [e._.Id];
|
|
511
678
|
return this.formatRow(e, columns2, row);
|
|
512
679
|
});
|
|
513
680
|
return { columns: columns2, data };
|
|
514
681
|
}
|
|
515
682
|
subgraphData() {
|
|
516
|
-
const columns2 = ["Id", "Label"]
|
|
683
|
+
const columns2 = ["Id", "Label"];
|
|
684
|
+
const data = this.graphDB.subgraphs.map((sg) => {
|
|
517
685
|
const row = [sg._.Id];
|
|
518
686
|
return this.formatRow(sg, columns2, row);
|
|
519
687
|
});
|
|
520
688
|
return { columns: columns2, data };
|
|
521
689
|
}
|
|
522
690
|
calcGraphTooltip(item) {
|
|
523
|
-
let scope
|
|
691
|
+
let scope;
|
|
692
|
+
let parentScope;
|
|
524
693
|
if (item instanceof Subgraph$1) {
|
|
525
694
|
const subgraph = this.rSubgraphsMap[item.id()];
|
|
526
|
-
scope = subgraph._
|
|
695
|
+
scope = subgraph._;
|
|
696
|
+
parentScope = subgraph.parent._;
|
|
527
697
|
} else if (item instanceof Vertex || item instanceof Icon) {
|
|
528
698
|
const vertex = this.rVerticesMap[item.id()];
|
|
529
|
-
scope = vertex._
|
|
699
|
+
scope = vertex._;
|
|
700
|
+
parentScope = vertex.parent._;
|
|
530
701
|
} else if (item instanceof Edge$1) {
|
|
531
702
|
const edge = this.rEdgesMap[item.id()];
|
|
532
|
-
scope = edge._
|
|
703
|
+
scope = edge._;
|
|
704
|
+
parentScope = edge.parent._;
|
|
705
|
+
}
|
|
706
|
+
if (scope) {
|
|
707
|
+
return scope.calcTooltip(parentScope);
|
|
533
708
|
}
|
|
534
|
-
return
|
|
709
|
+
return "";
|
|
535
710
|
}
|
|
536
711
|
subgraph(id) {
|
|
537
712
|
return this.subgraphsMap[id];
|
|
@@ -545,47 +720,49 @@ class WUScopeController {
|
|
|
545
720
|
// Events ---
|
|
546
721
|
minClick(sg) {
|
|
547
722
|
}
|
|
548
|
-
}
|
|
549
|
-
|
|
723
|
+
};
|
|
724
|
+
__name(_WUScopeController, "WUScopeController");
|
|
725
|
+
let WUScopeController = _WUScopeController;
|
|
726
|
+
const _WUGraph = class _WUGraph extends ChartPanel {
|
|
727
|
+
_partialAll = new Button().faChar("fa-window-restore").tooltip("Partial All").on("click", () => {
|
|
728
|
+
this.stateClick(this._partialAll);
|
|
729
|
+
});
|
|
730
|
+
_maxAll = new Button().faChar("fa-window-maximize").tooltip("Max All").on("click", () => {
|
|
731
|
+
this.stateClick(this._maxAll);
|
|
732
|
+
});
|
|
733
|
+
_toggleGraph = new ToggleButton().faChar("fa-chain").tooltip("Graph").selected(true).on("click", () => {
|
|
734
|
+
this.viewClick(this._toggleGraph);
|
|
735
|
+
});
|
|
736
|
+
_toggleActivities = new ToggleButton().faChar("fa-table").tooltip("Activitiies").selected(false).on("click", () => {
|
|
737
|
+
this.viewClick(this._toggleActivities);
|
|
738
|
+
});
|
|
739
|
+
_toggleEdges = new ToggleButton().faChar("fa-table").tooltip("Edges").selected(false).on("click", () => {
|
|
740
|
+
this.viewClick(this._toggleEdges);
|
|
741
|
+
});
|
|
742
|
+
_toggleSubgraphs = new ToggleButton().faChar("fa-table").tooltip("Subgraphs").selected(false).on("click", () => {
|
|
743
|
+
this.viewClick(this._toggleSubgraphs);
|
|
744
|
+
});
|
|
745
|
+
_graph = new Graph().layout("Hierarchy").applyScaleOnLayout(true).showToolbar(false).allowDragging(false);
|
|
746
|
+
_activities = new Table().pagination(false);
|
|
747
|
+
_edges = new Table().pagination(false);
|
|
748
|
+
_subgraphs = new Table().pagination(false);
|
|
749
|
+
_legend = new WUGraphLegend(this).on("click", (kind) => {
|
|
750
|
+
this.render();
|
|
751
|
+
}).on("mouseover", (kind) => {
|
|
752
|
+
const verticesMap = {};
|
|
753
|
+
for (const vertex of this._gc.vertices(kind)) {
|
|
754
|
+
verticesMap[vertex.id()] = true;
|
|
755
|
+
}
|
|
756
|
+
this._graph.highlightVerticies(verticesMap);
|
|
757
|
+
}).on("mouseout", (kind) => {
|
|
758
|
+
this._graph.highlightVerticies();
|
|
759
|
+
});
|
|
760
|
+
_view = new Carousel().widgets([this._graph, this._activities, this._edges, this._subgraphs]);
|
|
761
|
+
_gc = new WUScopeController();
|
|
550
762
|
constructor() {
|
|
551
763
|
super();
|
|
552
|
-
|
|
553
|
-
|
|
554
|
-
}));
|
|
555
|
-
__publicField(this, "_maxAll", new Button().faChar("fa-window-maximize").tooltip("Max All").on("click", () => {
|
|
556
|
-
this.stateClick(this._maxAll);
|
|
557
|
-
}));
|
|
558
|
-
__publicField(this, "_toggleGraph", new ToggleButton().faChar("fa-chain").tooltip("Graph").selected(!0).on("click", () => {
|
|
559
|
-
this.viewClick(this._toggleGraph);
|
|
560
|
-
}));
|
|
561
|
-
__publicField(this, "_toggleActivities", new ToggleButton().faChar("fa-table").tooltip("Activitiies").selected(!1).on("click", () => {
|
|
562
|
-
this.viewClick(this._toggleActivities);
|
|
563
|
-
}));
|
|
564
|
-
__publicField(this, "_toggleEdges", new ToggleButton().faChar("fa-table").tooltip("Edges").selected(!1).on("click", () => {
|
|
565
|
-
this.viewClick(this._toggleEdges);
|
|
566
|
-
}));
|
|
567
|
-
__publicField(this, "_toggleSubgraphs", new ToggleButton().faChar("fa-table").tooltip("Subgraphs").selected(!1).on("click", () => {
|
|
568
|
-
this.viewClick(this._toggleSubgraphs);
|
|
569
|
-
}));
|
|
570
|
-
__publicField(this, "_graph", new Graph().layout("Hierarchy").applyScaleOnLayout(!0).showToolbar(!1).allowDragging(!1));
|
|
571
|
-
__publicField(this, "_activities", new Table().pagination(!1));
|
|
572
|
-
__publicField(this, "_edges", new Table().pagination(!1));
|
|
573
|
-
__publicField(this, "_subgraphs", new Table().pagination(!1));
|
|
574
|
-
__publicField(this, "_legend", new WUGraphLegend(this).on("click", (kind) => {
|
|
575
|
-
this.render();
|
|
576
|
-
}).on("mouseover", (kind) => {
|
|
577
|
-
const verticesMap = {};
|
|
578
|
-
for (const vertex of this._gc.vertices(kind))
|
|
579
|
-
verticesMap[vertex.id()] = !0;
|
|
580
|
-
this._graph.highlightVerticies(verticesMap);
|
|
581
|
-
}).on("mouseout", (kind) => {
|
|
582
|
-
this._graph.highlightVerticies();
|
|
583
|
-
}));
|
|
584
|
-
__publicField(this, "_view", new Carousel().widgets([this._graph, this._activities, this._edges, this._subgraphs]));
|
|
585
|
-
__publicField(this, "_gc", new WUScopeController());
|
|
586
|
-
__publicField(this, "_prevHashSum");
|
|
587
|
-
__publicField(this, "_prevScopeGraph");
|
|
588
|
-
this.topOverlay(!1), this.widget(this._view);
|
|
764
|
+
this.topOverlay(false);
|
|
765
|
+
this.widget(this._view);
|
|
589
766
|
const buttons = [
|
|
590
767
|
this._toggleGraph,
|
|
591
768
|
this._toggleActivities,
|
|
@@ -598,11 +775,16 @@ class WUGraph extends ChartPanel {
|
|
|
598
775
|
...this._graph.iconBarButtons(),
|
|
599
776
|
new Spacer()
|
|
600
777
|
];
|
|
601
|
-
this.buttons(buttons.concat(this.buttons()))
|
|
602
|
-
|
|
778
|
+
this.buttons(buttons.concat(this.buttons()));
|
|
779
|
+
this._gc.minClick = (sg) => {
|
|
780
|
+
this.loadGraph();
|
|
781
|
+
this._graph.render((w) => {
|
|
603
782
|
this._graph.selection([sg]).centerOnItem(sg);
|
|
604
783
|
});
|
|
605
|
-
}
|
|
784
|
+
};
|
|
785
|
+
this._graph.tooltipHTML((v) => {
|
|
786
|
+
return this._gc.calcGraphTooltip(v);
|
|
787
|
+
});
|
|
606
788
|
}
|
|
607
789
|
stateClick(sourceB) {
|
|
608
790
|
switch (sourceB) {
|
|
@@ -620,7 +802,11 @@ class WUGraph extends ChartPanel {
|
|
|
620
802
|
this.render();
|
|
621
803
|
}
|
|
622
804
|
viewClick(sourceTB) {
|
|
623
|
-
|
|
805
|
+
this._toggleGraph.selected(sourceTB === this._toggleGraph);
|
|
806
|
+
this._toggleActivities.selected(sourceTB === this._toggleActivities);
|
|
807
|
+
this._toggleEdges.selected(sourceTB === this._toggleEdges);
|
|
808
|
+
this._toggleSubgraphs.selected(sourceTB === this._toggleSubgraphs);
|
|
809
|
+
switch (sourceTB) {
|
|
624
810
|
case this._toggleGraph:
|
|
625
811
|
this._view.active(0);
|
|
626
812
|
break;
|
|
@@ -637,6 +823,8 @@ class WUGraph extends ChartPanel {
|
|
|
637
823
|
this.render((w) => {
|
|
638
824
|
});
|
|
639
825
|
}
|
|
826
|
+
_prevHashSum;
|
|
827
|
+
_prevScopeGraph;
|
|
640
828
|
fetchScopeGraph() {
|
|
641
829
|
const hash = hashSum({
|
|
642
830
|
baseUrl: this.baseUrl(),
|
|
@@ -644,11 +832,24 @@ class WUGraph extends ChartPanel {
|
|
|
644
832
|
graphID: this.graphID(),
|
|
645
833
|
subgraphID: this.subgraphID()
|
|
646
834
|
});
|
|
647
|
-
|
|
648
|
-
|
|
649
|
-
|
|
650
|
-
|
|
651
|
-
|
|
835
|
+
if (!this._prevScopeGraph || this._prevHashSum !== hash) {
|
|
836
|
+
this.startProgress();
|
|
837
|
+
this._prevHashSum = hash;
|
|
838
|
+
this._gc.clear();
|
|
839
|
+
const wu = Workunit.attach({ baseUrl: this.baseUrl() }, this.wuid());
|
|
840
|
+
return wu.fetchGraphs().then((graphs) => {
|
|
841
|
+
for (const graph of graphs) {
|
|
842
|
+
if (graph.Name === this.graphID()) {
|
|
843
|
+
this.finishProgress();
|
|
844
|
+
return graph.fetchScopeGraph(this.subgraphID());
|
|
845
|
+
}
|
|
846
|
+
}
|
|
847
|
+
}).then((scopeGraph) => {
|
|
848
|
+
this._prevScopeGraph = scopeGraph;
|
|
849
|
+
return this._prevScopeGraph;
|
|
850
|
+
});
|
|
851
|
+
}
|
|
852
|
+
return Promise.resolve(this._prevScopeGraph);
|
|
652
853
|
}
|
|
653
854
|
enter(domNode, _element) {
|
|
654
855
|
super.enter(domNode, _element);
|
|
@@ -660,7 +861,8 @@ class WUGraph extends ChartPanel {
|
|
|
660
861
|
super.exit(domNode, element);
|
|
661
862
|
}
|
|
662
863
|
loadGraph() {
|
|
663
|
-
this._gc.disabled(this._legend.disabled())
|
|
864
|
+
this._gc.disabled(this._legend.disabled());
|
|
865
|
+
this._graph.data(this._gc.graphData(), true);
|
|
664
866
|
{
|
|
665
867
|
const { columns: columns2, data } = this._gc.activityData();
|
|
666
868
|
this._activities.columns(columns2).data(data);
|
|
@@ -675,16 +877,29 @@ class WUGraph extends ChartPanel {
|
|
|
675
877
|
}
|
|
676
878
|
}
|
|
677
879
|
render(callback) {
|
|
678
|
-
|
|
679
|
-
this.
|
|
680
|
-
|
|
880
|
+
if (this.wuid() && this.graphID()) {
|
|
881
|
+
this.fetchScopeGraph().then((scopedGraph) => {
|
|
882
|
+
this._gc.set(scopedGraph);
|
|
883
|
+
this._legend.data(this._gc.calcLegend());
|
|
884
|
+
this.loadGraph();
|
|
885
|
+
super.render(callback);
|
|
886
|
+
});
|
|
887
|
+
} else {
|
|
888
|
+
super.render(callback);
|
|
889
|
+
}
|
|
890
|
+
return this;
|
|
681
891
|
}
|
|
682
892
|
selection(_) {
|
|
683
893
|
if (!arguments.length) return this._graph.selection();
|
|
684
894
|
const item = this._gc.vertex(_) || this._gc.edge(_) || this._gc.subgraph(_);
|
|
685
|
-
|
|
895
|
+
if (item) {
|
|
896
|
+
this._graph.selection([item]);
|
|
897
|
+
}
|
|
898
|
+
return this;
|
|
686
899
|
}
|
|
687
|
-
}
|
|
900
|
+
};
|
|
901
|
+
__name(_WUGraph, "WUGraph");
|
|
902
|
+
let WUGraph = _WUGraph;
|
|
688
903
|
WUGraph.prototype._class += " eclwatch_WUGraph";
|
|
689
904
|
WUGraph.prototype.publish("baseUrl", "", "string", "HPCC Platform Base URL");
|
|
690
905
|
WUGraph.prototype.publish("wuid", "", "string", "Workunit ID");
|
|
@@ -693,6 +908,7 @@ WUGraph.prototype.publish("subgraphID", "", "string", "Subgraph ID");
|
|
|
693
908
|
function entitiesEncode(str) {
|
|
694
909
|
return String(str).replace(/&/g, "&").replace(/</g, "<").replace(/>/g, ">").replace(/"/g, """);
|
|
695
910
|
}
|
|
911
|
+
__name(entitiesEncode, "entitiesEncode");
|
|
696
912
|
function safeEncode(item) {
|
|
697
913
|
switch (Object.prototype.toString.call(item)) {
|
|
698
914
|
case "[object Undefined]":
|
|
@@ -706,67 +922,94 @@ function safeEncode(item) {
|
|
|
706
922
|
}
|
|
707
923
|
return item;
|
|
708
924
|
}
|
|
709
|
-
|
|
925
|
+
__name(safeEncode, "safeEncode");
|
|
926
|
+
const _Store = class _Store {
|
|
927
|
+
wuResult;
|
|
928
|
+
schema;
|
|
929
|
+
_columns;
|
|
930
|
+
_cache = {};
|
|
931
|
+
rowFormatter;
|
|
932
|
+
_filter = {};
|
|
933
|
+
onError;
|
|
710
934
|
constructor(wuResult, schema, renderHtml, filter = {}, onError) {
|
|
711
|
-
|
|
712
|
-
|
|
713
|
-
|
|
714
|
-
|
|
715
|
-
|
|
716
|
-
|
|
717
|
-
__publicField(this, "onError");
|
|
718
|
-
this.wuResult = wuResult, this.schema = schema, this._columns = this.schema2Columns(this.schema.root), this.rowFormatter = new RowFormatter(this._columns, renderHtml), this._filter = filter, this.onError = onError;
|
|
935
|
+
this.wuResult = wuResult;
|
|
936
|
+
this.schema = schema;
|
|
937
|
+
this._columns = this.schema2Columns(this.schema.root);
|
|
938
|
+
this.rowFormatter = new RowFormatter(this._columns, renderHtml);
|
|
939
|
+
this._filter = filter;
|
|
940
|
+
this.onError = onError;
|
|
719
941
|
}
|
|
720
942
|
columns() {
|
|
721
943
|
return this._columns;
|
|
722
944
|
}
|
|
723
945
|
schema2Columns(parentNode, prefix = "") {
|
|
724
|
-
|
|
725
|
-
|
|
946
|
+
if (!parentNode) return [];
|
|
947
|
+
return parentNode.children().filter((node) => node.name.indexOf("__hidden", node.name.length - "__hidden".length) === -1).map((node, idx) => {
|
|
948
|
+
const label = node.name;
|
|
949
|
+
const keyed = node.attrs["hpcc:keyed"];
|
|
950
|
+
const column = {
|
|
726
951
|
field: prefix + label,
|
|
727
952
|
leafID: label,
|
|
728
953
|
idx,
|
|
729
954
|
label: label + (keyed ? " (i)" : ""),
|
|
730
955
|
className: "resultGridCell",
|
|
731
|
-
sortable:
|
|
956
|
+
sortable: false,
|
|
732
957
|
width: keyed ? 16 : 0,
|
|
733
958
|
isSet: node.isSet
|
|
734
|
-
}
|
|
735
|
-
|
|
736
|
-
|
|
737
|
-
|
|
738
|
-
|
|
739
|
-
|
|
740
|
-
|
|
741
|
-
|
|
742
|
-
|
|
743
|
-
|
|
744
|
-
|
|
745
|
-
|
|
746
|
-
|
|
959
|
+
};
|
|
960
|
+
const children = this.schema2Columns(node, prefix + label + "_");
|
|
961
|
+
if (children.length) {
|
|
962
|
+
column.width += 10 + children.reduce((prev, childNode) => {
|
|
963
|
+
return prev + childNode.width;
|
|
964
|
+
}, 0);
|
|
965
|
+
column.children = children;
|
|
966
|
+
} else {
|
|
967
|
+
column.width += node.charWidth() * 9;
|
|
968
|
+
column.formatter = (cell, row) => {
|
|
969
|
+
switch (typeof cell) {
|
|
970
|
+
case "string":
|
|
971
|
+
return {
|
|
972
|
+
html: cell.replace(/\t/g, " ").trim()
|
|
973
|
+
};
|
|
974
|
+
case "undefined":
|
|
975
|
+
return "";
|
|
976
|
+
}
|
|
977
|
+
return cell;
|
|
978
|
+
};
|
|
979
|
+
}
|
|
980
|
+
return column;
|
|
981
|
+
});
|
|
747
982
|
}
|
|
748
983
|
isChildDataset(cell) {
|
|
749
|
-
if (Object.prototype.toString.call(cell) !== "[object Object]")
|
|
750
|
-
return
|
|
751
|
-
|
|
752
|
-
|
|
753
|
-
|
|
984
|
+
if (Object.prototype.toString.call(cell) !== "[object Object]") {
|
|
985
|
+
return false;
|
|
986
|
+
}
|
|
987
|
+
let propCount = 0;
|
|
988
|
+
let firstPropType = null;
|
|
989
|
+
for (const key in cell) {
|
|
990
|
+
if (!firstPropType) {
|
|
991
|
+
firstPropType = Object.prototype.toString.call(cell[key]);
|
|
992
|
+
}
|
|
993
|
+
propCount++;
|
|
994
|
+
}
|
|
754
995
|
return propCount === 1 && firstPropType === "[object Array]";
|
|
755
996
|
}
|
|
756
997
|
rowToTable(cell, __row, node) {
|
|
757
998
|
if (this.isChildDataset(cell)) {
|
|
758
|
-
for (const key in cell)
|
|
999
|
+
for (const key in cell) {
|
|
759
1000
|
this.rowToTable(cell[key], __row, node);
|
|
1001
|
+
}
|
|
760
1002
|
return;
|
|
761
1003
|
}
|
|
762
1004
|
const table = domConstruct.create("table", { border: 1, cellspacing: 0, width: "100%" }, node);
|
|
763
1005
|
switch (Object.prototype.toString.call(cell)) {
|
|
764
1006
|
case "[object Object]":
|
|
765
1007
|
let tr = domConstruct.create("tr", null, table);
|
|
766
|
-
for (const key in cell)
|
|
1008
|
+
for (const key in cell) {
|
|
767
1009
|
domConstruct.create("th", { innerHTML: safeEncode(key) }, tr);
|
|
1010
|
+
}
|
|
768
1011
|
tr = domConstruct.create("tr", null, table);
|
|
769
|
-
for (const key in cell)
|
|
1012
|
+
for (const key in cell) {
|
|
770
1013
|
switch (Object.prototype.toString.call(cell[key])) {
|
|
771
1014
|
case "[object Object]":
|
|
772
1015
|
case "[object Array]":
|
|
@@ -776,9 +1019,10 @@ class Store {
|
|
|
776
1019
|
domConstruct.create("td", { innerHTML: safeEncode(cell[key]) }, tr);
|
|
777
1020
|
break;
|
|
778
1021
|
}
|
|
1022
|
+
}
|
|
779
1023
|
break;
|
|
780
1024
|
case "[object Array]":
|
|
781
|
-
for (let i = 0; i < cell.length; ++i)
|
|
1025
|
+
for (let i = 0; i < cell.length; ++i) {
|
|
782
1026
|
switch (Object.prototype.toString.call(cell[i])) {
|
|
783
1027
|
case "[object Boolean]":
|
|
784
1028
|
case "[object Number]":
|
|
@@ -789,26 +1033,30 @@ class Store {
|
|
|
789
1033
|
default:
|
|
790
1034
|
if (i === 0) {
|
|
791
1035
|
const tr2 = domConstruct.create("tr", null, table);
|
|
792
|
-
for (const key in cell[i])
|
|
1036
|
+
for (const key in cell[i]) {
|
|
793
1037
|
domConstruct.create("th", { innerHTML: safeEncode(key) }, tr2);
|
|
1038
|
+
}
|
|
794
1039
|
}
|
|
795
1040
|
domConstruct.create("tr", null, table);
|
|
796
|
-
for (const key in cell[i])
|
|
797
|
-
if (cell[i][key])
|
|
1041
|
+
for (const key in cell[i]) {
|
|
1042
|
+
if (cell[i][key]) {
|
|
798
1043
|
if (Object.prototype.toString.call(cell[i][key]) === "[object Object]" || Object.prototype.toString.call(cell[i][key]) === "[object Array]") {
|
|
799
1044
|
const td = domConstruct.create("td", null, tr1);
|
|
800
1045
|
this.rowToTable(cell[i][key], cell[i], td);
|
|
801
|
-
} else if (key.indexOf("__html", key.length -
|
|
1046
|
+
} else if (key.indexOf("__html", key.length - "__html".length) !== -1) {
|
|
802
1047
|
domConstruct.create("td", { innerHTML: cell[i][key] }, tr1);
|
|
803
|
-
else if (key.indexOf("__javascript", key.length -
|
|
1048
|
+
} else if (key.indexOf("__javascript", key.length - "__javascript".length) !== -1) {
|
|
804
1049
|
domConstruct.create("td", null, tr1);
|
|
805
|
-
else {
|
|
1050
|
+
} else {
|
|
806
1051
|
const val = cell[i][key];
|
|
807
1052
|
domConstruct.create("td", { innerHTML: safeEncode(val) }, tr1);
|
|
808
1053
|
}
|
|
809
|
-
else
|
|
1054
|
+
} else {
|
|
810
1055
|
domConstruct.create("td", { innerHTML: "" }, tr1);
|
|
1056
|
+
}
|
|
1057
|
+
}
|
|
811
1058
|
}
|
|
1059
|
+
}
|
|
812
1060
|
break;
|
|
813
1061
|
}
|
|
814
1062
|
}
|
|
@@ -819,31 +1067,39 @@ class Store {
|
|
|
819
1067
|
if (!this.wuResult) return Promise.resolve({ totalLength: 0, data: [] });
|
|
820
1068
|
const cacheKey = `${start}->${end}`;
|
|
821
1069
|
if (this._cache[cacheKey]) return this._cache[cacheKey];
|
|
822
|
-
const retVal = this.wuResult.fetchRows(start, end - start,
|
|
823
|
-
|
|
824
|
-
|
|
825
|
-
|
|
826
|
-
|
|
827
|
-
|
|
828
|
-
|
|
829
|
-
|
|
1070
|
+
const retVal = this.wuResult.fetchRows(start, end - start, false, this._filter).then((rows) => {
|
|
1071
|
+
return {
|
|
1072
|
+
totalLength: this.wuResult.Total,
|
|
1073
|
+
data: rows.map((row, idx) => {
|
|
1074
|
+
const formattedRow = this.rowFormatter.format(row);
|
|
1075
|
+
formattedRow.__hpcc_id = start + idx;
|
|
1076
|
+
formattedRow.__hpcc_orig = row;
|
|
1077
|
+
return formattedRow;
|
|
1078
|
+
})
|
|
1079
|
+
};
|
|
1080
|
+
}).catch((err) => {
|
|
1081
|
+
this.onError(err.Message || "An exception has occurred");
|
|
1082
|
+
return { totalLength: 0, data: [] };
|
|
1083
|
+
});
|
|
1084
|
+
this._cache[cacheKey] = retVal;
|
|
1085
|
+
return retVal;
|
|
830
1086
|
}
|
|
831
1087
|
fetchRange(options) {
|
|
832
1088
|
const retVal = new Deferred();
|
|
833
|
-
|
|
1089
|
+
this._request(options.start, options.end).then((response) => retVal.resolve(response));
|
|
1090
|
+
return new QueryResults(retVal.then((response) => response.data), {
|
|
834
1091
|
totalLength: retVal.then((response) => response.totalLength)
|
|
835
1092
|
});
|
|
836
1093
|
}
|
|
837
|
-
}
|
|
838
|
-
|
|
1094
|
+
};
|
|
1095
|
+
__name(_Store, "Store");
|
|
1096
|
+
let Store = _Store;
|
|
1097
|
+
const _WUResult = class _WUResult extends Common {
|
|
1098
|
+
_result;
|
|
1099
|
+
_localStore;
|
|
839
1100
|
constructor() {
|
|
840
1101
|
super();
|
|
841
|
-
|
|
842
|
-
__publicField(this, "_localStore");
|
|
843
|
-
__publicField(this, "_prevResultHash");
|
|
844
|
-
__publicField(this, "_prevStoreHash");
|
|
845
|
-
__publicField(this, "_prevQueryHash");
|
|
846
|
-
this.renderHtml(!1);
|
|
1102
|
+
this.renderHtml(false);
|
|
847
1103
|
}
|
|
848
1104
|
hashSum(opts = {}) {
|
|
849
1105
|
return hashSum({
|
|
@@ -855,9 +1111,11 @@ class WUResult extends Common {
|
|
|
855
1111
|
logicalFile: this.logicalFile(),
|
|
856
1112
|
userID: this.user(),
|
|
857
1113
|
password: this.password(),
|
|
1114
|
+
bypassCache: this.bypassCache(),
|
|
858
1115
|
...opts
|
|
859
1116
|
});
|
|
860
1117
|
}
|
|
1118
|
+
_prevResultHash;
|
|
861
1119
|
calcResult() {
|
|
862
1120
|
const resultHash = this.hashSum();
|
|
863
1121
|
if (this._prevResultHash !== resultHash) {
|
|
@@ -867,14 +1125,30 @@ class WUResult extends Common {
|
|
|
867
1125
|
userID: this.user(),
|
|
868
1126
|
password: this.password()
|
|
869
1127
|
};
|
|
870
|
-
|
|
1128
|
+
if (this.wuid() && this.resultName()) {
|
|
1129
|
+
this._result = Result.attach(opts, this.wuid(), this.resultName());
|
|
1130
|
+
} else if (this.wuid() && this.sequence() !== void 0) {
|
|
1131
|
+
this._result = Result.attach(opts, this.wuid(), this.sequence());
|
|
1132
|
+
} else if (this.logicalFile() && this.nodeGroup()) {
|
|
1133
|
+
this._result = Result.attachLogicalFile(opts, this.nodeGroup(), this.logicalFile());
|
|
1134
|
+
} else if (this.logicalFile()) {
|
|
1135
|
+
this._result = Result.attachLogicalFile(opts, "", this.logicalFile());
|
|
1136
|
+
}
|
|
1137
|
+
if (this._result && this.bypassCache()) {
|
|
1138
|
+
this._result.bypassCache(this.bypassCache());
|
|
1139
|
+
}
|
|
871
1140
|
}
|
|
872
1141
|
return this._result;
|
|
873
1142
|
}
|
|
874
1143
|
fetch(row, count, abortController = new AbortController()) {
|
|
875
1144
|
const result = this.calcResult();
|
|
876
|
-
|
|
1145
|
+
if (result) {
|
|
1146
|
+
return result.fetchRows(row, count, false, {}, abortController.signal);
|
|
1147
|
+
}
|
|
1148
|
+
return Promise.resolve([]);
|
|
877
1149
|
}
|
|
1150
|
+
_prevStoreHash;
|
|
1151
|
+
_prevQueryHash;
|
|
878
1152
|
update(domNode, element) {
|
|
879
1153
|
super.update(domNode, element);
|
|
880
1154
|
const storeHash = this.hashSum({
|
|
@@ -884,17 +1158,25 @@ class WUResult extends Common {
|
|
|
884
1158
|
if (this._prevStoreHash !== storeHash) {
|
|
885
1159
|
this._prevStoreHash = storeHash;
|
|
886
1160
|
const result = this.calcResult();
|
|
887
|
-
|
|
888
|
-
|
|
889
|
-
|
|
890
|
-
|
|
891
|
-
|
|
892
|
-
|
|
1161
|
+
if (result) {
|
|
1162
|
+
result.fetchXMLSchema().then((schema) => {
|
|
1163
|
+
this._localStore = new Store(result, schema, this.renderHtml(), this.filter(), (msg) => {
|
|
1164
|
+
if (this._dgrid) {
|
|
1165
|
+
this._dgrid.noDataMessage = `<span class='dojoxGridNoData'>${msg}</span>`;
|
|
1166
|
+
this._dgrid.refresh();
|
|
1167
|
+
}
|
|
1168
|
+
});
|
|
1169
|
+
this._dgrid?.set("columns", this._localStore.columns());
|
|
1170
|
+
this._dgrid?.set("collection", this._localStore);
|
|
1171
|
+
});
|
|
1172
|
+
}
|
|
893
1173
|
}
|
|
894
1174
|
}
|
|
895
1175
|
click(row, col, sel) {
|
|
896
1176
|
}
|
|
897
|
-
}
|
|
1177
|
+
};
|
|
1178
|
+
__name(_WUResult, "WUResult");
|
|
1179
|
+
let WUResult = _WUResult;
|
|
898
1180
|
WUResult.prototype._class += " eclwatch_WUResult";
|
|
899
1181
|
WUResult.prototype.publish("baseUrl", "", "string", "URL to WsWorkunits");
|
|
900
1182
|
WUResult.prototype.publish("user", "", "string", "User ID");
|
|
@@ -905,27 +1187,48 @@ WUResult.prototype.publish("sequence", void 0, "number", "Sequence Number");
|
|
|
905
1187
|
WUResult.prototype.publish("nodeGroup", "", "string", "NodeGroup");
|
|
906
1188
|
WUResult.prototype.publish("logicalFile", "", "string", "Logical File Name");
|
|
907
1189
|
WUResult.prototype.publish("filter", {}, "object", "Filter");
|
|
908
|
-
|
|
909
|
-
|
|
1190
|
+
WUResult.prototype.publish("bypassCache", false, "boolean", "Bypass cached results");
|
|
1191
|
+
var STATUS = /* @__PURE__ */ ((STATUS2) => {
|
|
1192
|
+
STATUS2["CREATE"] = "Created";
|
|
1193
|
+
STATUS2["COMPILE"] = "Compiled";
|
|
1194
|
+
STATUS2["EXECUTE"] = "Executed";
|
|
1195
|
+
STATUS2["COMPLETE"] = "Completed";
|
|
1196
|
+
return STATUS2;
|
|
1197
|
+
})(STATUS || {});
|
|
1198
|
+
var STATUS_ACTIVE = /* @__PURE__ */ ((STATUS_ACTIVE2) => {
|
|
1199
|
+
STATUS_ACTIVE2["CREATE"] = "Creating";
|
|
1200
|
+
STATUS_ACTIVE2["COMPILE"] = "Compiling";
|
|
1201
|
+
STATUS_ACTIVE2["EXECUTE"] = "Executing";
|
|
1202
|
+
STATUS_ACTIVE2["COMPLETE"] = "Completed";
|
|
1203
|
+
return STATUS_ACTIVE2;
|
|
1204
|
+
})(STATUS_ACTIVE || {});
|
|
1205
|
+
const _WUStatus = class _WUStatus extends Graph {
|
|
1206
|
+
_wu;
|
|
1207
|
+
_wuHandle;
|
|
1208
|
+
_create;
|
|
1209
|
+
_compile;
|
|
1210
|
+
_execute;
|
|
1211
|
+
_complete;
|
|
910
1212
|
constructor() {
|
|
911
1213
|
super();
|
|
912
|
-
|
|
913
|
-
__publicField(this, "_wuHandle");
|
|
914
|
-
__publicField(this, "_create");
|
|
915
|
-
__publicField(this, "_compile");
|
|
916
|
-
__publicField(this, "_execute");
|
|
917
|
-
__publicField(this, "_complete");
|
|
918
|
-
__publicField(this, "_prevHash");
|
|
919
|
-
this.zoomable(!1).zoomToFitLimit(1).layout("Hierarchy").hierarchyRankDirection("LR").showToolbar(!1).allowDragging(!1);
|
|
1214
|
+
this.zoomable(false).zoomToFitLimit(1).layout("Hierarchy").hierarchyRankDirection("LR").showToolbar(false).allowDragging(false);
|
|
920
1215
|
}
|
|
1216
|
+
_prevHash;
|
|
921
1217
|
attachWorkunit() {
|
|
922
1218
|
const hash = hashSum({
|
|
923
1219
|
baseUrl: this.baseUrl(),
|
|
924
1220
|
wuid: this.wuid()
|
|
925
1221
|
});
|
|
926
|
-
|
|
927
|
-
this.
|
|
928
|
-
|
|
1222
|
+
if (this._prevHash !== hash) {
|
|
1223
|
+
this._prevHash = hash;
|
|
1224
|
+
this._wu = Workunit.attach({ baseUrl: this.baseUrl() }, this.wuid());
|
|
1225
|
+
if (this._wuHandle) {
|
|
1226
|
+
this._wuHandle.release();
|
|
1227
|
+
}
|
|
1228
|
+
this._wuHandle = this._wu.watch((changes) => {
|
|
1229
|
+
this.lazyRender();
|
|
1230
|
+
});
|
|
1231
|
+
}
|
|
929
1232
|
}
|
|
930
1233
|
createVertex(faChar) {
|
|
931
1234
|
return new Vertex().icon_diameter(32).icon_shape_colorFill("none").icon_shape_colorStroke("none").icon_image_colorFill("darkgray").iconAnchor("middle").textbox_shape_colorFill("none").textbox_shape_colorStroke("none").textbox_text_colorFill("darkgray").faChar(faChar);
|
|
@@ -933,60 +1236,89 @@ class WUStatus extends Graph {
|
|
|
933
1236
|
updateVertex(vertex, color) {
|
|
934
1237
|
vertex.icon_image_colorFill(color).textbox_text_colorFill(color);
|
|
935
1238
|
}
|
|
936
|
-
updateVertexStatus(level, active =
|
|
1239
|
+
updateVertexStatus(level, active = false) {
|
|
937
1240
|
const completeColor = this._wu.isFailed() ? "darkred" : "darkgreen";
|
|
938
|
-
|
|
1241
|
+
this._create.text(
|
|
939
1242
|
"Created"
|
|
940
1243
|
/* CREATE */
|
|
941
|
-
)
|
|
1244
|
+
);
|
|
1245
|
+
this._compile.text(
|
|
942
1246
|
"Compiled"
|
|
943
1247
|
/* COMPILE */
|
|
944
|
-
)
|
|
1248
|
+
);
|
|
1249
|
+
this._execute.text(
|
|
945
1250
|
"Executed"
|
|
946
1251
|
/* EXECUTE */
|
|
947
|
-
)
|
|
1252
|
+
);
|
|
1253
|
+
this._complete.text(
|
|
948
1254
|
"Completed"
|
|
949
1255
|
/* COMPLETE */
|
|
950
|
-
)
|
|
1256
|
+
);
|
|
1257
|
+
switch (level) {
|
|
951
1258
|
case 0:
|
|
952
|
-
this.updateVertex(this._create, "darkgray")
|
|
1259
|
+
this.updateVertex(this._create, "darkgray");
|
|
1260
|
+
this.updateVertex(this._compile, "darkgray");
|
|
1261
|
+
this.updateVertex(this._execute, "darkgray");
|
|
1262
|
+
this.updateVertex(this._complete, "darkgray");
|
|
953
1263
|
break;
|
|
954
1264
|
case 1:
|
|
955
1265
|
this._create.text(
|
|
956
1266
|
"Creating"
|
|
957
1267
|
/* CREATE */
|
|
958
|
-
)
|
|
1268
|
+
);
|
|
1269
|
+
this.updateVertex(this._create, active ? "orange" : completeColor);
|
|
1270
|
+
this.updateVertex(this._compile, "darkgray");
|
|
1271
|
+
this.updateVertex(this._execute, "darkgray");
|
|
1272
|
+
this.updateVertex(this._complete, "darkgray");
|
|
959
1273
|
break;
|
|
960
1274
|
case 2:
|
|
961
1275
|
this._compile.text(
|
|
962
1276
|
"Compiling"
|
|
963
1277
|
/* COMPILE */
|
|
964
|
-
)
|
|
1278
|
+
);
|
|
1279
|
+
this.updateVertex(this._create, completeColor);
|
|
1280
|
+
this.updateVertex(this._compile, active ? "orange" : completeColor);
|
|
1281
|
+
this.updateVertex(this._execute, completeColor);
|
|
1282
|
+
this.updateVertex(this._complete, "darkgray");
|
|
965
1283
|
break;
|
|
966
1284
|
case 3:
|
|
967
1285
|
this._execute.text(
|
|
968
1286
|
"Executing"
|
|
969
1287
|
/* EXECUTE */
|
|
970
|
-
)
|
|
1288
|
+
);
|
|
1289
|
+
this.updateVertex(this._create, completeColor);
|
|
1290
|
+
this.updateVertex(this._compile, completeColor);
|
|
1291
|
+
this.updateVertex(this._execute, active ? "orange" : completeColor);
|
|
1292
|
+
this.updateVertex(this._complete, "darkgray");
|
|
971
1293
|
break;
|
|
972
1294
|
case 4:
|
|
973
|
-
this.updateVertex(this._create, completeColor)
|
|
1295
|
+
this.updateVertex(this._create, completeColor);
|
|
1296
|
+
this.updateVertex(this._compile, completeColor);
|
|
1297
|
+
this.updateVertex(this._execute, completeColor);
|
|
1298
|
+
this.updateVertex(this._complete, completeColor);
|
|
974
1299
|
break;
|
|
975
1300
|
}
|
|
976
1301
|
}
|
|
977
1302
|
createEdge(source, target) {
|
|
978
|
-
return new Edge$1().sourceVertex(source).targetVertex(target).strokeColor("black").showArc(
|
|
1303
|
+
return new Edge$1().sourceVertex(source).targetVertex(target).strokeColor("black").showArc(false);
|
|
979
1304
|
}
|
|
980
1305
|
enter(domNode, element) {
|
|
981
|
-
super.enter(domNode, element)
|
|
982
|
-
|
|
1306
|
+
super.enter(domNode, element);
|
|
1307
|
+
this._create = this.createVertex("");
|
|
1308
|
+
this._compile = this.createVertex("");
|
|
1309
|
+
this._execute = this.createVertex("");
|
|
1310
|
+
this._complete = this.createVertex("");
|
|
1311
|
+
const e1 = this.createEdge(this._create, this._compile);
|
|
1312
|
+
const e2 = this.createEdge(this._compile, this._execute);
|
|
1313
|
+
const e3 = this.createEdge(this._execute, this._complete);
|
|
983
1314
|
this.data({
|
|
984
1315
|
vertices: [this._create, this._compile, this._execute, this._complete],
|
|
985
1316
|
edges: [e1, e2, e3]
|
|
986
1317
|
});
|
|
987
1318
|
}
|
|
988
1319
|
update(domNode, element) {
|
|
989
|
-
|
|
1320
|
+
this.attachWorkunit();
|
|
1321
|
+
switch (this._wu.StateID) {
|
|
990
1322
|
case WUStateID.Blocked:
|
|
991
1323
|
case WUStateID.Wait:
|
|
992
1324
|
case WUStateID.Scheduled:
|
|
@@ -994,17 +1326,17 @@ class WUStatus extends Graph {
|
|
|
994
1326
|
this.updateVertexStatus(1);
|
|
995
1327
|
break;
|
|
996
1328
|
case WUStateID.Compiling:
|
|
997
|
-
this.updateVertexStatus(2,
|
|
1329
|
+
this.updateVertexStatus(2, true);
|
|
998
1330
|
break;
|
|
999
1331
|
case WUStateID.Submitted:
|
|
1000
|
-
this.updateVertexStatus(1,
|
|
1332
|
+
this.updateVertexStatus(1, true);
|
|
1001
1333
|
break;
|
|
1002
1334
|
case WUStateID.Compiled:
|
|
1003
1335
|
this.updateVertexStatus(2);
|
|
1004
1336
|
break;
|
|
1005
1337
|
case WUStateID.Aborting:
|
|
1006
1338
|
case WUStateID.Running:
|
|
1007
|
-
this.updateVertexStatus(3,
|
|
1339
|
+
this.updateVertexStatus(3, true);
|
|
1008
1340
|
break;
|
|
1009
1341
|
case WUStateID.Aborted:
|
|
1010
1342
|
case WUStateID.Archived:
|
|
@@ -1012,7 +1344,7 @@ class WUStatus extends Graph {
|
|
|
1012
1344
|
this.updateVertexStatus(4);
|
|
1013
1345
|
break;
|
|
1014
1346
|
case WUStateID.Failed:
|
|
1015
|
-
this.updateVertexStatus(4,
|
|
1347
|
+
this.updateVertexStatus(4, false);
|
|
1016
1348
|
break;
|
|
1017
1349
|
case WUStateID.DebugPaused:
|
|
1018
1350
|
case WUStateID.DebugRunning:
|
|
@@ -1022,25 +1354,34 @@ class WUStatus extends Graph {
|
|
|
1022
1354
|
this.updateVertexStatus(0);
|
|
1023
1355
|
break;
|
|
1024
1356
|
}
|
|
1025
|
-
super.update(domNode, element)
|
|
1357
|
+
super.update(domNode, element);
|
|
1358
|
+
this.zoomToFit();
|
|
1026
1359
|
}
|
|
1027
1360
|
exit(domNode, element) {
|
|
1028
|
-
|
|
1361
|
+
if (this._wuHandle) {
|
|
1362
|
+
this._wuHandle.release();
|
|
1363
|
+
}
|
|
1364
|
+
super.exit(domNode, element);
|
|
1029
1365
|
}
|
|
1030
|
-
}
|
|
1366
|
+
};
|
|
1367
|
+
__name(_WUStatus, "WUStatus");
|
|
1368
|
+
let WUStatus = _WUStatus;
|
|
1031
1369
|
WUStatus.prototype._class += " eclwatch_WUStatus";
|
|
1032
1370
|
WUStatus.prototype.publish("baseUrl", "", "string", "HPCC Platform Base URL");
|
|
1033
1371
|
WUStatus.prototype.publish("wuid", "", "string", "Workunit ID");
|
|
1034
1372
|
const columns = ["label", "start", "end", "icon", "color", "series"];
|
|
1035
|
-
class
|
|
1373
|
+
const _WUTimeline = class _WUTimeline extends ReactTimelineSeries {
|
|
1374
|
+
_palette = Palette.ordinal("default");
|
|
1036
1375
|
constructor() {
|
|
1037
1376
|
super();
|
|
1038
|
-
|
|
1039
|
-
|
|
1040
|
-
|
|
1377
|
+
this.columns(columns).titleColumn("label").iconColumn("icon").colorColumn("color").seriesColumn("series").timePattern("%Y-%m-%dT%H:%M:%S.%LZ").tickFormat("%H:%M").tooltipTimeFormat("%H:%M:%S.%L").tooltipHTML((d) => {
|
|
1378
|
+
return d[columns.length].calcTooltip();
|
|
1379
|
+
});
|
|
1041
1380
|
}
|
|
1381
|
+
_prevHashSum;
|
|
1042
1382
|
clear() {
|
|
1043
|
-
|
|
1383
|
+
delete this._prevHashSum;
|
|
1384
|
+
return this;
|
|
1044
1385
|
}
|
|
1045
1386
|
fetchScopes() {
|
|
1046
1387
|
const hash = hashSum({
|
|
@@ -1048,31 +1389,41 @@ class WUTimeline extends ReactTimelineSeries {
|
|
|
1048
1389
|
wuid: this.wuid(),
|
|
1049
1390
|
request: this.request()
|
|
1050
1391
|
});
|
|
1051
|
-
|
|
1052
|
-
|
|
1053
|
-
|
|
1054
|
-
|
|
1055
|
-
|
|
1056
|
-
|
|
1057
|
-
|
|
1058
|
-
|
|
1059
|
-
|
|
1060
|
-
|
|
1061
|
-
|
|
1062
|
-
|
|
1063
|
-
|
|
1064
|
-
|
|
1392
|
+
if (this._prevHashSum !== hash) {
|
|
1393
|
+
this._prevHashSum = hash;
|
|
1394
|
+
const wu = Workunit.attach({ baseUrl: this.baseUrl() }, this.wuid());
|
|
1395
|
+
wu.fetchDetails(this.request()).then((scopes) => {
|
|
1396
|
+
return scopes.filter((scope) => scope.Id && scope.attr("WhenStarted").RawValue).map((scope) => {
|
|
1397
|
+
const whenStarted = +scope.attr("WhenStarted").RawValue / 1e3;
|
|
1398
|
+
const timeElapsed = +scope.attr("TimeElapsed").RawValue / 1e6;
|
|
1399
|
+
return [
|
|
1400
|
+
scope.Id,
|
|
1401
|
+
new Date(whenStarted).toISOString(),
|
|
1402
|
+
timeElapsed ? new Date(whenStarted + timeElapsed).toISOString() : void 0,
|
|
1403
|
+
null,
|
|
1404
|
+
this._palette(scope.ScopeType),
|
|
1405
|
+
scope.ScopeName.split("::").join(":").split(":").slice(0, 1),
|
|
1406
|
+
scope
|
|
1407
|
+
];
|
|
1408
|
+
});
|
|
1409
|
+
}).then((scopes) => {
|
|
1410
|
+
this.data(scopes).render();
|
|
1411
|
+
});
|
|
1412
|
+
}
|
|
1065
1413
|
}
|
|
1066
1414
|
enter(domNode, _element) {
|
|
1067
1415
|
super.enter(domNode, _element);
|
|
1068
1416
|
}
|
|
1069
1417
|
update(domNode, element) {
|
|
1070
|
-
this.fetchScopes()
|
|
1418
|
+
this.fetchScopes();
|
|
1419
|
+
super.update(domNode, element);
|
|
1071
1420
|
}
|
|
1072
1421
|
exit(domNode, element) {
|
|
1073
1422
|
super.exit(domNode, element);
|
|
1074
1423
|
}
|
|
1075
|
-
}
|
|
1424
|
+
};
|
|
1425
|
+
__name(_WUTimeline, "WUTimeline");
|
|
1426
|
+
let WUTimeline = _WUTimeline;
|
|
1076
1427
|
WUTimeline.prototype._class += " eclwatch_WUTimeline";
|
|
1077
1428
|
WUTimeline.prototype.publish("baseUrl", "", "string", "HPCC Platform Base URL");
|
|
1078
1429
|
WUTimeline.prototype.publish("wuid", "", "string", "Workunit ID");
|
|
@@ -1086,23 +1437,23 @@ WUTimeline.prototype.publish("request", {
|
|
|
1086
1437
|
ScopeTypes: []
|
|
1087
1438
|
},
|
|
1088
1439
|
PropertiesToReturn: {
|
|
1089
|
-
AllProperties:
|
|
1090
|
-
AllStatistics:
|
|
1091
|
-
AllHints:
|
|
1440
|
+
AllProperties: false,
|
|
1441
|
+
AllStatistics: true,
|
|
1442
|
+
AllHints: false,
|
|
1092
1443
|
Properties: ["WhenStarted", "TimeElapsed"]
|
|
1093
1444
|
},
|
|
1094
1445
|
ScopeOptions: {
|
|
1095
|
-
IncludeId:
|
|
1096
|
-
IncludeScope:
|
|
1097
|
-
IncludeScopeType:
|
|
1446
|
+
IncludeId: true,
|
|
1447
|
+
IncludeScope: true,
|
|
1448
|
+
IncludeScopeType: true
|
|
1098
1449
|
},
|
|
1099
1450
|
PropertyOptions: {
|
|
1100
|
-
IncludeName:
|
|
1101
|
-
IncludeRawValue:
|
|
1102
|
-
IncludeFormatted:
|
|
1103
|
-
IncludeMeasure:
|
|
1104
|
-
IncludeCreator:
|
|
1105
|
-
IncludeCreatorType:
|
|
1451
|
+
IncludeName: true,
|
|
1452
|
+
IncludeRawValue: true,
|
|
1453
|
+
IncludeFormatted: true,
|
|
1454
|
+
IncludeMeasure: true,
|
|
1455
|
+
IncludeCreator: false,
|
|
1456
|
+
IncludeCreatorType: false
|
|
1106
1457
|
}
|
|
1107
1458
|
}, "object", "WUDetails Request");
|
|
1108
1459
|
export {
|
|
@@ -1119,4 +1470,4 @@ export {
|
|
|
1119
1470
|
WUTimeline
|
|
1120
1471
|
};
|
|
1121
1472
|
//# sourceMappingURL=index.js.map
|
|
1122
|
-
|
|
1473
|
+
!function(){"use strict";try{if("undefined"!=typeof document){var e=document.createElement("style");e.appendChild(document.createTextNode(".eclwatch_WUGraphLegend .graph_Vertex{cursor:auto}.eclwatch_WUGraphLegend .graph_Vertex .common_Icon{cursor:pointer}.eclwatch_WUGraph .graph_Vertex{cursor:auto}.eclwatch_WUGraph .marker{fill:#656565;stroke:none;stroke-width:1px}.eclwatch_WUGraph .zoom{fill:none;pointer-events:all}.eclwatch_WUGraph .selectionBrush{fill:none;stroke:#a9a9a9}.d3-tip .eclwatch_WUGraph_Tooltip h3,.d3-tip .eclwatch_WUGraph_Tooltip h4{margin:0}.d3-tip .eclwatch_WUGraph_Tooltip table{border-collapse:separate;border-spacing:5px}.d3-tip .eclwatch_WUGraph_Tooltip table .key{font-weight:700}.d3-tip .eclwatch_WUGraph_Tooltip table .value{font-weight:400}")),document.head.appendChild(e)}}catch(t){console.error("vite-plugin-css-injected-by-js",t)}}();
|