Ext.onReady(function(){
    
    var dsSpecies = new Ext.data.Store({
        proxy: new Ext.data.HttpProxy({
            url: 'GetNames?st=tsj' //url: 'GetImgFs?q=sp'
        }),
        reader: new Ext.data.JsonReader({
            root: 'taxanames',
            totalProperty: 'totalCount',
            id: 'TName'
        }, [
        {name: 'TName'},
        {name: 'TLevel'}
        ])
    });
    
    // Custom rendering Template
    var resultTpl = new Ext.Template(
    '<div class="search-item">',
    '<span>{TLevel}</span>{TName}',
    '</div>'
    );
    
    var txtImage = Ext.get('txtImage'); 
    var txtFact = Ext.get('txtFact'); 
    
    // Apply to the Images
    var imgSpecies = new Ext.form.ComboBox({
        store: dsSpecies,
        minChars: 3,
        typeAhead: false,
        loadingText: 'Searching...',
        displayField: 'TName',
        width: 250,
        pageSize:10,
        hideTrigger:true,
        tpl: resultTpl 
    });
    imgSpecies.on({
        select: function(combo, record, index) {
            $('ta').value = record.data.TName;
            $('tt').value = record.data.TLevel;
        }, 
        beforequery: function(e) {
            //document.getElementById('spid').value = record.data.spid;
            
            dsSpecies.proxy = new Ext.data.HttpProxy({
                url: 'GetNames?st=tsj&t=i'
            });                                
            
        }
    }); 
    if (txtImage) imgSpecies.applyTo('txtImage');
    
    // Apply to the Images
    var fsSpecies = new Ext.form.ComboBox({
        store: dsSpecies,
        minChars: 3,
        typeAhead: false,
        loadingText: 'Searching...',
        displayField: 'TName',
        width: 250,
        pageSize:10,
        hideTrigger:true,
        tpl: resultTpl 
    });
    fsSpecies.on({
        select: function(combo, record, index) {
            $('ta').value = record.data.TName;
            $('tt').value = record.data.TLevel;
        }, 
        beforequery: function(e) {
            //document.getElementById('spid').value = record.data.spid;
            
            dsSpecies.proxy = new Ext.data.HttpProxy({
                url: 'GetNames?st=tsj&t=f'
            });                                
            
        }
    }); 
    if (txtFact) fsSpecies.applyTo('txtFact');
    
    var goImage = Ext.get('goImage'); 
    var goFact = Ext.get('goFact'); 
    
    if (goImage) goImage.on('click', goImages, this); 
    if (goFact) goFact.on('click', goFactsheets, this); 
    
    function goImages() {
        location.href="listing.jsp?q=img&ta=" + $('ta').value + "&tt=" + $('tt').value; 
        /*
        var u = location.href; 
        u = u.substring(u.lastIndexOf("/")+1);         
        //alert("u: " + u);
        if (!u.startsWith("listing.jsp")) {
            location.href="listing.jsp?q=img&ta=" + $('ta').value + "&tt=" + $('tt').value; 
        }
        else {
            ImgFsListing.doLoadImages({
                url: 'GetImgFs?q=img&ta=' + $('ta').value + '&tt=' + $('tt').value 
            });
            tabs.activate('img-tab');
        }
        */
    }
    
    function goFactsheets() {
        location.href="listing.jsp?q=fs&ta=" + $('ta').value + "&tt=" + $('tt').value; 
        /*
        var u = location.href; 
        u = u.substring(u.lastIndexOf("/")+1); 
        //alert("u: " + u);
        if (!u.startsWith("listing.jsp")) {
            location.href="listing.jsp?q=fs&ta=" + $('ta').value + "&tt=" + $('tt').value; 
        }
        else {
            ImgFsListing.doLoadImages({
                url: 'GetImgFs?q=img&ta=' + $('ta').value + '&tt=' + $('tt').value 
            });
            tabs.activate('fs-tab');
        }
        */
    }
    
    function getRecords(reqtype) {
        var ImgFsDef = Ext.data.Record.create([
        {name: 'rid'},     
        {name: 'spurl'},     
        {name: 'spinst'}
        ]);
        var imgfsReader = new Ext.data.JsonReader({
            root: 'spresults', 
            totalCount: 'totalCount', 
            id: 'rid' 
        }, RecordDef);
        
    }
    
});

