Double click to edit, double escape to stop
continuous-integration/drone/push Build is passing Details
continuous-integration/drone Build is passing Details

master
Garrett Mills 3 years ago
parent 6bcb4bf455
commit 5983e56d11
Signed by: garrettmills
GPG Key ID: D2BF5FBA8298F246

@ -1,10 +1,10 @@
<div class="container" (click)="onFocusIn()">
<div class="container" (dblclick)="onFocusIn()">
<div class="editor-container" *ngIf="showEditor">
<ngx-monaco-editor class="editor"
[options]="editorOptions"
[(ngModel)]="contents"
(ngModelChange)="onContentsChanged($event)"
#editor
[options]="editorOptions"
[(ngModel)]="contents"
(ngModelChange)="onContentsChanged($event)"
#editor
></ngx-monaco-editor>
</div>
<div class="display" markdown katex [data]="contents"></div>

@ -18,6 +18,7 @@ export class MarkdownComponent extends EditorNodeContract implements OnInit {
public contents = '';
private dirtyOverride = false;
public showEditor = false;
protected hadOneFocusOut = false;
public editorOptions = {
language: 'markdown',
@ -73,6 +74,14 @@ export class MarkdownComponent extends EditorNodeContract implements OnInit {
@HostListener('document:keyup.escape', ['$event'])
onFocusOut(event) {
this.showEditor = false;
if ( !this.hadOneFocusOut ) {
this.hadOneFocusOut = true;
setTimeout(() => {
this.hadOneFocusOut = false;
}, 500);
} else {
this.hadOneFocusOut = false;
this.showEditor = false;
}
}
}

@ -1,5 +1,5 @@
<div class="container"
(focusin)="onFocusIn($event)">
(dblclick)="onFocusIn($event)">
<div class="toolbar-base" *ngIf="isFocused">
<button class="toolbar-button" title="Bold" (click)="documentCommand('bold')">
<i class="icon fa fa-bold"></i>
@ -70,8 +70,14 @@
[ngClass]="isFocused ? 'focused' : ''"
contenteditable
appDomChange
*ngIf="isFocused"
[innerHTML]="initialValue"
#editable
(domChange)="onContentsChanged($event)"
></div>
<div
class="editable-base"
*ngIf="!isFocused"
[innerHTML]="initialValue"
></div>
</div>

@ -16,6 +16,7 @@ export class NormComponent extends EditorNodeContract implements OnInit {
protected savedValue = 'Click to edit...';
public contents = '';
private dirtyOverride = false;
protected hadOneFocusOut = false;
constructor(
public readonly editorService: EditorService,
@ -55,7 +56,15 @@ export class NormComponent extends EditorNodeContract implements OnInit {
@HostListener('document:keyup.escape', ['$event'])
onFocusOut(event) {
this.isFocused = false;
if ( !this.hadOneFocusOut ) {
this.hadOneFocusOut = true;
setTimeout(() => {
this.hadOneFocusOut = false;
}, 500);
} else {
this.isFocused = false;
this.hadOneFocusOut = false;
}
}
documentCommand(cmd: string) {

Loading…
Cancel
Save