mrtoth/frontend-tutorial-framework
1
0
Fork 0
mirror of https://github.com/avatao-content/frontend-tutorial-framework synced 2024-10-05 07:23:37 +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; filename: string;
content: string; content: string;
language: string; language: string;
files: string[];
} }

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

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

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

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