Merge pull request #36 from dmitriypereverza/lights-feature

Add LightSystem feature

Author: ufocoder

index.html

@@ -20,8 +20,9 @@
       #app {
         position: absolute;
         width: 100vw;
+        height: 100vh;
         min-width: 1024px;
-        min-height: 768px;
+        /*min-height: 768px;*/
         display: flex;
         justify-content: center;
         align-items: center;
@@ -32,18 +33,13 @@
         z-index: 2;
       }
 
-      #minimap {
-        position: absolute;
-        right: 20px;
-        z-index: 3;
-      }
 
       #weapon {
         position: absolute;
         z-index: 4;
       }
 
-      #ui, 
+      #ui,
       #camera,
       #weapon {
         min-width: 50%;
@@ -54,4 +50,4 @@
     <div id="app">Loading..</div>
     <script type="module" src="/src/main.ts"></script>
   </body>
-</html>
+</html>

package.json

@@ -15,6 +15,7 @@
     "eslint": "^9.12.0",
     "globals": "^15.11.0",
     "husky": "^9.1.6",
+    "prettier": "^3.4.2",
     "typescript": "^5.6.3",
     "typescript-eslint": "^8.8.1",
     "vite": "^5.4.8",

src/global.d.ts

@@ -56,8 +56,11 @@ type MapEntityDoor = {
     type: 'door',
     texture: string
 }
+type MapEntityLight = {
+    type: 'light',
+}
 
