[GitHub] [royale-asjs] javeiga-iest opened a new issue #1114: Drag and Drop

[GitBox <gi...@apache.org>]

javeiga-iest opened a new issue #1114:
URL: https://github.com/apache/royale-asjs/issues/1114


   I'm using DragMouseController and DropMouseController to implement drag and drop on my project.
   
   That works fine, the problem occurs when I drop an item out of the destination container, the object just "disappears".
   
   I have thought of putting a drop handler at the level of the main form and somehow "cancel" the drop.
   
   There is a "preventDefault" function, but it raises exception when I call it.
   What am I doing wrong?
   
   My code:
   _DraggableItem.mxml_
   ```
   <?xml version="1.0" encoding="utf-8"?>
   <j:HGroup xmlns:fx="http://ns.adobe.com/mxml/2009"
       xmlns:j="library://ns.apache.org/royale/jewel"
       xmlns:js="library://ns.apache.org/royale/basic"
       xmlns="http://www.w3.org/1999/xhtml" xmlns:mx="library://ns.apache.org/royale/mx"
       xmlns:html="library://ns.apache.org/royale/html"
       mouseDown="onMouseDown(event)" >
       <fx:Script>
           <![CDATA[
   
               import org.apache.royale.html.beads.controllers.DragMouseController;
   
               private const DRAG_OFFSET:int = -20;
   
               private var localX:Number = 0;
               private var localY:Number = 0;
   
               private function onMouseDown(event:MouseEvent):void
               {
                   localX = event.localX;
                   localY = event.localY;
               }
   
               private function onDragStart(event:DragEvent):void
               {
                   DragMouseController.dragImageOffsetX = (localX * -1) + DRAG_OFFSET;
                   DragMouseController.dragImageOffsetY = (localY * -1) + DRAG_OFFSET;
                   DragMouseController.dragImage = this;
   
                   DragEvent.dragSource = this;
   
                   dispatchEvent(new Event("onDragging"));
               }
   
   		]]>
       </fx:Script>
       <j:beads>
           <js:ContainerDataBinding/>
           <js:DragMouseController dragStart="onDragStart(event)"/>
       </j:beads>
       <j:HGroup itemsHorizontalAlign="itemsLeft" percentWidth="100" mouseDown="selectedHor()">
           <js:FontAwesomeIcon text="{FontAwesome5IconType.CLOCK}" faStyle="{'r'}" relativeSize="xs" style="margin-right: 8px;"/> 
           <j:Label localId="label" text="test" />
       </j:HGroup>
   </j:HGroup>
   ```
   
   _preventDefault on my MainContent.mxml:_
   ```
   private function onDragEnd(event:DragEvent):void
   {
       event.preventDefault();
   }
   
   <j:beads>
       <js:DropMouseController dragDrop="onDragEnd(event)"/>
   </j:beads>
   ```


-- 
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.

For queries about this service, please contact Infrastructure at:
users@infra.apache.org