@guinetik/gcanvas 1.0.2 → 1.0.4

package/demos/js/space/alien.js

@@ -1,171 +0,0 @@
-import { GameObject, Rectangle, Circle, Group } from "../../../src/index.js";
-import { ALIEN_WIDTH, ALIEN_HEIGHT } from "./constants.js";
-
-export class Alien extends GameObject {
-  constructor(game, options = {}) {
-    super(game, {
-      width: ALIEN_WIDTH,
-      height: ALIEN_HEIGHT,
-      ...options,
-    });
-
-    this.row = options.row || 0;
-    this.col = options.col || 0;
-    this.points = options.points || 10;
-    this.animTime = Math.random() * 2; // Offset animation
-
-    // Create alien shape based on row
-    this.shape = this.createShape();
-  }
-
-  createShape() {
-    const group = new Group({ cacheRendering: true });
-
-    // Different alien designs based on row - classic Space Invaders style
-    if (this.row === 0) {
-      // Top row - Squid/UFO type (30 points) - magenta/pink
-      this.points = 30;
-
-      // Dome head
-      const head = new Circle(8, { y: -2, color: "#ff0088" });
-
-      // Body
-      const body = new Rectangle({ width: 20, height: 8, y: 4, color: "#ff0088" });
-
-      // Eyes
-      const leftEye = new Circle(2, { x: -4, y: -3, color: "#ffffff" });
-      const rightEye = new Circle(2, { x: 4, y: -3, color: "#ffffff" });
-      const leftPupil = new Circle(1, { x: -4, y: -3, color: "#000000" });
-      const rightPupil = new Circle(1, { x: 4, y: -3, color: "#000000" });
-
-      // Tentacles
-      const tent1 = new Rectangle({ width: 3, height: 6, x: -8, y: 10, color: "#cc0066" });
-      const tent2 = new Rectangle({ width: 3, height: 8, x: -3, y: 11, color: "#cc0066" });
-      const tent3 = new Rectangle({ width: 3, height: 8, x: 3, y: 11, color: "#cc0066" });
-      const tent4 = new Rectangle({ width: 3, height: 6, x: 8, y: 10, color: "#cc0066" });
-
-      group.add(head);
-      group.add(body);
-      group.add(leftEye);
-      group.add(rightEye);
-      group.add(leftPupil);
-      group.add(rightPupil);
-      group.add(tent1);
-      group.add(tent2);
-      group.add(tent3);
-      group.add(tent4);
-
-    } else if (this.row <= 2) {
-      // Middle rows - Crab type (20 points) - CYAN/ELECTRIC BLUE (spacey)
-      this.points = 20;
-
-      // Main body
-      const body = new Rectangle({ width: 22, height: 10, color: "#00ddff" });
-
-      // Head bump
-      const headBump = new Rectangle({ width: 10, height: 6, y: -6, color: "#00ddff" });
-
-      // Eyes
-      const leftEye = new Rectangle({ width: 4, height: 4, x: -6, y: -2, color: "#003344" });
-      const rightEye = new Rectangle({ width: 4, height: 4, x: 6, y: -2, color: "#003344" });
-
-      // Claws - left
-      const leftArm = new Rectangle({ width: 4, height: 6, x: -14, y: -2, color: "#00aacc" });
-      const leftClaw = new Rectangle({ width: 6, height: 4, x: -16, y: -6, color: "#00aacc" });
-
-      // Claws - right
-      const rightArm = new Rectangle({ width: 4, height: 6, x: 14, y: -2, color: "#00aacc" });
-      const rightClaw = new Rectangle({ width: 6, height: 4, x: 16, y: -6, color: "#00aacc" });
-
-      // Legs
-      const leg1 = new Rectangle({ width: 3, height: 5, x: -8, y: 8, color: "#0088aa" });
-      const leg2 = new Rectangle({ width: 3, height: 5, x: 0, y: 8, color: "#0088aa" });
-      const leg3 = new Rectangle({ width: 3, height: 5, x: 8, y: 8, color: "#0088aa" });
-
-      group.add(body);
-      group.add(headBump);
-      group.add(leftEye);
-      group.add(rightEye);
-      group.add(leftArm);
-      group.add(leftClaw);
-      group.add(rightArm);
-      group.add(rightClaw);
-      group.add(leg1);
-      group.add(leg2);
-      group.add(leg3);
-
-    } else {
-      // Bottom rows - Octopus/Basic type (10 points) - green
-      this.points = 10;
-
-      // Round head
-      const head = new Circle(10, { y: -2, color: "#44ff44" });
-
-      // Body extension
-      const body = new Rectangle({ width: 16, height: 8, y: 6, color: "#44ff44" });
-
-      // Eyes
-      const leftEye = new Rectangle({ width: 4, height: 5, x: -4, y: -4, color: "#003300" });
-      const rightEye = new Rectangle({ width: 4, height: 5, x: 4, y: -4, color: "#003300" });
-
-      // Antennae
-      const leftAntenna = new Rectangle({ width: 2, height: 6, x: -6, y: -12, color: "#22cc22" });
-      const rightAntenna = new Rectangle({ width: 2, height: 6, x: 6, y: -12, color: "#22cc22" });
-      const leftTip = new Circle(2, { x: -6, y: -16, color: "#88ff88" });
-      const rightTip = new Circle(2, { x: 6, y: -16, color: "#88ff88" });
-
-      // Tentacle legs
-      const leg1 = new Rectangle({ width: 3, height: 6, x: -10, y: 12, color: "#22aa22" });
-      const leg2 = new Rectangle({ width: 3, height: 8, x: -4, y: 13, color: "#22aa22" });
-      const leg3 = new Rectangle({ width: 3, height: 8, x: 4, y: 13, color: "#22aa22" });
-      const leg4 = new Rectangle({ width: 3, height: 6, x: 10, y: 12, color: "#22aa22" });
-
-      group.add(head);
-      group.add(body);
-      group.add(leftEye);
-      group.add(rightEye);
-      group.add(leftAntenna);
-      group.add(rightAntenna);
-      group.add(leftTip);
-      group.add(rightTip);
-      group.add(leg1);
-      group.add(leg2);
-      group.add(leg3);
-      group.add(leg4);
-    }
-
-    return group;
-  }
-
-  update(dt) {
-    super.update(dt);
-    this.animTime += dt;
-  }
-
-  draw() {
-    if (!this.visible) return;
-    super.draw();
-
-    // Add subtle animation - render at origin with wobble offset
-    // Parent transform already positions us correctly
-    const wobble = Math.sin(this.animTime * 5) * 2;
-
-    this.shape.x = 0;
-    this.shape.y = wobble;
-    this.shape.render();
-  }
-
-  destroy() {
-    this.active = false;
-    this.visible = false;
-  }
-
-  getBounds() {
-    return {
-      x: this.x - ALIEN_WIDTH / 2,
-      y: this.y - ALIEN_HEIGHT / 2,
-      width: ALIEN_WIDTH,
-      height: ALIEN_HEIGHT,
-    };
-  }
-}

