From: Bill Erickson <berickxx@gmail.com>
Date: Fri, 22 Nov 2019 20:24:59 +0000 (-0500)
Subject: LPXXX editor continued
X-Git-Url: https://old-git.evergreen-ils.org/?a=commitdiff_plain;h=3dd9fa8a642c9b42fcdeeba40dfd50fdc4b33f4c;p=working%2FEvergreen.git

LPXXX editor continued

Signed-off-by: Bill Erickson <berickxx@gmail.com>
---

diff --git a/Open-ILS/src/eg2/src/app/share/common-widgets.module.ts b/Open-ILS/src/eg2/src/app/share/common-widgets.module.ts
index 01b16bd4da..8ba4750ee1 100644
--- a/Open-ILS/src/eg2/src/app/share/common-widgets.module.ts
+++ b/Open-ILS/src/eg2/src/app/share/common-widgets.module.ts
@@ -14,6 +14,7 @@ import {DateSelectComponent} from '@eg/share/date-select/date-select.component';
 import {OrgSelectComponent} from '@eg/share/org-select/org-select.component';
 import {DateRangeSelectComponent} from '@eg/share/daterange-select/daterange-select.component';
 import {DateTimeSelectComponent} from '@eg/share/datetime-select/datetime-select.component';
+import {ContextMenuDirective, ContextMenuComponent} from '@eg/share/context-menu/context-menu.component';
 
 
 @NgModule({
@@ -24,6 +25,8 @@ import {DateTimeSelectComponent} from '@eg/share/datetime-select/datetime-select
     OrgSelectComponent,
     DateRangeSelectComponent,
     DateTimeSelectComponent,
+    ContextMenuDirective,
+    ContextMenuComponent
   ],
   imports: [
     CommonModule,
@@ -43,6 +46,8 @@ import {DateTimeSelectComponent} from '@eg/share/datetime-select/datetime-select
     OrgSelectComponent,
     DateRangeSelectComponent,
     DateTimeSelectComponent,
+    ContextMenuComponent,
+    ContextMenuDirective
   ],
 })
 
