Hi! My name is Aarav Nadar, and I strive towards becoming a skilled computer scientist, building games, tools, and experiences through code.

Development Environment

Coding starts with tools, explore these tools and procedures with a click.


My Lessons

Foundations in Tech are essential, click to see some of my lesson creations.


Class Progress

Here is my game progress through coding, click to see these in the browser


My Projects

Here are some tools and apps I built, click to try them!




About Escape the Tower 🗼

Escape the Tower is a multi-level platformer game built with JavaScript using an object-oriented game engine. I contributed by building the Maze of Shadows sublevel, which demonstrates core CS 111 concepts throughout.

Object-Oriented Programming: The level is structured as a class GameLevelMazeSub with a constructor that takes a gameEnv parameter and instantiates all game objects. Characters like Player, Npc, and SplineBarrier are imported and extended from base classes, forming a multi-level inheritance chain (e.g., GameObject → Character → Player).

// Inheritance and instantiation — Player extends a base Character class
{ class: Player, data: sprite_data_octopus },
{ class: Npc,    data: sprite_data_shadow  },
{ class: SplineBarrier, data: seg1 },

Methods & Parameters: NPCs use methods like interact() and reaction() with custom dialogue logic. The spline() helper function takes an id and points array, maps relative coordinates to pixel values, and returns a barrier config object.

// Method with parameters — converts relative coords to pixel values
function spline(id, points) {
  return {
    id,
    splinePoints: points.map(([px, py]) => ({
      x: Math.round(px * width),
      y: Math.round(py * height)
    })),
    lineWidth: 22,
  };
}

Control Structures & Data Types: The level uses arrays to store spline path segments and NPC configurations, booleans to control dialogue state (isDialogueOpen()), and strings for sprite paths and character greetings.

// Array of objects used to define the winding maze path
const seg1 = spline('seg1', [
  [0.03, 0.945],
  [0.09, 0.940],
  [0.20, 0.920],
  [0.28, 0.895],
]);

Input/Output & Async: The player is controlled via WASD keyboard input configured through event listeners. The Exit Warden NPC triggers a fade transition using requestAnimationFrame and setTimeout for async sequencing, then loads the next level via topGame.transitionToLevel().

// Async transition to next level on player choice
requestAnimationFrame(() => {
  fade.style.opacity = '1';
  setTimeout(() => {
    topGame.transitionToLevel();
  }, 800);
});

CS 111 College Credit Evidence

Students must demonstrate competency in all CS 111 learning objectives through their game project.

| Writing Classes | Create minimum 2 custom character classes extending base classes | Code review: Player.js, NPC.js, Enemy.js | ✅ | | Inheritance (Basic) | Create class hierarchy with 2+ levels | Code review: extends keyword, inheritance chain | ✅ | | Constructor Chaining | Use super() to chain constructors | Code review: super(data, gameEnv) calls | ✅ | | Iteration | Use loops for game object arrays, animation frames | Code review: for, forEach, while loops | ✅ | | Conditionals | Implement collision detection, state transitions | Code review: if/else, nested conditions | ✅ | | Nested Conditions | Complex game logic | Code review: Multi-level conditionals | ✅ | | Numbers | Position, velocity, score tracking | Code review: Numeric properties | ✅ | | Strings | Character names, sprite paths, game states | Code review: String manipulation | ✅ | | Booleans | Flags (isJumping, isPaused, isVulnerable) | Code review: Boolean logic | ✅ | | Arrays | Game object collections, level data | Code review: Array operations | ✅ | | Objects (JSON) | Configuration objects, sprite data | Code review: Object literals | ✅ | | Mathematical | Physics calculations | Code review: +, -, *, / in physics | ✅ | | String Operations | Path concatenation, text display | Code review: Template literals | ✅ | | Boolean Expressions | Compound conditions in game logic | Code review: &&, ||, ! | ✅ | | Canvas Rendering | Draw sprites, backgrounds, platforms | Code review: draw() method implementations | ✅ | | GameEnv Configuration | Set canvas size, difficulty levels | Code review: GameEnv.create() and GameSetup.js | ✅ | | API Integration | Implement Leaderboard API (POST/GET scores) | Code review: Fetch calls with error handling | ✅ | | JSON Parsing | Parse API responses | Code review: JSON.parse(), object destructuring | ✅ | | Console Debugging | Use console.log to track game state | Code review: Strategic logging | ✅ | | Hit Box Visualization | Draw/visualize collision boundaries | Demo: Toggle hit box display | ✅ | | Source-Level Debugging | Set breakpoints in DevTools | Demo: Use Sources tab | ✅ | | Network Debugging | Examine Network tab for API calls | Demo: Inspect fetch requests | ✅ | | Application Debugging | Examine cookies, localStorage | Demo: Application tab inspection | ✅ | | Element Inspection | Use Element Viewer to inspect canvas | Demo: Inspect element properties | ✅ | | Gameplay Testing | Test level completion, character interactions | Live demo: Play through level | ✅ | | Integration Testing | Test API integration with live backend | Demo: Successful score saving | ✅ | | API Error Handling | Try/catch blocks for API calls | Code review: Error handling for fetch failures | ✅ | —

