Add a Match/Team Selection screen to the scouting web page
Now we can start working on actually submitting scouting data.
Signed-off-by: Philipp Schrader <philipp.schrader@gmail.com>
Change-Id: Ie26a80d0db317625590efc10cb67c4b176bdc124
diff --git a/package.json b/package.json
index 5d8775b..d16aed7 100644
--- a/package.json
+++ b/package.json
@@ -7,6 +7,7 @@
"@angular/compiler": "13.2.0",
"@angular/compiler-cli": "13.2.0",
"@angular/core": "13.2.0",
+ "@angular/forms": "13.2.0",
"@angular/platform-browser": "13.2.0",
"@angular/cli": "13.2.0",
"@babel/cli": "^7.6.0",
diff --git a/scouting/scouting_test.ts b/scouting/scouting_test.ts
index 9ee9122..68dba52 100644
--- a/scouting/scouting_test.ts
+++ b/scouting/scouting_test.ts
@@ -27,6 +27,6 @@
it('should display: This is an app.', async () => {
await page.navigateTo();
- expect(await page.getParagraphText()).toEqual('Auto');
+ expect(await page.getParagraphText()).toEqual('Team Selection');
});
});
diff --git a/scouting/www/app.ng.html b/scouting/www/app.ng.html
index d7c1b22..f763b7d 100644
--- a/scouting/www/app.ng.html
+++ b/scouting/www/app.ng.html
@@ -2,4 +2,4 @@
<!--<div class="row">
<h1 class="text-end">Match {{matchNumber}}, Team {{teamNumber}}</h1>
</div>-->
-<app-entry></app-entry>
\ No newline at end of file
+<app-entry></app-entry>
diff --git a/scouting/www/app.ts b/scouting/www/app.ts
index c9d5ca1..f6247d3 100644
--- a/scouting/www/app.ts
+++ b/scouting/www/app.ts
@@ -5,6 +5,4 @@
templateUrl: './app.ng.html',
})
export class App {
- matchNumber: number = 1; //placeholder
- teamNumber: number = 971; //placeholder
}
diff --git a/scouting/www/entry/BUILD b/scouting/www/entry/BUILD
index 8f46de7..0d0e7f6 100644
--- a/scouting/www/entry/BUILD
+++ b/scouting/www/entry/BUILD
@@ -16,5 +16,6 @@
deps = [
"@npm//@angular/common",
"@npm//@angular/core",
+ "@npm//@angular/forms",
],
)
diff --git a/scouting/www/entry/entry.component.ts b/scouting/www/entry/entry.component.ts
index a1cffc3..0e7223b 100644
--- a/scouting/www/entry/entry.component.ts
+++ b/scouting/www/entry/entry.component.ts
@@ -1,6 +1,6 @@
import { Component, OnInit } from '@angular/core';
-type Section = 'Auto'|'TeleOp'|'Climb'|'Defense'|'Review and Submit'|'Home'
+type Section = 'Team Selection'|'Auto'|'TeleOp'|'Climb'|'Defense'|'Review and Submit'|'Home'
type Level = 'Low'|'Medium'|'High'|'Transversal'
@Component({
@@ -9,7 +9,9 @@
styleUrls: ['./entry.component.css']
})
export class EntryComponent {
- section: Section = 'Auto'; //placeholder
+ section: Section = 'Team Selection';
+ matchNumber: number = 1
+ teamNumber: number = 1
autoUpperShotsMade: number = 0;
autoLowerShotsMade: number = 0;
autoShotsMissed: number = 0;
@@ -59,7 +61,9 @@
}
nextSection() {
- if (this.section === 'Auto') {
+ if (this.section === 'Team Selection') {
+ this.section = 'Auto';
+ } else if (this.section === 'Auto') {
this.section = 'TeleOp';
} else if (this.section === 'TeleOp') {
this.section = 'Climb';
@@ -73,7 +77,9 @@
}
prevSection() {
- if (this.section === 'TeleOp') {
+ if (this.section === 'Auto') {
+ this.section = 'Team Selection';
+ } else if (this.section === 'TeleOp') {
this.section = 'Auto';
} else if (this.section === 'Climb') {
this.section = 'TeleOp';
diff --git a/scouting/www/entry/entry.module.ts b/scouting/www/entry/entry.module.ts
index d454c2e..35ecd26 100644
--- a/scouting/www/entry/entry.module.ts
+++ b/scouting/www/entry/entry.module.ts
@@ -1,11 +1,12 @@
import {NgModule} from '@angular/core';
import {CommonModule} from '@angular/common';
import {EntryComponent} from './entry.component';
+import {FormsModule} from '@angular/forms';
@NgModule({
declarations: [EntryComponent],
exports: [EntryComponent],
- imports: [CommonModule],
+ imports: [CommonModule, FormsModule],
})
export class EntryModule {
}
diff --git a/scouting/www/entry/entry.ng.html b/scouting/www/entry/entry.ng.html
index da77ce6..a1c248c 100644
--- a/scouting/www/entry/entry.ng.html
+++ b/scouting/www/entry/entry.ng.html
@@ -3,6 +3,20 @@
</div>
<ng-container [ngSwitch]="section">
+ <div *ngSwitchCase="'Team Selection'" id="team_selection" class="container-fluid">
+ <div class="row">
+ <label for="match_number">Match Number</label>
+ <input [(ngModel)]="matchNumber" type="number" id="match_number" min="1" max="999">
+ </div>
+ <div class="row">
+ <label for="team_number">Team Number</label>
+ <input [(ngModel)]="teamNumber" type="number" id="team_number" min="1" max="9999">
+ </div>
+ <div class="text-right">
+ <button class="btn btn-primary" (click)="nextSection()">Next</button>
+ </div>
+ </div>
+
<div *ngSwitchCase="'Auto'" id="auto" class="container-fluid">
<div class="row">
<!--Image here-->
@@ -158,6 +172,12 @@
</div>
<div *ngSwitchCase="'Review and Submit'" id="review" class="container-fluid">
+ <h4>Team Selection</h4>
+ <ul>
+ <li>Match number: {{matchNumber}}</li>
+ <li>Team number: {{teamNumber}}</li>
+ </ul>
+
<h4>Auto</h4>
<ul>
<li>Upper Shots Made: {{autoUpperShotsMade}}</li>
diff --git a/yarn.lock b/yarn.lock
index a20b10c..e76092f 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -103,6 +103,13 @@
dependencies:
tslib "^2.3.0"
+"@angular/forms@13.2.0":
+ version "13.2.0"
+ resolved "https://registry.yarnpkg.com/@angular/forms/-/forms-13.2.0.tgz#67d505c09175d1ba809be721303316db7b0c60d4"
+ integrity sha512-aduXLuvqynDRRdb316yY1O5rdMQ2DKeNxu5P2FG1nkLQ3hqZvpiaUMhFyXvKDG3s0rV5e/PZs1cpg0Aqdfwevw==
+ dependencies:
+ tslib "^2.3.0"
+
"@angular/platform-browser@13.2.0":
version "13.2.0"
resolved "https://registry.yarnpkg.com/@angular/platform-browser/-/platform-browser-13.2.0.tgz#d8a309c231dec646ab1dad28240466a00151b54b"