package/demos/js/space/boom.js

@@ -1,98 +0,0 @@
-import { GameObject, Rectangle, Circle } from "../../../src/index.js";
-
-export class Explosion extends GameObject {
-  constructor(game, options = {}) {
-    super(game, options);
-
-    this.particles = [];
-    this.lifetime = 0.4; // Shorter lifetime for better performance
-    this.age = 0;
-    this.baseColor = options.color || "#ffff00";
-
-    // Color palette for explosion - varies based on base color
-    const colors = this.baseColor === "#ffff00"
-      ? ["#ffffff", "#ffff00", "#ffaa00", "#ff6600"] // Yellow explosion
-      : ["#ffffff", "#ff8888", "#ff4444", "#ff0000"]; // Red explosion
-
-    // Optimized particle count (8 circles + 3 squares = 11 total)
-    const particleCount = 8;
-    for (let i = 0; i < particleCount; i++) {
-      const angle = (i / particleCount) * Math.PI * 2 + Math.random() * 0.5;
-      const speed = 80 + Math.random() * 100;
-      const size = 2 + Math.random() * 4;
-      const color = colors[Math.floor(Math.random() * colors.length)];
-
-      this.particles.push({
-        x: 0,
-        y: 0,
-        vx: Math.cos(angle) * speed,
-        vy: Math.sin(angle) * speed,
-        size: size,
-        shape: new Circle(size, { color: color }),
-        rotSpeed: (Math.random() - 0.5) * 10,
-      });
-    }
-
-    // Add some square debris
-    for (let i = 0; i < 3; i++) {
-      const angle = Math.random() * Math.PI * 2;
-      const speed = 40 + Math.random() * 60;
-      const size = 2 + Math.random() * 3;
-      const color = colors[Math.floor(Math.random() * colors.length)];
-
-      this.particles.push({
-        x: 0,
-        y: 0,
-        vx: Math.cos(angle) * speed,
-        vy: Math.sin(angle) * speed,
-        size: size,
-        shape: new Rectangle({ width: size, height: size, color: color }),
-        rotSpeed: (Math.random() - 0.5) * 15,
-        rotation: 0,
-      });
-    }
-  }
-
-  update(dt) {
-    super.update(dt);
-    this.age += dt;
-
-    if (this.age >= this.lifetime) {
-      this.active = false;
-      this.visible = false;
-      return;
-    }
-
-    // Update particles with gravity and fade
-    const progress = this.age / this.lifetime;
-    for (const p of this.particles) {
-      p.x += p.vx * dt;
-      p.y += p.vy * dt;
-      p.vy += 100 * dt; // Gravity
-      p.vx *= 0.99; // Air resistance
-
-      // Fade and shrink
-      p.shape.opacity = 1 - progress * progress;
-
-      // Rotate debris
-      if (p.rotation !== undefined) {
-        p.rotation += p.rotSpeed * dt;
-      }
-    }
-  }
-
-  draw() {
-    if (!this.visible) return;
-    super.draw();
-
-    // Render particles relative to origin - parent transform positions us correctly
-    for (const p of this.particles) {
-      p.shape.x = p.x;
-      p.shape.y = p.y;
-      if (p.rotation !== undefined) {
-        p.shape.rotation = p.rotation * (180 / Math.PI); // Convert to degrees
-      }
-      p.shape.render();
-    }
-  }
-}

