+
+
+
diff --git a/src/app/app.component.scss b/src/app/app.component.scss
new file mode 100644
index 0000000..0b74ae1
--- /dev/null
+++ b/src/app/app.component.scss
@@ -0,0 +1,14 @@
+:host {
+ display: flex;
+ flex-direction: column;
+ height: 100%;
+}
+
+.main {
+ flex: 1;
+ display: flex;
+ height: 100%;
+ flex-direction: column;
+ justify-content: center;
+ align-items: center;
+}
diff --git a/src/app/app.component.spec.ts b/src/app/app.component.spec.ts
index f1e6bed..0f1ce13 100644
--- a/src/app/app.component.spec.ts
+++ b/src/app/app.component.spec.ts
@@ -1,33 +1,31 @@
-/* tslint:disable:no-unused-variable */
-
import { TestBed, async } from '@angular/core/testing';
import { AppComponent } from './app.component';
describe('AppComponent', () => {
- beforeEach(() => {
+ beforeEach(async(() => {
TestBed.configureTestingModule({
declarations: [
AppComponent
],
- });
- });
+ }).compileComponents();
+ }));
- it('should create the app', async(() => {
- let fixture = TestBed.createComponent(AppComponent);
- let app = fixture.debugElement.componentInstance;
+ it('should create the app', () => {
+ const fixture = TestBed.createComponent(AppComponent);
+ const app = fixture.debugElement.componentInstance;
expect(app).toBeTruthy();
- }));
+ });
- it(`should have as title 'app works!'`, async(() => {
- let fixture = TestBed.createComponent(AppComponent);
- let app = fixture.debugElement.componentInstance;
- expect(app.title).toEqual('app works!');
- }));
+ it(`should have as title 'runman-pwa'`, () => {
+ const fixture = TestBed.createComponent(AppComponent);
+ const app = fixture.debugElement.componentInstance;
+ expect(app.title).toEqual('runman-pwa');
+ });
- it('should render title in a h1 tag', async(() => {
- let fixture = TestBed.createComponent(AppComponent);
+ it('should render title', () => {
+ const fixture = TestBed.createComponent(AppComponent);
fixture.detectChanges();
- let compiled = fixture.debugElement.nativeElement;
- expect(compiled.querySelector('h1').textContent).toContain('app works!');
- }));
+ const compiled = fixture.debugElement.nativeElement;
+ expect(compiled.querySelector('.content span').textContent).toContain('runman-pwa app is running!');
+ });
});
diff --git a/src/app/app.component.ts b/src/app/app.component.ts
index aadef89..9a8db0f 100644
--- a/src/app/app.component.ts
+++ b/src/app/app.component.ts
@@ -1,20 +1,9 @@
-import {Component, OnInit} from '@angular/core';
-import {Store} from "@ngrx/store";
-import {GameState} from "./store/game.state";
+import { Component } from '@angular/core';
@Component({
selector: 'app-root',
- templateUrl: './app.component.html'
+ templateUrl: './app.component.html',
+ styleUrls: ['./app.component.scss']
})
-export class AppComponent implements OnInit {
-
- gameState;
-
- constructor(private store: Store
-
-
-
-
-
diff --git a/src/app/components/about/about.component.spec.ts b/src/app/components/about/about.component.spec.ts
deleted file mode 100644
index 60979e9..0000000
--- a/src/app/components/about/about.component.spec.ts
+++ /dev/null
@@ -1,28 +0,0 @@
-/* tslint:disable:no-unused-variable */
-import { async, ComponentFixture, TestBed } from '@angular/core/testing';
-import { By } from '@angular/platform-browser';
-import { DebugElement } from '@angular/core';
-
-import { AboutComponent } from './about.component';
-
-describe('AboutComponent', () => {
- let component: AboutComponent;
- let fixture: ComponentFixtureArtificial Intelligence Project
-The aim of this project is to experiment A* search algorithm
-This game is written in Typescript, it doesn't use a game engine, just RxJS Observables
-Powered by Angular
- - - -Characters Sprites by Sithjester
- - - -Runman
- - - - - - -
-
-
diff --git a/src/app/components/grid/grid.component.spec.ts b/src/app/components/grid/grid.component.spec.ts
deleted file mode 100644
index 73a13fe..0000000
--- a/src/app/components/grid/grid.component.spec.ts
+++ /dev/null
@@ -1,28 +0,0 @@
-/* tslint:disable:no-unused-variable */
-import { async, ComponentFixture, TestBed } from '@angular/core/testing';
-import { By } from '@angular/platform-browser';
-import { DebugElement } from '@angular/core';
-
-import { GridComponent } from './grid.component';
-
-describe('GridComponent', () => {
- let component: GridComponent;
- let fixture: ComponentFixture
-
-
-
-
-
-
-
diff --git a/src/app/components/modal/modal.component.spec.ts b/src/app/components/modal/modal.component.spec.ts
deleted file mode 100644
index d53cca2..0000000
--- a/src/app/components/modal/modal.component.spec.ts
+++ /dev/null
@@ -1,28 +0,0 @@
-/* tslint:disable:no-unused-variable */
-import { async, ComponentFixture, TestBed } from '@angular/core/testing';
-import { By } from '@angular/platform-browser';
-import { DebugElement } from '@angular/core';
-
-import { ModalComponent } from './modal.component';
-
-describe('ResultComponent', () => {
- let component: ModalComponent;
- let fixture: ComponentFixture
-
-
-
-
-
-
-
-
diff --git a/src/app/components/point/point.component.spec.ts b/src/app/components/point/point.component.spec.ts
deleted file mode 100644
index d44951e..0000000
--- a/src/app/components/point/point.component.spec.ts
+++ /dev/null
@@ -1,28 +0,0 @@
-/* tslint:disable:no-unused-variable */
-import { async, ComponentFixture, TestBed } from '@angular/core/testing';
-import { By } from '@angular/platform-browser';
-import { DebugElement } from '@angular/core';
-
-import { PointComponent } from './point.component';
-
-describe('PointComponent', () => {
- let component: PointComponent;
- let fixture: ComponentFixture
-
-
-
-
-
-
-
diff --git a/src/app/components/result/result.component.spec.ts b/src/app/components/result/result.component.spec.ts
deleted file mode 100644
index 5843cd4..0000000
--- a/src/app/components/result/result.component.spec.ts
+++ /dev/null
@@ -1,28 +0,0 @@
-/* tslint:disable:no-unused-variable */
-import { async, ComponentFixture, TestBed } from '@angular/core/testing';
-import { By } from '@angular/platform-browser';
-import { DebugElement } from '@angular/core';
-
-import { ResultComponent } from './result.component';
-
-describe('ResultComponent', () => {
- let component: ResultComponent;
- let fixture: ComponentFixture{{text}}
-Your score: {{score}}
-
-
diff --git a/src/app/components/state-info/state-info.component.spec.ts b/src/app/components/state-info/state-info.component.spec.ts
deleted file mode 100644
index d4b7c40..0000000
--- a/src/app/components/state-info/state-info.component.spec.ts
+++ /dev/null
@@ -1,28 +0,0 @@
-/* tslint:disable:no-unused-variable */
-import { async, ComponentFixture, TestBed } from '@angular/core/testing';
-import { By } from '@angular/platform-browser';
-import { DebugElement } from '@angular/core';
-
-import { StateInfoComponent } from './state-info.component';
-
-describe('StateInfoComponent', () => {
- let component: StateInfoComponent;
- let fixture: ComponentFixture
-
- {{state.score}}
-
-
-
- {{state.time | date:" mm:ss"}}
-
-
-
-
-
-
diff --git a/src/app/components/state-message/state-message.component.spec.ts b/src/app/components/state-message/state-message.component.spec.ts
deleted file mode 100644
index cd4799b..0000000
--- a/src/app/components/state-message/state-message.component.spec.ts
+++ /dev/null
@@ -1,28 +0,0 @@
-/* tslint:disable:no-unused-variable */
-import { async, ComponentFixture, TestBed } from '@angular/core/testing';
-import { By } from '@angular/platform-browser';
-import { DebugElement } from '@angular/core';
-
-import { StateMessageComponent } from './state-message.component';
-
-describe('StateMessageComponent', () => {
- let component: StateMessageComponent;
- let fixture: ComponentFixture
-
-
-
- ![]()
-
-
- Grim reaper is coming... RUN!
-
-
diff --git a/src/app/components/tile/tile.component.spec.ts b/src/app/components/tile/tile.component.spec.ts
deleted file mode 100644
index 04ae515..0000000
--- a/src/app/components/tile/tile.component.spec.ts
+++ /dev/null
@@ -1,28 +0,0 @@
-/* tslint:disable:no-unused-variable */
-import { async, ComponentFixture, TestBed } from '@angular/core/testing';
-import { By } from '@angular/platform-browser';
-import { DebugElement } from '@angular/core';
-
-import { TileComponent } from './tile.component';
-
-describe('TileComponent', () => {
- let component: TileComponent;
- let fixture: ComponentFixture
-
-
-
+
+
+
+
+
+
+
+
+
diff --git a/src/app/game/component/player/player.component.scss b/src/app/game/component/player/player.component.scss
new file mode 100644
index 0000000..a5e30b4
--- /dev/null
+++ b/src/app/game/component/player/player.component.scss
@@ -0,0 +1,44 @@
+//.game-guard {
+// background-image: url('../../../../assets/img/guard.png');
+//}
+//
+//.game-hero {
+// background-image: url('../../../../assets/img/hero.png');
+//}
+//
+//.game-player {
+// background-image: url('../../../../assets/img/boy.png');
+//}
+//
+//.game-blood-effect {
+// background-image: url('../../../../assets/img/blood.png');
+//}
+
+.player {
+ z-index: 9999;
+ position: absolute;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+}
+
+.sprite {
+ max-height: 96%;
+ width: 100%;
+ height: 100%;
+ background-position-x: 0;
+}
+
+.idle {
+ animation: none !important;
+}
+
+.dead {
+ display: none;
+}
+
+.point {
+ width: 5px;
+ height: 5px;
+ border-radius: 50%;
+}
diff --git a/src/app/game/component/player/player.component.ts b/src/app/game/component/player/player.component.ts
new file mode 100644
index 0000000..15299e2
--- /dev/null
+++ b/src/app/game/component/player/player.component.ts
@@ -0,0 +1,55 @@
+import { Component, ChangeDetectionStrategy, Input, OnInit } from '@angular/core';
+import { PlayerSprites, PlayerStates, PlayerState } from '../../models';
+import { GameService } from '../../service/game.service';
+import { Observable } from 'rxjs';
+import { tap } from 'rxjs/operators';
+
+@Component({
+ selector: 'app-player',
+ templateUrl: './player.component.html',
+ styleUrls: ['./player.component.scss', './hero.scss', './guard.scss', './blood.scss', './flag.scss'],
+ changeDetection: ChangeDetectionStrategy.OnPush
+})
+export class PlayerComponent implements OnInit {
+
+ state$: Observable
+
+
diff --git a/src/app/game/component/point/point.component.scss b/src/app/game/component/point/point.component.scss
new file mode 100644
index 0000000..e69de29
diff --git a/src/app/game/component/point/point.component.ts b/src/app/game/component/point/point.component.ts
new file mode 100644
index 0000000..b9962f8
--- /dev/null
+++ b/src/app/game/component/point/point.component.ts
@@ -0,0 +1,24 @@
+import { Component, ChangeDetectionStrategy, Input } from '@angular/core';
+import { Index } from '../../models/game.model';
+
+@Component({
+ selector: 'app-point',
+ templateUrl: './point.component.html',
+ styleUrls: ['./point.component.scss'],
+ changeDetection: ChangeDetectionStrategy.OnPush
+})
+export class PointComponent {
+
+ @Input() index: Index;
+ @Input() color: string;
+ @Input() size: number;
+
+ getStyles() {
+ return {
+ left: `${this.index.x * this.size}px`,
+ top: `${this.index.y * this.size}px`,
+ width: `${this.size}px`,
+ height: `${this.size}px`
+ };
+ }
+}
diff --git a/src/app/game/component/tile/tile.component.html b/src/app/game/component/tile/tile.component.html
new file mode 100644
index 0000000..0ab9dd0
--- /dev/null
+++ b/src/app/game/component/tile/tile.component.html
@@ -0,0 +1,26 @@
+
+
+
+
+
+
+
+
+
diff --git a/src/app/game/component/tile/tile.component.scss b/src/app/game/component/tile/tile.component.scss
new file mode 100644
index 0000000..9598df9
--- /dev/null
+++ b/src/app/game/component/tile/tile.component.scss
@@ -0,0 +1,61 @@
+//.game-flag {
+// background-image: url('../../../../assets/img/flag.png');
+//}
+
+.tile {
+ position: absolute;
+ background-color: rgba(0, 168, 60, 0.27);
+ box-shadow: 0 0 1px black;
+}
+
+.tile.test {
+ background-color: forestgreen;
+}
+
+.debug {
+ position: absolute;
+ bottom: 0;
+ right: 1px;
+ font-weight: 300;
+ font-family: monospace, serif;
+ font-size: 10px;
+}
+
+.debug-f {
+ color: purple;
+}
+
+.debug-g {
+ color: red;
+}
+
+.debug-h {
+ color: blue;
+}
+
+.debug-index {
+ font-size: 10px;
+ color: black;
+ position: absolute;
+ top: 0;
+ left: 1px;
+}
+
+.debug-effect {
+ z-index: 0;
+ pointer-events: none;
+ height: 100%;
+ width: 100%;
+
+ &[openlist="true"] {
+ background-color: #ff455c;
+ }
+
+ &[closedlist="true"] {
+ background-color: #28ff84;
+ }
+
+ &[pathlist="true"] {
+ background-color: #ffae4e;
+ }
+}
diff --git a/src/app/game/component/tile/tile.component.ts b/src/app/game/component/tile/tile.component.ts
new file mode 100644
index 0000000..aaba45b
--- /dev/null
+++ b/src/app/game/component/tile/tile.component.ts
@@ -0,0 +1,39 @@
+import { ChangeDetectionStrategy, Component, Input, OnChanges, OnInit } from '@angular/core';
+import { Search, TileState } from '../../models';
+import { GameService } from '../../service/game.service';
+import { Observable } from 'rxjs';
+import { TileNode } from '../../classes';
+import { map } from 'rxjs/operators';
+
+@Component({
+ selector: 'app-tile',
+ templateUrl: './tile.component.html',
+ styleUrls: ['./tile.component.scss'],
+ changeDetection: ChangeDetectionStrategy.OnPush
+})
+export class TileComponent implements OnInit, OnChanges {
+
+ styles: any;
+ @Input() state: TileState;
+ @Input() size: number;
+ @Input() debug: number;
+
+ debugState$: Observable
+
+
+ g{{debugState.g}}
+ h{{debugState.h}}
+ f{{debugState.f}}
+ {{state.index.x}}{{state.index.y}}
+
+
+