var Items = [];
var spherecontainer = null;

var radius = 200;
var diameter = 400;

var centerx, centery;

var active = false;
var mouse = { x: 0, y: 0 };
var dtr = Math.PI / 180;
var sqrtPImulNum;

function do_display(obj) {
    var collevel = 255 - Math.floor(256 * obj.scale);
    var element = $(obj.classname);
    element.css({
        "z-index": Math.floor(obj.scale * 100),
        "font-size": 50 + Math.round(obj.scale * 150) + "%",
        color: "rgb(" + collevel + "," + collevel + "," + collevel + ")"
    });
    element.css({
        left: Math.round(obj.posX - element.width()/2 + centerx) + "px",
        top: Math.round(obj.posY - element.height()/2 + centery) + "px"
    });
}

var lasta = 0;
var lastb = 0;
function updateItems() {
    var a, b;
    if (active) {
        a = -(mouse.y - centery) / radius * 2;
        b = (mouse.x - centerx) / radius * 2;
    } else {
        a = lasta * 0.98;
        b = lastb * 0.98;
    }
    lasta = a;
    lastb = b;
    if (Math.abs(a) > 0.01 || Math.abs(b) > 0.01) {
        var mod = sineCosine(a, b, 0);
        for (var j in Items) {
            do_rotate(Items[j], mod);
            do_display(Items[j]);
        }
    }
}

function do_rotate(item, mod) {
    // multiply positions by a x-rotation matrix
    var rx1 = item.posX;
    var ry1 = item.posY * mod.ca + item.posZ * -mod.sa;
    var rz1 = item.posY * mod.sa + item.posZ * mod.ca;
    // multiply new positions by a y-rotation matrix
    var rx2 = rx1 * mod.cb + rz1 * mod.sb;
    var ry2 = ry1;
    var rz2 = rx1 * -mod.sb + rz1 * mod.cb;
    // multiply new positions by a z-rotation matrix
    var rx3 = rx2 * mod.cc + ry2 * -mod.sc;
    var ry3 = rx2 * mod.sc + ry2 * mod.cc;
    var rz3 = rz2;
    // set arrays to new positions
    item.posX = rx3;
    item.posY = ry3;
    item.posZ = rz3;
    // add perspective
    item.scale = radius / (diameter + rz3);
}

var phase_reducer = 1;
var init_phase = 0;
function expand() {
    phase_reducer *= 0.95;
    if (phase_reducer <= 0.005) phase_reducer = 0;
    if (init_phase == 1) {
        window.setInterval("updateItems()", 15);
        do_fadeout();
        return;
    }
    init_phase = 1 - phase_reducer;
    var newrad = radius * Math.sin(init_phase);
    var phi, theta;
    for (var j in Items) {
        phi = Items[j].init_phi;
        theta = Items[j].init_theta;
        Items[j].posX = newrad * Math.cos(theta) * Math.sin(phi);
        Items[j].posY = newrad * Math.sin(theta) * Math.sin(phi);
        Items[j].posZ = newrad * Math.cos(phi);
        Items[j].scale = newrad / (diameter + Items[j].posZ);
        do_rotate(Items[j], sineCosine(0, 90 * init_phase, 180 * init_phase));
        do_display(Items[j]);
    }
    window.setTimeout(expand, 10);
}

function sineCosine(a, b, c) {
    return {
        sa: Math.sin(a * dtr),
        ca: Math.cos(a * dtr),
        sb: Math.sin(b * dtr),
        cb: Math.cos(b * dtr),
        cc: Math.cos(c * dtr),
        sc: Math.sin(c * dtr)
    };
}

function do_fadeout() {
    $("#editiologo").fadeTo(2000, 0, do_fadein);
}
function do_fadein() {
    $("#editiologo").fadeTo(2000, 1, do_fadeout);
}

$(document).ready(function() {
    var counter = 0;
    spherecontainer = $("#spherecontainer");
    spherecontainer.css({ position: "relative" });
    centerx = spherecontainer.width() / 2;
    centery = spherecontainer.height() / 2;
    $(".sphereitem", spherecontainer).each(function() {
        var act = $(this);
        act.addClass("jsphere-item" + counter);

        act.css("position", "absolute");
        Items.push({
            classname: ".jsphere-item" + counter,
            posX: 0,
            posY: 0,
            posZ: 0,
            init_theta: 0,
            init_phi: 0
        });
        act.hide();

        counter++;
    });
    spherecontainer.append("<span id=\"editiologo\" src=\"http://www.editio.at/images/web/logo.png\" alt=\"editio.at\">EDITIO.AT</span>");

    var sphereitem = $(".sphereitem");
    sphereitem.hover(function(e) {
        $(this).css({ border: "1px solid #000" });
    }, function(e) {
        $(this).css({ border: "none" });
    });

    var logo = $("#editiologo");
    logo.css({
        "z-index": 50,
        position: "absolute",
        left: Math.round(centerx - logo.width() / 2),
        top: Math.round(centery - logo.height() / 2),
        opacity: 1

    });

    for (
		var x, j, i = Items.length; i;
		j = parseInt(Math.random() * i),
		x = Items[--i],
		Items[i] = Items[j],
		Items[j] = x
		);

    var phi = 0;
    var theta = 0;
    var numitems = Items.length;
    sqrtPImulNum = Math.sqrt(numitems * Math.PI);

    for (var index = 1; index < numitems + 1; index++) {
        phi = Math.acos(-1 + (2 * index - 1) / numitems);
        theta = sqrtPImulNum * phi;

        Items[index - 1].init_phi = phi;
        Items[index - 1].init_theta = theta;
    }

    spherecontainer.mousemove(function(e) {
        active = true;
        var posx = 0;
        var posy = 0;
        if (!e) var e = window.event;
        if (e.pageX || e.pageY) {
            posx = e.pageX;
            posy = e.pageY;
        }
        else if (e.clientX || e.clientY) {
            posx = e.clientX + document.body.scrollLeft
				+ document.documentElement.scrollLeft;
            posy = e.clientY + document.body.scrollTop
				+ document.documentElement.scrollTop;
        }
        var offset = spherecontainer.offset();
        mouse.x = posx - offset.left;
        mouse.y = posy - offset.top;
    }).mouseleave(function() { active = false; });
    setTimeout(function() { $(".sphereitem", spherecontainer).show(); expand(); }, 2000);
});