mirror of
https://github.com/Hopiu/fabric.js.git
synced 2026-03-16 22:10:32 +00:00
Replace $w with split(' ') (to remove dependency on global, non-descriptive variable and Prototype in general). Add few missing console.warn statements when double initialization is attempted.
This commit is contained in:
parent
e1d036de71
commit
fcb2877557
16 changed files with 52 additions and 38 deletions
|
|
@ -72,7 +72,7 @@
|
|||
/**
|
||||
* @see: http://www.w3.org/TR/SVG/shapes.html#CircleElement
|
||||
*/
|
||||
Canvas.Circle.ATTRIBUTE_NAMES = $w('cx cy r fill fill-opacity stroke stroke-width transform');
|
||||
Canvas.Circle.ATTRIBUTE_NAMES = 'cx cy r fill fill-opacity stroke stroke-width transform'.split(' ');
|
||||
|
||||
/**
|
||||
* @static
|
||||
|
|
|
|||
|
|
@ -10,6 +10,7 @@
|
|||
Canvas = global.Canvas || (global.Canvas = { });
|
||||
|
||||
if (Canvas.Element) {
|
||||
console.warn('Canvas.Element is already defined.');
|
||||
return;
|
||||
}
|
||||
|
||||
|
|
@ -44,8 +45,8 @@
|
|||
if (!el.getContext) {
|
||||
return;
|
||||
}
|
||||
var ctx = el.getContext('2d');
|
||||
|
||||
var ctx = el.getContext('2d');
|
||||
if (!ctx) {
|
||||
return;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -80,7 +80,7 @@
|
|||
}
|
||||
});
|
||||
|
||||
Canvas.Ellipse.ATTRIBUTE_NAMES = $w('cx cy rx ry fill fill-opacity stroke stroke-width transform');
|
||||
Canvas.Ellipse.ATTRIBUTE_NAMES = 'cx cy rx ry fill fill-opacity stroke stroke-width transform'.split(' ');
|
||||
|
||||
/**
|
||||
* @static
|
||||
|
|
|
|||
|
|
@ -102,7 +102,7 @@
|
|||
return {
|
||||
width: element.width,
|
||||
height: element.height
|
||||
}
|
||||
};
|
||||
},
|
||||
|
||||
/**
|
||||
|
|
@ -178,7 +178,9 @@
|
|||
*/
|
||||
toGrayscale: function(callback) {
|
||||
|
||||
if (this.__isGrayscaled) return;
|
||||
if (this.__isGrayscaled) {
|
||||
return;
|
||||
}
|
||||
|
||||
var imgEl = this.getElement(),
|
||||
canvasEl = document.createElement('canvas'),
|
||||
|
|
@ -304,8 +306,9 @@
|
|||
* @static
|
||||
*/
|
||||
Canvas.Image.fromObject = function(object, callback) {
|
||||
var img = document.createElement('img');
|
||||
var src = object.src;
|
||||
var img = document.createElement('img'),
|
||||
src = object.src;
|
||||
|
||||
if (object.width) {
|
||||
img.width = object.width;
|
||||
}
|
||||
|
|
@ -317,7 +320,7 @@
|
|||
callback(new Canvas.Image(img, object));
|
||||
}
|
||||
img = img.onload = null;
|
||||
}
|
||||
};
|
||||
img.src = src;
|
||||
};
|
||||
|
||||
|
|
|
|||
|
|
@ -70,7 +70,7 @@
|
|||
});
|
||||
|
||||
// http://www.w3.org/TR/SVG/shapes.html#LineElement
|
||||
Canvas.Element.ATTRIBUTE_NAMES = $w('x1 y1 x2 y2 stroke stroke-width transform');
|
||||
Canvas.Element.ATTRIBUTE_NAMES = 'x1 y1 x2 y2 stroke stroke-width transform'.split(' ');
|
||||
|
||||
/**
|
||||
* @static
|
||||
|
|
|
|||
|
|
@ -45,9 +45,9 @@
|
|||
/**
|
||||
* @field
|
||||
*/
|
||||
stateProperties: $w('top left width height scaleX scaleY flipX flipY ' +
|
||||
'theta angle opacity cornersize fill overlayFill stroke ' +
|
||||
'strokeWidth fillRule borderScaleFactor transformMatrix'),
|
||||
stateProperties: ('top left width height scaleX scaleY flipX flipY ' +
|
||||
'theta angle opacity cornersize fill overlayFill stroke ' +
|
||||
'strokeWidth fillRule borderScaleFactor transformMatrix').split(' '),
|
||||
|
||||
/**
|
||||
* @field
|
||||
|
|
|
|||
|
|
@ -1,15 +1,12 @@
|
|||
(function(){
|
||||
|
||||
var global = this;
|
||||
var Canvas = this.Canvas || (this.Canvas = { });
|
||||
|
||||
if (!global.Canvas) {
|
||||
global.Canvas = { };
|
||||
}
|
||||
if (global.Canvas.Path) {
|
||||
if (Canvas.Path) {
|
||||
console.warn('Canvas.Path is already defined');
|
||||
return;
|
||||
}
|
||||
if (!global.Canvas.Object) {
|
||||
if (!Canvas.Object) {
|
||||
console.warn('Canvas.Path requires Canvas.Object');
|
||||
return;
|
||||
}
|
||||
|
|
@ -453,7 +450,7 @@
|
|||
return new Canvas.Path(object.path, object);
|
||||
};
|
||||
|
||||
var ATTRIBUTE_NAMES = Canvas.Path.ATTRIBUTE_NAMES = $w('d fill fill-opacity fill-rule stroke stroke-width transform');
|
||||
var ATTRIBUTE_NAMES = Canvas.Path.ATTRIBUTE_NAMES = 'd fill fill-opacity fill-rule stroke stroke-width transform'.split(' ');
|
||||
/**
|
||||
* Creates an instance of Canvas.Path from an SVG <PATH> element
|
||||
* @static
|
||||
|
|
|
|||
|
|
@ -2,6 +2,7 @@
|
|||
|
||||
var Canvas = this.Canvas || (this.Canvas = { });
|
||||
if (Canvas.PathGroup) {
|
||||
console.warn('Canvas.PathGroup is already defined');
|
||||
return;
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -2,8 +2,7 @@
|
|||
|
||||
/* Adaptation of work of Kevin Lindsey (kevin@kevlindev.com) */
|
||||
|
||||
var global = this;
|
||||
var Canvas = global.Canvas || (global.Canvas = { });
|
||||
var Canvas = this.Canvas || (this.Canvas = { });
|
||||
|
||||
if (Canvas.Point) {
|
||||
console.warn('Canvas.Point is already defined');
|
||||
|
|
|
|||
|
|
@ -1,7 +1,9 @@
|
|||
(function(){
|
||||
|
||||
var Canvas = this.Canvas || (this.Canvas = { });
|
||||
|
||||
if (Canvas.Polygon) {
|
||||
console.warn('Canvas.Polygon is already defined');
|
||||
return;
|
||||
}
|
||||
|
||||
|
|
@ -100,7 +102,7 @@
|
|||
});
|
||||
|
||||
// http://www.w3.org/TR/SVG/shapes.html#PolygonElement
|
||||
Canvas.Polygon.ATTRIBUTE_NAMES = $w('fill fill-opacity stroke stroke-width transform');
|
||||
Canvas.Polygon.ATTRIBUTE_NAMES = 'fill fill-opacity stroke stroke-width transform'.split(' ');
|
||||
|
||||
/**
|
||||
* @static
|
||||
|
|
@ -110,9 +112,12 @@
|
|||
* @return {Object} instance of Canvas.Polygon
|
||||
*/
|
||||
Canvas.Polygon.fromElement = function(element, options) {
|
||||
if (!element) return null;
|
||||
if (!element) {
|
||||
return null;
|
||||
}
|
||||
var points = Canvas.parsePointsAttribute(element.getAttribute('points')),
|
||||
parsedAttributes = Canvas.parseAttributes(element, Canvas.Polygon.ATTRIBUTE_NAMES);
|
||||
|
||||
return new Canvas.Polygon(points, Object.extend(parsedAttributes, options));
|
||||
};
|
||||
|
||||
|
|
|
|||
|
|
@ -1,7 +1,9 @@
|
|||
(function(){
|
||||
|
||||
var Canvas = this.Canvas || (this.Canvas = { });
|
||||
|
||||
if (Canvas.Polyline) {
|
||||
console.warn('Canvas.Polyline is already defined');
|
||||
return;
|
||||
}
|
||||
|
||||
|
|
@ -78,7 +80,7 @@
|
|||
});
|
||||
|
||||
// http://www.w3.org/TR/SVG/shapes.html#PolylineElement
|
||||
var ATTRIBUTE_NAMES = $w('fill fill-opacity stroke stroke-width transform');
|
||||
var ATTRIBUTE_NAMES = 'fill fill-opacity stroke stroke-width transform'.split(' ');
|
||||
|
||||
/**
|
||||
* @static
|
||||
|
|
@ -88,9 +90,12 @@
|
|||
* @return {Object} instance of Canvas.Polyline
|
||||
*/
|
||||
Canvas.Polyline.fromElement = function(element, options) {
|
||||
if (!element) return null;
|
||||
if (!element) {
|
||||
return null;
|
||||
}
|
||||
var points = Canvas.parsePointsAttribute(element.getAttribute('points')),
|
||||
parsedAttributes = Canvas.parseAttributes(element, ATTRIBUTE_NAMES);
|
||||
|
||||
return new Canvas.Polyline(points, Object.extend(parsedAttributes, options));
|
||||
};
|
||||
|
||||
|
|
|
|||
|
|
@ -96,7 +96,7 @@
|
|||
});
|
||||
|
||||
// TODO (kangax): implement rounded rectangles (both parsing and rendering)
|
||||
Canvas.Rect.ATTRIBUTE_NAMES = $w('x y width height rx ry fill fill-opacity stroke stroke-width transform');
|
||||
Canvas.Rect.ATTRIBUTE_NAMES = 'x y width height rx ry fill fill-opacity stroke stroke-width transform'.split(' ');
|
||||
|
||||
/**
|
||||
* @private
|
||||
|
|
@ -115,7 +115,10 @@
|
|||
* @return {Object} instance of Canvas.Rect
|
||||
*/
|
||||
Canvas.Rect.fromElement = function(element, options) {
|
||||
if (!element) return null;
|
||||
if (!element) {
|
||||
return null;
|
||||
}
|
||||
|
||||
var parsedAttributes = Canvas.parseAttributes(element, Canvas.Rect.ATTRIBUTE_NAMES);
|
||||
parsedAttributes = _setDefaultLeftTopValues(parsedAttributes);
|
||||
|
||||
|
|
|
|||
|
|
@ -1,13 +1,12 @@
|
|||
(function(){
|
||||
|
||||
var global = this;
|
||||
var Canvas = global.Canvas || (global.Canvas = { });
|
||||
var Canvas = this.Canvas || (this.Canvas = { });
|
||||
|
||||
if (global.Canvas.Text) {
|
||||
if (Canvas.Text) {
|
||||
console.warn('Canvas.Text is already defined');
|
||||
return;
|
||||
}
|
||||
if (!global.Canvas.Object) {
|
||||
if (!Canvas.Object) {
|
||||
console.warn('Canvas.Text requires Canvas.Object');
|
||||
return;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -3,6 +3,7 @@
|
|||
var Canvas = this.Canvas || (this.Canvas = { });
|
||||
|
||||
if (Canvas.util) {
|
||||
console.warn('Canvas.util is already defined');
|
||||
return;
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -143,7 +143,7 @@ function init() {
|
|||
this.assertHashEqual(augmentedObjectRepr, cObj.toObject());
|
||||
|
||||
var fractionalValue = 166.66666666666666,
|
||||
testedProperties = $w('left top width height'),
|
||||
testedProperties = 'left top width height'.split(' '),
|
||||
fractionDigitsDefault = 2;
|
||||
|
||||
function testFractionDigits(fractionDigits, expectedValue) {
|
||||
|
|
|
|||
|
|
@ -65,7 +65,7 @@ function init() {
|
|||
this.assert(Canvas.parseAttributes);
|
||||
|
||||
var element = makeElement();
|
||||
var attributeNames = $w(' cx cy x y r fill-opacity fill-rule stroke-width transform fill fill-rule');
|
||||
var attributeNames = 'cx cy x y r fill-opacity fill-rule stroke-width transform fill fill-rule'.split(' ');
|
||||
var parsedAttributes = Canvas.parseAttributes(element, attributeNames);
|
||||
|
||||
this.assertObjectIdentical({
|
||||
|
|
@ -84,7 +84,7 @@ function init() {
|
|||
element.setAttribute('stroke', 'none');
|
||||
|
||||
this.assertObjectIdentical({ fill: '', stroke: '' },
|
||||
Canvas.parseAttributes(element, $w(' fill stroke ')));
|
||||
Canvas.parseAttributes(element, 'fill stroke'.split(' ')));
|
||||
},
|
||||
|
||||
testCanvasParseAttributesFillRule: function() {
|
||||
|
|
@ -92,7 +92,7 @@ function init() {
|
|||
element.setAttribute('fill-rule', 'evenodd');
|
||||
|
||||
this.assertObjectIdentical({ fillRule: 'destination-over' },
|
||||
Canvas.parseAttributes(element, $w(' fill-rule ')));
|
||||
Canvas.parseAttributes(element, ['fill-rule']));
|
||||
},
|
||||
|
||||
testCanvasParseAttributesFillRuleWithoutTransformation: function() {
|
||||
|
|
@ -100,14 +100,14 @@ function init() {
|
|||
element.setAttribute('fill-rule', 'inherit');
|
||||
|
||||
this.assertObjectIdentical({ fillRule: 'inherit' },
|
||||
Canvas.parseAttributes(element, $w(' fill-rule ')));
|
||||
Canvas.parseAttributes(element, ['fill-rule']));
|
||||
},
|
||||
|
||||
testCanvasParseAttributesTransform: function() {
|
||||
var element = document.createElement('path');
|
||||
element.setAttribute('transform', 'translate(5, 10)');
|
||||
this.assertObjectIdentical({ transformMatrix: [1, 0, 0, 1, 5, 10] },
|
||||
Canvas.parseAttributes(element, $w(' transform ')));
|
||||
Canvas.parseAttributes(element, ['transform']));
|
||||
},
|
||||
|
||||
testCanvasParseAttributesWithParent: function() {
|
||||
|
|
@ -123,7 +123,7 @@ function init() {
|
|||
grandParent.setAttribute('fill', 'red');
|
||||
|
||||
this.assertObjectIdentical({ fill: 'red', left: 100, top: 200 },
|
||||
Canvas.parseAttributes(element, $w(' x y fill ')));
|
||||
Canvas.parseAttributes(element, ['x y fill']));
|
||||
},
|
||||
|
||||
testCanvasParseElements: function() {
|
||||
|
|
|
|||
Loading…
Reference in a new issue