?? ddview.js
字號:
Array.prototype.contains = function(element) { return this.indexOf(element) !== -1;};Ext.namespace("Ext.ux"); /** * @class Ext.ux.DDView * A DnD enabled version of Ext.View. * @param {Element/String} container The Element in which to create the View. * @param {String} tpl The template string used to create the markup for each element of the View * @param {Object} config The configuration properties. These include all the config options of * {@link Ext.View} plus some specific to this class.<br> * <p> * Drag/drop is implemented by adding {@link Ext.data.Record}s to the target DDView. If copying is * not being performed, the original {@link Ext.data.Record} is removed from the source DDView.<br> * <p> * The following extra CSS rules are needed to provide insertion point highlighting:<pre><code> .x-view-drag-insert-above { border-top:1px dotted #3366cc; } .x-view-drag-insert-below { border-bottom:1px dotted #3366cc; } </code></pre> * */ Ext.ux.DDView = function(config) { if (!config.itemSelector) { var tpl = config.tpl; if (this.classRe.test(tpl)) { config.tpl = tpl.replace(this.classRe, 'class=$1x-combo-list-item $2$1'); } else { config.tpl = tpl.replace(this.tagRe, '$1 class="x-combo-list-item" $2'); } config.itemSelector = ".x-combo-list-item"; } Ext.ux.DDView.superclass.constructor.call(this, Ext.apply(config, { border: false })); }; Ext.extend(Ext.ux.DDView, Ext.DataView, { /** @cfg {String/Array} dragGroup The ddgroup name(s) for the View's DragZone. */ /** @cfg {String/Array} dropGroup The ddgroup name(s) for the View's DropZone. */ /** @cfg {Boolean} copy Causes drag operations to copy nodes rather than move. */ /** @cfg {Boolean} allowCopy Causes ctrl/drag operations to copy nodes rather than move. */ sortDir: 'ASC', isFormField: true, classRe: /class=(['"])(.*)\1/, tagRe: /(<\w*)(.*?>)/, reset: Ext.emptyFn, clearInvalid: Ext.form.Field.prototype.clearInvalid, msgTarget: 'qtip', afterRender: function() { Ext.ux.DDView.superclass.afterRender.call(this); if (this.dragGroup) { this.setDraggable(this.dragGroup.split(",")); } if (this.dropGroup) { this.setDroppable(this.dropGroup.split(",")); } if (this.deletable) { this.setDeletable(); } this.isDirtyFlag = false; this.addEvents( "drop" ); }, validate: function() { return true; }, destroy: function() { this.purgeListeners(); this.getEl().removeAllListeners(); this.getEl().remove(); if (this.dragZone) { if (this.dragZone.destroy) { this.dragZone.destroy(); } } if (this.dropZone) { if (this.dropZone.destroy) { this.dropZone.destroy(); } } }, /** Allows this class to be an Ext.form.Field so it can be found using {@link Ext.form.BasicForm#findField}. */ getName: function() { return this.name; }, /** Loads the View from a JSON string representing the Records to put into the Store. */ setValue: function(v) { if (!this.store) { throw "DDView.setValue(). DDView must be constructed with a valid Store"; } var data = {}; data[this.store.reader.meta.root] = v ? [].concat(v) : []; this.store.proxy = new Ext.data.MemoryProxy(data); this.store.load(); }, /** @return {String} a parenthesised list of the ids of the Records in the View. */ getValue: function() { var result = '('; this.store.each(function(rec) { result += rec.id + ','; }); return result.substr(0, result.length - 1) + ')'; }, getIds: function() { var i = 0, result = new Array(this.store.getCount()); this.store.each(function(rec) { result[i++] = rec.id; }); return result; }, isDirty: function() { return this.isDirtyFlag; }, /** * Part of the Ext.dd.DropZone interface. If no target node is found, the * whole Element becomes the target, and this causes the drop gesture to append. */ getTargetFromEvent : function(e) { var target = e.getTarget(); while ((target !== null) && (target.parentNode != this.el.dom)) { target = target.parentNode; } if (!target) { target = this.el.dom.lastChild || this.el.dom; } return target; }, /** * Create the drag data which consists of an object which has the property "ddel" as * the drag proxy element. */ getDragData : function(e) { var target = this.findItemFromChild(e.getTarget()); if(target) { if (!this.isSelected(target)) { delete this.ignoreNextClick; this.onItemClick(target, this.indexOf(target), e); this.ignoreNextClick = true; } var dragData = { sourceView: this, viewNodes: [], records: [], copy: this.copy || (this.allowCopy && e.ctrlKey) }; if (this.getSelectionCount() == 1) { var i = this.getSelectedIndexes()[0]; var n = this.getNode(i); dragData.viewNodes.push(dragData.ddel = n); dragData.records.push(this.store.getAt(i)); dragData.repairXY = Ext.fly(n).getXY(); } else { dragData.ddel = document.createElement('div'); dragData.ddel.className = 'multi-proxy'; this.collectSelection(dragData); } return dragData; } return false; }, // override the default repairXY. getRepairXY : function(e){ return this.dragData.repairXY; }, /** Put the selections into the records and viewNodes Arrays. */ collectSelection: function(data) { data.repairXY = Ext.fly(this.getSelectedNodes()[0]).getXY(); if (this.preserveSelectionOrder === true) { Ext.each(this.getSelectedIndexes(), function(i) { var n = this.getNode(i); var dragNode = n.cloneNode(true); dragNode.id = Ext.id(); data.ddel.appendChild(dragNode); data.records.push(this.store.getAt(i)); data.viewNodes.push(n); }, this); } else { var i = 0; this.store.each(function(rec){ if (this.isSelected(i)) { var n = this.getNode(i); var dragNode = n.cloneNode(true); dragNode.id = Ext.id(); data.ddel.appendChild(dragNode); data.records.push(this.store.getAt(i)); data.viewNodes.push(n); } i++; }, this); } }, /** Specify to which ddGroup items in this DDView may be dragged. */ setDraggable: function(ddGroup) { if (ddGroup instanceof Array) { Ext.each(ddGroup, this.setDraggable, this); return; } if (this.dragZone) { this.dragZone.addToGroup(ddGroup); } else { this.dragZone = new Ext.dd.DragZone(this.getEl(), { containerScroll: true, ddGroup: ddGroup }); // Draggability implies selection. DragZone's mousedown selects the element. if (!this.multiSelect) { this.singleSelect = true; } // Wire the DragZone's handlers up to methods in *this* this.dragZone.getDragData = this.getDragData.createDelegate(this); this.dragZone.getRepairXY = this.getRepairXY; this.dragZone.onEndDrag = this.onEndDrag; } }, /** Specify from which ddGroup this DDView accepts drops. */ setDroppable: function(ddGroup) { if (ddGroup instanceof Array) { Ext.each(ddGroup, this.setDroppable, this); return; } if (this.dropZone) { this.dropZone.addToGroup(ddGroup); } else { this.dropZone = new Ext.dd.DropZone(this.getEl(), { owningView: this, containerScroll: true, ddGroup: ddGroup }); // Wire the DropZone's handlers up to methods in *this* this.dropZone.getTargetFromEvent = this.getTargetFromEvent.createDelegate(this); this.dropZone.onNodeEnter = this.onNodeEnter.createDelegate(this); this.dropZone.onNodeOver = this.onNodeOver.createDelegate(this); this.dropZone.onNodeOut = this.onNodeOut.createDelegate(this); this.dropZone.onNodeDrop = this.onNodeDrop.createDelegate(this); } }, /** Decide whether to drop above or below a View node. */ getDropPoint : function(e, n, dd){ if (n == this.el.dom) { return "above"; } var t = Ext.lib.Dom.getY(n), b = t + n.offsetHeight; var c = t + (b - t) / 2; var y = Ext.lib.Event.getPageY(e); if(y <= c) { return "above"; }else{ return "below";
?? 快捷鍵說明
復制代碼
Ctrl + C
搜索代碼
Ctrl + F
全屏模式
F11
切換主題
Ctrl + Shift + D
顯示快捷鍵
?
增大字號
Ctrl + =
減小字號
Ctrl + -