crop-monitor/manager/assets/modext/widgets/core/modx.tree.column.js

/* column tree extension */
Ext.ns('Ext.ux.tree');Ext.ux.tree.ColumnTree=Ext.extend(Ext.tree.TreePanel,{lines:false,borderWidth:Ext.isBorderBox?0:2,cls:'x-column-tree',onRender:function(){Ext.tree.ColumnTree.superclass.onRender.apply(this,arguments);this.headers=this.header.createChild({cls:'x-tree-headers'});var a=this.columns,c;var b=0;var d=19;for(var i=0,len=a.length;i<len;i++){c=a[i];b+=c.width;this.headers.createChild({cls:'x-tree-hd '+(c.cls?c.cls+'-hd':''),cn:{cls:'x-tree-hd-text',html:c.header},style:'width:'+(c.width-this.borderWidth)+'px;'})}this.headers.createChild({cls:'x-clear'});this.headers.setWidth(b+d);this.innerCt.setWidth(b)}});Ext.reg('columntree',Ext.ux.tree.ColumnTree);Ext.tree.ColumnTree=Ext.ux.tree.ColumnTree;Ext.ux.tree.ColumnNodeUI=Ext.extend(Ext.tree.TreeNodeUI,{focus:Ext.emptyFn,renderElements:function(n,a,b,d){this.indentMarkup=n.parentNode?n.parentNode.ui.getChildIndent():'';var t=n.getOwnerTree();var e=t.columns;var f=t.borderWidth;var c=e[0];var g=['<li class="x-tree-node"><div ext:tree-node-id="',n.id,'" class="x-tree-node-el x-tree-node-leaf ',a.cls,'">','<div class="x-tree-col" style="width:',c.width-f,'px;">','<span class="x-tree-node-indent">',this.indentMarkup,"</span>",'<img src="',this.emptyIcon,'" class="x-tree-ec-icon x-tree-elbow">','<img src="',a.icon||this.emptyIcon,'" class="x-tree-node-icon',(a.icon?" x-tree-node-inline-icon":""),(a.iconCls?" "+a.iconCls:""),'" unselectable="on">','<a hidefocus="on" class="x-tree-node-anchor" href="',a.href?a.href:"#",'" tabIndex="1" ',a.hrefTarget?' target="'+a.hrefTarget+'"':"",'>','<span unselectable="on">',n.text||(c.renderer?c.renderer(a[c.dataIndex],n,a):a[c.dataIndex]),"</span></a>","</div>"];for(var i=1,len=e.length;i<len;i++){c=e[i];g.push('<div class="x-tree-col ',(c.cls?c.cls:''),'" style="width:',c.width-f,'px;">','<div class="x-tree-col-text">',(c.renderer?c.renderer(a[c.dataIndex],n,a):a[c.dataIndex]),"</div>","</div>")}g.push('<div class="x-clear"></div></div>','<ul class="x-tree-node-ct" style="display:none;"></ul>',"</li>");if(d!==true&&n.nextSibling&&n.nextSibling.ui.getEl()){this.wrap=Ext.DomHelper.insertHtml("beforeBegin",n.nextSibling.ui.getEl(),g.join(""))}else{this.wrap=Ext.DomHelper.insertHtml("beforeEnd",b,g.join(""))}this.elNode=this.wrap.childNodes[0];this.ctNode=this.wrap.childNodes[1];var h=this.elNode.firstChild.childNodes;this.indentNode=h[0];this.ecNode=h[1];this.iconNode=h[2];this.anchor=h[3];this.textNode=h[3].firstChild}});Ext.tree.ColumnNodeUI=Ext.ux.tree.ColumnNodeUI;

/**
 * @class MODx.tree.ColumnTree
 * @extends Ext.tree.ColumnTree
 * @param {Object} config An object of configuration properties
 * @xtype tree-column
 */
