[js/cakejs] Objecten creëren in een for loop

[Heli0s]

Ik ben bezig om met cakejs een animatie te maken die een aantal random cirkels maakt en die ook een random beweging geeft. Het maken gaat prima, alleen zijn alle cirkels aan elkaar gelinkt. Ik ben al een aantal dagen aan het zoeken op google, stackoverflow en tweakers, maar ik kan nu niet echt relevante oplossingen vinden.

de code in kwestie:

JavaScript:

window.onload = function() 
{
    // create a cakejs canvas with the size and with of the browser window
    var CAKECanvas = new Canvas(document.body, viewportWidth, viewportHeight);
    
    // create 50 random cicles
    for (var i=0; i < 50; i++) {
        var velocity = Math.random()*10;
        circle[i] = new Circle(Math.floor(Math.random()*20),
            {
                id: 'circle' + i,
                x: Math.floor(Math.random()*viewportWidth),
                y: Math.floor(Math.random()*viewportHeight),
                fill: get_random_color(),
                endAngle: Math.PI*2
            }
        );
        CAKECanvas.append(circle[i]);

        function check_bounds() {
            if (this.y >= viewportHeight) {
                direction = "down";
            } else if (this.y <= -10 ){
                direction = "up";
            } else if (this.x >= viewportWidth){
                direction = "right";
            } else if (this.x <= -10 ){
                direction = "left";
            }
        }

        circle[i].addFrameListener(
            function(t, dt)
            {
                switch (direction)
                {
                    case "up":
                        this.x += velocity;
                        this.y -= 1;
                        check_bounds();
                    break;
                }
            }
        );
    }
};

Ik heb al geprobeerd om met het this keyword in de for loop apparte objecten te maken, en een referentie aan de array (circle[i]) maar ze blijven allemaal de zelfde snelheid houden. Overigens heb ik een stuk van de switch afgehaald met het posten om het wat korter te maken.

[storeman]

Ik weet niet precies hoe het functies gebind worden, maar ik zie dat hier dus niet terugkomen.

Je voegt de frameListener toe in de vorm van een functie, deze wordt automatisch gebind en het object door CakeJS?

De check_bounds functie is niet gebind, die zou je dus niet in je domready hoeven hebben, het object circle staat hier namelijk helemaal los van. Als je vervolgens "check_bounds" aanroept, dan moet je op de een of andere manier het circle-object er nog aan koppelen, het zij als argument, of dmv binding.

[Heli0s]

De frameListener is een cakejs specifieke functie die iedere frame word aangeroepen (en dat gedeelte werkt ook). Het probleem is dat als ik iets aanpas hij dat voor alle cirkels doet en niet voor een specifieke. Zo zou hij (Volgens mij) in iedere run van de for loop een nieuwe velocity moeten berekenen, maar toch bewegen alle 50 cirkels zich even snel.

Dit doet mij denken dat alle cirkels een en hetzelfde object zijn en niet 50 verschillende objecten. En ik probeer dus te bereiken dat het allemaal losse objecten zijn.

De check_bounds functie en de switch zijn nog niet af, ik probeer er eerst voor te zorgen dat het losse objecten zijn, maar ik doe ergens iets fout