Merge pull request #23 from rengert/better-grafics

Better grafics

.eslintrc.json

@@ -36,7 +36,8 @@
               "hit",
               "shot",
               "collide",
-              "resize"
+              "resize",
+              "migrate"
             ]
           }
         ],

ios/App/Podfile.lock

@@ -0,0 +1,28 @@
+PODS:
+  - Capacitor (5.3.0):
+    - CapacitorCordova
+  - CapacitorCordova (5.3.0)
+  - CapacitorSplashScreen (5.0.6):
+    - Capacitor
+
+DEPENDENCIES:
+  - "Capacitor (from `../../node_modules/@capacitor/ios`)"
+  - "CapacitorCordova (from `../../node_modules/@capacitor/ios`)"
+  - "CapacitorSplashScreen (from `../../node_modules/@capacitor/splash-screen`)"
+
+EXTERNAL SOURCES:
+  Capacitor:
+    :path: "../../node_modules/@capacitor/ios"
+  CapacitorCordova:
+    :path: "../../node_modules/@capacitor/ios"
+  CapacitorSplashScreen:
+    :path: "../../node_modules/@capacitor/splash-screen"
+
+SPEC CHECKSUMS:
+  Capacitor: 1ac9165943bc4f2137642d218c5ba05df811de69
+  CapacitorCordova: b9374d68e63ce29e96ab5db994cf14fbefd722c9
+  CapacitorSplashScreen: 5fa2ab5e46cf5cc530cf16a51c80c7a986579ccd
+
+PODFILE CHECKSUM: 7a859ce68b9d4ff260e7aa4163685f3f2d526323
+
+COCOAPODS: 1.12.1

package.json

@@ -7,7 +7,8 @@
     "build": "ng build",
     "watch": "ng build --watch --configuration development",
     "test": "ng test --watch=false --browsers=ChromeHeadless",
