squares1

function onGLC(glc) {
    glc.loop();
    // glc.size(400, 400);
     glc.setDuration(4);
    // glc.setFPS(20);
     glc.setMode("single");
     glc.setEasing(false);
     glc.setMaxColors(30);

    glc.styles.backgroundColor = "white";

    var list = glc.renderList,
        width = glc.w,
        height = glc.h,
        color = glc.color;

    var numSquares = 32,
        diameter = 75,
        squareSize = 150;

    var container = list.addContainer({
        x: width / 2,
        y: height / 2,
        rotation: [45,-45]
    });


    for (var i = 0; i < numSquares; i++) {
        newX = Math.cos(2 * Math.PI * i / numSquares) * diameter;
        newY = Math.sin(2 * Math.PI * i / numSquares) * diameter;
        newX2 = Math.cos(2 * Math.PI * (i+numSquares/2) / numSquares) * diameter;
        newY2 = Math.sin(2 * Math.PI * (i+numSquares/2) / numSquares) * diameter;
        list.addRect({
            x: [newX,newX2],
            y: [newY,newY2],
            fill: false,
            stroke: true,
            w: squareSize,
            h: squareSize,
            parent: container,
        })
    };

}