diff --git a/package-lock.json b/package-lock.json
index 9adce6c..912f416 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,6 +1,6 @@
{
"name": "megaman2",
- "version": "0.1.0",
+ "version": "0.2.0",
"lockfileVersion": 1,
"requires": true,
"dependencies": {
diff --git a/package.json b/package.json
index 72bfbd6..b906c05 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
{
"name": "megaman2",
- "version": "0.1.0",
+ "version": "0.2.0",
"scripts": {
"ng": "ng",
"start": "ng serve",
diff --git a/src/app/app.module.ts b/src/app/app.module.ts
index 623b8ab..4bde3fe 100644
--- a/src/app/app.module.ts
+++ b/src/app/app.module.ts
@@ -3,11 +3,13 @@ import { NgModule } from '@angular/core';
import { AppComponent } from './app.component';
import { Megaman2Component } from './components/megaman2/megaman2.component';
+import { PasswordBoardComponent } from './components/password-board/password-board.component';
@NgModule({
declarations: [
AppComponent,
- Megaman2Component
+ Megaman2Component,
+ PasswordBoardComponent
],
imports: [
BrowserModule
diff --git a/src/app/components/megaman2/megaman2.component.html b/src/app/components/megaman2/megaman2.component.html
index fa670a7..16ad1a8 100644
--- a/src/app/components/megaman2/megaman2.component.html
+++ b/src/app/components/megaman2/megaman2.component.html
@@ -1,9 +1,10 @@
+
{{ passwordCoordinates }}
-E-tanks: {{ password.currentEtanks }}
+{{ password.currentEtanks }} E-tanks
diff --git a/src/app/components/password-board/password-board.component.css b/src/app/components/password-board/password-board.component.css
new file mode 100644
index 0000000..cf6a08f
--- /dev/null
+++ b/src/app/components/password-board/password-board.component.css
@@ -0,0 +1,11 @@
+table {
+ border-collapse: collapse;
+}
+
+td {
+ border: 1px solid black;
+}
+
+.hide {
+ border: none;
+}
\ No newline at end of file
diff --git a/src/app/components/password-board/password-board.component.html b/src/app/components/password-board/password-board.component.html
new file mode 100644
index 0000000..ba736e9
--- /dev/null
+++ b/src/app/components/password-board/password-board.component.html
@@ -0,0 +1,18 @@
+
+
+ |
+ 1 |
+ 2 |
+ 3 |
+ 4 |
+ 5 |
+
+
+ {{ row[0] }} |
+ {{ row[1] }} |
+ {{ row[2] }} |
+ {{ row[3] }} |
+ {{ row[4] }} |
+ {{ row[5] }} |
+
+
\ No newline at end of file
diff --git a/src/app/components/password-board/password-board.component.spec.ts b/src/app/components/password-board/password-board.component.spec.ts
new file mode 100644
index 0000000..7a214eb
--- /dev/null
+++ b/src/app/components/password-board/password-board.component.spec.ts
@@ -0,0 +1,25 @@
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { PasswordBoardComponent } from './password-board.component';
+
+describe('PasswordBoardComponent', () => {
+ let component: PasswordBoardComponent;
+ let fixture: ComponentFixture
;
+
+ beforeEach(async(() => {
+ TestBed.configureTestingModule({
+ declarations: [ PasswordBoardComponent ]
+ })
+ .compileComponents();
+ }));
+
+ beforeEach(() => {
+ fixture = TestBed.createComponent(PasswordBoardComponent);
+ component = fixture.componentInstance;
+ fixture.detectChanges();
+ });
+
+ it('should create', () => {
+ expect(component).toBeTruthy();
+ });
+});
diff --git a/src/app/components/password-board/password-board.component.ts b/src/app/components/password-board/password-board.component.ts
new file mode 100644
index 0000000..1aa7cf6
--- /dev/null
+++ b/src/app/components/password-board/password-board.component.ts
@@ -0,0 +1,43 @@
+import { Component, Input } from '@angular/core';
+import { Coordinate as xy } from 'src/app/models/coordinate.model';
+
+@Component({
+ selector: 'mm2-password-board',
+ templateUrl: './password-board.component.html',
+ styleUrls: ['./password-board.component.css']
+})
+export class PasswordBoardComponent {
+
+ @Input()
+ data: Array = [];
+
+ get rows(): any {
+ const rows = [];
+ for (let x of this.rowHeader) {
+ const newRow = [x];
+ for (let y of this.colHeader) {
+ const marker = this.getMarker(x, y);
+ newRow.push(marker);
+ }
+ rows.push(newRow);
+ }
+ return rows;
+ }
+
+ // LOWER LEVEL IMPLEMENTATION DETAILS
+
+ private getMarker(x: string, y: string): string {
+ const target = `${x}${y}`;
+ const wasFound = this.data.find(candidate => candidate.xy === target);
+ return wasFound ? '*' : '';
+ }
+
+ private get colHeader(): Array {
+ return ['1', '2', '3', '4', '5'];
+ }
+
+ private get rowHeader(): Array {
+ return ['A', 'B', 'C', 'D', 'E'];
+ }
+
+}