-    "lint": "ng lint"
+    "lint": "ng lint",
+    "build:ios": "ng build && npx cap sync ios && npx cap open ios"
   },
   "private": true,
   "dependencies": {

src/app/components/pixijs/pixijs.component.ts

@@ -1,16 +1,16 @@
 import { Component, ElementRef, NgZone, OnInit } from '@angular/core';
-import { PixiGameService } from '../../services/pixi-game.service';
+import { GameService } from '../../services/game.service';
 
 @Component({
   selector: 'app-pixijs',
   template: '',
-  providers: [PixiGameService],
+  providers: [GameService],
 })
 export class PixijsComponent implements OnInit {
   constructor(
     private readonly elementRef: ElementRef,
     private readonly ngZone: NgZone,
-    private readonly pixiGame: PixiGameService,
+    private readonly pixiGame: GameService,
   ) {
   }
 

src/app/game-constants.ts

@@ -0,0 +1,66 @@
+import { PowerUp } from './models/pixijs/power-up-sprite';
+import { PowerUpConfig } from './models/power-up-config.model';
+
+interface Config {
+  powerUpConfig: PowerUpConfig[];
+}
+
+interface GameConfig extends Config {
+  enemy: {
+    autoSpawnSpeed: number;
+  },
+  ship: {
+    shotSpeed: number;
+  }
+}
+
+export const GAME_CONFIG: GameConfig = {
+  enemy: {
+    autoSpawnSpeed: 1.35, // per second
+  },
+  ship: {
+    shotSpeed: 3, // speed in pixel
+  },
+  powerUpConfig: [
+    {
+      type: PowerUp.speed,
+      assetUrl: 'assets/game/power-up-1.json',
+      animationName: 'power-up-1',
+      powerUp: {
+        speed: 0.1,
+        shot: 0,
+        energy: 0,
+      },
+    },
+    {
+      type: PowerUp.shotSpeed,
+      assetUrl: 'assets/game/power-up-2.json',
+      animationName: 'power-up-2',
+      powerUp: {
+        speed: 0,
+        shot: 1,
+        energy: 0,
+      },
+    },
+    {
+      type: PowerUp.shotPower,
+      assetUrl: 'assets/game/powerups/bolt/bolt.json',
+      animationName: 'bolt',
+      powerUp: {
+        speed: 0.1,
+        shot: 0,
+        energy: 0,
+      },
+    },
+    {
+      type: PowerUp.shotPower,
+      assetUrl: 'assets/game/powerups/pill/pill.json',
+      animationName: 'pill',
+      powerUp: {
+        speed: 0.1,
+        shot: 0,
+        energy: 1,
+      },
+    },
+  ],
+};

src/app/models/game.model.ts

@@ -0,0 +1,5 @@
+export interface Game {
+  date: string;
+  kills: number;
+  level: number;
+}

src/app/models/pixijs/app-screen.ts

@@ -1,5 +1,5 @@
 import { Container } from 'pixi.js';
-import { PixiGameService } from '../../services/pixi-game.service';
+import { GameService } from '../../services/game.service';
 
 export interface AppScreen extends Container {
   show?(): Promise<void>;
@@ -24,8 +24,7 @@ export interface AppScreen extends Container {
 }
 
 export interface AppScreenConstructor {
-  new(service: PixiGameService): AppScreen;
+  new(service: GameService): AppScreen;
 
-  /** List of assets bundles required by the screen */
   assetBundles?: string[];
 }

src/app/models/pixijs/power-up-sprite.ts

@@ -1,17 +1,19 @@
 import { FrameObject, Texture } from 'pixi.js';
+import { PowerUpConfig } from '../power-up-config.model';
 import { GameSprite } from './game-sprite';
 
 export enum PowerUp {
   speed,
-  shot,
+  shotSpeed,
+  shotPower,
 }
 
 export class PowerUpSprite extends GameSprite {
-  readonly type: PowerUp = PowerUp.speed;
+  readonly config: PowerUpConfig;
 
-  constructor(speed: number, textures: Texture[] | FrameObject[], type: PowerUp) {
+  constructor(speed: number, textures: Texture[] | FrameObject[], config: PowerUpConfig) {
     super(speed, textures);
 
-    this.type = type;
+    this.config = config;
   }
 }

src/app/models/pixijs/ship.ts

@@ -3,4 +3,14 @@ import { GameSprite } from './game-sprite';
 export class Ship extends GameSprite {
   shotPower = 1;
   shotSpeed = 1;
+
+  #energy = 10;
+
+  set energy(value: number) {
+    this.#energy = Math.min(value, 10);
+  };
+
+  get energy(): number {
+    return this.#energy;
+  }
 }

src/app/models/power-up-config.model.ts

@@ -0,0 +1,12 @@
+import { PowerUp } from './pixijs/power-up-sprite';
+
+export interface PowerUpConfig {
+  type: PowerUp;
+  assetUrl: string;
+  animationName: string;
+  powerUp: {
+    speed: number;
+    shot: number;
+    energy: number;
+  };
+}

src/app/popups/credits-popup.ts

@@ -1,32 +1,15 @@
-import { Button } from '@pixi/ui';
-import { Sprite, Text } from 'pixi.js';
-import { PixiGameService } from '../services/pixi-game.service';
+import { GameService } from '../services/game.service';
 import { Popup } from './popup';
 
 export class CreditsPopup extends Popup {
-  constructor(private readonly gameService: PixiGameService) {
+  constructor(gameService: GameService) {
     super('Credits');
 
-    this.addText(this.panel, 'Idee & Programmierung', 14, -60);
-    this.addText(this.panel, 'Thomas Renger', 12, -40);
-    this.addText(this.panel, 'Grafiken', 14, -10);
-    this.addText(this.panel, 'Kenney (www.kenney.nl)', 12, 10);
+    this.addText(this.panel, 'Idee & Programmierung', { size: 14 }, { y: -60 });
+    this.addText(this.panel, 'Thomas Renger', { size: 12 }, { y: -40 });
+    this.addText(this.panel, 'Grafiken', { size: 14 }, { y: -10 });
+    this.addText(this.panel, 'Kenney (www.kenney.nl)', { size: 12 }, { y: 10 });
 
-    this.addCloseButton(this.panel);
-  }
-
-  private addCloseButton(panel: Sprite): void {
-    const creditButton = new Button(Sprite.from('assets/ui/yellow_button00.png'));
-    creditButton.view.width = 190;
-    creditButton.view.height = 49;
-    creditButton.view.y = 55;
-    creditButton.view.x = -95;
-    const text = new Text('Schließen', { fontFamily: 'DefaultFont', dropShadowColor: '000000', fontSize: 14 });
-    text.anchor.set(0.5, 0.5);
-    text.x = 100;
-    text.y = 20;
-    creditButton.view.addChild(text);
-    creditButton.onPress.connect(() => this.gameService.openNavigation(this));
-    panel.addChild(creditButton.view);
+    this.addButton('Schließen!', () => gameService.openNavigation(this), 2, this.panel);
   }
 }