O teu código só está a adicionar um event handler ao elemento `circle`, tens de adaptar para os elementos `rect` também.

Podes fazer isso assim:

    var rects = document.querySelectorAll('rect');
    for (var i = 0; i < rects.length; i++) {
        rects[i].addEventListener('mousedown', mousedown);
    }
    shape.addEventListener('mousedown', mousedown);

(ou podias usar delegação como no exemplo no final da resposta)
	

Depois tens de resolver outro problema, as cooredenadas. No *setter* e no *getter* uma vez que elementos `rect` tem `x` e `y`, mas elementos `circle` têm `cx`  e `cy`. 

Aqui fica uma sugestão:

    function mousedown(evt) {
        var evt = evt || window.event;
        ddData.element = this;
        ddData.initialX = evt.clientX;
        ddData.initialY = evt.clientY;
        ddData.originalX = parseFloat(ddData.element.getAttributeNS(null, this.tagName == 'rect' ? 'x' : 'cx'));
        ddData.originalY = parseFloat(ddData.element.getAttributeNS(null, this.tagName == 'rect' ? 'y' : "cy"));
    };
    
    svg.onmousemove = function (evt) {
        var evt = evt || window.event;
        var el = ddData.element;
        if (el) {
            var posX = ddData.originalX + evt.clientX - ddData.initialX;
            var posY = ddData.originalY + evt.clientY - ddData.initialY;
            if (el.tagName == 'rect') {
                //move object
                el.setAttributeNS(null, "x", posX);
                el.setAttributeNS(null, "y", posY);
            } else {
                el.setAttributeNS(null, "cx", posX);
                el.setAttributeNS(null, "cy", posY);
            }
        }
    }


###jsFiddle: http://jsfiddle.net/y2d5og5s/

Podes mesmo fazer isto com delegação (via `event.target`) e assim nem precisas do ciclo `for`. Neste exemplo em baixo uso `.id` para decidir se o elemento pode ser movido ou não (assumindo que elementos com ID podem ser movidos), mas podias fazer isso com uma classe ou `data-` field.

###jsFiddle: http://jsfiddle.net/g50L96e7/