/**
 * startX:缩放后的左上角x坐标(canvas坐标系下)
 * startY:缩放后的左上角y坐标(canvas坐标系下)
 * endX：缩放后的右下上角x坐标(canvas坐标系下)
 * endY：缩放后的右下上角y坐标(canvas坐标系下)
 * name: 名称
 * canvas:canvas对象
 * ctx:ctx对象
 * id:id
 * zoomRate:缩放率
 * bstartx:原始左上角x坐标（图片坐标系下）
 * bstarty:原始左上角y坐标(图片坐标系下)
 * bendx:原始右下角x坐标（图片坐标系下）  
 * bendy:原始右下角y坐标（图片坐标系下）   
 */
export default  class Rect {
    constructor(startX,startY,canvas,ctx,name,id,bstartx = 0,bstarty = 0,bendx = 0,bendy = 0) {
        this.startX = startX
        this.startY = startY
        this.endX = this.startX
        this.endY = this.startY
        this.canvas = canvas
        this.ctx = ctx
        this.name = name
        this.id = id
        this.w = 0
        this.h = 0
        this.left = 0
        this.top = 0
        this.bstartx = bstartx
        this.bstarty = bstarty
        this.bendx = bendx
        this.bendy = bendy
        this.isDrawing = false
        this.lineWidth = 2
    }
    setDrawStatus (e) {
        this.isDrawing = e
    }
    getDrawStatus () {
        return this.isDrawing
    }
    draw() {
            this.ctx.strokeStyle = 'red'
            this.ctx.lineWidth = this.lineWidth
            this.w = Math.abs(this.endX - this.startX)
            this.h = Math.abs(this.endY - this.startY)
            this.left = this.endX > this.startX ? this.startX : this.endX 
            this.top = this.endY > this.startY ? this.startY : this.endY

            this.ctx.save();
            if (this.w > 5 && this.h > 5) {
                this.ctx.beginPath();
                this.ctx.rect(this.left, this.top, this.w, this.h);
                this.ctx.stroke();
                this.ctx.closePath()
                this.ctx.beginPath()
                // if (this.w > 50 && this.h > 50) {
                this.ctx.font = '20px serif'
                this.ctx.fillStyle = 'red'
                this.ctx.textAlign = 'left'
                this.ctx.textBaseline = 'top'
                this.ctx.fillText(this.name, this.startX + 5, this.startY + 5)
                // } else if (this.w < 50 || this.h < 50) {
                //     this.ctx.font = '20px serif'
                //     this.ctx.fillStyle = 'red'
                //     this.ctx.textAlign = 'left'
                //     this.ctx.textBaseline = 'bottom'
                //     this.ctx.fillText(this.name, this.startX, this.startY)
                // }
                this.ctx.fill()
                this.ctx.closePath()
            }
            this.ctx.restore();
    }
}