diff --git a/package-lock.json b/package-lock.json index f485906..88dce80 100644 --- a/package-lock.json +++ b/package-lock.json @@ -7470,9 +7470,9 @@ "integrity": "sha512-nG96G3Wp6acyAgJqGasjODb+acrI7KltPiRxzHPXnP3NgI28bpQDRv53olbqGXbfcgF5aiiHmO3xpwEpS5Ld9g==" }, "node_modules/@types/node": { - "version": "20.9.1", - "resolved": "https://registry.npmjs.org/@types/node/-/node-20.9.1.tgz", - "integrity": "sha512-HhmzZh5LSJNS5O8jQKpJ/3ZcrrlG6L70hpGqMIAoM9YVD0YBRNWYsfwcXq8VnSjlNpCpgLzMXdiPo+dxcvSmiA==", + "version": "20.9.2", + "resolved": "https://registry.npmjs.org/@types/node/-/node-20.9.2.tgz", + "integrity": "sha512-WHZXKFCEyIUJzAwh3NyyTHYSR35SevJ6mZ1nWwJafKtiQbqRTIKSRcw3Ma3acqgsent3RRDqeVwpHntMk+9irg==", "dependencies": { "undici-types": "~5.26.4" } @@ -23468,6 +23468,7 @@ "@angular/cli": "^17.0.1", "@angular/compiler-cli": "^17.0.0", "@types/jasmine": "~5.1.0", + "@types/node": "^20.9.2", "jasmine-core": "~5.1.0", "karma": "~6.4.0", "karma-chrome-launcher": "~3.2.0", diff --git a/packages/bridge-ui/package.json b/packages/bridge-ui/package.json index ddd5a53..57e8859 100644 --- a/packages/bridge-ui/package.json +++ b/packages/bridge-ui/package.json @@ -31,6 +31,7 @@ "@angular/cli": "^17.0.1", "@angular/compiler-cli": "^17.0.0", "@types/jasmine": "~5.1.0", + "@types/node": "^20.9.2", "jasmine-core": "~5.1.0", "karma": "~6.4.0", "karma-chrome-launcher": "~3.2.0", diff --git a/packages/bridge-ui/src/app/components/upload-replay-dialog/upload-replay-dialog.component.html b/packages/bridge-ui/src/app/components/upload-replay-dialog/upload-replay-dialog.component.html new file mode 100644 index 0000000..9af9522 --- /dev/null +++ b/packages/bridge-ui/src/app/components/upload-replay-dialog/upload-replay-dialog.component.html @@ -0,0 +1,16 @@ +
+ +

Replay Upload

+
+ File + {{fileName || "No file uploaded yet."}} + +
+ + + + +
diff --git a/packages/bridge-ui/src/app/components/upload-replay-dialog/upload-replay-dialog.component.scss b/packages/bridge-ui/src/app/components/upload-replay-dialog/upload-replay-dialog.component.scss new file mode 100644 index 0000000..b1bc93e --- /dev/null +++ b/packages/bridge-ui/src/app/components/upload-replay-dialog/upload-replay-dialog.component.scss @@ -0,0 +1,16 @@ +.file-input { + display: none; +} + +.signInForm { + width: 400px; + padding: 12px 24px 24px; + + igx-input-group + igx-input-group { + margin-top: 24px; + } + } + + .full-width { + width: 100%; + } \ No newline at end of file diff --git a/packages/bridge-ui/src/app/components/upload-replay-dialog/upload-replay-dialog.component.spec.ts b/packages/bridge-ui/src/app/components/upload-replay-dialog/upload-replay-dialog.component.spec.ts new file mode 100644 index 0000000..947c06d --- /dev/null +++ b/packages/bridge-ui/src/app/components/upload-replay-dialog/upload-replay-dialog.component.spec.ts @@ -0,0 +1,23 @@ +import { ComponentFixture, TestBed } from '@angular/core/testing'; + +import { UploadReplayDialogComponent } from './upload-replay-dialog.component'; + +describe('UploadReplayDialogComponent', () => { + let component: UploadReplayDialogComponent; + let fixture: ComponentFixture; + + beforeEach(async () => { + await TestBed.configureTestingModule({ + imports: [UploadReplayDialogComponent] + }) + .compileComponents(); + + fixture = TestBed.createComponent(UploadReplayDialogComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/packages/bridge-ui/src/app/components/upload-replay-dialog/upload-replay-dialog.component.ts b/packages/bridge-ui/src/app/components/upload-replay-dialog/upload-replay-dialog.component.ts new file mode 100644 index 0000000..1dddb45 --- /dev/null +++ b/packages/bridge-ui/src/app/components/upload-replay-dialog/upload-replay-dialog.component.ts @@ -0,0 +1,58 @@ +import { Component } from '@angular/core'; +import { CommonModule } from '@angular/common'; +import { ReactiveFormsModule, FormControl } from '@angular/forms'; +import { FormsModule } from '@angular/forms'; + +import { MatDialog, MAT_DIALOG_DATA, MatDialogRef, MatDialogTitle, + MatDialogContent, MatDialogActions, MatDialogClose,} from '@angular/material/dialog'; + +import { MatButtonModule } from '@angular/material/button'; +import { MatDialogModule } from '@angular/material/dialog'; +import { MatInputModule } from '@angular/material/input'; +import { MatFormFieldModule } from '@angular/material/form-field'; +import { MatIconModule } from '@angular/material/icon'; + +@Component({ + selector: 'app-upload-replay-dialog', + standalone: true, + imports: [ + CommonModule, + ReactiveFormsModule, + MatButtonModule, + MatDialogModule, + MatInputModule, + MatFormFieldModule, + FormsModule, + MatDialogTitle, + MatDialogContent, + MatDialogActions, + MatDialogClose, + MatIconModule, + ], + templateUrl: './upload-replay-dialog.component.html', + styleUrl: './upload-replay-dialog.component.scss' +}) +export class UploadReplayDialogComponent { + fileName: string = ""; + file?: File; + + onFileSelected(event: any) { + const file: File = event.target.files[0]; + if (file) + { + this.fileName = file.name; + this.file = file; + } + } + + onClickSubmit() { + /* + let formData = new FormData(); + formData.append("file", file); + let local = this.seasonId.seasonId; + formData.append("seasonId", local); + const upload$ = this.apiService.postReplayUpload(formData); + upload$.subscribe(); + */ + } +} diff --git a/packages/bridge-ui/src/app/pages/season-details/season-details.component.ts b/packages/bridge-ui/src/app/pages/season-details/season-details.component.ts index 43cf928..e753a1d 100644 --- a/packages/bridge-ui/src/app/pages/season-details/season-details.component.ts +++ b/packages/bridge-ui/src/app/pages/season-details/season-details.component.ts @@ -5,9 +5,11 @@ import { ActivatedRoute } from '@angular/router'; import { MatButtonModule } from '@angular/material/button'; import { MatDividerModule } from '@angular/material/divider'; import { MatTabsModule } from '@angular/material/tabs'; +import { MatDialog } from '@angular/material/dialog'; import { RaceDetailsComponent } from '../../components/race-details/race-details.component'; import { SeasonStandingsComponent } from '../../components/season-standings/season-standings.component'; +import { UploadReplayDialogComponent } from '../../components/upload-replay-dialog/upload-replay-dialog.component'; import { SeasonsService } from '../../services/seasons.service'; import { RacesService } from '../../services/races.service'; @@ -24,6 +26,7 @@ import { Race } from '../../models/race.model'; MatTabsModule, RaceDetailsComponent, SeasonStandingsComponent, + UploadReplayDialogComponent ], templateUrl: './season-details.component.html', styleUrl: './season-details.component.scss' @@ -36,6 +39,7 @@ export class SeasonDetailsComponent { private route: ActivatedRoute, private seasonsService: SeasonsService, private racesService: RacesService, + private dialog: MatDialog, ) {} ngOnInit() { @@ -58,6 +62,6 @@ export class SeasonDetailsComponent { } openUploadReplayDialog(id: string) { - + this.dialog.open(UploadReplayDialogComponent); } }