Ext.onReady(function() { 
    Ext.QuickTips.init();
    var params = {     start: 0,    limit: 25    };
                
        var dsStates = getStates();  // See Definition: DataStore.js
        dsStates.load();
        
        var dsCounties = getCounties();
        var dsGroups = getGroups();
        //dsGroups.reload();        
        
        var dsEvents = getEvents();
        var dsSports = getSports();
        var dsYears = getYears();        
        var ds = getResults();
        var dsRegions = getRegions();
        var dsMeets = getMeets();
        dsMeets.baseParams = {Year: '2007',Sport: ''}; // will show the meets for 2007 only, on Page Load
        dsMeets.load({params:params});
        
        function eventRenderer(v) {
            return '<a href="javascript:void(0);" uuups="void(0);">' + v + '</a>';
        };
        
        var cm = new Ext.grid.ColumnModel([
            {  header: 'Place',  dataIndex: 'Position',  width: 45,  sortable: true }
            ,{  header: 'Name',  dataIndex: 'Name',  width: 125, sortable: true }
            ,{  header: 'Time',  dataIndex: 'Time',  width: 65,  sortable: true }
            ,{  header: 'Mark',  dataIndex: 'Mark',  width: 65,  sortable: true }
            ,{  header: 'School',  dataIndex: 'School',  width: 100,  sortable: true }
            ,{  header: 'Grade',  dataIndex: 'Age',  width: 50,  sortable: true }            
            ,{  header: 'Sex',  dataIndex: 'Sex',  width: 30,  sortable: true }
            ,{  header: 'Event',  dataIndex: 'Event',  width: 80,  sortable: true }
            ,{  header: 'Meet',  dataIndex: 'Meet',  width: 150,  sortable: true }
            ,{  header: 'Group',  dataIndex: 'Group',  width: 40,  sortable: true }
            ,{  header: 'Region',  dataIndex: 'Region',  width: 50,  sortable: true }
            ,{  header: 'State',  dataIndex: 'State',  width: 60,  sortable: true }
            ,{  header: 'Year',  dataIndex: 'Year',  width: 45,  sortable: true }
                        
//            ,{  header: 'County',  dataIndex: 'County',  width: 100,  sortable: true }
//            ,{  header: 'Sport',  dataIndex: 'Season',  width: 60,  sortable: true }
        ]);
        
        var sm = new Ext.grid.RowSelectionModel({singleSelect:false});
        
        var grid = new Ext.grid.Grid('grid', {
            ds: ds,
            cm: cm,
            selModel: sm,
            height: 600,
            width: 800,
            enableColLock: true,
            loadMask: true
        });
        
        grid.on('columnresize', function() {
            grid.view.refresh();
            grid.getView().refresh();
        });
        
        grid.on('headerclick', function(grid,nCol, e) {
            var ct = ds.getTotalCount();
            if (ct > 20000)
            {
                Ext.MessageBox.alert('Sorting Disabled', "Data Set to large!</br>Please narrow your search to < 20,000 results.");
                return false;
            }else return true;            
        });
        
        var rz = new Ext.Resizable('grid', {
            wrap:true,
            minHeight:100,
            pinned:true,
            handles: 's'
        });
        
        grid.render();
        
        var tbDiv = Ext.get('tb');
        var tb = new Ext.PagingToolbar(tbDiv, ds, {
            pageSize: 25,
            displayInfo: true,
            displayMsg: 'Displaying results {0} - {1} of {2}',
            emptyMsg: 'No results to display'
            
        });
        var pgszstore = new Ext.data.SimpleStore({
            fields: ['text', 'value'],
            data: [
                ['25', 25],
                ['50', 50],
                ['75', 75],
                ['100', 100]
            ]
        });
        var pgsz = new Ext.form.ComboBox({
            autoCreate: true,
            store: pgszstore,
            displayField: 'text',
            typeAhead: false,
            mode: 'local',
            triggerAction: 'all',
            editable: false,
            width: 80
        });
        tb.add('-', '<span>Page Size:</span>');
        tb.addField(pgsz);
        pgsz.setValue('25');
        pgsz.on('select', function(pgsz, r, i) {
            params.limit = r.get('value');
            tb.pageSize = params.limit;
            ds.lastOptions.params.limit = params.limit;
            ds.reload();
        });
        function hideGrid() {
            rz.el.setStyle('display', 'none');
            tb.el.setStyle('display', 'none');
            grid.container.setStyle('display', 'none');
        };
        function showGrid() {
            rz.el.setStyle('display', '');
            tb.el.setStyle('display', '');
            grid.container.setStyle('display', '');
        };
        hideGrid();        
        
        var name = new Ext.form.TextField({
            fieldLabel: 'Name',
            name: 'name',
            width: 160
        });
         var m_loc = new Ext.form.TextField({
            fieldLabel: 'Location',
            name: 'm_loc',
            disabled: true,
            value: 'All...',
            width: 175
        });
  
        var m_date = new Ext.form.TextField({
            fieldLabel: 'Date',
            name: 'm_date',
            disabled: true,
            value: 'All...',
            width: 175
        });
  
        
        // SEE DEFINITION OF getComboBox in DataStore.js
        var cmbxRegion = getComboBox('Region',dsRegions,'Name','RegionID','','remote','Loading...',175,'All...',false,false,true);
        var cmbxCounty = getComboBox('County',dsCounties,'County','CountyID','','remote','Loading...',175,'All...',true,false,true);
        
        var cmbxGroup = getComboBox('Group',dsGroups,'Group','GroupID','','remote','Loading...',175,'All...',false,false,true);
        var cmbxState = getComboBox('State',dsStates,'State','StateID','','remote','Loading...',175,'All...',false,false,true); 
         
        var dsSchools = getSchools({ countyID: cmbxCounty.getValue(), GroupID: cmbxGroup.getValue(), StateID: cmbxState.getValue(),RegionID: cmbxRegion.getValue()});
        var cmbxSchools = getComboBox('School',dsSchools,'Name','SchoolID','','remote','Loading...',175,'All...',true,false,true);        
        
        var resultTpl = new Ext.Template(
        '<div>','<font size="2"><br>{MeetName}<br>Location: {Location}','<br>Date: {Date}','</font></div>');      
        
        var cmbxMeet = new Ext.form.ComboBox({
        store: dsMeets,
        fieldLabel: 'Meet',
        displayField:'MeetName',        
        valueField: 'MeetID',
//        typeAhead: false,
        loadingText: 'Searching...',        
        mode: 'local',
        width: 175,
        pageSize:10,
        emptyText:'All...',
       // hideTrigger:true,
        resizable: true,
        tpl: resultTpl,
        onSelect: function(record,data){       
            cmbxMeet.setValue(record.data.MeetID);
            cmbxMeet.collapse();  
            m_loc.setValue(record.data.Location);
            m_date.setValue(record.data.Date);                 
        }
    }); 
    //    var cmbxMeet = getComboBox('Meet',dsMeets,'MeetName','MeetID','','local','Loading...',175,'All...',true,false,true);
        var cmbxSports= getComboBox('Sport',dsSports,'Sport','SportID','','remote','Loading...',175,'All...',false,false,true);
        var cmbxEvent = getComboBox('Event',dsEvents,'Event','EventID','','remote','Loading...',175,'All...',true,false,true);
        var dt = new Date;
        var yr = dt.getFullYear(); 
        var cmbxYear = getComboBox('Year',dsYears,'Year','Year','','remote','Loading...',175,'All...',false,false,true);                  
        
        var sexData = [
            ['',"All..."],
            ['M','Male'],
            ['W','Female']    
        ];
        var dssex = new Ext.data.Store({
            proxy: new Ext.data.MemoryProxy(sexData),
            reader: new Ext.data.ArrayReader({id: 0}, [
            {name: 'SEXID'},
            {name: 'Sex'}
            ])
        });
        dssex.load();
        
        var cmbxSex = getComboBox('Sex',dssex,'Sex','SEXID','','local','Loading...',175,'All...',false,false,true);
         
        cmbxSports.on("select", function(cmb, data, idx){
            reloadMeets();
        });          
        cmbxCounty.on("select", function(cmb, data, idx){
            reloadSchools();
        });          
        cmbxYear.on("select", function(cmb, data, idx){
            reloadMeets();
        });
        cmbxRegion.on("select", function(cmb, data, idx){
            reloadSchools();
        });
        
        cmbxState.on("select", function(cmb, data, idx){            
            reloadCounties();            
            reloadSchools();            
        });       
        
        cmbxGroup.on("select", function(cmb, data, idx){            
            reloadSchools();                      
        });
      /*   cmbxMeet.on("select", function(cmb, data, idx){            
         
            m_loc.setValue(data.get('Location'));
            m_date.setValue(data.get('Date'));
           
        });*/
          
        var reloadMeets = function()
        {       
            cmbxMeet.disable();
            cmbxMeet.reset();
            m_loc.reset();
            m_date.reset();
            dsMeets.baseParams = {
                Year: cmbxYear.getValue(),
                Sport: cmbxSports.getValue()
            };
            dsMeets.load({params:params});
            cmbxMeet.enable();
        };
        var reloadCounties = function()
        {
            cmbxCounty.disable();
            dsCounties.baseParams = {
                StateID: cmbxState.getValue()
            };
            dsCounties.load({params:params});
            cmbxCounty.reset();
            cmbxCounty.enable();
        };
        var reloadSchools = function()
        {
            cmbxSchools.disable();            
            dsSchools.baseParams = {countyID: cmbxCounty.getValue(),
                GroupID: cmbxGroup.getValue(),
                StateID: cmbxState.getValue(),
                RegionID: cmbxRegion.getValue()};
            dsSchools.load({params:params});  
            cmbxSchools.reset();
            cmbxSchools.enable();
        };
        
        var frm = new Ext.form.Form({
            labelAlign: 'right', labelWidth: 50
        });
        
        frm.column({ width: 260, style:'text-align: left;margin-left:10px', clear:true });
        frm.fieldset(
            {legend:'Student Information'},
            name,
            cmbxSex
        );        
        frm.fieldset(
            {legend:'School Information'},
            cmbxState,
            cmbxCounty,
            cmbxGroup,
            cmbxRegion,
            cmbxSchools
        );
        frm.end();
        frm.column({ width: 260, style:'text-align: left;margin-left:15px', clear:true });
        
        frm.fieldset(
            {legend:'Event Information'},
            cmbxYear,
            cmbxSports,
            cmbxMeet,
            m_loc,
            m_date,
            cmbxEvent            
        );
        frm.end();
        frm.column({ width: 100, style:'text-align: left;margin-left:12px', clear:true });
        frm.fieldset(
            {id:'rightfield', legend:'Help'}
        );
        frm.end();
        var minSearchCriteria = function()
        {
            var num = 0;
            if (name.getValue() != "") num++;
            if (cmbxSchools.getValue() != "" && cmbxSchools.getValue() != "All...") num++;
            if (cmbxSex.getValue() != "" && cmbxSex.getValue() != "All...") num++;
            if (cmbxRegion.getValue() != "" && cmbxRegion.getValue() != "All...") num++;
            if (cmbxState.getValue() != "" && cmbxState.getValue() != "All...") num++;
            if (cmbxCounty.getValue() != "" && cmbxCounty.getValue() != "All...") num++;
            if (cmbxGroup.getValue() != "" && cmbxGroup.getValue() != "All...") num++;
            if (cmbxYear.getValue() != "" && cmbxYear.getValue() != "All...") num++;
            if (cmbxMeet.getValue() != "" && cmbxMeet.getValue() != "All...") num++;
            if (cmbxEvent.getValue() != "" && cmbxEvent.getValue() != "All...") num++;
            if (cmbxSports.getValue() != "" && cmbxSports.getValue() != "All...") num++;
            if (num < 2)
            {
                Ext.MessageBox.alert('Minimum Search Criteria', "Please select a minimum of 2 search criterias.");
                return false;
            }
            return true;
        };
        
        var search = frm.addButton({
            text: 'Search!',
            minWidth: 75,
            handler: function() {          
                if (minSearchCriteria()){
                    showGrid();
                    ds.baseParams = {
                        name: name.getValue(),
                        eventName: cmbxEvent.getValue(),
                        SchoolName: cmbxSchools.getValue(),
                        Season: cmbxSports.getValue(),
                        county: cmbxCounty.getValue(),
                        sex : cmbxSex.getValue(),
                        meet: cmbxMeet.getValue(),
                        yearVal: cmbxYear.getValue(),
                        state: cmbxState.getValue(),
                        group: cmbxGroup.getValue(),
                        region: cmbxRegion.getValue()                        
                    };
                    ds.load({params:params});
                    report.enable();
                }
            }
        });
        //Code for crystal report
        var report = frm.addButton({
            id:'exportreport',
            name:'exportreport',
            text: 'Export',
            minWidth: 75,
            disabled : true,
            handler: function() {
                OpenScrollablePopUp("RptResults.aspx","Reports",1200,600);                
            }
        });
        //
        var btnClear = frm.addButton({
            text: 'Reset',
            minWidth: 75,
            handler: function() {
                grid.getDataSource().removeAll();
                hideGrid();
                name.reset();
                cmbxSex.reset();
                cmbxState.reset();
                cmbxEvent.reset();
                cmbxMeet.reset();
                cmbxSchools.reset();
                cmbxYear.reset();
                cmbxGroup.reset();
                cmbxSports.reset();
                cmbxCounty.reset();
                cmbxRegion.reset();
                cmbxState.reset();
                reloadSchools();
                reloadMeets();
                report.disable();
            }
        });
        
        frm.render('frm');
        
        var rCol = Ext.get('rightfield');
        var c = new Ext.Button(rCol,{
            text: "Guide",
            cls: "x-btn-text-icon",
            icon: "Resources/help.gif",
            handler: function(){
                OpenPopUp("Help.htm","RMHelp",600,500);
            }
        });
        var keyMap = new Ext.KeyMap('frm', {
            key: 13,
            fn: search.handler,
            scope: this
        });
        
        dsStates.on('load',function(){            
            reloadCounties();
            reloadSchools();        
        });       
    });