docs/source/DropTarget.html

   1 <html>
   2 <head>
   3   <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
   4   <title>The source code</title>
   5     <link href="../resources/prettify/prettify.css" type="text/css" rel="stylesheet" />
   6     <script type="text/javascript" src="../resources/prettify/prettify.js"></script>
   7 </head>
   8 <body  onload="prettyPrint();">
   9     <pre class="prettyprint lang-js">/*!
  10  * Ext JS Library 3.3.0
  11  * Copyright(c) 2006-2010 Ext JS, Inc.
  12  * licensing@extjs.com
  13  * http://www.extjs.com/license
  14  */
  15 <div id="cls-Ext.dd.DropTarget"></div>/**
  16  * @class Ext.dd.DropTarget
  17  * @extends Ext.dd.DDTarget
  18  * A simple class that provides the basic implementation needed to make any element a drop target that can have
  19  * draggable items dropped onto it.  The drop has no effect until an implementation of notifyDrop is provided.
  20  * @constructor
  21  * @param {Mixed} el The container element
  22  * @param {Object} config
  23  */
  24 Ext.dd.DropTarget = Ext.extend(Ext.dd.DDTarget, {
  25
  26     constructor : function(el, config){
  27         this.el = Ext.get(el);
  28
  29         Ext.apply(this, config);
  30
  31         if(this.containerScroll){
  32             Ext.dd.ScrollManager.register(this.el);
  33         }
  34
  35         Ext.dd.DropTarget.superclass.constructor.call(this, this.el.dom, this.ddGroup || this.group,
  36               {isTarget: true});
  37     },
  38
  39     <div id="cfg-Ext.dd.DropTarget-ddGroup"></div>/**
  40      * @cfg {String} ddGroup
  41      * A named drag drop group to which this object belongs.  If a group is specified, then this object will only
  42      * interact with other drag drop objects in the same group (defaults to undefined).
  43      */
  44     <div id="cfg-Ext.dd.DropTarget-overClass"></div>/**
  45      * @cfg {String} overClass
  46      * The CSS class applied to the drop target element while the drag source is over it (defaults to "").
  47      */
  48     <div id="cfg-Ext.dd.DropTarget-dropAllowed"></div>/**
  49      * @cfg {String} dropAllowed
  50      * The CSS class returned to the drag source when drop is allowed (defaults to "x-dd-drop-ok").
  51      */
  52     dropAllowed : "x-dd-drop-ok",
  53     <div id="cfg-Ext.dd.DropTarget-dropNotAllowed"></div>/**
  54      * @cfg {String} dropNotAllowed
  55      * The CSS class returned to the drag source when drop is not allowed (defaults to "x-dd-drop-nodrop").
  56      */
  57     dropNotAllowed : "x-dd-drop-nodrop",
  58
  59     // private
  60     isTarget : true,
  61
  62     // private
  63     isNotifyTarget : true,
  64
  65     <div id="method-Ext.dd.DropTarget-notifyEnter"></div>/**
  66      * The function a {@link Ext.dd.DragSource} calls once to notify this drop target that the source is now over the
  67      * target.  This default implementation adds the CSS class specified by overClass (if any) to the drop element
  68      * and returns the dropAllowed config value.  This method should be overridden if drop validation is required.
  69      * @param {Ext.dd.DragSource} source The drag source that was dragged over this drop target
  70      * @param {Event} e The event
  71      * @param {Object} data An object containing arbitrary data supplied by the drag source
  72      * @return {String} status The CSS class that communicates the drop status back to the source so that the
  73      * underlying {@link Ext.dd.StatusProxy} can be updated
  74      */
  75     notifyEnter : function(dd, e, data){
  76         if(this.overClass){
  77             this.el.addClass(this.overClass);
  78         }
  79         return this.dropAllowed;
  80     },
  81
  82     <div id="method-Ext.dd.DropTarget-notifyOver"></div>/**
  83      * The function a {@link Ext.dd.DragSource} calls continuously while it is being dragged over the target.
  84      * This method will be called on every mouse movement while the drag source is over the drop target.
  85      * This default implementation simply returns the dropAllowed config value.
  86      * @param {Ext.dd.DragSource} source The drag source that was dragged over this drop target
  87      * @param {Event} e The event
  88      * @param {Object} data An object containing arbitrary data supplied by the drag source
  89      * @return {String} status The CSS class that communicates the drop status back to the source so that the
  90      * underlying {@link Ext.dd.StatusProxy} can be updated
  91      */
  92     notifyOver : function(dd, e, data){
  93         return this.dropAllowed;
  94     },
  95
  96     <div id="method-Ext.dd.DropTarget-notifyOut"></div>/**
  97      * The function a {@link Ext.dd.DragSource} calls once to notify this drop target that the source has been dragged
  98      * out of the target without dropping.  This default implementation simply removes the CSS class specified by
  99      * overClass (if any) from the drop element.
 100      * @param {Ext.dd.DragSource} source The drag source that was dragged over this drop target
 101      * @param {Event} e The event
 102      * @param {Object} data An object containing arbitrary data supplied by the drag source
 103      */
 104     notifyOut : function(dd, e, data){
 105         if(this.overClass){
 106             this.el.removeClass(this.overClass);
 107         }
 108     },
 109
 110     <div id="method-Ext.dd.DropTarget-notifyDrop"></div>/**
 111      * The function a {@link Ext.dd.DragSource} calls once to notify this drop target that the dragged item has
 112      * been dropped on it.  This method has no default implementation and returns false, so you must provide an
 113      * implementation that does something to process the drop event and returns true so that the drag source's
 114      * repair action does not run.
 115      * @param {Ext.dd.DragSource} source The drag source that was dragged over this drop target
 116      * @param {Event} e The event
 117      * @param {Object} data An object containing arbitrary data supplied by the drag source
 118      * @return {Boolean} True if the drop was valid, else false
 119      */
 120     notifyDrop : function(dd, e, data){
 121         return false;
 122     },
 123
 124     destroy : function(){
 125         Ext.dd.DropTarget.superclass.destroy.call(this);
 126         if(this.containerScroll){
 127             Ext.dd.ScrollManager.unregister(this.el);
 128         }
 129     }
 130 });</pre>
 131 </body>
 132 </html>