var aniDiv = null;
var cart = null;
var iter = 0;

function animateCart() {
        cart = document.getElementById('cart');
        if (cart != null) {
                aniDiv = document.getElementById('ani-cart');
                aniDiv.style.visibility = 'hidden';
                aniDiv.style.border = '2px red dashed';
                aniDiv.style.position = 'absolute';
                initAnimate();
        }
}

function initAnimate() {
        if (aniDiv != null) {
                aniDiv.style.visibility = 'hidden';
                aniDiv.style.width = cart.offsetWidth + 'px';
                aniDiv.style.height = cart.offsetHeight + 'px';
                aniDiv.style.left = cart.offsetLeft + 'px';
                aniDiv.style.top = cart.offsetTop + 'px';
                aniDiv.style.visibility = 'visible';
                iter++;
                setTimeout(doAnimateCart, 50);
        }
}

function doAnimateCart() {
        if (aniDiv != null) {
                if (iter <= 3) {
                        var y = aniDiv.offsetTop;
                        var x = aniDiv.offsetLeft;
                        var sx = aniDiv.offsetWidth;
                        var sy = aniDiv.offsetHeight;
                        aniDiv.style.width = (sx + 4) + 'px';
                        aniDiv.style.height = (sy + 4) + 'px';
                        aniDiv.style.left = (x - 3) + 'px';
                        aniDiv.style.top = (y - 3) + 'px';
                        if (aniDiv.offsetTop > 0) {
                                setTimeout(doAnimateCart, 10);
                        } else {
                                setTimeout(initAnimate, 10);
                        }
                } else {
                        aniDiv.style.visibility = 'hidden';
                }
        }
}