// Be sure that the following script is included in index.html:

// https://unpkg.com/p5.createloop@0.2.8/dist/p5.createloop.js

​

function setup() {

  createCanvas(400, 400);

  frameRate(30);

  pixelDensity(1);

  createLoop({ duration:3, gif:false });

}

​

//------------------------------------------

function draw() {

  background("lightBlue");

   //stick

  strokeWeight(3)

  stroke(150, 109, 90)

  fill(120, 92, 67);

  rectMode(CENTER);

  var sx =200

  var sy =200

  var sw =50 +(sin(animLoop.theta))

  var sh =40+(sin(animLoop.theta)+200)

  var stopright =150

  var stopleft =150

  var sbottomleft =sq(sin(animLoop.theta))+200

  var sbottomright=sq(sin(animLoop.theta))+200     

  rect(sx,sy,sw,sh,stopright,stopleft,sbottomright,sbottomleft);

  //left arm

  strokeWeight(6);

  stroke(237, 138, 222);

  fill(250, 187, 242);

  rect (110,(sin(animLoop.theta + radians(180))+6)*30, 35, 130,150);

  //popsicle

  fill(255, 212, 249);

  strokeWeight(4);

  stroke(237, 138, 222); 

  rectMode(CENTER);

  var x =200

  var y =150

  var w =200

  var h =200

  var topright =150

  var topleft =150

  var bottomleft =(sin(animLoop.theta)+2)*50

  var bottomright=(sin(animLoop.theta)+2)*50

  rect(x,y,w,h,topright,topleft,bottomright,bottomleft);

  //eyes

  fill(250, 187, 242);

  strokeWeight(3);

  stroke(150, 109, 90);

  rectMode(CENTER);

  for (i=150; i<270; i=i+70)

    rect(i,100,40,40,150);

  fill(87, 34, 79);

  for (i=150; i<270; i=i+70)

    rect(i,100,10,10,150,150,(sin(animLoop.theta)+2)*50,(sin(animLoop.theta)+2)*50);

  //right arm

  strokeWeight(6);

  stroke(237, 138, 222);

  fill(255, 212, 249);

  rect (280,(sin(animLoop.theta + radians(180))+6)*30, 35, 130,150);

  //smile

  fill (163, 118, 156);

  rect(180,130,30,30,150,150,(sin(animLoop.theta + radians(180))+1)*10, (sin(animLoop.theta + radians(180))+1)*10);

}

​