LPXXX Marc enriched more fields displaying

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

diff --git a/Open-ILS/src/eg2/src/app/staff/share/marc-edit/editable-content.component.html b/Open-ILS/src/eg2/src/app/staff/share/marc-edit/editable-content.component.html
new file mode 100644 (file)
index 0000000..687a5a6
--- /dev/null
+++ b/Open-ILS/src/eg2/src/app/staff/share/marc-edit/editable-content.component.html
@@ -0,0 +1,11 @@
+
+<input 
+  id='marc-editable-content-{{randId}}' 
+  class="p-0 pl-1 pr-1 rounded-0 form-control"
+  [size]="inputSize()" 
+  [maxlength]="maxLength || ''"
+  [disabled]="readOnly" 
+  (blur)="propagateTouch()"
+  [(ngModel)]="content"
+/>
+

diff --git a/Open-ILS/src/eg2/src/app/staff/share/marc-edit/editable-content.component.ts b/Open-ILS/src/eg2/src/app/staff/share/marc-edit/editable-content.component.ts
new file mode 100644 (file)
index 0000000..f1725e6
--- /dev/null
+++ b/Open-ILS/src/eg2/src/app/staff/share/marc-edit/editable-content.component.ts
@@ -0,0 +1,61 @@
+import {Component, Input, Output, OnInit, EventEmitter, forwardRef} from '@angular/core';
+import {ControlValueAccessor, NG_VALUE_ACCESSOR} from '@angular/forms';
+import {MarcRecord} from './marcrecord';
+import {MarcEditContext} from './editor-context';
+
+/**
+ * MARC Tag Editor Component
+ */
+
+@Component({
+  selector: 'eg-marc-editable-content',
+  templateUrl: './editable-content.component.html',
+  providers: [{
+    provide: NG_VALUE_ACCESSOR,
+    useExisting: forwardRef(() => EditableContentComponent),
+    multi: true
+  }]
+})
+
+export class EditableContentComponent implements OnInit, ControlValueAccessor {
+
+    @Input() context: MarcEditContext;
+    @Input() readOnly: boolean;
+    @Input() content: string;
+    @Input() maxLength: number;
+
+    get record(): MarcRecord { return this.context.record; }
+
+    randId: string;
+
+    // Stub functions required by ControlValueAccessor
+    propagateChange = (_: any) => {};
+    propagateTouch = () => {};
+
+    constructor() {
+        this.randId = Math.random().toFixed(5);
+    }
+
+    ngOnInit() {}
+
+    inputSize(): number {
+        return (this.content || ' ').length * 1.1;
+    }
+
+    valueChange() {
+        this.propagateChange(this.content);
+    }
+
+    writeValue(content: string) {
+                  this.content = content;
+    }
+
+    registerOnChange(fn) {
+        this.propagateChange = fn;
+    }
+
+    registerOnTouched(fn) {
+        this.propagateTouch = fn;
+    }
+}
+

diff --git a/Open-ILS/src/eg2/src/app/staff/share/marc-edit/editor-context.ts b/Open-ILS/src/eg2/src/app/staff/share/marc-edit/editor-context.ts
index 8eccfba..4c30256 100644 (file)
--- a/Open-ILS/src/eg2/src/app/staff/share/marc-edit/editor-context.ts
+++ b/Open-ILS/src/eg2/src/app/staff/share/marc-edit/editor-context.ts
@@ -25,10 +25,9 @@ export class MarcEditContext {
     }
 
     // NgbPopovers don't always close when we want them to,
-    // specifcially when context-clicking.
+    // specifcially when context-clicking to open other popovers.
     closePopovers() {
         this.popOvers.forEach(p => p.close());
     }
-
 }
 

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 404d78f..4ec4523 100644 (file)
--- 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 @@
 
   <ng-template #menuContent>
     <div *ngFor="let value of fieldValues" class="menu-entry">
-      <a (click)="fieldValue=value.value">
+      <a (click)="valueChange(value.value)">
         <span class="font-monospace">{{value.label}}</span>
       </a>
     </div>
