Show cool things you have done with our products


Post by wispoz »

Hello i want to share some plugin:
Ext.define('W.plugin.ResourceViewPlugin', {
    extend: 'Ext.plugin.Abstract',
    alias: 'plugin.gantt_resource_view_plugin',
    tpl: '<label style="position:absolute;z-index: 100;left:{position}px;"><img title="{Name}" style=" width: 20px;margin-top: -3px; border-radius: 15px;" src="{Photo}"/></label>',
    config: {
        imageField: 'photo_125x125', // photo field in Gnt.model.Resource
        nameField: 'Name',  // name for tooltip field in Gnt.model.Resource
        dateField:'EndDate', // date field (StartDate, EndDate, or some) for tooltip field in Gnt.model.Resource
        margin: 15
    },
    constructor: function(config) {
        this.initConfig(config);
    },
    init: function (cmp) {
        this.setCmp(cmp);
        if (!(this.tpl instanceof Ext.XTemplate)) {
            this.tpl = new Ext.XTemplate(this.tpl);
        }
    },
    resourceRenderer: function(val, meta, task) {
        var me = this,
            endDateField = me.getDateField(),
            endDate = task.get(endDateField),
            nameField =  me.getNameField(),
            imageField =   me.getImageField(),
            cmp = me.getCmp(),
            position =  cmp.getSchedulingView().getCoordinateFromDate(endDate),
            resources = task.getResources();
        return Ext.Array.map(resources,function(resource){
            position += me.getMargin();
            return me.tpl.apply({
                Name: resource.get(nameField),
                Photo: resource.get(imageField),
                position: position
            });
        }).join('');
    },
    disable: function() {
        var me = this,
            cmp = me.getCmp();
        /*
        unregister resourceRenderer from queue
        */
        Ext.each(cmp.renderers, function(rend, i) {
            if(rend.fn.$name === 'resourceRenderer') {
                Ext.Array.removeAt(cmp.renderers, i);
                return false;
            }
        });
        cmp.refreshViews();
    },
    enable: function() {
        var me = this,
            cmp = me.getCmp();
        /*
        register resourceRenderer from queue
        TODO: check if already render registered.
        */
        cmp.registerRenderer(me.resourceRenderer, me);
        cmp.refreshViews();
    }
});
usage :
Ext.onReady(function(){

    var ganttPanel = Ext.create('Gnt.panel.Gantt', {
        plugins: [
            {
                ptype: 'gantt_resource_view_plugin',
                id:'gantt_resource_view_plugin''
            }
        ],
        tbar: [
            {
                xtype:'button',
                text:'enable',
                handler: function(btn) {
                    plugin = ganttPanel.findPlugin('gantt_resource_view_plugin').enable();
                }
            },

            {
                xtype:'button',
                text:'disable',
                handler: function(btn) {
                    plugin = ganttPanel.findPlugin('gantt_resource_view_plugin').disable();
                }
            }
        ],
        height     : 300,

        width      : 800,
        renderTo   : document.body,
        crudManager : {
            autoLoad        : true,
            transport       : {
                load : {
                    method      : 'GET',
                    url         : 'data.json'
                },
                sync : {
                    method      : 'POST',
                    url         : 'TODO'
                }
            }
        },
        columns    : [
            {
                xtype       : 'namecolumn'
            }
        ]
    });
});
Attachments
photo.png
photo.png (7.35 KiB) Viewed 3418 times

Post by Terence »

Nice! Only it is missing some image data and perhaps css styling now. Would be great to see it running!

Post by wispoz »

Terence wrote:Nice! Only it is missing some image data and perhaps css styling now. Would be great to see it running!
here, but license expired (
https://fiddle.sencha.com/#view/editor&fiddle/2go8

Post Reply