Javascript - 旋转球体图案与周围的飞行物体

Question

我怎样才能达到这个效果 www.blackbox.cool？

到目前为止，我只是设法得到球体，但我觉得我做错了

DEMO

出于某种原因，它会在10秒之后加速，然后慢下来，我无法想到如何在球体周围获得这些飞行物体

$(function(){
    var el = document.createElement('div'),
        transformProps = 'transform WebkitTransform MozTransform OTransform msTransform'.split(' '),
        transformProp = support(transformProps);

    function support(props) {
        for(var i = 0, l = props.length; i < l; i++) {
            if(typeof el.style[props[i]] !== "undefined") {
                return props[i];
            }
        }
    }

    var $sphere = $('#sphere'),
        sphere = {
            rounds: 10,
            panels: 25,
            panelWidth: 200,
            el: $sphere.find('.container'),
            build: function(p, r) {

                var panels = p || this.panels,
                    rounds = r || this.rounds,
                    rotationPerPanel = 360/panels,
                    rotationPerRound = 360/2/rounds,
                    yRotation,
                    xRotation,
                    width = this.panelWidth,
                    zTranslate = (width/2) / Math.tan(rotationPerPanel * Math.PI/180),
                    $container = this.el,
                    $ul,
                    $li,
                    i, j;

                this.el.html('');
                for(i = 0; i < rounds; i++) {
                    $ul = $('<ul>');
                    xRotation = rotationPerRound * i;
                    $ul[0].style[transformProp] = "rotateX("+ xRotation + "deg)";
                    for(j = 0; j < panels; j++) {
                        $li = $('<li>');
                        yRotation = rotationPerPanel * j;
                        $li[0].style[transformProp] = "rotateY("+ yRotation +"deg) translateZ("+ zTranslate +"px)";
                        $ul.append($li);
                    }
                    $container.append($ul);
                }
            }
        },
        mouse = {  start : {}   },
        touch = document.ontouchmove !== undefined,
        viewport = {
            x: 0,
            y: 0,
            el: $('#sphere .container')[0],
            move: function(coords) {
                if(coords) {
                    if(typeof coords.x === "number") this.x = coords.x;
                    if(typeof coords.y === "number") this.y = coords.y;
                }
                this.el.style[transformProp] = "rotateX("+this.x+"deg) rotateY("+this.y+"deg)";
            },
            reset: function() {
                this.move({x: 0, y: 0});
            }
        };

    sphere.build();
    function start(){
        viewport.move({x: viewport.x + 9, y: viewport.y + 1});
        setTimeout(start, 1000);
    }
    start();      

    $('#controls').bind('submit change', function(evt) {
        evt.preventDefault();
        $sphere.attr('class','').addClass($(evt.target).val());
    });
});

请帮忙！