// javascript document
//var radius = 45;
//var dtr = math.pi / 180;
//var d = 496;
//
//var mclist = [];
//var active = false;
//var lasta = 1;
//var lastb = 1;
//var distr = true;
//var tspeed = 2;
//var size = 250;
//
//var mousex = 0;
//var mousey = 0;
//
//var howelliptical = 1;
//
//var aa = null;
//var odiv = null;
//
//window.onload = function() {
//    var i = 0;
//    var otag = null;
//
//    odiv = document.getelementbyid('div1');
//
//    aa = odiv.getelementsbytagname('a');
//
//    for (i = 0; i < aa.length; i++) {
//        otag = {};
//
//        otag.offsetwidth = aa[i].offsetwidth;
//        otag.offsetheight = aa[i].offsetheight;
//
//        mclist.push(otag);
//    }
//
//    sinecosine(0, 0, 0);
//
//    positionall();
//
//    odiv.onmouseover = function() {
//        active = true;
//    };
//
//    odiv.onmouseout = function() {
//        active = false;
//    };
//
//    odiv.onmousemove = function(ev) {
//        var oevent = window.event || ev;
//
//        mousex = oevent.clientx - (odiv.offsetleft + odiv.offsetwidth / 2);
//        mousey = oevent.clienty - (odiv.offsettop + odiv.offsetheight / 2);
//
//        mousex /= 5;
//        mousey /= 5;
//    };
//
//    setinterval(update, 30);
//};
//
//function update() {
//    var a;
//    var b;
//
//    if (active) {
//        a = (-math.min(math.max(-mousey, -size), size) / radius) * tspeed;
//        b = (math.min(math.max(-mousex, -size), size) / radius) * tspeed;
//    } else {
//        a = lasta * 0.98;
//        b = lastb * 0.98;
//    }
//
//    lasta = a;
//    lastb = b;
//
//    if (math.abs(a) <= 0.01 && math.abs(b) <= 0.01) {
//        return;
//    }
//
//    var c = 0;
//    sinecosine(a, b, c);
//    for (var j = 0; j < mclist.length; j++) {
//        var rx1 = mclist[j].cx;
//        var ry1 = mclist[j].cy * ca + mclist[j].cz * (-sa);
//        var rz1 = mclist[j].cy * sa + mclist[j].cz * ca;
//
//        var rx2 = rx1 * cb + rz1 * sb;
//        var ry2 = ry1;
//        var rz2 = rx1 * (-sb) + rz1 * cb;
//
//        var rx3 = rx2 * cc + ry2 * (-sc);
//        var ry3 = rx2 * sc + ry2 * cc;
//        var rz3 = rz2;
//
//        mclist[j].cx = rx3;
//        mclist[j].cy = ry3;
//        mclist[j].cz = rz3;
//
//        per = d / (d + rz3);
//
//        mclist[j].x = (howelliptical * rx3 * per) - (howelliptical * 2);
//        mclist[j].y = ry3 * per;
//        mclist[j].scale = per;
//        mclist[j].alpha = per;
//
//        mclist[j].alpha = (mclist[j].alpha - 0.6) * (10 / 6);
//    }
//
//    doposition();
//    depthsort();
//}
//
//function depthsort() {
//    var i = 0;
//    var atmp = [];
//
//    for (i = 0; i < aa.length; i++) {
//        atmp.push(aa[i]);
//    }
//
//    atmp.sort(function(vitem1, vitem2) {
//                if (vitem1.cz > vitem2.cz) {
//                    return -1;
//                } else if (vitem1.cz < vitem2.cz) {
//                    return 1;
//                } else {
//                    return 0;
//                }
//            });
//
//    for (i = 0; i < atmp.length; i++) {
//        atmp[i].style.zindex = i;
//    }
//}
//
//function positionall() {
//    var phi = 0;
//    var theta = 0;
//    var max = mclist.length;
//    var i = 0;
//
//    var atmp = [];
//    var ofragment = document.createdocumentfragment();
//
//    // 随机排序
//    for (i = 0; i < aa.length; i++) {
//        atmp.push(aa[i]);
//    }
//
//    atmp.sort(function() {
//                return math.random() < 0.5 ? 1 : -1;
//            });
//
//    for (i = 0; i < atmp.length; i++) {
//        ofragment.appendchild(atmp[i]);
//    }
//
//    odiv.appendchild(ofragment);
//
//    for (var i = 1; i < max + 1; i++) {
//        if (distr) {
//            phi = math.acos(-1 + (2 * i - 1) / max);
//            theta = math.sqrt(max * math.pi) * phi;
//        } else {
//            phi = math.random() * (math.pi);
//            theta = math.random() * (2 * math.pi);
//        }
//        // 坐标变换
//        mclist[i - 1].cx = radius * math.cos(theta) * math.sin(phi);
//        mclist[i - 1].cy = radius * math.sin(theta) * math.sin(phi);
//        mclist[i - 1].cz = radius * math.cos(phi);
//
//        aa[i - 1].style.left = mclist[i - 1].cx + odiv.offsetwidth / 2
//                - mclist[i - 1].offsetwidth / 2 + 'px';
//        aa[i - 1].style.top = mclist[i - 1].cy + odiv.offsetheight / 2
//                - mclist[i - 1].offsetheight / 2 + 'px';
//    }
//}
//
//function doposition() {
//    var l = odiv.offsetwidth / 2;
//    var t = odiv.offsetheight / 2;
//    for (var i = 0; i < mclist.length; i++) {
//        aa[i].style.left = mclist[i].cx + l - mclist[i].offsetwidth / 2 + 'px';
//        aa[i].style.top = mclist[i].cy + t - mclist[i].offsetheight / 2 + 'px';
//
//        aa[i].style.fontsize = math.ceil(12 * mclist[i].scale / 2) + 8 + 'px';
//
//        aa[i].style.filter = "alpha(opacity=" + 100 * mclist[i].alpha + ")";
//        aa[i].style.opacity = mclist[i].alpha;
//    }
//}
//
//function sinecosine(a, b, c) {
//    sa = math.sin(a * dtr);
//    ca = math.cos(a * dtr);
//    sb = math.sin(b * dtr);
//    cb = math.cos(b * dtr);
//    sc = math.sin(c * dtr);
//    cc = math.cos(c * dtr);
//}



