Merge pull request #3587 from vvlladd28/bugs/editor/ace/clear

UI: Fixed clear content for ace editor and show toast error
This commit is contained in:
Igor Kulikov 2020-10-16 10:45:27 +03:00 committed by GitHub
commit 501a99daf1
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 36 additions and 23 deletions

View File

@ -36,7 +36,6 @@ import { TranslateService } from '@ngx-translate/core';
import { CancelAnimationFrame, RafService } from '@core/services/raf.service';
import { ResizeObserver } from '@juggle/resize-observer';
import { TbEditorCompleter } from '@shared/models/ace/completion.models';
import { widgetEditorCompleter } from '@home/pages/widget/widget-editor.models';
@Component({
selector: 'tb-js-func',
@ -64,6 +63,7 @@ export class JsFuncComponent implements OnInit, OnDestroy, ControlValueAccessor,
private jsEditor: ace.Ace.Editor;
private editorsResizeCaf: CancelAnimationFrame;
private editorResize$: ResizeObserver;
private ignoreChange = false;
toastTargetId = `jsFuncEditor-${guid()}`;
@ -154,8 +154,10 @@ export class JsFuncComponent implements OnInit, OnDestroy, ControlValueAccessor,
this.jsEditor.session.setUseWrapMode(true);
this.jsEditor.setValue(this.modelValue ? this.modelValue : '', -1);
this.jsEditor.on('change', () => {
if (!this.ignoreChange) {
this.cleanupJsErrors();
this.updateView();
}
});
if (this.editorCompleter) {
this.jsEditor.completers = [this.editorCompleter, ...(this.jsEditor.completers || [])];
@ -332,7 +334,9 @@ export class JsFuncComponent implements OnInit, OnDestroy, ControlValueAccessor,
writeValue(value: string): void {
this.modelValue = value;
if (this.jsEditor) {
this.ignoreChange = true;
this.jsEditor.setValue(this.modelValue ? this.modelValue : '', -1);
this.ignoreChange = false;
}
}

View File

@ -61,6 +61,7 @@ export class JsonContentComponent implements OnInit, ControlValueAccessor, Valid
private jsonEditor: ace.Ace.Editor;
private editorsResizeCaf: CancelAnimationFrame;
private editorResize$: ResizeObserver;
private ignoreChange = false;
toastTargetId = `jsonContentEditor-${guid()}`;
@ -140,8 +141,13 @@ export class JsonContentComponent implements OnInit, ControlValueAccessor, Valid
this.jsonEditor.session.setUseWrapMode(true);
this.jsonEditor.setValue(this.contentBody ? this.contentBody : '', -1);
this.jsonEditor.on('change', () => {
if (!this.ignoreChange) {
this.cleanupJsonErrors();
this.updateView();
}
});
this.jsonEditor.on('blur', () => {
this.contentValid = !this.validateContent || this.doValidate(true);
});
this.editorResize$ = new ResizeObserver(() => {
this.onAceEditorResize();
@ -210,18 +216,19 @@ export class JsonContentComponent implements OnInit, ControlValueAccessor, Valid
this.cleanupJsonErrors();
this.contentValid = true;
this.propagateChange(this.contentBody);
this.contentValid = this.doValidate();
this.contentValid = this.doValidate(true);
this.propagateChange(this.contentBody);
}
}
private doValidate(): boolean {
private doValidate(showErrorToast = false): boolean {
try {
if (this.validateContent && this.contentType === ContentType.JSON) {
JSON.parse(this.contentBody);
}
return true;
} catch (ex) {
if (showErrorToast) {
let errorInfo = 'Error:';
if (ex.name) {
errorInfo += ' ' + ex.name + ':';
@ -238,6 +245,7 @@ export class JsonContentComponent implements OnInit, ControlValueAccessor, Valid
horizontalPosition: 'left'
}));
this.errorShowed = true;
}
return false;
}
}
@ -256,8 +264,9 @@ export class JsonContentComponent implements OnInit, ControlValueAccessor, Valid
this.contentBody = value;
this.contentValid = true;
if (this.jsonEditor) {
this.ignoreChange = true;
this.jsonEditor.setValue(this.contentBody ? this.contentBody : '', -1);
// this.jsonEditor.
this.ignoreChange = false;
}
}