Proyectos de Subversion Moodle

YUI.add('series-plot-util', function (Y, NAME) {

/**

 * Provides functionality for drawing plots in a series.

 *

 * @module charts

 * @submodule series-plot-util

 */

var Y_Lang = Y.Lang,

    _getClassName = Y.ClassNameManager.getClassName,

    SERIES_MARKER = _getClassName("seriesmarker");

/**

 * Utility class used for drawing markers.

 *

 * @class Plots

 * @constructor

 * @submodule series-plot-util

 */

function Plots(cfg)

{

    var attrs = {

        markers: {

            getter: function()

            {

                return this._markers;

            }

        }

    };

    this.addAttrs(attrs, cfg);

}

Plots.prototype = {

    /**

     * Storage for default marker styles.

     *

     * @property _plotDefaults

     * @type Object

     * @private

     */

    _plotDefaults: null,

    /**

     * Draws the markers

     *

     * @method drawPlots

     * @protected

     */

    drawPlots: function()

    {

        if(!this.get("xcoords") || this.get("xcoords").length < 1)

		{

			return;

		}

        var isNumber = Y_Lang.isNumber,

            style = this._copyObject(this.get("styles").marker),

            w = style.width,

            h = style.height,

            xcoords = this.get("xcoords"),

            ycoords = this.get("ycoords"),

            i = 0,

            len = xcoords.length,

            top = ycoords[0],

            left,

            marker,

            offsetWidth = w/2,

            offsetHeight = h/2,

            xvalues,

            yvalues,

            fillColors = null,

            borderColors = null,

            graphOrder = this.get("graphOrder"),

            groupMarkers = this.get("groupMarkers");

        if(groupMarkers)

        {

            xvalues = [];

            yvalues = [];

            for(; i < len; ++i)

            {

                xvalues.push(parseFloat(xcoords[i] - offsetWidth));

                yvalues.push(parseFloat(ycoords[i] - offsetHeight));

            }

            this._createGroupMarker({

                xvalues: xvalues,

                yvalues: yvalues,

                fill: style.fill,

                border: style.border,

                dimensions: {

                    width: w,

                    height: h

                },

                graphOrder: graphOrder,

                shape: style.shape

            });

            return;

        }

        if(Y_Lang.isArray(style.fill.color))

        {

            fillColors = style.fill.color.concat();

        }

        if(Y_Lang.isArray(style.border.color))

        {

            borderColors = style.border.color.concat();

        }

        this._createMarkerCache();

        for(; i < len; ++i)

        {

            top = parseFloat(ycoords[i] - offsetHeight);

            left = parseFloat(xcoords[i] - offsetWidth);

            if(!isNumber(left) || !isNumber(top))

            {

                this._markers.push(null);

                continue;

            }

            if(fillColors)

            {

                style.fill.color = fillColors[i % fillColors.length];

            }

            if(borderColors)

            {

                style.border.color = borderColors[i % borderColors.length];

            }

            style.x = left;

            style.y = top;

            marker = this.getMarker(style, graphOrder, i);

        }

        this._clearMarkerCache();

    },

    /**

     * Pre-defined group shapes.

     *

     * @property _groupShapes

     * @private

     */

    _groupShapes: {

        circle: Y.CircleGroup,

        rect: Y.RectGroup,

        ellipse: Y.EllipseGroup,

        diamond: Y.DiamondGroup

    },

    /**

     * Returns the correct group shape class.

     *

     * @method _getGroupShape

     * @param {Shape | String} shape Indicates which shape class.

     * @return Function

     * @protected

     */

    _getGroupShape: function(shape)

    {

        if(Y_Lang.isString(shape))

        {

            shape = this._groupShapes[shape];

        }

        return shape;

    },

    /**

     * Gets the default values for series that use the utility. This method is used by

     * the class' `styles` attribute's getter to get build default values.

     *

     * @method _getPlotDefaults

     * @return Object

     * @protected

     */

    _getPlotDefaults: function()

    {

        var defs = {

            fill:{

                type: "solid",

                alpha: 1,

                colors:null,

                alphas: null,

                ratios: null

            },

            border:{

                weight: 1,

                alpha: 1

            },

            width: 10,

            height: 10,

            shape: "circle"

        };

        defs.fill.color = this._getDefaultColor(this.get("graphOrder"), "fill");

        defs.border.color = this._getDefaultColor(this.get("graphOrder"), "border");

        return defs;

    },

    /**

     * Collection of markers to be used in the series.

     *

     * @property _markers

     * @type Array

     * @private

     */

    _markers: null,

    /**

     * Collection of markers to be re-used on a series redraw.

     *

     * @property _markerCache

     * @type Array

     * @private

     */

    _markerCache: null,

    /**

     * Gets and styles a marker. If there is a marker in cache, it will use it. Otherwise

     * it will create one.

     *

     * @method getMarker

     * @param {Object} styles Hash of style properties.

     * @param {Number} order Order of the series.

     * @param {Number} index Index within the series associated with the marker.

     * @return Shape

     * @protected

     */

    getMarker: function(styles, order, index)

    {

        var marker,

            border = styles.border;

        styles.id = this._getChart().get("id") + "_" + order + "_" + index;

        //fix name differences between graphic layer

        border.opacity = border.alpha;

        styles.stroke = border;

        styles.fill.opacity = styles.fill.alpha;

        if(this._markerCache.length > 0)

        {

            while(!marker)

            {

                if(this._markerCache.length < 1)

                {

                    marker = this._createMarker(styles);

                    break;

                }

                marker = this._markerCache.shift();

            }

            marker.set(styles);

        }

        else

        {

            marker = this._createMarker(styles);

        }

        this._markers.push(marker);

        return marker;

    },

    /**

     * Creates a shape to be used as a marker.

     *

     * @method _createMarker

     * @param {Object} styles Hash of style properties.

     * @return Shape

     * @private

     */

    _createMarker: function(styles)

    {

        var graphic = this.get("graphic"),

            marker,

            cfg = this._copyObject(styles);

        cfg.type = cfg.shape;

        marker = graphic.addShape(cfg);

        marker.addClass(SERIES_MARKER);

        return marker;

    },

    /**

     * Creates a cache of markers for reuse.

     *

     * @method _createMarkerCache

     * @private

     */

    _createMarkerCache: function()

    {

        if(this._groupMarker)

        {

            this._groupMarker.destroy();

            this._groupMarker = null;

        }

        if(this._markers && this._markers.length > 0)

        {

            this._markerCache = this._markers.concat();

        }

        else

        {

            this._markerCache = [];

        }

        this._markers = [];

    },

    /**

     * Draws a series of markers in a single shape instance.

     *

     * @method _createGroupMarkers

     * @param {Object} styles Set of configuration properties used to create the markers.

     * @protected

     */

    _createGroupMarker: function(styles)

    {

        var marker,

            markers = this.get("markers"),

            border = styles.border,

            graphic,

            cfg,

            shape;

        if(markers && markers.length > 0)

        {

            while(markers.length > 0)

            {

                marker = markers.shift();

                marker.destroy();

            }

            this.set("markers", []);

        }

        //fix name differences between graphic layer

        border.opacity = border.alpha;

        cfg = {

            id: this._getChart().get("id") + "_" + styles.graphOrder,

            stroke: border,

            fill: styles.fill,

            dimensions: styles.dimensions,

            xvalues: styles.xvalues,

            yvalues: styles.yvalues

        };

        cfg.fill.opacity = styles.fill.alpha;

        shape = this._getGroupShape(styles.shape);

        if(shape)

        {

            cfg.type = shape;

        }

        if(styles.hasOwnProperty("radius") && !isNaN(styles.radius))

        {

            cfg.dimensions.radius = styles.radius;

        }

        if(this._groupMarker)

        {

            this._groupMarker.destroy();

        }

        graphic = this.get("graphic");

        this._groupMarker = graphic.addShape(cfg);

        graphic._redraw();

    },

    /**

     * Toggles visibility

     *

     * @method _toggleVisible

     * @param {Boolean} visible indicates visibilitye

     * @private

     */

    _toggleVisible: function(visible)

    {

        var marker,

            markers = this.get("markers"),

            i = 0,

            len;

        if(markers)

        {

            len = markers.length;

            for(; i < len; ++i)

            {

                marker = markers[i];

                if(marker)

                {

                    marker.set("visible", visible);

                }

            }

        }

    },

    /**

     * Removes unused markers from the marker cache

     *

     * @method _clearMarkerCache

     * @private

     */

    _clearMarkerCache: function()

    {

        var marker;

        while(this._markerCache.length > 0)

        {

            marker = this._markerCache.shift();

            if(marker)

            {

                marker.destroy();

            }

        }

    },

    /**

     * Resizes and positions markers based on a mouse interaction.

     *

     * @method updateMarkerState

     * @param {String} type state of the marker

     * @param {Number} i index of the marker

     * @protected

     */

    updateMarkerState: function(type, i)

    {

        if(this._markers && this._markers[i])

        {

            var w,

                h,

                styles = this._copyObject(this.get("styles").marker),

                state = this._getState(type),

                xcoords = this.get("xcoords"),

                ycoords = this.get("ycoords"),

                marker = this._markers[i],

                markerStyles = state === "off" || !styles[state] ? styles : styles[state];

                markerStyles.fill.color = this._getItemColor(markerStyles.fill.color, i);

                markerStyles.border.color = this._getItemColor(markerStyles.border.color, i);

                markerStyles.stroke = markerStyles.border;

                marker.set(markerStyles);

                w = markerStyles.width;

                h = markerStyles.height;

                marker.set("x", (xcoords[i] - w/2));

                marker.set("y",  (ycoords[i] - h/2));

                marker.set("visible", this.get("visible"));

        }

    },

    /**

     * Parses a color from an array.

     *

     * @method _getItemColor

     * @param {Array} val collection of colors

     * @param {Number} i index of the item

     * @return String

     * @protected

     */

    _getItemColor: function(val, i)

    {

        if(Y_Lang.isArray(val))

        {

            return val[i % val.length];

        }

        return val;

    },

    /**

     * Method used by `styles` setter. Overrides base implementation.

     *

     * @method _setStyles

     * @param {Object} newStyles Hash of properties to update.

     * @return Object

     * @protected

     */

    _setStyles: function(val)

    {

        val = this._parseMarkerStyles(val);

        return Y.Renderer.prototype._setStyles.apply(this, [val]);

    },

    /**

     * Combines new styles with existing styles.

     *

     * @method _parseMarkerStyles

     * @param {Object} Object containing style properties for the marker.

     * @return Object

     * @private

     */

    _parseMarkerStyles: function(val)

    {

        if(val.marker)

        {

            var defs = this._getPlotDefaults();

            val.marker = this._mergeStyles(val.marker, defs);

            if(val.marker.over)

            {

                val.marker.over = this._mergeStyles(val.marker.over, val.marker);

            }

            if(val.marker.down)

            {

                val.marker.down = this._mergeStyles(val.marker.down, val.marker);

            }

        }

        return val;

    },

    /**

     * Returns marker state based on event type

     *

     * @method _getState

     * @param {String} type event type

     * @return String

     * @protected

     */

    _getState: function(type)

    {

        var state;

        switch(type)

        {

            case "mouseout" :

                state = "off";

            break;

            case "mouseover" :

                state = "over";

            break;

            case "mouseup" :

                state = "over";

            break;

            case "mousedown" :

                state = "down";

            break;

        }

        return state;

    },

    /**

     * @property _statSyles

     * @type Object

     * @private

     */

    _stateSyles: null,

    /**

     * @protected

     *

     * Draws the series.

     *

     * @method drawSeries

     */

    drawSeries: function()

    {

        this.drawPlots();

    },

    /**

     * @protected

     *

     * Gets the default value for the `styles` attribute. Overrides

     * base implementation.

     *

     * @method _getDefaultStyles

     * @return Object

     */

    _getDefaultStyles: function()

    {

        var styles = this._mergeStyles({marker:this._getPlotDefaults()}, this.constructor.superclass._getDefaultStyles());

        return styles;

    }

};

Y.augment(Plots, Y.Attribute);

Y.Plots = Plots;

}, '3.18.1');