lsm/konva
1
0
Fork 0
mirror of https://github.com/konvajs/konva.git synced 2025-06-28 15:23:44 +08:00
Code Issues Actions Packages Projects Releases Wiki Activity

resolve lint errors + some refactoring 😯

Browse Source
This commit is contained in:
Лаврёнов Антон 2014-08-19 19:27:46 +08:00
parent e3e588fa41
commit 22da5892e2
17 changed files with 82 additions and 152 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/Animation.js
View File

@ -237,7 +237,7 @@
if (needRedraw) {
for(key in layerHash) {
layerHash[key].draw();
}
}
}
};
Kinetic.Animation._animationLoop = function() {

29
src/Canvas.js
View File

@ -23,14 +23,15 @@
* @constructor
* @abstract
* @memberof Kinetic
* @param {Number} width
* @param {Number} height
* @param {Number} pixelRatio KineticJS automatically handles pixel ratio adustments in order to render crisp drawings
* @param {Object} config
* @param {Number} config.width
* @param {Number} config.height
* @param {Number} config.pixelRatio KineticJS automatically handles pixel ratio adjustments in order to render crisp drawings
* on all devices. Most desktops, low end tablets, and low end phones, have device pixel ratios
* of 1. Some high end tablets and phones, like iPhones and iPads (not the mini) have a device pixel ratio
* of 2. Some Macbook Pros, and iMacs also have a device pixel ratio of 2. Some high end Android devices have pixel
* ratios of 2 or 3. Some browsers like Firefox allow you to configure the pixel ratio of the viewport. Unless otherwise
* specificed, the pixel ratio will be defaulted to the actual device pixel ratio. You can override the device pixel
* specified, the pixel ratio will be defaulted to the actual device pixel ratio. You can override the device pixel
* ratio for special situations, or, if you don't want the pixel ratio to be taken into account, you can set it to 1.
*/
Kinetic.Canvas = function(config) {
@ -39,9 +40,9 @@
Kinetic.Canvas.prototype = {
init: function(config) {
config = config || {};
var conf = config || {};
var pixelRatio = config.pixelRatio || Kinetic.pixelRatio || _pixelRatio;
var pixelRatio = conf.pixelRatio || Kinetic.pixelRatio || _pixelRatio;
this.pixelRatio = pixelRatio;
this._canvas = Kinetic.Util.createCanvasElement();
@ -167,11 +168,11 @@
};
Kinetic.SceneCanvas = function(config) {
config = config || {};
var width = config.width || 0,
height = config.height || 0;
var conf = config || {};
var width = conf.width || 0,
height = conf.height || 0;
Kinetic.Canvas.call(this, config);
Kinetic.Canvas.call(this, conf);
this.context = new Kinetic.SceneContext(this);
this.setSize(width, height);
};
@ -195,11 +196,11 @@
Kinetic.Util.extend(Kinetic.SceneCanvas, Kinetic.Canvas);
Kinetic.HitCanvas = function(config) {
config = config || {};
var width = config.width || 0,
height = config.height || 0;
var conf = config || {};
var width = conf.width || 0,
height = conf.height || 0;
Kinetic.Canvas.call(this, config);
Kinetic.Canvas.call(this, conf);
this.context = new Kinetic.HitContext(this);
this.setSize(width, height);
};

6
src/Container.js
View File

@ -19,13 +19,13 @@
* return node.getClassName() === 'Circle';
* });
*/
getChildren: function(predicate) {
if (!predicate) {
getChildren: function(filterFunc) {
if (!filterFunc) {
return this.children;
} else {
var results = new Kinetic.Collection();
this.children.each(function(child){
if (predicate(child)) {
if (filterFunc(child)) {
results.push(child);
}
});

10
src/DragAndDrop.js
View File

@ -1,11 +1,11 @@
(function() {
Kinetic.DD = {
// properties
anim: new Kinetic.Animation(function(frame) {
var b = this.dirty;
this.dirty = false;
return b;
}),
anim: new Kinetic.Animation(function() {
var b = this.dirty;
this.dirty = false;
return b;
}),
isDragging: false,
justDragged: false,
offset: {

50
src/Factory.js
View File

@ -1,46 +1,9 @@
/*jshint unused:false */
(function() {
// CONSTANTS
var ABSOLUTE_OPACITY = 'absoluteOpacity',
ABSOLUTE_TRANSFORM = 'absoluteTransform',
ADD = 'add',
B = 'b',
BEFORE = 'before',
BLACK = 'black',
CHANGE = 'Change',
CHILDREN = 'children',
DEG = 'Deg',
DOT = '.',
EMPTY_STRING = '',
G = 'g',
GET = 'get',
HASH = '#',
ID = 'id',
KINETIC = 'kinetic',
LISTENING = 'listening',
MOUSEENTER = 'mouseenter',
MOUSELEAVE = 'mouseleave',
NAME = 'name',
OFF = 'off',
ON = 'on',
PRIVATE_GET = '_get',
R = 'r',
var GET = 'get',
RGB = 'RGB',
SET = 'set',
SHAPE = 'Shape',
SPACE = ' ',
STAGE = 'Stage',
TRANSFORM = 'transform',
UPPER_B = 'B',
UPPER_G = 'G',
UPPER_HEIGHT = 'Height',
UPPER_R = 'R',
UPPER_WIDTH = 'Width',
UPPER_X = 'X',
UPPER_Y = 'Y',
VISIBLE = 'visible',
X = 'x',
Y = 'y';
SET = 'set';
Kinetic.Factory = {
addGetterSetter: function(constructor, attr, def, validator, after) {
@ -146,14 +109,15 @@
};
Kinetic.Validators = {
/**
* @return {number}
*/
RGBComponent: function(val) {
if (val > 255) {
return 255;
}
else if (val < 0) {
} else if (val < 0) {
return 0;
}
else {
} else {
return Math.round(val);
}
},

6
src/FastLayer.js
View File

@ -1,8 +1,4 @@
(function() {
// constants
var HASH = '#',
BEFORE_DRAW ='beforeDraw',
DRAW = 'draw';
Kinetic.Util.addMethods(Kinetic.FastLayer, {
____init: function(config) {
@ -50,7 +46,7 @@
draw: function() {
this.drawScene();
return this;
},
},
/**
* clear scene and hit canvas contexts tied to the layer
* @method

25
src/Global.js
View File

@ -162,7 +162,7 @@ var Kinetic = {};
* @memberof Kinetic
* @augments Kinetic.Container
* @param {Object} config
* @param {String|DomElement} config.container Container id or DOM element
* @param {String|Element} config.container Container id or DOM element
* @@nodeParams
* @example
* var stage = new Kinetic.Stage({
@ -258,12 +258,10 @@ var Kinetic = {};
// if DD is not included with the build, then
// drag and drop is not even possible
if (!dd) {
return false;
}
// if DD is included with the build
else {
if (dd) {
return dd.isDragging;
} else {
return false;
}
},
/**
@ -277,12 +275,10 @@ var Kinetic = {};
// if DD is not included with the build, then
// drag and drop is not even possible
if (!dd) {
return false;
}
// if DD is included with the build
else {
if (dd) {
return !!dd.node;
} else {
return false;
}
},
_addId: function(node, id) {
@ -343,8 +339,8 @@ var Kinetic = {};
// adding mobile flab
mobile: mobile,
ieMobile: ieMobile // If this is true (i.e., WP8), then Kinetic touch events are executed instead of equivalent Kinetic mouse events
};
},
};
},
// user agent
UA: undefined
};
@ -383,9 +379,8 @@ var Kinetic = {};
// like Node.
var Canvas = require('canvas');
var jsdom = require('jsdom').jsdom;
var doc = jsdom('<!DOCTYPE html><html><head></head><body></body></html>');
Kinetic.document = doc;
Kinetic.document = jsdom('<!DOCTYPE html><html><head></head><body></body></html>');
Kinetic.window = Kinetic.document.createWindow();
Kinetic.window.Image = Canvas.Image;
Kinetic._nodeCanvas = Canvas;

15
src/Layer.js
View File

@ -80,15 +80,13 @@
}
}
// if no shape, and no antialiased pixel, we should end searching
if (!continueSearch) {
return;
} else {
if (continueSearch) {
spiralSearchDistance += 1;
} else {
return;
}
}
}
else {
} else {
return null;
}
},
@ -207,7 +205,7 @@
* @name enableHitGraph
* @method
* @memberof Kinetic.Layer.prototype
* @returns {Node}
* @returns {Layer}
*/
enableHitGraph: function() {
this.setHitGraphEnabled(true);
@ -218,7 +216,7 @@
* @name disableHitGraph
* @method
* @memberof Kinetic.Layer.prototype
* @returns {Node}
* @returns {Layer}
*/
disableHitGraph: function() {
this.setHitGraphEnabled(false);
@ -251,6 +249,5 @@
* // enable hit graph
* layer.hitGraphEnabled(true);
*/
Kinetic.Collection.mapMethods(Kinetic.Layer);
})();

31
src/Node.js
View File

@ -2,7 +2,6 @@
// CONSTANTS
var ABSOLUTE_OPACITY = 'absoluteOpacity',
ABSOLUTE_TRANSFORM = 'absoluteTransform',
BEFORE = 'before',
CHANGE = 'Change',
CHILDREN = 'children',
DOT = '.',
@ -149,8 +148,8 @@
y = conf.y || 0,
width = conf.width || this.width(),
height = conf.height || this.height(),
drawBorder = conf.drawBorder || false,
layer = this.getLayer();
drawBorder = conf.drawBorder || false;
if (width === 0 || height === 0) {
Kinetic.Util.warn('Width or height of caching configuration equals 0. Cache is ignored.');
return;
@ -169,9 +168,6 @@
width: width,
height: height
}),
origTransEnabled = this.transformsEnabled(),
origX = this.x(),
origY = this.y(),
sceneContext = cachedSceneCanvas.getContext(),
hitContext = cachedHitCanvas.getContext();
@ -184,7 +180,7 @@
// this will draw a red border around the cached box for
// debugging purposes
if (drawBorder) {
if (drawBorder) {
sceneContext.save();
sceneContext.beginPath();
sceneContext.rect(0, 0, width, height);
@ -201,7 +197,7 @@
// don't need to translate canvas if shape is not added to layer
if (this.nodeType === 'Shape') {
sceneContext.translate(this.x() * -1, this.y() * -1);
hitContext.translate(this.x() * -1, this.y() * -1);
hitContext.translate(this.x() * -1, this.y() * -1);
}
this.drawScene(cachedSceneCanvas, this);
@ -1119,7 +1115,7 @@
* @method
* @memberof Kinetic.Node.prototype
* @param {String} eventType event type. can be a regular event, like click, mouseover, or mouseout, or it can be a custom event, like myCustomEvent
* @param {EventObject} [evt] event object
* @param {Event} [evt] event object
* @param {Boolean} [bubble] setting the value to false, or leaving it undefined, will result in the event
* not bubbling. Setting the value to true will result in the event bubbling.
* @returns {Kinetic.Node}
@ -1159,7 +1155,7 @@
getAbsoluteTransform: function(top) {
// if using an argument, we can't cache the result.
if (top) {
return this._getAbsoluteTransform(top);
return this._getAbsoluteTransform(top);
}
// if no argument, we can cache the result
else {
@ -1229,7 +1225,7 @@
* for another node
* @method
* @memberof Kinetic.Node.prototype
* @param {Object} attrs override attrs
* @param {Object} obj override attrs
* @returns {Kinetic.Node}
* @example
* // simple clone
@ -1450,11 +1446,8 @@
* @example
* node.setAttr('x', 5);
*/
setAttr: function() {
var args = Array.prototype.slice.call(arguments),
attr = args[0],
val = args[1],
method = SET + Kinetic.Util._capitalize(attr),
setAttr: function(attr, val) {
var method = SET + Kinetic.Util._capitalize(attr),
func = this[method];
if(Kinetic.Util._isFunction(func)) {
@ -1550,8 +1543,8 @@
* and setImage() methods
* @method
* @memberof Kinetic.Node
* @param {String} JSON string
* @param {DomElement} [container] optional container dom element used only if you're
* @param {String} json
* @param {Element} [container] optional container dom element used only if you're
* creating a stage node
*/
Kinetic.Node.create = function(json, container) {
@ -1589,7 +1582,7 @@
* @memberof Kinetic.Node.prototype
* @param {Object} pos
* @param {Number} pos.x
* @param {Nubmer} pos.y
* @param {Number} pos.y
* @returns {Object}
* @example
* // get position

10
src/Shape.js
View File

@ -111,14 +111,14 @@
* @param {Number} point.y
* @returns {Boolean}
*/
intersects: function(pos) {
intersects: function(point) {
var stage = this.getStage(),
bufferHitCanvas = stage.bufferHitCanvas,
p;
bufferHitCanvas.getContext().clear();
this.drawScene(bufferHitCanvas);
p = bufferHitCanvas.context.getImageData(Math.round(pos.x), Math.round(pos.y), 1, 1).data;
p = bufferHitCanvas.context.getImageData(Math.round(point.x), Math.round(point.y), 1, 1).data;
return p[3] > 0;
},
// extends Node.prototype.destroy
@ -180,8 +180,8 @@
if (layer) {
layer._applyTransform(this, context, top);
} else {
var m = this.getAbsoluteTransform(top).getMatrix();
context.transform(m[0], m[1], m[2], m[3], m[4], m[5]);
var o = this.getAbsoluteTransform(top).getMatrix();
context.transform(o[0], o[1], o[2], o[3], o[4], o[5]);
}
if (hasShadow) {
@ -284,7 +284,7 @@
}
return this;
},
}
});
Kinetic.Util.extend(Kinetic.Shape, Kinetic.Node);

6
src/Stage.js
View File

@ -21,9 +21,7 @@
TOUCHMOVE = 'touchmove',
CONTENT_MOUSEOUT = 'contentMouseout',
CONTENT_MOUSELEAVE = 'contentMouseleave',
CONTENT_MOUSEOVER = 'contentMouseover',
CONTENT_MOUSEENTER = 'contentMouseenter',
CONTENT_MOUSEMOVE = 'contentMousemove',
CONTENT_MOUSEDOWN = 'contentMousedown',
CONTENT_MOUSEUP = 'contentMouseup',
@ -31,7 +29,6 @@
CONTENT_DBL_CLICK = 'contentDblclick',
CONTENT_TOUCHSTART = 'contentTouchstart',
CONTENT_TOUCHEND = 'contentTouchend',
CONTENT_TAP = 'contentTap',
CONTENT_DBL_TAP = 'contentDbltap',
CONTENT_TOUCHMOVE = 'contentTouchmove',
@ -476,7 +473,7 @@
// workaround for mobile IE to force touch event when unhandled pointer event elevates into a mouse event
if (Kinetic.UA.ieMobile) {
return this._touchend(evt);
}
}
if (!Kinetic.UA.mobile) {
this._setPointerPosition(evt);
var shape = this.getIntersection(this.getPointerPosition()),
@ -714,7 +711,6 @@
// TODO: may be it is better to cache all children layers?
cache: function() {
Kinetic.Util.warn('Cache function is not allowed for stage. You may use cache only for layers, groups and shapes.');
return;
},
clearCache : function() {
}

3
src/Tween.js
View File

@ -197,7 +197,6 @@
* @returns {Tween}
*/
reset: function() {
var node = this.node;
this.tween.reset();
return this;
},
@ -209,7 +208,6 @@
* @returns {Tween}
*/
seek: function(t) {
var node = this.node;
this.tween.seek(t * 1000);
return this;
},
@ -230,7 +228,6 @@
* @returns {Tween}
*/
finish: function() {
var node = this.node;
this.tween.finish();
return this;
},

21
src/Util.js
View File

@ -105,7 +105,7 @@
/**
* Transform constructor
* @constructor
* @param {Array} Optional six-element matrix
* @param {Array} [m] Optional six-element matrix
* @memberof Kinetic
*/
Kinetic.Transform = function(m) {
@ -126,14 +126,14 @@
* Transform point
* @method
* @memberof Kinetic.Transform.prototype
* @param {Object} 2D point(x, y)
* @param {Object} point 2D point(x, y)
* @returns {Object} 2D point(x, y)
*/
point: function(p) {
point: function(point) {
var m = this.m;
return {
x: m[0] * p.x + m[2] * p.y + m[4],
y: m[1] * p.x + m[3] * p.y + m[5]
x: m[0] * point.x + m[2] * point.y + m[4],
y: m[1] * point.x + m[3] * point.y + m[5]
};
},
/**
@ -292,8 +292,7 @@
};
// CONSTANTS
var CANVAS = 'canvas',
CONTEXT_2D = '2d',
var CONTEXT_2D = '2d',
OBJECT_ARRAY = '[object Array]',
OBJECT_NUMBER = '[object Number]',
OBJECT_STRING = '[object String]',
@ -361,11 +360,11 @@
// as much as it can, without ever going more than once per `wait` duration;
// but if you'd like to disable the execution on the leading edge, pass
// `{leading: false}`. To disable execution on the trailing edge, ditto.
_throttle: function(func, wait, options) {
_throttle: function(func, wait, opts) {
var context, args, result;
var timeout = null;
var previous = 0;
options || (options = {});
var options = opts || {};
var later = function() {
previous = options.leading === false ? 0 : new Date().getTime();
timeout = null;
@ -374,7 +373,9 @@
};
return function() {
var now = new Date().getTime();
if (!previous && options.leading === false) previous = now;
if (!previous && options.leading === false) {
previous = now;
}
var remaining = wait - (now - previous);
context = this;
args = arguments;

10
src/filters/Enhance.js
View File

@ -41,7 +41,6 @@
rMin = data[0], rMax = rMin, r,
gMin = data[1], gMax = gMin, g,
bMin = data[2], bMax = bMin, b,
aMin = data[3], aMax = aMin,
i;
// If we are not enhancing anything - don't do any computation
@ -68,12 +67,10 @@
if( rMax === rMin ){ rMax = 255; rMin = 0; }
if( gMax === gMin ){ gMax = 255; gMin = 0; }
if( bMax === bMin ){ bMax = 255; bMin = 0; }
if( aMax === aMin ){ aMax = 255; aMin = 0; }
var rMid, rGoalMax,rGoalMin,
gMid, gGoalMax,gGoalMin,
bMid, bGoalMax,aGoalMin,
aMid, aGoalMax,bGoalMin;
bMid, bGoalMax,bGoalMin;
// If the enhancement is positive - stretch the histogram
if ( enhanceAmount > 0 ){
@ -83,8 +80,6 @@
gGoalMin = gMin - enhanceAmount*(gMin-0);
bGoalMax = bMax + enhanceAmount*(255-bMax);
bGoalMin = bMin - enhanceAmount*(bMin-0);
aGoalMax = aMax + enhanceAmount*(255-aMax);
aGoalMin = aMin - enhanceAmount*(aMin-0);
// If the enhancement is negative - compress the histogram
} else {
rMid = (rMax + rMin)*0.5;
@ -96,9 +91,6 @@
bMid = (bMax + bMin)*0.5;
bGoalMax = bMax + enhanceAmount*(bMax-bMid);
bGoalMin = bMin + enhanceAmount*(bMin-bMid);
aMid = (aMax + aMin)*0.5;
aGoalMax = aMax + enhanceAmount*(aMax-aMid);
aGoalMin = aMin + enhanceAmount*(aMin-aMid);
}
// Pass 2 - remap everything, except the alpha

2
src/filters/Noise.js
View File

@ -5,7 +5,7 @@
* @function
* @name Noise
* @memberof Kinetic.Filters
* @param {Object} imagedata
* @param {Object} imageData
* @author ippo615
* @example
* node.cache();

2
src/shapes/Arc.js
View File

@ -1,6 +1,4 @@
(function() {
var PI_OVER_180 = Math.PI / 180;
/**
* Arc constructor
* @constructor

6
src/shapes/Image.js
View File

@ -9,7 +9,7 @@
* @memberof Kinetic
* @augments Kinetic.Shape
* @param {Object} config
* @param {ImageObject} config.image
* @param {Image} config.image
* @param {Object} [config.crop]
* @@shapeParams
* @@nodeParams
@ -96,7 +96,7 @@
* @name setImage
* @method
* @memberof Kinetic.Image.prototype
* @param {ImageObject} image
* @param {Image} image
*/
/**
@ -104,7 +104,7 @@
* @name getImage
* @method
* @memberof Kinetic.Image.prototype
* @returns {ImageObject}
* @returns {Image}
*/
Kinetic.Factory.addComponentsGetterSetter(Kinetic.Image, 'crop', ['x', 'y', 'width', 'height']);