jQuery(document).ready(function() {

    var iAccordionHeight = jQuery(".Accordion").eq(0).height();
    var iAccordionItemHeight = jQuery(".Shelve").eq(0).height(); // Assume all headers are same height
    var iAccordionItemCount = jQuery(".AccordionItem").length;
        
    jQuery(".Shelve").mouseover(function() {
        var oThis = jQuery(this).parent();
    
        jQuery(".Shelve").addClass("ShelveOff").removeClass("ShelveOn");
        oThis.children(".Shelve").removeClass("ShelveOff").addClass("ShelveOn");
        
        var iItemTopCurrent = parseInt(oThis.css("top").replace(/px/,''));
        var iItemID = parseInt(oThis.attr("ItemID"));
        var iItemTop = parseInt(oThis.attr("ItemTop"));
        var iItemBottom = parseInt(oThis.attr("ItemBottom"));
        
        // Is accordion item at the top of the accordion?
        if(iItemTopCurrent == iItemTop)
        {
            // Move this and all preceeding accordion items down
            for(i = (iItemID); i < iAccordionItemCount; i++)
            {
                var oAccordionItem = jQuery(".AccordionItem").eq(i);
                oAccordionItem.animate({ top: oAccordionItem.attr("ItemBottom") + "px" }, 500);
            }
        }
        else
        {
            // Move this and all preceeding accordion items up
            for(i = 0; i < iItemID; i++)
            {
                var oAccordionItem = jQuery(".AccordionItem").eq(i);
                oAccordionItem.animate({ top: oAccordionItem.attr("ItemTop") + "px" }, 500);
            }
        }
    });
    
    jQuery(".AccordionItem").each(function(i) {
        var iItemID = (i + 1);
        
        // Calculate top and bottom positions for this accordion item
        var iItemTop = i * iAccordionItemHeight;
        var iItemBottom = iAccordionHeight - (((iAccordionItemCount + 1) - iItemID) * iAccordionItemHeight);
    
        // Attribute this accordion item
        jQuery(this).attr("ItemID", iItemID);
        jQuery(this).attr("ItemTop", iItemTop);
        jQuery(this).attr("ItemBottom", iItemBottom);
                        
        // Set the start position and layer ordinal
        jQuery(this).css({ zindex: (100 + iItemID), top: ((i == 0) ? iItemTop : iItemBottom) });
    });
    
});
