/**
 * created by troyxu on 16/12/6.
 */
var main = function () {

    var dotsarr = [],
        dotsnum = 0,
        maxdotsnum = 0,
        overnum = 0, // 超出最大数量的点的数量
        dotsdistance = 250, // 点之间产生连线的最大距离

        bg = document.getelementbyid('bg'),
        canvas = document.getelementbyid('canvas'),
        ctx = canvas.getcontext('2d'),

        // width = parseint(document.documentelement.clientwidth),
        // height = parseint(document.documentelement.clientheight),
        // area = width * height, // canvas区域面积

        width = parseint(document.documentelement.clientwidth),
        height = parseint(bg.offsetheight),
        area = width * height, // canvas区域面积

        csstext = 'width: '+width+'px; height: '+height+'px;';

    // 设置背景和canvas的宽高
    // bg.setattribute('style', csstext);
    // canvas.setattribute('style', csstext);
    canvas.width = (width * 2).tostring();
    canvas.height = (height * 2).tostring();

    // 更具canvas面积动态确定初始化点的数量和最大数量
    dotsnum = parseint(area / 6000);
    maxdotsnum = dotsnum * 2;

    //生成点
    for (var i = 0; i < dotsnum; i ++) {
        var dot = new dots();
        dotsarr.push(dot);
        dot.init(canvas);
    }

    //鼠标事件
    document.addeventlistener('click', createdot);
    function createdot(e) {
        var tx = e.pagex,
            ty = e.pagey;
        if ((tx > 0 && tx < width) && (ty > 0 && ty < height)) {

            for (var i = 0; i < 5; i ++) {
                var dot = new dots();
                dotsarr.push(dot);
                dotsnum += 1;
                dot.init(canvas, tx, ty);
            }
        }
    };
    document.addeventlistener('mousemove', movedot);
    function movedot(e) {

        var tx = e.pagex,
            ty = e.pagey;
        if ((tx > 0 && tx < width) && (ty > 0 && ty < height)) {
            dot.mousedot(tx, ty);
        }
    };

    //动画与连线
    var requestanimframe = requestanimationframe || webkitrequestanimationframe || orequestanimationframe || msrequestanimationframe;
    requestanimframe(animateupdate); // 兼容不同浏览器的requestanimationframe

    function animateupdate() {
        ctx.clearrect(0, 0, canvas.width, canvas.height); // 清空canvas中原有的内容

        // 更新点的位置 数量超出最大值时舍弃旧的点
        if (dotsnum > maxdotsnum) {
            overnum = dotsnum - maxdotsnum;
        }

        for (var i = overnum; i < dotsnum; i ++) {
            dotsarr[i].update();
        }

        // 绘制连线
        for (var i = overnum; i < dotsnum; i ++) {
            for (var j = i + 1; j < dotsnum; j ++) {
                var tx = dotsarr[i].x - dotsarr[j].x,
                    ty = dotsarr[i].y - dotsarr[j].y,
                    s = math.sqrt(math.pow(tx, 2) + math.pow(ty, 2));
                if (s < dotsdistance) {
                    ctx.beginpath();
                    ctx.moveto(dotsarr[i].x, dotsarr[i].y);
                    ctx.lineto(dotsarr[j].x, dotsarr[j].y);
                    ctx.strokestyle = 'rgba(255,255,255,'+(dotsdistance-s)/dotsdistance+')';
                    ctx.strokewidth = 1;
                    ctx.stroke();
                    ctx.closepath();
                }
            }
        }

        requestanimframe(animateupdate);
    }
}();