Ext.onReady(function(){

    /*
     * div do ktorego renderujemy
     */
    var c = Ext.get('search12');
    
    
    /*
     * datastore uczestnikow
     */
    var ds = new Ext.data.JsonStore({
        totalProperty: "total",
        root: "results",
        remoteSort: true,
        id: "id-store",
        url: '/iframe/persons',
        fields: [{
            name: 'id',
            type: 'int'
        }, {
            name: 'person_type',
            type: 'string'
        }, {
            name: 'first_name',
            type: 'string'
        }, {
            name: 'last_name',
            type: 'string'
        }, {
            name: 'institution_name',
            type: 'string'
        }, {
            name: 'representation_id',
            type: 'int'
        }, {
            name: 'address_city',
            type: 'string'
        }, {
            name: 'country_name',
            type: 'string'
        }, {
            name: 'type',
            type: 'string'
        }, {
            name: 'data_sport',
            type: 'int'
        }, {
            name: 'data_theatre',
            type: 'int'
        }, {
            name: 'data_church',
            type: 'int'
        }, {
            name: 'data_mmo',
            type: 'int'
        }, {
            name: 'data_katyn',
            type: 'int'
        }],
        listeners: {
            beforeload: function(){
                var onload = Ext.getCmp('view-all-stats-grid');
                if (onload) 
                    onload.getEl().mask('Ładowanie danych, proszę czekać...', 'x-mask-loading');
            },
            load: function(){
                var onload = Ext.getCmp('view-all-stats-grid');
                if (onload) 
                    onload.getEl().unmask();
            },
            loadexception: function(){
                var onload = Ext.getCmp('view-all-stats-grid');
                if (onload) 
                    onload.getEl().unmask();
            }
        }
    });
    
    
    
    var recordForm = new Ext.ux.grid.RecordForm({
        title: 'Szczególy osoby',
        iconCls: 'icon-edit-record',
        columnCount: 1,
        ignoreFields: {
            id: true
        },
        readonlyFields: {},
        disabledFields: {
            uid: true
        },
        formConfig: {
            labelWidth: 90,
            buttonAlign: 'right',
            bodyStyle: 'padding-top:10px'
        }
    });
    
    
    ButtonColumn = function(config){
        config.sortable = false;
        
        this.addEvents({
            'click': true
        });
        
        ButtonColumn.superclass.constructor.call(this);
        
        Ext.apply(this, config, {
        
            init: function(grid){
                this.grid = grid;
                this.grid.on('render', function(){
                    var view = this.grid.getView();
                    view.mainBody.on('mousedown', this.onMouseDown, this);
                }, this);
            },
            
            onMouseDown: function(e, t){
                if (t.className && t.className.indexOf('x-grid3-cc-' + this.id) != -1) {
                    e.stopEvent();
                    var index = this.grid.getView().findRowIndex(t);
                    var record = this.grid.store.getAt(index);
                    this.fireEvent('click', this, e, record, index);
                }
            },
            
            renderer: function(v, p, record){
                var result = '<div class="x-grid3-cc-' + this.id +
                ' grid-button-column ' +
                this.buttonClass +
                " " +
                ((record.data.data_sport == 0 && this.buttonClass == 'result_s') ? " result_s_deactive" : "") +
                ((record.data.data_theatre == 0 && this.buttonClass == 'result_t') ? " result_t_deactive" : "") +
                ((record.data.data_church == 0 && this.buttonClass == 'result_c') ? " result_c_deactive" : "") +
                ((record.data.data_mmo == 0 && this.buttonClass == 'result_mmo') ? " result_mmo_deactive" : "") +
                ((record.data.data_katyn == 0 && this.buttonClass == 'result_katyn') ? " result_katyn_deactive" : "") +
                '" ' +
                'title="' +
                this.tooltip +
                '"' +
                '>' +
                '&#160;</div>';
                return result;
            }
        });
        
        if (!this.id) 
            this.id = Ext.id();
        if (typeof(this.tooltip) == 'undefined') 
            this.tooltip = '';
        if (typeof(this.buttonType) == 'undefined') 
            this.buttonType = 'bogus';
        
        this.buttonClass = this.buttonType;
        this.renderer = this.renderer.createDelegate(this);
    };
    
    
    
    Ext.extend(ButtonColumn, Ext.util.Observable)
    
    
    
    
    // kolumna edycja
    var editButtonColumn = new ButtonColumn({
        header: 'Kontakt',
        dataIndex: 'id',
        tooltip: 'Zostaw swoje dane - pozostań z nami w kontakcie cały rok!',
        width: 50,
        buttonType: 'vcard',
        sortable: false
    });
    editButtonColumn.on('click', function(element, e, record, index){
        Parafiada.Person.CreateWindow(record.data['id'], element.grid.id);
    });
    
    
    // kolumna dane
    var dataButtonColumn = new ButtonColumn({
        header: 'Dane',
        dataIndex: 'id',
        tooltip: 'Szczegółowe dane o uczestniku',
        width: 30,
        buttonType: 'grid',
        sortable: false
    });
    dataButtonColumn.on('click', function(element, e, record, index){
        Parafiada.Competition.CreateWindow(record.data, element.grid.id);
    });
    
    // kolumna wyniki STADION
    var competitionStadionButtonColumn = new ButtonColumn({
        header: 'Stadion',
        dataIndex: 'id',
        tooltip: 'Wyniki filaru STADION',
        width: 40,
        buttonType: 'result_s',
        sortable: false
    });
    competitionStadionButtonColumn.on('click', function(element, e, record, index){
        Parafiada.Results.CreateWindow(record.data, element.grid.id, 'STADION');
    });
    
    // kolumna wyniki TEATR
    var competitionTheatreButtonColumn = new ButtonColumn({
        header: 'Teatr',
        dataIndex: 'id',
        tooltip: 'Wyniki filaru TEATR',
        width: 30,
        buttonType: 'result_t',
        sortable: false
    });
    competitionTheatreButtonColumn.on('click', function(element, e, record, index){
        Parafiada.Results.CreateWindow(record.data, element.grid.id, 'TEATR');
    });
    
    // kolumna wyniki KOŚCIÓŁ
    var competitionChurchButtonColumn = new ButtonColumn({
        header: 'Świątynia',
        dataIndex: 'id',
        tooltip: 'Wyniki filaru ŚWIĄTYNIA',
        width: 50,
        buttonType: 'result_c',
        sortable: false
    });
    competitionChurchButtonColumn.on('click', function(element, e, record, index){
        Parafiada.Results.CreateWindow(record.data, element.grid.id, 'ŚWIĄTYNIA');
    });
    
    // kolumna wyniki MMO
    var competitionMmoButtonColumn = new ButtonColumn({
        header: 'Wyniki',
        dataIndex: 'id',
        tooltip: 'Wyniki konkursu Moja Mała Ojczyzna',
        width: 50,
        buttonType: 'result_mmo',
        sortable: false
    });
    competitionMmoButtonColumn.on('click', function(element, e, record, index){
        Parafiada.Results.CreateWindow(record.data, element.grid.id, 'MMO');
    });
    
    // kolumna wyniki KATYŃ
    var competitionKatynButtonColumn = new ButtonColumn({
        header: 'Wyniki',
        dataIndex: 'id',
        tooltip: 'Wyniki konkursu Katyń',
        width: 50,
        buttonType: 'result_katyn',
        sortable: false
    });
    competitionKatynButtonColumn.on('click', function(element, e, record, index){
        Parafiada.Results.CreateWindow(record.data, element.grid.id, 'KATYŃ');
    });
    
    
    
    
    
    
    
    var colModel = new Ext.grid.ColumnModel([new Ext.grid.RowNumberer(), {
        header: 'Nazwisko',
        id: 'last_name',
        dataIndex: 'last_name',
        width: 80,
        sortable: true
    
    }, {
        header: 'Imię',
        id: 'first_name',
        dataIndex: 'first_name',
        width: 70,
        sortable: true
    }, {
        id: 'address_city',
        header: 'Miejscowość',
        dataIndex: 'address_city',
        width: 80,
        sortable: true
    }, {
        id: 'country_name',
        header: 'Kraj',
        dataIndex: 'country_name',
        width: 50,
        sortable: true
    }, editButtonColumn, dataButtonColumn, competitionStadionButtonColumn, competitionTheatreButtonColumn, competitionChurchButtonColumn, competitionMmoButtonColumn, competitionKatynButtonColumn]);
    
    var grid = new Ext.parafiada.ExtendedGrid({
        id: 'view-all-stats-grid',
        width: 600,
        height: 400,
        store: ds,
        search: true,
        paging: true,
        enableHdMenu: false,
        pageSize: 30,
        stripeRows: true,
        params: {
            limit: 30
        },
        sm: new Ext.grid.RowSelectionModel(),
        plugins: [editButtonColumn, dataButtonColumn, competitionStadionButtonColumn, competitionTheatreButtonColumn, competitionChurchButtonColumn, competitionMmoButtonColumn, competitionKatynButtonColumn, recordForm],
        cm: colModel,
        viewConfig: {
            forceFit: true
        }
    });
    
    var panelParafiada = new Ext.Panel({
        title: 'Parafiada 2010',
        items: [grid],
        layout: 'fit',
        width: 600,
        height: 400
    });
    panelParafiada.on('activate', function(){
        // przesuwamy grida do aktywnego panela
        var grid1 = Ext.getCmp('view-all-stats-grid');
        grid1.getColumnModel().setHidden(7, false); // stadion
        grid1.getColumnModel().setHidden(8, true); // teatr
        grid1.getColumnModel().setHidden(9, true); // swiatynia
        grid1.getColumnModel().setHidden(10, true);
        grid1.getColumnModel().setHidden(11, true);
        var owner = grid1.ownerCt;
        owner.remove(grid1, false);
        this.add(grid1);
        this.doLayout();
        
        // zmieniamy parametry stora
        ds.baseParams = {
            program: 'Parafiada'
        };
        ds.reload({
            params: {
                start: 0,
                limit: 30
            }
        });
    });
    
    
    
    var panelMmo = new Ext.Panel({
        title: 'Moja Mała Ojczyzna',
        layout: 'fit',
        width: 600,
        height: 400
    });
    panelMmo.on('activate', function(){
        // przesuwamy grida do aktywnego panela
        var grid1 = Ext.getCmp('view-all-stats-grid');
        grid1.getColumnModel().setHidden(7, true);
        grid1.getColumnModel().setHidden(8, true);
        grid1.getColumnModel().setHidden(9, true);
        grid1.getColumnModel().setHidden(10, false);
        grid1.getColumnModel().setHidden(11, true);
        var owner = grid1.ownerCt;
        owner.remove(grid1, false);
        this.add(grid1);
        this.doLayout();
        
        // zmieniamy parametry stora
        ds.baseParams = {
            program: 'Moja Mała Ojczyzna'
        };
        ds.reload({
            params: {
                start: 0,
                limit: 30
            }
        });
    });
    
    
    
    var panelKatyn = new Ext.Panel({
        title: 'Katyń',
        layout: 'fit',
        width: 600,
        height: 400
    });
    panelKatyn.on('activate', function(){
        // przesuwamy grida do aktywnego panela
        var grid1 = Ext.getCmp('view-all-stats-grid');
        grid1.getColumnModel().setHidden(7, true);
        grid1.getColumnModel().setHidden(8, true);
        grid1.getColumnModel().setHidden(9, true);
        grid1.getColumnModel().setHidden(10, true);
        grid1.getColumnModel().setHidden(11, false);
        var owner = grid1.ownerCt;
        owner.remove(grid1, false);
        this.add(grid1);
        this.doLayout();
        
        // zmieniamy parametry stora
        ds.baseParams = {
            program: 'Katyń'
        };
        ds.reload({
            params: {
                start: 0,
                limit: 30
            }
        });
    });
    
    
    
    // -- PATRONI -------------------------------------------	
    
    var dsPatrons = new Ext.data.JsonStore({
        totalProperty: "total",
        root: "results",
        remoteSort: true,
        id: "id-patron-store",
        url: '/iframe/patrons',
        fields: [{
            name: 'id',
            type: 'int'
        }, {
            name: 'name',
            type: 'string'
        }, {
            name: 'category',
            type: 'string'
        }]
    });
    
    var patroniColModel = new Ext.grid.ColumnModel([new Ext.grid.RowNumberer(), {
        header: 'Kategoria',
        id: 'category',
        dataIndex: 'category',
        width: 80,
        sortable: true
    }, {
        header: 'Nazwa',
        id: 'name',
        dataIndex: 'name',
        width: 200,
        sortable: true
    }]);
    
    var patroniGrid1 = new Ext.parafiada.ExtendedGrid({
        id: 'patroni-grid1',
        title: 'Patroni i Sponsorzy Programowi',
        width: 600,
        height: 350,
        store: dsPatrons,
        search: true,
        paging: true,
        enableHdMenu: false,
        pageSize: 30,
        stripeRows: true,
        params: {
            limit: 30
        },
        sm: new Ext.grid.RowSelectionModel(),
        cm: patroniColModel,
        viewConfig: {
            forceFit: true
        }
    });
    patroniGrid1.on('activate', function(){
        dsPatrons.baseParams = {
            patron_type: this.title
        };
        dsPatrons.reload({
            params: {
                start: 0,
                limit: 30
            }
        });
    });
    
    var patroniGrid2 = new Ext.parafiada.ExtendedGrid({
        id: 'patroni-grid2',
        title: 'XXI Finały',
        width: 600,
        height: 350,
        store: dsPatrons,
        search: true,
        paging: true,
        enableHdMenu: false,
        pageSize: 30,
        stripeRows: true,
        params: {
            limit: 30
        },
        sm: new Ext.grid.RowSelectionModel(),
        cm: patroniColModel,
        viewConfig: {
            forceFit: true
        }
    });
    patroniGrid2.on('activate', function(){
        dsPatrons.baseParams = {
            patron_type: this.title
        };
        dsPatrons.reload({
            params: {
                start: 0,
                limit: 30
            }
        });
    });
    
    var patroniGrid3 = new Ext.parafiada.ExtendedGrid({
        id: 'patroni-grid3',
        title: 'Katyń - ocalić od zapomnienia',
        width: 600,
        height: 350,
        store: dsPatrons,
        search: true,
        paging: true,
        enableHdMenu: false,
        pageSize: 30,
        stripeRows: true,
        params: {
            limit: 30
        },
        sm: new Ext.grid.RowSelectionModel(),
        cm: patroniColModel,
        viewConfig: {
            forceFit: true
        }
    });
    patroniGrid3.on('activate', function(){
        dsPatrons.baseParams = {
            patron_type: this.title
        };
        dsPatrons.reload({
            params: {
                start: 0,
                limit: 30
            }
        });
    });
    
    var patroniGrid4 = new Ext.parafiada.ExtendedGrid({
        id: 'patroni-grid4',
        title: 'MMO',
        width: 600,
        height: 350,
        store: dsPatrons,
        search: true,
        paging: true,
        enableHdMenu: false,
        pageSize: 30,
        stripeRows: true,
        params: {
            limit: 30
        },
        sm: new Ext.grid.RowSelectionModel(),
        cm: patroniColModel,
        viewConfig: {
            forceFit: true
        }
    });
    patroniGrid4.on('activate', function(){
        dsPatrons.baseParams = {
            patron_type: this.title
        };
        dsPatrons.reload({
            params: {
                start: 0,
                limit: 30
            }
        });
    });
    
    
    var tabsPatroni = new Ext.TabPanel({
        id: 'tabs-patroni',
        title: 'Patroni',
        activeTab: 0,
        items: [patroniGrid1, patroniGrid2, patroniGrid3, patroniGrid4]
    });
    
    
    
    
    
    
    
    /*
     * Glowny komponent na stronie
     */
    var tabPanel1 = new Ext.TabPanel({
        id: 'view-all-stats-tab-panel',
        activeTab: 0,
        renderTo: c,
        //items: [panelParafiada, panelMmo, panelKatyn, tabsPatroni]
	items: [panelParafiada]
    });
    
    
    
});