//
// Displays top menu.
//
function DisplayTopMenu(cats, selCatId, isSortable)
{               
    //
    // Case no top menu cats - return.
    //
    if (cats.length == 0)
    {
        return;
    }

    var handleStr;
    var switchedToNonSorted = false;
    var str = '<ul id="UlTopMenu">';

    //
    // Go over top menu items.
    //
    for (i=0; i < cats.length; i++)
    {
        //
        // Parse category data:
        //
        // . ID.
        // . Library name.
        // . Title.
        //
        t = cats[i].split("-");
                  
        catLevel = t[0];
        catId = t[1];
        catLibName = t[2];
        catStatus = t[3];
        t.shift();
        t.shift();
        t.shift();
        t.shift();
        title = t.join("-");
        
        //
        // Display only top level items.
        //
        if (catLevel > 0)
        {
            continue;
        }
        
        //
        // Case switch to non sorted items.
        //
        if ( !switchedToNonSorted && (parseInt(catId) != catId) )
        {
            switchedToNonSorted = true;
            str += '</ul><ul>';
        }
        
        //
        // Genereate page URL, either relative
        // (html page) or admin URL.
        //
        if (isHtmlMode)
        {
            url = (catStatus == 6) ?
                '../':
                '../'+catLibName;
        }
        
        else
        {
            sidStr = '';
            
            if (switchedToNonSorted)
            {
                sidStr = '&sid=' + siteId;
            }
            
            url = AppendUrl(JS_MODULE_WLIB_CATEGORY+'?'+catId)+sidStr;
        }
        
        //
        // Append HTML menu item to string.
        //
        if (switchedToNonSorted)
        {               
            handleStr = '';
        }
        
        else
        { 
            handleStr = 'class="handle"';
        }

        if (catId == selCatId)
        {
            str += '<li id="'+catId+'" class="selected" onClick="location.href=\''+url+'\'">';
            str += '<span id="TopMenu'+catId+'" '+handleStr+'>'+title+'</span>';
            str += '</li>';
        }
        
        else
        {
            str += '<li id="'+catId+'" onClick="location.href=\''+url+'\'">';
            str += '<span id="TopMenu'+catId+'" style="cursor: pointer;" '+handleStr+'>'+title+'</span>';
            str += '</li>';

            /*str += '<a id="'+catId+'" href="'+url+'">';
            str += '<span id="TopMenu'+catId+'" style="cursor: pointer;" '+handleStr+'>'+title+'</span>';
            str += '</a>';*/
        }
    }
   
    str += '</ul>';

    //
    // Write top menu box.
    //
    document.write(str);

    //
    // Make menu sortable.
    //
    if (isSortable)
    {    
        $("#UlTopMenu").sortable(
        { 
            handle : '.handle', 
            update : function () 
            { 
                var order = $('#UlTopMenu').sortable('toArray'); 
                xajax_ajax_update_top_menu_order(order);
            } 
        }); 
    }
}