I am trying to limit the moving object within the canvas but i am getting some difficulty in moving the object in the limit area on top and left side and when i scale the object bigger then also i am not able to limit the moving object on left and top sides of the canvas

canvas.observe("object:moving", function(e) {

  var obj = e.target;

  // if object is too big ignore

  if(obj.currentHeight > obj.canvas.height || obj.currentWidth > obj.canvas.width) {

    return;

  }



  var halfw = obj.currentWidth/2;

  var halfh = obj.currentHeight/2;

  var bounds = {

    tl: {x: halfw, y:halfh},

    br: {x: obj.canvas.width-halfw, y: obj.canvas.height-halfh}

  };



  // top-left  corner

  if(obj.top < bounds.tl.y || obj.left < bounds.tl.x) {

    obj.top = Math.max(obj.top, bounds.tl.y);

    obj.left = Math.max(obj.left, bounds.tl.x )

  }

        

  // bot-right corner

  if(obj.top > bounds.br.y || obj.left > bounds.br.x) {

    obj.top = Math.min(obj.top, bounds.br.y);

    obj.left = Math.min(obj.left, bounds.br.x)

  }

});