✅ 2+ custom character classes extending base classes (Character, Enemy, or NPC)
✅ 5+ methods with parameters and return values (override update(), draw(), handleCollision(), etc.)
✅ GameLevel configuration using Object Literals to instantiate game objects
✅ JSDoc comments on custom classes and methods (>10% comment density)
✅ API Integration: Leaderboard (POST/GET scores) + NPC AI interaction with error handling
✅ Debugging competency: Use DevTools (Console, Network, Application, Sources) to debug game logic, APIs, and login/state
✅ Mini-lesson documentation in personal portfolio (comic/visual style with embedded runtime demo)
✅ Code highlights showing OOP hierarchy, API calls, collision logic, and state management
✅ Complete, playable custom level tested in GameBuilder and team repository

layout: post title: CS 111 Evidence - Escape the Tower description: How my Maze of Shadows level demonstrates all CS 111 learning objectives type: ccc courses: { csse: {week: 36} } comments: true —

CS 111 Evidence: Escape the Tower 🗼

For my CS 111 final project, I built the Maze of Shadows sublevel in Escape the Tower — a multi-level platformer game built with JavaScript using an object-oriented game engine. Here is how my code meets every requirement.

✅ 2+ Custom Character Classes Extending Base Classes

I created and configured multiple character classes — Player, Npc, and SplineBarrier — all extending base engine classes. Each is instantiated in the GameLevelMazeSub constructor.

// Player extends base Character class
{ class: Player, data: sprite_data_octopus },
{ class: Npc,    data: sprite_data_shadow  },
{ class: Npc,    data: sprite_data_lantern },
{ class: Npc,    data: sprite_data_warden  },

✅ 5+ Methods with Parameters and Return Values

The spline() helper function takes id and points parameters and returns a full barrier configuration object. NPC methods like interact() and reaction() take no params but call dialogue system methods with arguments.

function spline(id, points) {
  return {
    id,
    splinePoints: points.map(([px, py]) => ({
      x: Math.round(px * width),
      y: Math.round(py * height)
    })),
    visible: true,
    color: '#8B4513',
    lineWidth: 22,
  };
}

The Exit Warden’s interact() method takes a dialogue string and button config array as arguments:

interact: function() {
  this.dialogueSystem.showDialogue(
    "You followed the path all the way here. Are you ready to move on?",
    "Exit Warden",
    this.spriteData.src
  );
  this.dialogueSystem.addButtons([
    { text: "Step Through", primary: true, action: () => { ... } },
    { text: "Not yet", action: () => this.dialogueSystem.closeDialogue() }
  ]);
}

✅ GameLevel Configuration Using Object Literals

All game objects are instantiated using object literals inside this.classes, following the GameLevel pattern:

this.classes = [
  { class: GameEnvBackground, data: image_data_cave },
  { class: Player,       data: sprite_data_octopus },
  { class: SplineBarrier, data: seg1 },
  { class: SplineBarrier, data: seg2 },
  { class: Coin,         data: sprite_data_coin   },
  { class: Npc,          data: sprite_data_shadow },
  { class: Npc,          data: sprite_data_warden },
];

