Population: Infinite Week 3

Assignment: Create a simulated version of yourself that takes over one task (social, creative, or professional) of your daily life.

I wanted to try and simulate a version of myself that takes over a creative task in my daily life. I try to do a p5.js sketch a day and I usually try to incorporate some sort of randomness or noise. I wanted to simulate this task using puppeteer and utilize the code to randomize the choices for the sketch. I started by altering the setup in case I wanted to utilize rectangles, to put them in center mode so they’d be aligned the way I wanted. Then I altered the background color and start off with two for loops. The spacing of x and y are randomized from a list of numbers I arbitrarily chose. Then the values for the stroke weight, stroke and fill are randomly chosen from a different list of random numbers. Then I translate each object and I like to make my sketches move, so the trigonometric functions are also randomly chosen each time between sine, cosine and tangent. I finish the sketch by randomly choosing between a line, ellipse, rectangle, or square and the values for those shapes are also randomly chosen from an array of values. Then the play button is clicked and the sketch is completed. Due to the nature of puppeteer, I stuck with a pretty basic sketch that varies each time. If I learn how to utilize puppeteer in a more efficient way, I will try to further this automated creative task by implementing more complex functions.

Below is the code I used to simulate my creative task and a video of the code working.

const puppeteer = require('puppeteer');

function randomNess(array) {
  const randomIndex = Math.floor(Math.random() * array.length);

  return array[randomIndex];
}

async function program() {
  const browser = await puppeteer.launch({
    headless: false,
    slowMo: 10
  });

  const context = await browser.createIncognitoBrowserContext();
  const page = await context.newPage();

  await page.setViewport({
    width: 1280,
    height: 720
  });

  await page.goto('https://editor.p5js.org');

  await page.click("#root > div > div > div.editor-preview-container > div > div.Pane.vertical.Pane2 > div > div.Pane.vertical.Pane1 > div > div.Pane.horizontal.Pane1 > section > div.editor-holder > div > div.CodeMirror-scroll");

  await page.waitFor(2000);

  await page.keyboard.press('ArrowUp');
  await page.keyboard.press('ArrowUp');
  await page.keyboard.press('ArrowUp');
  await page.keyboard.press('ArrowUp');
  await page.keyboard.press('ArrowLeft');
  await page.keyboard.type('rectMode(CENTER);');
  await page.keyboard.press('Enter');
  await page.keyboard.press('ArrowDown');
  await page.keyboard.press('ArrowDown');
  await page.keyboard.press('ArrowDown');
  await page.keyboard.press('ArrowDown');

  await page.keyboard.press('ArrowLeft');
  await page.waitFor(50);
  await page.keyboard.press('ArrowLeft');
  await page.waitFor(50);
  await page.keyboard.press('ArrowLeft');
  await page.waitFor(50);
  await page.keyboard.press('ArrowLeft');
  await page.waitFor(50);
  await page.keyboard.press('ArrowLeft');
  await page.waitFor(50);
  await page.keyboard.press('ArrowLeft');
  await page.waitFor(50);

  await page.keyboard.press('Delete');
  await page.keyboard.press('Delete');
  await page.keyboard.press('Delete');
  await page.keyboard.type('255');
  await page.keyboard.press('ArrowRight');
  await page.keyboard.press('ArrowRight');
  await page.keyboard.press('ArrowRight');
  await page.keyboard.press('Enter');
  await page.keyboard.press('ArrowLeft');
  await page.keyboard.type('for (let x = 0; x<=width; x+=');
  const number = ["1", "5", "10", "20", "25", "50"];
  const randX = randomNess(number);
  await page.keyboard.type(randX);
  await page.keyboard.type(") {");
  await page.keyboard.press('Enter');
  await page.keyboard.type('for (let y = 0; y<=height; y+=');
  const randY = randomNess(number);
  await page.keyboard.type(randY);
  await page.keyboard.type(") {");
  await page.keyboard.press('Enter');
  await page.keyboard.type("strokeWeight(");
  const numberWeight = ["1", "2", "3", "4", "5"];
  const numWeight = randomNess(numberWeight);
  await page.keyboard.type(numWeight);
  await page.keyboard.type(");");
  await page.keyboard.press('Enter');
  await page.keyboard.type("stroke(");
  const numColor = ["0", "100", "150", "200", "255", "50", "23", "75", "130", "172", "214", "245"];
  const num1 = randomNess(numColor);
  await page.keyboard.type(num1);
  await page.keyboard.type(',');
  const num2 = randomNess(numColor);
  await page.keyboard.type(num2);
  await page.keyboard.type(',');
  const num3 = randomNess(numColor);
  await page.keyboard.type(num3);
  await page.keyboard.type(',');
  const num4 = randomNess(numColor);
  await page.keyboard.type(num4);
  await page.keyboard.type(');');
  await page.keyboard.press('Enter');
  await page.keyboard.type("fill(");
  const num5 = randomNess(numColor);
  await page.keyboard.type(num5);
  await page.keyboard.type(',');
  const num6 = randomNess(numColor);
  await page.keyboard.type(num6);
  await page.keyboard.type(',');
  const num7 = randomNess(numColor);
  await page.keyboard.type(num7);
  await page.keyboard.type(',');
  const num8 = randomNess(numColor);
  await page.keyboard.type(num8);
  await page.keyboard.type(');');
  await page.keyboard.press('Enter');
  await page.keyboard.type('push();');
  await page.keyboard.press('Enter');
  await page.keyboard.type('translate(x,y);');
  await page.keyboard.press('Enter');
  await page.keyboard.type('rotate(');
  const funcList = ['sin(', 'cos(', 'tan('];
  const func = randomNess(funcList);
  await page.keyboard.type(func);
  await page.keyboard.type('radians(frameCount+x+y')
  await page.keyboard.type(')));')
  await page.keyboard.press('Enter');
  const shapeList = ["ellipse(", "line(", "rect(", "square("];
  const randShape = randomNess(shapeList);
  await page.keyboard.type(randShape);
  await page.keyboard.type('0,0,');
  const sizeList = ['0', '1', '5', '10', '15', '20', '25', '30', '35', '40', '45', '50'];
  const randSize1 = randomNess(sizeList);
  await page.keyboard.type(randSize1);
  await page.keyboard.type(',');
  const randSize2 = randomNess(sizeList);
  await page.keyboard.type(randSize2);
  await page.keyboard.type(');');
  await page.keyboard.press('Enter');
  await page.keyboard.type('pop();');
  await page.keyboard.type('}}');
  await page.click('#root > div > div > div.toolbar > button.toolbar__play-button');
}

program();