Duplicate group

HTML

<script src="https://rawgithub.com/kangax/fabric.js/master/dist/fabric.js"></script>
<a href="#" id="clone">Clone</a>
<canvas id="c" width="600" height="600"></canvas>

CSS

canvas {
    border: 1px solid #999;
}

JavaScript

var canvas = window._canvas = new fabric.Canvas('c');

var circle = new fabric.Circle({
    left: 200,
    top: 300,
    radius: 75,
    fill: 'rgba(0,255,0,0.5)',
});

fabric.Image.fromURL('http://fabricjs.com/assets/pug_small.jpg', function(img) {
    img.scale(0.5).set({
      left: 100,
      top: 100,
      angle: -15
    });
    canvas.add(img).setActiveObject(img);
  });

canvas.add(circle);

canvas.renderAll();

$('#clone').on('click', function(event) {
    canvas.getActiveGroup().forEachObject(function(o){ 
        var obj = o;
        if (fabric.util.getKlass(obj.type).async) {
            // This case this is for image
            obj.clone(function (clone) {
                clone.set({
                    left: 10,
                    top:  10,
                });
                canvas.add(clone);
            });
        }else{
            // This case this is for circle
            var clone = fabric.util.object.clone(o);
            clone.set({
                left: 10,
                top:  10,
            });
            canvas.add(clone); 
        }
    });
    canvas.discardActiveGroup().renderAll();
});