Added base class to extend; added initial desired keybindings
This commit is contained in:
parent
05d48c5878
commit
fbf6933102
75
src/app/editor/ace/ace-editor.base.ts
Normal file
75
src/app/editor/ace/ace-editor.base.ts
Normal file
@ -0,0 +1,75 @@
|
||||
import { Directive, ElementRef, Input, ViewChild } from '@angular/core';
|
||||
|
||||
import { EditorSettings } from "../../common/configs/editor.config";
|
||||
|
||||
|
||||
|
||||
@Directive()
|
||||
export class AceEditorBase {
|
||||
@ViewChild('editor') editorElm!: ElementRef;
|
||||
@Input() editorSettings!: typeof EditorSettings;
|
||||
editor!: any;
|
||||
uuid!: string;
|
||||
fontSize: number = 12;
|
||||
cutBuffer: string = "";
|
||||
timerId: number = -1;
|
||||
|
||||
|
||||
constructor(
|
||||
) {}
|
||||
|
||||
|
||||
protected zoomIn() {
|
||||
this.fontSize += 1;
|
||||
this.editorElm.nativeElement.style.fontSize = `${this.fontSize}px`;
|
||||
}
|
||||
|
||||
protected zoomOut() {
|
||||
this.fontSize -= 1;
|
||||
this.editorElm.nativeElement.style.fontSize = `${this.fontSize}px`;
|
||||
}
|
||||
|
||||
protected search() {
|
||||
console.log(this.editor.getSession()["$modeId"])
|
||||
}
|
||||
|
||||
protected movelinesUp() {
|
||||
this.editor.execCommand("movelinesup");
|
||||
}
|
||||
|
||||
protected movelinesDown() {
|
||||
this.editor.execCommand("movelinesdown");
|
||||
}
|
||||
|
||||
protected duplicateLines() {
|
||||
this.editor.execCommand("copylinesdown");
|
||||
}
|
||||
|
||||
protected cutToBuffer() {
|
||||
if (this.timerId) { clearTimeout(this.timerId); }
|
||||
|
||||
const cursorPosition = this.editor.getCursorPosition();
|
||||
let lineText = this.editor.session.getLine(cursorPosition.row);
|
||||
this.cutBuffer += `${lineText}\n`;
|
||||
this.editor.session.removeFullLines(cursorPosition.row, cursorPosition.row)
|
||||
|
||||
this.setBufferClearTimeout();
|
||||
}
|
||||
|
||||
protected pasteCutBuffer() {
|
||||
if (this.timerId) { clearTimeout(this.timerId); }
|
||||
|
||||
const cursorPosition = this.editor.getCursorPosition();
|
||||
this.editor.session.insert(cursorPosition, this.cutBuffer)
|
||||
|
||||
this.setBufferClearTimeout();
|
||||
}
|
||||
|
||||
private setBufferClearTimeout(timeout: number = 5000) {
|
||||
this.timerId = setTimeout(() => {
|
||||
this.cutBuffer = "";
|
||||
this.timerId = -1;
|
||||
}, timeout);
|
||||
}
|
||||
|
||||
}
|
@ -1,4 +1,4 @@
|
||||
import { Component, ElementRef, ViewChild, Input } from '@angular/core';
|
||||
import { Component } from '@angular/core';
|
||||
|
||||
// Import Ace and its modes/themes so that `ace` global is defined
|
||||
import * as ace from 'ace-builds/src-noconflict/ace';
|
||||
@ -8,7 +8,7 @@ import "ace-builds/src-noconflict/ext-language_tools";
|
||||
import { EditorsService } from '../../common/services/editor/editors.service';
|
||||
import { LSPService } from '../../common/services/lsp.service';
|
||||
|
||||
import { EditorSettings } from "../../common/configs/editor.config";
|
||||
import { AceEditorBase } from './ace-editor.base';
|
||||
|
||||
|
||||
|
||||
@ -23,18 +23,15 @@ import { EditorSettings } from "../../common/configs/editor.config";
|
||||
'class': 'col'
|
||||
}
|
||||
})
|
||||
export class AceEditorComponent {
|
||||
|
||||
@Input() editorSettings!: typeof EditorSettings;
|
||||
@ViewChild('editor') editorElm!: ElementRef;
|
||||
editor!: any;
|
||||
uuid!: string;
|
||||
export class AceEditorComponent extends AceEditorBase {
|
||||
|
||||
|
||||
constructor(
|
||||
private editorsService: EditorsService,
|
||||
private lspService: LSPService
|
||||
) {}
|
||||
) {
|
||||
super();
|
||||
}
|
||||
|
||||
|
||||
public ngAfterViewInit(): void {
|
||||
@ -46,7 +43,74 @@ export class AceEditorComponent {
|
||||
|
||||
this.editor = ace.edit( this.editorElm.nativeElement );
|
||||
this.editor.setOptions( this.editorSettings.CONFIG );
|
||||
// this.editor.commands.addCommands( this.editorSettings.KEYBINDINGS );
|
||||
// this.editor.commands.addCommands( this.editorSettings.KEYBINDINGS );
|
||||
this.editor.commands.addCommands([
|
||||
{
|
||||
name: "search",
|
||||
bindKey: {win: "ctrl-f", mac: "ctrl-f"},
|
||||
exec: () => {
|
||||
this.search();
|
||||
},
|
||||
readOnly: true
|
||||
}, {
|
||||
name: "movelinesUp",
|
||||
bindKey: {win: "ctrl-up", mac: "ctrl-up"},
|
||||
exec: () => {
|
||||
this.movelinesUp();
|
||||
},
|
||||
readOnly: true
|
||||
}, {
|
||||
name: "movelinesDown",
|
||||
bindKey: {win: "ctrl-down", mac: "ctrl-down"},
|
||||
exec: () => {
|
||||
this.movelinesDown();
|
||||
},
|
||||
readOnly: true
|
||||
},
|
||||
{
|
||||
name: "duplicateLines",
|
||||
bindKey: {win: "ctrl-d", mac: "ctrl-d"},
|
||||
exec: () => {
|
||||
this.duplicateLines();
|
||||
},
|
||||
readOnly: true
|
||||
}, {
|
||||
name: "zoomIn",
|
||||
bindKey: {win: "ctrl-=", mac: "ctrl-="},
|
||||
exec: () => {
|
||||
this.zoomIn();
|
||||
},
|
||||
readOnly: true
|
||||
}, {
|
||||
name: "zoomOut",
|
||||
bindKey: {win: "ctrl--", mac: "ctrl--"},
|
||||
exec: () => {
|
||||
this.zoomOut();
|
||||
},
|
||||
readOnly: true
|
||||
}, {
|
||||
name: "cutToBuffer",
|
||||
bindKey: {win: "ctrl-k", mac: "ctrl-k"},
|
||||
exec: () => {
|
||||
this.cutToBuffer();
|
||||
},
|
||||
readOnly: true
|
||||
}, {
|
||||
name: "pasteCutBuffer",
|
||||
bindKey: {win: "ctrl-u", mac: "ctrl-u"},
|
||||
exec: () => {
|
||||
this.pasteCutBuffer();
|
||||
},
|
||||
readOnly: true
|
||||
}, {
|
||||
name: "destroySession",
|
||||
bindKey: {win: "ctrl-w", mac: "ctrl-w"},
|
||||
exec: () => {
|
||||
this.editor.session.destroy();
|
||||
},
|
||||
readOnly: true
|
||||
}
|
||||
]);
|
||||
|
||||
// Note: https://github.com/mkslanc/ace-linters/blob/c286d85c558530aa1b0597d02108bc782abd4736/packages/ace-linters/src/language-provider.ts#L277
|
||||
// found on focus ^ might have other signals we can watch like session being set, etc.
|
||||
@ -54,14 +118,9 @@ export class AceEditorComponent {
|
||||
this.editorsService.setActiveEditor(this.uuid);
|
||||
});
|
||||
|
||||
// this.editor.on("changeSession", (session) => {
|
||||
// console.log(session);
|
||||
// console.log(session.session["$modeId"]);
|
||||
// });
|
||||
}
|
||||
|
||||
public registerEditorToLSPMode() {
|
||||
this.lspService.registerEditor(this.editor);
|
||||
this.editor.on("changeSession", (session) => {
|
||||
this.lspService.registerEditor(this.editor);
|
||||
});
|
||||
}
|
||||
|
||||
}
|
@ -84,9 +84,8 @@ export class EditorsComponent {
|
||||
if ( !session ) return;
|
||||
|
||||
let editorComponent = this.editors.get(this.activeEditor)?.instance;
|
||||
let editor = editorComponent.editor;
|
||||
let editor = editorComponent.editor;
|
||||
editor?.setSession(session);
|
||||
editorComponent.registerEditorToLSPMode();
|
||||
});
|
||||
}
|
||||
|
||||
|
Loading…
Reference in New Issue
Block a user