From 579bb58afc36e7c472a0a10588eb95682e23aa90 Mon Sep 17 00:00:00 2001
From: "konstantina.galouni" <kgalouni@di.uoa.gr>
Date: Tue, 3 May 2022 18:06:32 +0300
Subject: [PATCH] #7699: rich-text-editor.component.ts: Clear any formatting on
 paste and add plain text | Added h1-h6 tags in customClasses | Enable
 "removeFormat" button (clear formatting added from editor options).

---
 .../rich-text-editor.component.ts             | 21 ++++++++++++++++---
 1 file changed, 18 insertions(+), 3 deletions(-)

diff --git a/dmp-frontend/src/app/library/rich-text-editor/rich-text-editor.component.ts b/dmp-frontend/src/app/library/rich-text-editor/rich-text-editor.component.ts
index ed45c1967..edaf1dd56 100644
--- a/dmp-frontend/src/app/library/rich-text-editor/rich-text-editor.component.ts
+++ b/dmp-frontend/src/app/library/rich-text-editor/rich-text-editor.component.ts
@@ -8,7 +8,8 @@ import {FormControl} from "@angular/forms";
 		<div class="editor-wrapper" [class]="wrapperClasses" [formGroup]="parentFormGroup">
 			<angular-editor class="full-width editor" [ngClass]="editable ? '': 'disabled'" [id]="id"
 							[config]="editorConfig" [formControlName]="controlName"
-							placeholder="{{(placeholder? (placeholder | translate) : '') + (required ? ' *': '')}}"></angular-editor>
+							placeholder="{{(placeholder? (placeholder | translate) : '') + (required ? ' *': '')}}"
+							(paste)="pasteWithoutFormatting($event)"></angular-editor>
 			<mat-icon *ngIf="formInput.value" (click)="formInput.patchValue('')" class="clear">close</mat-icon>
 		</div>
 	`,
@@ -40,6 +41,14 @@ export class RichTextEditorComponent {
 		defaultFontSize: '',
 		sanitize: true,
 		toolbarPosition: 'top',
+		customClasses: [
+			{	name: 'H1 header', class: '', tag: 'h1'	},
+			{	name: 'H2 header', class: '', tag: 'h2'	},
+			{	name: 'H3 header', class: '', tag: 'h3'	},
+			{	name: 'H4 header', class: '', tag: 'h4'	},
+			{	name: 'H5 header', class: '', tag: 'h5'},
+			{	name: 'H6 header', class: '', tag: 'h6'}
+		],
 		toolbarHiddenButtons: [
 			[
 				'heading',
@@ -48,10 +57,10 @@ export class RichTextEditorComponent {
 			[
 				'fontSize',
 				'backgroundColor',
-				'customClasses',
+				// 'customClasses',
 				'insertImage',
 				'insertVideo',
-				'removeFormat',
+				// 'removeFormat',
 				'toggleEditorMode'
 			]
 		]
@@ -64,4 +73,10 @@ export class RichTextEditorComponent {
 	ngAfterContentInit() {
 		this.editorConfig.editable = this.editable;
 	}
+
+	pasteWithoutFormatting($event) {
+		$event.preventDefault();
+		const text = $event.clipboardData.getData("text/plain");
+		window.document.execCommand("insertText", false, text);
+	}
 }