feat: migrate JavaScript files to TypeScript, enhancing type safety and maintainability across the codebase

README.md

@@ -1,21 +1,54 @@
 # Slime Genesis - ECS RPG PoC
 
-A complete proof of concept for **Slime Genesis: The Awakening of the Entity** built with vanilla JavaScript using an Entity Component System (ECS) architecture.
+A complete proof of concept for **Slime Genesis: The Awakening of the Entity** built with TypeScript using an Entity Component System (ECS) architecture.
 
 ## Quick Start
 
 1. **Install dependencies:**
+
    ```bash
    npm install
    ```
 
 2. **Run the development server:**
+
    ```bash
    npm run dev
    ```
 
 3. **Open your browser** to the URL shown (usually `http://localhost:5173`)
 
+## Development
+
+- **Format code:**
+
+  ```bash
+  npm run format
+  ```
+
+- **Check formatting:**
+
+  ```bash
+  npm run format:check
+  ```
+
+- **Lint code:**
+
+  ```bash
+  npm run lint
+  ```
+
+- **Fix linting issues:**
+
+  ```bash
+  npm run lint:fix
+  ```
+
+- **Build for production:**
+  ```bash
+  npm run build
+  ```
+
 ## Controls
 
 - **WASD** or **Arrow Keys**: Move your slime
@@ -27,6 +60,7 @@ A complete proof of concept for **Slime Genesis: The Awakening of the Entity** b
 ## Features
 
 ### Core Systems
+
 - ✅ **ECS Architecture**: Entity Component System for flexible game design
 - ✅ **Real-time Combat**: Fast-paced action combat with form-specific styles
 - ✅ **Evolution System**: Three paths (Human, Beast, Slime) that change based on absorption
@@ -35,15 +69,19 @@ A complete proof of concept for **Slime Genesis: The Awakening of the Entity** b
 - ✅ **RPG Systems**: Stats, leveling, XP, inventory, equipment
 - ✅ **AI System**: Intelligent creature behaviors (wander, chase, combat, flee)
 - ✅ **Projectile System**: Skills can create projectiles (Water Gun, etc.)
+- ✅ **Mutation System**: Gain mutations like Hardened Shell, Electric Skin, Bioluminescence
 
 ### Graphics & Polish
+
 - ✅ **Animated Slime**: Smooth morphing blob with jiggle physics
 - ✅ **Combat Effects**: Damage numbers, attack indicators, particle effects
 - ✅ **Absorption Visuals**: Swirling particles and color transitions
 - ✅ **Stealth Indicators**: Visibility meters and detection warnings
+- ✅ **Glow Effects**: Bioluminescence mutation creates a pulsing glow effect
 - ✅ **Polished UI**: Health bars, XP bars, skill hotbar, stat displays
 
 ### Skills
+
 - **Water Gun**: Shoot a jet of water at enemies
 - **Fire Breath**: Breathe fire in a cone
 - **Pounce**: Leap forward and damage enemies
@@ -58,6 +96,7 @@ This game uses a pure ECS (Entity Component System) architecture:
 - **Systems**: Logic processors (RenderSystem, CombatSystem, AbsorptionSystem, etc.)
 
 This architecture makes it easy to:
+
 - Add new skills and abilities
 - Create mutations and combinations
 - Extend creature behaviors
