autosave notes; save notes on archive and accept, remove formatting from paste

src/app/directives/content-editable.directive.ts

@@ -33,6 +33,23 @@ export class ContentEditableDirective implements ControlValueAccessor {
     }
   }
 
+  @HostListener('paste', ['$event'])
+  onPaste($event) {
+    // after the paste, remove all the formatting
+    setTimeout(() => {
+      this.clearAttr(this.elementRef.nativeElement);
+    }, 500);
+  }
+
+  clearAttr(el: any) {
+    this.renderer.removeAttribute(el, 'style');
+    this.renderer.removeAttribute(el, 'class');
+    this.renderer.removeAttribute(el, 'id');
+    for (let e of el.children) {
+      this.clearAttr(e);
+    }
+  }
+
   /**
    * Writes a new value to the element.
    * This method will be called by the forms API to write

src/app/executions/execution/execution-detail/execution-detail.component.ts

 import {Component, EventEmitter, Input, OnDestroy, OnInit, Output} from '@angular/core';
 import {Job, JobExecution} from "../../../model/job";
-import {Subscription} from "rxjs";
+import {Subject} from "rxjs";
 import {JobsService} from "../../../services/jobs.service";
 import {FormControl, FormGroup} from "@angular/forms";
 import {ConfigurationService} from "../../../env/configuration.service";
 import {faCheckCircle, faCopy, faList, faSave, faStickyNote} from "@fortawesome/free-solid-svg-icons";
 import {AlertService} from "../../../services/alert.service";
+import {auditTime, takeUntil} from "rxjs/operators";
 
 @Component({
   selector: 'app-execution-detail',
@@ -14,9 +15,9 @@ import {AlertService} from "../../../services/alert.service";
 })
 export class ExecutionDetailComponent implements OnInit, OnDestroy {
 
+  private ngUnsubscribe = new Subject<void>();
   @Input() job: Job;
   @Output() reload = new EventEmitter();
-  private jobDetail$: Subscription;
   public jobDetail: JobExecution;
 
   noteFormGroup: FormGroup;
@@ -39,13 +40,16 @@ export class ExecutionDetailComponent implements OnInit, OnDestroy {
   }
 
   ngOnInit() {
-    this.jobDetail$ = this.jobService.getJobExecution(this.job.job_id).subscribe((j: JobExecution) => {
+    this.jobService.getJobExecution(this.job.job_id).pipe(takeUntil(this.ngUnsubscribe)).subscribe((j: JobExecution) => {
       if (j) {
         this.jobDetail = j;
         this.noteFormGroup.get('notes').setValue(j.notes);
         this.noteFormGroup.get('id').setValue(j.id);
       }
     });
+
+    // autosave the form on changes
+    this.noteFormGroup.valueChanges.pipe(auditTime(2000),takeUntil(this.ngUnsubscribe)).subscribe(() => this.updateNotes());
   }
 
   copyToClipboard(text: string): void {
@@ -102,6 +106,7 @@ export class ExecutionDetailComponent implements OnInit, OnDestroy {
   }
 
   acceptQa() {
+    this.updateNotes(); // make sure notes are saved before submitting
     this.alertService.info('Accepting ' + this.job.job_id);
     this.performQa(this.job.job_id, 'accept');
   }
@@ -137,9 +142,8 @@ export class ExecutionDetailComponent implements OnInit, OnDestroy {
 
 
   ngOnDestroy(): void {
-    if (this.jobDetail$) {
-      this.jobDetail$.unsubscribe();
-    }
+    this.ngUnsubscribe.next();
+    this.ngUnsubscribe.complete();
   }
 
 }