commit f1e5b9b81140641f9208a926286690e08635bfee
parent 689319776c979b2f2b74874a9d90a11ff8137f1f
Author: Felicitus <felicitus@felicitus.org>
Date: Fri, 24 Jul 2015 20:11:45 +0200
Implemented drag'n'drop of footprints onto categories
Diffstat:
3 files changed, 72 insertions(+), 27 deletions(-)
diff --git a/src/PartKeepr/FrontendBundle/Resources/public/js/Components/CategoryEditor/CategoryEditorTree.js b/src/PartKeepr/FrontendBundle/Resources/public/js/Components/CategoryEditor/CategoryEditorTree.js
@@ -26,11 +26,22 @@ Ext.define("PartKeepr.CategoryEditorTree", {
this.callParent();
this.getView().on("drop", Ext.bind(this.onCategoryDrop, this));
+ this.getView().on("beforedrop", Ext.bind(this.onBeforeDrop, this));
this.getView().on("itemcontextmenu", Ext.bind(this.onItemContextMenu, this));
this.createMenu();
},
+ onBeforeDrop: function (node, data, overModel, dropPosition, dropHandlers) {
+ var draggedRecord = data.records[0];
+ var droppedOn = this.getView().getRecord(node);
+
+ if (!(draggedRecord instanceof PartKeepr.data.HydraTreeModel)) {
+ // Workaround for EXTJS-13725 where dropping of non-tree-models cause issues
+ dropHandlers.cancelDrop();
+ this.fireEvent("foreignModelDrop", draggedRecord, droppedOn);
+ }
+ },
onCategoryDrop: function (node, data, overModel, dropPosition, eOpts)
{
var draggedRecord = data.records[0];
diff --git a/src/PartKeepr/FrontendBundle/Resources/public/js/Components/Footprint/FootprintNavigation.js b/src/PartKeepr/FrontendBundle/Resources/public/js/Components/Footprint/FootprintNavigation.js
@@ -10,29 +10,40 @@ Ext.define("PartKeepr.FootprintNavigation", {
items: [
{
xtype: 'partkeepr.FootprintTree',
- region: 'center',
+ region: 'center'
}, {
xtype: 'partkeepr.FootprintGrid',
resizable: true,
split: true,
region: 'south',
- height: "50%"
+ height: "50%",
+ viewConfig: {
+ plugins: {
+ ddGroup: 'FootprintCategoryTree',
+ ptype: 'gridviewdragdrop',
+ enableDrop: false
+ }
+ },
+ enableDragDrop: true
}
],
- initComponent: function () {
+ initComponent: function ()
+ {
this.callParent(arguments);
this.treeStore = Ext.create("Ext.data.TreeStore",
- {
+ {
remoteSort: false,
folderSort: true,
rootVisible: true,
autoLoad: true,
- sorters: [{
- property: 'name',
- direction: 'ASC'
- }],
+ sorters: [
+ {
+ property: 'name',
+ direction: 'ASC'
+ }
+ ],
root: {
"@id": PartKeepr.FootprintBundle.Entity.FootprintCategory.getProxy().getConfig("url") + "/1"
},
@@ -44,21 +55,22 @@ Ext.define("PartKeepr.FootprintNavigation", {
type: 'json'
}
- }});
+ }
+ });
this.down("partkeepr\\.FootprintTree").setStore(this.treeStore);
this.down("partkeepr\\.FootprintTree").on("itemclick", this.onCategoryClick, this);
this.down("partkeepr\\.FootprintGrid").setStore(this.store);
this.down("partkeepr\\.FootprintGrid").on("itemAdd", this.onAddFootprint, this);
this.down("partkeepr\\.FootprintGrid").on("itemDelete", function (id)
- {
- this.fireEvent("itemDelete", id);
- }, this
+ {
+ this.fireEvent("itemDelete", id);
+ }, this
);
this.down("partkeepr\\.FootprintGrid").on("itemEdit", function (id)
- {
- this.fireEvent("itemEdit", id);
- }, this
+ {
+ this.fireEvent("itemEdit", id);
+ }, this
);
},
@@ -68,7 +80,8 @@ Ext.define("PartKeepr.FootprintNavigation", {
* @param {Ext.tree.View} tree The tree view
* @param {Ext.data.Model} record the selected record
*/
- onCategoryClick: function (tree, record) {
+ onCategoryClick: function (tree, record)
+ {
var filter = Ext.create("Ext.util.Filter", {
property: 'category',
operator: 'IN',
@@ -83,8 +96,9 @@ Ext.define("PartKeepr.FootprintNavigation", {
* @param {Ext.data.Model} The node
* @return Array
*/
- getChildrenIds: function (node) {
- var childNodes = [ node.getId() ];
+ getChildrenIds: function (node)
+ {
+ var childNodes = [node.getId()];
if (node.hasChildNodes()) {
for (var i = 0; i < node.childNodes.length; i++) {
@@ -95,9 +109,10 @@ Ext.define("PartKeepr.FootprintNavigation", {
return childNodes;
},
/**
- * Called when a footprint is about to be added. This prepares the to-be-edited record with the proper category id.
- */
- onAddFootprint: function () {
+ * Called when a footprint is about to be added. This prepares the to-be-edited record with the proper category id.
+ */
+ onAddFootprint: function ()
+ {
var selection = this.down("partkeepr\\.FootprintTree").getSelection();
var category;
@@ -111,18 +126,20 @@ Ext.define("PartKeepr.FootprintNavigation", {
this.fireEvent("itemAdd", {
category: category
});
- },
+ },
/**
* Triggers a reload of the store when an edited record affects the store
*/
- syncChanges: function () {
+ syncChanges: function ()
+ {
this.down("partkeepr\\.FootprintGrid").getStore().load();
},
/**
* Returns the selection model of the footprint grid
* @return {Ext.selection.Model} The selection model
*/
- getSelectionModel: function () {
+ getSelectionModel: function ()
+ {
"use strict";
return this.down("partkeepr\\.FootprintGrid").getSelectionModel();
}
diff --git a/src/PartKeepr/FrontendBundle/Resources/public/js/Components/Footprint/FootprintTree.js b/src/PartKeepr/FrontendBundle/Resources/public/js/Components/Footprint/FootprintTree.js
@@ -2,7 +2,13 @@ Ext.define("PartKeepr.FootprintTree", {
extend: 'PartKeepr.CategoryEditorTree',
alias: 'widget.FootprintTree',
xtype: 'partkeepr.FootprintTree',
- ddGroup: 'FootprintTree',
+ viewConfig: {
+ plugins: {
+ ptype: 'treeviewdragdrop',
+ sortOnDrop: true,
+ ddGroup: 'FootprintCategoryTree'
+ }
+ },
folderSort: true,
categoryModel: "PartKeepr.FootprintBundle.Entity.FootprintCategory",
@@ -11,9 +17,20 @@ Ext.define("PartKeepr.FootprintTree", {
* @cfg {String} text The path to the 'add' icon
*/
addButtonIcon: 'bundles/partkeeprfrontend/images/icons/footprint_add.png',
-
+
/**
* @cfg {String} text The path to the 'delete' icon
*/
- deleteButtonIcon: 'bundles/partkeeprfrontend/images/icons/footprint_delete.png'
+ deleteButtonIcon: 'bundles/partkeeprfrontend/images/icons/footprint_delete.png',
+
+ listeners: {
+ "foreignModelDrop": function (record, target) {
+ record.setCategory(target);
+ record.save();
+
+ if (record.store && record.store.reload) {
+ record.store.reload();
+ }
+ }
+ }
});
\ No newline at end of file