diff -r 322d0feea350 -r 89ef5ed3c48b src/cm/media/js/lib/yui/yui_3.10.3/build/graphics/graphics.js --- /dev/null Thu Jan 01 00:00:00 1970 +0000 +++ b/src/cm/media/js/lib/yui/yui_3.10.3/build/graphics/graphics.js Tue Jul 16 14:29:46 2013 +0200 @@ -0,0 +1,1202 @@ +/* +YUI 3.10.3 (build 2fb5187) +Copyright 2013 Yahoo! Inc. All rights reserved. +Licensed under the BSD License. +http://yuilibrary.com/license/ +*/ + +YUI.add('graphics', function (Y, NAME) { + +/** + * + *
The `Graphics` module provides a JavaScript API for creating shapes in a variety of formats across + * a browser test baseline. + * Based on device and browser capabilities, `Graphics` leverages SVG, + * Canvas and VML + * to render its graphical elements.
+ * + *The `Graphics` module features a `Graphic` class that allows you to easily create and manage shapes. + * Currently, a `Graphic` instance can be used to create predifined shapes and free-form polygons with fill + * and stroke properties.
+ * + *The `Graphics` module normalizes an API through the use of alias and implementation classes that share + * interfaces. Each alias class points to an appropriate implementation class dependent on the browser's + * capabilities. There should rarely, if ever, be a need to interact directly with an implementation class.
+ * + *Below is a list of available classes. + *
+ * You can also extend the `Shape` class to create your own custom shape classes. + * @module graphics + * @main graphics + */ +var SETTER = "setter", + PluginHost = Y.Plugin.Host, + VALUE = "value", + VALUEFN = "valueFn", + READONLY = "readOnly", + Y_LANG = Y.Lang, + STR = "string", + WRITE_ONCE = "writeOnce", + GraphicBase, + AttributeLite; + + /** + * AttributeLite provides Attribute-like getters and setters for shape classes in the Graphics module. + * It provides a get/set API without the event infastructure. This class is temporary and a work in progress. + * + * @class AttributeLite + * @constructor + */ + AttributeLite = function() + { + var host = this; // help compression + + // Perf tweak - avoid creating event literals if not required. + host._ATTR_E_FACADE = {}; + + Y.EventTarget.call(this, {emitFacade:true}); + host._state = {}; + host.prototype = Y.mix(AttributeLite.prototype, host.prototype); + }; + + AttributeLite.prototype = { + /** + * Initializes the attributes for a shape. If an attribute config is passed into the constructor of the host, + * the initial values will be overwritten. + * + * @method addAttrs + * @param {Object} cfg Optional object containing attributes key value pairs to be set. + */ + addAttrs: function(cfg) + { + var host = this, + attrConfig = this.constructor.ATTRS, + attr, + i, + fn, + state = host._state; + for(i in attrConfig) + { + if(attrConfig.hasOwnProperty(i)) + { + attr = attrConfig[i]; + if(attr.hasOwnProperty(VALUE)) + { + state[i] = attr.value; + } + else if(attr.hasOwnProperty(VALUEFN)) + { + fn = attr.valueFn; + if(Y_LANG.isString(fn)) + { + state[i] = host[fn].apply(host); + } + else + { + state[i] = fn.apply(host); + } + } + } + } + host._state = state; + for(i in attrConfig) + { + if(attrConfig.hasOwnProperty(i)) + { + attr = attrConfig[i]; + if(attr.hasOwnProperty(READONLY) && attr.readOnly) + { + continue; + } + + if(attr.hasOwnProperty(WRITE_ONCE) && attr.writeOnce) + { + attr.readOnly = true; + } + + if(cfg && cfg.hasOwnProperty(i)) + { + if(attr.hasOwnProperty(SETTER)) + { + host._state[i] = attr.setter.apply(host, [cfg[i]]); + } + else + { + host._state[i] = cfg[i]; + } + } + } + } + }, + + /** + * For a given item, returns the value of the property requested, or undefined if not found. + * + * @method get + * @param name {String} The name of the item + * @return {Any} The value of the supplied property. + */ + get: function(attr) + { + var host = this, + getter, + attrConfig = host.constructor.ATTRS; + if(attrConfig && attrConfig[attr]) + { + getter = attrConfig[attr].getter; + if(getter) + { + if(typeof getter === STR) + { + return host[getter].apply(host); + } + return attrConfig[attr].getter.apply(host); + } + + return host._state[attr]; + } + return null; + }, + + /** + * Sets the value of an attribute. + * + * @method set + * @param {String|Object} name The name of the attribute. Alternatively, an object of key value pairs can + * be passed in to set multiple attributes at once. + * @param {Any} value The value to set the attribute to. This value is ignored if an object is received as + * the name param. + */ + set: function() + { + var attr = arguments[0], + i; + if(Y_LANG.isObject(attr)) + { + for(i in attr) + { + if(attr.hasOwnProperty(i)) + { + this._set(i, attr[i]); + } + } + } + else + { + this._set.apply(this, arguments); + } + }, + + /** + * Provides setter logic. Used by `set`. + * + * @method _set + * @param {String|Object} name The name of the attribute. Alternatively, an object of key value pairs can + * be passed in to set multiple attributes at once. + * @param {Any} value The value to set the attribute to. This value is ignored if an object is received as + * the name param. + * @protected + */ + _set: function(attr, val) + { + var host = this, + setter, + args, + attrConfig = host.constructor.ATTRS; + if(attrConfig && attrConfig.hasOwnProperty(attr)) + { + setter = attrConfig[attr].setter; + if(setter) + { + args = [val]; + if(typeof setter === STR) + { + val = host[setter].apply(host, args); + } + else + { + val = attrConfig[attr].setter.apply(host, args); + } + } + host._state[attr] = val; + } + } + }; + Y.mix(AttributeLite, Y.EventTarget, false, null, 1); + Y.AttributeLite = AttributeLite; + + /** + * GraphicBase serves as the base class for the graphic layer. It serves the same purpose as + * Base but uses a lightweight getter/setter class instead of Attribute. + * This class is temporary and a work in progress. + * + * @class GraphicBase + * @constructor + * @param {Object} cfg Key value pairs for attributes + */ + GraphicBase = function(cfg) + { + var host = this, + PluginHost = Y.Plugin && Y.Plugin.Host; + if (host._initPlugins && PluginHost) { + PluginHost.call(host); + } + + host.name = host.constructor.NAME; + host._eventPrefix = host.constructor.EVENT_PREFIX || host.constructor.NAME; + AttributeLite.call(host); + host.addAttrs(cfg); + host.init.apply(this, arguments); + if (host._initPlugins) { + // Need to initPlugins manually, to handle constructor parsing, static Plug parsing + host._initPlugins(cfg); + } + host.initialized = true; + }; + + GraphicBase.NAME = "baseGraphic"; + + GraphicBase.prototype = { + /** + * Init method, invoked during construction. + * Fires an init event after calling `initializer` on implementers. + * + * @method init + * @protected + */ + init: function() + { + this.publish("init", { + fireOnce:true + }); + this.initializer.apply(this, arguments); + this.fire("init", {cfg: arguments[0]}); + }, + + /** + * Camel case concatanates two strings. + * + * @method _camelCaseConcat + * @param {String} prefix The first string + * @param {String} name The second string + * @return String + * @private + */ + _camelCaseConcat: function(prefix, name) + { + return prefix + name.charAt(0).toUpperCase() + name.slice(1); + } + }; +//Straightup augment, no wrapper functions +Y.mix(GraphicBase, Y.AttributeLite, false, null, 1); +Y.mix(GraphicBase, PluginHost, false, null, 1); +GraphicBase.prototype.constructor = GraphicBase; +GraphicBase.plug = PluginHost.plug; +GraphicBase.unplug = PluginHost.unplug; +Y.GraphicBase = GraphicBase; + + +/** + * `Drawing` provides a set of drawing methods used by `Path` and custom shape classes. + * `Drawing` has the following implementations based on browser capability. + *Base class for creating shapes.
+ *`Shape` is an abstract class and is not meant to be used directly. The following classes extend + * `Shape`. + * + *
+ * + * `Shape` can also be extended to create custom shape classes. + * + * `Shape` has the following implementations based on browser capability. + *A string containing, in order, transform operations applied to the shape instance. The `transform` string can contain the following values: + * + *
Applying transforms through the transform attribute will reset the transform matrix and apply a new transform. The shape class also contains + * corresponding methods for each transform that will apply the transform to the current matrix. The below code illustrates how you might use the + * `transform` attribute to instantiate a recangle with a rotation of 45 degrees.
+ var myRect = new Y.Rect({ + type:"rect", + width: 50, + height: 40, + transform: "rotate(45)" + }; + *The code below would apply `translate` and `rotate` to an existing shape.
+ + myRect.set("transform", "translate(40, 50) rotate(45)"); + * @config transform + * @type String + */ + /** + * Unique id for class instance. + * + * @config id + * @type String + */ + /** + * Indicates the x position of shape. + * + * @config x + * @type Number + */ + /** + * Indicates the y position of shape. + * + * @config y + * @type Number + */ + /** + * Indicates the width of the shape + * + * @config width + * @type Number + */ + /** + * Indicates the height of the shape + * + * @config height + * @type Number + */ + /** + * Indicates whether the shape is visible. + * + * @config visible + * @type Boolean + */ + /** + * Contains information about the fill of the shape. + *If a `linear` or `radial` is specified as the fill type. The following additional property is used: + *
Linear gradients also have the following property:
+ *Radial gradients have the following additional properties:
+ *The x-coordinate of the center of the gradient circle. Determines where the color stop begins. The default value 0.5.
+ *Note: Currently, this property is not implemented for corresponding `CanvasShape` and + * `VMLShape` classes which are used on Android or IE 6 - 8.
+ *The y-coordinate of the center of the gradient circle. Determines where the color stop begins. The default value 0.5.
+ *Note: Currently, this property is not implemented for corresponding `CanvasShape` and `VMLShape` + * classes which are used on Android or IE 6 - 8.
+ *Creates circle shape with editable attributes.
+ *`Circle` instances can be created using the `addShape` method of the + * `Graphic` class. The method's `cfg` argument contains a `type` attribute. Assigning "circle" + * or `Y.Circle` to this attribute will create a `Circle` instance. Required attributes for instantiating a `Circle` are + * `type` and `radius`. Optional attributes include: + *
+ * + * The below code creates a circle by defining the `type` attribute as "circle": + + var myCircle = myGraphic.addShape({ + type: "circle", + radius: 10, + fill: { + color: "#9aa" + }, + stroke: { + weight: 1, + color: "#000" + } + }); + + * Below, this same circle is created by defining the `type` attribute with a class reference: + * + var myCircle = myGraphic.addShape({ + type: Y.Circle, + radius: 10, + fill: { + color: "#9aa" + }, + stroke: { + weight: 1, + color: "#000" + } + }); + * + *`Circle` has the following implementations based on browser capability. + *
Creates an ellipse shape with editable attributes.
+ *`Ellipse` instances can be created using the `addShape` method of the + * `Graphic` class. The method's `cfg` argument contains a `type` attribute. Assigning "ellipse" + * or `Y.Ellipse` to this attribute will create a `Ellipse` instance. Required attributes for instantiating a `Ellipse` are + * `type`, `width` and `height`. Optional attributes include: + *
+ * + * The below code creates an ellipse by defining the `type` attribute as "ellipse": + + var myEllipse = myGraphic.addShape({ + type: "ellipse", + width: 20, + height: 10, + fill: { + color: "#9aa" + }, + stroke: { + weight: 1, + color: "#000" + } + }); + + * Below, the same ellipse is created by defining the `type` attribute with a class reference: + * + var myEllipse = myGraphic.addShape({ + type: Y.Ellipse, + width: 20, + height: 10, + fill: { + color: "#9aa" + }, + stroke: { + weight: 1, + color: "#000" + } + }); + * + *`Ellipse` has the following implementations based on browser capability. + *
Creates an rectangle shape with editable attributes.
+ *`Rect` instances can be created using the `addShape` method of the + * `Graphic` class. The method's `cfg` argument contains a `type` attribute. Assigning "rect" + * or `Y.Rect` to this attribute will create a `Rect` instance. Required attributes for instantiating a `Rect` are `type`, + * `width` and `height`. Optional attributes include: + *
+ * + * The below code creates a rectangle by defining the `type` attribute as "rect": + + var myRect = myGraphic.addShape({ + type: "rect", + width: 20, + height: 10, + fill: { + color: "#9aa" + }, + stroke: { + weight: 1, + color: "#000" + } + }); + + * Below, the same rectangle is created by defining the `type` attribute with a class reference: + * + var myRect = myGraphic.addShape({ + type: Y.Rect, + width: 20, + height: 10, + fill: { + color: "#9aa" + }, + stroke: { + weight: 1, + color: "#000" + } + }); + * + *`Rect` has the following implementations based on browser capability. + *
The `Path` class creates a shape through the use of drawing methods. The `Path` class has the following drawing methods available:
+ *Like other shapes, `Path` elements are created using the `addShape` + * method of the `Graphic` class. The method's `cfg` argument contains a `type` attribute. + * Assigning "path" or `Y.Path` to this attribute will create a `Path` instance. After instantiation, a series of drawing + * operations must be performed in order to render a shape. The below code instantiates a path element by defining the + * `type` attribute as "path":
+ + var myPath = myGraphic.addShape({ + type: "path", + fill: { + color: "#9aa" + }, + stroke: { + weight: 1, + color: "#000" + } + }); + + * Below a `Path` element with the same properties is instantiated by defining the `type` attribute with a class reference: + * + var myPath = myGraphic.addShape({ + type: Y.Path, + fill: { + color: "#9aa" + }, + stroke: { + weight: 1, + color: "#000" + } + }); + + * After instantiation, a shape or segment needs to be drawn for an element to render. After all draw operations are performed, + * the `end` method will render the shape. The code below will draw a triangle: + + myPath.moveTo(35, 5); + myPath.lineTo(65, 65); + myPath.lineTo(5, 65); + myPath.lineTo(35, 5); + myPath.end(); + * + *`Path` has the following implementations based on browser capability. + *
The code block below creates a `Graphic` instance and appends it to an HTMLElement with the id 'mygraphiccontainer'.
+ + var myGraphic = new Y.Graphic({render:"#mygraphiccontainer"}); + + *Alternatively, you can add a `Graphic` instance to the DOM using the `render` method.
+ var myGraphic = new Y.Graphic(); + myGraphic.render("#mygraphiccontainer"); + + * `Graphic` has the following implementations based on browser capability. + *width and height attributes or are determined by the dimensions of the parent element. The
+ * content contained in the Graphic will be sized to fit with in the Graphic instance's dimensions. When using this
+ * setting, the preserveAspectRatio attribute will determine how the contents are sized.width
+ * and height attributes or are determined by the dimensions of the parent element. The contents of the
+ * Graphic instance are not affected by this setting.autoSize is set to sizeContentToGraphic.
+ *
+ * Generates a shape instance by type. The method accepts an object that contain's the shape's + * type and attributes to be customized. For example, the code below would create a rectangle:
+ * + var myRect = myGraphic.addShape({ + type: "rect", + width: 40, + height: 30, + fill: { + color: "#9aa" + }, + stroke: { + weight: 1, + color: "#000" + } + }); + * + *The `Graphics` module includes a few basic shapes. More information on their creation + * can be found in each shape's documentation: + * + *
+ * + * The `Graphics` module also allows for the creation of custom shapes. If a custom shape + * has been created, it can be instantiated with the `addShape` method as well. The attributes, + * required and optional, would need to be defined in the custom shape. + * + var myCustomShape = myGraphic.addShape({ + type: Y.MyCustomShape, + width: 50, + height: 50, + fill: { + color: "#9aa" + }, + stroke: { + weight: 1, + color: "#000" + } + }); + * + * @method addShape + * @param {Object} cfg Object containing the shape's type and attributes. + * @return Shape + */ + /** + * Removes a shape instance from from the graphic instance. + * + * @method removeShape + * @param {Shape|String} shape The instance or id of the shape to be removed. + */ + /** + * Removes all shape instances from the dom. + * + * @method removeAllShapes + */ + /** + * Returns a shape based on the id of its dom node. + * + * @method getShapeById + * @param {String} id Dom id of the shape's node attribute. + * @return Shape + */ + /** + * Allows for creating multiple shapes in order to batch appending and redraw operations. + * + * @method batch + * @param {Function} method Method to execute. + */ + + +}, '3.10.3', {"requires": ["node", "event-custom", "pluginhost", "matrix", "classnamemanager"]});