<!DOCTYPE html>
|
<html>
|
<head>
|
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
|
<title>The source code</title>
|
<link href="../resources/prettify/prettify.css" type="text/css" rel="stylesheet" />
|
<script type="text/javascript" src="../resources/prettify/prettify.js"></script>
|
<style type="text/css">
|
.highlight { display: block; background-color: #ddd; }
|
</style>
|
<script type="text/javascript">
|
function highlight() {
|
document.getElementById(location.hash.replace(/#/, "")).className = "highlight";
|
}
|
</script>
|
</head>
|
<body onload="prettyPrint(); highlight();">
|
<pre class="prettyprint lang-js"><span id='Ext-view-DragZone'>/**
|
</span> * @private
|
*/
|
Ext.define('Ext.view.DragZone', {
|
extend: 'Ext.dd.DragZone',
|
<span id='Ext-view-DragZone-cfg-containerScroll'> containerScroll: false,
|
</span>
|
<span id='Ext-view-DragZone-method-constructor'> constructor: function(config) {
|
</span> var me = this,
|
view,
|
ownerCt,
|
el;
|
|
Ext.apply(me, config);
|
|
// Create a ddGroup unless one has been configured.
|
// User configuration of ddGroups allows users to specify which
|
// DD instances can interact with each other. Using one
|
// based on the id of the View would isolate it and mean it can only
|
// interact with a DropZone on the same View also using a generated ID.
|
if (!me.ddGroup) {
|
me.ddGroup = 'view-dd-zone-' + me.view.id;
|
}
|
|
// Ext.dd.DragDrop instances are keyed by the ID of their encapsulating element.
|
// So a View's DragZone cannot use the View's main element because the DropZone must use that
|
// because the DropZone may need to scroll on hover at a scrolling boundary, and it is the View's
|
// main element which handles scrolling.
|
// We use the View's parent element to drag from. Ideally, we would use the internal structure, but that
|
// is transient; DataView's recreate the internal structure dynamically as data changes.
|
// TODO: Ext 5.0 DragDrop must allow multiple DD objects to share the same element.
|
view = me.view;
|
ownerCt = view.ownerCt;
|
// We don't just grab the parent el, since the parent el may be
|
// some el injected by the layout
|
if (ownerCt) {
|
el = ownerCt.getTargetEl().dom;
|
} else {
|
el = view.el.dom.parentNode;
|
}
|
me.callParent([el]);
|
|
me.ddel = Ext.get(document.createElement('div'));
|
me.ddel.addCls(Ext.baseCSSPrefix + 'grid-dd-wrap');
|
},
|
|
<span id='Ext-view-DragZone-method-init'> init: function(id, sGroup, config) {
|
</span> this.initTarget(id, sGroup, config);
|
this.view.mon(this.view, {
|
itemmousedown: this.onItemMouseDown,
|
scope: this
|
});
|
},
|
|
<span id='Ext-view-DragZone-method-onValidDrop'> onValidDrop: function(target, e, id) {
|
</span> this.callParent();
|
// focus the view that the node was dropped onto so that keynav will be enabled.
|
target.el.focus();
|
},
|
|
<span id='Ext-view-DragZone-method-onItemMouseDown'> onItemMouseDown: function(view, record, item, index, e) {
|
</span> if (!this.isPreventDrag(e, record, item, index)) {
|
// Since handleMouseDown prevents the default behavior of the event, which
|
// is to focus the view, we focus the view now. This ensures that the view
|
// remains focused if the drag is cancelled, or if no drag occurs.
|
if (view.focusRow) {
|
view.focusRow(record);
|
}
|
this.handleMouseDown(e);
|
}
|
},
|
|
<span id='Ext-view-DragZone-method-isPreventDrag'> // private template method
|
</span> isPreventDrag: function(e) {
|
return false;
|
},
|
|
<span id='Ext-view-DragZone-method-getDragData'> getDragData: function(e) {
|
</span> var view = this.view,
|
item = e.getTarget(view.getItemSelector());
|
|
if (item) {
|
return {
|
copy: view.copy || (view.allowCopy && e.ctrlKey),
|
event: new Ext.EventObjectImpl(e),
|
view: view,
|
ddel: this.ddel,
|
item: item,
|
records: view.getSelectionModel().getSelection(),
|
fromPosition: Ext.fly(item).getXY()
|
};
|
}
|
},
|
|
<span id='Ext-view-DragZone-method-onInitDrag'> onInitDrag: function(x, y) {
|
</span> var me = this,
|
data = me.dragData,
|
view = data.view,
|
selectionModel = view.getSelectionModel(),
|
record = view.getRecord(data.item);
|
|
// Update the selection to match what would have been selected if the user had
|
// done a full click on the target node rather than starting a drag from it
|
if (!selectionModel.isSelected(record)) {
|
selectionModel.select(record, true);
|
}
|
data.records = selectionModel.getSelection();
|
|
me.ddel.update(me.getDragText());
|
me.proxy.update(me.ddel.dom);
|
me.onStartDrag(x, y);
|
return true;
|
},
|
|
<span id='Ext-view-DragZone-method-getDragText'> getDragText: function() {
|
</span> var count = this.dragData.records.length;
|
return Ext.String.format(this.dragText, count, count == 1 ? '' : 's');
|
},
|
|
<span id='Ext-view-DragZone-method-getRepairXY'> getRepairXY : function(e, data){
|
</span> return data ? data.fromPosition : false;
|
}
|
});</pre>
|
</body>
|
</html>
|