You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@flex.apache.org by ah...@apache.org on 2015/01/06 00:21:35 UTC

[16/16] git commit: [flex-asjs] [refs/heads/develop] - drag and drop in JS

drag and drop in JS


Project: http://git-wip-us.apache.org/repos/asf/flex-asjs/repo
Commit: http://git-wip-us.apache.org/repos/asf/flex-asjs/commit/c375ffd2
Tree: http://git-wip-us.apache.org/repos/asf/flex-asjs/tree/c375ffd2
Diff: http://git-wip-us.apache.org/repos/asf/flex-asjs/diff/c375ffd2

Branch: refs/heads/develop
Commit: c375ffd25be06c5477ed7f78e677b18c91888d57
Parents: 98487bf
Author: Alex Harui <ah...@apache.org>
Authored: Mon Jan 5 14:29:18 2015 -0800
Committer: Alex Harui <ah...@apache.org>
Committed: Mon Jan 5 15:21:03 2015 -0800

----------------------------------------------------------------------
 .../src/productsView/ProductCatalogPanel.mxml   |  4 +-
 .../src/productsView/ProductList.mxml           |  2 +-
 .../beads/controllers/DragMouseController.as    | 47 +++----------
 .../beads/controllers/DropMouseController.as    | 37 +++++------
 .../src/org/apache/flex/events/DragEvent.as     | 69 +++++++++++++++-----
 .../src/org/apache/flex/events/DragEvent.js     | 68 ++++++++++++-------
 6 files changed, 125 insertions(+), 102 deletions(-)
----------------------------------------------------------------------


http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/c375ffd2/examples/FlexJSStore/src/productsView/ProductCatalogPanel.mxml
----------------------------------------------------------------------
diff --git a/examples/FlexJSStore/src/productsView/ProductCatalogPanel.mxml b/examples/FlexJSStore/src/productsView/ProductCatalogPanel.mxml
index 836b694..92e231a 100755
--- a/examples/FlexJSStore/src/productsView/ProductCatalogPanel.mxml
+++ b/examples/FlexJSStore/src/productsView/ProductCatalogPanel.mxml
@@ -133,14 +133,14 @@ limitations under the License.
             if (DragMouseController.dragging == false)
             {
                 var thumb:ProductCatalogThumbnail = event.target as ProductCatalogThumbnail;
-                DragMouseController.dragSource = thumb.product;
+                DragEvent.dragSource = thumb.product;
 
                 var di:ProductCatalogThumbnail = new ProductCatalogThumbnail();
                 di.product = thumb.product;
                 di.currentState = thumb.currentState;
                 DragMouseController.dragImage = di;
                 
-                DragMouseController.dragInitiator = this;
+                DragEvent.dragInitiator = this;
             }    
         }
         

http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/c375ffd2/examples/FlexJSStore/src/productsView/ProductList.mxml
----------------------------------------------------------------------
diff --git a/examples/FlexJSStore/src/productsView/ProductList.mxml b/examples/FlexJSStore/src/productsView/ProductList.mxml
index b15c22f..8f44786 100755
--- a/examples/FlexJSStore/src/productsView/ProductList.mxml
+++ b/examples/FlexJSStore/src/productsView/ProductList.mxml
@@ -201,7 +201,7 @@ limitations under the License.
         private function doDragDrop(event:DragEvent):void
         {
             trace("doDragDrop");
-            var product:Product = event.dragSource as Product;
+            var product:Product = DragEvent.dragSource as Product;
             addProduct(product);
         }  
  