diff --git a/Open-ILS/src/eg2/src/app/share/context-menu/context-menu.component.css b/Open-ILS/src/eg2/src/app/share/context-menu/context-menu.component.css
new file mode 100644
index 0000000000..88b31f275a
--- /dev/null
+++ b/Open-ILS/src/eg2/src/app/share/context-menu/context-menu.component.css
@@ -0,0 +1,20 @@
+
+:host >>> .popover {
+  font-family: 'Lucida Console', Monaco, monospace;
+  max-width: 550px;
+}
+
+:host >>> .popover-body {
+  max-height: 400px;
+  overflow-y: auto;
+  overflow-x: auto;
+}
+
+:host >>> .popover-body .menu-entry {
+  white-space: nowrap;
+}
+
+:host >>> .popover-body .menu-entry:hover {
+  background-color: #f8f9fa; /* bootstrap color */
+}
+
diff --git a/Open-ILS/src/eg2/src/app/share/context-menu/context-menu.component.html b/Open-ILS/src/eg2/src/app/share/context-menu/context-menu.component.html
new file mode 100644
index 0000000000..b9d301bdf9
--- /dev/null
+++ b/Open-ILS/src/eg2/src/app/share/context-menu/context-menu.component.html
@@ -0,0 +1,29 @@
+
+<ng-template #menuTemplate>
+  <div *ngFor="let entry of menuEntries" class="menu-entry {{entryClasses}}">
+    <a (click)="entryClicked(entry)">
+      <span>{{entry.label}}</span>
+    </a>
+  </div>
+</ng-template>
+
+<!--
+<div class="form-inline d-flex">
+  <div class="flex-4">
+    <span id='label-{{randId}}' class="text-left font-weight-bold">
+      {{fieldLabel}}
+    </span>
+  </div>
+  <input 
+    [attr.aria-labelledby]="'label-' + randId"
+    class="form-control rounded-0 flex-5" type="text" 
+    (change)="valueChange()"
+    [(ngModel)]="fieldValue" 
+    [attr.maxlength]="fieldLength" [attr.size]="fieldLength"
+    [ngbPopover]="menuContent"
+    #p="ngbPopover" triggers="manual"
+    (contextmenu)="contextMenu($event, p)"
+    />
+</div>
+-->
+
diff --git a/Open-ILS/src/eg2/src/app/share/context-menu/context-menu.component.ts b/Open-ILS/src/eg2/src/app/share/context-menu/context-menu.component.ts
new file mode 100644
index 0000000000..91938e677c
--- /dev/null
+++ b/Open-ILS/src/eg2/src/app/share/context-menu/context-menu.component.ts
@@ -0,0 +1,88 @@
+import {Component, Input, Output, OnInit, EventEmitter, Directive, 
+    ComponentFactoryResolver, ViewChild, TemplateRef} from '@angular/core';
+import {NgbPopover} from '@ng-bootstrap/ng-bootstrap';
+
+/**
+ * Context menu component.
+ *
+ * No state is maintained (i.e. there is no current value), events are 
+ * simply emitted as entries are chosen.
+ *
+ * <eg-context-menu #menu 
+ *   [menuEntries]="ContextMenuEntry[]"
+ *   (entrySelected)="$event === ContextMenuEntry">
+ *
+ * <input [egContextMenu]="menu" ... />
+ */
+
+export interface ContextMenuEntry {
+    value: string;
+    label: string;
+}
+
+@Component({
+  selector: 'eg-context-menu',
+  templateUrl: './context-menu.component.html',
+  styleUrls: ['context-menu.component.css']
+})
+
+export class ContextMenuComponent implements OnInit {
+
+    @Input() menuEntries: ContextMenuEntry[] = [];
+
+    // Additional CSS classes (space separated) to apply to the entry links
+    @Input() entryClasses = '';
+
+    @Output() entrySelected: EventEmitter<ContextMenuEntry>;
+
+    @ViewChild('menuTemplate', {static: false}) public menuTemplate: TemplateRef<any>;
+
+    constructor() {
+        this.entrySelected = new EventEmitter<ContextMenuEntry>();
+    }
+
+    ngOnInit() {}
+
+    entryClicked(entry: ContextMenuEntry) {
+        this.entrySelected.emit(entry);
+    }
+}
+
+@Directive({
+  selector: '[egContextMenu]',
+  exportAs: 'egContextMenu'
+})
+export class ContextMenuDirective extends NgbPopover {
+
+    menuComp: ContextMenuComponent;
+
+    triggers = 'contextmenu';
+
+    @Input() set egContextMenu(menuComp: ContextMenuComponent) {
+        this.menuComp = menuComp;
+    }
+
+    // Only one active menu is allowed at a time.
+    static activeMenu: ContextMenuDirective;
+
+    open() {
+
+        // Note the popover will automatically close in most cases,
+        // but context menus typically preventDefault() from firing,
+        // which prevents right-click from closing existing menus.
+        if (ContextMenuDirective.activeMenu) {
+           ContextMenuDirective.activeMenu.close();
+        }
+
+        if (!this.menuComp.menuEntries ||
+             this.menuComp.menuEntries.length === 0) { 
+             return;
+        }
+
+        this.ngbPopover = this.menuComp.menuTemplate;
+        ContextMenuDirective.activeMenu = this;
+        super.open();
+    }
+}
+
+
diff --git a/Open-ILS/src/eg2/src/app/staff/share/marc-edit/context-menu.component.css b/Open-ILS/src/eg2/src/app/staff/share/marc-edit/context-menu.component.css
deleted file mode 100644
index 88b31f275a..0000000000
--- a/Open-ILS/src/eg2/src/app/staff/share/marc-edit/context-menu.component.css
+++ /dev/null
@@ -1,20 +0,0 @@
-
-:host >>> .popover {
-  font-family: 'Lucida Console', Monaco, monospace;
-  max-width: 550px;
-}
-
-:host >>> .popover-body {
-  max-height: 400px;
-  overflow-y: auto;
-  overflow-x: auto;
-}
-
-:host >>> .popover-body .menu-entry {
-  white-space: nowrap;
-}
-
-:host >>> .popover-body .menu-entry:hover {
-  background-color: #f8f9fa; /* bootstrap color */
-}
-
diff --git a/Open-ILS/src/eg2/src/app/staff/share/marc-edit/context-menu.component.html b/Open-ILS/src/eg2/src/app/staff/share/marc-edit/context-menu.component.html
deleted file mode 100644
index b9d301bdf9..0000000000
--- a/Open-ILS/src/eg2/src/app/staff/share/marc-edit/context-menu.component.html
+++ /dev/null
@@ -1,29 +0,0 @@
-
-<ng-template #menuTemplate>
-  <div *ngFor="let entry of menuEntries" class="menu-entry {{entryClasses}}">
-    <a (click)="entryClicked(entry)">
-      <span>{{entry.label}}</span>
-    </a>
-  </div>
-</ng-template>
-
-<!--
-<div class="form-inline d-flex">
-  <div class="flex-4">
-    <span id='label-{{randId}}' class="text-left font-weight-bold">
-      {{fieldLabel}}
-    </span>
-  </div>
-  <input 
-    [attr.aria-labelledby]="'label-' + randId"
-    class="form-control rounded-0 flex-5" type="text" 
-    (change)="valueChange()"
-    [(ngModel)]="fieldValue" 
-    [attr.maxlength]="fieldLength" [attr.size]="fieldLength"
-    [ngbPopover]="menuContent"
-    #p="ngbPopover" triggers="manual"
-    (contextmenu)="contextMenu($event, p)"
-    />
-</div>
--->
-
diff --git a/Open-ILS/src/eg2/src/app/staff/share/marc-edit/context-menu.component.ts b/Open-ILS/src/eg2/src/app/staff/share/marc-edit/context-menu.component.ts
deleted file mode 100644
index 43e8529114..0000000000
--- a/Open-ILS/src/eg2/src/app/staff/share/marc-edit/context-menu.component.ts
+++ /dev/null
@@ -1,80 +0,0 @@
-import {Component, Input, Output, OnInit, EventEmitter, Directive, 
-    ComponentFactoryResolver, ViewChild, TemplateRef} from '@angular/core';
-import {NgbPopover} from '@ng-bootstrap/ng-bootstrap';
-
-/**
- * Right-click context menu component.
- *
- * No state is maintained (i.e. no current value), events are 
- * simply emitted as entries are chosen.
- *
- * <eg-context-menu-entries #tRef [menuEntries]="ContextMenuEntry[]"
- *   (entrySelected)="$event === ContextMenuEntry">
- * <input ... [egContextMenu]="tRef" ... />
- */
-
-export interface ContextMenuEntry {
-    value: string;
-    label: string;
-}
-
-@Component({
-  selector: 'eg-context-menu',
-  templateUrl: './context-menu.component.html',
-  styleUrls: ['context-menu.component.css']
-})
-
-export class ContextMenuComponent implements OnInit {
-
-    @Input() menuEntries: ContextMenuEntry[] = [];
-
-    // Additional CSS classes (space separated) to apply to the entry links
-    @Input() entryClasses = '';
-
-    @Output() entrySelected: EventEmitter<ContextMenuEntry>;
-
-    @ViewChild('menuTemplate', {static: false}) public menuTemplate: TemplateRef<any>;
-
-    constructor() {
-        this.entrySelected = new EventEmitter<ContextMenuEntry>();
-    }
-
-    ngOnInit() {}
-
-    entryClicked(entry: ContextMenuEntry) {
-        this.entrySelected.emit(entry);
-    }
-}
-
-@Directive({
-  selector: '[egContextMenu]',
-  exportAs: 'egContextMenu'
-})
-export class ContextMenuDirective extends NgbPopover implements OnInit {
-
-    menuComp: ContextMenuComponent;
-
-    @Input() set egContextMenu(menuComp: ContextMenuComponent) {
-        this.menuComp = menuComp;
-    }
-
-    // Only one active menu is allowed at a time.
-    static activeMenu: ContextMenuDirective;
-
-    open() {
-
-        if (!this.menuComp.menuEntries ||
-             this.menuComp.menuEntries.length === 0) { 
-             return;
-        }
-
-        this.ngbPopover = this.menuComp.menuTemplate;
-        if (ContextMenuDirective.activeMenu) {
-           ContextMenuDirective.activeMenu.close();
-        }
-        ContextMenuDirective.activeMenu = this;
-        super.open();
-    }
-}
-
-
diff --git a/Open-ILS/src/eg2/src/app/staff/share/marc-edit/fixed-field.component.html b/Open-ILS/src/eg2/src/app/staff/share/marc-edit/fixed-field.component.html
index db77bff62c..3d822f9eaf 100644
--- a/Open-ILS/src/eg2/src/app/staff/share/marc-edit/fixed-field.component.html
+++ b/Open-ILS/src/eg2/src/app/staff/share/marc-edit/fixed-field.component.html
@@ -3,7 +3,7 @@
 
   <eg-context-menu #contextMenu 
     [menuEntries]="fieldValues"
