/* built with Studio Sketchpad: 
 *   https://sketchpad.cc
 * 
 * observe the evolution of this sketch: 
 *   https://p5js.sketchpad.cc/sp/pad/view/ro.6yvFr3zxhe5/rev.373
 * 
 * authors: 
 *   Andrea
 *   

 * license (unless otherwise specified): 
 *   creative commons attribution-share alike 3.0 license.
 *   https://creativecommons.org/licenses/by-sa/3.0/ 
 */ 



/*
This sketch builds on a prior work, "Dancing Test", created by Andrea & [unnamed author]
http://p5js.sketchpad.cc/sp/pad/view/ro.C4DvHOAXKn9Bws/rev.494
*/




/* 
  Pressing Control-R will render this p5.js sketch.
  p5.js, p5.dom.js, and p5.sound.js libraries are already loaded.
  To load more libraries/resources, use the "HTML" menu.
  To upload resources (including scripts), use the "Files" menu. 
*/


  

  var cWidth = 300; //591;
  var cHeight = 300; //846;
  var i = 0;
  var img;
  var angle = 0;
  var xtrans = 0;
  var ytrans = 0;
  
  function preload() {
    img = loadImage("/static/uploaded_resources/p.26478/fadinha.png");
    //img = loadImage("/static/uploaded_resources/p.26478/baby_face.png");
    jardim = loadImage("/static/uploaded_resources/p.26478/jardimLara.png");
  }
  
  
  // this is run once.   
  function setup() {  
      
    // set the size of the canvas inside the window.
    createCanvas(cWidth, cHeight);
    
    // limit the number of frames per second
    frameRate(60);
    

  } 

  
  

  
  
  function mousePressed() {
   // if (angle == 0) {
        xtrans = cWidth/8;
        ytrans = cHeight/8;
        angle += 10;
   // }
   // else {
   //     angle = 0;
   //     xtrans = ytrans = 0;
   // }
  }


function draw(){
  background(204);
  angleMode(DEGREES); // Change the mode to DEGREES
  var a = atan2(mouseY-height/2, mouseX-width/2);
  translate(width/2, height/2);
  //push();
  rotate(a);
  rect(-50, -10, 100, 20); // Larger rectangle is rotating in degrees
  //rect(-20, -5, 40, 10); // Larger rectangle is rotating in degrees
  
 //image(img, -20,-5);
  //pop();
  //angleMode(RADIANS); // Change the mode to RADIANS
  //rotate(a); // var a stays the same
  //rect(-40, -5, 20, 10); // Smaller rectangle is rotating in radians

}
  
  // this is run repeatedly.  
  function draw() {  
    
    //background(207, 220, 246);
    image(jardim,0,0);
    
    angleMode(DEGREES); // Change the mode to DEGREES
    var a = atan2(mouseY-height/2, mouseX-width/2);
    
    textSize(24);
    text(a, 10, 30);
    translate(width/2, height/2);
    //push();
    rotate(a);
    
    //rect(-20, -5, 40, 10); // Larger rectangle is rotating in degrees
    //image(img,-20,-5, cWidth/2, cHeight/2);
    //image(img,20,20);//mouseX, mouseY);
    image(img, -83, -83);
    //pop();
  
    //rotate(angle);
    //angle -= PI/30;
    //translate(xtrans, ytrans);


  }