MODx.tree.ColumnTree = function(config) {
    config = config || {};
    Ext.applyIf(config,{
        
        rootVisible: false
        ,autoScroll: true
        ,autoHeight: true
        ,root: {
             nodeType: 'async'
            ,text: config.rootText || ''
        }
        ,loader: new Ext.tree.TreeLoader({
            dataUrl: config.url
            ,baseParams: config.baseParams || {}
            ,uiProviders: {
                'col': Ext.tree.ColumnNodeUI
            }
            ,listeners: config.loaderListeners || {
               'beforeload': {fn:function(treeLoader, node) {
                    if (node.attributes.class_key) {
                        var bp = {};
                        Ext.apply(bp,this.config.baseParams);
                        Ext.apply(bp,node.attributes);
                        bp.loader = null; bp.uiProvider = null;
                        this.getLoader().baseParams = bp;
                    }
                },scope:this}
            }
        })
        ,tbar: this._getToolbar()
        ,menuConfig: { defaultAlign: 'tl-b?' ,enableScrolling: false }
    });
    MODx.tree.ColumnTree.superclass.constructor.call(this,config);
    this.on('contextmenu',this._showContextMenu,this);
    this.on('nodedragover',this._handleDrop,this);
    this.on('nodedrop',this._handleDrag,this);
    this.cm = new Ext.menu.Menu(config.menuConfig);
    this.config = config;
};
Ext.extend(MODx.tree.ColumnTree,Ext.tree.ColumnTree,{
    windows: {}
    
    /**
     * Shows the current context menu.
     * @param {Ext.tree.TreeNode} node The 
     * @param {Ext.EventObject} e The event object run.
     */
    ,_showContextMenu: function(node,e) {
        node.select();
        this.cm.activeNode = node;
        this.cm.record = node.attributes;
        /*this.cm.record.id = node.attributes.pk;*/
        this.cm.removeAll();
        if (node.attributes.menu && node.attributes.menu.items) {
            this._addContextMenuItem(node.attributes.menu.items);
            this.cm.show(node.ui.getEl(),'t?');
        }
    }
    /**
     * Add context menu items to the tree.
     * @param {Object, Array} items Either an Object config or array of Object configs.  
     */
    ,_addContextMenuItem: function(items) {
        var a = items, l = a.length;
        for(var i = 0; i < l; i++) {
            a[i].scope = this;
            this.cm.add(a[i]);
        }
    }
    
    
    /**
     * Handles all drag events into the tree.
     * @param {Object} dropEvent The node dropped on the parent node.
     */
    ,_handleDrag: function(dropEvent) {
        Ext.Msg.show({
            title: _('please_wait')
            ,msg: _('saving')
            ,width: 240
            ,progress:true
            ,closable:false
        });
        
        MODx.util.Progress.reset();
        for(var i = 1; i < 20; i++) {
            setTimeout('MODx.util.Progress.time('+i+','+MODx.util.Progress.id+')',i*1000);
        }
        
        /**
         * Simplify nodes into JSON format.
         * @param {Object} node
         */
        function simplifyNodes(node) {
            var resultNode = {};
            var kids = node.childNodes;
            var len = kids.length;
            for (var i = 0; i < len; i++) {
                resultNode[kids[i].id] = simplifyNodes(kids[i]);
            }
            return resultNode;
        }
        var encNodes = Ext.encode(simplifyNodes(dropEvent.tree.root));
        MODx.Ajax.request({
            url: this.config.url
            ,params: {
                data: encodeURIComponent(encNodes)
                ,action: this.config.sortAction || 'sort'
            }
            ,listeners: {
                'success': {fn:function(r) {
                    MODx.util.Progress.reset();
                    Ext.Msg.hide();
                    this.reloadNode(dropEvent.target);
                },scope:this}
                ,'failure': {fn:function(r) {
                    MODx.util.Progress.reset();
                    Ext.Msg.hide();
                    MODx.form.Handler.errorJSON(r);
                    return false;
                },scope:this}
            }
        });
    }
    
    ,reloadNode: function(n) {
        this.getLoader().load(n);
        n.expand();
    }
    
    /**
     * Abstract definition to handle drop events.
     */
    ,_handleDrop: function() { }
    
    ,loadWindow: function(btn,e,win) {
        var r = win.record || this.cm.record;
        if (!this.windows[win.xtype]) {  
            Ext.applyIf(win,{
                record: win.blankValues ? {} : r
                ,grid: this
                ,listeners: {
                    'success': {fn:win.success || this.refresh,scope:win.scope || this}
                }
            });
            this.windows[win.xtype] = Ext.ComponentMgr.create(win);
        }
        if (this.windows[win.xtype].setValues && win.blankValues !== true) {
            this.windows[win.xtype].setValues(r);
        }
        this.windows[win.xtype].show(e.target);
    }
    
    
    ,refresh: function(func,scope,args) {
        this.getLoader().baseParams = this.config.baseParams;
        this.getRootNode().reload();
        this.getRootNode().expand(null,null);
        if (func) {
            scope = scope || this;
            args = args || [];
            this.getRootNode().on('load',function() { Ext.callback(func,scope,args); },scope);
        }
        return true;
    }
    
    ,refreshActiveNode: function() {
        if (this.cm.activeNode) {
            this.getLoader().load(this.cm.activeNode);
            this.cm.activeNode.expand();
        } else { this.refresh(); }
    }
    ,refreshParentNode: function() { this.refreshNode(this.cm.activeNode.id); }
    ,refreshNode: function(id,self) {
        var node = this.getNodeById(id);
        if (node) {
            var n = self ? node : node.parentNode;
            var l = this.getLoader().load(n);
            n.expand();
        }
    }
    
    
    
    ,_getToolbar: function() {
        var iu = MODx.config.template_url+'images/restyle/icons/';
        return [{
            icon: iu+'refresh.png'
            ,cls: 'x-btn-icon'
            ,tooltip: {text: _('tree_refresh')}
            ,handler: this.refresh
            ,scope: this
        }];
    }
    
    /**
     * Render the row to a colored Yes/No value.
     * 
     * @access public
     * @param {Object} d The data record
     * @param {Object} c The dom properties
     * @return {String} The value to return
     */
    ,rendYesNo: function(d,c,a) {
        switch(d) {
            case '':
                return '-';
            case 0:
                c.css = 'red';
                return _('no');
            case 1:
                c.css = 'green';
                return _('yes');
        }
    }
});
Ext.reg('tree-column',MODx.tree.ColumnTree);