@@ -67,32 +106,65 @@ This architecture makes it easy to:
 
 ```
 src/
-├── core/              # ECS framework
-│   ├── Engine.js      # Main game loop
-│   ├── Entity.js      # Entity manager
-│   ├── Component.js   # Base component
-│   └── System.js      # Base system
-├── components/        # All game components
-│   ├── Position.js
-│   ├── Health.js
-│   ├── Stats.js
-│   ├── Evolution.js
-│   └── ...
-├── systems/           # All game systems
-│   ├── RenderSystem.js
-│   ├── CombatSystem.js
-│   ├── AbsorptionSystem.js
-│   └── ...
-├── skills/            # Skill system
-│   ├── Skill.js
-│   ├── SkillRegistry.js
-│   └── skills/        # Individual skills
-├── items/             # Item system
-│   ├── Item.js
-│   └── ItemRegistry.js
-├── world/             # World management
-│   └── World.js
-└── main.js            # Entry point
+├── core/                    # ECS framework and utilities
+│   ├── Engine.ts            # Main game loop
+│   ├── Entity.ts            # Entity manager
+│   ├── Component.ts         # Base component
+│   ├── System.ts            # Base system
+│   ├── Constants.ts         # Enums and constants
+│   ├── EventBus.ts          # Event system
+│   ├── LevelLoader.ts       # Level loading
+│   ├── Palette.ts           # Color palette
+│   ├── PixelFont.ts         # Pixel font rendering
+│   ├── SpriteLibrary.ts     # Sprite definitions
+│   └── TileMap.ts           # Tile map system
+├── components/              # All game components
+│   ├── Position.ts          # Position and rotation
+│   ├── Velocity.ts          # Movement velocity
+│   ├── Health.ts            # Health and regeneration
+│   ├── Sprite.ts            # Visual representation
+│   ├── Stats.ts             # Attributes and leveling
+│   ├── Combat.ts            # Combat stats and attacks
+│   ├── Evolution.ts         # Evolution paths and mutations
+│   ├── Skills.ts            # Skill management
+│   ├── SkillProgress.ts     # Skill learning progress
+│   ├── Absorbable.ts        # Absorption mechanics
+│   ├── Stealth.ts           # Stealth state
+│   ├── Intent.ts            # Action intent
+│   ├── Inventory.ts         # Items and equipment
+│   └── AI.ts                # AI behavior data
+├── systems/                 # All game systems
+│   ├── RenderSystem.ts      # Rendering
+│   ├── InputSystem.ts       # Input handling
+│   ├── PlayerControllerSystem.ts  # Player control
+│   ├── MovementSystem.ts    # Movement physics
+│   ├── CombatSystem.ts      # Combat logic
+│   ├── AISystem.ts          # AI behavior
+│   ├── AbsorptionSystem.ts  # Absorption mechanics
+│   ├── StealthSystem.ts     # Stealth mechanics
+│   ├── SkillSystem.ts       # Skill activation
+│   ├── SkillEffectSystem.ts # Skill visual effects
+│   ├── ProjectileSystem.ts  # Projectile physics
+│   ├── DeathSystem.ts       # Death handling
+│   ├── HealthRegenerationSystem.ts  # Health regen
+│   ├── VFXSystem.ts         # Visual effects
+│   ├── UISystem.ts          # UI rendering
+│   └── MenuSystem.ts        # Menu management
+├── skills/                  # Skill system
+│   ├── Skill.ts             # Base skill class
+│   ├── SkillRegistry.ts     # Skill registry
+│   └── skills/              # Individual skills
+│       ├── FireBreath.ts
+│       ├── Pounce.ts
+│       ├── StealthMode.ts
+│       └── WaterGun.ts
+├── items/                   # Item system
+│   ├── Item.ts              # Base item class
+│   └── ItemRegistry.ts      # Item registry
+├── world/                   # World management
+│   └── World.ts             # World setup
+├── GameConfig.ts           # Game configuration
+└── main.ts                 # Entry point
 ```
 
 ## Gameplay Loop
@@ -103,6 +175,7 @@ src/
 4. **Evolve**: Your form changes based on what you absorb
 5. **Level Up**: Gain XP, increase stats, unlock new possibilities
 6. **Stealth**: Use form-specific stealth to avoid or ambush enemies
+7. **Mutate**: Gain powerful mutations like Hardened Shell, Electric Skin, or Bioluminescence
 
 ## Evolution Paths
 
@@ -110,13 +183,30 @@ src/
 - **Beast Path**: Absorb beasts to become a predator, gain physical power
 - **Slime Path**: Maintain your original form, gain unique abilities
 
+## Mutations
+
+- **Hardened Shell**: Increased defense (requires high Constitution)
+- **Electric Skin**: Damage reflection (requires high Intelligence)
+- **Bioluminescence**: Glowing light source (requires high Human evolution)
+
 ## Technical Details
 
-- **No External Dependencies**: Pure vanilla JavaScript (except Vite for dev server)
+- **TypeScript**: Full type safety and modern JavaScript features
+- **Vite**: Fast development server and build tool
 - **Canvas 2D**: High-performance rendering with Canvas API
+- **ESLint**: Code linting with TypeScript support
+- **Prettier**: Code formatting
+- **Husky**: Pre-commit hooks (skips in CI environments)
 - **Modular Design**: Easy to extend and modify
 - **ECS Pattern**: Scalable architecture for complex game mechanics
 
+## Code Quality
+
+- **TypeScript**: Full type coverage, no `any` types
+- **ESLint**: Zero warnings policy
+- **Prettier**: Consistent code formatting
+- **Pre-commit Hooks**: Automatic formatting and linting before commits
+
 ## Future Enhancements
 
 - More skills and mutations