var a, b, line;
window.onload = function() {
    var qcanvas = new Qcanvas({
        id: 'qcanvas',
        width: 500,
        height: 500,
    });

    a = qcanvas.arc({
        start: [50, 50],
        r: 10,
        sAngle: 0,
        eAngle: 360,
        fillColor: '#ffff00',
        borderColor: '#000'
    })


    b = qcanvas.arc({
        start: [200, 200],
        r: 10,
        sAngle: 0,
        eAngle: 360,
        fillColor: '#c3c3c3',
        borderColor: '#000'
    })


    var caleHandler1 = function() {
        if (typeof this.caleTime1 == 'undefined' ||
            (typeof this.caleTime1 !== 'undefined') &&
            ((new Date()).getTime() - this.caleTime1 > 1000)
        ) {


            var start = this.start();
            var end = this.end();
            var returnHandler1 = (function() {
                //A
                // |
                //h1 \ h2
                //   ↓
                //   B
                if (start[0] < end[0] && start[1] <= end[1]) {
                    //h1: [Math.abs(start[0] - end[0])*0.25+start[0],Math.abs(start[1] - end[1])*0.75+start[1]];
                    //h2: [Math.abs(start[0] - end[0])*0.75+start[0],Math.abs(start[1] - end[1])*0.25+start[1]];

                    return [Math.abs(start[0] - end[0]) * 0.25 + start[0], Math.abs(start[1] - end[1]) * 0.75 + start[1]];
                }
                //  A
                //  |
                //h2/h1
                // ↓
                // B
                if (start[0] >= end[0] && start[1] <= end[1]) {
                    //h1:[Math.abs(start[0] - end[0])*0.75+end[0],Math.abs(start[1] - end[1])*0.75+start[1]]
                    //h2:[Math.abs(start[0] - end[0])*0.25+end[0],Math.abs(start[1] - end[1])*0.25+start[1]]
                    return [Math.abs(start[0] - end[0]) * 0.75 + end[0], Math.abs(start[1] - end[1]) * 0.75 + start[1]]
                }

                // B
                // ↑
                //h1\h2
                //  |
                //  A
                if (start[0] > end[0] && start[1] >= end[1]) {
                    //h1:[Math.abs(start[0] - end[0])*0.25+end[0],Math.abs(start[1] - end[1])*0.75+end[1]];
                    //h2:[Math.abs(start[0] - end[0])*0.75+end[0],Math.abs(start[1] - end[1])*0.25+end[1]];
                    return [Math.abs(start[0] - end[0]) * 0.25 + end[0], Math.abs(start[1] - end[1]) * 0.75 + end[1]];
                }

                //   B
                //   ↑
                // h2/h1
                //  |
                //  A
                if (start[0] <= end[0] && start[1] >= end[1]) {
                    //h1:[Math.abs(start[0] - end[0])*0.75+start[0],Math.abs(start[1] - end[1])*0.75+end[1]];
                    //h2:[Math.abs(start[0] - end[0])*0.25+start[0],Math.abs(start[1] - end[1])*0.25+end[1]];
                    return [Math.abs(start[0] - end[0]) * 0.75 + start[0], Math.abs(start[1] - end[1]) * 0.75 + end[1]];
                }


            })()


            // var x = Math.abs(start[0] - end[0])*(start[0] > end[0]?0.75:0.25)+Math.min.call(null,start[0],end[0]);
            // var y = Math.abs(start[1] - end[1])*0.75+Math.min.call(null,start[1],end[1]);
            // console.log(x,y);
            this.oldHandler1 = returnHandler1;

            this.caleTime1 = (new Date()).getTime();

            console.log('1隔段时间再执行 降低执行频率')

            return this.oldHandler1;

        } else {

            return this.oldHandler1;
        }


        // return [50,80];
    }
    var caleHandler2 = function() {
        if (typeof this.caleTime2 == 'undefined' ||
            (typeof this.caleTime2 !== 'undefined') &&
            ((new Date()).getTime() - this.caleTime2 > 1000)
        ) {


            var start = this.start();
            var end = this.end();
            var returnHandler2 = (function() {
                //A
                // |
                //h1 \ h2
                //   ↓
                //   B
                if (start[0] < end[0] && start[1] <= end[1]) {
                    //h1: [Math.abs(start[0] - end[0])*0.25+start[0],Math.abs(start[1] - end[1])*0.75+start[1]];
                    //h2: [Math.abs(start[0] - end[0])*0.75+start[0],Math.abs(start[1] - end[1])*0.25+start[1]];

                    return [Math.abs(start[0] - end[0]) * 0.75 + start[0], Math.abs(start[1] - end[1]) * 0.25 + start[1]];
                }
                //  A
                //  |
                //h2/h1
                // ↓
                // B
                if (start[0] >= end[0] && start[1] <= end[1]) {
                    //h1:[Math.abs(start[0] - end[0])*0.75+end[0],Math.abs(start[1] - end[1])*0.75+start[1]]
                    //h2:[Math.abs(start[0] - end[0])*0.25+end[0],Math.abs(start[1] - end[1])*0.25+start[1]]
                    return [Math.abs(start[0] - end[0]) * 0.25 + end[0], Math.abs(start[1] - end[1]) * 0.25 + start[1]]
                }

                // B
                // ↑
                //h1\h2
                //  |
                //  A
                if (start[0] > end[0] && start[1] >= end[1]) {
                    //h1:[Math.abs(start[0] - end[0])*0.25+end[0],Math.abs(start[1] - end[1])*0.75+end[1]];
                    //h2:[Math.abs(start[0] - end[0])*0.75+end[0],Math.abs(start[1] - end[1])*0.25+end[1]];
                    return [Math.abs(start[0] - end[0]) * 0.75 + end[0], Math.abs(start[1] - end[1]) * 0.25 + end[1]];
                }

                //   B
                //   ↑
                // h2/h1
                //  |
                //  A
                if (start[0] <= end[0] && start[1] >= end[1]) {
                    //h1:[Math.abs(start[0] - end[0])*0.75+start[0],Math.abs(start[1] - end[1])*0.75+end[1]];
                    //h2:[Math.abs(start[0] - end[0])*0.25+start[0],Math.abs(start[1] - end[1])*0.25+end[1]];
                    return [Math.abs(start[0] - end[0]) * 0.25 + start[0], Math.abs(start[1] - end[1]) * 0.25 + end[1]];
                }


            })()




            // var x = Math.abs(start[0] - end[0])*(start[0] > end[0]?0.25:0.75)+Math.min.call(null,start[0],end[0]);
            // var y = Math.abs(start[1] - end[1])*0.25+Math.min.call(null,start[1],end[1]);
            // console.log(x,y);
            this.oldHandler2 = returnHandler2;

            this.caleTime2 = (new Date()).getTime();

            console.log('隔段时间再执行 降低执行频率')

            return this.oldHandler2;

        } else {

            return this.oldHandler2;
        }
    }

    var line = qcanvas.bezierCurve({
        start: function() { return a.start },
        handler1: caleHandler1,
        handler2: caleHandler2,
        end: function() { return b.start },
        width: 1,
        like: '->',
        color: 'red',
        drag: true,
        withText: '我是个三次曲线',
        pointerEvent: 'none',
        // handlerShow:true
    })
}