Ext.draw.Surface add function does not render an array of sprites correctly

[stan229]

REQUIRED INFORMATIONSencha Touch version tested:

• Sencha Touch 2.2

Browser versions tested against:[LIST][*]Chrome 26/LIST]Description:

• When using an Ext.draw.Surface instance to add sprites to it at runtime, you can pass in array of sprites and it will render them, but it will only use the config properties of the first sprite.

Steps to reproduce the problem:

• Render an instance of Ext.draw.Component
• Initialize an array of objects containing Ext.draw.sprite.Sprite config properties
• Get Draw Component's Surface instance and call add function with the array as an argument

The result that was expected:

• Render all sprites with their properties

The result that occurs instead:

• Render all sprites with their individual properties

Test Case:

Ext.define('TNR.view.CanvasGrid', {
    extend         : 'Ext.draw.Component',
    xtype          : 'canvasgrid',
    initialize     : function () {
        var me = this,
            sprites = me.getGridSprites();
        me.getSurface().add(sprites);
        me.callParent();
    },
    getGridSprites : function () {
        var length    = 16,
            sprites   = [],
            type      = 'rect',
            width     = 25,
            height    = 25,
            fillStyle = '#fff',
            i,
            j;


        for (i = 0; i < length; ++i) {
            for (j = 0; j < length; ++j) {
                sprites.push({
                    type      : type,
                    width     : width,
                    height    : height,
                    fillStyle : fillStyle,
                    x         : 5 + (width*j*2+10),
                    y         : 5 + (height*i*2+10)
                });
            }
        }
        return sprites;
    }
});

HELPFUL INFORMATIONScreenshot or Video:

• Broken: 6lrn.png
• Fixed: w05k.png

Possible fix:

• In src/draw/Surface.js modify line 324 (add function implementation) to be:

  sprite = me.prepareItems(args[0])[i];

  instead of

  sprite = me.prepareItems(args[0])[0];

[mitchellsimoens]

Thanks for the report! I have opened a bug in our bug tracker.