@@ -13,15 +13,16 @@
     <label for='fixed-field-input-{{field}}' class="pr-2 flex-1">
       {{fieldLabel}}
     </label>
-
-    <input id='fixed-field-input-{{field}}' type="text" 
-      (change)="valueChange($event)"
-      class="form-control p-1 flex-1" [(ngModel)]="fieldValue" 
-      [attr.maxlength]="fieldSize" [attr.size]="fieldSize"
+    <input id='fixed-field-input-{{fieldCode}}-{{randId}}'
+      class="form-control rounded-0 flex-1 pl-1" type="text" 
+      (change)="valueChange()"
+      [(ngModel)]="fieldValue" 
+      [attr.maxlength]="fieldLength" [attr.size]="fieldLength"
       [ngbPopover]="menuContent"
       #p="ngbPopover" triggers="manual"
       (contextmenu)="contextMenu($event, p)"
-    />
+      />
   </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 ce27791..4a46730 100644 (file)
--- 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
@@ -29,13 +29,16 @@ export class FixedFieldComponent implements OnInit {
 
     fieldValue: string;
     fieldMeta: any;
-    fieldSize: number = null;
+    fieldLength: number = null;
     fieldValues: FixedFieldValue[] = null;
     popOver: NgbPopover;
+    randId: string;
 
     constructor(
         private tagTable: TagTableService
-    ) {}
+    ) {
+        this.randId = Math.random().toFixed(5);
+    }
 
     ngOnInit() {
         this.init().then(_ =>
@@ -62,16 +65,16 @@ export class FixedFieldComponent implements OnInit {
                 return;
             }
 
-            this.fieldSize = this.fieldMeta.length || 1;
+            this.fieldLength = this.fieldMeta.length || 1;
             this.fieldValue =
                 this.context.record.extractFixedField(this.fieldCode);
 
             // Shuffling may occur with our fixed field as a result of
             // external changes.
-            this.record.fixedFieldChange.subscribe(_ =>
+            this.record.fixedFieldChange.subscribe(_ => {
                 this.fieldValue =
                     this.context.record.extractFixedField(this.fieldCode)
-            );
+            });
 
             return this.tagTable.getFFValueTable(this.record.recordType());
 
@@ -88,7 +91,11 @@ export class FixedFieldComponent implements OnInit {
         });
     }
 
