File
Implements
Metadata
selector |
app-submit-try-code |
styleUrls |
./submit-try-code.component.scss |
templateUrl |
./submit-try-code.component.html |
Index
Properties
|
|
Methods
|
|
Inputs
|
|
Methods
reset
|
reset(file: File, testcases: string[])
|
|
Parameters :
Name |
Type |
Optional |
file |
File
|
No
|
testcases |
string[]
|
No
|
|
isActive
|
Default value : false
|
|
submitting
|
Type : number
|
Default value : 0
|
|
import {Component, Input, OnInit} from '@angular/core';
// import {Problem} from '../problem';
import {RunCodeService} from '../run-code.service';
import {Question} from '../question';
import {FileService} from '../file.service';
import {ApiService} from '../api.service';
import {File} from '../file';
@Component({
selector: 'app-submit-try-code',
templateUrl: './submit-try-code.component.html',
styleUrls: ['./submit-try-code.component.scss']
})
export class SubmitTryCodeComponent implements OnInit {
isActive = false;
nts: number[];
status: number[];
@Input() question: Question;
submitting = 0;
constructor(public runCodeService: RunCodeService, private fileService: FileService, private apiService: ApiService) { }
ngOnInit(): void { }
reset(file: File, testcases: string[]): void {
console.log(file, testcases);
this.nts = [0, 1]; // Array(this.problem.n_testcases[this.submitting]).fill(1).map((x, i) => i);
this.status = [0, 0]; // Array(this.problem.n_testcases[this.submitting]).fill(0);
for (const i of this.nts) {
this.runCodeService.executeFile(file, testcases[i])
.subscribe(ret => {
console.log(ret);
let nc = 0;
this.runCodeService.verifyTestcase(file, ret, i, this.submitting)
.subscribe(data => {
this.status[i] = data === 1 ? 1 : -1;
nc += data === 1 ? 1 : 0;
if (nc === 2) {
this.runCodeService.update(true);
} else if (i === 1) {
this.runCodeService.update(false);
}
});
});
}
}
}
<div [class.open]="isActive" id="compile-cover"></div>
<div [class.open]="isActive" id="compile-popup">
<div id="testcase-grid">
<div *ngFor="let i of nts" class="testcase-status-div" [class.failed]="status[i] === -1" [class.successful]="status[i] === 1">Testcase {{i}}</div>
</div>
<div>
<button id="compile-done" (click)="isActive = false;">Done</button>
</div>
</div>
#compile-popup {
position: fixed;
top: 50%;
width: 50vw;
left: calc(25vw - 20px);
border-bottom: 1px solid #ddf;
padding: 20px;
background: #224;
transform: translateY(-50%) scale(0);
opacity: 0;
transition: all 0.25s;
z-index: 1000;
&.open {
transform: translateY(-50%) scale(1);
opacity: 1;
}
}
#compile-done {
float: right;
}
#compile-cover {
z-index: 999;
position: fixed;
top: 0;
left: 0;
width: 100vw;
height: 100vh;
display: none;
&.open {
display: block;
}
}
#testcase-grid {
display: grid;
grid-template-columns: auto auto auto;
}
.testcase-status-div {
margin: 10px;
padding: 10px;
display: flex;
justify-content: center;
color: #ddf;
border-bottom: 1px solid #ddf;
animation: blink 1s infinite;
&.failed {
animation: none;
border-color: #802;
background-color: #8028;
}
&.successful {
animation: none;
border-color:#082;
background-color: #0828;
}
}
@keyframes blink {
0%, 100% {
border-color: transparent;
}
50% {
border-color: #ddf;
}
}
Legend
Html element with directive