<?php
/**
 * Maho
 *
 * @category    design
 * @package     default_default
 * @copyright   Copyright (c) 2006-2020 Magento, Inc. (https://magento.com)
 * @copyright   Copyright (c) 2021-2024 The OpenMage Contributors (https://openmage.org)
 * @copyright   Copyright (c) 2024 Maho (https://mahocommerce.com)
 * @license     https://opensource.org/licenses/afl-3.0.php  Academic Free License (AFL 3.0)
 */

/**
 * Categories tree for urlrewrites
 *
 * @see Mage_Adminhtml_Block_Urlrewrite_Category_Tree
 * @var Mage_Adminhtml_Block_Urlrewrite_Category_Tree $this
 */
?>
<div class="entry-edit">
    <div class="entry-edit-head">
        <h4><?= Mage::helper('adminhtml')->__('Select Category') ?></h4>
    </div>
    <fieldset>
        <input type="hidden" name="categories" id="product_categories" value="" />
        <div id="tree-div" class="tree" style="width:auto;"></div>
    </fieldset>
</div>

<?php if ($this->getRoot()): ?>
<script type="text/javascript">
//<![CDATA[
if ((typeof FORM_KEY) == 'undefined') {
    FORM_KEY = '';
}
var tree;

/**
 * Fix ext compatibility with prototype 1.6
 */
Ext.lib.Event.getTarget = function(e) {
    var ee = e.browserEvent || e;
    return ee.target ? Event.element(ee) : null;
};

/**
 * Extend standard TreePanel
 */
Ext.tree.TreePanel.Enhanced = function(el, config)
{
    Ext.tree.TreePanel.Enhanced.superclass.constructor.call(this, el, config);
};
Ext.extend(Ext.tree.TreePanel.Enhanced, Ext.tree.TreePanel, {
    /**
     * Category click event hanlder
     */
    categoryClick : function(node, e)
    {
        if (node.disabled === true) {
            return false;
        }

        window.location = window.location + '/' + node.id;
    }
});

/**
 * Initialize tree and its loader when extjs is ready
 */
Ext.onReady(function()
{
    categoryLoader = new Ext.tree.TreeLoader({
       dataUrl: '<?= $this->getLoadTreeUrl() ?>'
    });

    /**
     * Render tree node from config
     * Nodes text is generated from `name` and `products` attributes
     */
    categoryLoader.createNode = function(config) {
        var _node = Object.clone(config);
        _node.text = _node.name + ' (' + _node.product_count + ')';
        if (_node.children_count && !_node.children) {
            return new Ext.tree.AsyncTreeNode(_node);
        }
        return new Ext.tree.TreeNode(_node);
    };

    /**
     * Render tree nodes recursively
     */
    categoryLoader.buildCategoryTree = function(parent, config)
    {
        if (!config) {
            return;
        }
        if (parent && config && config.length) {
            for (var i in config) {
                if (!isNaN(i)) {
                    var node = this.createNode(config[i]);
                    parent.appendChild(node);
                    node.loader = node.getOwnerTree().loader;
                    if (config[i].children && config[i].children.length) {
                        this.buildCategoryTree(node, config[i].children);
                    }
                }
            }
        }
    };

    /**
     * Add additional params before loading asynchronous mode
     */
    categoryLoader.on('beforeload', function(treeLoader, node) {
        treeLoader.baseParams.id = node.attributes.id;
        treeLoader.baseParams.form_key = FORM_KEY;
    });

    // render categories tree
    var config = <?= $this->getTreeArray(null, true) ?>;
    tree = new Ext.tree.TreePanel.Enhanced('tree-div', {
        animate         : false,
        loader          : categoryLoader,
        enableDD        : false,
        containerScroll : true,
        selModel        : new Ext.tree.CheckNodeMultiSelectionModel(),
        rootVisible     : false,
        useAjax         : true,
        addNodeTo       : false
    });
    var root = new Ext.tree.TreeNode(config);
    tree.setRootNode(root);
    tree.addListener('click', tree.categoryClick);
    tree.loader.buildCategoryTree(root, config.children);
    tree.el.dom.innerHTML = '';
    tree.render();
});
//]]>
</script>
<?php endif ?>
