Hopiu/fabric.js
1
0
Fork 0
mirror of https://github.com/Hopiu/fabric.js.git synced 2026-04-29 01:34:42 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

Doc fixes, Update README (1800+ unit tests)

Browse source
This commit is contained in:
Kienz 2013-08-08 18:31:26 +02:00
parent 2c6f6c27b4
commit 92bdebfde7
22 changed files with 72 additions and 20 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
README.md
View file

@ -12,7 +12,7 @@ Using Fabric.js, you can create and populate objects on canvas; objects like sim
### Goals
- Unit tested (1700+ tests at the moment)
- Unit tested (1800+ tests at the moment)
- Modular (~60 small "classes", modules, mixins)
- Cross-browser
- [Fast](https://github.com/kangax/fabric.js/wiki/Focus-on-speed)

15
src/color.class.js
View file

@ -278,6 +278,7 @@
* @static
* @field
* @memberOf fabric.Color
* @see: http://www.w3.org/TR/CSS2/syndata.html#color-units
*/
fabric.Color.colorNameMap = {
'aqua': '#00FFFF',
@ -317,8 +318,8 @@
/**
* Returns new color object, when given a color in RGB format
* @param {String} color ex: rgb(0-255,0-255,0-255)
* @memberOf fabric.Color
* @param {String} color ex: rgb(0-255,0-255,0-255)
* @return {fabric.Color}
*/
fabric.Color.fromRgb = function(color) {
@ -327,8 +328,8 @@
/**
* Returns array represenatation (ex: [100, 100, 200, 1]) of a color that's in RGB or RGBA format
* @param {String} color ex: rgb(0-255,0-255,0-255), rgb(0%-100%,0%-100%,0%-100%)
* @memberOf fabric.Color
* @param {String} color ex: rgb(0-255,0-255,0-255), rgb(0%-100%,0%-100%,0%-100%)
* @return {Array} source
*/
fabric.Color.sourceFromRgb = function(color) {
@ -351,8 +352,8 @@
* Returns new color object, when given a color in RGBA format
* @static
* @function
* @param {String} color
* @memberOf fabric.Color
* @param {String} color
* @return {fabric.Color}
*/
fabric.Color.fromRgba = Color.fromRgb;
@ -370,8 +371,8 @@
/**
* Returns array represenatation (ex: [100, 100, 200, 1]) of a color that's in HSL or HSLA format.
* Adapted from <a href="https://rawgithub.com/mjijackson/mjijackson.github.com/master/2008/02/rgb-to-hsl-and-rgb-to-hsv-color-model-conversion-algorithms-in-javascript.html">https://github.com/mjijackson</a>
* @param {String} color ex: hsl(0-360,0%-100%,0%-100%) or hsla(0-360,0%-100%,0%-100%, 0-1)
* @memberOf fabric.Color
* @param {String} color ex: hsl(0-360,0%-100%,0%-100%) or hsla(0-360,0%-100%,0%-100%, 0-1)
* @return {Array} source
* @see http://http://www.w3.org/TR/css3-color/#hsl-color
*/
@ -408,8 +409,8 @@
* Returns new color object, when given a color in HSLA format
* @static
* @function
* @param {String} color
* @memberOf fabric.Color
* @param {String} color
* @return {fabric.Color}
*/
fabric.Color.fromHsla = Color.fromHsl;
@ -427,8 +428,8 @@
/**
* Returns array represenatation (ex: [100, 100, 200, 1]) of a color that's in HEX format
* @static
* @param {String} color ex: FF5555
* @memberOf fabric.Color
* @param {String} color ex: FF5555
* @return {Array} source
*/
fabric.Color.sourceFromHex = function(color) {
@ -451,8 +452,8 @@
/**
* Returns new color object, when given color in array representation (ex: [200, 100, 100, 0.5])
* @static
* @param {Array} source
* @memberOf fabric.Color
* @param {Array} source
* @return {fabric.Color}
*/
fabric.Color.fromSource = function(source) {

4
src/gradient.class.js
View file

@ -220,6 +220,8 @@
* Returns {@link fabric.Gradient} instance from an SVG element
* @static
* @memberof fabric.Gradient
* @param {SVGGradientElement} el SVG gradient element
* @param {Object} instance
* @see http://www.w3.org/TR/SVG/pservers.html#LinearGradientElement
* @see http://www.w3.org/TR/SVG/pservers.html#RadialGradientElement
*/
@ -301,9 +303,9 @@
/**
* Returns {@link fabric.Gradient} instance from its object representation
* @static
* @memberof fabric.Gradient
* @param {Object} obj
* @param {Object} [options] Options object
* @memberof fabric.Gradient
*/
forObject: function(obj, options) {
options || (options = { });

1
src/mixins/animation.mixin.js
View file

@ -3,6 +3,7 @@ fabric.util.object.extend(fabric.StaticCanvas.prototype, /** @lends fabric.Stati
/**
* Animation duration (in ms) for fx* methods
* @type Number
* @default
*/
FX_DURATION: 500,

8
src/pattern.class.js
View file

@ -7,18 +7,21 @@ fabric.Pattern = fabric.util.createClass(/** @lends fabric.Pattern.prototype */
/**
* Repeat property of a pattern (one of repeat, repeat-x, repeat-y)
* @type String
* @default
*/
repeat: 'repeat',
/**
* Pattern horizontal offset from object's left/top corner
* @type Number
* @default
*/
offsetX: 0,
/**
* Pattern vertical offset from object's left/top corner
* @type Number
* @default
*/
offsetY: 0,
@ -65,7 +68,7 @@ fabric.Pattern = fabric.util.createClass(/** @lends fabric.Pattern.prototype */
/**
* Returns object representation of a pattern
* @return {Object}
* @return {Object} Object representation of a pattern instance
*/
toObject: function() {
@ -91,6 +94,7 @@ fabric.Pattern = fabric.util.createClass(/** @lends fabric.Pattern.prototype */
/* _TO_SVG_START_ */
/**
* Returns SVG representation of a pattern
* @param {Object} object
* @return {String} SVG representation of a pattern
*/
toSVG: function(object) {
@ -122,7 +126,7 @@ fabric.Pattern = fabric.util.createClass(/** @lends fabric.Pattern.prototype */
/**
* Returns an instance of CanvasPattern
* @param ctx
* @param {CanvasRenderingContext2D} ctx Context to create pattern
* @return {CanvasPattern}
*/
toLive: function(ctx) {

9
src/shadow.class.js
View file

@ -7,6 +7,7 @@ fabric.Shadow = fabric.util.createClass(/** @lends fabric.Shadow.prototype */ {
/**
* Shadow color
* @type String
* @default
*/
color: 'rgb(0,0,0)',
@ -19,24 +20,27 @@ fabric.Shadow = fabric.util.createClass(/** @lends fabric.Shadow.prototype */ {
/**
* Shadow horizontal offset
* @type Number
* @default
*/
offsetX: 0,
/**
* Shadow vertical offset
* @type Number
* @default
*/
offsetY: 0,
/**
* Whether the shadow should affect stroke operations
* @type Boolean
* @default
*/
affectStroke: false,
/**
* Constructor
* @param [options] Options object with any of color, blur, offsetX, offsetX properties
* @param {Object} [options] Options object with any of color, blur, offsetX, offsetX properties
* @return {fabric.Shadow} thisArg
*/
initialize: function(options) {
@ -50,6 +54,7 @@ fabric.Shadow = fabric.util.createClass(/** @lends fabric.Shadow.prototype */ {
/* _TO_SVG_START_ */
/**
* Returns SVG representation of a shadow
* @param {Object} object
* @return {String} SVG representation of a shadow
*/
toSVG: function(object) {
@ -75,7 +80,7 @@ fabric.Shadow = fabric.util.createClass(/** @lends fabric.Shadow.prototype */ {
/**
* Returns object representation of a shadow
* @return {Object}
* @return {Object} Object representation of a shadow instance
*/
toObject: function() {
return {

3
src/shapes/circle.class.js
View file

@ -125,6 +125,7 @@
/**
* List of attribute names to account for when parsing SVG element (used by {@link fabric.Circle.fromElement})
* @static
* @memberOf fabric.Circle
* @see: http://www.w3.org/TR/SVG/shapes.html#CircleElement
*/
fabric.Circle.ATTRIBUTE_NAMES = fabric.SHARED_ATTRIBUTES.concat('cx cy r'.split(' '));
@ -132,6 +133,7 @@
/**
* Returns {@link fabric.Circle} instance from an SVG element
* @static
* @memberOf fabric.Circle
* @param {SVGElement} element Element to parse
* @param {Object} [options] Options object
* @throws {Error} If value of `r` attribute is missing or invalid
@ -168,6 +170,7 @@
/**
* Returns {@link fabric.Circle} instance from an object representation
* @static
* @memberOf fabric.Circle
* @param {Object} object Object to create an instance from
* @return {Object} Instance of fabric.Circle
*/

3
src/shapes/ellipse.class.js
View file

@ -133,6 +133,7 @@
/**
* List of attribute names to account for when parsing SVG element (used by {@link fabric.Ellipse.fromElement})
* @static
* @memberOf fabric.Ellipse
* @see http://www.w3.org/TR/SVG/shapes.html#EllipseElement
*/
fabric.Ellipse.ATTRIBUTE_NAMES = fabric.SHARED_ATTRIBUTES.concat('cx cy rx ry'.split(' '));
@ -140,6 +141,7 @@
/**
* Returns {@link fabric.Ellipse} instance from an SVG element
* @static
* @memberOf fabric.Ellipse
* @param {SVGElement} element Element to parse
* @param {Object} [options] Options object
* @return {fabric.Ellipse}
@ -170,6 +172,7 @@
/**
* Returns {@link fabric.Ellipse} instance from an object representation
* @static
* @memberOf fabric.Ellipse
* @param {Object} object Object to create an instance from
* @return {fabric.Ellipse}
*/

3
src/shapes/group.class.js
View file

@ -433,6 +433,7 @@
/**
* Returns {@link fabric.Group} instance from an object representation
* @static
* @memberOf fabric.Group
* @param {Object} object Object to create a group from
* @param {Object} [options] Options object
* @return {fabric.Group} An instance of fabric.Group
@ -447,7 +448,9 @@
/**
* Indicates that instances of this type are async
* @static
* @memberOf fabric.Group
* @type Boolean
* @default
*/
fabric.Group.async = true;

2
src/shapes/image.class.js
View file

@ -472,6 +472,7 @@
* Indicates that instances of this type are async
* @static
* @type Boolean
* @default
*/
fabric.Image.async = true;
@ -479,6 +480,7 @@
* Indicates compression level used when generating PNG under Node (in applyFilters)
* @static
* @type Number [0-9]
* @default
*/
fabric.Image.pngCompression = 1;

3
src/shapes/line.class.js
View file

@ -181,6 +181,7 @@
/**
* List of attribute names to account for when parsing SVG element (used by {@link fabric.Line.fromElement})
* @static
* @memberOf fabric.Line
* @see http://www.w3.org/TR/SVG/shapes.html#LineElement
*/
fabric.Line.ATTRIBUTE_NAMES = fabric.SHARED_ATTRIBUTES.concat('x1 y1 x2 y2'.split(' '));
@ -188,6 +189,7 @@
/**
* Returns fabric.Line instance from an SVG element
* @static
* @memberOf fabric.Line
* @param {SVGElement} element Element to parse
* @param {Object} [options] Options object
* @return {fabric.Line} instance of fabric.Line
@ -207,6 +209,7 @@
/**
* Returns fabric.Line instance from an object representation
* @static
* @memberOf fabric.Line
* @param {Object} object Object to create an instance from
* @return {fabric.Line} instance of fabric.Line
*/

4
src/shapes/object.class.js
View file

@ -217,6 +217,7 @@
/**
* Shadow object representing shadow of this shape
* @type fabric.Shadow
* @default
*/
shadow: null,
@ -1127,6 +1128,7 @@
/**
* Alias for {@link fabric.Object.prototype.setAngle}
* @alias rotate -> setAngle
* @memberof fabric.Object
*/
fabric.Object.prototype.rotate = fabric.Object.prototype.setAngle;
@ -1135,6 +1137,7 @@
/**
* Defines the number of fraction digits when serializing object values. You can use it to increase/decrease precision of such values like left, top, scaleX, scaleY, etc.
* @static
* @memberof fabric.Object
* @constant
* @type Number
*/
@ -1142,6 +1145,7 @@
/**
* @static
* @memberof fabric.Object
* @type Number
*/
fabric.Object.__uid = 0;

5
src/shapes/path.class.js
View file

@ -672,6 +672,7 @@
/**
* Creates an instance of fabric.Path from an object
* @static
* @memberOf fabric.Path
* @param {Object} object
* @param {Function} callback Callback to invoke when an fabric.Path instance is created
*/
@ -698,6 +699,7 @@
/**
* List of attribute names to account for when parsing SVG element (used by `fabric.Path.fromElement`)
* @static
* @memberOf fabric.Path
* @see http://www.w3.org/TR/SVG/paths.html#PathElement
*/
fabric.Path.ATTRIBUTE_NAMES = fabric.SHARED_ATTRIBUTES.concat(['d']);
@ -705,6 +707,7 @@
/**
* Creates an instance of fabric.Path from an SVG <path> element
* @static
* @memberOf fabric.Path
* @param {SVGElement} element to parse
* @param {Function} callback Callback to invoke when an fabric.Path instance is created
* @param {Object} [options] Options object
@ -718,7 +721,9 @@
/**
* Indicates that instances of this type are async
* @static
* @memberOf fabric.Path
* @type Boolean
* @default
*/
fabric.Path.async = true;

3
src/shapes/path_group.class.js
View file

@ -208,6 +208,7 @@
/**
* Creates fabric.PathGroup instance from an object representation
* @static
* @memberOf fabric.PathGroup
* @param {Object} object
* @param {Function} callback Callback to invoke when an fabric.PathGroup instance is created
*/
@ -234,7 +235,9 @@
/**
* Indicates that instances of this type are async
* @static
* @memberOf fabric.PathGroup
* @type Boolean
* @default
*/
fabric.PathGroup.async = true;

3
src/shapes/polygon.class.js
View file

@ -155,6 +155,7 @@
/**
* List of attribute names to account for when parsing SVG element (used by `fabric.Polygon.fromElement`)
* @static
* @memberOf fabric.Polygon
* @see: http://www.w3.org/TR/SVG/shapes.html#PolygonElement
*/
fabric.Polygon.ATTRIBUTE_NAMES = fabric.SHARED_ATTRIBUTES.concat();
@ -162,6 +163,7 @@
/**
* Returns {@link fabric.Polygon} instance from an SVG element
* @static
* @memberOf fabric.Polygon
* @param {SVGElement} element Element to parse
* @param {Object} [options] Options object
* @return {fabric.Polygon} Instance of fabric.Polygon
@ -193,6 +195,7 @@
/**
* Returns fabric.Polygon instance from an object representation
* @static
* @memberOf fabric.Polygon
* @param object {Object} object Object to create an instance from
* @return {fabric.Polygon} Instance of fabric.Polygon
*/

3
src/shapes/polyline.class.js
View file

@ -126,6 +126,7 @@
/**
* List of attribute names to account for when parsing SVG element (used by {@link fabric.Polyline.fromElement})
* @static
* @memberOf fabric.Polyline
* @see: http://www.w3.org/TR/SVG/shapes.html#PolylineElement
*/
fabric.Polyline.ATTRIBUTE_NAMES = fabric.SHARED_ATTRIBUTES.concat();
@ -133,6 +134,7 @@
/**
* Returns fabric.Polyline instance from an SVG element
* @static
* @memberOf fabric.Polyline
* @param {SVGElement} element Element to parse
* @param {Object} [options] Options object
* @return {fabric.Polyline} Instance of fabric.Polyline
@ -164,6 +166,7 @@
/**
* Returns fabric.Polyline instance from an object representation
* @static
* @memberOf fabric.Polyline
* @param object {Object} object Object to create an instance from
* @return {fabric.Polyline} Instance of fabric.Polyline
*/

4
src/shapes/rect.class.js
View file

@ -210,6 +210,8 @@
/**
* List of attribute names to account for when parsing SVG element (used by `fabric.Rect.fromElement`)
* @static
* @memberOf fabric.Rect
* @see: http://www.w3.org/TR/SVG/shapes.html#RectElement
*/
fabric.Rect.ATTRIBUTE_NAMES = fabric.SHARED_ATTRIBUTES.concat('x y rx ry width height'.split(' '));
@ -225,6 +227,7 @@
/**
* Returns {@link fabric.Rect} instance from an SVG element
* @static
* @memberOf fabric.Rect
* @param {SVGElement} element Element to parse
* @param {Object} [options] Options object
* @return {fabric.Rect} Instance of fabric.Rect
@ -247,6 +250,7 @@
/**
* Returns {@link fabric.Rect} instance from an object representation
* @static
* @memberOf fabric.Rect
* @param object {Object} object to create an instance from
* @return {Object} instance of fabric.Rect
*/

5
src/shapes/text.class.js
View file

@ -893,6 +893,8 @@
/**
* List of attribute names to account for when parsing SVG element (used by {@link fabric.Text.fromElement})
* @static
* @memberOf fabric.Text
* @see: http://www.w3.org/TR/SVG/text.html#TextElement
*/
fabric.Text.ATTRIBUTE_NAMES = fabric.SHARED_ATTRIBUTES.concat(
'x y font-family font-style font-weight font-size text-decoration'.split(' '));
@ -900,12 +902,12 @@
/**
* Returns fabric.Text instance from an SVG element (<b>not yet implemented</b>)
* @static
* @memberOf fabric.Text
* @param {SVGElement} element Element to parse
* @param {Object} [options] Options object
* @return {fabric.Text} Instance of fabric.Text
*/
fabric.Text.fromElement = function(element, options) {
if (!element) {
return null;
}
@ -933,6 +935,7 @@
/**
* Returns fabric.Text instance from an object representation
* @static
* @memberOf fabric.Text
* @param object {Object} object Object to create an instance from
* @return {fabric.Text} Instance of fabric.Text
*/

1
src/shapes/triangle.class.js
View file

@ -111,6 +111,7 @@
/**
* Returns fabric.Triangle instance from an object representation
* @static
* @memberOf fabric.Triangle
* @param object {Object} object to create an instance from
* @return {Object} instance of Canvas.Triangle
*/

1
src/static_canvas.class.js
View file

@ -1004,6 +1004,7 @@
/**
* @static
* @type String
* @default
*/
EMPTY_JSON: '{"objects": [], "background": "white"}',

6
src/util/dom_event.js
View file

@ -147,9 +147,8 @@
/**
* Adds an event listener to an element
* @mthod addListener
* @memberOf fabric.util
* @function
* @memberOf fabric.util
* @param {HTMLElement} element
* @param {String} eventName
* @param {Function} handler
@ -158,9 +157,8 @@
/**
* Removes an event listener from an element
* @mthod removeListener
* @memberOf fabric.util
* @function
* @memberOf fabric.util
* @param {HTMLElement} element
* @param {String} eventName
* @param {Function} handler

4
src/util/lang_class.js
View file

@ -56,11 +56,11 @@
}
/**
* Helper for creation of "classes". Note that pr
* Helper for creation of "classes".
* @memberOf fabric.util
* @param parent optional "Class" to inherit from
* @param properties Properties shared by all instances of this class
* (be careful modifying objects defined here as this would affect all instances)
* @memberOf fabric.util
*/
function createClass() {
var parent = null,