Skip to content
This repository was archived by the owner on May 14, 2025. It is now read-only.

Commit 26cf80a

Browse files
BoykoAlexjvalkeal
BoykoAlex
authored and
jvalkeal
committed
Adopt EditorContext parameter. Switch to boolean. Handle some TODOs
- Fixes #391
1 parent d927426 commit 26cf80a

File tree

6 files changed

+73
-115
lines changed

6 files changed

+73
-115
lines changed

‎ui/package.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -37,7 +37,7 @@
3737
"pui-css-variables-and-mixins": "^8.1.0",
3838
"rxjs": "^5.4.2",
3939
"sockjs-client": "^1.1.4",
40-
"spring-flo": "git://github.com/spring-projects/spring-flo.git#a89903ceeac1af306efa3ece10ddeff5f6d616bf",
40+
"spring-flo": "git://github.com/spring-projects/spring-flo.git#b4e20eb9cd31764e2f96b178d03500c7d7d6628f",
4141
"stompjs": "^2.3.3",
4242
"tixif-ngx-busy": "0.0.5",
4343
"zone.js": "^0.8.14"

‎ui/src/app/streams/flo/graph-to-text.spec.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -98,7 +98,7 @@ describe('graph-to-text', () => {
9898
target: {'id': to.id, 'port': 'input', 'selector': '.input-port'}
9999
};
100100
const link = Shapes.Factory.createLink(linkParams);
101-
link.attr('props/isTapLink', isTapLink ? 'true' : 'false');
101+
link.attr('props/isTapLink', isTapLink ? true : false);
102102
graph.addCell(link);
103103
return link;
104104
}

‎ui/src/app/streams/flo/graph-to-text.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -102,7 +102,7 @@ class GraphToTextConverter {
102102
}
103103

104104
private isTapLink(link): boolean {
105-
return link.attr('props/isTapLink') === 'true';
105+
return link.attr('props/isTapLink');
106106
}
107107

