Skip to content

Commit cbf0f4f

Browse files
algentyalgenty
committed
Mapping by callback
1 parent a46efe4 commit cbf0f4f

13 files changed

+381
-373
lines changed

‎spec/rule.test.ts

+1
Original file line numberDiff line numberDiff line change
@@ -122,6 +122,7 @@ describe('Rule', () => {
122122
let data, $gf, rule, pattern;
123123
beforeEach(() => {
124124
data = Rule.getDefaultData();
125+
$gf = $GF.create($scope, templateSrv, dashboard, ctrl);
125126
rule = new Rule($gf, '/.*/', data);
126127
pattern = '/.*Toto.*/';
127128
});

‎src/flowchart_class.ts

+10-10
Original file line numberDiff line numberDiff line change
@@ -789,17 +789,17 @@ export class Flowchart {
789789
return this.container;
790790
}
791791

792-
setMap() {
793-
if (this.xgraph) {
794-
this.xgraph.setMap();
795-
}
796-
}
792+
// setMap() {
793+
// if (this.xgraph) {
794+
// this.xgraph.setMap();
795+
// }
796+
// }
797797

798-
unsetMap() {
799-
if (this.xgraph) {
800-
this.xgraph.unsetMap();
801-
}
802-
}
798+
// unsetMap() {
799+
// if (this.xgraph) {
800+
// this.xgraph.unsetMap();
801+
// }
802+
// }
803803

804804
toFront(forceRefresh = false): this {
805805
this.visible = true;

‎src/flowchart_ctrl.ts

+87-73
Original file line numberDiff line numberDiff line change
@@ -10,11 +10,11 @@ import { MetricHandler } from 'metric_handler';
1010
import { $GF, GFTimer, GFLog, GFPlugin, GFCONSTANT } from 'globals_class';
1111
import grafana from 'grafana_func';
1212
import { defaults as _defaults, cloneDeep as _cloneDeep } from 'lodash';
13-
import { InteractiveMap } from 'mapping_class';
13+
// import { InteractiveMap } from 'mapping_class';
1414
import { GFDrawio } from 'drawio_base';
1515

1616
// Debug
17-
const DEBUG = false;
17+
const DEBUG = true;
1818
const _log = (...args: any) => {
1919
DEBUG && console.log(...args);
2020
};
@@ -40,7 +40,7 @@ class FlowchartCtrl extends MetricsPanelCtrl {
4040
rulesHandler: RulesHandler | undefined;
4141
flowchartHandler: FlowchartHandler | undefined;
4242
metricHandler: MetricHandler | undefined;
43-
onMapping: InteractiveMap;
43+
onMapping = false;
4444
uid: string = $GF.genUid(this.constructor.name);
4545
graphHoverTimer: GFTimer | undefined = undefined;
4646
mouseIn = false;
@@ -69,7 +69,7 @@ class FlowchartCtrl extends MetricsPanelCtrl {
6969
this.changedSource = true;
7070
this.changedData = true;
7171
this.changedOptions = true;
72-
this.onMapping = new InteractiveMap();
72+
// this.onMapping = new InteractiveMap();
7373
this.parentDiv = document.createElement('div');
7474
this.flowchartsDiv = document.createElement('div');
7575
// this.uid = $GF.genUid();
@@ -129,11 +129,15 @@ class FlowchartCtrl extends MetricsPanelCtrl {
129129
this.$gf.events.connect('debug_asked', this, this._on_global_debug_asked.bind(this));
130130
this.$gf.events.connect('panel_closed', this, this._on_global_panel_closed.bind(this));
131131
this.$gf.events.connect('editmode_closed', this, this._on_global_editmode_closed.bind(this));
132+
this.$gf.events.connect('mapping_enabled', this, this._on_global_mapping_enabled.bind(this));
133+
this.$gf.events.connect('mapping_disabled', this, this._on_global_mapping_disabled.bind(this));
132134
}
133135

134136
_eventsDisconnect() {
135137
this.$gf.events.disconnect('debug_asked', this);
136138
this.$gf.events.disconnect('panel_closed', this);
139+
this.$gf.events.disconnect('mapping_enabled', this);
140+
this.$gf.events.disconnect('mapping_disabled', this);
137141
}
138142

139143
init_handlers() {
@@ -218,6 +222,75 @@ class FlowchartCtrl extends MetricsPanelCtrl {
218222
return false;
219223
}
220224

225+
link(scope: any, elem: any, attrs: any, ctrl: any) {
226+
this.$panelElem = elem;
227+
const $section = this.$panelElem.find('#flowcharting-section');
228+
this.parentDiv = $section[0];
229+
const $flowchartsDiv = $section.find('#flowcharting-panel-content');
230+
this.flowchartsDiv = $flowchartsDiv[0];
231+
// this.onMapping.setContainer(this.flowchartsDiv);
232+
this.notify('Initialisation MXGRAPH/DRAW.IO Libs');
233+
234+
// MxGraph Init
235+
this.notify('Load configuration');
236+
if (this.panel.gf_isEdited) {
237+
delete this.panel.gf_isEdited;
238+
}
239+
GFDrawio.init();
240+
this.init_ctrl();
241+
if (this.panel.version !== GFPlugin.getVersion()) {
242+
//TODO : Reactive this
243+
// this.notify(
244+
// `The plugin version has changed, save the dashboard to optimize loading : ${
245+
// this.panel.version
246+
// } <> ${$GF.plugin.getVersion()}`
247+
// );
248+
}
249+
this.clearNotify();
250+
this.panel.version = this.version;
251+
// Open is edit mode
252+
if (this.panel.isEditing === true) {
253+
this.panel.gf_isEdited = true;
254+
}
255+
}
256+
257+
isMouseInPanel(): boolean {
258+
return this.mouseIn;
259+
}
260+
261+
displayMultiCursor(): boolean {
262+
if (this.flowchartHandler) {
263+
return this.flowchartHandler.isMultiFlowcharts();
264+
}
265+
return false;
266+
}
267+
268+
displayFirstCursor(): boolean {
269+
if (this.flowchartHandler) {
270+
return !this.flowchartHandler.isCurrentfirst();
271+
}
272+
return false;
273+
}
274+
275+
displayLastCursor(): boolean {
276+
if (this.flowchartHandler) {
277+
return !this.flowchartHandler.isCurrentLast();
278+
}
279+
return false;
280+
}
281+
282+
displayNextFlowchart() {
283+
if (this.flowchartHandler) {
284+
this.flowchartHandler.setNextFlowchart();
285+
}
286+
}
287+
288+
displayPreviousFlowchart() {
289+
if (this.flowchartHandler) {
290+
this.flowchartHandler.setPreviousFlowchart();
291+
}
292+
}
293+
221294
//###########################################################################
222295
//### EVENTS
223296
//###########################################################################
@@ -314,79 +387,20 @@ class FlowchartCtrl extends MetricsPanelCtrl {
314387
return;
315388
}
316389

317-
link(scope: any, elem: any, attrs: any, ctrl: any) {
318-
this.$panelElem = elem;
319-
const $section = this.$panelElem.find('#flowcharting-section');
320-
this.parentDiv = $section[0];
321-
const $flowchartsDiv = $section.find('#flowcharting-panel-content');
322-
this.flowchartsDiv = $flowchartsDiv[0];
323-
this.onMapping.setContainer(this.flowchartsDiv);
324-
this.notify('Initialisation MXGRAPH/DRAW.IO Libs');
325-
326-
// MxGraph Init
327-
this.notify('Load configuration');
328-
if (this.panel.gf_isEdited) {
329-
delete this.panel.gf_isEdited;
330-
}
331-
GFDrawio.init();
332-
this.init_ctrl();
333-
if (this.panel.version !== GFPlugin.getVersion()) {
334-
//TODO : Reactive this
335-
// this.notify(
336-
// `The plugin version has changed, save the dashboard to optimize loading : ${
337-
// this.panel.version
338-
// } <> ${$GF.plugin.getVersion()}`
339-
// );
340-
}
341-
this.clearNotify();
342-
this.panel.version = this.version;
343-
// Open is edit mode
344-
if (this.panel.isEditing === true) {
345-
this.panel.gf_isEdited = true;
346-
}
347-
}
348-
349-
isMouseInPanel(): boolean {
350-
return this.mouseIn;
351-
}
352-
353-
displayMultiCursor(): boolean {
354-
if (this.flowchartHandler) {
355-
return this.flowchartHandler.isMultiFlowcharts();
356-
}
357-
return false;
390+
private _on_global_mapping_enabled() {
391+
_log('📬', this.constructor.name, this.uid, '_on_global_mapping_enabled');
392+
this.onMapping = true;
393+
this.flowchartsDiv.style.cursor = `url("${GFPlugin.getStaticPath()}cursor-marker.svg") 8 16, crosshair`;
394+
this.flowchartsDiv.scrollIntoView();
395+
this.flowchartsDiv.focus();
358396
}
359397

360-
displayFirstCursor(): boolean {
361-
if (this.flowchartHandler) {
362-
return !this.flowchartHandler.isCurrentfirst();
363-
}
364-
return false;
398+
private _on_global_mapping_disabled() {
399+
_log('📬', this.constructor.name, this.uid, '_on_global_mapping_disabled');
400+
this.onMapping = false;
401+
this.flowchartsDiv.style.cursor = 'auto';
365402
}
366403

367-
displayLastCursor(): boolean {
368-
if (this.flowchartHandler) {
369-
return !this.flowchartHandler.isCurrentLast();
370-
}
371-
return false;
372-
}
373-
374-
displayNextFlowchart() {
375-
if (this.flowchartHandler) {
376-
this.flowchartHandler.setNextFlowchart();
377-
}
378-
}
379-
380-
displayPreviousFlowchart() {
381-
if (this.flowchartHandler) {
382-
this.flowchartHandler.setPreviousFlowchart();
383-
}
384-
}
385-
386-
//
387-
// EVENTS
388-
//
389-
390404
$onDestroy() {
391405
// $GF.destroy();
392406
GFTimer.stop();

‎src/flowchart_handler.ts

+24-24
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
import { Flowchart } from 'flowchart_class';
22
import { $GF, GFCONSTANT } from 'globals_class';
3-
import { InteractiveMap, ObjectMap } from 'mapping_class';
3+
// import { InteractiveMap, ObjectMap } from 'mapping_class';
44
import { GFEvents } from 'flowcharting_base';
55

66
// Debug
@@ -29,7 +29,7 @@ export class FlowchartHandler {
2929
sequenceNumber = 0; // Sequence Number for a name
3030
static defaultXml: string; // Default XML
3131
static defaultCsv: string; // Default CSV
32-
onMapping: InteractiveMap; // For link mapping, sharing
32+
// onMapping: ; // For link mapping, sharing
3333
mousedownTimeout = 0;
3434
mousedown = 0;
3535
onEdit = false; // editor open or not
@@ -54,7 +54,7 @@ export class FlowchartHandler {
5454
this.data = data;
5555
this.currentFlowchartName = 'Main';
5656
// TODO : Fix onMapping
57-
this.onMapping = this.$gf.ctrl.onMapping;
57+
// this.onMapping = this.$gf.ctrl.onMapping;
5858

5959
// Events Render
6060
// this.ctrl.events.on('render', () => {
@@ -508,31 +508,31 @@ export class FlowchartHandler {
508508
* @param {Object} objToMap
509509
* @memberof FlowchartHandler
510510
*/
511-
setMap(objToMap: ObjectMap, options: gf.TRuleMapOptions): this {
512-
const flowchart = this.getFlowchart(this.currentFlowchartName);
513-
this.onMapping.setMap(objToMap).setOptions(options).setFocus(objToMap.uid);
514-
flowchart.setMap();
515-
return this;
516-
}
511+
// setMap(objToMap: ObjectMap, options: gf.TRuleMapOptions): this {
512+
// const flowchart = this.getFlowchart(this.currentFlowchartName);
513+
// this.onMapping.setMap(objToMap).setOptions(options).setFocus(objToMap.uid);
514+
// flowchart.setMap();
515+
// return this;
516+
// }
517517

518-
setMaps(fn: CallableFunction): this {
519-
const flowchart = this.getFlowchart(this.currentFlowchartName);
520-
this.onMapping.callback = fn;
521-
flowchart.setMap();
522-
return this;
523-
}
518+
// setMaps(fn: CallableFunction): this {
519+
// const flowchart = this.getFlowchart(this.currentFlowchartName);
520+
// this.onMapping.callback = fn;
521+
// flowchart.setMap();
522+
// return this;
523+
// }
524524

525525
/**
526526
* Desactivate option
527527
*
528528
* @memberof FlowchartHandler
529529
*/
530-
unsetMap(): this {
531-
const flowchart = this.getFlowchart(this.currentFlowchartName);
532-
flowchart.unsetMap();
533-
this.onMapping.close();
534-
return this;
535-
}
530+
// unsetMap(): this {
531+
// const flowchart = this.getFlowchart(this.currentFlowchartName);
532+
// flowchart.unsetMap();
533+
// this.onMapping.close();
534+
// return this;
535+
// }
536536

537537
/**
538538
* Return true if mapping object is active
@@ -541,9 +541,9 @@ export class FlowchartHandler {
541541
* @returns true - true if mapping mode
542542
* @memberof FlowchartHandler
543543
*/
544-
isMapping(): boolean {
545-
return this.onMapping.isActive();
546-
}
544+
// isMapping(): boolean {
545+
// return this.onMapping.isActive();
546+
// }
547547

548548
/**
549549
* Wait for draw.io answer

0 commit comments

Comments
 (0)