MaDgiK-CITE
/
argos
13
0
Fork 0
Code Issues Pull Requests Projects Releases 3 Wiki Activity

#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).

This commit is contained in:
Konstantina Galouni 2022-05-03 18:06:32 +03:00
parent a5061759b8
commit 579bb58afc
1 changed files with 18 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

21
dmp-frontend/src/app/library/rich-text-editor/rich-text-editor.component.ts
View File

@ -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);
}
}