📄 ddcore.js
字号:
/*
* Ext JS Library 2.2.1
* Copyright(c) 2006-2009, Ext JS, LLC.
* licensing@extjs.com
*
* http://extjs.com/license
*/
/*
* These classes are derivatives of the similarly named classes in the YUI Library.
* The original license:
* Copyright (c) 2006, Yahoo! Inc. All rights reserved.
* Code licensed under the BSD License:
* http://developer.yahoo.net/yui/license.txt
*/
(function() {
var Event=Ext.EventManager;
var Dom=Ext.lib.Dom;
/**
* @class Ext.dd.DragDrop
* Defines the interface and base operation of items that that can be
* dragged or can be drop targets. It was designed to be extended, overriding
* the event handlers for startDrag, onDrag, onDragOver and onDragOut.
* Up to three html elements can be associated with a DragDrop instance:
* <ul>
* <li>linked element: the element that is passed into the constructor.
* This is the element which defines the boundaries for interaction with
* other DragDrop objects.</li>
* <li>handle element(s): The drag operation only occurs if the element that
* was clicked matches a handle element. By default this is the linked
* element, but there are times that you will want only a portion of the
* linked element to initiate the drag operation, and the setHandleElId()
* method provides a way to define this.</li>
* <li>drag element: this represents the element that would be moved along
* with the cursor during a drag operation. By default, this is the linked
* element itself as in {@link Ext.dd.DD}. setDragElId() lets you define
* a separate element that would be moved, as in {@link Ext.dd.DDProxy}.
* </li>
* </ul>
* This class should not be instantiated until the onload event to ensure that
* the associated elements are available.
* The following would define a DragDrop obj that would interact with any
* other DragDrop obj in the "group1" group:
* <pre>
* dd = new Ext.dd.DragDrop("div1", "group1");
* </pre>
* Since none of the event handlers have been implemented, nothing would
* actually happen if you were to run the code above. Normally you would
* override this class or one of the default implementations, but you can
* also override the methods you want on an instance of the class...
* <pre>
* dd.onDragDrop = function(e, id) {
* alert("dd was dropped on " + id);
* }
* </pre>
* @constructor
* @param {String} id of the element that is linked to this instance
* @param {String} sGroup the group of related DragDrop objects
* @param {object} config an object containing configurable attributes
* Valid properties for DragDrop:
* padding, isTarget, maintainOffset, primaryButtonOnly
*/
Ext.dd.DragDrop = function(id, sGroup, config) {
if(id) {
this.init(id, sGroup, config);
}
};
Ext.dd.DragDrop.prototype = {
/**
* The id of the element associated with this object. This is what we
* refer to as the "linked element" because the size and position of
* this element is used to determine when the drag and drop objects have
* interacted.
* @property id
* @type String
*/
id: null,
/**
* Configuration attributes passed into the constructor
* @property config
* @type object
*/
config: null,
/**
* The id of the element that will be dragged. By default this is same
* as the linked element , but could be changed to another element. Ex:
* Ext.dd.DDProxy
* @property dragElId
* @type String
* @private
*/
dragElId: null,
/**
* The ID of the element that initiates the drag operation. By default
* this is the linked element, but could be changed to be a child of this
* element. This lets us do things like only starting the drag when the
* header element within the linked html element is clicked.
* @property handleElId
* @type String
* @private
*/
handleElId: null,
/**
* An object who's property names identify HTML tags to be considered invalid as drag handles.
* A non-null property value identifies the tag as invalid. Defaults to the
* following value which prevents drag operations from being initiated by <a> elements:<pre><code>
{
A: "A"
}</code></pre>
* @property invalidHandleTypes
* @type Object
*/
invalidHandleTypes: null,
/**
* An object who's property names identify the IDs of elements to be considered invalid as drag handles.
* A non-null property value identifies the ID as invalid. For example, to prevent
* dragging from being initiated on element ID "foo", use:<pre><code>
{
foo: true
}</code></pre>
* @property invalidHandleIds
* @type Object
*/
invalidHandleIds: null,
/**
* An Array of CSS class names for elements to be considered in valid as drag handles.
* @property invalidHandleClasses
* @type Array
*/
invalidHandleClasses: null,
/**
* The linked element's absolute X position at the time the drag was
* started
* @property startPageX
* @type int
* @private
*/
startPageX: 0,
/**
* The linked element's absolute X position at the time the drag was
* started
* @property startPageY
* @type int
* @private
*/
startPageY: 0,
/**
* The group defines a logical collection of DragDrop objects that are
* related. Instances only get events when interacting with other
* DragDrop object in the same group. This lets us define multiple
* groups using a single DragDrop subclass if we want.
* @property groups
* @type object An object in the format {'group1':true, 'group2':true}
*/
groups: null,
/**
* Individual drag/drop instances can be locked. This will prevent
* onmousedown start drag.
* @property locked
* @type boolean
* @private
*/
locked: false,
/**
* Lock this instance
* @method lock
*/
lock: function() { this.locked = true; },
/**
* When set to true, other DD objects in cooperating DDGroups do not receive
* notification events when this DD object is dragged over them. Defaults to false.
* @property moveOnly
* @type boolean
*/
moveOnly: false,
/**
* Unlock this instace
* @method unlock
*/
unlock: function() { this.locked = false; },
/**
* By default, all instances can be a drop target. This can be disabled by
* setting isTarget to false.
* @property isTarget
* @type boolean
*/
isTarget: true,
/**
* The padding configured for this drag and drop object for calculating
* the drop zone intersection with this object.
* @property padding
* @type int[] An array containing the 4 padding values: [top, right, bottom, left]
*/
padding: null,
/**
* Cached reference to the linked element
* @property _domRef
* @private
*/
_domRef: null,
/**
* Internal typeof flag
* @property __ygDragDrop
* @private
*/
__ygDragDrop: true,
/**
* Set to true when horizontal contraints are applied
* @property constrainX
* @type boolean
* @private
*/
constrainX: false,
/**
* Set to true when vertical contraints are applied
* @property constrainY
* @type boolean
* @private
*/
constrainY: false,
/**
* The left constraint
* @property minX
* @type int
* @private
*/
minX: 0,
/**
* The right constraint
* @property maxX
* @type int
* @private
*/
maxX: 0,
/**
* The up constraint
* @property minY
* @type int
* @type int
* @private
*/
minY: 0,
/**
* The down constraint
* @property maxY
* @type int
* @private
*/
maxY: 0,
/**
* Maintain offsets when we resetconstraints. Set to true when you want
* the position of the element relative to its parent to stay the same
* when the page changes
*
* @property maintainOffset
* @type boolean
*/
maintainOffset: false,
/**
* Array of pixel locations the element will snap to if we specified a
* horizontal graduation/interval. This array is generated automatically
* when you define a tick interval.
* @property xTicks
* @type int[]
*/
xTicks: null,
/**
* Array of pixel locations the element will snap to if we specified a
* vertical graduation/interval. This array is generated automatically
* when you define a tick interval.
* @property yTicks
* @type int[]
*/
yTicks: null,
/**
* By default the drag and drop instance will only respond to the primary
* button click (left button for a right-handed mouse). Set to true to
* allow drag and drop to start with any mouse click that is propogated
* by the browser
* @property primaryButtonOnly
* @type boolean
*/
primaryButtonOnly: true,
/**
* The availabe property is false until the linked dom element is accessible.
* @property available
* @type boolean
*/
available: false,
/**
* By default, drags can only be initiated if the mousedown occurs in the
* region the linked element is. This is done in part to work around a
* bug in some browsers that mis-report the mousedown if the previous
* mouseup happened outside of the window. This property is set to true
* if outer handles are defined.
*
* @property hasOuterHandles
* @type boolean
* @default false
*/
hasOuterHandles: false,
/**
* Code that executes immediately before the startDrag event
* @method b4StartDrag
* @private
*/
b4StartDrag: function(x, y) { },
/**
* Abstract method called after a drag/drop object is clicked
* and the drag or mousedown time thresholds have beeen met.
* @method startDrag
* @param {int} X click location
* @param {int} Y click location
*/
startDrag: function(x, y) { /* override this */ },
/**
* Code that executes immediately before the onDrag event
* @method b4Drag
* @private
*/
b4Drag: function(e) { },
/**
* Abstract method called during the onMouseMove event while dragging an
* object.
* @method onDrag
* @param {Event} e the mousemove event
*/
onDrag: function(e) { /* override this */ },
/**
* Abstract method called when this element fist begins hovering over
* another DragDrop obj
* @method onDragEnter
* @param {Event} e the mousemove event
* @param {String|DragDrop[]} id In POINT mode, the element
* id this is hovering over. In INTERSECT mode, an array of one or more
* dragdrop items being hovered over.
*/
onDragEnter: function(e, id) { /* override this */ },
/**
* Code that executes immediately before the onDragOver event
* @method b4DragOver
* @private
*/
b4DragOver: function(e) { },
/**
* Abstract method called when this element is hovering over another
* DragDrop obj
* @method onDragOver
* @param {Event} e the mousemove event
* @param {String|DragDrop[]} id In POINT mode, the element
* id this is hovering over. In INTERSECT mode, an array of dd items
* being hovered over.
*/
onDragOver: function(e, id) { /* override this */ },
/**
* Code that executes immediately before the onDragOut event
* @method b4DragOut
* @private
*/
b4DragOut: function(e) { },
/**
* Abstract method called when we are no longer hovering over an element
* @method onDragOut
* @param {Event} e the mousemove event
* @param {String|DragDrop[]} id In POINT mode, the element
⌨️ 快捷键说明
复制代码
Ctrl + C
搜索代码
Ctrl + F
全屏模式
F11
切换主题
Ctrl + Shift + D
显示快捷键
?
增大字号
Ctrl + =
减小字号
Ctrl + -