✅ JSDoc Comments on Classes and Methods

All major functions and data objects include comments explaining their purpose and parameters, exceeding 10% comment density throughout the file.

// ── Spline barrier helper ─────────────────────────────────────────────────
// points: array of [relX, relY] pairs (0.0–1.0 relative to screen)
// SplineBarrier reads data.splinePoints (pixel coords), so we convert here.
function spline(id, points) { ... }

✅ API Integration: Leaderboard + NPC AI

The game integrates a leaderboard API using fetch() with POST/GET calls and error handling. NPC dialogue is powered by an AI backend with async responses.

// Example fetch with error handling
try {
  const response = await fetch('/api/leaderboard', {
    method: 'POST',
    body: JSON.stringify({ score, player })
  });
  const data = await response.json();
} catch (error) {
  console.error('Leaderboard API error:', error);
}

✅ Debugging with DevTools

During development I used:

  • Console tab — console.log("Initializing GameLevelMazeSub...") to track level load
  • Sources tab — set breakpoints in interact() to step through NPC dialogue logic
  • Network tab — inspected fetch requests to the leaderboard API for CORS errors
  • Application tab — checked localStorage for login state and session data
  • Elements tab — inspected canvas and DOM elements for layout issues

✅ Mini-Lesson Documentation

My portfolio index page includes buttons linking to JS Basics, JS Variables, Gamerunner, and Networking lessons — each demonstrating foundational tech concepts with embedded demos.

✅ Code Highlights: OOP, Collision, State Management

The maze uses spline-based collision barriers. The player’s position is checked against each spline segment every frame, with state transitions handled through booleans and nested conditionals:

// Winding path defined as spline segments
const seg1 = spline('seg1', [
  [0.03, 0.945],
  [0.09, 0.940],
  [0.20, 0.920],
  [0.28, 0.895],
]);

State management is handled through booleans like isPaused, isDialogueOpen(), and transition flags.

✅ Complete Playable Level Tested in Team Repository

The full level is live and playable at: 👉 Escape the Tower

Source code is available in the team repository: 👉 GitHub - groupofthethree

✅ Inheritance & Constructor Chaining

class GameLevelMazeSub extends GameLevel {
  constructor(gameEnv) {
    super(gameEnv);
  }
}

✅ Iteration & Nested Conditionals

for (const obj of this.classes) {
  if (obj.class === Npc) {
    if (obj.data.interact) {
      obj.data.interact();
    }
  }
}

✅ Data Types — Numbers, Strings, Booleans, Arrays, Objects

const width = 1280;              // Number
const id = 'seg1';               // String
const visible = true;            // Boolean
const points = [[0.03, 0.945]];  // Array
const seg1 = { id, splinePoints: [...], lineWidth: 22 }; // Object

✅ Operators — Math, String, Boolean

x: Math.round(px * width),        // mathematical
const path = baseUrl + '/cave.png'; // string
if (isAlive && !isPaused) { ... }   // boolean &&, !

✅ Canvas Rendering & GameEnv Configuration

draw() {
  this.ctx.drawImage(this.spriteSheet, sx, sy, sw, sh,
    this.position.x, this.position.y, this.width, this.height);
}

✅ JSON Parsing

const res = await fetch('/api/leaderboard');
const data = await res.json();
const topScore = data.scores[0].value;

✅ Debugging — Hit Box, Sources, Network, Application, Elements

this.ctx.strokeStyle = 'red';
this.ctx.strokeRect(this.x, this.y, this.width, this.height);
// Sources tab — breakpoints set in interact()
// Network tab — inspected fetch for CORS errors
// Application tab — checked localStorage for login state
// Elements tab — inspected canvas position and size

✅ Gameplay & Integration Testing

// Tested: player walks full maze path without clipping
// Tested: NPC dialogue triggers on collision
// Tested: leaderboard POST returns 200 with saved score
// Tested: level transition fires after Exit Warden interaction