http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/c375ffd2/frameworks/as/projects/FlexJSJX/src/org/apache/flex/html/beads/controllers/DragMouseController.as
----------------------------------------------------------------------
diff --git a/frameworks/as/projects/FlexJSJX/src/org/apache/flex/html/beads/controllers/DragMouseController.as b/frameworks/as/projects/FlexJSJX/src/org/apache/flex/html/beads/controllers/DragMouseController.as
index 321a91a..d9be00e 100644
--- a/frameworks/as/projects/FlexJSJX/src/org/apache/flex/html/beads/controllers/DragMouseController.as
+++ b/frameworks/as/projects/FlexJSJX/src/org/apache/flex/html/beads/controllers/DragMouseController.as
@@ -79,28 +79,6 @@ package org.apache.flex.html.beads.controllers
 	public class DragMouseController extends EventDispatcher implements IBead
 	{
         /**
-         *  The data being dragged. Or an instance
-         *  of an object describing the data.
-         *  
-         *  @langversion 3.0
-         *  @playerversion Flash 10.2
-         *  @playerversion AIR 2.6
-         *  @productversion FlexJS 0.0
-         */
-        public static var dragSource:Object;
-        
-        /**
-         *  The object that wants to know if a
-         *  drop is accepted.
-         *  
-         *  @langversion 3.0
-         *  @playerversion Flash 10.2
-         *  @playerversion AIR 2.6
-         *  @productversion FlexJS 0.0
-         */
-        public static var dragInitiator:IDragInitiator;
-        
-        /**
          *  Whether there is a drag operation
          *  in progress.
          *  
@@ -228,10 +206,9 @@ package org.apache.flex.html.beads.controllers
                     Math.abs(event.screenY - mouseDownY) > threshold)
                 {
                     trace("sending dragStart");
-                    dragEvent = new DragEvent("dragStart", true, true);
-                    dragEvent.copyMouseEventProperties(event);
-                    IEventDispatcher(_strand).dispatchEvent(dragEvent);
-                    if (dragSource != null)
+                    dragEvent = DragEvent.createDragEvent("dragStart", event);
+                    DragEvent.dispatchDragEvent(dragEvent, IEventDispatcher(_strand));
+                    if (DragEvent.dragSource != null)
                     {
                         dragging = true;
                         host = UIUtils.findPopUpHost(_strand as IUIBase);
@@ -245,14 +222,11 @@ package org.apache.flex.html.beads.controllers
             else
             {
                 trace("sending dragMove", event.target);
-                dragEvent = new DragEvent("dragMove", true, true);
-                dragEvent.copyMouseEventProperties(event);
-                dragEvent.dragSource = dragSource;
-                dragEvent.dragInitiator = dragInitiator;
+                dragEvent = DragEvent.createDragEvent("dragMove", event);
                 pt = PointUtils.globalToLocal(new Point(event.screenX, event.screenY), host);
                 dragImage.x = pt.x + dragImageOffsetX;
                 dragImage.y = pt.y + dragImageOffsetY;
-                event.target.dispatchEvent(dragEvent);
+                DragEvent.dispatchDragEvent(dragEvent, IEventDispatcher(event.target));
             }
         }
         
@@ -264,15 +238,12 @@ package org.apache.flex.html.beads.controllers
             if (dragging)
             {
                 trace("sending dragEnd");
-                dragEvent = new DragEvent("dragEnd", true, true);
-                dragEvent.copyMouseEventProperties(event);
-                dragEvent.dragSource = dragSource;
-                dragEvent.dragInitiator = dragInitiator;
-                event.target.dispatchEvent(dragEvent);
+                dragEvent = DragEvent.createDragEvent("dragEnd", event);
+                DragEvent.dispatchDragEvent(dragEvent, IEventDispatcher(event.target));
             }
             dragging = false;
-            dragSource = null;
-            dragInitiator = null;
+            DragEvent.dragSource = null;
+            DragEvent.dragInitiator = null;
             if (dragImage && host)
                 host.removeElement(dragImage);
             dragImage = null;

http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/c375ffd2/frameworks/as/projects/FlexJSJX/src/org/apache/flex/html/beads/controllers/DropMouseController.as
----------------------------------------------------------------------
diff --git a/frameworks/as/projects/FlexJSJX/src/org/apache/flex/html/beads/controllers/DropMouseController.as b/frameworks/as/projects/FlexJSJX/src/org/apache/flex/html/beads/controllers/DropMouseController.as
index 1b32f31..03afba6 100644
--- a/frameworks/as/projects/FlexJSJX/src/org/apache/flex/html/beads/controllers/DropMouseController.as
+++ b/frameworks/as/projects/FlexJSJX/src/org/apache/flex/html/beads/controllers/DropMouseController.as
@@ -51,6 +51,17 @@ package org.apache.flex.html.beads.controllers
     [Event(name="dragOver", type="org.apache.flex.events.DragEvent")]
     
     /**
+     *  Indicates that the mouse is moving out of a component during
+     *  a drag/drop operation.
+     *  
+     *  @langversion 3.0
+     *  @playerversion Flash 10.2
+     *  @playerversion AIR 2.6
+     *  @productversion FlexJS 0.0
+     */
+    [Event(name="dragExit", type="org.apache.flex.events.DragEvent")]
+    
+    /**
      *  Indicates that a drop operation should be executed.
      *  
      *  @langversion 3.0
@@ -126,10 +137,7 @@ package org.apache.flex.html.beads.controllers
             var dragEvent:DragEvent;
             if (!inside)
             {
-                dragEvent = new DragEvent("dragEnter", true, true);
-                dragEvent.copyMouseEventProperties(event);
-                dragSource = dragEvent.dragSource = event.dragSource;
-                dragInitiator = dragEvent.dragInitiator = event.dragInitiator;
+                dragEvent = DragEvent.createDragEvent("dragEnter", event);
                 dispatchEvent(dragEvent);
                 inside = true;
                 IUIBase(_strand).topMostEventDispatcher.addEventListener(DragEvent.DRAG_END, dragEndHandler);
@@ -137,11 +145,8 @@ package org.apache.flex.html.beads.controllers
             }
             else
             {
-                dragEvent = new DragEvent("dragOver", true, true);
-                dragEvent.copyMouseEventProperties(event);
-                dragEvent.dragSource = event.dragSource;
-                dragEvent.dragInitiator = event.dragInitiator;
-                IEventDispatcher(_strand).dispatchEvent(dragEvent);
+                dragEvent = DragEvent.createDragEvent("dragOver", event);
+                dispatchEvent(dragEvent);
             }
         }
         
@@ -151,12 +156,7 @@ package org.apache.flex.html.beads.controllers
             
             if (inside)
             {
-                dragEvent = new DragEvent("dragExit", true, true);
-                dragEvent.copyMouseEventProperties(event);
-                dragEvent.dragSource = dragSource;
-                dragEvent.dragInitiator = dragInitiator;
-                dragSource = null;
-                dragInitiator = null;
+                dragEvent = DragEvent.createDragEvent("dragExit", event);
                 dispatchEvent(dragEvent);
                 inside = false;
             }
@@ -169,12 +169,7 @@ package org.apache.flex.html.beads.controllers
             trace("dragEnd");
             var dragEvent:DragEvent;
             
-            dragEvent = new DragEvent("dragDrop", true, true);
-            dragEvent.copyMouseEventProperties(event);
-            dragEvent.dragSource = event.dragSource;
-            dragEvent.dragInitiator = event.dragInitiator;
-            dragSource = null;
-            dragInitiator = null;
+            dragEvent = DragEvent.createDragEvent("dragDrop", event);
             dispatchEvent(dragEvent);
             
             inside = false;

http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/c375ffd2/frameworks/as/projects/FlexJSUI/src/org/apache/flex/events/DragEvent.as
----------------------------------------------------------------------
diff --git a/frameworks/as/projects/FlexJSUI/src/org/apache/flex/events/DragEvent.as b/frameworks/as/projects/FlexJSUI/src/org/apache/flex/events/DragEvent.as
index 9b46dd5..406ad9d 100644
--- a/frameworks/as/projects/FlexJSUI/src/org/apache/flex/events/DragEvent.as
+++ b/frameworks/as/projects/FlexJSUI/src/org/apache/flex/events/DragEvent.as
@@ -228,7 +228,34 @@ package org.apache.flex.events
         public static const DRAG_DROP:String = "dragDrop";
         
         /**
-         *  Constructor.
+         *  The object that wants to know if a drop is accepted
+         *  
+         *  @param type The name of the event.
+         *  @param bubbles Whether the event bubbles.
+         *  @param cancelable Whether the event can be canceled.
+         * 
+         *  @langversion 3.0
+         *  @playerversion Flash 10.2
+         *  @playerversion AIR 2.6
+         *  @productversion FlexJS 0.0
+         */
+        public static var dragInitiator:IDragInitiator;
+        
+        /**
+         *  The data being dragged. Or an instance
+         *  of an object describing the data.
+         *  
+         *  @langversion 3.0
+         *  @playerversion Flash 10.2
+         *  @playerversion AIR 2.6
+         *  @productversion FlexJS 0.0
+         */
+        public static var dragSource:Object;
+        
+
+        /**
+         *  Constructor.  Do not call 'new DragEvent', use the
+         *  createDragEvent method instead.
          *  
          *  @param type The name of the event.
          *  @param bubbles Whether the event bubbles.
@@ -245,40 +272,46 @@ package org.apache.flex.events
 		}
 
         /**
-         *  The object that wants to know if a drop is accepted
+         *  Factory for DragEvents.
          *  
          *  @param type The name of the event.
-         *  @param bubbles Whether the event bubbles.
-         *  @param cancelable Whether the event can be canceled.
+         *  @param event The MouseEvent properties to copy into the DragEvent.
+         *  @return The new DragEvent.
          * 
          *  @langversion 3.0
          *  @playerversion Flash 10.2
          *  @playerversion AIR 2.6
          *  @productversion FlexJS 0.0
          */
-        public var dragInitiator:IDragInitiator;
+        public static function createDragEvent(type:String, event:MouseEvent):DragEvent
+        {
+            var de:DragEvent = new DragEvent(type, true, true);
+            de.localX = event.localX;
+            de.localY = event.localY;
+            de.altKey = event.altKey;
+            de.ctrlKey = event.ctrlKey;
+            de.shiftKey = event.shiftKey;
+            de.buttonDown = event.buttonDown;
+            de.delta = event.delta;
+            de.relatedObject = event.relatedObject;
+            return de;
+        }
+        
         
         /**
-         *  The data being dragged. Or an instance
-         *  of an object describing the data.
+         *  Dispatch a DragEvent
          *  
+         *  @param event The DragEvent to dispatch.
+         *  @param target The target to dispatch the event from.
+         * 
          *  @langversion 3.0
          *  @playerversion Flash 10.2
          *  @playerversion AIR 2.6
          *  @productversion FlexJS 0.0
          */
-        public var dragSource:Object;
-        
-        public function copyMouseEventProperties(event:MouseEvent):void
+        public static function dispatchDragEvent(event:DragEvent, target:IEventDispatcher):void
         {
-            localX = event.localX;
-            localY = event.localY;
-            altKey = event.altKey;
-            ctrlKey = event.ctrlKey;
-            shiftKey = event.shiftKey;
-            buttonDown = event.buttonDown;
-            delta = event.delta;
-            relatedObject = event.relatedObject;
+            target.dispatchEvent(event);
         }
 	}
 }
