happyz
/
jsketch
mirror of https://github.com/luileito/jsketch.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Linted code

This commit is contained in:
Luis Leiva 2019-05-26 20:32:41 +03:00
parent 8d6933bdad
commit ee28ebb16c
11 changed files with 62 additions and 56 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
.eslintrc.js
View File

@ -14,6 +14,8 @@ module.exports = {
'no-multi-spaces': 0, 'no-multi-spaces': 0,
'object-curly-spacing': 0, 'object-curly-spacing': 0,
'require-jsdoc': 0, 'require-jsdoc': 0,
'prefer-spread': 0,
'no-multi-str': 0,
// --- BEGIN Errors --- // --- BEGIN Errors ---
'no-tabs': 2, 'no-tabs': 2,
'indent': ['error', 2], 'indent': ['error', 2],

6
jquery.sketchable.animate.js
View File

@ -64,7 +64,7 @@
/** /**
* Cancel current animation. * Cancel current animation.
* @return {AnimateSketch}. * @return {AnimateSketch}
*/ */
this.cancel = function() { this.cancel = function() {
cancelAnimationFrame(raf); cancelAnimationFrame(raf);
@ -87,8 +87,8 @@
if (sketch.data.firstPointSize) { if (sketch.data.firstPointSize) {
var pt = t > 0 ? nextPt : currPt; var pt = t > 0 ? nextPt : currPt;
sketch.beginFill(sketch.data.strokeStyle) sketch.beginFill(sketch.data.strokeStyle)
.fillCircle(pt.x, pt.y, sketch.data.firstPointSize) .fillCircle(pt.x, pt.y, sketch.data.firstPointSize)
.endFill(); .endFill();
} }
// Trigger step event for subsequent strokes. // Trigger step event for subsequent strokes.
if (t > 0 && typeof events.animationstep === 'function') if (t > 0 && typeof events.animationstep === 'function')

24
jquery.sketchable.js
View File

@ -26,7 +26,7 @@
/** /**
* Initialize the selected jQuery objects. * Initialize the selected jQuery objects.
* @param {object} [opts] - Configuration (default: {@link $.fn.sketchable.defaults}). * @param {object} [opts] - Configuration (default: {@link $.fn.sketchable.defaults}).
* @return jQuery * @return {object} jQuery
* @memberof $.fn.sketchable * @memberof $.fn.sketchable
* @ignore * @ignore
* @protected * @protected
@ -76,7 +76,7 @@
/** /**
* Change configuration of an existing jQuery Sketchable element. * Change configuration of an existing jQuery Sketchable element.
* @param {object} [opts] - Configuration (default: {@link $.fn.sketchable.defaults}). * @param {object} [opts] - Configuration (default: {@link $.fn.sketchable.defaults}).
* @return jQuery * @return {object} jQuery
* @memberof $.fn.sketchable * @memberof $.fn.sketchable
* @example * @example
* var $canvas = $('canvas').sketchable('config', { interactive: false }); * var $canvas = $('canvas').sketchable('config', { interactive: false });
@ -97,7 +97,7 @@
/** /**
* Get/Set drawing data strokes sequence. * Get/Set drawing data strokes sequence.
* @param {array} [arr] - Multidimensional array of [x,y,time,status] tuples; status = 0 (pen down) or 1 (pen up). * @param {array} [arr] - Multidimensional array of [x,y,time,status] tuples; status = 0 (pen down) or 1 (pen up).
* @return Strokes object on get, jQuery instance on set (with the new data attached). * @return {*} Strokes object on get, jQuery instance on set (with the new data attached).
* @memberof $.fn.sketchable * @memberof $.fn.sketchable
* @example * @example
* // Getter: read associated strokes. * // Getter: read associated strokes.
@ -119,7 +119,7 @@
/** /**
* Allow low-level manipulation of the sketchable canvas. * Allow low-level manipulation of the sketchable canvas.
* @param {function} callback - Callback function, invoked with 2 arguments: elem (CANVAS element) and data (private element data). * @param {function} callback - Callback function, invoked with 2 arguments: elem (CANVAS element) and data (private element data).
* @return jQuery * @return {object} jQuery
* @memberof $.fn.sketchable * @memberof $.fn.sketchable
* @example * @example
* $('canvas').sketchable('handler', function(elem, data) { * $('canvas').sketchable('handler', function(elem, data) {
@ -134,7 +134,7 @@
}, },
/** /**
* Clears canvas <b>together with</b> associated strokes data. * Clears canvas <b>together with</b> associated strokes data.
* @return jQuery * @return {object} jQuery
* @memberof $.fn.sketchable * @memberof $.fn.sketchable
* @see $.fn.sketchable.handler * @see $.fn.sketchable.handler
* @example * @example
@ -162,7 +162,7 @@
/** /**
* Reinitialize a sketchable canvas with given configuration options. * Reinitialize a sketchable canvas with given configuration options.
* @param {object} [opts] - Configuration (default: {@link $.fn.sketchable.defaults}). * @param {object} [opts] - Configuration (default: {@link $.fn.sketchable.defaults}).
* @return jQuery * @return {object} jQuery
* @memberof $.fn.sketchable * @memberof $.fn.sketchable
* @example * @example
* var $canvas = $('canvas').sketchable(); * var $canvas = $('canvas').sketchable();
@ -183,7 +183,7 @@
}, },
/** /**
* Destroy sketchable canvas, together with strokes data and associated events. * Destroy sketchable canvas, together with strokes data and associated events.
* @return jQuery * @return {object} jQuery
* @memberof $.fn.sketchable * @memberof $.fn.sketchable
* @example * @example
* var $canvas = $('canvas').sketchable(); * var $canvas = $('canvas').sketchable();
@ -212,7 +212,7 @@
* @param {string} evName - Event name. * @param {string} evName - Event name.
* @param {function} listener - Custom event listener. * @param {function} listener - Custom event listener.
* @param {string} initiator - Some identifier. * @param {string} initiator - Some identifier.
* @return jQuery * @return {object} jQuery
* @memberof $.fn.sketchable * @memberof $.fn.sketchable
* @example * @example
* // Decorate 'clear' method with `myClearFn()`, * // Decorate 'clear' method with `myClearFn()`,
@ -247,7 +247,7 @@
* This is a jQuery wrapper for the <tt>jSketch</tt> drawing class. * This is a jQuery wrapper for the <tt>jSketch</tt> drawing class.
* @namespace $.fn.sketchable * @namespace $.fn.sketchable
* @param {string|object} method - Method to invoke, or a configuration object. * @param {string|object} method - Method to invoke, or a configuration object.
* @return jQuery * @return {object} jQuery
* @version 2.2 * @version 2.2
* @author Luis A. Leiva * @author Luis A. Leiva
* @license MIT license * @license MIT license
@ -517,9 +517,9 @@
// Mark visually 1st point of stroke. // Mark visually 1st point of stroke.
if (options.graphics.firstPointSize > 0) { if (options.graphics.firstPointSize > 0) {
data.sketch data.sketch
.beginFill(options.graphics.fillStyle) .beginFill(options.graphics.fillStyle)
.fillCircle(p.x, p.y, options.graphics.firstPointSize) .fillCircle(p.x, p.y, options.graphics.firstPointSize)
.endFill(); .endFill();
} }
data.sketch.isDrawing = true; data.sketch.isDrawing = true;

5
jquery.sketchable.serializer.js
View File

@ -23,12 +23,12 @@
serializer: { serializer: {
/** /**
* Save canvas data as JSON string. * Save canvas data as JSON string.
* @return {string} serialized canvas data. * @return {string}
* @memberof $.fn.sketchable.plugins.serializer * @memberof $.fn.sketchable.plugins.serializer
* @example * @example
* var contents = jqueryElem.sketchable('serializer.save'); * var contents = jqueryElem.sketchable('serializer.save');
*/ */
save: function(contents) { save: function() {
var data = $(this).data(namespace); var data = $(this).data(namespace);
// Save only the required properties. // Save only the required properties.
// Also avoid circular JSON references. // Also avoid circular JSON references.
@ -40,6 +40,7 @@
}, },
/** /**
* Load canvas data from JSON string. * Load canvas data from JSON string.
* @param {string} jsonStr - JSON data saved with {@link $.fn.sketchable.plugins.serializer.save} method.
* @return {jQuery} jQuery sketchable element. * @return {jQuery} jQuery sketchable element.
* @memberof $.fn.sketchable.plugins.serializer * @memberof $.fn.sketchable.plugins.serializer
* @example * @example

2
jsdoc.json
View File

@ -7,10 +7,12 @@
"sketchable.utils.js", "sketchable.utils.js",
"sketchable.memento.js", "sketchable.memento.js",
"sketchable.animate.js", "sketchable.animate.js",
"sketchable.serializer.js",
"sketchable.svg.js", "sketchable.svg.js",
"jquery.sketchable.js", "jquery.sketchable.js",
"jquery.sketchable.memento.js", "jquery.sketchable.memento.js",
"jquery.sketchable.animate.js", "jquery.sketchable.animate.js",
"jquery.sketchable.serializer.js",
"jquery.sketchable.svg.js" "jquery.sketchable.svg.js"
] ]
}, },

60
jsketch.js
View File

@ -52,7 +52,7 @@
/** /**
* Allows to change the drawing context at runtime. * Allows to change the drawing context at runtime.
* @param {object} elem - DOM element. * @param {object} elem - DOM element.
* @return jSketch * @return {object} jSketch
* @memberof jSketch * @memberof jSketch
*/ */
setContext: function(elem) { setContext: function(elem) {
@ -71,7 +71,7 @@
* - lineCap: Line cap ('round'). * - lineCap: Line cap ('round').
* - lineJoin: Line join ('round'). * - lineJoin: Line join ('round').
* - miterLimit: Line miter (10). Works only if the lineJoin attribute is "miter". * - miterLimit: Line miter (10). Works only if the lineJoin attribute is "miter".
* @return jSketch * @return {object} jSketch
* @memberof jSketch * @memberof jSketch
*/ */
setDefaults: function() { setDefaults: function() {
@ -94,7 +94,7 @@
* Sets the dimensions of canvas. * Sets the dimensions of canvas.
* @param {number} width - New canvas width. * @param {number} width - New canvas width.
* @param {number} height - New canvas width. * @param {number} height - New canvas width.
* @return jSketch * @return {object} jSketch
* @memberof jSketch * @memberof jSketch
*/ */
size: function(width, height) { size: function(width, height) {
@ -109,7 +109,7 @@
/** /**
* Sets the background color of canvas. * Sets the background color of canvas.
* @param {string} color - An HTML color. * @param {string} color - An HTML color.
* @return jSketch * @return {object} jSketch
* @memberof jSketch * @memberof jSketch
*/ */
background: function(color) { background: function(color) {
@ -128,7 +128,7 @@
* @param {number} width - New canvas width. * @param {number} width - New canvas width.
* @param {number} height - New canvas width. * @param {number} height - New canvas width.
* @param {string} bgcolor - An HTML color. * @param {string} bgcolor - An HTML color.
* @return jSketch * @return {object} jSketch
* @memberof jSketch * @memberof jSketch
*/ */
stage: function(width, height, bgcolor) { stage: function(width, height, bgcolor) {
@ -138,7 +138,7 @@
/** /**
* Sets the fill color. * Sets the fill color.
* @param {string} color - An HTML color. * @param {string} color - An HTML color.
* @return jSketch * @return {object} jSketch
* @memberof jSketch * @memberof jSketch
*/ */
beginFill: function(color) { beginFill: function(color) {
@ -149,7 +149,7 @@
}, },
/** /**
* Recovers the fill color that was set before `beginFill()`. * Recovers the fill color that was set before `beginFill()`.
* @return jSketch * @return {object} jSketch
* @memberof jSketch * @memberof jSketch
*/ */
endFill: function() { endFill: function() {
@ -163,7 +163,7 @@
* @param {string} capStyle - Style of line cap. * @param {string} capStyle - Style of line cap.
* @param {string} joinStyle - Style of line join. * @param {string} joinStyle - Style of line join.
* @param {string} miter - Style of line miter. Only works if capStyle is "miter". * @param {string} miter - Style of line miter. Only works if capStyle is "miter".
* @return jSketch * @return {object} jSketch
* @memberof jSketch * @memberof jSketch
*/ */
lineStyle: function(color, thickness, capStyle, joinStyle, miter) { lineStyle: function(color, thickness, capStyle, joinStyle, miter) {
@ -180,7 +180,7 @@
* Move brush to a coordinate in canvas. * Move brush to a coordinate in canvas.
* @param {number} x - Horizontal coordinate. * @param {number} x - Horizontal coordinate.
* @param {number} y - Vertical coordinate. * @param {number} y - Vertical coordinate.
* @return jSketch * @return {object} jSketch
* @memberof jSketch * @memberof jSketch
*/ */
moveTo: function(x, y) { moveTo: function(x, y) {
@ -193,7 +193,7 @@
* Draws line to given coordinate. * Draws line to given coordinate.
* @param {number} x - Horizontal coordinate. * @param {number} x - Horizontal coordinate.
* @param {number} y - Vertical coordinate. * @param {number} y - Vertical coordinate.
* @return jSketch * @return {object} jSketch
* @memberof jSketch * @memberof jSketch
*/ */
lineTo: function(x, y) { lineTo: function(x, y) {
@ -208,7 +208,7 @@
* @param {number} y1 - Vertical coordinate of point 1. * @param {number} y1 - Vertical coordinate of point 1.
* @param {number} x2 - Horizontal coordinate of point 2. * @param {number} x2 - Horizontal coordinate of point 2.
* @param {number} y2 - Vertical coordinate of point 2. * @param {number} y2 - Vertical coordinate of point 2.
* @return jSketch * @return {object} jSketch
* @memberof jSketch * @memberof jSketch
*/ */
line: function(x1, y1, x2, y2) { line: function(x1, y1, x2, y2) {
@ -222,7 +222,7 @@
* @param {number} y - Vertical coordinate. * @param {number} y - Vertical coordinate.
* @param {number} cpx - Horizontal coordinate of control point. * @param {number} cpx - Horizontal coordinate of control point.
* @param {number} cpy - Vertical coordinate of control point. * @param {number} cpy - Vertical coordinate of control point.
* @return jSketch * @return {object} jSketch
* @memberof jSketch * @memberof jSketch
*/ */
curveTo: function(x, y, cpx, cpy) { curveTo: function(x, y, cpx, cpy) {
@ -240,7 +240,7 @@
* @param {number} y2 - Vertical coordinate of point 2. * @param {number} y2 - Vertical coordinate of point 2.
* @param {number} cpx - Horizontal coordinate of control point. * @param {number} cpx - Horizontal coordinate of control point.
* @param {number} cpy - Vertical coordinate of control point. * @param {number} cpy - Vertical coordinate of control point.
* @return jSketch * @return {object} jSketch
* @memberof jSketch * @memberof jSketch
*/ */
curve: function(x1, y1, x2, y2, cpx, cpy) { curve: function(x1, y1, x2, y2, cpx, cpy) {
@ -250,7 +250,7 @@
}, },
/** /**
* Strokes a given path. * Strokes a given path.
* @return jSketch * @return {object} jSketch
* @memberof jSketch * @memberof jSketch
*/ */
stroke: function() { stroke: function() {
@ -264,7 +264,7 @@
* @param {number} y - Vertical coordinate. * @param {number} y - Vertical coordinate.
* @param {number} width - Rectangle width. * @param {number} width - Rectangle width.
* @param {number} height - Rectangle height. * @param {number} height - Rectangle height.
* @return jSketch * @return {object} jSketch
* @memberof jSketch * @memberof jSketch
*/ */
strokeRect: function(x, y, width, height) { strokeRect: function(x, y, width, height) {
@ -284,7 +284,7 @@
* @param {number} y - Vertical coordinate. * @param {number} y - Vertical coordinate.
* @param {number} width - Rectangle width. * @param {number} width - Rectangle width.
* @param {number} height - Rectangle height. * @param {number} height - Rectangle height.
* @return jSketch * @return {object} jSketch
* @memberof jSketch * @memberof jSketch
*/ */
fillRect: function(x, y, width, height) { fillRect: function(x, y, width, height) {
@ -304,7 +304,7 @@
* @param {number} y - Vertical coordinate. * @param {number} y - Vertical coordinate.
* @param {number} width - Rectangle width. * @param {number} width - Rectangle width.
* @param {number} height - Rectangle height. * @param {number} height - Rectangle height.
* @return jSketch * @return {object} jSketch
* @memberof jSketch * @memberof jSketch
*/ */
rect: function(x, y, width, height) { rect: function(x, y, width, height) {
@ -318,7 +318,7 @@
* @param {number} x - Horizontal coordinate. * @param {number} x - Horizontal coordinate.
* @param {number} y - Vertical coordinate. * @param {number} y - Vertical coordinate.
* @param {number} radius - Circle radius. * @param {number} radius - Circle radius.
* @return jSketch * @return {object} jSketch
* @memberof jSketch * @memberof jSketch
*/ */
strokeCircle: function(x, y, radius) { strokeCircle: function(x, y, radius) {
@ -338,7 +338,7 @@
* @param {number} x - Horizontal coordinate. * @param {number} x - Horizontal coordinate.
* @param {number} y - Vertical coordinate. * @param {number} y - Vertical coordinate.
* @param {number} radius - Circle radius. * @param {number} radius - Circle radius.
* @return jSketch * @return {object} jSketch
* @memberof jSketch * @memberof jSketch
*/ */
fillCircle: function(x, y, radius) { fillCircle: function(x, y, radius) {
@ -358,7 +358,7 @@
* @param {number} x - Horizontal coordinate. * @param {number} x - Horizontal coordinate.
* @param {number} y - Vertical coordinate. * @param {number} y - Vertical coordinate.
* @param {number} radius - Circle radius. * @param {number} radius - Circle radius.
* @return jSketch * @return {object} jSketch
* @memberof jSketch * @memberof jSketch
*/ */
circle: function(x, y, radius) { circle: function(x, y, radius) {
@ -386,7 +386,7 @@
}, },
/** /**
* A path is started. * A path is started.
* @return jSketch * @return {object} jSketch
* @memberof jSketch * @memberof jSketch
*/ */
beginPath: function() { beginPath: function() {
@ -397,7 +397,7 @@
}, },
/** /**
* A path is finished. * A path is finished.
* @return jSketch * @return {object} jSketch
* @memberof jSketch * @memberof jSketch
*/ */
closePath: function() { closePath: function() {
@ -408,7 +408,7 @@
}, },
/** /**
* Sets brush to eraser mode. * Sets brush to eraser mode.
* @return jSketch * @return {object} jSketch
* @memberof jSketch * @memberof jSketch
*/ */
eraser: function() { eraser: function() {
@ -418,7 +418,7 @@
}, },
/** /**
* Sets brush to pencil mode. * Sets brush to pencil mode.
* @return jSketch * @return {object} jSketch
* @memberof jSketch * @memberof jSketch
*/ */
pencil: function() { pencil: function() {
@ -428,7 +428,7 @@
}, },
/** /**
* Clears stage. * Clears stage.
* @return jSketch * @return {object} jSketch
* @memberof jSketch * @memberof jSketch
*/ */
clear: function() { clear: function() {
@ -440,7 +440,7 @@
}, },
/** /**
* Saves a snapshot of all styles and transformations. * Saves a snapshot of all styles and transformations.
* @return jSketch * @return {object} jSketch
* @memberof jSketch * @memberof jSketch
*/ */
save: function() { save: function() {
@ -450,7 +450,7 @@
}, },
/** /**
* Restores previous drawing state. * Restores previous drawing state.
* @return jSketch * @return {object} jSketch
* @memberof jSketch * @memberof jSketch
*/ */
restore: function() { restore: function() {
@ -461,7 +461,7 @@
/** /**
* Saves given drawing settings. * Saves given drawing settings.
* @param {object} [options] - Graphics options. * @param {object} [options] - Graphics options.
* @return jSketch * @return {object} jSketch
* @memberof jSketch * @memberof jSketch
*/ */
saveGraphics: function(options) { saveGraphics: function(options) {
@ -477,7 +477,7 @@
}, },
/** /**
* Restores given drawing settings. * Restores given drawing settings.
* @return jSketch * @return {object} jSketch
* @memberof jSketch * @memberof jSketch
*/ */
restoreGraphics: function() { restoreGraphics: function() {
@ -491,7 +491,7 @@
* @param {string} src - Image source path. * @param {string} src - Image source path.
* @param {number} [x] - Horizontal coordinate. * @param {number} [x] - Horizontal coordinate.
* @param {number} [y] - Vertical coordinate. * @param {number} [y] - Vertical coordinate.
* @return jSketch * @return {object} jSketch
* @memberof jSketch * @memberof jSketch
*/ */
drawImage: function(src, x, y) { drawImage: function(src, x, y) {

4
package.json
View File

@ -1,11 +1,11 @@
{ {
"name": "jsketch", "name": "jsketch",
"version": "2.0.0", "version": "2.0.1",
"description": "jSketch drawing lib", "description": "jSketch drawing lib",
"scripts": { "scripts": {
"test": "echo \"Error: no test specified\" && exit 1", "test": "echo \"Error: no test specified\" && exit 1",
"dist": "grunt", "dist": "grunt",
"lint": "eslint *sketchable*.js || echo [sudo] npm i -g eslint", "lint": "eslint *sketch*.js || echo [sudo] npm i -g eslint",
"docs": "jsdoc --debug -c jsdoc.json && cp -rn figs/ docs/ || echo [sudo] npm i -g jsdoc" "docs": "jsdoc --debug -c jsdoc.json && cp -rn figs/ docs/ || echo [sudo] npm i -g jsdoc"
}, },
"repository": { "repository": {

4
sketchable.animate.js
View File

@ -89,8 +89,8 @@
if (sketch.data.firstPointSize) { if (sketch.data.firstPointSize) {
var pt = t > 0 ? nextPt : currPt; var pt = t > 0 ? nextPt : currPt;
sketch.beginFill(sketch.data.strokeStyle) sketch.beginFill(sketch.data.strokeStyle)
.fillCircle(pt.x, pt.y, sketch.data.firstPointSize) .fillCircle(pt.x, pt.y, sketch.data.firstPointSize)
.endFill(); .endFill();
} }
// Trigger step event for subsequent strokes. // Trigger step event for subsequent strokes.
if (t > 0 && typeof events.animationstep === 'function') if (t > 0 && typeof events.animationstep === 'function')

6
sketchable.js
View File

@ -517,9 +517,9 @@
// Mark visually 1st point of stroke. // Mark visually 1st point of stroke.
if (options.graphics.firstPointSize > 0) { if (options.graphics.firstPointSize > 0) {
data.sketch data.sketch
.beginFill(options.graphics.fillStyle) .beginFill(options.graphics.fillStyle)
.fillCircle(p.x, p.y, options.graphics.firstPointSize) .fillCircle(p.x, p.y, options.graphics.firstPointSize)
.endFill(); .endFill();
} }
data.sketch.isDrawing = true; data.sketch.isDrawing = true;

3
sketchable.serializer.js
View File

@ -25,7 +25,7 @@
serializer: { serializer: {
/** /**
* Save canvas data as JSON string. * Save canvas data as JSON string.
* @return {string} serialized canvas data. * @return {string} Serialized canvas data.
* @memberof Sketchable.plugins.serializer * @memberof Sketchable.plugins.serializer
* @example * @example
* var contents = sketchableInstance.serializer.save(); * var contents = sketchableInstance.serializer.save();
@ -42,6 +42,7 @@
}, },
/** /**
* Load canvas from JSON string. * Load canvas from JSON string.
* @param {string} jsonStr - JSON data saved with {@link Sketchable.plugins.serializer.save} method.
* @return {Sketchable} Sketchable element. * @return {Sketchable} Sketchable element.
* @memberof Sketchable.plugins.serializer * @memberof Sketchable.plugins.serializer
* @example * @example

2
sketchable.svg.js
View File

@ -40,7 +40,7 @@
deepExtend(instance, { deepExtend(instance, {
// Namespace methods to avoid collisions with other plugins. // Namespace methods to avoid collisions with other plugins.
svg: { svg: {
/** /**
* Generate SVG. * Generate SVG.
* @param {function} callback - Callback function, executed with the SVG (string) as argument. * @param {function} callback - Callback function, executed with the SVG (string) as argument.
* @return {Sketchable} Sketchable element. * @return {Sketchable} Sketchable element.