-    valueChange(newVal) {
+    valueChange(newVal?: string) {
+        if (newVal !== undefined) {
+            // needed for context menu
+            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 c17ef22..45e03ed 100644 (file)
--- 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
@@ -6,6 +6,7 @@ import {MarcFlatEditorComponent} from './flat-editor.component';
 import {FixedFieldsEditorComponent} from './fixed-fields-editor.component';
 import {FixedFieldComponent} from './fixed-field.component';
 import {TagTableService} from './tagtable.service';
+import {EditableContentComponent} from './editable-content.component';
 
 @NgModule({
     declarations: [
@@ -13,7 +14,8 @@ import {TagTableService} from './tagtable.service';
         MarcRichEditorComponent,
         MarcFlatEditorComponent,
         FixedFieldsEditorComponent,
-        FixedFieldComponent
+        FixedFieldComponent,
+        EditableContentComponent
     ],
     imports: [
         StaffCommonModule

diff --git a/Open-ILS/src/eg2/src/app/staff/share/marc-edit/marcrecord.ts b/Open-ILS/src/eg2/src/app/staff/share/marc-edit/marcrecord.ts
index 26a5ed9..58179b3 100644 (file)
--- a/Open-ILS/src/eg2/src/app/staff/share/marc-edit/marcrecord.ts
+++ b/Open-ILS/src/eg2/src/app/staff/share/marc-edit/marcrecord.ts
@@ -18,6 +18,22 @@ export class MarcRecord {
     // Emits the fixed field code.
     fixedFieldChange: EventEmitter<string>;
 
+    get leader(): string {
+      return this.record.leader;
+    }
+
+    set leader(l: string) {
+        this.record.leader = l;
+    }
+
+    get fields(): any[] {
+      return this.record.fields;
+    }
+
+    set fields(f: any[]) {
+        this.record.fields = f;
+    }
+
     constructor(xml: string) {
         this.record = new MARC21.Record({marcxml: xml, delimiter: DELIMITER});
         this.breakerText = this.record.toBreaker();

diff --git a/Open-ILS/src/eg2/src/app/staff/share/marc-edit/rich-editor.component.html b/Open-ILS/src/eg2/src/app/staff/share/marc-edit/rich-editor.component.html
index f6cd4a8..73d0cb7 100644 (file)
--- a/Open-ILS/src/eg2/src/app/staff/share/marc-edit/rich-editor.component.html
+++ b/Open-ILS/src/eg2/src/app/staff/share/marc-edit/rich-editor.component.html
@@ -7,10 +7,41 @@
   <div class="mt-3 text-monospace" 
     (contextmenu)="$event.preventDefault()">
     <div class="row">
-      <div class="col-lg-10">
+      <div class="col-lg-9">
         <eg-fixed-fields-editor [context]="context"></eg-fixed-fields-editor>
       </div>
     </div>
+    <div class="row pt-0 pb-0 pl-3 form-horizontal">
+      <eg-marc-editable-content [context]="context" [ngModel]="'LDR'" 
+        [maxLength]="3" [readOnly]="true"></eg-marc-editable-content>
+      <eg-marc-editable-content [context]="context" [(ngModel)]="record.leader" 
+        [maxLength]="record.leader.length"></eg-marc-editable-content>
+    </div>
+    <div class="row pt-0 pb-0 pl-3 form-horizontal" 
+      *ngFor="let field of controlFields()">
+      <eg-marc-editable-content [context]="context" [(ngModel)]="field.tag" 
+        [maxLength]="3"></eg-marc-editable-content>
+      <eg-marc-editable-content [context]="context" [(ngModel)]="field.data">
+      </eg-marc-editable-content>
+    </div>
+    <div class="row pt-0 pb-0 pl-3 form-horizontal" 
+      *ngFor="let field of dataFields()">
+      <eg-marc-editable-content [context]="context" [(ngModel)]="field.tag" 
+        [maxLength]="3"></eg-marc-editable-content>
+      <eg-marc-editable-content [context]="context" [(ngModel)]="field.ind1" 
+        [maxLength]="1"></eg-marc-editable-content>
+      <eg-marc-editable-content [context]="context" [(ngModel)]="field.ind2" 
+        [maxLength]="1"></eg-marc-editable-content>
+
+      <ng-container *ngFor="let subfield of field.subfields">
+        <!-- subfield character -->
+        <eg-marc-editable-content [context]="context" [(ngModel)]="subfield[0]"
+          [maxLength]="1"></eg-marc-editable-content>
+        <!-- subfield value -->
+        <eg-marc-editable-content [context]="context" [(ngModel)]="subfield[1]">
+        </eg-marc-editable-content>
+      </ng-container>
+    </div>
   </div>
 </ng-container>
 

diff --git a/Open-ILS/src/eg2/src/app/staff/share/marc-edit/rich-editor.component.ts b/Open-ILS/src/eg2/src/app/staff/share/marc-edit/rich-editor.component.ts
index 9b333ee..4d4f079 100644 (file)
--- a/Open-ILS/src/eg2/src/app/staff/share/marc-edit/rich-editor.component.ts
+++ b/Open-ILS/src/eg2/src/app/staff/share/marc-edit/rich-editor.component.ts
@@ -45,6 +45,15 @@ export class MarcRichEditorComponent implements OnInit {
             this.tagTable.getFFValueTable(this.record.recordType())
         ]).then(_ => this.dataLoaded = true);
     }
+
+    controlFields(): any[] {
+        return this.record.fields.filter(f => f.isControlfield());
+    }
+
+    dataFields(): any[] {
+        return this.record.fields.filter(f => !f.isControlfield());
+    }
+
 }