\ No newline at end of file

http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/c375ffd2/frameworks/js/FlexJS/src/org/apache/flex/events/DragEvent.js
----------------------------------------------------------------------
diff --git a/frameworks/js/FlexJS/src/org/apache/flex/events/DragEvent.js b/frameworks/js/FlexJS/src/org/apache/flex/events/DragEvent.js
index 34395e4..648821a 100644
--- a/frameworks/js/FlexJS/src/org/apache/flex/events/DragEvent.js
+++ b/frameworks/js/FlexJS/src/org/apache/flex/events/DragEvent.js
@@ -14,6 +14,9 @@
 
 goog.provide('org.apache.flex.events.DragEvent');
 
+goog.require('goog.events.BrowserEvent');
+goog.require('org.apache.flex.events.EventDispatcher');
+
 
 
 /**
@@ -22,16 +25,16 @@ goog.provide('org.apache.flex.events.DragEvent');
  * sent with additional properties like dragInitiator and
  * dragSource tacked on.
  *
- * @extends {MouseEvent}
+ * @extends {goog.events.BrowserEvent}
  * @param {string} type The event type.
  */
 org.apache.flex.events.DragEvent = function(type) {
-  window.MouseEvent.base(this, 'constructor', type);
+  org.apache.flex.events.DragEvent.base(this, 'constructor');
 
   this.type = type;
 };
 goog.inherits(org.apache.flex.events.DragEvent,
-    window.MouseEvent);
+    goog.events.BrowserEvent);
 
 
 /**
@@ -47,32 +50,32 @@ org.apache.flex.events.DragEvent.prototype.FLEXJS_CLASS_INFO =
 /**
  * @expose
  * @param {string} type The event type.
+ * @param {Event} event The mouse event to base the DragEvent on.
+ * @return {MouseEvent} The new event.
  */