-    (entrySelected)="valueChange(value.value)">
+    (entrySelected)="valueChange($event.value)">
   </eg-context-menu>
 
   <div class="form-inline d-flex">
@@ -19,10 +19,7 @@
       [(ngModel)]="fieldValue" 
       [attr.maxlength]="fieldLength" [attr.size]="fieldLength"
       [egContextMenu]="contextMenu"
-      #m="egContextMenu" triggers="manual"
-      (contextmenu)="$event.preventDefault(); m.open()"
       />
   </div>
-
 </ng-container>
 
diff --git a/Open-ILS/src/eg2/src/app/staff/share/marc-edit/fixed-field.component.ts b/Open-ILS/src/eg2/src/app/staff/share/marc-edit/fixed-field.component.ts
index 9ede60e0c3..3d71ddf891 100644
--- a/Open-ILS/src/eg2/src/app/staff/share/marc-edit/fixed-field.component.ts
+++ b/Open-ILS/src/eg2/src/app/staff/share/marc-edit/fixed-field.component.ts
@@ -83,12 +83,10 @@ export class FixedFieldComponent implements OnInit {
         });
     }
 
-    valueChange(newVal?: string) {
-        if (newVal !== undefined) {
-            // needed for context menu
-            this.fieldValue = newVal;
-        }
+    valueChange(newVal: string) {
+        this.fieldValue = newVal;
         this.context.record.setFixedField(this.fieldCode, this.fieldValue);
     }
 }
 
