// ------- content panel subpanel helper class ------- //
function ContentPanelSubpanelHelper(navElementId, infoElementId, infoWrapperElementId, listDisplayModeGridElementId, singleDisplayModeElementId) {

    // external delegates
    var m_loadListDisplayModeDataDelegate = null;
    var m_loadPreviousDataDelegate = null;
    var m_loadNextDataDelegate = null;
    var m_refreshDelegate = null;
    
    // delegatge setters
    function setLoadListDisplayModeDataDelegate(theDelegate) {
        m_loadListDisplayModeDataDelegate = theDelegate;
    }

    function setLoadPreviousDataDelegate(theDelegate) {
        m_loadPreviousDataDelegate = theDelegate;
    }
    
    function setLoadNextDataDelegate(theDelegate) {
        m_loadNextDataDelegate = theDelegate;
    }  

    function setRefreshDelegate(theDelegate) {
        m_refreshDelegate = theDelegate;
    }

    // declare delegate setters
    this.setLoadListDisplayModeDataDelegate = setLoadListDisplayModeDataDelegate;
    this.setLoadPreviousDataDelegate = setLoadPreviousDataDelegate;
    this.setLoadNextDataDelegate = setLoadNextDataDelegate;
    this.setRefreshDelegate = setRefreshDelegate;
    
    
    // internal fields
    var m_navElementId                  = navElementId;
    var m_infoElementId                 = infoElementId;
    var m_infoWrapperElementId          = infoWrapperElementId;
    var m_listDisplayModeGridElementId  = listDisplayModeGridElementId;
    var m_singleDisplayModeElementId    = singleDisplayModeElementId;  
    var m_displayMode                   = g_contentPanelDisplayMode_list;
    var m_scrollTargetElementId;

    // perform initialization tasks
    function initialize(buttons) {

        // generic initialization
        for (var i = 0; i < buttons.length; i++) {
            if (!buttons[i].isDisabled) {
                $.preloadImages(buttons[i].activeImagePath, buttons[i].hoverImagePath, buttons[i].inactiveImagePath);

                $.bindHoverImages(
                    buttons[i].imageId,
                    buttons[i].hoverImagePath,
                    buttons[i].inactiveImagePath,
                    buttons[i].stringData,
                    null, null, null, null, null, null);
            }
        }

        // specific initialization
        $("#" + buttons[0].linkId + "").bind("click", handleListDisplayModeButtonClick);    // show all
        $("#" + buttons[1].linkId + "").bind("click", handlePreviousButtonClick);           // previous
        $("#" + buttons[2].linkId + "").bind("click", handleNextButtonClick);               // next
    }
    
    // handle list mode button click
    function handleListDisplayModeButtonClick() {
        setListDisplayMode(m_loadListDisplayModeDataDelegate);
    }

    // handle previous button click
    function handlePreviousButtonClick() { 
        if (m_loadPreviousDataDelegate)
            m_loadPreviousDataDelegate();
    }

    // handle next button click
    function handleNextButtonClick() {
        if (m_loadNextDataDelegate)
            m_loadNextDataDelegate();
    }

    // get the display mode
    function getDisplayMode() {
        return m_displayMode;
    }

    // display the grid of items & call callback once the panel has been resized
    function setListDisplayMode(callback) {
        m_displayMode = g_contentPanelDisplayMode_list;

        var sGridTop = "0px";
        var iParentHeight = $("#" + m_singleDisplayModeElementId + "").parent().height();
        
        $("#" + m_navElementId + "").slideUp(g_elementAnimationTime_milliseconds);
        $("#" + m_infoElementId + "").slideUp(g_elementAnimationTime_milliseconds);
        $("#" + m_singleDisplayModeElementId + "").animate({ top: "0" }, g_elementAnimationTime_milliseconds,
            function() {
                $("#" + m_singleDisplayModeElementId + "").css("display", "none");
                $("#" + m_listDisplayModeGridElementId + "").css("display", "block");
                callback();
                CSBfleXcroll(m_scrollTargetElementId);
            });
    }

    // display the single item
    function setSingleDisplayMode(id, scrollTargetElementId) {
        m_displayMode = g_contentPanelDisplayMode_single;
        m_scrollTargetElementId = scrollTargetElementId; // cache the scroll target element id
        
        var iGridTop = $("#" + m_infoElementId + "").height() + $("#" + m_navElementId + "").height() + 22;
        var sGridTop = iGridTop + "px";
        var iParentHeight = $("#" + m_listDisplayModeGridElementId + "").parent().height();
        var iGridHeight = iParentHeight - iGridTop;

        $("#" + m_listDisplayModeGridElementId + "").css("display", "none");
        $("#" + m_singleDisplayModeElementId + "").css("display", "block");
        
        $("#" + m_infoElementId + "").slideDown(g_elementAnimationTime_milliseconds);
        $("#" + m_navElementId + "").slideDown(g_elementAnimationTime_milliseconds);
        $("#" + m_singleDisplayModeElementId + "").animate({ top: sGridTop }, g_elementAnimationTime_milliseconds,
            function() {
                CSBfleXcroll(m_scrollTargetElementId);
                CSBfleXcroll(m_infoWrapperElementId);
            });
    }

    // populate info subpanel with info from specified record
    function populateInfoSubpanel(url, recordId, populateInfoSubpanelSuccess) {

        var params = { id: recordId };

        // ajax get request from server
        $.getJSON(url, params, populateInfoSubpanelSuccess);
    }

    // declare public functions
    this.initialize = initialize;
    this.setListDisplayMode = setListDisplayMode;
    this.setSingleDisplayMode = setSingleDisplayMode;
    this.getDisplayMode = getDisplayMode;
    this.populateInfoSubpanel = populateInfoSubpanel;
}