Ext.namespace('Ext.wba.product');

Ext.onReady(function(){

    Ext.QuickTips.init();

});

Ext.wba.ProductListConfigPanel = function(config){
  Ext.wba.ProductListConfigPanel.superclass.constructor.call(this, config);
};

Ext.extend(Ext.wba.ProductListConfigPanel, Ext.wba.GenericConfigPanel,{
    tabs: true,
    getFields : function(properties) {
        var widget1 = Ext.wba.widgetManager.getGenericType("string");
        var config1 = {
            name: "headerText",
            title: "Text Heading",
            wba: this.wbaInterface,
            required: false
        };

        var widget2 = Ext.wba.widgetManager.getGenericType("image");
        var config2 = {
            name: "headerImage",
            title: "Image Heading",
            wba: this.wbaInterface,
            required: false
        };

        var widget3 = Ext.wba.widgetManager.getGenericType("santanaLink");
        var config3 = {
            name: "headerLink",
            title: "Link Heading",
            wba: this.wbaInterface,
            required: false
        };

        var widget4 = Ext.wba.widgetManager.getGenericType("string");
        var config4 = {
            name: "subheaderText",
            title: "Subheading",
            wba: this.wbaInterface,
            required: false
        };


        var widget5 = Ext.wba.widgetManager.getGenericType("asin");
        var config5 = {
            name: "ASIN",
            title: "ASIN",
            wba: this.wbaInterface,
            required: false
        };


        var widget6 = Ext.wba.widgetManager.getGenericType("integer");
        var config6 = {
            name: "numResultsToShow",
            title: "Number of Products",
            wba: this.wbaInterface,
            required: true,
            width: 40
        };

        var widget7 = Ext.wba.widgetManager.getGenericType("boolean");
        var config7 = {
            name: "isCarousel",
            title: "Display as a Carousel",
            wba: this.wbaInterface,
            required: false,

   	    handler: function(checkBox, checked) {
	    	var maxTotalResultField = Ext.getCmp('maxTotalResults');
	    	if(checked) {
		    maxTotalResultField.enable();
	    	}
	    	else {
	    	maxTotalResultField.setValue('');
	    	maxTotalResultField.disable();
	    	maxTotalResultField.removeClass('x-form-invalid');
	    	}
       	    }
        };

        var widget8 = Ext.wba.widgetManager.getGenericType("integer");
        var config8 = {
            name: "maxTotalResults",
            id: "maxTotalResults",
            title: "Number of Products to include in carousel",
            wba: this.wbaInterface,
            width: 40,
            required: true,
            disabled: true
        };


        var widget9 = Ext.wba.widgetManager.getGenericType("integer");
        var config9 = {
            name: "thumbImageSize",
            title: "Image Width",
            wba: this.wbaInterface,
            required: false,
            defaultValue: 120,
            width: 40
        };

        var widget10 = Ext.wba.widgetManager.getGenericType("boolean");
        var config10 = {
            name: "showProductTitle",
            title: "Display Product Title",
            wba: this.wbaInterface,
            required: false
        };

        var widget11= Ext.wba.widgetManager.getGenericType("boolean");
        var config11 = {
            name: "showProductDetails",
            title: "Display Product Details",
            wba: this.wbaInterface,
            required: false
        };

        var widget12 = Ext.wba.widgetManager.getGenericType("boolean");
        var config12 = {
            name: "hideOOSAsins",
            title: "Supress Unavailable Products",
            wba: this.wbaInterface,
            required: false
        };

        var widget13 = Ext.wba.widgetManager.getGenericType("boolean");
        var config13 = {
            name: "performAsinDeDuping",
            title: "Supress Duplicate Products",
            wba: this.wbaInterface,
            required: false
        };

        var widget14 = Ext.wba.widgetManager.getGenericType("boolean");
        var config14 = {
            name: "displayQuickView",
            title: "Enable Quick View",
            wba: this.wbaInterface,
            checked: true,
            required: false
        };

        var widgets = [];
        widgets.push(new widget1(config1));
        widgets.push(new widget2(config2));
        widgets.push(new widget3(config3));
        widgets.push(new widget4(config4));
        widgets.push(new widget5(config5));
        widgets.push(new widget6(config6));
        widgets.push(new widget7(config7));
        widgets.push(new widget8(config8));
        widgets.push(new widget9(config9));
        widgets.push(new widget10(config10));
        widgets.push(new widget11(config11));
        widgets.push(new widget12(config12));
        widgets.push(new widget13(config13));
        widgets.push(new widget14(config14));

        var tab1Items = [];
        var tab2Items = [];

        var TextheadingComplex = Ext.wba.FormColumnWidget(widgets.slice(0, 1), 1, false, {
	        title: 'Text Heading',
            complex: true,
            type: 'TextheadingComplexType'
        });

        var SubheadingComplex = Ext.wba.FormColumnWidget(widgets.slice(3, 4), 1, false, {
	        title: 'Subheading',
            complex: true,
            type: 'SubheadingComplexType'
        });

        tab1Items.push(TextheadingComplex);
        tab1Items = tab1Items.concat(widgets.slice(1, 3));
        tab1Items.push(SubheadingComplex);

        var productASINComplex = Ext.wba.FormColumnWidget(widgets.slice(4, 5), 1, false, {
			complex: true,
            type: 'TextheadingComplexType2'
        });

        var rightColumnItems = widgets.slice(5, 6);

        var carouselGroup = Ext.wba.FormGroupWidget(widgets.slice(6, 8),"Carousel",1,{labelWidth: 220,labelSeparator:' ',complex:true});
        var productInfoGroup = Ext.wba.FormGroupWidget(widgets.slice(9, 11),"Product Information",1,{labelWidth: 116,labelSeparator:Ext.wba.RequiredIcon+' ',complex:true});
        var productSuppressionGroup = Ext.wba.FormGroupWidget(widgets.slice(11, 13),"Suppression",1,{labelWidth: 116,labelSeparator:Ext.wba.RequiredIcon+' ',complex:true});
        var quickViewGroup = Ext.wba.FormGroupWidget(widgets.slice(13, 14),"Quick View",1,{labelWidth: 116,labelSeparator:Ext.wba.RequiredIcon+' ',complex:true});
		rightColumnItems.push(carouselGroup);
		rightColumnItems = rightColumnItems.concat(widgets.slice(8,9));
		rightColumnItems.push(productInfoGroup);
        rightColumnItems.push(productSuppressionGroup);
        rightColumnItems.push(quickViewGroup);

        var productRightColumnComplex = Ext.wba.FormColumnWidget(rightColumnItems, 1, false, {
	        title: 'Display Options',
            complex: true,
            type: 'TextheadingComplexType3'
        });

        tab2Items.push(productRightColumnComplex);

        return {
            items: [
    			{title:'Headings',items:tab1Items},
    			{title:'Products',items:tab2Items}
		    ],

            widgets: widgets
        };
    }
});

Ext.wba.pageletPanel.load(Ext.wba.ProductListConfigPanel);