mrtoth/frontend-tutorial-framework
1
0
Fork 0
mirror of https://github.com/avatao-content/frontend-tutorial-framework synced 2025-06-28 16:25:12 +00:00
Code Issues Releases Wiki Activity

Replace ACE with monaco – with lots of UI issues

Browse Source
This commit is contained in:
Kristóf Tóth
2018-06-05 01:12:24 +02:00
parent 309ffca9e7
commit 0fbaf2275e
6 changed files with 275 additions and 361 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
src/app/ide/ide.component.html
View File

@ -37,11 +37,17 @@
</div>
</div>
<div (keyup)="setCodeState(CodeState.DIRTY); setDeployButtonState(DeployButtonState.TODEPLOY); resetAutoSaveCountdown()"
<!--div (keyup)="setCodeState(CodeState.DIRTY); setDeployButtonState(DeployButtonState.TODEPLOY); resetAutoSaveCountdown()"
ace-editor
[(text)]="code"
[mode]="language"
[theme]="theme"
[options]="options"
class="tfw-ace-editor">
</div>
</div-->
<ngx-monaco-editor [(ngModel)]="code"
class="tfw-ace-editor"
(keyup)="setCodeState(CodeState.DIRTY); setDeployButtonState(DeployButtonState.TODEPLOY); resetAutoSaveCountdown()"
[options]="editorOptions"
></ngx-monaco-editor>

20
src/app/ide/ide.component.ts
View File

@ -3,20 +3,6 @@
import { ChangeDetectorRef, Component, EventEmitter, OnInit, Output } from '@angular/core';
import * as brace from 'brace';
import 'brace/ext/modelist';
import 'brace/ext/language_tools';
import 'brace/mode/c_cpp';
import 'brace/mode/csharp';
import 'brace/mode/java';
import 'brace/mode/typescript';
import 'brace/mode/javascript';
import 'brace/mode/json';
import 'brace/mode/python';
import 'brace/mode/sql';
import 'brace/theme/cobalt';
import { IDECommand } from '../message-types/ide-command';
import { WebSocketService } from '../services/websocket.service';
import { ProcessManagerService } from '../services/processmanager.service';
@ -24,9 +10,6 @@ import { DeploymentNotificationService } from '../services/deployment-notificati
import { config } from '../config';
import { CommandMessage } from '../message-types/command-message';
const modelist = brace.acequire('ace/ext/modelist');
const langTools = brace.acequire('ace/ext/language_tools');
enum DeployButtonState {
DEPLOYED,
@ -63,7 +46,7 @@ export class IdeComponent implements OnInit {
autosave = null;
language: string = config.ide.defaultLanguage;
theme = 'cobalt';
editorOptions = {theme: 'vs-dark', language: 'python'};
@Output() newLogs = new EventEmitter<any>();
@ -125,7 +108,6 @@ export class IdeComponent implements OnInit {
this.filename = data.filename;
this.directory = data.directory;
this.code = (data.content != null) ? data.content : this.code;
this.language = modelist.getModeForPath(this.filename).name;
this.files = data.files;
}