Add ability to delete nodes in editor

src/app/pages/editor/editor.page.html

@@ -22,6 +22,12 @@
           style="display: flex;"
           *ngFor="let node of editorService.immutableNodes"
         >
+          <div class="host-icons">
+            <i class="type-icon norm fa" [ngClass]="typeIcons.norm" title="WYSIWYG Node"></i>
+            <button (click)="onOptionsClick($event, node)">
+              <i class="fa fa-ellipsis-v" title="Node options"></i>
+            </button>
+          </div>
           <ng-container *ngIf="node.isNorm()">
             <editor-norm style="flex: 1;" [nodeId]="node.UUID"></editor-norm>
           </ng-container>

src/app/pages/editor/editor.page.scss

@@ -6,6 +6,17 @@ ion-icon.invisible {
   opacity: 0;
 }
 
-.title-input {
-  
+.host-icons {
+  padding: 5px;
+  color: #444;
+  display: flex;
+  flex-direction: column;
+}
+
+.type-icon {
+  margin-bottom: 15px;
+
+  &.norm {
+    color: var(--noded-background-node);
+  }
 }

src/app/pages/editor/editor.page.ts

@@ -17,6 +17,15 @@ export class EditorPage implements OnInit {
   // @ViewChildren('editorHosts') editorHosts;
   // @ViewChild('titleBar') titleBar;
 
+  public typeIcons = {
+    branch: 'fa fa-folder',
+    node: 'fa fa-quote-left',
+    norm: 'fa fa-quote-left',
+    page: 'fa fa-sticky-note',
+    db: 'fa fa-database',
+    code: 'fa fa-code',
+  };
+
   @Input() pageId: string;
   public pageName = '';
 
@@ -24,6 +33,7 @@ export class EditorPage implements OnInit {
     protected route: ActivatedRoute,
     protected router: Router,
     protected loader: LoadingController,
+    protected popover: PopoverController,
     public readonly editorService: EditorService,
   ) {
     this.route.params.subscribe(params => {
@@ -47,6 +57,31 @@ export class EditorPage implements OnInit {
     this.editorService.save();
   }
 
+  async onOptionsClick(event: MouseEvent, node: HostRecord) {
+    if ( !this.editorService.canEdit() ) {
+      return;
+    }
+
+    const popover = await this.popover.create({
+      component: HostOptionsComponent,
+      event,
+      componentProps: {
+        editor: this,
+        index: this.editorService.immutableNodes.indexOf(node),
+        event,
+        hostRecord: node,
+      }
+    });
+
+    popover.onDidDismiss().then(result => {
+      if ( result.data === 'delete_node' ) {
+        this.editorService.deleteNode(node.UUID);
+      }
+    });
+
+    await popover.present();
+  }
+
   // buttonIsVisible(index) {
   //   return this.visibleButtons.includes(index);
   // }