package/demos/js/space/boss.js

@@ -1,353 +0,0 @@
-import { GameObject, Rectangle } from "../../../src/index.js";
-import { Alien } from "./alien.js";
-import {
-  ALIEN_WIDTH,
-  ALIEN_HEIGHT,
-  BOSS_SCALE,
-  BOSS_BASE_HEALTH,
-  BOSS_BASE_POINTS,
-  BOSS_BASE_MISSILE_INTERVAL,
-  BOSS_BASE_MINION_INTERVAL,
-  BOSS_BASE_MAX_MINIONS,
-  BOSS_BASE_MOVE_SPEED,
-  GAUNTLET_BOSS_SCALE,
-  GAUNTLET_BOSS_HEALTH_MULTIPLIER,
-  GAUNTLET_BOSS_COLORS,
-} from "./constants.js";
-
-/**
- * Boss alien - uses composition to scale up a regular alien shape
- * Difficulty scales with boss type:
- * Type 0 = Squid (pink) - Level 3 boss (easiest, missiles only)
- * Type 1 = Octopus (green) - Level 6 boss (medium, missiles + lasers)
- * Type 2 = Crab (cyan) - Level 9 boss (hardest, missiles + lasers + lightning)
- *
- * Gauntlet mode: Larger scale, different colors, more health
- */
-export class Boss extends GameObject {
-  constructor(game, options = {}) {
-    // Gauntlet mode uses larger scale - must determine before super()
-    const isGauntlet = options.isGauntlet || false;
-    const scale = isGauntlet ? GAUNTLET_BOSS_SCALE : BOSS_SCALE;
-
-    const width = ALIEN_WIDTH * scale;
-    const height = ALIEN_HEIGHT * scale;
-
-    super(game, {
-      width: width,
-      height: height,
-      ...options,
-    });
-
-    this.isGauntlet = isGauntlet;
-    this.scale = scale;
-
-    // Boss type determines which alien row shape to use AND difficulty scaling
-    // 0 = octopus (row 3), 1 = squid (row 0), 2 = crab (row 1)
-    this.bossType = options.bossType || 0;
-
-    // Scale difficulty based on boss type (0, 1, 2)
-    const difficultyScale = 1 + this.bossType * 0.5; // 1.0, 1.5, 2.0
-
-    // Gauntlet bosses have extra health
-    const gauntletMultiplier = this.isGauntlet ? GAUNTLET_BOSS_HEALTH_MULTIPLIER : 1;
-
-    // Health scales up: 30, 45, 60 (or 45, 68, 90 in gauntlet)
-    this.health = Math.floor(BOSS_BASE_HEALTH * difficultyScale * gauntletMultiplier);
-    this.maxHealth = this.health;
-
-    // Points scale up: 1000, 2000, 3000 (doubled in gauntlet)
-    this.points = BOSS_BASE_POINTS * (this.bossType + 1) * (this.isGauntlet ? 2 : 1);
-
-    // Animation
-    this.animTime = 0;
-    this.hitFlashTime = 0;
-    this.isFlashing = false;
-
-    // Movement - faster for harder bosses
-    this.moveDirection = 1;
-    this.moveSpeed = BOSS_BASE_MOVE_SPEED * (1 + this.bossType * 0.3); // 35, 45.5, 56
-
-    // Attack intervals - shorter for harder bosses
-    // Non-signature abilities are 20% slower to reduce spam
-    // Signature: Boss 0 = missiles, Boss 1 = lasers, Boss 2 = lightning
-    let baseMissileInterval = BOSS_BASE_MISSILE_INTERVAL / difficultyScale;
-    if (this.bossType >= 1) {
-      // Missiles are non-signature for bosses 1 & 2, slow down 20%
-      baseMissileInterval *= 1.2;
-    }
-    this.missileInterval = baseMissileInterval;
-
-    this.minionInterval = BOSS_BASE_MINION_INTERVAL / difficultyScale;
-    this.maxMinions = BOSS_BASE_MAX_MINIONS + this.bossType * 2; // 2, 4, 6
-
-    // Boss type 1+ (Octopus, Crab) use lasers
-    this.usesLasers = this.bossType >= 1;
-    if (this.bossType === 1) {
-      // Boss 1: Lasers are signature - tuned down 10% from 1.8 to 2.0
-      this.laserInterval = 2.0;
-    } else if (this.bossType === 2) {
-      // Boss 2: Lasers are non-signature - 20% slower
-      this.laserInterval = 2.2;
-    }
-
-    // Boss type 2 (Crab/final) uses lightning as signature move
-    this.usesLightning = this.bossType === 2;
-    this.lightningInterval = 2.5;
-
-    // Attack timers
-    this.missileTimer = 0;
-    this.minionTimer = 0;
-    this.laserTimer = 0;
-    this.lightningTimer = 0;
-    this.minionCount = 0; // Track active minions
-
-    // Entry animation
-    this.entering = true;
-    this.entryProgress = 0;
-    this.targetY = options.targetY || 150;
-    this.startY = -height;
-
-    // Create shape using composition - instantiate an Alien and reuse its shape
-    this.shape = this.createShape();
-
-    // Health bar
-    this.healthBarBg = new Rectangle({
-      width: width,
-      height: 8,
-      color: "#333333",
-    });
-    this.healthBarFg = new Rectangle({
-      width: width,
-      height: 8,
-      color: "#ff0000",
-    });
-  }
-
-  createShape() {
-    // Map boss type to the appropriate alien row
-    // Type 0 (Level 3) = Squid (pink) -> row 0
-    // Type 1 (Level 6) = Octopus (green) -> row 3
-    // Type 2 (Level 9) = Crab (cyan) -> row 1 (final boss!)
-    const rowMapping = [0, 3, 1];
-    const alienRow = rowMapping[this.bossType] ?? 0;
-
-    // Create a temporary alien to get its shape
-    const tempAlien = new Alien(this.game, { row: alienRow });
-    const shape = tempAlien.shape;
-
-    // Disable caching since boss scales up (would cause pixelation if cached at small size)
-    shape.cacheRendering = false;
-
-    // Apply scale transform (using instance scale which differs in gauntlet mode)
-    shape.transform.scale(this.scale);
-
-    // In gauntlet mode, recolor the shape with custom gauntlet colors
-    if (this.isGauntlet) {
-      const colors = GAUNTLET_BOSS_COLORS[this.bossType];
-      this.recolorShape(shape, colors);
-    }
-
-    return shape;
-  }
-
-  /**
-   * Recursively recolor all shapes in a group with gauntlet colors
-   */
-  recolorShape(shape, colors) {
-    if (shape.children) {
-      // It's a group - recursively recolor children
-      for (const child of shape.children) {
-        this.recolorShape(child, colors);
-      }
-    } else if (shape.color) {
-      // It's a shape with a color - determine which tier based on brightness
-      const hex = shape.color.toLowerCase();
-      // Check if it's a dark color (eyes, etc) - keep them dark
-      if (hex.includes("00") && !hex.includes("ff") && !hex.includes("dd") && !hex.includes("cc") && !hex.includes("aa") && !hex.includes("88")) {
-        shape.color = colors.dark;
-      } else if (hex.includes("cc") || hex.includes("aa") || hex.includes("88") || hex.includes("66")) {
-        // Secondary/darker accent colors
-        shape.color = colors.secondary;
-      } else {
-        // Primary bright colors
-        shape.color = colors.primary;
-      }
-    }
-  }
-
-  update(dt) {
-    super.update(dt);
-    this.animTime += dt;
-
-    // Entry animation - descend from top
-    if (this.entering) {
-      this.entryProgress += dt * 0.5; // 2 seconds to enter
-      if (this.entryProgress >= 1) {
-        this.entryProgress = 1;
-        this.entering = false;
-      }
-      // Ease out cubic
-      const eased = 1 - Math.pow(1 - this.entryProgress, 3);
-      this.y = this.startY + (this.targetY - this.startY) * eased;
-      return; // Don't attack while entering
-    }
-
-    // Horizontal movement - drift back and forth
-    this.x += this.moveSpeed * this.moveDirection * dt;
-
-    // Bounce off screen edges
-    const halfWidth = this.width / 2;
-    if (this.x < halfWidth + 20) {
-      this.x = halfWidth + 20;
-      this.moveDirection = 1;
-    } else if (this.x > this.game.width - halfWidth - 20) {
-      this.x = this.game.width - halfWidth - 20;
-      this.moveDirection = -1;
-    }
-
-    // Attack timers
-    this.missileTimer += dt;
-    this.minionTimer += dt;
-    if (this.usesLasers) {
-      this.laserTimer += dt;
-    }
-    if (this.usesLightning) {
-      this.lightningTimer += dt;
-    }
-
-    // Fire missiles at player
-    if (this.missileTimer >= this.missileInterval) {
-      this.missileTimer = 0;
-      this.fireMissile();
-    }
-
-    // Fire lasers (boss type 1 special attack)
-    if (this.usesLasers && this.laserTimer >= this.laserInterval) {
-      this.laserTimer = 0;
-      this.fireLaser();
-    }
-
-    // Fire lightning (boss type 2 special attack)
-    if (this.usesLightning && this.lightningTimer >= this.lightningInterval) {
-      this.lightningTimer = 0;
-      this.fireLightning();
-    }
-
-    // Spawn minions
-    if (this.minionTimer >= this.minionInterval && this.minionCount < this.maxMinions) {
-      this.minionTimer = 0;
-      this.spawnMinion();
-    }
-
-    // Hit flash effect
-    if (this.isFlashing) {
-      this.hitFlashTime -= dt;
-      if (this.hitFlashTime <= 0) {
-        this.isFlashing = false;
-      }
-    }
-  }
-
-  fireMissile() {
-    // Fire a missile from boss position toward player
-    if (this.game.spawnBossMissile) {
-      this.game.spawnBossMissile(this.x, this.y + this.height / 2);
-    }
-  }
-
-  fireLaser() {
-    // Fire a laser beam directly at player's current position - forces them to move
-    if (this.game.spawnLaserBeam) {
-      this.game.spawnLaserBeam(this.game.player.x);
-    }
-  }
-
-  fireLightning() {
-    // Fire lightning - the ultimate "pay attention" move
-    if (this.game.spawnLightning) {
-      this.game.spawnLightning();
-    }
-  }
-
-  spawnMinion() {
-    // Spawn a minion that will float to a position
-    if (this.game.spawnBossMinion) {
-      const targetX = 100 + Math.random() * (this.game.width - 200);
-      const targetY = 200 + Math.random() * 150;
-
-      this.game.spawnBossMinion(this.x, this.y, targetX, targetY, this.bossType);
-      this.minionCount++;
-    }
-  }
-
-  onMinionDestroyed() {
-    this.minionCount = Math.max(0, this.minionCount - 1);
-  }
-
-  takeDamage() {
-    this.health--;
-    this.isFlashing = true;
-    this.hitFlashTime = 0.1;
-
-    if (this.health <= 0) {
-      this.destroy();
-      return true; // Boss defeated
-    }
-    return false;
-  }
-
-  draw() {
-    if (!this.visible) return;
-    super.draw();
-
-    // Wobble animation
-    const wobble = Math.sin(this.animTime * 3) * 3;
-
-    // Flash white when hit
-    if (this.isFlashing) {
-      this.shape.opacity = 0.5;
-    } else {
-      this.shape.opacity = 1;
-    }
-
-    // Render boss shape
-    this.shape.x = 0;
-    this.shape.y = wobble;
-    this.shape.render();
-
-    // Render health bar above boss (further up to avoid overlap with shape)
-    const healthPercent = this.health / this.maxHealth;
-    this.healthBarBg.x = 0;
-    this.healthBarBg.y = -this.height / 2 - 40;
-    this.healthBarBg.render();
-
-    this.healthBarFg.width = this.width * healthPercent;
-    this.healthBarFg.x = -(this.width * (1 - healthPercent)) / 2;
-    this.healthBarFg.y = -this.height / 2 - 40;
-
-    // Color based on health
-    if (healthPercent > 0.5) {
-      this.healthBarFg.color = "#00ff00";
-    } else if (healthPercent > 0.25) {
-      this.healthBarFg.color = "#ffff00";
-    } else {
-      this.healthBarFg.color = "#ff0000";
-    }
-    this.healthBarFg.render();
-  }
-
-  destroy() {
-    this.active = false;
-    this.visible = false;
-  }
-
-  getBounds() {
-    return {
-      x: this.x - this.width / 2,
-      y: this.y - this.height / 2,
-      width: this.width,
-      height: this.height,
-    };
-  }
-}

