var colors = "f7d1cd-e8c2ca-d1b3c4-b392ac-735d78".split("-").map(a=>"#"+a)
var colors_r = "ffd6ff-e7c6ff-c8b6ff-b8c0ff-bbd0ff".split("-").map(a=>"#"+a)
var clr,clr_r
//宣告陣列資料
var positionListX =[]
var positionListY =[]
var clrList =[]
var clr_r_List =[]
var sizeList =[]

function setup() {
  createCanvas(windowWidth, windowHeight);
  for(var j=0;j<positionListX.length;j++){
    positionListX.push(random(width))
    positionListY.push(random(height))
    clrList.push(colors[int(random(colors.length))])
    clr_r_List.push(colors[int(random(colors.length))])
    sizeList.push(random(0.5,1.5))
    push() 
      translate(positionListX[j],positionListY[j]) //原點移到視窗的中心點
      clr = clrList[j]
      clr_r = clr_r_List[j]
      drawFlower(clr,clr_r,sizeList[j])
    pop()
    }
}

function draw() {
   background(225);   
  for(var j=0;j<positionListX.length;j++){
    push() 
      translate(positionListX[j],positionListY[j]) //原點移到視窗的中心點
      rotate(frameCount/50)
      clr = clrList[j]
      clr_r = clr_r_List[j]
      drawFlower(clr,clr_r,map(mouseX,0,width,sizeList[j],sizeList[j]+1))
    pop()

  }
}

function drawFlower(clr,clr_r,size=1){
  scale(size)
  push()
    // fill(255,211,33)
    fill(clr_r)
    ellipse(0,0,50)
    ellipseMode(CORNER) 
    // fill(255,90,61)
    fill(clr)
    for(var i =0 ;i<16;i++){ 
      // rect(30, -20, 100 , 30)    
      ellipse(30, -20, 100 , 30);
      line(50,-5,110,-5)
      rotate(PI/8)
    }
  pop()    
}

function mousePressed(){

  positionListX.push(mouseX)
  positionListY.push(mouseY)
  clrList.push(colors[int(random(colors.length))])
  clr_r_List.push(colors[int(random(colors.length))])
  sizeList.push(random(0.5,1.5))
  let date_length = positionListX.length
  push() 
    translate(positionListX[date_length-1],positionListY[date_length-1]) //原點移到視窗的中心點
    clr = clrList[date_length-1]
    clr_r = clr_r_List[date_length-1]
    drawFlower(clr,clr_r,sizeList[date_length-1])
  pop()
}