add extjs 6.0.1 sources

[extjs.git] / extjs / packages / charts / src / draw / sprite / Image.js

/**\r
 * @class Ext.draw.sprite.Image\r
 * @extends Ext.draw.sprite.Rect\r
 * \r
 * A sprite that represents an image.\r
 */\r
Ext.define('Ext.draw.sprite.Image', {\r
    extend: 'Ext.draw.sprite.Rect',\r
    alias: 'sprite.image',\r
    type: 'image',\r
    statics: {\r
        imageLoaders: {}\r
    },\r
\r
    inheritableStatics: {\r
        def: {\r
            processors: {\r
                /**\r
                 * @cfg {String} [src=''] The image source of the sprite.\r
                 */\r
                src: 'string'\r
            },\r
            defaults: {\r
                src: '',\r
                /**\r
                 * @cfg {Number} [width=null] The width of the image.\r
                 * For consistent image size on all devices the width must be explicitly set.\r
                 * Otherwise the natural image width devided by the device pixel ratio\r
                 * (for a crisp looking image) will be used as the width of the sprite.\r
                 */\r
                width: null,\r
                /**\r
                 * @cfg {Number} [height=null] The height of the image.\r
                 * For consistent image size on all devices the height must be explicitly set.\r
                 * Otherwise the natural image height devided by the device pixel ratio\r
                 * (for a crisp looking image) will be used as the height of the sprite.\r
                 */\r
                height: null\r
            }\r
        }\r
    },\r
\r
    render: function (surface, ctx) {\r
        var me = this,\r
            attr = me.attr,\r
            mat = attr.matrix,\r
            src = attr.src,\r
            x = attr.x,\r
            y = attr.y,\r
            width = attr.width,\r
            height = attr.height,\r
            loadingStub = Ext.draw.sprite.Image.imageLoaders[src],\r
            imageLoader,\r
            image,\r
            i;\r
\r
        if (loadingStub && loadingStub.done) {\r
            mat.toContext(ctx);\r
            image = loadingStub.image;\r
            ctx.drawImage(image, x, y,\r
                    width || (image.naturalWidth || image.width) / surface.devicePixelRatio,\r
                    height || (image.naturalHeight || image.height) / surface.devicePixelRatio);\r
        } else if (!loadingStub) {\r
            imageLoader = new Image();\r
            loadingStub = Ext.draw.sprite.Image.imageLoaders[src] = {\r
                image: imageLoader,\r
                done: false,\r
                pendingSprites: [me],\r
                pendingSurfaces: [surface]\r
            };\r
            imageLoader.width = width;\r
            imageLoader.height = height;\r
            imageLoader.onload = function () {\r
                if (!loadingStub.done) {\r
                    loadingStub.done = true;\r
                    for (i = 0; i < loadingStub.pendingSprites.length; i++) {\r
                        loadingStub.pendingSprites[i].setDirty(true);\r
                    }\r
                    for (i in loadingStub.pendingSurfaces) {\r
                        loadingStub.pendingSurfaces[i].renderFrame();\r
                    }\r
                }\r
            };\r
            imageLoader.src = src;\r
        } else {\r
            Ext.Array.include(loadingStub.pendingSprites, me);\r
            Ext.Array.include(loadingStub.pendingSurfaces, surface);\r
        }\r
\r
        //<debug>\r
        var debug = attr.debug || this.statics().debug || Ext.draw.sprite.Sprite.debug;\r
        if (debug) {\r
            debug.bbox && this.renderBBox(surface, ctx);\r
        }\r
        //</debug>\r
    }\r
});