108108
private printStream(stream): void {

‎ui/src/app/streams/flo/render.service.ts

Lines changed: 68 additions & 110 deletions
Original file line numberDiff line numberDiff line change
@@ -256,18 +256,7 @@ export class RenderService implements Flo.Renderer {
256256

257257
initializeNewLink(link: dia.Link, viewerDescriptor: Flo.ViewerDescriptor) {
258258
link.set('smooth', true);
259-
link.attr('metadata/metadata/unselectable', 'true');
260-
// var isTapLink = link.attr('props/isTapLink');
261-
// if (isTapLink === 'true') {
262-
// var linkView = paperAndGraph.paper.findViewByModel(link);
263-
// _.each(linkView.el.querySelectorAll('.connection, .marker-source, .marker-target'), function(connection) {
264-
// joint.V(connection).addClass('tapped-output-from-app');
265-
// });
266-
// }
267-
// TODO remove this on link delete !!
268-
// paperAndGraph.paper.findViewByModel(link).on('switch',function() {
269-
// handleLinkEvent(paperAndGraph.paper, 'switch', link);
270-
// });
259+
link.attr('metadata/metadata/unselectable', true);
271260
}
272261

273262
isSemanticProperty(propertyPath: string): boolean {
@@ -312,9 +301,9 @@ export class RenderService implements Flo.Renderer {
312301
if (changedPropertyPath === 'props/isTapLink') {
313302
const isTapLink = link.attr('props/isTapLink');
314303
const linkView = paper.findViewByModel(link);
315-
console.log('Adjusting link class isTapLink?' + isTapLink);
304+
console.log('Adjusting link class isTapLink? ' + isTapLink);
316305
// TODO: Check if need to switch bacl to _.each(...)
317-
if (isTapLink === 'true') {
306+
if (isTapLink) {
318307
linkView.el.querySelectorAll('.connection, .marker-source, .marker-target')
319308
.forEach(connection => joint.V(connection).addClass('tapped-output-from-app'));
320309
} else {
@@ -356,15 +345,25 @@ export class RenderService implements Flo.Renderer {
356345
return Promise.resolve(layout(paper));
357346
}
358347

359-
handleLinkSourceChanged(link: dia.Link, paper: dia.Paper) {
360-
const graph = paper.model;
348+
handleLinkSourceChanged(link: dia.Link, flo: Flo.EditorContext) {
349+
const graph = flo.getGraph();
361350
const newSourceId = link.get('source').id;
362351
const oldSourceId = link.previous('source').id;
363352
const targetId = link.get('target').id;
364353
if (newSourceId !== oldSourceId) {
365354
const newSource = graph.getCell(newSourceId);
366355
const oldSource = graph.getCell(oldSourceId);
367356
const target = graph.getCell(targetId);
357+
358+
// If reconnecting source anchor to a shape with existing primary link switch the link to tap link
359+
if (newSource) {
360+
const outgoingLinks = graph.getConnectedLinks(newSource, {outbound: true});
361+
const primaryLink = outgoingLinks.find(ol => ol !== link && !ol.attr('props/isTapLink'));
362+
363+
link.attr('props/isTapLink', primaryLink ? true : false);
364+
this.refreshVisuals(link, 'props/isTapLink', flo.getPaper());
365+
}
366+
368367
// Show input port for 'destination' if outgoing links are gone
369368
if (oldSource && oldSource.attr('metadata/name') === 'destination'
370369
/*&& graph.getConnectedLinks(oldSource, {outbound: true}).length === 0*/) {
@@ -385,20 +384,19 @@ export class RenderService implements Flo.Renderer {
385384
}
386385

387386
// If tap link has been reconnected update the stream-label for the target if necessary
388-
// TODO: Isn't tap port removed?
389387
if (target) {
390-
if (link.previous('source').port === 'tap') {
388+
if (link.attr('props/isTapLink')) {
391389
target.attr('.stream-label/display', 'none');
392390
}
393-
if (link.get('source').port === 'tap') {
391+
if (link.attr('props/isTapLink')) {
394392
target.attr('.stream-label/display', 'block');
395393
}
396394
}
397395
}
398396
}
399397

400-
handleLinkTargetChanged(link: dia.Link, paper: dia.Paper) {
401-
const graph = paper.model;
398+
handleLinkTargetChanged(link: dia.Link, flo: Flo.EditorContext) {
399+
const graph = flo.getGraph();
402400
const newTargetId = link.get('target').id;
403401
const oldTargetId = link.previous('target').id;
404402
if (newTargetId !== oldTargetId) {
@@ -428,8 +426,7 @@ export class RenderService implements Flo.Renderer {
428426
}
429427

430428
// If tap link has been reconnected update the stream-label for the new target and old target
431-
// TODO: Isn't tap port removed?
432-
if (link.get('source').port === 'tap') {
429+
if (link.attr('props/isTapLink')) {
433430
if (oldTarget) {
434431
oldTarget.attr('.stream-label/display', 'none');
435432
}
@@ -441,8 +438,8 @@ export class RenderService implements Flo.Renderer {
441438
}
442439
}
443440

444-
handleLinkRemoved(link: dia.Link, paper: dia.Paper) {
445-
const graph = paper.model;
441+
handleLinkRemoved(link: dia.Link, flo: Flo.EditorContext) {
442+
const graph = flo.getGraph();
446443
const source = graph.getCell(link.get('source').id);
447444
const target = graph.getCell(link.get('target').id);
448445
let view: dia.CellView;
@@ -452,7 +449,7 @@ export class RenderService implements Flo.Renderer {
452449
// Set silently, last attr call would refresh the view
453450
(<any>source).attr('.stream-label/display', 'none', {silent: true});
454451
source.removeAttr('.input-port/display');
455-
view = paper.findViewByModel(source);
452+
view = flo.getPaper().findViewByModel(source);
456453
if (view) {
457454
(<any>view).update();
458455
}
@@ -463,14 +460,13 @@ export class RenderService implements Flo.Renderer {
463460
// Set silently, last attr call would refresh the view
464461
(<any>target).attr('.stream-label/display', 'none', {silent: true});
465462
target.removeAttr('.output-port/display');
466-
view = paper.findViewByModel(target);
463+
view = flo.getPaper().findViewByModel(target);
467464
if (view) {
468465
(<any>view).update();
469466
}
470467
}
471468
// If tap link is removed update stream-name value for the target, i.e. don't display stream anymore
472-
// TODO: Isn't tap port removed?
473-
if (link.get('source').port === 'tap' && target) {
469+
if (link.attr('props/isTapLink') && target) {
474470
target.attr('.stream-label/display', 'none');
475471
}
476472
}
@@ -481,115 +477,78 @@ export class RenderService implements Flo.Renderer {
481477
return `${source ? source.attr('metadata/name') : '?'} -> ${target ? target.attr('metadata/name') : '?'}`;
482478
}
483479

484-
// TODO: Rewrite this! Should be creating elements on the graph manually!
485480
// Should pass use Flo.EditorContext and pass metadata, props etc.
486-
handleLinkInsertChannel(link: dia.Link, paper: dia.Paper) {
487-
const graph = paper.model;
481+
handleLinkInsertChannel(link: dia.Link, flo: Flo.EditorContext) {
482+
const graph = flo.getGraph();
488483
const source = graph.getCell(link.get('source').id);
489484
const target = graph.getCell(link.get('target').id);
490485
// Create a node
491486
this.metamodelService.load().then(mm => {
492-
const metadata = Flo.getMetadata(mm, 'destination', 'other');
493-
const newDestinationNode = new joint.shapes.flo.Destination(
494-
joint.util.deepSupplement({
495-
attrs: {
496-
'.box': {
497-
'fill': '#eeeeff',
498-
'stroke': '#0000ff'
499-
},
500-
'.label1': {
501-
'text': metadata.name
502-
},
503-
'.label2': {
504-
'text': metadata.metadata.unicodeChar
505-
}
506-
}
507-
}, joint.shapes.flo.Destination.prototype.defaults)
508-
);
509487

510488
let sourceName = source.attr('metadata/name');
511489
if (sourceName === 'destination') {
512-
sourceName = source.attr('props/name');
490+
sourceName = source.attr('props/name');
513491
}
514492
let targetName = target.attr('metadata/name');
515493
if (targetName === 'destination') {
516-
targetName = target.attr('props/name');
494+
targetName = target.attr('props/name');
517495
}
518496

519-
newDestinationNode.set('type', joint.shapes.flo.NODE_TYPE);
520-
newDestinationNode.attr('props', {'name': sourceName + '-' + targetName});
521-
newDestinationNode.attr('metadata', metadata);
522-
graph.addCell(newDestinationNode);
523-
const nodeView = paper.findViewByModel(newDestinationNode);
524-
this.initializeNewNode(<dia.Element>nodeView.model, {'paper': paper, 'graph': graph});
497+
const newDestinationNode = flo.createNode(Flo.getMetadata(mm, 'destination', 'other'),
498+
new Map<string, any>().set('name', sourceName + '-' + targetName));
525499

526500
// Adjust existing link to hit this channel
527501
const previousSource = link.get('source');
528-
const existingIsTap = (link.attr('props/isTapLink') === 'true');
529-
link.set('source', {'id': newDestinationNode.id, 'port': 'output', 'selector': '.output-port'});
502+
const existingIsTap = link.attr('props/isTapLink');
503+
link.set('source', {
504+
id: newDestinationNode.id,
505+
port: 'output',
506+
selector: '.output-port'
507+
});
530508

531509
// New link to connect original source to new target
532-
const newlink = this.createLink(null, null);
533-
newlink.set('target', {'id': newDestinationNode.id, 'port': 'input', 'selector': '.input-port'});
534-
newlink.set('source', previousSource);
535-
newlink.set('type', joint.shapes.flo.LINK_TYPE);
536-
newlink.attr('metadata', {});
537-
graph.addCell(newlink);
538-
newlink.attr('.marker-vertices/display', 'none');
539-
newlink.attr('props/isTapLink', existingIsTap ? 'true' : 'false');
540-
this.initializeNewLink(newlink, {'paper': paper, 'graph': graph});
541-
this.layout(paper);
510+
flo.createLink(previousSource,
511+
{'id': newDestinationNode.id, 'port': 'input', 'selector': '.input-port'},
512+
null,
513+
new Map<string, any>().set('isTapLink', existingIsTap ? true : false));
514+
515+
flo.performLayout();
542516
});
543517
}
544518

545-
handleLinkSwitch(link: dia.Link, paper: dia.Paper) {
546-
const graph = paper.model;
519+
handleLinkSwitch(link: dia.Link, flo: Flo.EditorContext) {
520+
const graph = flo.getGraph();
547521
const source = graph.getCell(link.get('source').id);
548522
// var target = graph.getCell(link.get('target').id);
549-
const isTapLink = (link.attr('props/isTapLink') === 'true');
523+
const isTapLink = link.attr('props/isTapLink');
550524
if (isTapLink) {
551525
console.log(`Converting link ${this.toLinkString(graph, link)} into a primary link`);
552-
link.attr('props/isTapLink', 'false');
526+
link.attr('props/isTapLink', false);
553527
// Need to ensure no other links are still primary, that isn't allowed
554528
const primaryLink = graph.getConnectedLinks(source, {outbound: true})
555-
.find(l => l !== link && l.attr('props/isTapLink') !== 'true');
529+
.find(l => l !== link && l.attr('props/isTapLink'));
556530
if (primaryLink) {
557-
primaryLink.attr('props/isTapLink', 'true');
558-
this.refreshVisuals(primaryLink, 'props/isTapLink', paper);
531+
primaryLink.attr('props/isTapLink', true);
532+
this.refreshVisuals(primaryLink, 'props/isTapLink', flo.getPaper());
559533
}
560534
} else {
561535
console.log(`Converting link ${this.toLinkString(graph, link)} into a tap link`);
562-
link.attr('props/isTapLink', 'true');
536+
link.attr('props/isTapLink', true);
563537
}
564-
this.refreshVisuals(link, 'props/isTapLink', paper);
565-
// if (source) {
566-
// var outputLinks = graph.getConnectedLinks(source, {outbound: true});
567-
// var isPrimaryLink = true;
568-
// for (var i=0;i<outputLinks.length;i++) {
569-
// var ol = outputLinks[i];
570-
// if (ol === link || (ol.attr('props/isTapLink')==='true')) {
571-
// continue;
572-
// }
573-
// isPrimaryLink = false;
574-
// break;
575-
// }
576-
// console.log("marking primary? "+isPrimaryLink);
577-
// link.attr('props/isTapLink',isPrimaryLink?'false':'true');
578-
// refreshVisuals(link, 'props/isTapLink', paper);
579-
// }
538+
this.refreshVisuals(link, 'props/isTapLink', flo.getPaper());
580539
}
581540

582-
handleLinkAdded(link: dia.Link, paper: dia.Paper) {
583-
const graph = paper.model;
541+
handleLinkAdded(link: dia.Link, flo: Flo.EditorContext) {
542+
const graph = flo.getGraph();
584543
const source = graph.getCell(link.get('source').id);
585544
const target = graph.getCell(link.get('target').id);
586545
console.log('render-service.handleLinkAdded');
587546
if (source) {
588-
const nonPrimaryLink = graph.getConnectedLinks(source, {outbound: true})
589-
.find(ol => ol !== link && ol.attr('props/isTapLink') !== 'true');
547+
const outgoingLinks = graph.getConnectedLinks(source, {outbound: true});
548+
const primaryLink = outgoingLinks.find(ol => ol !== link && !ol.attr('props/isTapLink'));
590549

591-
link.attr('props/isTapLink', nonPrimaryLink ? 'true' : 'false');
592-
this.refreshVisuals(link, 'props/isTapLink', paper);
550+
link.attr('props/isTapLink', primaryLink ? true : false);
551+
this.refreshVisuals(link, 'props/isTapLink', flo.getPaper());
593552
}
594553
if (source && source.attr('metadata/name') === 'destination' && target) {
595554
// A link is added from a source destination to a target. In these cases the
@@ -605,27 +564,26 @@ export class RenderService implements Flo.Renderer {
605564
// XXX target.attr('.output-port/display', 'none');
606565
}
607566
// If tap link has been added update the stream-label for the target
608-
// TODO: Tap port? Isn't it removed?
609-
if (link.get('source').port === 'tap' && target) {
567+
if (link.attr('props/isTapLink') && target) {
610568
target.attr('.stream-label/display', 'block');
611569
}
612570
}
613571

614-
handleLinkEvent(paper: dia.Paper, event: string, link: dia.Link) {
572+
handleLinkEvent(flo: Flo.EditorContext, event: string, link: dia.Link) {
615573
if (event === 'change:source') {
616-
this.handleLinkSourceChanged(link, paper);
574+
this.handleLinkSourceChanged(link, flo);
617575
} else if (event === 'change:target') {
618-
this.handleLinkTargetChanged(link, paper);
576+
this.handleLinkTargetChanged(link, flo);
619577
} else if (event === 'remove') {
620-
this.handleLinkRemoved(link, paper);
578+
this.handleLinkRemoved(link, flo);
621579
} else if (event === 'add') {
622-
this.handleLinkAdded(link, paper);
623-
paper.findViewByModel(link).on('switch', () => this.handleLinkEvent(paper, 'switch', link));
624-
paper.findViewByModel(link).on('insert-channel', () => this.handleLinkEvent(paper, 'insert-channel', link));
580+
this.handleLinkAdded(link, flo);
581+
flo.getPaper().findViewByModel(link).on('switch', () => this.handleLinkEvent(flo, 'switch', link));
582+
flo.getPaper().findViewByModel(link).on('insert-channel', () => this.handleLinkEvent(flo, 'insert-channel', link));
625583
} else if (event === 'switch') {
626-
this.handleLinkSwitch(link, paper);
584+
this.handleLinkSwitch(link, flo);
627585
} else if (event === 'insert-channel') {
628-
this.handleLinkInsertChannel(link, paper);
586+
this.handleLinkInsertChannel(link, flo);
629587
}
630588
}
631589

‎ui/src/app/streams/flo/utils.spec.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -71,7 +71,7 @@ describe('utils', () => {
7171
},
7272
renderer: RENDER_SERVICE,
7373
graph: graph,
74-
props: new Map<string, any>().set('isTapLink', 'true')
74+
props: new Map<string, any>().set('isTapLink', true)
7575
});
7676
expect(Utils.canBeHeadOfStream(graph, transform)).toEqual(true);
7777
link.remove();

‎ui/src/app/streams/flo/utils.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -29,7 +29,7 @@ export class Utils {
2929
return true;
3030
} else {
3131
const incoming = graph.getConnectedLinks(element, { inbound: true });
32-
const tapLink = incoming.find(l => l.attr('props/isTapLink') === 'true');
32+
const tapLink = incoming.find(l => l.attr('props/isTapLink'));
3333
if (tapLink) {
3434
return true;
3535
}

0 commit comments

Comments
 (0)