-type MapEntity = MapEntityEmpty | MapEntityWall | MapEntityDoor;
+type MapEntity = MapEntityEmpty | MapEntityWall | MapEntityDoor | MapEntityLight;
 
 interface ExitEndingScenario {
     name: 'exit';

src/levels/generators/characters.ts

@@ -1,34 +1,42 @@
-import { degreeToRadians } from "src/lib/utils";
+import { degreeToRadians } from "src/lib/utils/angle";
 
 const random = (from: number, to: number) => {
   return from + Math.random() * (to - from);
 };
 
 export const generateEntities =
   <T>(generator: (x: number, y: number, ai: number) => T) =>
-  (limit: number, x: number, y: number, dx: number, dy: number, ai: number = 0) => {
+  (
+    limit: number,
+    x: number,
+    y: number,
+    dx: number,
+    dy: number,
+    ai: number = 0,
+  ) => {
     return new Array(limit)
       .fill(0)
-      .map(() => generator(
-        random(x - dx, x + dx), 
-        random(y - dy, y + dy), 
-        ai
-      ));
+      .map(() => generator(random(x - dx, x + dx), random(y - dy, y + dy), ai));
   };
 
-export const generateCircle = (x: number, y: number, radius: number, total: number): number[][] => {
+export const generateCircle = (
+  x: number,
+  y: number,
+  radius: number,
+  total: number,
+): number[][] => {
   const step = 360 / total;
   const coords = [];
 
   for (let angle = 0; angle < 360; angle += step) {
     coords.push([
       x + radius * Math.cos(degreeToRadians(angle)),
-      y + radius * Math.sin(degreeToRadians(angle))
+      y + radius * Math.sin(degreeToRadians(angle)),
     ]);
   }
 
-  return coords; 
-}
+  return coords;
+};
 
 export const generateZombie = (x: number, y: number, aiDistance: number = 0) =>
   ({
@@ -44,7 +52,6 @@ export const generateZombie = (x: number, y: number, aiDistance: number = 0) =>
     },
   }) as Enemy;
 
-
 export const generateFlyguy = (x: number, y: number, aiDistance: number = 0) =>
   ({
     x,
@@ -54,7 +61,7 @@ export const generateFlyguy = (x: number, y: number, aiDistance: number = 0) =>
     health: 150,
     radius: 0.4,
     rangeWeapon: {
-      bulletSprite: 'pistol_bullet',
+      bulletSprite: "pistol_bullet",
       bulletDamage: 5,
       bulletSpeed: 8,
       attackDistance: 2,
@@ -71,15 +78,19 @@ export const generateSoldier = (x: number, y: number, aiDistance: number = 0) =>
     health: 200,
     radius: 0.4,
     rangeWeapon: {
-      bulletSprite: 'shotgun_bullet',
+      bulletSprite: "shotgun_bullet",
       bulletDamage: 10,
       bulletSpeed: 6,
       attackDistance: 2,
       attackFrequency: 1_500,
     },
   }) as Enemy;
 
-export const generateCommando = (x: number, y: number, aiDistance: number = 0) =>
+export const generateCommando = (
+  x: number,
+  y: number,
+  aiDistance: number = 0,
+) =>
   ({
     x,
     y,
@@ -88,7 +99,7 @@ export const generateCommando = (x: number, y: number, aiDistance: number = 0) =
     health: 500,
     radius: 0.6,
     rangeWeapon: {
-      bulletSprite: 'shotgun_bullet',
+      bulletSprite: "shotgun_bullet",
       bulletDamage: 15,
       bulletSpeed: 7,
       attackDistance: 3,
@@ -105,13 +116,12 @@ export const generateTank = (x: number, y: number, aiDistance: number = 0) =>
     health: 2000,
     radius: 0.4,
     rangeWeapon: {
-      bulletSprite: 'shotgun_bullet',
+      bulletSprite: "shotgun_bullet",
       bulletDamage: 25,
       bulletSpeed: 5,
       attackDistance: 3,
       attackFrequency: 750,
     },
-    
   }) as Enemy;
 
 export const generateZombies = generateEntities(generateZombie);

src/levels/index.ts

@@ -2,8 +2,10 @@ import level_1 from "./level_1";
 import level_2 from "./level_2";
 import level_final from "./level_final";
 
+// prettier-ignore
 export default [
     level_1,
     level_2,
     level_final,
+
 ];

src/levels/level_1.ts

@@ -8,23 +8,25 @@ const level: Level = {
       bottom: { r: 84, g: 98, b: 92, a: 255 },
     },
   },
-  music: 'shocking-red-abbynoise',
+  music: "shocking-red-abbynoise",
+  // prettier-ignore
   map: [
     ['#', '#', '#', '#', '&', '#', '#', '#', '#', '#', '#', '&', '#', '#', '#', '#', '#', '#', '#', '#'],
-    ['#', ' ', ' ', ' ', '&', ' ', ' ', ' ', ' ', ' ', ' ', '&', ' ', ' ', ' ', ' ', ' ', ' ', ' ', '#'],
+    ['#', ' ', ' ', ' ', '&', ' ', '*', ' ', ' ', ' ', ' ', '&', ' ', ' ', ' ', ' ', ' ', ' ', ' ', '#'],
     ['5', ' ', ' ', ' ', '|', ' ', ' ', '&', ' ', ' ', ' ', '&', ' ', ' ', '&', ' ', ' ', ' ', ' ', '4'],
-    ['#', ' ', ' ', ' ', '&', '|', '&', '&', ' ', ' ', ' ', '&', ' ', ' ', '&', ' ', ' ', ' ', ' ', '#'],
-    ['#', ' ', ' ', ' ', ' ', ' ', ' ', '&', ' ', ' ', ' ', ' ', ' ', ' ', '&', ' ', ' ', ' ', ' ', '#'],
+    ['#', ' ', ' ', ' ', '&', ' ', '&', '&', ' ', ' ', ' ', '&', ' ', ' ', '&', ' ', ' ', ' ', ' ', '#'],
     ['#', ' ', ' ', ' ', ' ', ' ', ' ', '&', ' ', ' ', ' ', ' ', ' ', ' ', '&', ' ', ' ', ' ', ' ', '#'],
+    ['#', ' ', ' ', ' ', ' ', ' ', ' ', '&', ' ', ' ', ' ', ' ', ' ', ' ', '&', ' ', ' ', ' ', '*', '#'],
     ['#', '#', '#', '#', '#', '#', '#', '&', '#', '#', '#', '#', '#', '#', '&', '#', '#', '#', '#', '#'],
   ],
   mapEntities: {
-    ' ': { type: 'empty' },
-    '#': { type: 'wall', texture: "TECH_1C" },
-    '&': { type: 'wall', texture: "TECH_1E" },
-    '4': { type: 'wall', texture: "DOOR_1A" },
-    '5': { type: 'wall', texture: "DOOR_1E" },
-    '|': { type: 'door', texture: "DOOR_1A" },
+    " ": { type: "empty" },
+    "#": { type: "wall", texture: "TECH_1C" },
+    "&": { type: "wall", texture: "TECH_1E" },
+    "4": { type: "wall", texture: "DOOR_1A" },
+    "5": { type: "wall", texture: "DOOR_1E" },
+    "|": { type: "door", texture: "DOOR_1A" },
+    "*": { type: "light" },
   },
   player: {
     x: 1.5,
@@ -48,8 +50,8 @@ const level: Level = {
     ...generateZombies(10, 13, 2.5, 0.75, 0.75, 2),
   ],
   endingScenario: {
-    name:'exit',
-    position: { x: 18, y: 2 }
+    name: "exit",
+    position: { x: 18, y: 2 },
   },
 };
 

src/levels/level_2.ts

@@ -1,4 +1,8 @@
-import { generateSoldier, generateZombie, generateZombies } from "./generators/characters";
+import {
+  generateSoldier,
+  generateZombie,
+  generateZombies,
+} from "./generators/characters";
 import { generatePistolAmmo, generateHealthPack } from "./generators/items";
 
 const level: Level = {
@@ -8,7 +12,8 @@ const level: Level = {
       bottom: { r: 84, g: 98, b: 92, a: 255 },
     },
   },
-  music: 'heavy-duty-zoo',
+  music: "heavy-duty-zoo",
+  // prettier-ignore
   map: [
     [1, 5, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1],
     [1, 0, 1, 0, 0, 0, 0, 0, 0, 1, 0, 1, 0, 0, 0, 0, 0, 0, 0, 1, 0, 0, 0, 4],
@@ -23,12 +28,12 @@ const level: Level = {
     [1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 2, 1, 1, 1, 1, 1, 1],
   ],
   mapEntities: {
-    0: {type:'empty'},
-    1: {type:'wall', texture: "TECH_1C" },
-    2: {type:'wall', texture: "TECH_1E" },
-    3: {type:'wall', texture: "TECH_2F" },
-    4: {type:'wall', texture: "DOOR_1A" },
-    5: {type:'wall', texture: "DOOR_1E" },
+    0: { type: "empty" },
+    1: { type: "wall", texture: "TECH_1C" },
+    2: { type: "wall", texture: "TECH_1E" },
+    3: { type: "wall", texture: "TECH_2F" },
+    4: { type: "wall", texture: "DOOR_1A" },
+    5: { type: "wall", texture: "DOOR_1E" },
   },
   player: {
     x: 1.5,
@@ -86,11 +91,11 @@ const level: Level = {
     ...generateZombies(50, 17, 2, 1, 1, 2),
   ],
   endingScenario: {
-    name:'exit',
+    name: "exit",
     position: {
       x: 22,
       y: 1,
-    }
+    },
   },
 };
 

src/levels/level_3.ts

@@ -1,4 +1,8 @@
-import { generateFlygies, generateSoldiers, generateZombies } from "./generators/characters";
+import {
+  generateFlygies,
+  generateSoldiers,
+  generateZombies,
+} from "./generators/characters";
 import { generatePistolAmmo } from "./generators/items";
 
 const level: Level = {
@@ -8,7 +12,8 @@ const level: Level = {
       bottom: { r: 84, g: 98, b: 92, a: 255 },
     },
   },
-  music: 'heavy-duty-zoo',
+  music: "heavy-duty-zoo",
+  // prettier-ignore
   map: [
     [1, 1, 1, 2, 2, 1, 1, 1, 1, 1, 1, 2, 1, 1, 1, 1, 1, 1, 1, 1],
     [1, 0, 0, 2, 0, 0, 0, 0, 0, 0, 0, 2, 0, 0, 0, 0, 0, 0, 0, 1],
@@ -21,12 +26,12 @@ const level: Level = {
     [1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 2, 1, 1, 1, 1, 1],
   ],
   mapEntities: {
-    0: {type:'empty'},
-    1: {type:'wall', texture: "TECH_1C" },
-    2: {type:'wall', texture: "TECH_1E" },
-    3: {type:'wall', texture: "TECH_2F" },
-    4: {type:'wall', texture: "DOOR_1A" },
-    5: {type:'wall', texture: "DOOR_1E" },
+    0: { type: "empty" },
+    1: { type: "wall", texture: "TECH_1C" },
+    2: { type: "wall", texture: "TECH_1E" },
+    3: { type: "wall", texture: "TECH_2F" },
+    4: { type: "wall", texture: "DOOR_1A" },
+    5: { type: "wall", texture: "DOOR_1E" },
   },
   player: {
     x: 2,
@@ -45,11 +50,11 @@ const level: Level = {
     ...generateSoldiers(20, 8, 8, 1, 1, 5),
   ],
   endingScenario: {
-    name:'exit',
+    name: "exit",
     position: {
       x: 18,
       y: 2,
-    }
+    },
   },
 };