EditorGridPanel

EditorGridPanel.js

KebabOS.applications.producer.application.views.ProducersGridPanel = Ext.extend(Ext.grid.EditorGridPanel, {
    
    // Owner Application
    ownerApplication: null,
    
    initComponent : function() {
        
        // Base Config
        var config = {
            emptyText: 'Kayıt bulunmamaktadır...',
            loadMask: true,
            stripeRows: true,
            columnLines: true,
            viewConfig: {
                forceFit: true
            }
        }
        
        // Merge initialConfig and baseConfig
        Ext.apply(this, config);
        
        // Create and assign ProducersDataStore instance
        this.dataStore = new KebabOS.applications.producer.application.models.ProducersDataStore({
            ownerApplication: this.ownerApplication
        });
        
        // Grid Selectionmodel instance
        this.selectionModel = new Ext.grid.CheckboxSelectionModel({
            listeners: {
                selectionchange: function(sm) {
                    if (sm.getCount()) {
                        this.removeButton.enable();
                    } else {
                        this.removeButton.disable();
                    }
                },
                scope: this
            }
        });

        // Grid Column Model instance
        this.columnModel = new Ext.grid.ColumnModel({
            defaults: {
                sortable: true,
                width: 100
            },
            columns: this.buildColumns()
        });
        
        
        
        // Grid selection model & column model and store
        this.sm = this.selectionModel
        this.store = this.dataStore;
        this.cm = this.columnModel;
        
        // Build Toolbars and Buttons.
        this.tbar = this.buildTbar();
        this.bbar = this.buildBbar();
        
        // Call Superclass initComponent() method
        KebabOS.applications.producer.application.views.ProducersGridPanel.superclass.initComponent.call(this);
    },
    
    /**
     * build grid Columns
     */
    buildColumns: function() {
        return [
            this.selectionModel,
            new Ext.grid.RowNumberer({header:'Sıra', width:40}),
            {header: "Kimlik", width: 20, dataIndex: 'id'},
            {header: "Üretici Adı", dataIndex: 'title', editor: new Ext.form.TextField({})},
            {header: "Açıklamalar", dataIndex: 'description', editor: new Ext.form.TextArea({})},
        ];  
    },

    /**
     * build TopToolbar
     */
    buildTbar : function() {
        return [{
            xtype: 'buttongroup',
            title: 'İşlemler',
            defaults: {
                scale: 'medium',
                iconAlign: 'top',
                scale: 'small',
                width:50,                
                scope: this
            },
            items: [{
                text: 'Kaydet',
                tooltip: 'Değişiklikleri kaydedin',
                iconCls: 'icon-disk',
                ref: '../../saveButton',
                handler: this.onSave
            },{
                text: 'Ekle',
                tooltip: 'Yeni kayıt ekleyin',
                iconCls: 'icon-add',
                ref: '../../addButton',
                handler: this.onAdd
            }, {
                text: 'Çıkar',
                tooltip: 'Seçili kayıt(ları) kaldırın',
                iconCls: 'icon-delete',
                ref: '../../removeButton',
                handler: this.onRemove
            }]
        }, {
            xtype: 'buttongroup',
            title: 'Seçenekler',
            defaults: {
                iconAlign: 'top',
                scale: 'small',
                width:50,                
                scope: this,
                enableToggle: true
            },
            items: [{
                text: 'Oto. kayıt',
                iconCls: 'icon-database-lightning',
                pressed: false,
                tooltip: 'Yaptığınız her değişikliğin otomatik olarak veya siz ' 
                       + 'istediğinizde kaydedilmesini sağlar. '
                       + 'Yoğun trafik gerektiren işlerde kullanılmaması önerilir.',
                toggleHandler: function(btn, pressed) {
                    this.store.autoSave = pressed;                
                }
            }, {
                text: 'Toplu işle',
                iconCls: 'icon-database-table',
                pressed: true,
                tooltip: 'Bu seçenek yanlızca değişiklik olan kayıtları veya'
                       + 'hepsini bir seferde sunucuya göndermenizi sağlar.',
                toggleHandler: function(btn, pressed) {
                    this.store.batch = pressed;
                }
            }]
        }];
    },

    /**
     * build BottomToolbar
     */
    buildBbar : function() {
        return new Ext.PagingToolbar({
            pageSize: 10,
            store: this.store,
            displayInfo: true,
            plugins: new Ext.ux.SlidingPager()
        });
    },
    
    /**
     * onSave action
     */
    onSave : function(btn, ev) {
        this.store.save();
    },

    /**
     * onAdd action
     */
    onAdd : function(btn, ev) {
        
        var record = new this.store.recordType({
            title : '',
            description: ''
        });
        this.stopEditing();
        this.store.insert(0, record);
        this.startEditing(0, 1);
    },

    /**
     * onDelete
     */
    onRemove : function(btn, ev) {
                
        var sm = this.getSelectionModel();
        
        if (!sm.getCount()) {
            return false;
        } else {            
            sm.each(function(selection) {
                this.store.remove(selection);
            }, this);             
        }
        
    }
});