Ext.BLANK_IMAGE_URL = '/includes/ext/resources/images/default/s.gif';
//create namespace
Ext.namespace('spareparts');
//create application
spareparts.app = function(){
    // do NOT access DOM from here; elements don't exist yet
    
    // private variables
    
    // private functions
    
    // public space
    return {
        // public properties, e.g. strings to translate
        
        // public methods
        init: function(){
        
            var initSimple = 0;
            
            var partRecord = Ext.data.Record.create([{
                name: 'src',
                mapping: 'thumb'
            }, {
                name: 'text'
            }, {
                name: 'fullSrc',
                mapping: 'image'
            }, {
                name: 'desc'
            }]);
            
            var partRead = new Ext.data.XmlReader({
                record: "item"
            }, partRecord);
            
            var partStore = new Ext.data.Store({
                url: 'special_tools.asp',
                reader: partRead
            });
            
            function partSearch(){
                var picClear = Ext.get("picSelect");
                picClear.slideOut('t', {
                    easing: 'easeOut',
                    duration: .5,
                    remove: false,
                    useDisplay: false,
                    callback: function(){
                        picClear.dom.innerHTML = "";
                        var srch = Ext.getCmp("txtSearch").getValue();
                        partStore.load({
                            params: {
                                search: srch
                            },
                            callback: function(){
                                Ext.get("largeimg").dom.innerHTML = '<img src="' + partStore.getAt(0).data['fullSrc'] + '" width=350 height = 228>';
                                Ext.get("descript").dom.innerHTML = partStore.getAt(0).data['desc'];
                                Ext.get("header").dom.innerHTML = partStore.getAt(0).data['text'];
                            }
                        });
                    }
                });
                picClear.slideIn('r', {
                    easing: 'backIn',
                    duration: .5
                });
            }
            
            partStore.on('load', function(){
                var picArray = new Array();
                partStore.data.each(function(item, index, totalItems){
                    picArray.push({
                        fullSrc: item.get('fullSrc'),
                        src: item.get('src'),
                        text: item.get('text'),
                        desc: Ext.util.Format.htmlDecode(item.get('desc'))
                    });
                });
                if (initSimple == 0) {
                    initSimple++;
                    var topToolbar = new Ext.Toolbar({
                        id: 'topTB',
                        listeners: {
                            render: function(){
                                this.addText("<span id='header' style='font-weight: bold;'>" + partStore.getAt(0).data['text'] + "</span>");
                            }
                        },
                        items: ['->', {
                            hideLabel: true,
                            xtype: 'textfield',
                            width: 180,
                            id: 'txtSearch',
                            emptyText: 'Search Tools...',
                            listeners: {
                                specialkey: function(field, e){
                                    if (e.getKey() == e.ENTER) {
                                    	partSearch();
                                    }
                                }
                            }
                        }, {
                            xtype: 'button',
                            id: 'btnSearch',
                            text: 'Find Tools',
                            listeners: {
                                click: function(){
                                    partSearch();
                                }
                            }
                        }, '-', {
                            xtype: 'button',
                            id: 'btnClear',
                            text: 'View All',
                            listeners: {
                                click: function(){
                                    var picClear = Ext.get("picSelect");
                                    picClear.slideOut('t', {
                                        easing: 'easeOut',
                                        duration: .5,
                                        remove: false,
                                        useDisplay: false,
                                        callback: function(){
                                            picClear.dom.innerHTML = "";
                                            var srch = Ext.getCmp("txtSearch");
                                            partStore.load({
                                                callback: function(){
                                                    Ext.get("largeimg").dom.innerHTML = '<img src="' + partStore.getAt(0).data['fullSrc'] + '" width=350 height = 228>';
                                                    Ext.get("descript").dom.innerHTML = partStore.getAt(0).data['desc'];
                                                    Ext.get("header").dom.innerHTML = partStore.getAt(0).data['text'];
													srch.setValue('');
                                                }
                                            });
                                        }
                                    });
                                    picClear.slideIn('r', {
                                        easing: 'backIn',
                                        duration: .5
                                    });
                                }
                            }
                        }]
                    })
                    var simple = new Ext.Panel({
                        id: 'partsCarousel',
                        renderTo: 'carousel',
                        height: 315,
                        style: 'text-align: left',
                        contentEl: 'partCont',
                        tbar: topToolbar
                    });
                }
                var rotPanel = new Ext.Panel({
                    frame: false,
                    renderTo: 'picSelect',
					height:175,
					border: false,
                    items: [{
                        xtype: 'carousel',
                        wrapMarginY: 30,
                        wrapMarginX: 25,
                        imageHeight: 98,
                        border: false,
                        imageWidth: 150,
                        width: 770,
                        listeners: {
                            selected: function(carousel, image, e, ele){
                                Ext.get("partCont").fadeOut({
                                    remove: false,
                                    callback: function(){
                                        Ext.get("largeimg").dom.innerHTML = '<img src="' + (image.fullSrc || image.src) + '" width=350 height=228>';
                                        Ext.get("largeimg").fadeIn();
                                        Ext.get("descript").dom.innerHTML = image.desc;
                                        Ext.get("partCont").fadeIn();
                                        Ext.get("header").dom.innerHTML = image.text;
                                    }
                                });
                                
                            }
                        },
                        images: picArray
                    }]
                })
                
            });
            partStore.load({
                callback: function(records, options, success){
                    Ext.get("largeimg").dom.innerHTML = '<img src="' + partStore.getAt(0).data['fullSrc'] + '" width=350 height = 228>';
                    Ext.get("descript").dom.innerHTML = partStore.getAt(0).data['desc'];
                }
            });
        }
    };
    
}();// end of app
//end of file