week.09

var myImage; // Declare main image variable

var brush; // Declare brush image variable

var enableUserBtn, disableUserBtn, saveUserBtn; // Buttons

​

var isInteractive; // Tracks whether interactive mode is on

var x, y;

​

function preload() {

  myImage = loadImage("hamilton.png"); // Load the main image

  brush = loadImage("brush.03.png"); // Load the brush image

}

​

function setup() {

  // Creates application window with specified dimensions

  createCanvas(600, 750);

  // Initialize buttons

  enableUserBtn = createButton('Make Interactive');

  enableUserBtn.position(0, 0);

  enableUserBtn.mousePressed(enableInteractiveMode);

  disableUserBtn = createButton('Make Autonomous');

  disableUserBtn.position(0, 22);

  disableUserBtn.mousePressed(disableInteractiveMode);

  saveUserBtn = createButton('Save Image');

  saveUserBtn.position(0, 44);

  saveUserBtn.mousePressed(saveImage);

  // Initial settings

  isInteractive = false;

  x = width / 2;

  y = height / 2;

  background(255); // Set white background

}

​

function saveImage() {

  saveCanvas('processed_image.jpg');

}

​

function disableInteractiveMode() {

  isInteractive = false;

}

​

function enableInteractiveMode() {

  isInteractive = true;

}

​

function draw() {

  noStroke();

​

  // Ensure the main image is loaded

  if (!myImage) return;

​

  // Determine position based on mode

  if (isInteractive) {

    // Position will be updated with arrow keys in this mode

  } else {

    // Autonomous mode: randomly change position

    x = floor(random(0, myImage.width));

    y = floor(random(0, myImage.height));

  }

​

  // Get color from the image at the current x, y position

  let pix = myImage.get(x, y);

  let r = red(pix);

  let g = green(pix);

  let b = blue(pix);

​

  // Apply color tint to the brush and increase size

  push();

  imageMode(CENTER);

  translate(x, y);

  tint(r, g, b, 200); // Set color tint for the brush

  image(brush, 0, 0, 60, 60); // Increase brush size

  pop();

}

​

// Control brush position using arrow keys

function keyPressed() {

  if (isInteractive) {

    if (keyCode === UP_ARROW) {

      y -= 10;

    } else if (keyCode === DOWN_ARROW) {

      y += 10;

    } else if (keyCode === LEFT_ARROW) {

      x -= 10;

    } else if (keyCode === RIGHT_ARROW) {

      x += 10;

    }

​

    // Constrain position within canvas bounds

    x = constrain(x, 0, width);

    y = constrain(y, 0, height);

  }

}

​