/**
 * Create a DragZone instance for our JsonView
 */
ImageDragZone = function(view, config){
    this.view = view;
//	debugger;
    ImageDragZone.superclass.constructor.call(this, view.getEl(), config);
};
Ext.extend(ImageDragZone, Ext.dd.DragZone, {
    // We don't want to register our image elements, so let's 
    // override the default registry lookup to fetch the image 
    // from the event instead
    getDragData : function(e){

        var target = e.getTarget('.thumb-wrap-1');
        if(target){
            var view = this.view;
		  
		  if(e.ctrlKey == false){
			  if(!view.isSelected(target)){
				 view.onClick(e);
			  }
		  }

		  var selIndexes = view.getSelectedIndexes();
		  var selected = false;
		  for(var i=0; i<selIndexes.length; i++){
			  if(selIndexes[i] == target.viewIndex){
				selected = true;  
			  }
		  }
		  
		  if(!selected){
			view.select(target.viewIndex);  
		  }
		  
            var selNodes = view.getSelectedNodes();
		  if(selNodes.length > 1){
			view.select(target.viewIndex);
			selNodes = view.getSelectedNodes();
		  }
		  
            var dragData = {
                nodes: selNodes
            };
		  
		 dragData.ddel = target.firstChild.firstChild; // the img element
		 dragData.single = true;
		  
/*            if(selNodes.length == 1){
                dragData.ddel = target.firstChild.firstChild; // the img element
                dragData.single = true;
            }else{
                var div = document.createElement('div'); // create the multi element drag "ghost"
                div.className = 'multi-proxy';
                for(var i = 0, len = selNodes.length; i < len; i++){
                    div.appendChild(selNodes[i].firstChild.firstChild.cloneNode(true));
                    if((i+1) % 3 == 0){
                        div.appendChild(document.createElement('br'));
                    }
                }
                dragData.ddel = div;
                dragData.multi = true;
            }*/
		  
            return dragData;
        }
        return false;
    },

    // this method is called by the TreeDropZone after a node drop
    // to get the new tree node (there are also other way, but this is easiest)
    getTreeNode : function(){
//		debugger;
        var treeNodes = [];
        var nodeData = this.view.getRecords(this.dragData.nodes);
        for(var i = 0, len = nodeData.length; i < len; i++){
            var data = nodeData[i].data;
		  	var tree = getActiveFileTree();
			var node = (tree.id=='editFilesTree' ? tree.getNodeById(data.mm_key) : tree.getNodeById(data.bm_id));
//			var node = tree.getNodeById(data.mm_key);
			treeNodes.push(node);

        }
        return treeNodes;
    },
 		

    // the default action is to "highlight" after a bad drop
    // but since an image can't be highlighted, let's frame it 
    afterRepair:function(){
        for(var i = 0, len = this.dragData.nodes.length; i < len; i++){
            Ext.fly(this.dragData.nodes[i]).frame('##8db2e3', 1);
        }
        this.dragging = false;    
    },
    
    // override the default repairXY with one offset for the margins and padding
    getRepairXY : function(e){
        if(!this.dragData.multi){
            var xy = Ext.Element.fly(this.dragData.ddel).getXY();
            xy[0]+=3;xy[1]+=3;
            return xy;
        }
        return false;
    }
});