+
diff --git a/Open-ILS/src/eg2/src/app/staff/share/marc-edit/marc-edit.module.ts b/Open-ILS/src/eg2/src/app/staff/share/marc-edit/marc-edit.module.ts
index 6825a48056..c7bbaba481 100644
--- a/Open-ILS/src/eg2/src/app/staff/share/marc-edit/marc-edit.module.ts
+++ b/Open-ILS/src/eg2/src/app/staff/share/marc-edit/marc-edit.module.ts
@@ -1,5 +1,6 @@
 import {NgModule} from '@angular/core';
 import {StaffCommonModule} from '@eg/staff/common.module';
+import {CommonWidgetsModule} from '@eg/share/common-widgets.module';
 import {MarcEditorComponent} from './editor.component';
 import {MarcRichEditorComponent} from './rich-editor.component';
 import {MarcFlatEditorComponent} from './flat-editor.component';
@@ -8,9 +9,6 @@ import {FixedFieldComponent} from './fixed-field.component';
 import {TagTableService} from './tagtable.service';
 import {EditableContentComponent} from './editable-content.component';
 
-// TODO: consider moving to share 
-import {ContextMenuDirective, ContextMenuComponent} from './context-menu.component';
-
 @NgModule({
     declarations: [
         MarcEditorComponent,
@@ -18,12 +16,11 @@ import {ContextMenuDirective, ContextMenuComponent} from './context-menu.compone
         MarcFlatEditorComponent,
         FixedFieldsEditorComponent,
         FixedFieldComponent,
-        EditableContentComponent,
-        ContextMenuDirective,
-        ContextMenuComponent
+        EditableContentComponent
     ],
     imports: [
-        StaffCommonModule
+        StaffCommonModule,
+        CommonWidgetsModule
     ],
     exports: [
         MarcEditorComponent