-org.apache.flex.events.DragEvent.prototype.init = function(type) {
-  this.type = type;
+org.apache.flex.events.DragEvent.createDragEvent =
+    function(type, event) {
+  var out = new MouseEvent(type);
+  out.initMouseEvent(type, true, true);
+  out.screenX = event.screenX;
+  out.screenY = event.screenY;
+  out.clientX = event.clientX;
+  out.clientY = event.clientY;
+  out.ctrlKey = event.ctrlKey;
+  out.shiftKey = event.shiftKey;
+  out.alttKey = event.altKey;
+  return out;
 };
 
 
 /**
  * @expose
- * @type {Object} dragInitiator The object that started the drag.
- */
-org.apache.flex.events.DragEvent.prototype.dragInitiator = null;
-
-
-/**
- * @expose
- * @type {Object} dragSource The data being dragged.
- */
-org.apache.flex.events.DragEvent.prototype.dragSource = null;
-
-
-/**
- * @expose
- * @param {MouseEvent} event The mouse event to copy.
+ * @param {Event} event The drag event.
+ * @param {Object} target The target for the event.
  */
-org.apache.flex.events.DragEvent.prototype.copyMouseEventProperties =
-    function(event) {
+org.apache.flex.events.DragEvent.dispatchDragEvent =
+    function(event, target) {
+  target.element.dispatchEvent(event);
 };
 
 
@@ -123,3 +126,24 @@ org.apache.flex.events.DragEvent.DRAG_EXIT = 'dragExit';
  * @type {string} DRAG_DROP The event type for dropping on a target.
  */
 org.apache.flex.events.DragEvent.DRAG_DROP = 'dragDrop';
+
+
+/**
+ * @return {boolean}
+ */
+org.apache.flex.events.DragEvent.installDragEventMixin = function() {
+  var o = org.apache.flex.events.EventDispatcher.elementEvents;
+  o.dragEnd = 1;
+  o.dragMove = 1;
+  return true;
+};
+
+
+/**
+ * Add some other events to listen from the element
+ */
+/**
+ * @type {boolean}
+ */
+org.apache.flex.events.DragEvent.dragEventMixin =
+    org.apache.flex.events.DragEvent.installDragEventMixin();