/*

var step = 2;

var i0 = 0;

var j0 = 0;

​

function setup() {

​

    var canvas = createCanvas(windowWidth, windowHeight);

    //cnv.style('display', 'block');

    step = random(1000);

    //createCanvas(500,500);

    // Move the canvas so it’s inside our <div id="sketch-holder">.

    canvas.parent('sketch-holder');

    frameRate(30);

}

​

function draw() {

    background(244, 243, 225, 6);

    //background(200,200,200,6);

    var r = 1.0 * width / 2;

​

    noFill();

​

    stroke(10, 56, 74, 3);

    beginShape(LINES);

    var i, j;

​

    for (i = i0, j = j0; i < 360 * 2 + i0; i = i + 2, j = j + 2 * step) {

        vertex(width / 2 + r * cos(2 * 3.14 * (i / 360.0)), r * sin(2 * 3.14 * (i / 360.0)));

        vertex(width / 2 + r * cos(2 * 3.14 * (j / 360.0)), r * sin(2 * 3.14 * (j / 360.0)));

    }

    endShape(CLOSE);

​

    step = step + 0.001;

    i0 = i0 + 0.05;

    j0 = j0 + 0.05;;

}

​

function windowResized() {

    resizeCanvas(windowWidth, windowHeight);

}

*/

​

// // Second Version

/*

var param_noise = new Array(5);

var x = new Array(5);

var y = new Array(5);

​

function sunnyCandyCircle(_x, _y, _r, _param_noise) {

    _r = _r / 2;

​

    beginShape(LINE_LOOP);

    for (var angle = 0.0; angle < 360.0; angle = angle + 1.0) {

        var circle_noise = 100 * noise(

            _param_noise + cos(radians(angle)),

            _param_noise + sin(radians(angle))

        );

​

        vertex(

            _x + (_r + circle_noise) * cos(radians(angle)),

            _y + (_r + circle_noise) * sin(radians(angle)));

    }

    endShape();

}

var step = 2;

var i0 = 0;

var j0 = 0;

var c = new Array(5);

​

function setup() {

​

    var canvas = createCanvas(windowWidth, windowHeight);

    canvas.parent('sketch-holder');

​

    c[0] = color(60, 136, 166, 200);

    c[1] = color(198, 212, 200, 200);

    c[2] = color(242, 220, 155, 200);

    c[3] = color(203, 134, 44, 200);

    c[4] = color(217, 156, 156, 200);

    frameRate(30);

    for (var i = 0; i < param_noise.length; i++) {

        param_noise[i] = random(1000);

    }

}

​

function draw() {

    background(244, 243, 225);

    //  noFill();

​

    noStroke();

​

    for (var i = 0; i < 5; i++) {

        fill(c[i]);

        sunnyCandyCircle(width / 2 + 100 * cos(radians(72 * i)), 180 + 100 * sin(radians(72 * i)), 100, param_noise[i]);

        param_noise[i] += 0.005;

    }

}

​

function windowResized() {

    resizeCanvas(windowWidth, windowHeight);

}

*/

​

// Third version

​

function setup() {

  var canvas = createCanvas(windowWidth, windowHeight);

  canvas.parent('sketch-holder');

​

  frameRate(3);

}

​

var angle = 0.0;

var gap = 0.0;

​

function draw() {

  background(244, 243, 225);

  // an array with some values

​

  // create an instance of scribble and set a few parameters

  var scribble = new Scribble();

  scribble.bowing = 1.1;

  scribble.roughness = 1.5;

​

  // draw a horizontal line across the center of the screen

  //scribble.scribbleLine(0, 0, windowWidth, windowHeight);

​

  var size = windowHeight;

​

  strokeWeight(30);

  // calculate the x and y coordinates for the border points of the hachure

  var xleft = width / 2 - size / 2 + 5;

  var xright = width / 2 + size / 2 - 5;

  var ytop = height / 2 - (size / 2);

  var ybottom = height / 2 + (size / 2);

  // reduce the sizes to fit in the rect

  if (ytop > ybottom) {

    ytop -= 5;

    ybottom += 5;

  } else {

    ytop += 5;

    ybottom -= 5;

  }

  var xCoords = [xleft, xright, xright, xleft];

  // the y coordinates of the border points of the hachure

  var yCoords = [ytop, ytop, ybottom, ybottom];

  // the gap between two hachure lines

  gap = 50.1;

  // the angle of the hachure in degrees

  angle += 1;

  // set the thikness of our hachure lines

  strokeWeight(3);

  //set the color of the hachure to a nice blue

  stroke(180, 203, 250, 200);

  // fill the rect with a hachure

  scribble.scribbleFilling(xCoords, yCoords, gap, angle);

}

​

function keyPressed() {

  if (key == 's') {

    save("output.png");

  }

}

​

function windowResized() {

  resizeCanvas(windowWidth, windowHeight);

}