import {Component, Input, Output, OnInit, EventEmitter, Directive,
- ViewChild, TemplateRef} from '@angular/core';
+ ComponentFactoryResolver, ViewChild, TemplateRef} from '@angular/core';
import {NgbPopover} from '@ng-bootstrap/ng-bootstrap';
/**
}
@Component({
- selector: 'eg-context-menu-entries',
+ selector: 'eg-context-menu',
templateUrl: './context-menu.component.html',
styleUrls: ['context-menu.component.css']
})
}
}
-
@Directive({
selector: '[egContextMenu]',
exportAs: 'egContextMenu'
})
-export class ContextMenuDirective extends NgbPopover {
+export class ContextMenuDirective extends NgbPopover implements OnInit {
+
+ menuComp: ContextMenuComponent;
@Input() set egContextMenu(menuComp: ContextMenuComponent) {
- this.ngbPopover = menuComp.menuTemplate;
+ this.menuComp = menuComp;
}
// Only one active menu is allowed at a time.
static activeMenu: ContextMenuDirective;
open() {
- super.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();
}
}
<ng-container *ngIf="fieldMeta">
- <ng-template #menuContent>
- <div *ngFor="let value of fieldValues" class="menu-entry">
- <a (click)="valueChange(value.value)">
- <span class="font-monospace">{{value.label}}</span>
- </a>
- </div>
- </ng-template>
+ <eg-context-menu #contextMenu
+ [menuEntries]="fieldValues"
+ (entrySelected)="valueChange(value.value)">
+ </eg-context-menu>
<div class="form-inline d-flex">
<div class="flex-4">
(change)="valueChange()"
[(ngModel)]="fieldValue"
[attr.maxlength]="fieldLength" [attr.size]="fieldLength"
- [ngbPopover]="menuContent"
- #p="ngbPopover" triggers="manual"
- (contextmenu)="contextMenu($event, p)"
+ [egContextMenu]="contextMenu"
+ #m="egContextMenu" triggers="manual"
+ (contextmenu)="$event.preventDefault(); m.open()"
/>
</div>
import {MarcRecord} from './marcrecord';
import {MarcEditContext} from './editor-context';
import {TagTableService, ValueLabelPair} from './tagtable.service';
-import {NgbPopover} from '@ng-bootstrap/ng-bootstrap';
+//import {NgbPopover} from '@ng-bootstrap/ng-bootstrap';
+//import {ContextMenuDirective} from './context-menu.component';
/**
* MARC Fixed Field Editing Component
fieldMeta: any;
fieldLength: number = null;
fieldValues: ValueLabelPair[] = null;
- popOver: NgbPopover;
+ //popOver: NgbPopover;
randId = Math.floor(Math.random() * 10000000);
constructor(private tagTable: TagTableService) {}
}
this.context.record.setFixedField(this.fieldCode, this.fieldValue);
}
-
- contextMenu($event, popOver: NgbPopover) {
- $event.preventDefault();
- this.context.closePopovers();
-
- if (this.fieldValues) {
- if (!this.popOver) {
- this.popOver = popOver;
- this.context.popOvers.push(popOver);
- }
- this.popOver.open();
- }
- }
}