constructor(windowX, windowY, windowWidth, windowHeight, title) {

    this.x = windowX;

    this.y = windowY;

    this.w = windowWidth;

    this.h = windowHeight;

    this.title = title;

  }

​

  show() {

    // Draw the window frame

    fill(255, 0, 0);

    rect(this.x, this.y, this.w, this.h);

    fill(255);

    stroke(255);

    text(this.title, this.x, this.y);

​

    // Draw random rectangles within the window boundaries

    const rectX = random(this.x + 20, this.x + this.w - 40);

    const rectY = random(this.y + 20, this.y + this.h - 40);

    fill(random(0, 255), random(0, 255), random(0, 255));

    rect(rectX, rectY, random(20, 40));

  }

}

class Virus extends Window {

  constructor(windowX, windowY, windowWidth, windowHeight, title) {

    super(windowX, windowY, windowWidth, windowHeight, title);

  }

​

  show() {

    // Draw the window frame

    fill(255, 0, 0);

    rect(this.x, this.y, this.w, this.h);

    fill(255);

    stroke(255);

    text(this.title, this.x, this.y);

​

    // Draw random rectangles within the window boundaries

    for (let i = 0; i < 50; i++) {

      const rectX = random(0, width);

      const rectY = random(0, height);

      fill(random(0, 255), random(0, 255), random(0, 255));

      rect(rectX, rectY, random(30, 100));

      fill(0);

      stroke(0);

      textSize(35);

      text("ERROR: VIRUS!", random(0, width), random(0, height));

    }

  }

}

class FroggerWindow extends Window {

  constructor(windowX, windowY, windowWidth, windowHeight, title) {

    super(windowX, windowY, windowWidth, windowHeight, title);

    this.frogX = this.x + this.w / 2; // Initial frog X position

    this.frogY = this.y + this.h - 40; // Initial frog Y position

    this.frogSize = 30;

  }

​

  show() {

    // Draw the window frame

    fill(0, 100, 0);

    rect(this.x, this.y, this.w, this.h);

    fill(255);

    stroke(255);

    textSize(20);

    text(this.title, this.x, this.y);

​

    // Draw the frog

    fill(0, 255, 0);

    ellipse(this.frogX, this.frogY, this.frogSize, this.frogSize);

  }

​

  keyPressed() {

    // Move the frog with arrow keys

    if (keyIsDown(LEFT_ARROW)) {

      this.frogX -= 5;

    }

    if (keyIsDown(RIGHT_ARROW)) {

      this.frogX += 5;

    }

    if (keyIsDown(UP_ARROW)) {

      this.frogY -= 5;

    }

    if (keyIsDown(DOWN_ARROW)) {

      this.frogY += 5;

    }

  }

}

​

function keyPressed() {

  // Call the keyPressed method of the active FroggerWindow

  const activeWindow = windowManager.windows.find(window => window instanceof FroggerWindow && window === windowManager.draggedWindow);

  if (activeWindow) {

    activeWindow.keyPressed();

    activeWindow.show();

  }

}

​

​

​

// Example usage

​

class WindowManager {

  constructor() {

    this.windows = [];

    this.draggedWindow = null;

  }

​

  addWindow(window) {

    this.windows.push(window);

  }

​

  handleMousePress() {

    // Check for mouse click on windows from topmost to bottommost

    for (let i = this.windows.length - 1; i >= 0; i--) {

      const window = this.windows[i];

      if (

        mouseX >= window.x &&

        mouseX <= window.x + window.w &&

        mouseY >= window.y &&

        mouseY <= window.y + 20 // Assuming title bar height of 20 pixels

      ) {

        this.draggedWindow = window;

        break;

      }

    }

  }

​

  handleMouseRelease() {

    this.draggedWindow = null;

  }

​

  handleMouseDrag() {

    if (this.draggedWindow) {

      this.draggedWindow.x = mouseX - this.draggedWindow.w / 2;

      this.draggedWindow.y = mouseY - 10;

    }

  }

​

  drawWindows() {

    for (let i = 0; i < this.windows.length; i++) {

      this.windows[i].show();

    }

  }

}

​

let windowManager;

​

function setup() {

  createCanvas(800, 600);

  windowManager = new WindowManager();

}

​

function draw() {

  background(220);

  windowManager.drawWindows();

}

​

function mousePressed() {

  windowManager.handleMousePress();

}

​

function mouseReleased() {

  windowManager.handleMouseRelease();

}

​

function mouseDragged() {

  windowManager.handleMouseDrag();

}

// Creating a FroggerWindow

function createFroggerWindow() {

  const froggerWindow = new FroggerWindow(random(0, width), random(0, height), 400, 500, "Frogger");

  windowManager.addWindow(froggerWindow);

}

function keyPressed() {

  // Create a new window when a key is pressed

  if (key === "n" || key === "N") {

    const newWindow = new Window(random(0, width), random(0, height), 200, 150, "New Window");

    windowManager.addWindow(newWindow);

  }

  if (key === "v" || key === "V") {

    const newWindow = new Virus(random(0, width), random(0, height), 200, 150, "New Window");

    windowManager.addWindow(newWindow);

  }

  if (key === "f" || key === "F") {

    const newWindow = new FroggerWindow(random(0, width), random(0, height), 200, 150, "New Window");

    windowManager.addWindow(newWindow);

  }

}

​