Animation drawing strokes

Code

var colors = ["#020206", "#0B4806", "#B2C117", "#ACA66F", "#30B47F", "#931B78", "#6239DC", "#F9B849", "#DB5D0E", "#A443FF", "#BBAFF6" ]

tool.minDistance = 10;
tool.maxDistance = 45;

var path;
var activeColor;

var activeIndicator = new Path.Circle({
    radius: 10,
    fillColor: 'white',
    center: view.center
})
activeIndicator.bringToFront()

activeColor = colors[Math.floor(Math.random() * colors.length)]

var group = new Group()

function createColor(color, position){
    var circle = new Path.Circle({
        radius: 20,
        fillColor: color,
        center: position
    })
    circle.sendToBack()
    circle.onMouseUp = function(event){
        activeColor = circle.fillColor
        activeIndicator.position = position
    }

}

for (var i = 0; i < colors.length; i++){
    createColor(colors[i], [40 + i * 50, 40])
}

function onMouseDown(event) {
	path = new Path();
    path.fillColor = activeColor
	path.add(event.point)
}

function onMouseDrag(event) {
	var step = event.delta / 2;
	step.angle += 90;

	var top = event.middlePoint + step;
	var bottom = event.middlePoint - step;

	path.add(top);
	path.insert(0, bottom);
	path.smooth();
}

function onMouseUp(event) {
	path.add(event.point)
	path.closed = true
	path.smooth()
    group.addChild(path)
}