mrtoth/frontend-tutorial-framework
1
0
Fork 0
mirror of https://github.com/avatao-content/frontend-tutorial-framework synced 2024-10-05 06:13:37 +00:00
Code Issues Releases Wiki Activity

Implement save saving... saved! button magic. Refactor via enum

Browse Source
This commit is contained in:
Kristóf Tóth 2018-02-09 14:30:37 +01:00
parent 9030df0a2b
commit d0a35b53d3
3 changed files with 18 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -4,4 +4,5 @@ export class SourceCode {
language: string; language: string;
files: string[]; files: string[];
saved: boolean; saved: boolean;
command: string;
} }

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

@ -2,7 +2,8 @@
<button *ngFor="let file of files" <button *ngFor="let file of files"
class="btn btn-secondary" class="btn btn-secondary"
[class.active]="filename === file" [class.active]="filename === file"
(click)="selectCode(file); requestCode();"> [class.disabled]="filename === file"
(click)="selectCode(file); requestCode()">
{{file}} {{file}}
</button> </button>
</div> </div>
@ -17,7 +18,17 @@
</div> </div>
<button (click)="sendCode()" <button (click)="sendCode()"
[disabled]="saving === true"
type="submit" type="submit"
class="btn btn-secondary" class="btn btn-secondary"
[class.btn-success]="saved === true" [class.btn-success]="saved === true"
>Save<span *ngIf="saved === true">d!</span></button> [class.btn-warning]="saving === true"
[class.disabled]="saving === true"
><span *ngIf="saved === false && saving === false">Save</span>
<span *ngIf="saved === true && saving === false">Saved!</span>
<span *ngIf="saved === false && saving === true">Saving...</span></button>
<span *ngIf="saved === true">Saved</span>
<span *ngIf="saving === true">Saving</span>
<span *ngIf="saved === false">Not Saved</span>
<span *ngIf="saving === false">Not Saving</span>

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

@ -21,6 +21,7 @@ export class WebideComponent implements OnInit {
theme = 'monokai'; theme = 'monokai';
files: string[]; files: string[];
saved = false; saved = false;
saving = false;
constructor(private webSocketService: WebSocketService) { } constructor(private webSocketService: WebSocketService) { }
@ -30,7 +31,7 @@ export class WebideComponent implements OnInit {
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.files = event.data.files;
this.saved = event.data.saved; if (event.data.command === 'write') { this.saved = true; this.saving = false; }
}); });
this.requestCode(); this.requestCode();
} }
@ -40,6 +41,8 @@ export class WebideComponent implements OnInit {
'command': 'write', 'command': 'write',
'content': this.code 'content': this.code
}); });
this.saving = true;
this.saved = false;
} }
requestCode() { requestCode() {