Open ScriptAccount from ContextMenu for adding

app/main.ts

@@ -70,7 +70,10 @@ function createWindow(): BrowserWindow {
 
     },
     {
-      label: 'Edit...'
+      label: 'Edit...',
+      click: () => {
+        win!.webContents.send('context-menu', "edit");
+      }
     },
     {
       label: 'Delete...'

src/app/app.component.html

@@ -19,7 +19,7 @@
           <button mat-menu-item (click)="openScriptAccountsOverview()">{{ModelComponentTypeUtillities.toString(ModelComponentType.SCRIPTACCOUNT)}}</button>
         </mat-menu>
       </div>
-      <app-script-account-overview [gameModel]="gameModel" (onOpenScriptAccount)="openModelComponent($event)"></app-script-account-overview>
+      <app-script-account-overview #scriptAccountOverview [gameModel]="gameModel" (onOpenScriptAccount)="openModelComponent($event)"></app-script-account-overview>
     </mat-drawer>
 
     <div class="example-sidenav-content">

src/app/app.component.ts

@@ -1,13 +1,15 @@
-import {Component, OnInit, ViewChild} from '@angular/core';
+import {Component, NgZone, OnInit, ViewChild} from '@angular/core';
 import {ElectronService} from './core/services';
 import {APP_CONFIG} from '../environments/environment';
 import {ModelComponentType} from "./game-model/ModelComponentType";
 import {MatDrawerContainer} from "@angular/material/sidenav";
 import {ModelComponentTypeUtillities} from "./game-model/ModelComponentTypeUtillities";
 import {GameModel} from "./game-model/GameModel";
-import {ScriptAccount} from "./game-model/scriptAccounts/ScriptAccount";
 import {EditorComponent} from "./editor/editor.component";
 import {ModelComponent} from "./game-model/ModelComponent";
+import {
+  ScriptAccountOverviewComponent
+} from "./side-overviews/script-account-overview/script-account-overview.component";
 
 @Component({
   selector: 'app-root',
@@ -19,11 +21,12 @@ export class AppComponent implements OnInit{
   openContent : ModelComponentType | undefined = undefined;
   @ViewChild('drawer') drawer: MatDrawerContainer|undefined
   @ViewChild('editor') editor: EditorComponent|undefined
+  @ViewChild('scriptAccountOverview') scriptAccountOverview: ScriptAccountOverviewComponent | undefined
 
   gameModel: GameModel | undefined
 
-  constructor(
+  constructor(private electronService: ElectronService,
-    private electronService: ElectronService,
+              private zone: NgZone
   ) {
     console.log('APP_CONFIG', APP_CONFIG);
 
@@ -32,6 +35,17 @@ export class AppComponent implements OnInit{
       console.log('Run in electron');
       console.log('Electron ipcRenderer', this.electronService.ipcRenderer);
       console.log('NodeJS childProcess', this.electronService.childProcess);
+
+      electronService.ipcRenderer.on('context-menu', (event: any, message: string) => {
+        this.zone.run(() => {
+          if(message == "edit") {
+            console.log("Edit!")
+            if(this.openContent == ModelComponentType.SCRIPTACCOUNT && this.scriptAccountOverview != undefined && this.scriptAccountOverview.selectedScriptAccount != undefined) {
+              this.editor!.openGameModelComponent(this.scriptAccountOverview.selectedScriptAccount!);
+            }
+          }
+        })
+      })
     } else {
       console.log('Run in browser');
     }

src/app/side-overviews/script-account-overview/script-account-overview.component.css

@@ -8,3 +8,7 @@
   color: #ccffff;
   align-content: baseline;
 }
+
+.selected-item {
+  background-color: #8696b6;
+}

src/app/side-overviews/script-account-overview/script-account-overview.component.html

@@ -1,6 +1,8 @@
 <mat-action-list>
   <mat-list-item class="scriptAccount-item" *ngFor="let scriptAccount of gameModel!.scriptAccounts"
-                 (dblclick)="onOpenScriptAccount(scriptAccount)">
+                 (dblclick)="onOpenScriptAccount(scriptAccount)" (click)="selectScriptAccount(scriptAccount)"
+                  [ngClass]="selectedScriptAccount === scriptAccount ?'selected-item':''"
+                  (contextmenu)="selectScriptAccount(scriptAccount)">
     <mat-icon class="scriptAccount-icon">inventory_2</mat-icon>{{scriptAccount.componentName}}
   </mat-list-item>
 </mat-action-list>

src/app/side-overviews/script-account-overview/script-account-overview.component.spec.ts

@@ -40,8 +40,6 @@ describe('ScriptAccountOverview', () => {
     component.onCreateNewScriptAccount();
     fixture.detectChanges()
     expect(component.openScriptAccountEmitter.emit).toBeCalledTimes(1);
-
-
   }))
 
 

src/app/side-overviews/script-account-overview/script-account-overview.component.ts

@@ -12,6 +12,8 @@ export class ScriptAccountOverviewComponent {
   @Input("gameModel") gameModel: GameModel | undefined
   @Output("onOpenScriptAccount") openScriptAccountEmitter: EventEmitter<ScriptAccount> = new EventEmitter<ScriptAccount>();
 
+  selectedScriptAccount: ScriptAccount | undefined
+
   constructor(private electronService: ElectronService,
               private zone: NgZone) {
     if(electronService.isElectron) {
@@ -36,4 +38,9 @@ export class ScriptAccountOverviewComponent {
       this.openScriptAccountEmitter.emit(scriptAccount);
     }
   }
+
+
+  selectScriptAccount(scriptAccount: ScriptAccount) {
+    this.selectedScriptAccount = scriptAccount;
+  }
 }