Overriding & dynamic items in config

[Gaelmart]

Hi
This should be simple & common task I think but I'm on learning curve.

There is a lovely image zoom control below which I can work outside of SA but I need to...

Dynamically change the images (items) & number of.

I've got the data worked out, meaning I know how to show database stuff in a LIST control. Not sure how to loop/add items: [ .... xtype: 'imageviewer',..... ]

http://www.sencha.com/forum/showthre...ing-fine/page4

SA FILE:
--------------------------------------------------------------------

Ext.define('BoilerShop.view.DiagramCarousel', {
    extend: 'Ext.carousel.Carousel',
    alias: 'widget.diagramcarousel',


    config: {
        listeners: [
            {
                fn: 'onCarouselActiveItemChange',
                event: 'activeitemchange'
            },
            {
                fn: 'onCarouselResize',
                event: 'resize'
            }
        ]
    },


    onCarouselActiveItemChange: function(container, value, oldValue, options) {
        if(oldValue){
            oldValue.resetZoom();
            this.getActiveItem().resize();
        }


    },


    onCarouselResize: function(component, options) {
        this.getActiveItem().resize();
    }


});

Override file
-------------------------------------

Ext.define('BoilerShop.OverrideDiagramCarousel', {
 override: 'BoilerShop.view.DiagramCarousel',
  
 
    config: {
        
          items: [
                    {
                        xtype: 'imageviewer',
                        style: {
                            backgroundColor: '#222'
                        },
                        imageSrc: 'http://www.ibasis.co.uk/Uploads/SAUNIER DUVAL/1281301.png'
                    },
                    {
                        xtype: 'imageviewer',
                        style: {
                            backgroundColor: '#222'
                        },
                        imageSrc: 'http://www.ibasis.co.uk/Uploads/SAUNIER DUVAL/1281302.png'
                    },
                    {
                        xtype: 'imageviewer',
                        style: {
                            backgroundColor: '#222'
                        },
                        imageSrc: 'http://www.ibasis.co.uk/Uploads/SAUNIER DUVAL/1281303.png'
                    },
                     {
                        xtype: 'imageviewer',
                        style: {
                            backgroundColor: '#222'
                        },
                        imageSrc: 'http://www.ibasis.co.uk/Uploads/SAUNIER DUVAL/1281304.png'
                    },
                     {
                        xtype: 'imageviewer',
                        style: {
                            backgroundColor: '#222'
                        },
                        imageSrc: 'http://www.ibasis.co.uk/Uploads/SAUNIER DUVAL/1281305.png'
                    }
                    
                ]
 
  },
  constructor: function (config) {
         this.callParent(arguments); // calls Ext.tip.ToolTip's constructor
        alert('This gets shown so were ok here');
     }
     
});

Thanks

Gary

[aconran]

Not sure I understand the question...