Ext.onReady(function(){

    var back = new Ext.Button({
        text:'Zurück',
        handler:function(){location.href='index.html';}
    });
    
    back.render('button');  

    function changeURL (Adresse,Zielframe)
     {
       Fenster1 = window.open(Adresse, Zielframe);
       Fenster1.focus();
     }
    
    var help = new Ext.Button({
    text:'Hilfe',
    handler:function(){changeURL('Datenbank_hochschule dual_Funktionsweise_Schueler.pdf','_blank');}
    }
    );
    
    help.render('help');
    
    /**
     * 
     */
    function reloadSelectValues(){
        var studiengang = Ext.getCmp('studiengang').getValue();
        var ausbildung = Ext.getCmp('ausbildung').getValue();
        var city = Ext.getCmp('city').getValue();
        var model = Ext.getCmp('model').getValue();
        var institution = Ext.getCmp('institution').getValue();
        
        //kein studiengang ausgewählt
        if (studiengang == ""){
            var combo = Ext.getCmp('studiengang');
            combo.reset();         
            dsCat_studiengang.proxy = new Ext.data.HttpProxy({
                url: 'search_detail.mysql.php?id=studiengang&model='+model+'&ort='+city+'&ausbildung='+ausbildung+'&institution='+institution
            });
            dsCat_studiengang.load();
        }
        
        //kein ausbildung ausgewählt
        if (ausbildung == ""){
            var combo = Ext.getCmp('ausbildung');
            combo.reset();         
            dsCat_ausbildung.proxy = new Ext.data.HttpProxy({
                url: 'search_detail.mysql.php?id=ausbildung&model='+model+'&ort='+city+'&studiengang='+studiengang+'&institution='+institution
            });
            dsCat_ausbildung.load();
        }
        
        //kein ort ausgewählt
        if (city == ""){
            var combo = Ext.getCmp('city');
            combo.reset();         
            dsCat_ort.proxy = new Ext.data.HttpProxy({
                url: 'search_detail.mysql.php?id=ort&model='+model+'&ausbildung='+ausbildung+'&studiengang='+studiengang+'&institution='+institution
            });
            dsCat_ort.load();
        }
        
        //kein model ausgewählt
        if (model == ""){
            var combo = Ext.getCmp('model');
            combo.reset();         
            dsCat_model.proxy = new Ext.data.HttpProxy({
                url: 'search_detail.mysql.php?id=model&ort='+city+'&ausbildung='+ausbildung+'&studiengang='+studiengang+'&institution='+institution
            });
            dsCat_model.load();
        }
        
        //kein institution ausgewählt
        if (institution == ""){
            var combo = Ext.getCmp('institution');
            combo.reset();         
            dsCat_institution.proxy = new Ext.data.HttpProxy({
                url: 'search_detail.mysql.php?id=institution&ort='+city+'&ausbildung='+ausbildung+'&studiengang='+studiengang+'&model='+model
            });
            dsCat_institution.load();
        }
    }
      
   // simple array store
    var dsCat_studiengang = new Ext.data.Store({
        proxy: new Ext.data.HttpProxy({url: 'search_detail.mysql.php?id=studiengang'}),
        method: 'POST',
        reader: new Ext.data.JsonReader({
            },[
                {name: 'course_name', mapping: 'course_name'}
            ])
        
    });
    
    var dsCat_ausbildung = new Ext.data.Store({
        proxy: new Ext.data.HttpProxy({url: 'search_detail.mysql.php?id=ausbildung'}),
        method: 'POST',
        reader: new Ext.data.JsonReader({
            },[
                {name: 'description', mapping: 'description'},
                {name: 'lookup_code', mapping: 'lookup_code'}
            ])
        
    });
    
    var dsCat_ort = new Ext.data.Store({
        proxy: new Ext.data.HttpProxy({url: 'search_detail.mysql.php?id=ort'}),
        method: 'POST',
        reader: new Ext.data.JsonReader({
            },[
                {name: 'city', mapping: 'city'}
            ])
        
    });
    
    var dsCat_model = new Ext.data.Store({
        proxy: new Ext.data.HttpProxy({url: 'search_detail.mysql.php?id=model'}),
        method: 'POST',
        reader: new Ext.data.JsonReader({
            },[
                {name: 'model', mapping: 'model'}
            ])
        
    });
    
    var dsCat_institution = new Ext.data.Store({
        proxy: new Ext.data.HttpProxy({url: 'search_detail.mysql.php?id=institution'}),
        method: 'POST',
        reader: new Ext.data.JsonReader({
            },[
                {name: 'institution', mapping: 'institution'},
                {name: 'user_id'}
            ])
        
    });
    
    var combo_sg = new Ext.form.ComboBox({  
        store: dsCat_studiengang ,
        width: 400,
        fieldLabel: 'Studiengang',
        name: 'studiengang',
        id: 'studiengang',
        displayField:'course_name',
        typeAhead: true,
        mode: 'local',
        triggerAction: 'all',
        emptyText:'alle...',
        selectOnFocus:true,
        listeners:{select:{fn:function(combo, value) {
                reloadSelectValues();
            }}
        }
    }); 
    
    var combo_ausbildung = new Ext.form.ComboBox({ 
        id: 'ausbildung',  
        width: 400,
        store: dsCat_ausbildung,
        fieldLabel: 'Beruf',
        name: 'ausbildung',
        id: 'ausbildung',
        displayField:'lookup_code',
        valueField:'lookup_code',
        typeAhead: true,
        mode: 'local',
        triggerAction: 'all',
        emptyText:'alle...',
        selectOnFocus:true,
        listeners:{select:{fn:function(combo, value) {
                reloadSelectValues();
            }}
        }
    });  
    
    
    var combo_ort = new Ext.form.ComboBox({  
        store: dsCat_ort,
        width: 400,
        fieldLabel: 'Hochschule/Ort',
        name: 'city',
        id: 'city',
        displayField:'city',
        typeAhead: true,
        mode: 'local',
        triggerAction: 'all',
        emptyText:'alle...',
        selectOnFocus:true,
        listeners:{select:{fn:function(combo, value) {
                reloadSelectValues();
            }}
        }
    });  
    
    var combo_model = new Ext.form.ComboBox({ 
        store: dsCat_model,
        width: 400,
        fieldLabel: 'Duales Studienmodell',
        name: 'model',
        id: 'model',
        displayField:'model',
        typeAhead: true,
        mode: 'local',
        triggerAction: 'all',
        emptyText:'alle...',
        selectOnFocus:true,
        listeners:{select:{fn:function(combo, value) {
                reloadSelectValues();
            }}
        }
    });   
    
    var combo_institution = new Ext.form.ComboBox({  
        store: dsCat_institution,
        width: 400,
        fieldLabel: 'Beteiligte Unternehmen',
        name: 'institution',
        id: 'institution',
        valueField:'user_id',
        displayField:'institution',
        typeAhead: true,
        mode: 'local',
        triggerAction: 'all',
        emptyText:'alle...',
        selectOnFocus:true,
        listeners:{select:{fn:function(combo, value) {
                reloadSelectValues();
            }}
        }
    });  

//+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++   
// Vertiefte Auswahl wenn bei Dualem Studienmodell Studium mit vertiefter Praxis angegeben wurde    
    combo_model.on('select',MyGSTSelection);  
    
    function MyGSTSelection(combo, record, index)
        {
            if(combo_model.getValue() == "Verbundstudium"){  

            Ext.getCmp('ausbildung').getEl().up('div.x-form-item').show();    
            simple.render('test');
            }
            else {
            Ext.getCmp('ausbildung').getEl().up('div.x-form-item').hide();
            combo_ausbildung.setValue(); 
            simple.render('test'); 
            }
    }  
 
//+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++  
    
    dsCat_studiengang.load();  
    dsCat_ausbildung.load();
    dsCat_ort.load();
    dsCat_model.load(); 
    dsCat_institution.load();
    
    /* nachricht wegen der suche */
    var resetSearchNotice = new Ext.Panel({
        width: 550,
        html: "<p style=\"text-align:center; padding-bottom:10px;\">Bitte beachten Sie bei der Auswahl Ihrer Suchkriterien die Reihenfolge, da nicht verfügbare "
            + "Kombinationen sukzessive ausgeblendet werden.<br />"
            + "Falls Sie die Suchparameter zurücksetzen möchten, klicken Sie bitte auf <b>Neu</b>.</p>"
    });
    
    
    var simple = new Ext.FormPanel({
        labelWidth: 140, // label settings here cascade unless overridden
        frame:true,
        title: 'Detaillierte Gesamtsuche',
        bodyStyle:'padding:5px 5px 0',
        width: 600,
        defaultType: 'textfield',

        items: [ resetSearchNotice,combo_sg,combo_model,combo_ausbildung, combo_ort, combo_institution
        ] 

    });
    

    var submit = simple.addButton({
        text: 'Suchen', 
        disabled:false,
        handler: function() {
             loadGrid();      
        }
    });

    var reset = simple.addButton({
        text: 'Neu', 
        disabled:false,
        handler: function() {
             clearCombo();   
             
             //setze die eingaben zurueck
             Ext.getCmp('studiengang').reset();         
             dsCat_studiengang.proxy = new Ext.data.HttpProxy({url: 'search_detail.mysql.php?id=studiengang'});
             dsCat_studiengang.load();

             Ext.getCmp('city').reset();         
             dsCat_ort.proxy = new Ext.data.HttpProxy({url: 'search_detail.mysql.php?id=ort'});
             dsCat_ort.load();

             Ext.getCmp('model').reset();         
             dsCat_model.proxy = new Ext.data.HttpProxy({url: 'search_detail.mysql.php?id=model'});
             dsCat_model.load();
             
             Ext.getCmp('institution').reset();         
             dsCat_institution.proxy = new Ext.data.HttpProxy({url: 'search_detail.mysql.php?id=institution'});
             dsCat_institution.load();
             
             Ext.getCmp('ausbildung').reset();         
             dsCat_ausbildung.proxy = new Ext.data.HttpProxy({url: 'search_detail.mysql.php?id=ausbildung'});
             dsCat_ausbildung.load();
        }
    });


    simple.render('test'); 
    Ext.getCmp('ausbildung').getEl().up('div.x-form-item').hide();   
    

    
    function clearCombo() {
        Ext.getCmp('ausbildung').getEl().up('div.x-form-item').hide();
        combo_ausbildung.setValue();   
        document.getElementById('grid-example').innerHTML = '';  
    }
        
    function loadGrid(){
        
        
        // create the Grid
        document.getElementById('grid-example').innerHTML = '';
        
        var store = new Ext.data.JsonStore({
        url: 'ajax_detail.php?sg=' + escape(combo_sg.getValue()) + 
                        '&ort=' + escape(combo_ort.getValue()) + 
                        '&model=' + escape(combo_model.getValue()) + 
                        '&ausbildung=' + escape(combo_ausbildung.getValue()) +  
                        '&institution=' + escape(combo_institution.getValue()),
        root: 'data', 
        fields: ['uni_name1','model', 'course_name', 'ausbildung', 'abschluss','course_id'] 
        });
    
        store.load();
    
        
    function change(val){
      if(1 > 0){
          return '<a href="http://www.hochschule-dual.de" target="_blank" style="color: #444444;">' + val + '</a>';  
      }else if(val < 0){
          return '<span style="color:red;">' + val + '</span>';
      }
      return val;
    }
    
    function details(){
    return '<a href="#" style="text-decoration: none">Details</a>';
    }
    
        var grid = new Ext.grid.GridPanel({
            
            store: store,
            columns: [
                {header: "Hochschule", width: 230, sortable: true, renderer: 'uni_name1', dataIndex: 'uni_name1'},
                {header: "Studienmodell", width: 150, sortable: true, renderer: 'model', dataIndex: 'model'},
                {header: "Studiengang", width: 270, sortable: true, renderer: 'course_name', dataIndex: 'course_name'},
                {header: "Ausbildungsberuf", width: 170, sortable: true, renderer: 'ausbildung', dataIndex: 'ausbildung'},
                {header: "Abschluss/Titel", width: 110, sortable: true, renderer: 'abschluss', dataIndex: 'abschluss'},
                {header: "Details", align: 'left', width: 50, sortable: true, renderer: details, dataIndex: ''}
            ],
            stripeRows: true,
            //autoExpandColumn: 'email',
            sm: new Ext.grid.RowSelectionModel({singleSelect:true}),

            height:360,
            width:1001,
            title:'Ergebnisse: Detaillierte Gesamtsuche'
        });
        
        grid.render('grid-example');
        grid.addListener('rowclick', DetailInfo);
        grid.getSelectionModel().selectFirstRow(); 
           
    }
});