var wins = [];

//wins.push(win1);

//wins.push(win2);

​

​

class Win {

  constructor(x, y, w, h) {

    this.x = x;

    this.y = y;

    this.w = w;

    this.h = h;

    this.offsetX = 0;

    this.offsetY = 0;

    this.dragging = false;

    this.rollover = false;

  }

​

  show(px, py) {

    if (this.dragging) {

      this.x = px + this.offsetX;

      this.y = py + this.offsetY;

    }

​

    //stroke(255);

    rect(this.x, this.y, this.w, this.h);

    //noFill();

    rect(this.x, this.y + 16, this.w, 100)

    //noFill(false);

  }

​

  pressed(px, py) {

    if (px > this.x && px < this.x + this.w && py > this.y && py < this.y + this.h) {

      print("clicked on rect");

      this.dragging = true;

      this.offsetX = this.x - px;

      // print(this.offsetX);

      this.offsetY = this.y - py;

      // print(this.offsetY);

    }

  }

​

  notPressed(px, py) {

        print("mouse was released");

      this.dragging = false;

  }

}

​

​

function setup() {

  createCanvas(900, 700);

​

  let x = random(width);

  let y = random(height);

  let w = 128;

  let h = 16;

  for(var i = 0; i < 10; i++)

    {

      var e = new Win(random(width), random(height), w, h)

      //console.log(e)

      wins.push(e);

    }

  //console.log(wins[0]);

}

​

function draw() {

  background(0);

  //win1.show(mouseX, mouseY);

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

    wins[i].show(mouseX, mouseY);

  //console.log(wins[0]);

}

​

​

function mousePressed() {

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

    wins[i].pressed(mouseX, mouseY);

}

​

function mouseReleased() {

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

    wins[i].notPressed();

}

​

​