Ext.onReady(function() {

    function setExpandStyle(panel) {
        panel.header.setStyle("background", "transparent url(images/left_menu_active.jpg)");
        panel.header.setStyle("color", "#ffffff");
    }
    ;

    function setCollapseStyle(panel) {
        panel.header.setStyle("background", "transparent");
        panel.header.setStyle("color", "#A42C17");
    }
    ;

    var ac = new Ext.Panel({
        renderTo: 'menu',
        layout: 'accordion',
        defaults: {
            bodyStyle: 'padding:10px; padding-left: 0px;'
        },
        layoutConfig: {
            fill: false,
            titleCollapse: true,
            animate: true,
            hideCollapseTool: true
        }
    });

    for (var i in items) {
        var tp = new Ext.tree.TreePanel({
            title: '— ' + items[i],
            split: true,
            collapsible: true,
            cls:'x-tree-noicon',
            hideCollapseTool: true,
            useArrows: true,
            animate: true,
            collapsed: true,
            lines: false,
            root: new Ext.tree.AsyncTreeNode({id: i,
                listeners: {
                    'beforeappend': processWordWrap
                }
            }),
            loader: new Ext.ux.DWRTreeLoader({dwrCall: dwrManager.getMenuNodes}),
            rootVisible: false,
            listeners: {
                'click': function(node) {
                    window.location = catalogUrl + "?id=" + node.id;
                },
                'expand': setExpandStyle,
                'beforeexpand': setExpandStyle,
                'collapse': setCollapseStyle,
                'beforecollapse': setCollapseStyle
            }
        });
        ac.add(tp);
    }
    ac.doLayout();

    // подсветим товарный раздел в меню, и развернем дерево в нем

    function expandAndHighlight(path, rootNode){
        var keys = path.split("/");
        var curNode = rootNode;
        if(curNode.attributes["id"] != keys[1]){
            if (curNode.attributes["id"].substr(0,1) == 'b') curNode.getUI().addClass("path-highlight");
            return;
        }
        var index = 1;
        var f = function(){
            if(++index == keys.length){
                if (curNode.attributes["id"].substr(0,1) == 'b') curNode.getUI().addClass("path-highlight");
                return;
            }
            var c = curNode.findChild("id", keys[index]);
            if(!c){
                return;
            }
            curNode = c;
            c.expand(false, false, f);
            if (curNode.attributes["id"].substr(0,1) == 'b') curNode.getUI().addClass("path-highlight");
        };
        if (curNode.attributes["id"].substr(0,1) == 'b') curNode.getUI().addClass("path-highlight");
        curNode.expand(false, false, f);
    }

    function processWordWrap(tree, node, child) {
        var plus = (child.leaf) ? 0 : 3;
        if (child.id.substring(0, 1) == 'b') {
            child.text = wrapLine(child.text, 1, 5, 5, 14);
        }
        if ((child.id.substring(0, 1) == 'c')) {
            if(node.id.substring(0, 1) == 'c'){
                child.text = wrapLine(child.text, 3, 15, 5, 14);
            }else{
                child.text = wrapLine(child.text, 2, 10, 5, 14) ;
            }
        }
        child.on('beforeappend', processWordWrap);
    }

    function wrapLine(line, mult, offset, offset_bottom, line_height) {
        var lines = line.split(" ");
        var ln = 0;
        line = "";
        for(var i = 0; i < lines.length; i++){
            if(ln + lines[i].length > 25){
                line += "<br>" + lines[i];
                ln = lines[i].length;
            }else{
                line += (i == 0 ? "" : " ") + lines[i];
                ln += lines[i].length;
            }
        }
        offset += 12 * mult;
        return "<p style='margin-left:"+offset+"px; margin-bottom:"+offset_bottom+"px;line-height:"+line_height+"px;white-space: pre-wrap;'>" + line + "</p>";
    }

    if(catalogId != ""){
        dwrManager.getPath(catalogId, function(data) {
            var treePanel = ac.items.get(data.split("/")[1].substring(1) - 1);
            setExpandStyle(treePanel);
            treePanel.expand(false);
            expandAndHighlight(data, treePanel.getRootNode());
        });
    }
});