/**
 * @class Ext.chart.sprite.Label
 * @extends Ext.draw.sprite.Text
 *
 * Sprite used to represent labels in series.
 *
 * Important: the actual default values are determined by the theme used.
 * Please see the `label` config of the {@link Ext.chart.theme.Base#axis}.
 */
Ext.define('Ext.chart.sprite.Label', {
    extend: 'Ext.draw.sprite.Text',
    alternateClassName: 'Ext.chart.label.Label',
    requires: ['Ext.chart.modifier.Callout'],
 
    inheritableStatics: {
        def: {
            processors: {
                callout: 'limited01',
                // Meant to be set by the Callout modifier only. 
                calloutHasLine: 'bool',
                // The position where the callout would end, if not for the label: 
                // callout stops at the bounding box of the label, 
                // so the actual point where the callout ends - calloutEndX/Y - 
                // is calculated by the Callout modifier. 
                calloutPlaceX: 'number',
                calloutPlaceY: 'number',
                // The start/end points used to render the callout line. 
                calloutStartX: 'number',
                calloutStartY: 'number',
                calloutEndX: 'number',
                calloutEndY: 'number',
 
                calloutColor: 'color',
                calloutWidth: 'number',
                calloutVertical: 'bool',
                labelOverflowPadding: 'number',
                display: 'enums(none,under,over,rotate,insideStart,insideEnd,inside,outside)',
                orientation: 'enums(horizontal,vertical)',
                renderer: 'default'
            },
 
            defaults: {
                callout: 0,
                calloutHasLine: true,
                calloutPlaceX: 0,
                calloutPlaceY: 0,
                calloutStartX: 0,
                calloutStartY: 0,
                calloutEndX: 0,
                calloutEndY: 0,
                calloutWidth: 1,
                calloutVertical: false,
                calloutColor: 'black',
                labelOverflowPadding: 5,
                display: 'none',
                orientation: '',
                renderer: null
            },
 
            triggers: {
                callout: 'transform',
                calloutPlaceX: 'transform',
                calloutPlaceY: 'transform',
                labelOverflowPadding: 'transform',
                calloutRotation: 'transform',
                display: 'hidden'
            },
 
            updaters: {
                hidden: function (attrs) {
                    attrs.hidden = attrs.display === 'none';
                }
            }
        }
    },
 
    config: {
        /**
         * @cfg {Object} fx Animation configuration.
         */
        fx: {
            customDurations: {
                callout: 200
            }
        },
        field: null,
        /**
         * @cfg {Boolean|Object} calloutLine
         *
         * True to draw a line between the label and the chart with the default settings,
         * or an Object that defines the 'color', 'width' and 'length' properties of the line.
         * This config is only applicable when the label is displayed outside the chart.
         *
         * Default value: false.
         */
        calloutLine: true
    },
 
    applyCalloutLine: function (calloutLine) {
        if (calloutLine) {
            return Ext.apply({}, calloutLine);
        }
    },
 
    prepareModifiers: function () {
        this.callParent(arguments);
        this.calloutModifier = new Ext.chart.modifier.Callout({sprite: this});
        this.fx.setNext(this.calloutModifier);
        this.calloutModifier.setNext(this.topModifier);
    },
 
    render: function (surface, ctx) {
        var me = this,
            attr = me.attr,
            calloutColor = attr.calloutColor;
 
        ctx.save();
        ctx.globalAlpha *= attr.callout;
        if (ctx.globalAlpha > 0 && attr.calloutHasLine) {
            if (calloutColor && calloutColor.isGradient) {
                calloutColor = calloutColor.getStops()[0].color;
            }
            ctx.strokeStyle = calloutColor;
            ctx.fillStyle = calloutColor;
            ctx.lineWidth = attr.calloutWidth;
            ctx.beginPath();
            ctx.moveTo(me.attr.calloutStartX, me.attr.calloutStartY);
            ctx.lineTo(me.attr.calloutEndX, me.attr.calloutEndY);
            ctx.stroke();
 
            ctx.beginPath();
            ctx.arc(me.attr.calloutStartX, me.attr.calloutStartY, 1 * attr.calloutWidth, 0, 2 * Math.PI, true);
            ctx.fill();
 
            ctx.beginPath();
            ctx.arc(me.attr.calloutEndX, me.attr.calloutEndY, 1 * attr.calloutWidth, 0, 2 * Math.PI, true);
            ctx.fill();
        }
        ctx.restore();
 
        Ext.draw.sprite.Text.prototype.render.apply(me, arguments);
    }
});