​

let t2 = "color\npreview"

​

let a, b, c, d;

let drawCol;

let drawColVal;

​

let backBright = 10;

let brightCheck;

​

let nPoints = 2500;

​

let runbutton, savebutton, restartbutton;

​

let r = [];

let points = [];

let newPoints = [];

let startPoints = [];

let counter = 0;

let deJongFlag = false;

​

​

function setup() {

​

  createCanvas(900, 1600);

  colorMode(HSB);

  background(0, 0, backBright);

​

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

    x = random(-2, 2);

    y = random(-2, 2);

    points[i] = createVector(x, y);

  }

​

​

  a = createInput("78");

  a.position(0, 10);

  a.size(70);

  a.style('font-size', "40px");

  b = createInput("5");

  b.position(80, 10);

  b.size(70);

  b.style('font-size', "40px");

  c = createInput("38");

  c.position(160, 10);

  c.size(70);

  c.style('font-size', "40px");

  d = createInput("87");

  d.position(240, 10);

  d.size(70);

  d.style('font-size', "40px");

​

  brightCheck = createCheckbox("bright/dark", false)

  brightCheck.position(width /2, 10);

  const box = brightCheck.elt.getElementsByTagName('input')[0];

  box.style.width = '40px';

  box.style.height = '40px';

  brightCheck.style('font-size', "40px");

  brightCheck.style('color', color(50));

​

​

​

  drawCol = createSlider(20, 340, 180);

  drawCol.position(width / 2 - 65, 150);

​

  runbutton = createButton('run');

  runbutton.mousePressed(run);

  runbutton.position(width - 100, 10);

  runbutton.style('font-size', "40px");

​

  savebutton = createButton('save image');

  savebutton.mousePressed(saveIMG);

  savebutton.position(0, 10);

  savebutton.style('font-size', "40px");

​

  restartbutton = createButton('restart');

  restartbutton.mousePressed(setDeJongFalse);

  restartbutton.position(width - 150, 10);

  restartbutton.style('font-size', "40px");

}

​

function draw() {

​

  if (deJongFlag) {

    restartbutton.show();

    brightCheck.hide();

    drawCol.hide();

    runbutton.hide();

    savebutton.show();

    a.hide();

    b.hide();

    c.hide();

    d.hide();

​

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

      let p = mapToCanvas(points[i]);

​

      let distance = dist(p.x, p.y, width / 2, height / 2);

      let maxDist = dist(0, 0, width / 2, height / 2);

​

      let bright = map(distance, 0, maxDist, 100, 50);

      let hue = map(distance, 0, maxDist, drawColVal - 20, drawColVal + 20);

​

​

      stroke(hue, 80, bright, 0.2);

      point(p.x, p.y);

    }

​

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

      append(newPoints, deJong(points[i], 0));

    }

    points = newPoints;

    newPoints = [];

    counter++;

  }

  if (!deJongFlag) {

    a.show();

    b.show();

    c.show();

    d.show();

    restartbutton.hide();

    brightCheck.show();

    drawCol.show();

    savebutton.hide();

    runbutton.show();

    background(0, 0, backBright);

    drawColVal = drawCol.value();

    noStroke();

    fill(drawColVal, 80, 60);

    ellipse(width/2, 300, 200, 200);

    brightCheck.changed(brightChanged)

    textSize(38);

    fill(50)

    text(t,10,450,width-10,700);

    textSize(30);

    fill(50)

    text(t2,580,270,680,700);

  }

}

​

function deJong(point, num) {

  var newX = sin(r[0] * point.y) - cos(r[1] * point.x);

  var newY = sin(r[2] * point.x) - cos(r[3] * point.y);

  return createVector(newX, newY);

}

​

function mapToCanvas(point) {

  var x = map(point.x, -2, 2, 20, width - 20);

  var y = map(point.y, -2, 2, 20, height - 20);

  return createVector(x, y);

}

​

function run() {

  if (check()) {

    clearSketch();

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

      r[i] = map(r[i], 0, 100, -PI, PI);

    }

​

    deJongFlag = true;

  } else {

    clearSketch();

    deJongFlag = false;

  }

}

​

function saveIMG() {

  save('deJongIFS'+ str(counter) +'.jpg');

}

​

function check() {

  let flag = true;

  r[0] = int(a.value());

  r[1] = int(b.value());

  r[2] = int(c.value());

  r[3] = int(d.value());

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

    if (isNaN(r[i]) || r[i] < 0 || r[i] > 100) {

      flag = false;

      break;

    }

  }

  return flag;

}

​

function clearSketch() {

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

    x = random(-2, 2);

    y = random(-2, 2);

    points[i] = createVector(x, y);

  }

  background(0, 0, backBright);

  newPoints = [];

  counter = 0;

}

​

function brightChanged() {

  if (this.checked()) {

    backBright = 95;

  } else {

    backBright = 10;

  }

}

​

function setDeJongFalse() {

  deJongFlag = false;

}