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

Implement multiple webide tabs

Browse Source
This commit is contained in:
Kristóf Tóth 2018-02-07 14:51:37 +01:00
parent a9d2dd57bc
commit ec4f70cd12
3 changed files with 10 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
src/app/webide/source-code.ts
View File

@ -2,4 +2,5 @@ export class SourceCode {
filename: string;
content: string;
language: string;
files: string[];
}

7
src/app/webide/webide.component.html
View File

@ -1,5 +1,8 @@
<input [(ngModel)]="filename">
<button (click)="selectCode(); requestCode()" type="submit" class="btn btn-primary">Select file</button>
<ul class="editor-tabs">
<li class="editor-li" *ngFor="let file of files">
<button class="editor-button" (click)="selectCode(file); requestCode();">{{file}}</button>
</li>
</ul>
<div
ace-editor

6
src/app/webide/webide.component.ts
View File

@ -19,6 +19,7 @@ export class WebideComponent implements OnInit {
code: string = defaultSourceCode;
language = 'javascript';
theme = 'monokai';
files: string[];
constructor(private webSocketService: WebSocketService) { }
@ -27,6 +28,7 @@ export class WebideComponent implements OnInit {
this.filename = event.data.filename;
this.code = event.data.content;
this.language = event.data.language;
this.files = event.data.files;
});
this.requestCode();
}
@ -44,10 +46,10 @@ export class WebideComponent implements OnInit {
});
}
selectCode() {
selectCode(filename: string) {
this.webSocketService.send(this.anchor_id, {
'command': 'select',
'filename': this.filename
'filename': filename
});
}
}