mirror of
https://github.com/avatao-content/frontend-tutorial-framework
synced 2024-11-10 19:47:17 +00:00
45 lines
1.8 KiB
HTML
45 lines
1.8 KiB
HTML
|
<div class="tfw-grid-ide-statusbar">
|
||
|
<div class="btn-group btn-group-sm flex-wrap tao-grid-center-left">
|
||
|
<button *ngFor="let file of files"
|
||
|
class="btn tfw-tab-btn"
|
||
|
(click)="tabSwitchButtonHandler(file)"
|
||
|
[class.active]="filename === file"
|
||
|
[class.disabled]="filename === file"
|
||
|
[disabled]="filename === file"
|
||
|
[class.tao-tab-btn-saved]="filename === file && codeState === 'SAVED'">
|
||
|
<span *ngIf="filename !== file">{{file}}</span>
|
||
|
<span *ngIf="filename === file"
|
||
|
[class.underline]="codeState === 'DIRTY'">{{file}}</span>
|
||
|
</button>
|
||
|
</div>
|
||
|
|
||
|
<div class="btn-group-sm tfw-deploy-btn-group">
|
||
|
<button *ngIf="showDeployButton"
|
||
|
type="submit"
|
||
|
class="btn tfw-deploy-btn tao-grid-top-center"
|
||
|
(click)="sendCodeIfDirty(); deployCode()"
|
||
|
[disabled]="deployButtonState === 'DEPLOYING' || deployButtonState === 'DEPLOYED'"
|
||
|
[class.deployed]="deployButtonState === 'DEPLOYED'"
|
||
|
[class.deploy]="deployButtonState === 'DEPLOYING'"
|
||
|
[class.disabled]="deployButtonState === 'DEPLOYING' || deployButtonState === 'DEPLOYED'"
|
||
|
[class.failed]="deployButtonState === 'FAILED'"
|
||
|
>
|
||
|
<span *ngIf="deployButtonState === 'TODEPLOY'">Deploy</span>
|
||
|
<span *ngIf="deployButtonState === 'DEPLOYED'">
|
||
|
<img src="images/greentick_icon.svg"/>
|
||
|
<span>Deployed</span>
|
||
|
</span>
|
||
|
<span *ngIf="deployButtonState === 'DEPLOYING'"><div class="loader"></div>Reloading app...</span>
|
||
|
<span *ngIf="deployButtonState === 'FAILED'">Deployment failed. Retry</span></button>
|
||
|
</div>
|
||
|
</div>
|
||
|
|
||
|
<div (keyup)="setCodeState('DIRTY'); setDeployButtonState('TODEPLOY'); resetAutoSaveCountdown()"
|
||
|
ace-editor
|
||
|
[(text)]="code"
|
||
|
[mode]="language"
|
||
|
[theme]="theme"
|
||
|
class="tfw-ace-editor"
|
||
|
>
|
||
|
</div>
|