package/demos/js/space/buff.js

@@ -1,73 +0,0 @@
-import { GameObject, Circle } from "../../../src/index.js";
-
-export class AbsorbEffect extends GameObject {
-  constructor(game, options = {}) {
-    super(game, options);
-
-    this.particles = [];
-    this.lifetime = 0.4; // Shorter lifetime for better performance
-    this.age = 0;
-    this.targetX = options.targetX || this.x;
-    this.targetY = options.targetY || this.y;
-    this.color = options.color || "#98fb98";
-
-    // Create particles that will fly toward target (optimized count)
-    const particleCount = 8;
-    for (let i = 0; i < particleCount; i++) {
-      const angle = (i / particleCount) * Math.PI * 2;
-      const distance = 25 + Math.random() * 15;
-      const size = 3 + Math.random() * 3;
-
-      this.particles.push({
-        x: Math.cos(angle) * distance,
-        y: Math.sin(angle) * distance,
-        size: size,
-        shape: new Circle(size, {
-          color: this.color,
-        }),
-      });
-    }
-  }
-
-  update(dt) {
-    super.update(dt);
-    this.age += dt;
-
-    if (this.age >= this.lifetime) {
-      this.active = false;
-      this.visible = false;
-      return;
-    }
-
-    // Update target to follow player
-    if (this.game.player) {
-      this.targetX = this.game.player.x;
-      this.targetY = this.game.player.y;
-    }
-
-    // Move particles toward target (relative to effect origin)
-    const progress = this.age / this.lifetime;
-    const targetRelX = this.targetX - this.x;
-    const targetRelY = this.targetY - this.y;
-
-    for (const p of this.particles) {
-      // Lerp toward target
-      p.x += (targetRelX - p.x) * dt * 5;
-      p.y += (targetRelY - p.y) * dt * 5;
-
-      // Shrink and fade
-      p.shape.opacity = 1 - progress;
-    }
-  }
-
-  draw() {
-    if (!this.visible) return;
-    super.draw();
-
-    for (const p of this.particles) {
-      p.shape.x = p.x;
-      p.shape.y = p.y;
-      p.shape.render();
-    }
-  }
-}