Rework deletion

src/demo/app/editor.ts

@@ -94,6 +94,7 @@ export class Editor implements Flo.Editor {
       if (deletedElement instanceof joint.dia.Element) {
         this.repairDamage(context, <dia.Element> deletedElement);
       }
+      return true;
     }
 
     handleNodeDropping(context : Flo.EditorContext, dragDescriptor : Flo.DnDDescriptor) {

src/lib/editor/editor.component.ts

@@ -262,18 +262,14 @@ export class EditorComponent implements OnInit, OnDestroy {
 
       deleteSelectedNode(): void {
         if (self.selection) {
-          if (self.editor && self.editor.preDelete) {
-            self.editor.preDelete(self.editorContext, self.selection.model);
-          } else {
-            if (self.selection.model instanceof joint.dia.Element) {
-              self.graph.getConnectedLinks(self.selection.model).forEach((l: dia.Link) => l.remove());
-            }
-          }
-          self.selection.model.remove();
-          self.selection = undefined;
+          self.graph.trigger('startDeletion', self.selection.model);
         }
       }
 
+      delete(cell: dia.Cell) {
+        self.graph.trigger('startDeletion', cell);
+      }
+
       get textToGraphConversionObservable(): Observable<void> {
         return self.textToGraphConversionCompleted;
       }
@@ -317,6 +313,16 @@ export class EditorComponent implements OnInit, OnDestroy {
     this._disposables.dispose();
   }
 
+  private delete(cell: dia.Cell) {
+    if (this.editor && this.editor.preDelete) {
+      if (this.editor.preDelete(this.editorContext, this.selection.model)) {
+        cell.remove();
+      }
+    } else {
+      cell.remove();
+    }
+  }
+
   get noPalette(): boolean {
     return this._hiddenPalette;
   }
@@ -346,6 +352,10 @@ export class EditorComponent implements OnInit, OnDestroy {
   }
 
   createHandle(element: dia.CellView, kind: string, action: () => void, location: dia.Point): dia.Element {
+    if (!location) {
+      let bbox: any = (<any>element.model).getBBox();
+      location = bbox.origin().offset(bbox.width / 2, bbox.height / 2);
+    }
     let handle = Shapes.Factory.createHandle({
       renderer: this.renderer,
       paper: this.paper,
@@ -1120,6 +1130,8 @@ export class EditorComponent implements OnInit, OnDestroy {
     });
     // adjust vertices when a cell is removed or its source/target was changed
     this.graph.on('add remove change:source change:target change:vertices change:position', _.partial(Utils.fanRoute, this.graph));
+
+    this.graph.on('startDeletion', (cell: dia.Cell) => this.delete(cell));
   }
 
   initPaperListeners() {

src/lib/shared/flo-common.ts

@@ -150,6 +150,7 @@ export namespace Flo {
     createNode(metadata: ElementMetadata, props?: Map<string, any>, position?: dia.Point): dia.Element;
     createLink(source: LinkEnd, target: LinkEnd, metadata?: ElementMetadata, props?: Map<string, any>): dia.Link;
     deleteSelectedNode(): void;
+    delete(cell: dia.Cell): void;
     [propName: string]: any;
   }
 
@@ -204,7 +205,7 @@ export namespace Flo {
     showDragFeedback?(context: EditorContext, dragDescriptor: DnDDescriptor): void;
     hideDragFeedback?(context: EditorContext, dragDescriptor: DnDDescriptor): void;
     validate?(graph: dia.Graph, dsl: string, flo: EditorContext): Promise<Map<string | number, Array<Marker>>>;
-    preDelete?(context: EditorContext, deletedElement: dia.Cell): void;
+    preDelete?(context: EditorContext, deletedElement: dia.Cell): boolean;
     setDefaultContent?(editorContext: EditorContext, data: Map<string, Map<string, ElementMetadata>>): void;
   }
 

src/lib/shared/shapes.ts

@@ -687,6 +687,9 @@ export namespace Shapes {
       let graph = params.graph || (params.paper ? params.paper.model : undefined);
 
       let handle: dia.Element;
+      if (!location) {
+        location = {x: 0, y: 0};
+      }
       if (renderer && _.isFunction(renderer.createHandle)) {
         handle = renderer.createHandle(kind, parent);
       } else {
@@ -700,9 +703,7 @@ export namespace Shapes {
         });
       }
       handle.set('type', joint.shapes.flo.HANDLE_TYPE);
-      if (location) {
-        handle.set('position', location);
-      }
+      handle.set('position', location);
       if ((isChrome || isFF) && parent && typeof parent.get('z') === 'number') {
         handle.set('z', parent.get('z') + 1);
       }