//3d云标签

var tagele = "queryselectorall" in document ? document.queryselectorall(".tag") : getclass("tag"),
    //paper = "queryselectorall" in document ? document.queryselector(".tagball") : getclass("tagball")[0];
	paper = 3;
	radius = 220,
    falllength = 500,
    tags = [],
    anglex = math.pi / 500,
    angley = math.pi / 500,
    cx = paper.offsetwidth / 2,
    cy = paper.offsetheight / 2,
    ex = paper.offsetleft + document.body.scrollleft + document.documentelement.scrollleft,
    ey = paper.offsettop + document.body.scrolltop + document.documentelement.scrolltop;

function getclass(classname) {
    var ele = document.getelementsbytagname("*");
    var classele = [];
    for (var i = 0; i < ele.length; i++) {
        var cn = ele[i].classname;
        if (cn === classname) {
            classele.push(ele[i]);
        }
    }
    return classele;
}

function innit() {
    for (var i = 0; i < tagele.length; i++) {
        var a, b;
        var k = -1 + (2 * (i + 1) - 1) / tagele.length;
        var a = math.acos(k);
        var b = a * math.sqrt(tagele.length * math.pi);
        var x = radius * math.sin(a) * math.cos(b);
        var y = radius * math.sin(a) * math.sin(b);
        var z = radius * math.cos(a);
        var t = new tag(tagele[i], x, y, z);
        tagele[i].style.color = "rgb(" + parseint(math.random() * 255) + "," + parseint(math.random() * 255) + "," + parseint(math.random() * 255) + ")";
        tags.push(t);
        t.move();
    }
}
array.prototype.foreach = function(callback) {
    for (var i = 0; i < this.length; i++) {
        callback.call(this[i]);
    }
}

function animate() {
    setinterval(function() {
        rotatex();
        rotatey();
        tags.foreach(function() {
            this.move();
        })
    }, 17)
}
if ("addeventlistener" in window) {
    paper.addeventlistener("mousemove", function(event) {
        var x = event.clientx - ex - cx;
        var y = event.clienty - ey - cy;
        angley = x * 0.0001;
        anglex = y * 0.0001;
    });
} else {
    paper.attachevent("onmousemove", function(event) {
        var x = event.clientx - ex - cx;
        var y = event.clienty - ey - cy;
        angley = x * 0.0001;
        anglex = y * 0.0001;
    });
}

function rotatex() {
    var cos = math.cos(anglex);
    var sin = math.sin(anglex);
    tags.foreach(function() {
        var y1 = this.y * cos - this.z * sin;
        var z1 = this.z * cos + this.y * sin;
        this.y = y1;
        this.z = z1;
    })

}

function rotatey() {
    var cos = math.cos(angley);
    var sin = math.sin(angley);
    tags.foreach(function() {
        var x1 = this.x * cos - this.z * sin;
        var z1 = this.z * cos + this.x * sin;
        this.x = x1;
        this.z = z1;
    })
}
var tag = function(ele, x, y, z) {
    this.ele = ele;
    this.x = x;
    this.y = y;
    this.z = z;
}
tag.prototype = {
    move: function() {
        var scale = falllength / (falllength - this.z);
        var alpha = (this.z + radius) / (2 * radius);
        this.ele.style.fontsize = 15 * scale + "px";
        this.ele.style.opacity = alpha + 0.5;
        this.ele.style.filter = "alpha(opacity = " + (alpha + 0.5) * 100 + ")";
        this.ele.style.zindex = parseint(scale * 100);
        this.ele.style.left = this.x + cx - this.ele.offsetwidth / 2 + "px";
        this.ele.style.top = this.y + cy - this.ele.offsetheight / 2 + "px";
    }
}
innit();
animate();