AEM CQ 56 - Sample EditConfig Listener for Drag & Drop

Goal

Simple cq:editConfig listener fired when an image is drag and dropped from content finder onto the component. Check the demo

Solution

1) Set a listener on cq:editConfig, fired on ready event

2) Add the following code in listener

function () {
        if (!this.subDropTargets || ( this.subDropTargets.length === 0 )) {
            return;
        }

        var dt = this.subDropTargets[0];

        dt.notifyEnter = function (dragSource, e, data) {
            CQ.wcm.EditRollover.DropTarget.prototype.notifyEnter.call(this, dragSource, e, data);

            setTimeout(function () {
                alert("Image Dropped - " + data.records[0].id)
            }, 500);
        }
}