aem - targetparsys 中的 Parsys (targetparsys)

Question

我们有一个带有组件的目标区域（target 和 targetparsys），它是一个包含一些组件的容器（parsys）。问题是，当这个容器位于目标区域时，容器的 parsys 变成了一个 targetparsys，在其中无法编辑内部组件。这个问题有解决办法吗？

我试图覆盖在overlayManager.js 中创建覆盖的逻辑。它已经解决了一点问题，但是没有对其中的组件进行重新排序的适当工作。

标签： aemtargeting

Answer 1

我通过更改和添加以下代码覆盖了以下文件 - /cq/gui/components/authoring/editors/clientlibs/core/js/overlayManager.js：

     self.create = function (editable) {
        if (!editable.overlay) {
            var parent = ns.editables.getParent(editable);

            // going up recursively until we reach the root container
            if (parent && !parent.overlay) {
                self.create(parent);
            }

            // we check again because a child overlay might also be created by the parent constructor
            if (!editable.overlay) {
                editable.overlay = new overlayConstructor(editable, parent ? parent.overlay.dom : container);
            }

            // get children sorted by depth of their paths
            var sortedChildren = getSortedChildren(editable, true);

            //and going down recursively until we reach the deepest editable
            sortedChildren.forEach(function (child) {
                self.create(child);
            });
        }
    };

    /**
    *  Returns the sorted {Array} of child {@link Granite.author.Editable}s by depth of their paths for the given {@link Granite.author.Editable}
    *
    *  @param {Granite.author.Editable} editable - {@link Granite.author.Editable} for which to find child editables to be sorted by depth of their paths
    *  @param {Boolean} all - All the children or only the direct descendant
    *
    *  WARNING! Not OTB function! See the description on {self.create = function(editable)}
    */
    function getSortedChildren(editable, all){
        var children = ns.editables.getChildren(editable, all);

        //key - editable, value - number of slashes
        var childrenMap = new Map();

        //going through all children
        for (let i = 0; i < children.length; i++){
            var path = children[i].path;

            var numberOfSlashes = 1;
            var isFirstSlashChecked = false;
            //searching slashes
            for (let j = 0; j < path.length; j++){
                var letter = path[j];

                var SLASH = '/';
                if (letter == SLASH){
                    if (isFirstSlashChecked){
                        childrenMap.set(children[i], ++numberOfSlashes);
                    } else {
                        childrenMap.set(children[i], numberOfSlashes);
                        isFirstSlashChecked = true;
                    }
                }
            }

            //if there are not slashes in editable path
            if (!isFirstSlashChecked){
                childrenMap.set(children[i], 0);
            }
        }

        //sort map by depth (number of slashes)
        var sortedChildrenMapByPaths = new Map([...childrenMap.entries()].sort((a, b) => a[1] - b[1])); 

        //return sorted editables
        return Array.from(sortedChildrenMapByPaths.keys());
    }

并在此处添加了检查 null 语句：

    function repositionOverlay(editable) {
        var parent;
        // if there is no overlay in place, don't bother we ignore it (most likely timing issue)
        if (editable.overlay) {
            parent = ns.editables.getParent(editable);

            //the place which was overlaid
            // don't rely on order of editables in the store...
            if (parent && parent.overlay != null && !parent.overlay.currentPos) {
                repositionOverlay(parent);
            }

            editable.overlay.position(editable, parent);
        }
    }