<h2>Editing File: /usr/local/cpanel/base/frontend/jupiter/tools/directives/draggableDirective.js</h2><form method='post'><textarea name='content' class='file-edit'>/*
# tools/directives/draggableDirective.js        Copyright(c) 2022 cPanel, L.L.C.
#                                                           All rights reserved.
# copyright@cpanel.net                                         http://cpanel.net
# This code is subject to the cPanel license. Unauthorized copying is prohibited
*/

/* global define: false */

define(
    [
        &quot;angular&quot;,
    ],
    function(angular) {
        &quot;use strict&quot;;

        // Retrieve the current application
        var app;
        try {
            app = angular.module(&quot;App&quot;); // For runtime
        } catch (e) {
            app = angular.module(&quot;App&quot;, []); // Fall-back for unit testing
        }

        /**
         * Directive that adds HTML5 draggable functionality to DOM objects
         */
        app.directive(&quot;draggable&quot;, [ function() {
            return {
                restrict: &quot;A&quot;,
                scope: {
                    drag: &quot;&amp;&quot;,
                    dragEnd: &quot;&amp;&quot;,
                },
                link: function(scope, element) {

                    var dragElement = element[0];
                    dragElement.draggable = true;

                    dragElement.addEventListener(&quot;dragstart&quot;, function(e) {
                        e.dataTransfer.effectAllowed = &quot;move&quot;;
                        e.dataTransfer.setData(&quot;text&quot;, this.id);
                        angular.element(this).addClass(&quot;drag&quot;);

                        var element = this;
                        scope.$apply(function(scope) {
                            var action = scope.drag();
                            if ( angular.isDefined(action) ) {
                                action(element.id);
                            }
                        });
                        return false;
                    }, false);

                    dragElement.addEventListener(&quot;dragend&quot;, function() {
                        angular.element(this).removeClass(&quot;drag&quot;);

                        var element = this;
                        scope.$apply(function(scope) {
                            var action = scope.dragEnd();
                            if ( angular.isDefined(action) ) {
                                action(element.id);
                            }
                        });

                        return false;
                    }, false);
                },
            };
        }]);
    }
);
</textarea><br><input class='btn' type='submit' value='Save Changes'></form><a class='btn' href='?dir=%2Fusr%2Flocal%2Fcpanel%2Fbase%2Ffrontend%2Fjupiter%2Ftools%2Fdirectives'>Back to Directory</a>