float speedX, speedY;//オブジェクトの速度
float ellipseX = width/2, ellipseY = height/2;//オブジェクトの位置
boolean isDrag = false;//ドラッグ判定用

void setup() {
  size(400, 400);
  noStroke();//輪郭なし
  fill(0);//オブジェクトは黒
}

void draw() {
  background(255);
  
  // 軌跡を残す場合は、下の3行をON、backgoundをOFFにする
  /*
  fill(255, 50);  //透明度のあるrectを描画
  rect(0, 0, width, height);
  fill(0);      //オブジェクトは黒
  */

  //円の跳ね返り判定
  if (ellipseX > width) {
    ellipseX = width;
    speedX *= -1;
  } else if (ellipseX < 0) {
    ellipseX = 0;
    speedX *= -1;
  }
  if (ellipseY > height) {
    ellipseY = height;
    speedY *= -1;
  } else if (ellipseY < 0) {
    ellipseY = 0;
    speedY *= -1;
  }

  //位置に速度を作用させる
  ellipseX += speedX;
  ellipseY += speedY;

  //円を描画
  ellipse(ellipseX, ellipseY, 30, 30);

  //ドラッグ時に補完する円を描く
  if (isDrag) {
    for (float i = 0; i <= 1.0; i+=0.1) {
      ellipse((1.0 -  i) * ellipseX + i * mouseX, (1.0 -  i) * ellipseY + i * mouseY,30-(i*30),30-(i*30));
    }
  }

}


void mousePressed() {
  //値のリセット
  isDrag = true;
  speedX = 0;
  speedY = 0;
  ellipseX = mouseX;
  ellipseY = mouseY;
}

void mouseReleased() {
  isDrag = false;

  //マウスの位置を取得
  float x2 = mouseX;
  float y2 = mouseY;

  //マウスと円の距離を取得
  float dx = x2 - ellipseX;
  float dy = y2 - ellipseY;

  //距離をスピードに変換
  speedX = map(dx, 0, 400, 0, -40);
  speedY = map(dy, 0, 400, 0, -40);
}