github/svgedit
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

- Refactoring: Avoid unnecessary addEventListener false; change internal

Browse Source 
jPicker function to class (used with `new`)
- Linting (ESLint): Add `valid-jsdoc` rule and make fixes; but turn off for
  now due to <https://github.com/eslint/eslint/issues/11036> and
  <https://github.com/eslint/eslint/issues/11037>
- Docs (JSDoc): Add some Markdown for variables, line breaks; tighten checks
  for overly generic types (though allow for `.Function` as in
  `jQuery.Function`) and avoid one previously missed instance
This commit is contained in:
Brett Zamir
2018-10-30 23:25:20 +08:00
parent 9b9c900ede
commit aef7b095ef
47 changed files with 1664 additions and 1441 deletions
Download Patch File Download Diff File Expand all files Collapse all files

23
.eslintrc
View File

@@ -24,6 +24,27 @@
"prefer-const": 2,
"no-extra-semi": 2,
"quote-props": [2, "as-needed"],
"object-curly-spacing": ["error", "never"]
"object-curly-spacing": ["error", "never"],
"valid-jsdoc": ["off", {
"prefer": {
"arg": "param",
"argument": "param",
"return": "returns",
"virtual": "abstract"
},
"preferType": {
"Boolean": "boolean",
"Number": "number",
"String": "string",
"object": "Object",
"array": "Array"
},
"requireReturn": true,
"requireReturnType": true,
"requireParamType": true,
"matchDescription": "^([A-Z][\\s\\S]*[.`?!])?$",
"requireParamDescription": false,
"requireReturnDescription": false
}]
}
}

8
CHANGES.md
View File

@@ -1,10 +1,18 @@
# ?
- Refactoring: Avoid unnecessary addEventListener `false`; change internal
jPicker function to class (used with `new`)
- Linting (ESLint): Add `valid-jsdoc` rule and make fixes; but turn off for
now due to <https://github.com/eslint/eslint/issues/11036> and
<https://github.com/eslint/eslint/issues/11037>
- Linting (ESLint compat): Add eslint-plugin-compat to get browser support
warnings
- Docs (README): Indicate minimal polyfills needed for older browsers
(IE <= 11, IE Mobile, Opera Mini, Blackberry Browser <= 10,
Android Browser 4.4.3-4.4.4)
- Docs (JSDoc): Add some Markdown for variables, line breaks; tighten checks
for overly generic types (though allow for `.Function` as in
`jQuery.Function`) and avoid one previously missed instance
- Docs (3.0.0): Clarify
- Docs (ReleaseInstructions): Clarify need for npm permissions to publish
- npm: Update devDeps

12
dist/canvg.js vendored
View File

@@ -397,7 +397,7 @@ var canvg = (function (exports) {
}
}];
/**
* A class to parse color values
* A class to parse color values.
*/
var RGBColor =
@@ -489,7 +489,7 @@ var canvg = (function (exports) {
return '#' + r + g + b;
}
/**
* help
* Offers a bulleted list of help.
* @returns {HTMLUListElement}
*/
@@ -516,7 +516,7 @@ var canvg = (function (exports) {
var listItem = document.createElement('li');
var listColor = new RGBColor(examples[_i]);
var exampleDiv = document.createElement('div');
exampleDiv.style.cssText = "margin: 3px;\nborder: 1px solid black;\nbackground: ".concat(listColor.toHex(), ";\ncolor: ").concat(listColor.toHex(), ";");
exampleDiv.style.cssText = "\nmargin: 3px;\nborder: 1px solid black;\nbackground: ".concat(listColor.toHex(), ";\ncolor: ").concat(listColor.toHex(), ";");
exampleDiv.append('test');
var listItemValue = " ".concat(examples[_i], " -> ").concat(listColor.toRGB(), " -> ").concat(listColor.toHex());
listItem.append(exampleDiv, listItemValue);
@@ -862,6 +862,7 @@ var canvg = (function (exports) {
/**
* @function module:canvg.setStackBlurCanvasRGBA
* @param {module:canvg.StackBlurCanvasRGBA} cb Will be passed the canvas ID, x, y, width, height, blurRadius
* @returns {undefined}
*/
var setStackBlurCanvasRGBA = function setStackBlurCanvasRGBA(cb) {
@@ -883,7 +884,8 @@ var canvg = (function (exports) {
*/
/**
* If called with no arguments, it will replace all `<svg>` elements on the page with `<canvas>` elements
* If called with no arguments, it will replace all `<svg>` elements on the page
* with `<canvas>` elements.
* @function module:canvg.canvg
* @param {HTMLCanvasElement|string} target canvas element or the id of a canvas element
* @param {string|XMLDocument} s: svg string, url to svg file, or xml document
@@ -936,7 +938,7 @@ var canvg = (function (exports) {
};
/**
* @param {module:canvg.CanvgOptions} opts
* @returns {object}
* @returns {Object}
* @todo Flesh out exactly what object is returned here (after updating to latest and reincluding our changes here and those of StackBlur)
*/

11
dist/extensions/ext-server_moinsave.js vendored
View File

@@ -397,7 +397,7 @@ var svgEditorExtension_server_moinsave = (function () {
}
}];
/**
* A class to parse color values
* A class to parse color values.
*/
var RGBColor =
@@ -489,7 +489,7 @@ var svgEditorExtension_server_moinsave = (function () {
return '#' + r + g + b;
}
/**
* help
* Offers a bulleted list of help.
* @returns {HTMLUListElement}
*/
@@ -516,7 +516,7 @@ var svgEditorExtension_server_moinsave = (function () {
var listItem = document.createElement('li');
var listColor = new RGBColor(examples[_i]);
var exampleDiv = document.createElement('div');
exampleDiv.style.cssText = "margin: 3px;\nborder: 1px solid black;\nbackground: ".concat(listColor.toHex(), ";\ncolor: ").concat(listColor.toHex(), ";");
exampleDiv.style.cssText = "\nmargin: 3px;\nborder: 1px solid black;\nbackground: ".concat(listColor.toHex(), ";\ncolor: ").concat(listColor.toHex(), ";");
exampleDiv.append('test');
var listItemValue = " ".concat(examples[_i], " -> ").concat(listColor.toRGB(), " -> ").concat(listColor.toHex());
listItem.append(exampleDiv, listItemValue);
@@ -860,7 +860,8 @@ var svgEditorExtension_server_moinsave = (function () {
*/
/**
* If called with no arguments, it will replace all `<svg>` elements on the page with `<canvas>` elements
* If called with no arguments, it will replace all `<svg>` elements on the page
* with `<canvas>` elements.
* @function module:canvg.canvg
* @param {HTMLCanvasElement|string} target canvas element or the id of a canvas element
* @param {string|XMLDocument} s: svg string, url to svg file, or xml document
@@ -913,7 +914,7 @@ var svgEditorExtension_server_moinsave = (function () {
};
/**
* @param {module:canvg.CanvgOptions} opts
* @returns {object}
* @returns {Object}
* @todo Flesh out exactly what object is returned here (after updating to latest and reincluding our changes here and those of StackBlur)
*/

11
dist/extensions/ext-server_opensave.js vendored
View File

@@ -397,7 +397,7 @@ var svgEditorExtension_server_opensave = (function () {
}
}];
/**
* A class to parse color values
* A class to parse color values.
*/
var RGBColor =
@@ -489,7 +489,7 @@ var svgEditorExtension_server_opensave = (function () {
return '#' + r + g + b;
}
/**
* help
* Offers a bulleted list of help.
* @returns {HTMLUListElement}
*/
@@ -516,7 +516,7 @@ var svgEditorExtension_server_opensave = (function () {
var listItem = document.createElement('li');
var listColor = new RGBColor(examples[_i]);
var exampleDiv = document.createElement('div');
exampleDiv.style.cssText = "margin: 3px;\nborder: 1px solid black;\nbackground: ".concat(listColor.toHex(), ";\ncolor: ").concat(listColor.toHex(), ";");
exampleDiv.style.cssText = "\nmargin: 3px;\nborder: 1px solid black;\nbackground: ".concat(listColor.toHex(), ";\ncolor: ").concat(listColor.toHex(), ";");
exampleDiv.append('test');
var listItemValue = " ".concat(examples[_i], " -> ").concat(listColor.toRGB(), " -> ").concat(listColor.toHex());
listItem.append(exampleDiv, listItemValue);
@@ -860,7 +860,8 @@ var svgEditorExtension_server_opensave = (function () {
*/
/**
* If called with no arguments, it will replace all `<svg>` elements on the page with `<canvas>` elements
* If called with no arguments, it will replace all `<svg>` elements on the page
* with `<canvas>` elements.
* @function module:canvg.canvg
* @param {HTMLCanvasElement|string} target canvas element or the id of a canvas element
* @param {string|XMLDocument} s: svg string, url to svg file, or xml document
@@ -913,7 +914,7 @@ var svgEditorExtension_server_opensave = (function () {
};
/**
* @param {module:canvg.CanvgOptions} opts
* @returns {object}
* @returns {Object}
* @todo Flesh out exactly what object is returned here (after updating to latest and reincluding our changes here and those of StackBlur)
*/

3
dist/extensions/ext-storage.js vendored
View File

@@ -135,6 +135,7 @@ var svgEditorExtension_storage = (function () {
* content into storage)
* 2. Use localStorage to set SVG contents (potentially too large to allow in cookies)
* 3. Use localStorage (where available) or cookies to set preferences.
* @returns {undefined}
*/
@@ -177,7 +178,7 @@ var svgEditorExtension_storage = (function () {
}
}
}
}, false);
});
}
var loaded = false;

2
dist/extensions/ext-xdomain-messaging.js vendored
View File

@@ -86,7 +86,7 @@ var svgEditorExtension_xdomain_messaging = (function () {
}
e.source.postMessage(JSON.stringify(message), '*');
}, false);
});
} catch (err) {
console.log('Error with xdomain message listener: ' + err);
}

498
dist/index-es.js vendored
View File

File diff suppressed because it is too large Load Diff

2
dist/index-es.min.js vendored
View File

File diff suppressed because one or more lines are too long

2
dist/index-es.min.js.map vendored
View File

File diff suppressed because one or more lines are too long

498
dist/index-umd.js vendored
View File

File diff suppressed because it is too large Load Diff

2
dist/index-umd.min.js vendored
View File

File diff suppressed because one or more lines are too long

2
dist/index-umd.min.js.map vendored
View File

File diff suppressed because one or more lines are too long

6
dist/jspdf.plugin.svgToPdf.js vendored
View File

@@ -254,7 +254,7 @@
}
}];
/**
* A class to parse color values
* A class to parse color values.
*/
var RGBColor =
@@ -346,7 +346,7 @@
return '#' + r + g + b;
}
/**
* help
* Offers a bulleted list of help.
* @returns {HTMLUListElement}
*/
@@ -373,7 +373,7 @@
var listItem = document.createElement('li');
var listColor = new RGBColor(examples[_i]);
var exampleDiv = document.createElement('div');
exampleDiv.style.cssText = "margin: 3px;\nborder: 1px solid black;\nbackground: ".concat(listColor.toHex(), ";\ncolor: ").concat(listColor.toHex(), ";");
exampleDiv.style.cssText = "\nmargin: 3px;\nborder: 1px solid black;\nbackground: ".concat(listColor.toHex(), ";\ncolor: ").concat(listColor.toHex(), ";");
exampleDiv.append('test');
var listItemValue = " ".concat(examples[_i], " -> ").concat(listColor.toRGB(), " -> ").concat(listColor.toHex());
listItem.append(exampleDiv, listItemValue);

2
editor/browser.js
View File

@@ -271,7 +271,7 @@ export const supportsNonScalingStroke = () => supportsNonScalingStroke_;
export const supportsNativeTransformLists = () => supportsNativeSVGTransformLists_;
/**
* Set `supportsNativeSVGTransformLists_` to `false` (for unit testing)
* Set `supportsNativeSVGTransformLists_` to `false` (for unit testing).
* @function module:browser.disableSupportsNativeTransformLists
* @returns {undefined}
*/

6
editor/canvg/canvg.js
View File

@@ -31,6 +31,7 @@ let canvasRGBA_ = canvasRGBA;
/**
* @function module:canvg.setStackBlurCanvasRGBA
* @param {module:canvg.StackBlurCanvasRGBA} cb Will be passed the canvas ID, x, y, width, height, blurRadius
* @returns {undefined}
*/
export const setStackBlurCanvasRGBA = (cb) => {
canvasRGBA_ = cb;
@@ -52,7 +53,8 @@ export const setStackBlurCanvasRGBA = (cb) => {
*/
/**
* If called with no arguments, it will replace all `<svg>` elements on the page with `<canvas>` elements
* If called with no arguments, it will replace all `<svg>` elements on the page
* with `<canvas>` elements.
* @function module:canvg.canvg
* @param {HTMLCanvasElement|string} target canvas element or the id of a canvas element
* @param {string|XMLDocument} s: svg string, url to svg file, or xml document
@@ -102,7 +104,7 @@ export const canvg = function (target, s, opts) {
/**
* @param {module:canvg.CanvgOptions} opts
* @returns {object}
* @returns {Object}
* @todo Flesh out exactly what object is returned here (after updating to latest and reincluding our changes here and those of StackBlur)
*/
function build (opts) {

8
editor/canvg/rgbcolor.js
View File

@@ -189,7 +189,7 @@ const colorDefs = [
];
/**
* A class to parse color values
* A class to parse color values.
*/
export default class RGBColor {
/**
@@ -253,7 +253,7 @@ export default class RGBColor {
}
/**
* help
* Offers a bulleted list of help.
* @returns {HTMLUListElement}
*/
getHelpXML () {
@@ -275,8 +275,8 @@ export default class RGBColor {
const listItem = document.createElement('li');
const listColor = new RGBColor(examples[i]);
const exampleDiv = document.createElement('div');
exampleDiv.style.cssText =
`margin: 3px;
exampleDiv.style.cssText = `
margin: 3px;
border: 1px solid black;
background: ${listColor.toHex()};
color: ${listColor.toHex()};`

17
editor/contextmenu/jQuery.contextMenu.js
View File

@@ -35,7 +35,12 @@ import {isMac} from '../browser.js';
*/
/**
* Adds {@link external:jQuery.fn.contextMenu}, {@link external:jQuery.fn.disableContextMenuItems}, {@link external:jQuery.fn.enableContextMenuItems}, {@link external:jQuery.fn.disableContextMenu}, {@link external:jQuery.fn.enableContextMenu}, {@link external:jQuery.fn.destroyContextMenu}
* Adds {@link external:jQuery.fn.contextMenu},
* {@link external:jQuery.fn.disableContextMenuItems},
* {@link external:jQuery.fn.enableContextMenuItems},
* {@link external:jQuery.fn.disableContextMenu},
* {@link external:jQuery.fn.enableContextMenu},
* {@link external:jQuery.fn.destroyContextMenu}.
* @function module:jQueryContextMenu.jQueryContextMenu
* @param {external:jQuery} $ The jQuery object to wrap (with `contextMenu`, `disableContextMenuItems`, `enableContextMenuItems`, `disableContextMenu`, `enableContextMenu`, `destroyContextMenu`)
* @returns {external:jQuery}
@@ -170,7 +175,7 @@ function jQueryContextMenu ($) {
},
/**
* Disable context menu items on the fly
* Disable context menu items on the fly.
* @memberof external:jQuery.fn
* @param {undefined|string} o Comma-separated
* @returns {external:jQuery}
@@ -193,7 +198,7 @@ function jQueryContextMenu ($) {
},
/**
* Enable context menu items on the fly
* Enable context menu items on the fly.
* @memberof external:jQuery.fn
* @param {undefined|string} o Comma-separated
* @returns {external:jQuery}
@@ -216,7 +221,7 @@ function jQueryContextMenu ($) {
},
/**
* Disable context menu(s)
* Disable context menu(s).
* @memberof external:jQuery.fn
* @returns {external:jQuery}
*/
@@ -228,7 +233,7 @@ function jQueryContextMenu ($) {
},
/**
* Enable context menu(s)
* Enable context menu(s).
* @memberof external:jQuery.fn
* @returns {external:jQuery}
*/
@@ -240,7 +245,7 @@ function jQueryContextMenu ($) {
},
/**
* Destroy context menu(s)
* Destroy context menu(s).
* @memberof external:jQuery.fn
* @returns {external:jQuery}
*/

3
editor/coords.js
View File

@@ -41,13 +41,14 @@ let editorContext_ = null;
/**
* @function module:coords.init
* @param {module:coords.EditorContext} editorContext
* @returns {undefined}
*/
export const init = function (editorContext) {
editorContext_ = editorContext;
};
/**
* Applies coordinate changes to an element based on the given matrix
* Applies coordinate changes to an element based on the given matrix.
* @function module:coords.remapElement
* @implements {module:path.EditorContext#remapElement}
*/

15
editor/draw.js
View File

@@ -67,7 +67,7 @@ function getNewLayerName (existingLayerNames) {
}
/**
* This class encapsulates the concept of a SVG-edit drawing
* This class encapsulates the concept of a SVG-edit drawing.
*/
export class Drawing {
/**
@@ -184,7 +184,7 @@ export class Drawing {
}
/**
* Clears any previously set nonce
* Clears any previously set nonce.
* @returns {undefined}
*/
clearNonce () {
@@ -276,7 +276,7 @@ export class Drawing {
}
/**
* Check if layer with given name already exists
* Check if layer with given name already exists.
* @param {string} name - The layer name to check
* @returns {boolean}
*/
@@ -302,6 +302,7 @@ export class Drawing {
/**
* Get a layer by name.
* @param {string} name
* @returns {SVGGElement} The SVGGElement representing the named layer or null.
*/
getLayerByName (name) {
@@ -663,7 +664,7 @@ export class Drawing {
}
/**
* Create a clone of an element, updating its ID and its children's IDs when needed
* Create a clone of an element, updating its ID and its children's IDs when needed.
* @param {Element} el - DOM element to clone
* @returns {Element}
*/
@@ -767,7 +768,7 @@ export const init = function (canvas) {
};
/**
* Updates layer system
* Updates layer system.
* @function module:draw.identifyLayers
* @returns {undefined}
*/
@@ -980,7 +981,7 @@ export const mergeAllLayers = function (hrService) {
/**
* Return from a group context to the regular kind, make any previously
* disabled elements enabled again
* disabled elements enabled again.
* @function module:draw.leaveContext
* @fires module:svgcanvas.SvgCanvas#event:contextset
* @returns {undefined}
@@ -1006,7 +1007,7 @@ export const leaveContext = function () {
};
/**
* Set the current context (for in-group editing)
* Set the current context (for in-group editing).
* @function module:draw.setContext
* @param {Element} elem
* @fires module:svgcanvas.SvgCanvas#event:contextset

2
editor/embedapi-dom.js
View File

@@ -1,6 +1,6 @@
/* globals jQuery */
/**
* Attaches items to DOM for Embedded SVG support
* Attaches items to DOM for Embedded SVG support.
* @module EmbeddedSVGEditDOM
*/
import EmbeddedSVGEdit from './embedapi.js';

10
editor/embedapi.js
View File

@@ -17,7 +17,7 @@ let cbid = 0;
*/
/**
* @param {string} d
* @param {string} funcName
* @returns {module:EmbeddedSVGEdit.CallbackSetGetter}
*/
function getCallbackSetter (funcName) {
@@ -34,7 +34,7 @@ function getCallbackSetter (funcName) {
/**
* Having this separate from messageListener allows us to
* avoid using JSON parsing (and its limitations) in the case
* of same domain control
* of same domain control.
* @param {module:EmbeddedSVGEdit.EmbeddedSVGEdit} t The `this` value
* @param {JSON} data
* @returns {undefined}
@@ -89,9 +89,9 @@ function getMessageListener (t) {
}
/**
* Embedded SVG-edit API
* Embedded SVG-edit API.
* General usage:
- Have an iframe somewhere pointing to a version of svg-edit > r1000
* - Have an iframe somewhere pointing to a version of svg-edit > r1000.
* @example
// Initialize the magic with:
@@ -318,7 +318,7 @@ class EmbeddedSVGEdit {
}
// Older IE may need a polyfill for addEventListener, but so it would for SVG
window.addEventListener('message', getMessageListener(this), false);
window.addEventListener('message', getMessageListener(this));
window.addEventListener('keydown', (e) => {
const {key, keyCode, charCode, which} = e;
if (e.key === 'Backspace') {

3
editor/extensions/ext-connector.js
View File

@@ -148,7 +148,8 @@ export default {
/**
*
* @param {Element[]} [elem=selElems] Array of elements
* @param {Element[]} [elems=selElems] Array of elements
* @returns {undefined}
*/
function findConnectors (elems = selElems) {
const connectors = $(svgcontent).find(connSel);

3
editor/extensions/ext-storage.js
View File

@@ -101,6 +101,7 @@ export default {
* content into storage)
* 2. Use localStorage to set SVG contents (potentially too large to allow in cookies)
* 3. Use localStorage (where available) or cookies to set preferences.
* @returns {undefined}
*/
function setupBeforeUnloadListener () {
window.addEventListener('beforeunload', function (e) {
@@ -135,7 +136,7 @@ export default {
}
}
}
}, false);
});
}
let loaded = false;

2
editor/extensions/ext-xdomain-messaging.js
View File

@@ -40,7 +40,7 @@ export default {
message.error = err.message;
}
e.source.postMessage(JSON.stringify(message), '*');
}, false);
});
} catch (err) {
console.log('Error with xdomain message listener: ' + err);
}

45
editor/history.js
View File

@@ -21,7 +21,7 @@ export const HistoryEventTypes = {
// const removedElements = {};
/**
* Base class for commands
* Base class for commands.
*/
class Command {
/**
@@ -97,7 +97,7 @@ class Command {
*/
/**
* History command for an element that had its DOM position changed
* History command for an element that had its DOM position changed.
* @implements {module:history.HistoryCommand}
* @param {Element} elem - The DOM element that was moved
* @param {Element} oldNextSibling - The element's next sibling before it was moved
@@ -119,7 +119,7 @@ export class MoveElementCommand extends Command {
}
/**
* Re-positions the element
* Re-positions the element.
* @param {module:history.HistoryEventHandler} handler
* @fires module:history~Command#event:history
* @returns {undefined}
@@ -138,7 +138,7 @@ export class MoveElementCommand extends Command {
}
/**
* Positions the element back to its original location
* Positions the element back to its original location.
* @param {module:history.HistoryEventHandler} handler
* @fires module:history~Command#event:history
* @returns {undefined}
@@ -165,7 +165,7 @@ export class MoveElementCommand extends Command {
MoveElementCommand.type = MoveElementCommand.prototype.type;
/**
* History command for an element that was added to the DOM
* History command for an element that was added to the DOM.
* @implements {module:history.HistoryCommand}
*
* @param {Element} elem - The newly added DOM element
@@ -185,7 +185,7 @@ export class InsertElementCommand extends Command {
}
/**
* Re-inserts the new element
* Re-inserts the new element.
* @param {module:history.HistoryEventHandler} handler
* @fires module:history~Command#event:history
* @returns {undefined}
@@ -203,7 +203,7 @@ export class InsertElementCommand extends Command {
}
/**
* Removes the element
* Removes the element.
* @param {module:history.HistoryEventHandler} handler
* @fires module:history~Command#event:history
* @returns {undefined}
@@ -231,7 +231,7 @@ export class InsertElementCommand extends Command {
InsertElementCommand.type = InsertElementCommand.prototype.type;
/**
* History command for an element removed from the DOM
* History command for an element removed from the DOM.
* @implements {module:history.HistoryCommand}
* @param {Element} elem - The removed DOM element
* @param {Node} oldNextSibling - The DOM element's nextSibling when it was in the DOM
@@ -254,7 +254,7 @@ export class RemoveElementCommand extends Command {
}
/**
* Re-removes the new element
* Re-removes the new element.
* @param {module:history.HistoryEventHandler} handler
* @fires module:history~Command#event:history
* @returns {undefined}
@@ -274,7 +274,7 @@ export class RemoveElementCommand extends Command {
}
/**
* Re-adds the new element
* Re-adds the new element.
* @param {module:history.HistoryEventHandler} handler
* @fires module:history~Command#event:history
* @returns {undefined}
@@ -343,7 +343,7 @@ export class ChangeElementCommand extends Command {
}
/**
* Performs the stored change action
* Performs the stored change action.
* @param {module:history.HistoryEventHandler} handler
* @fires module:history~Command#event:history
* @returns {true}
@@ -397,7 +397,7 @@ export class ChangeElementCommand extends Command {
}
/**
* Reverses the stored change action
* Reverses the stored change action.
* @param {module:history.HistoryEventHandler} handler
* @fires module:history~Command#event:history
* @returns {true}
@@ -464,7 +464,7 @@ ChangeElementCommand.type = ChangeElementCommand.prototype.type;
// and they both affect the same element, then collapse the two commands into one
/**
* History command that can contain/execute multiple other commands
* History command that can contain/execute multiple other commands.
* @implements {module:history.HistoryCommand}
*/
export class BatchCommand extends Command {
@@ -482,7 +482,7 @@ export class BatchCommand extends Command {
}
/**
* Runs "apply" on all subcommands
* Runs "apply" on all subcommands.
* @param {module:history.HistoryEventHandler} handler
* @fires module:history~Command#event:history
* @returns {undefined}
@@ -503,7 +503,7 @@ export class BatchCommand extends Command {
}
/**
* Runs "unapply" on all subcommands
* Runs "unapply" on all subcommands.
* @param {module:history.HistoryEventHandler} handler
* @fires module:history~Command#event:history
* @returns {undefined}
@@ -523,7 +523,7 @@ export class BatchCommand extends Command {
}
/**
* Iterate through all our subcommands
* Iterate through all our subcommands.
* @returns {Element[]} All the elements we are changing
*/
elements () {
@@ -540,8 +540,9 @@ export class BatchCommand extends Command {
}
/**
* Adds a given command to the history stack
* Adds a given command to the history stack.
* @param {Command} cmd - The undo command object to add
* @returns {undefined}
*/
addSubCommand (cmd) {
this.stack.push(cmd);
@@ -575,7 +576,7 @@ export class UndoManager {
}
/**
* Resets the undo stack, effectively clearing the undo/redo history
* Resets the undo stack, effectively clearing the undo/redo history.
* @returns {undefined}
*/
resetUndoStack () {
@@ -612,7 +613,7 @@ export class UndoManager {
}
/**
* Performs an undo step
* Performs an undo step.
* @returns {undefined}
*/
undo () {
@@ -623,7 +624,7 @@ export class UndoManager {
}
/**
* Performs a redo step
* Performs a redo step.
* @returns {undefined}
*/
redo () {
@@ -634,7 +635,7 @@ export class UndoManager {
}
/**
* Adds a command object to the undo history stack
* Adds a command object to the undo history stack.
* @param {Command} cmd - The command object to add
* @returns {undefined}
*/
@@ -683,7 +684,7 @@ export class UndoManager {
/**
* This function returns a `BatchCommand` object which summarizes the
* change since `beginUndoableChange` was called. The command can then
* be added to the command history
* be added to the command history.
* @returns {BatchCommand} Batch command object with resulting changes
*/
finishUndoableChange () {

8
editor/historyrecording.js
View File

@@ -85,7 +85,7 @@ class HistoryRecordingService {
}
/**
* Add a MoveElementCommand to the history or current batch command
* Add a `MoveElementCommand` to the history or current batch command.
* @param {Element} elem - The DOM element that was moved
* @param {Element} oldNextSibling - The element's next sibling before it was moved
* @param {Element} oldParent - The element's parent before it was moved
@@ -99,7 +99,7 @@ class HistoryRecordingService {
}
/**
* Add an InsertElementCommand to the history or current batch command
* Add an `InsertElementCommand` to the history or current batch command.
* @param {Element} elem - The DOM element that was added
* @param {string} [text] - An optional string visible to user related to this change
* @returns {module:history.HistoryRecordingService}
@@ -111,7 +111,7 @@ class HistoryRecordingService {
}
/**
* Add a RemoveElementCommand to the history or current batch command
* Add a `RemoveElementCommand` to the history or current batch command.
* @param {Element} elem - The DOM element that was removed
* @param {Element} oldNextSibling - The element's next sibling before it was removed
* @param {Element} oldParent - The element's parent before it was removed
@@ -125,7 +125,7 @@ class HistoryRecordingService {
}
/**
* Add a ChangeElementCommand to the history or current batch command
* Add a `ChangeElementCommand` to the history or current batch command.
* @param {Element} elem - The DOM element that was changed
* @param {module:history.CommandAttributes} attrs - An object with the attributes to be changed and the values they had *before* the change
* @param {string} [text] - An optional string visible to user related to this change

4
editor/jQuery.attr.js
View File

@@ -8,12 +8,12 @@
* This fixes `$(...).attr()` to work as expected with SVG elements.
* Does not currently use `*AttributeNS()` since we rarely need that.
* Adds {@link external:jQuery.fn.attr}.
* See {@link https://api.jquery.com/attr/} for basic documentation of `.attr()`
* See {@link https://api.jquery.com/attr/} for basic documentation of `.attr()`.
*
* Additional functionality:
* - When getting attributes, a string that's a number is returned as type number.
* - If an array is supplied as the first parameter, multiple values are returned
* as an object with values for each given attribute
* as an object with values for each given attribute.
* @function module:jQueryAttr.jQueryAttr
* @param {external:jQuery} $ The jQuery object to which to add the plug-in
* @returns {external:jQuery}

4
editor/jgraduate/jQuery.jGraduate.js
View File

@@ -42,7 +42,9 @@ if (!window.console) {
}
/**
* Adds {@link external:jQuery.jGraduate.Paint}, {@link external:jQuery.fn.jGraduateDefaults}, {@link external:jQuery.fn.jGraduate}
* Adds {@link external:jQuery.jGraduate.Paint},
* {@link external:jQuery.fn.jGraduateDefaults},
* {@link external:jQuery.fn.jGraduate}.
* @function module:jGraduate.jGraduate
* @param {external:jQuery} $ The jQuery instance to wrap
* @returns {external:jQuery}

454
editor/jgraduate/jQuery.jPicker.js
View File

@@ -60,250 +60,253 @@ const jPicker = function ($) {
/**
* Encapsulate slider functionality for the ColorMap and ColorBar -
* could be useful to use a jQuery UI draggable for this with certain extensions
* could be useful to use a jQuery UI draggable for this with certain extensions.
* @param {external:jQuery} bar
* @param {module:jPicker.SliderOptions} options
* @returns {undefined}
*/
function Slider (bar, options) {
const $this = this;
function fireChangeEvents (context) {
for (let i = 0; i < changeEvents.length; i++) {
changeEvents[i].call($this, $this, context);
class Slider {
constructor (bar, options) {
const $this = this;
function fireChangeEvents (context) {
for (let i = 0; i < changeEvents.length; i++) {
changeEvents[i].call($this, $this, context);
}
}
}
// bind the mousedown to the bar not the arrow for quick snapping to the clicked location
function mouseDown (e) {
const off = bar.offset();
offset = {l: off.left | 0, t: off.top | 0};
clearTimeout(timeout);
// using setTimeout for visual updates - once the style is updated the browser will re-render internally allowing the next Javascript to run
timeout = setTimeout(function () {
setValuesFromMousePosition.call($this, e);
}, 0);
// Bind mousemove and mouseup event to the document so it responds when dragged of of the bar - we will unbind these when on mouseup to save processing
$(document).bind('mousemove', mouseMove).bind('mouseup', mouseUp);
e.preventDefault(); // don't try to select anything or drag the image to the desktop
}
// set the values as the mouse moves
function mouseMove (e) {
clearTimeout(timeout);
timeout = setTimeout(function () {
setValuesFromMousePosition.call($this, e);
}, 0);
e.stopPropagation();
e.preventDefault();
return false;
}
// unbind the document events - they aren't needed when not dragging
function mouseUp (e) {
$(document).unbind('mouseup', mouseUp).unbind('mousemove', mouseMove);
e.stopPropagation();
e.preventDefault();
return false;
}
// calculate mouse position and set value within the current range
function setValuesFromMousePosition (e) {
const barW = bar.w, // local copies for YUI compressor
barH = bar.h;
let locX = e.pageX - offset.l,
locY = e.pageY - offset.t;
// keep the arrow within the bounds of the bar
if (locX < 0) locX = 0;
else if (locX > barW) locX = barW;
if (locY < 0) locY = 0;
else if (locY > barH) locY = barH;
val.call($this, 'xy', {x: ((locX / barW) * rangeX) + minX, y: ((locY / barH) * rangeY) + minY});
}
function draw () {
const
barW = bar.w,
barH = bar.h,
arrowW = arrow.w,
arrowH = arrow.h;
let arrowOffsetX = 0,
arrowOffsetY = 0;
setTimeout(function () {
if (rangeX > 0) { // range is greater than zero
// constrain to bounds
if (x === maxX) arrowOffsetX = barW;
else arrowOffsetX = ((x / rangeX) * barW) | 0;
// bind the mousedown to the bar not the arrow for quick snapping to the clicked location
function mouseDown (e) {
const off = bar.offset();
offset = {l: off.left | 0, t: off.top | 0};
clearTimeout(timeout);
// using setTimeout for visual updates - once the style is updated the browser will re-render internally allowing the next Javascript to run
timeout = setTimeout(function () {
setValuesFromMousePosition.call($this, e);
}, 0);
// Bind mousemove and mouseup event to the document so it responds when dragged of of the bar - we will unbind these when on mouseup to save processing
$(document).bind('mousemove', mouseMove).bind('mouseup', mouseUp);
e.preventDefault(); // don't try to select anything or drag the image to the desktop
}
// set the values as the mouse moves
function mouseMove (e) {
clearTimeout(timeout);
timeout = setTimeout(function () {
setValuesFromMousePosition.call($this, e);
}, 0);
e.stopPropagation();
e.preventDefault();
return false;
}
// unbind the document events - they aren't needed when not dragging
function mouseUp (e) {
$(document).unbind('mouseup', mouseUp).unbind('mousemove', mouseMove);
e.stopPropagation();
e.preventDefault();
return false;
}
// calculate mouse position and set value within the current range
function setValuesFromMousePosition (e) {
const barW = bar.w, // local copies for YUI compressor
barH = bar.h;
let locX = e.pageX - offset.l,
locY = e.pageY - offset.t;
// keep the arrow within the bounds of the bar
if (locX < 0) locX = 0;
else if (locX > barW) locX = barW;
if (locY < 0) locY = 0;
else if (locY > barH) locY = barH;
val.call($this, 'xy', {x: ((locX / barW) * rangeX) + minX, y: ((locY / barH) * rangeY) + minY});
}
function draw () {
const
barW = bar.w,
barH = bar.h,
arrowW = arrow.w,
arrowH = arrow.h;
let arrowOffsetX = 0,
arrowOffsetY = 0;
setTimeout(function () {
if (rangeX > 0) { // range is greater than zero
// constrain to bounds
if (x === maxX) arrowOffsetX = barW;
else arrowOffsetX = ((x / rangeX) * barW) | 0;
}
if (rangeY > 0) { // range is greater than zero
// constrain to bounds
if (y === maxY) arrowOffsetY = barH;
else arrowOffsetY = ((y / rangeY) * barH) | 0;
}
// if arrow width is greater than bar width, center arrow and prevent horizontal dragging
if (arrowW >= barW) arrowOffsetX = (barW >> 1) - (arrowW >> 1); // number >> 1 - superfast bitwise divide by two and truncate (move bits over one bit discarding lowest)
else arrowOffsetX -= arrowW >> 1;
// if arrow height is greater than bar height, center arrow and prevent vertical dragging
if (arrowH >= barH) arrowOffsetY = (barH >> 1) - (arrowH >> 1);
else arrowOffsetY -= arrowH >> 1;
// set the arrow position based on these offsets
arrow.css({left: arrowOffsetX + 'px', top: arrowOffsetY + 'px'});
}, 0);
}
function val (name, value, context) {
const set = value !== undefined;
if (!set) {
if (name === undefined || name == null) name = 'xy';
switch (name.toLowerCase()) {
case 'x': return x;
case 'y': return y;
case 'xy':
default: return {x, y};
}
}
if (rangeY > 0) { // range is greater than zero
// constrain to bounds
if (y === maxY) arrowOffsetY = barH;
else arrowOffsetY = ((y / rangeY) * barH) | 0;
}
// if arrow width is greater than bar width, center arrow and prevent horizontal dragging
if (arrowW >= barW) arrowOffsetX = (barW >> 1) - (arrowW >> 1); // number >> 1 - superfast bitwise divide by two and truncate (move bits over one bit discarding lowest)
else arrowOffsetX -= arrowW >> 1;
// if arrow height is greater than bar height, center arrow and prevent vertical dragging
if (arrowH >= barH) arrowOffsetY = (barH >> 1) - (arrowH >> 1);
else arrowOffsetY -= arrowH >> 1;
// set the arrow position based on these offsets
arrow.css({left: arrowOffsetX + 'px', top: arrowOffsetY + 'px'});
}, 0);
}
function val (name, value, context) {
const set = value !== undefined;
if (!set) {
if (name === undefined || name == null) name = 'xy';
if (context != null && context === $this) return;
let changed = false;
let newX, newY;
if (name == null) name = 'xy';
switch (name.toLowerCase()) {
case 'x': return x;
case 'y': return y;
case 'x':
newX = (value && ((value.x && value.x | 0) || value | 0)) || 0;
break;
case 'y':
newY = (value && ((value.y && value.y | 0) || value | 0)) || 0;
break;
case 'xy':
default: return {x, y};
default:
newX = (value && value.x && value.x | 0) || 0;
newY = (value && value.y && value.y | 0) || 0;
break;
}
}
if (context != null && context === $this) return;
let changed = false;
let newX, newY;
if (name == null) name = 'xy';
switch (name.toLowerCase()) {
case 'x':
newX = (value && ((value.x && value.x | 0) || value | 0)) || 0;
break;
case 'y':
newY = (value && ((value.y && value.y | 0) || value | 0)) || 0;
break;
case 'xy':
default:
newX = (value && value.x && value.x | 0) || 0;
newY = (value && value.y && value.y | 0) || 0;
break;
}
if (newX != null) {
if (newX < minX) newX = minX;
else if (newX > maxX) newX = maxX;
if (x !== newX) {
x = newX;
changed = true;
if (newX != null) {
if (newX < minX) newX = minX;
else if (newX > maxX) newX = maxX;
if (x !== newX) {
x = newX;
changed = true;
}
}
}
if (newY != null) {
if (newY < minY) newY = minY;
else if (newY > maxY) newY = maxY;
if (y !== newY) {
y = newY;
changed = true;
if (newY != null) {
if (newY < minY) newY = minY;
else if (newY > maxY) newY = maxY;
if (y !== newY) {
y = newY;
changed = true;
}
}
changed && fireChangeEvents.call($this, context || $this);
}
changed && fireChangeEvents.call($this, context || $this);
}
function range (name, value) {
const set = value !== undefined;
if (!set) {
if (name === undefined || name == null) name = 'all';
function range (name, value) {
const set = value !== undefined;
if (!set) {
if (name === undefined || name == null) name = 'all';
switch (name.toLowerCase()) {
case 'minx': return minX;
case 'maxx': return maxX;
case 'rangex': return {minX, maxX, rangeX};
case 'miny': return minY;
case 'maxy': return maxY;
case 'rangey': return {minY, maxY, rangeY};
case 'all':
default: return {minX, maxX, rangeX, minY, maxY, rangeY};
}
}
let // changed = false,
newMinX,
newMaxX,
newMinY,
newMaxY;
if (name == null) name = 'all';
switch (name.toLowerCase()) {
case 'minx': return minX;
case 'maxx': return maxX;
case 'rangex': return {minX, maxX, rangeX};
case 'miny': return minY;
case 'maxy': return maxY;
case 'rangey': return {minY, maxY, rangeY};
case 'minx':
newMinX = (value && ((value.minX && value.minX | 0) || value | 0)) || 0;
break;
case 'maxx':
newMaxX = (value && ((value.maxX && value.maxX | 0) || value | 0)) || 0;
break;
case 'rangex':
newMinX = (value && value.minX && value.minX | 0) || 0;
newMaxX = (value && value.maxX && value.maxX | 0) || 0;
break;
case 'miny':
newMinY = (value && ((value.minY && value.minY | 0) || value | 0)) || 0;
break;
case 'maxy':
newMaxY = (value && ((value.maxY && value.maxY | 0) || value | 0)) || 0;
break;
case 'rangey':
newMinY = (value && value.minY && value.minY | 0) || 0;
newMaxY = (value && value.maxY && value.maxY | 0) || 0;
break;
case 'all':
default: return {minX, maxX, rangeX, minY, maxY, rangeY};
default:
newMinX = (value && value.minX && value.minX | 0) || 0;
newMaxX = (value && value.maxX && value.maxX | 0) || 0;
newMinY = (value && value.minY && value.minY | 0) || 0;
newMaxY = (value && value.maxY && value.maxY | 0) || 0;
break;
}
if (newMinX != null && minX !== newMinX) {
minX = newMinX;
rangeX = maxX - minX;
}
if (newMaxX != null && maxX !== newMaxX) {
maxX = newMaxX;
rangeX = maxX - minX;
}
if (newMinY != null && minY !== newMinY) {
minY = newMinY;
rangeY = maxY - minY;
}
if (newMaxY != null && maxY !== newMaxY) {
maxY = newMaxY;
rangeY = maxY - minY;
}
}
let // changed = false,
newMinX,
newMaxX,
newMinY,
newMaxY;
if (name == null) name = 'all';
switch (name.toLowerCase()) {
case 'minx':
newMinX = (value && ((value.minX && value.minX | 0) || value | 0)) || 0;
break;
case 'maxx':
newMaxX = (value && ((value.maxX && value.maxX | 0) || value | 0)) || 0;
break;
case 'rangex':
newMinX = (value && value.minX && value.minX | 0) || 0;
newMaxX = (value && value.maxX && value.maxX | 0) || 0;
break;
case 'miny':
newMinY = (value && ((value.minY && value.minY | 0) || value | 0)) || 0;
break;
case 'maxy':
newMaxY = (value && ((value.maxY && value.maxY | 0) || value | 0)) || 0;
break;
case 'rangey':
newMinY = (value && value.minY && value.minY | 0) || 0;
newMaxY = (value && value.maxY && value.maxY | 0) || 0;
break;
case 'all':
default:
newMinX = (value && value.minX && value.minX | 0) || 0;
newMaxX = (value && value.maxX && value.maxX | 0) || 0;
newMinY = (value && value.minY && value.minY | 0) || 0;
newMaxY = (value && value.maxY && value.maxY | 0) || 0;
break;
function bind (callback) {
if (typeof callback === 'function') changeEvents.push(callback);
}
if (newMinX != null && minX !== newMinX) {
minX = newMinX;
rangeX = maxX - minX;
function unbind (callback) {
if (typeof callback !== 'function') return;
let i;
while ((i = changeEvents.includes(callback))) changeEvents.splice(i, 1);
}
if (newMaxX != null && maxX !== newMaxX) {
maxX = newMaxX;
rangeX = maxX - minX;
function destroy () {
// unbind all possible events and null objects
$(document).unbind('mouseup', mouseUp).unbind('mousemove', mouseMove);
bar.unbind('mousedown', mouseDown);
bar = null;
arrow = null;
changeEvents = null;
}
if (newMinY != null && minY !== newMinY) {
minY = newMinY;
rangeY = maxY - minY;
}
if (newMaxY != null && maxY !== newMaxY) {
maxY = newMaxY;
rangeY = maxY - minY;
}
}
function bind (callback) {
if (typeof callback === 'function') changeEvents.push(callback);
}
function unbind (callback) {
if (typeof callback !== 'function') return;
let i;
while ((i = changeEvents.includes(callback))) changeEvents.splice(i, 1);
}
function destroy () {
// unbind all possible events and null objects
$(document).unbind('mouseup', mouseUp).unbind('mousemove', mouseMove);
bar.unbind('mousedown', mouseDown);
bar = null;
arrow = null;
changeEvents = null;
}
let offset,
timeout,
x = 0,
y = 0,
minX = 0,
maxX = 100,
rangeX = 100,
minY = 0,
maxY = 100,
rangeY = 100,
arrow = bar.find('img:first'), // the arrow image to drag
changeEvents = [];
let offset,
timeout,
x = 0,
y = 0,
minX = 0,
maxX = 100,
rangeX = 100,
minY = 0,
maxY = 100,
rangeY = 100,
arrow = bar.find('img:first'), // the arrow image to drag
changeEvents = [];
$.extend(true, $this, // public properties, methods, and event bindings - these we need to access from other controls
{
val,
range,
bind,
unbind,
destroy
}
);
// initialize this control
arrow.src = options.arrow && options.arrow.image;
arrow.w = (options.arrow && options.arrow.width) || arrow.width();
arrow.h = (options.arrow && options.arrow.height) || arrow.height();
bar.w = (options.map && options.map.width) || bar.width();
bar.h = (options.map && options.map.height) || bar.height();
// bind mousedown event
bar.bind('mousedown', mouseDown);
bind.call($this, draw);
$.extend(true, $this, // public properties, methods, and event bindings - these we need to access from other controls
{
val,
range,
bind,
unbind,
destroy
}
);
// initialize this control
arrow.src = options.arrow && options.arrow.image;
arrow.w = (options.arrow && options.arrow.width) || arrow.width();
arrow.h = (options.arrow && options.arrow.height) || arrow.height();
bar.w = (options.map && options.map.width) || bar.width();
bar.h = (options.map && options.map.height) || bar.height();
// bind mousedown event
bar.bind('mousedown', mouseDown);
bind.call($this, draw);
}
}
// controls for all the input elements for the typing in color values
function ColorValuePicker (picker, color, bindedHex, alphaPrecision) {
@@ -1047,6 +1050,7 @@ const jPicker = function ($) {
*
* @param {"h"|"s"|"v"|"r"|"g"|"b"|"a"} colorMode [description]
* @throws {Error} Invalid mode
* @returns {undefined}
*/
function setColorMode (colorMode) {
const {active} = color, // local copies for YUI compressor

20
editor/math.js
View File

@@ -30,7 +30,7 @@ const svg = document.createElementNS(NS.SVG, 'svg');
/**
* A (hopefully) quicker function to transform a point by a matrix
* (this function avoids any DOM calls and just does the math)
* (this function avoids any DOM calls and just does the math).
* @function module:math.transformPoint
* @param {Float} x - Float representing the x coordinate
* @param {Float} y - Float representing the y coordinate
@@ -43,7 +43,7 @@ export const transformPoint = function (x, y, m) {
/**
* Helper function to check if the matrix performs no actual transform
* (i.e. exists for identity purposes)
* (i.e. exists for identity purposes).
* @function module:math.isIdentity
* @param {SVGMatrix} m - The matrix object to check
* @returns {boolean} Indicates whether or not the matrix is 1,0,0,1,0,0
@@ -54,7 +54,7 @@ export const isIdentity = function (m) {
/**
* This function tries to return a `SVGMatrix` that is the multiplication `m1 * m2`.
* We also round to zero when it's near zero
* We also round to zero when it's near zero.
* @function module:math.matrixMultiply
* @param {...SVGMatrix} args - Matrix objects to multiply
* @returns {SVGMatrix} The matrix object resulting from the calculation
@@ -75,7 +75,7 @@ export const matrixMultiply = function (...args) {
};
/**
* See if the given transformlist includes a non-indentity matrix transform
* See if the given transformlist includes a non-indentity matrix transform.
* @function module:math.hasMatrixTransform
* @param {SVGTransformList} [tlist] - The transformlist to check
* @returns {boolean} Whether or not a matrix transform was found
@@ -104,7 +104,7 @@ export const hasMatrixTransform = function (tlist) {
*/
/**
* Transforms a rectangle based on the given matrix
* Transforms a rectangle based on the given matrix.
* @function module:math.transformBox
* @param {Float} l - Float with the box's left coordinate
* @param {Float} t - Float with the box's top coordinate
@@ -142,7 +142,7 @@ export const transformBox = function (l, t, w, h, m) {
* This returns a single matrix Transform for a given Transform List
* (this is the equivalent of `SVGTransformList.consolidate()` but unlike
* that method, this one does not modify the actual `SVGTransformList`).
* This function is very liberal with its `min`, `max` arguments
* This function is very liberal with its `min`, `max` arguments.
* @function module:math.transformListToTransform
* @param {SVGTransformList} tlist - The transformlist object
* @param {Integer} [min=0] - Optional integer indicating start transform position
@@ -172,7 +172,7 @@ export const transformListToTransform = function (tlist, min, max) {
};
/**
* Get the matrix object for a given element
* Get the matrix object for a given element.
* @function module:math.getMatrix
* @param {Element} elem - The DOM element to check
* @returns {SVGMatrix} The matrix object associated with the element's transformlist
@@ -184,11 +184,11 @@ export const getMatrix = function (elem) {
/**
* Returns a 45 degree angle coordinate associated with the two given
* coordinates
* coordinates.
* @function module:math.snapToAngle
* @param {Integer} x1 - First coordinate's x value
* @param {Integer} x2 - Second coordinate's x value
* @param {Integer} y1 - First coordinate's y value
* @param {Integer} x2 - Second coordinate's x value
* @param {Integer} y2 - Second coordinate's y value
* @returns {module:math.AngleCoord45}
*/
@@ -208,7 +208,7 @@ export const snapToAngle = function (x1, y1, x2, y2) {
};
/**
* Check if two rectangles (BBoxes objects) intersect each other
* Check if two rectangles (BBoxes objects) intersect each other.
* @function module:math.rectsIntersect
* @param {SVGRect} r1 - The first BBox-like object
* @param {SVGRect} r2 - The second BBox-like object

31
editor/path.js
View File

@@ -344,7 +344,7 @@ export const getPointFromGrip = function (pt, path) {
/**
* Requires prior call to `setUiStrings` if `xlink:title`
* to be set on the grip
* to be set on the grip.
* @function module:path.addPointGrip
* @param {Integer} index
* @param {Integer} x
@@ -409,7 +409,7 @@ export const getGripContainer = function () {
/**
* Requires prior call to `setUiStrings` if `xlink:title`
* to be set on the grip
* to be set on the grip.
* @function module:path.addCtrlGrip
* @param {string} id
* @returns {SVGCircleElement}
@@ -533,6 +533,7 @@ export const getControlPoints = function (seg) {
* @param {Integer} index
* @param {ArgumentsArray} pts
* @param {SVGPathElement} elem
* @returns {undefined}
*/
export const replacePathSeg = function (type, index, pts, elem) {
const pth = elem || path.elem;
@@ -616,7 +617,7 @@ export const getSegSelector = function (seg, update) {
*/
/**
* Takes three points and creates a smoother line based on them
* Takes three points and creates a smoother line based on them.
* @function module:path.smoothControlPoints
* @param {Point} ct1 - Object with x and y values (first control point)
* @param {Point} ct2 - Object with x and y values (second control point)
@@ -854,6 +855,7 @@ export class Segment {
/**
* @param {Integer} newType Possible values set during {@link module:path.init}
* @param {ArgumentsArray} pts
* @returns {undefined}
*/
setType (newType, pts) {
replacePathSeg(newType, this.index, pts);
@@ -870,7 +872,7 @@ export class Segment {
*/
export class Path {
/**
* @param {SVGPathElement}
* @param {SVGPathElement} elem
* @throws {Error} If constructed without a path element
*/
constructor (elem) {
@@ -887,7 +889,7 @@ export class Path {
}
/**
* Reset path data
* Reset path data.
* @returns {module:path.Path}
*/
init () {
@@ -1131,7 +1133,7 @@ export class Path {
}
/**
* Move selected points
* Move selected points.
* @param {Integer} dx
* @param {Integer} dy
* @returns {undefined}
@@ -1252,7 +1254,7 @@ export class Path {
}
/**
* Update position of all points
* Update position of all points.
* @returns {Path}
*/
update () {
@@ -1494,7 +1496,7 @@ const pathMap = [0, 'z', 'M', 'm', 'L', 'l', 'C', 'c', 'Q', 'q', 'A', 'a',
'H', 'h', 'V', 'v', 'S', 's', 'T', 't'];
/**
* Convert a path to one with only absolute or relative values
* Convert a path to one with only absolute or relative values.
* @todo move to pathActions.js
* @function module:path.convertPath
* @param {SVGPathElement} path - the path to convert
@@ -1655,11 +1657,11 @@ export const convertPath = function (path, toRel) {
};
/**
* TODO: refactor callers in convertPath to use getPathDFromSegments instead of this function.
* Legacy code refactored from svgcanvas.pathActions.convertPath
* TODO: refactor callers in `convertPath` to use `getPathDFromSegments` instead of this function.
* Legacy code refactored from `svgcanvas.pathActions.convertPath`.
* @param {string} letter - path segment command (letter in potentially either case from {@link module:path.pathMap}; see [SVGPathSeg#pathSegTypeAsLetter]{@link https://www.w3.org/TR/SVG/single-page.html#paths-__svg__SVGPathSeg__pathSegTypeAsLetter})
* @param {Integer[][]} points - x,y points
* @param {Integer[][]} [morePoints] - x,y points
* @param {GenericArray<Integer>[]} points - x,y points
* @param {GenericArray<Integer>[]} [morePoints] - x,y points
* @param {Integer[]} [lastPoint] - x,y point
* @returns {string}
*/
@@ -1695,7 +1697,7 @@ export const pathActions = (function () {
/**
* This function converts a polyline (created by the fh_path tool) into
* a path element and coverts every three line segments into a single bezier
* curve in an attempt to smooth out the free-hand
* curve in an attempt to smooth out the free-hand.
* @function smoothPolylineIntoPath
* @param {Element} element
* @returns {Element}
@@ -2215,7 +2217,7 @@ export const pathActions = (function () {
subpath = false;
},
/**
* @param {Element} element
* @param {Element} elem
* @fires module:svgcanvas.SvgCanvas#event:selected
* @returns {undefined}
*/
@@ -2614,6 +2616,7 @@ export const pathActions = (function () {
*/
smoothPolylineIntoPath,
/**
* @param {?Integer} v See {@link https://www.w3.org/TR/SVG/single-page.html#paths-InterfaceSVGPathSeg}
* @returns {undefined}
*/
setSegType (v) {

4
editor/recalculate.js
View File

@@ -49,7 +49,7 @@ export const init = function (editorContext) {
};
/**
* Updates a `<clipPath>`s values based on the given translation of an element
* Updates a `<clipPath>`s values based on the given translation of an element.
* @function module:recalculate.updateClipPath
* @param {string} attr - The clip-path attribute value with the clipPath's ID
* @param {Float} tx - The translation's x value
@@ -69,7 +69,7 @@ export const updateClipPath = function (attr, tx, ty) {
};
/**
* Decides the course of action based on the element's transform list
* Decides the course of action based on the element's transform list.
* @function module:recalculate.recalculateDimensions
* @param {Element} selected - The DOM element to recalculate
* @returns {Command} Undo command object with the resulting change

23
editor/select.js
View File

@@ -20,7 +20,7 @@ let selectorManager_; // A Singleton
const gripRadius = isTouch() ? 10 : 4;
/**
* Private class for DOM element selection boxes
* Private class for DOM element selection boxes.
*/
export class Selector {
/**
@@ -76,9 +76,10 @@ export class Selector {
}
/**
* Used to reset the id and element that the selector is attached to
* Used to reset the id and element that the selector is attached to.
* @param {Element} e - DOM element associated with this selector
* @param {module:utilities.BBoxObject} bbox - Optional bbox to use for reset (prevents duplicate getBBox call).
* @returns {undefined}
*/
reset (e, bbox) {
this.locked = true;
@@ -88,8 +89,9 @@ export class Selector {
}
/**
* Updates cursors for corner grips on rotation so arrows point the right way
* Updates cursors for corner grips on rotation so arrows point the right way.
* @param {Float} angle - Current rotation angle in degrees
* @returns {undefined}
*/
updateGripCursors (angle) {
let dir;
@@ -111,9 +113,9 @@ export class Selector {
}
/**
* Show the resize grips of this selector
*
* Show the resize grips of this selector.
* @param {boolean} show - Indicates whether grips should be shown or not
* @returns {undefined}
*/
showGrips (show) {
const bShow = show ? 'inline' : 'none';
@@ -127,8 +129,9 @@ export class Selector {
}
/**
* Updates the selector to match the element's size
* Updates the selector to match the element's size.
* @param {module:utilities.BBoxObject} [bbox] - BBox to use for resize (prevents duplicate getBBox call).
* @returns {undefined}
*/
resize (bbox) {
const selectedBox = this.selectorRect,
@@ -261,7 +264,7 @@ export class Selector {
}
/**
* Manage all selector objects (selection boxes)
* Manage all selector objects (selection boxes).
*/
export class SelectorManager {
constructor () {
@@ -297,7 +300,8 @@ export class SelectorManager {
}
/**
* Resets the parent selector group element
* Resets the parent selector group element.
* @returns {undefined}
*/
initGroup () {
// remove old selector parent group if it existed
@@ -440,9 +444,10 @@ export class SelectorManager {
}
/**
* Removes the selector of the given element (hides selection box)
* Removes the selector of the given element (hides selection box).
*
* @param {Element} elem - DOM element to remove the selector for
* @returns {undefined}
*/
releaseSelector (elem) {
if (elem == null) { return; }

2
editor/spinbtn/jQuery.SpinButton.js
View File

@@ -314,7 +314,7 @@ export default function ($) {
}
e.preventDefault();
}, false);
});
}
});
};

47
editor/svg-editor.js
View File

@@ -355,7 +355,7 @@ function getImportLocale ({defaultLang, defaultName}) {
*/
/**
* Store and retrieve preferences
* Store and retrieve preferences.
* @param {string} key The preference name to be retrieved or set
* @param {string} [val] The value. If the value supplied is missing or falsey, no change to the preference will be made.
* @returns {string} If val is missing or falsey, the value of the previously stored preference will be returned.
@@ -619,7 +619,7 @@ editor.randomizeIds = function (arg) {
};
/**
* Auto-run after a Promise microtask
* Auto-run after a Promise microtask.
* @returns {undefined}
*/
editor.init = function () {
@@ -747,7 +747,7 @@ editor.init = function () {
})();
/**
* Called internally
* Called internally.
* @param {string|Element|external:jQuery} elem
* @param {string|external:jQuery} iconId
* @param {Float} forcedSize Not in use
@@ -1789,11 +1789,11 @@ editor.init = function () {
}
/**
* This is a common function used when a tool has been clicked (chosen)
* This is a common function used when a tool has been clicked (chosen).
* It does several common things:
* - removes the `tool_button_current` class from whatever tool currently has it
* - hides any flyouts
* - adds the `tool_button_current` class to the button passed in
* - Removes the `tool_button_current` class from whatever tool currently has it.
* - Hides any flyouts.
* - Adds the `tool_button_current` class to the button passed in.
* @function module:SVGEDitor.toolButtonClick
* @param {string|Element} button The DOM element or string selector representing the toolbar button
* @param {boolean} noHiding Whether not to hide any flyouts
@@ -1835,7 +1835,7 @@ editor.init = function () {
};
/**
* Set a selected image's URL
* Set a selected image's URL.
* @function module:SVGEditor.setImageURL
* @param {string} url
* @returns {undefined}
@@ -2771,7 +2771,7 @@ editor.init = function () {
const allHolders = {};
/**
* @param {Object.<string, module:SVGEditor.ToolButton>} holders Key is a selector
* @param {GenericObject.<string, module:SVGEditor.ToolButton>} holders Key is a selector
* @returns {undefined}
*/
const setupFlyouts = function (holders) {
@@ -2800,7 +2800,7 @@ editor.init = function () {
if (opts.isDefault) { def = i; }
/**
* Clicking the icon in flyout should set this set's icon
* Clicking the icon in flyout should set this set's icon.
* @param {Event} ev
* @returns {undefined}
*/
@@ -4472,7 +4472,7 @@ editor.init = function () {
};
/**
* Save user preferences based on current values in the UI
* Save user preferences based on current values in the UI.
* @function module:SVGEditor.savePreferences
* @returns {undefined}
*/
@@ -5013,7 +5013,7 @@ editor.init = function () {
};
/**
* If width is non-zero, then fully close it, otherwise fully open it
* If width is non-zero, then fully close it; otherwise fully open it.
* @param {boolean} close Forces the side panel closed
* @returns {undefined}
*/
@@ -5628,10 +5628,10 @@ editor.init = function () {
e.returnValue = uiStrings.notification.unsavedChanges; // Firefox needs this when beforeunload set by addEventListener (even though message is not used)
return uiStrings.notification.unsavedChanges;
}
}, false);
});
/**
* Expose the uiStrings
* Expose the `uiStrings`.
* @function module:SVGEditor.canvas.getUIStrings
* @returns {module:SVGEditor.uiStrings}
*/
@@ -5752,10 +5752,10 @@ editor.init = function () {
}
};
workarea[0].addEventListener('dragenter', onDragEnter, false);
workarea[0].addEventListener('dragover', onDragOver, false);
workarea[0].addEventListener('dragleave', onDragLeave, false);
workarea[0].addEventListener('drop', importImage, false);
workarea[0].addEventListener('dragenter', onDragEnter);
workarea[0].addEventListener('dragover', onDragOver);
workarea[0].addEventListener('dragleave', onDragLeave);
workarea[0].addEventListener('drop', importImage);
const open = $('<input type="file">').click(function () {
const f = this;
@@ -5861,9 +5861,9 @@ editor.init = function () {
*/
{
/**
* Gets an array of results from extensions with a `addLangData` method
* Gets an array of results from extensions with a `addLangData` method,
* returning an object with a `data` property set to its locales (to be
* merged with regular locales)
* merged with regular locales).
* @param {string} langParam
* @fires module:svgcanvas.SvgCanvas#event:ext-addLangData
* @todo Can we forego this in favor of `langReady` (or forego `langReady`)?
@@ -5875,8 +5875,7 @@ editor.init = function () {
/**
* @function
* @type {module:svgcanvas.ExtensionVarBuilder}
* @param {string} defaultLang
* @param {string} defaultName
* @param {string} name
* @returns {module:svgcanvas.SvgCanvas#event:ext-addLangData}
*/
(name) => { // We pass in a function as we don't know the extension name here when defining this `addLangData` method
@@ -5908,7 +5907,7 @@ editor.init = function () {
/**
* Queues a callback to be invoked when the editor is ready (or
* to be invoked immediately if it is already ready--i.e.,
* if `svgEditor.runCallbacks` has been run)
* if `svgEditor.runCallbacks` has been run).
* @param {module:SVGEditor.ReadyCallback} cb Callback to be queued to invoke
* @returns {undefined}
*/
@@ -5942,7 +5941,7 @@ editor.loadFromString = function (str) {
};
/**
* Not presently in use
* Not presently in use.
* @param {PlainObject} featList
* @returns {undefined}
*/

184
editor/svgcanvas.js
View File

@@ -81,7 +81,7 @@ if (window.opera) {
}
/**
* The main SvgCanvas class that manages all SVG-related functions
* The main SvgCanvas class that manages all SVG-related functions.
* @memberof module:svgcanvas
*
* @borrows module:coords.remapElement as #remapElement
@@ -200,7 +200,7 @@ clearSvgContentElement();
let idprefix = 'svg_';
/**
* Changes the ID prefix to the given value
* Changes the ID prefix to the given value.
* @function module:svgcanvas.SvgCanvas#setIdPrefix
* @param {string} p - String with the new prefix
* @returns {undefined}
@@ -303,7 +303,7 @@ const getJsonFromSvgElement = this.getJsonFromSvgElement = function (data) {
};
/**
* This should really be an intersection implementing all rather than a union
* This should really be an intersection implementing all rather than a union.
* @function module:svgcanvas.SvgCanvas#addSVGElementFromJson
* @implements {module:utilities.EditorContext#addSVGElementFromJson|module:path.EditorContext#addSVGElementFromJson}
*/
@@ -382,13 +382,13 @@ unitsInit(
canvas.convertToNum = convertToNum;
/**
* This should really be an intersection implementing all rather than a union
* This should really be an intersection implementing all rather than a union.
* @implements {module:draw.DrawCanvasInit#getSVGContent|module:utilities.EditorContext#getSVGContent}
*/
const getSVGContent = () => { return svgcontent; };
/**
* Should really be an intersection with all needing to apply rather than a union
* Should really be an intersection with all needing to apply rather than a union.
* @function module:svgcanvas.SvgCanvas#getSelectedElements
* @implements {module:utilities.EditorContext#getSelectedElements|module:draw.DrawCanvasInit#getSelectedElements|module:path.EditorContext#getSelectedElements}
*/
@@ -399,7 +399,7 @@ const getSelectedElements = this.getSelectedElems = function () {
const pathActions = pathModule.pathActions;
/**
* This should actually be an intersection as all interfaces should be met
* This should actually be an intersection as all interfaces should be met.
* @implements {module:utilities.EditorContext#getSVGRoot|module:recalculate.EditorContext#getSVGRoot|module:coords.EditorContext#getSVGRoot|module:path.EditorContext#getSVGRoot}
*/
const getSVGRoot = () => svgroot;
@@ -435,7 +435,7 @@ canvas.assignAttributes = assignAttributes;
this.cleanupElement = cleanupElement;
/**
* This should actually be an intersection not a union as all should apply
* This should actually be an intersection not a union as all should apply.
* @implements {module:coords.EditorContext|module:path.EditorContext}
*/
const getGridSnapping = () => { return curConfig.gridSnapping; };
@@ -541,7 +541,7 @@ const undoMgr = canvas.undoMgr = new UndoManager({
});
/**
* This should really be an intersection applying to all types rather than a union
* This should really be an intersection applying to all types rather than a union.
* @function module:svgcanvas~addCommandToHistory
* @implements {module:path.EditorContext#addCommandToHistory|module:draw.DrawCanvasInit#addCommandToHistory}
*/
@@ -550,7 +550,7 @@ const addCommandToHistory = function (cmd) {
};
/**
* This should really be an intersection applying to all types rather than a union
* This should really be an intersection applying to all types rather than a union.
* @function module:svgcanvas.SvgCanvas#getZoom
* @implements {module:path.EditorContext#getCurrentZoom|module:select.SVGFactory#getCurrentZoom}
*/
@@ -602,7 +602,7 @@ const getId = canvas.getId = function () {
};
/**
* The "implements" should really be an intersection applying to all types rather than a union
* The "implements" should really be an intersection applying to all types rather than a union.
* @function module:svgcanvas.SvgCanvas#call
* @implements {module:draw.DrawCanvasInit#call|module:path.EditorContext#call}
* @param {"selected"|"changed"|"contextset"|"pointsAdded"|"extension_added"|"extensions_added"|"message"|"transition"|"zoomed"|"updateCanvas"|"zoomDone"|"saved"|"exported"|"exportedPDF"|"setnonce"|"unsetnonce"|"cleared"} ev - String with the event name
@@ -617,7 +617,7 @@ const call = function (ev, arg) {
/**
* Clears the selection. The 'selected' handler is then optionally called.
* This should really be an intersection applying to all types rather than a union
* This should really be an intersection applying to all types rather than a union.
* @function module:svgcanvas.SvgCanvas#clearSelection
* @implements {module:draw.DrawCanvasInit#clearSelection|module:path.EditorContext#clearSelection}
* @fires module:svgcanvas.SvgCanvas#event:selected
@@ -818,6 +818,7 @@ pathModule.init(
* @param {SVGCircleElement[]} grips
* @fires module:svgcanvas.SvgCanvas#event:pointsAdded
* @fires module:svgcanvas.SvgCanvas#event:selected
* @returns {undefined}
*/
addPtsToSelection ({closedSubpath, grips}) {
// TODO: Correct this:
@@ -1114,7 +1115,7 @@ const runExtensions = this.runExtensions = function (action, vars, returnArray)
* @returns {Promise} Resolves to [ExtensionInitResponse]{@link module:svgcanvas.ExtensionInitResponse} or `undefined`
*/
/**
* Add an extension to the editor
* Add an extension to the editor.
* @function module:svgcanvas.SvgCanvas#addExtension
* @param {string} name - String with the ID of the extension. Used internally; no need for i18n.
* @param {module:svgcanvas.ExtensionInitCallback} [extInitFunc] - Function supplied by the extension with its data
@@ -1167,7 +1168,7 @@ this.addExtension = async function (name, extInitFunc, importLocale) {
* We brute-force `getIntersectionList` for browsers that do not support it (Firefox).
*
* Reference:
* Firefox does not implement `getIntersectionList()`, see {@link https://bugzilla.mozilla.org/show_bug.cgi?id=501421}
* Firefox does not implement `getIntersectionList()`, see {@link https://bugzilla.mozilla.org/show_bug.cgi?id=501421}.
* @function module:svgcanvas.SvgCanvas#getIntersectionList
* @param {SVGRect} rect
* @returns {Element[]|NodeList} Bbox elements
@@ -1240,7 +1241,7 @@ this.getVisibleElements = getVisibleElements;
/**
* Get all elements that have a BBox (excludes `<defs>`, `<title>`, etc).
* Note that 0-opacity, off-screen etc elements are still considered "visible"
* for this function
* for this function.
* @function module:svgcanvas.SvgCanvas#getVisibleElementsAndBBoxes
* @param {Element} parent - The parent DOM element to search within
* @returns {ElementAndBBox[]} An array with objects that include:
@@ -1259,7 +1260,7 @@ const getVisibleElementsAndBBoxes = this.getVisibleElementsAndBBoxes = function
};
/**
* Wrap an SVG element into a group element, mark the group as 'gsvg'
* Wrap an SVG element into a group element, mark the group as 'gsvg'.
* @function module:svgcanvas.SvgCanvas#groupSvgElem
* @param {Element} elem - SVG element to wrap
* @returns {undefined}
@@ -1390,7 +1391,7 @@ canvas.call = call;
*/
/**
* Attaches a callback function to an event
* Attaches a callback function to an event.
* @function module:svgcanvas.SvgCanvas#bind
* @param {"changed"|"contextset"|"selected"|"pointsAdded"|"extension_added"|"extensions_added"|"message"|"transition"|"zoomed"|"updateCanvas"|"zoomDone"|"saved"|"exported"|"exportedPDF"|"setnonce"|"unsetnonce"|"cleared"} ev - String indicating the name of the event
* @param {module:svgcanvas.EventHandler} f - The callback function to bind to the event
@@ -1449,7 +1450,7 @@ const ffClone = function (elem) {
/**
* Removes any old rotations if present, prepends a new rotation at the
* transformed center
* transformed center.
* @function module:svgcanvas.SvgCanvas#setRotationAngle
* @param {string|Float} val - The new rotation angle in degrees
* @param {boolean} preventUndo - Indicates whether the action should be undoable or not
@@ -1505,7 +1506,7 @@ this.setRotationAngle = function (val, preventUndo) {
/**
* Runs `recalculateDimensions` on the selected elements,
* adding the changes to a single batch command
* adding the changes to a single batch command.
* @function module:svgcanvas.SvgCanvas#recalculateAllSelectedDimensions
* @fires module:svgcanvas.SvgCanvas#event:changed
* @returns {undefined}
@@ -1531,7 +1532,7 @@ const recalculateAllSelectedDimensions = this.recalculateAllSelectedDimensions =
};
/**
* Debug tool to easily see the current matrix in the browser's console
* Debug tool to easily see the current matrix in the browser's console.
* @function module:svgcanvas~logMatrix
* @param {SVGMatrix} m The matrix
* @returns {undefined}
@@ -1550,7 +1551,7 @@ let rootSctm = null;
// TODO: do we need to worry about selectedBBoxes here?
/**
* Selects only the given elements, shortcut for clearSelection(); addToSelection()
* Selects only the given elements, shortcut for `clearSelection(); addToSelection()`.
* @function module:svgcanvas.SvgCanvas#selectOnly
* @param {Element[]} elems - an array of DOM elements to be selected
* @param {boolean} showGrips - Indicates whether the resize grips should be shown
@@ -1669,10 +1670,11 @@ const getBsplinePoint = function (t) {
};
};
/**
* Follows these conditions:
* - When we are in a create mode, the element is added to the canvas but the
* action is not recorded until mousing up.
* - When we are in select mode, select the element, remember the position
* and do nothing else
* and do nothing else.
* @param {MouseEvent} evt
* @fires module:svgcanvas.SvgCanvas#event:ext-mouseDown
* @returns {undefined}
@@ -3254,7 +3256,7 @@ return /** @lends module:svgcanvas.SvgCanvas#textActions */ {
setEndSelectionFromPoint(pt.x, pt.y);
},
/**
* @param {external:MouseEvent}
* @param {external:MouseEvent} evt
* @param {Float} mouseX
* @param {Float} mouseY
* @returns {undefined}
@@ -3498,7 +3500,7 @@ const removeUnusedDefElems = this.removeUnusedDefElems = function () {
};
/**
* Main function to set up the SVG content for output
* Main function to set up the SVG content for output.
* @function module:svgcanvas.SvgCanvas#svgCanvasToString
* @returns {string} The SVG image for output
*/
@@ -3552,7 +3554,7 @@ this.svgCanvasToString = function () {
};
/**
* Sub function ran on each SVG element to convert it to a string as desired
* Sub function ran on each SVG element to convert it to a string as desired.
* @function module:svgcanvas.SvgCanvas#svgToString
* @param {Element} elem - The SVG element to convert
* @param {Integer} indent - Number of spaces to indent this tag
@@ -3732,7 +3734,7 @@ this.svgToString = function (elem, indent) {
* @returns {undefined}
*/
/**
* Converts a given image file to a data URL when possible, then runs a given callback
* Converts a given image file to a data URL when possible, then runs a given callback.
* @function module:svgcanvas.SvgCanvas#embedImage
* @param {string} src - The path/URL of the image
* @param {module:svgcanvas.ImageEmbeddedCallback} [callback] - Function to run when image data is found
@@ -3768,7 +3770,7 @@ this.embedImage = function (src, callback) {
};
/**
* Sets a given URL to be a "last good image" URL
* Sets a given URL to be a "last good image" URL.
* @function module:svgcanvas.SvgCanvas#setGoodImage
* @param {string} val
* @returns {undefined}
@@ -3778,7 +3780,7 @@ this.setGoodImage = function (val) {
};
/**
* Does nothing by default, handled by optional widget/extension
* Does nothing by default, handled by optional widget/extension.
* @function module:svgcanvas.SvgCanvas#open
* @returns {undefined}
*/
@@ -3807,7 +3809,14 @@ this.save = function (opts) {
};
/**
* Codes only is useful for locale-independent detection
* @typedef {GenericObject} module:svgcanvas.IssuesAndCodes
* @property {string[]} issueCodes The locale-independent code names
* @property {string[]} issues The localized descriptions
*/
/**
* Codes only is useful for locale-independent detection.
* @returns {module:svgcanvas.IssuesAndCodes}
*/
function getIssues () {
// remove the selected outline before serializing
@@ -3865,7 +3874,7 @@ let canvg;
/**
* Generates a PNG (or JPG, BMP, WEBP) Data URL based on the current image,
* then calls "exported" with an object including the string, image
* information, and any issues found
* information, and any issues found.
* @function module:svgcanvas.SvgCanvas#rasterExport
* @param {"PNG"|"JPEG"|"BMP"|"WEBP"|"ICO"} [imgType="PNG"]
* @param {Float} [quality] Between 0 and 1
@@ -3960,7 +3969,7 @@ this.rasterExport = function (imgType, quality, exportWindowName, cb, opts = {})
*/
/**
* Generates a PDF based on the current image, then calls "exportedPDF" with
* an object including the string, the data URL, and any issues found
* an object including the string, the data URL, and any issues found.
* @function module:svgcanvas.SvgCanvas#exportPDF
* @param {string} [exportWindowName] Will also be used for the download file name here
* @param {external:jsPDF.OutputType} [outputType="dataurlstring"]
@@ -4048,7 +4057,7 @@ this.getSvgString = function () {
* This function determines whether to use a nonce in the prefix, when
* generating IDs for future documents in SVG-Edit.
* If you're controlling SVG-Edit externally, and want randomized IDs, call
* this BEFORE calling svgCanvas.setSvgString
* this BEFORE calling `svgCanvas.setSvgString`.
* @function module:svgcanvas.SvgCanvas#randomizeIds
* @param {boolean} [enableRandomization] If true, adds a nonce to the prefix. Thus
* `svgCanvas.randomizeIds() <==> svgCanvas.randomizeIds(true)`
@@ -4063,7 +4072,7 @@ this.randomizeIds = function (enableRandomization) {
};
/**
* Ensure each element has a unique ID
* Ensure each element has a unique ID.
* @function module:svgcanvas.SvgCanvas#uniquifyElems
* @param {Element} g - The parent element of the tree to give unique IDs
* @returns {undefined}
@@ -4157,7 +4166,7 @@ const uniquifyElems = this.uniquifyElems = function (g) {
};
/**
* Assigns reference data for each use element
* Assigns reference data for each use element.
* @function module:svgcanvas.SvgCanvas#setUseData
* @param {Element} parent
* @returns {undefined}
@@ -4181,7 +4190,7 @@ const setUseData = this.setUseData = function (parent) {
};
/**
* Converts gradients from userSpaceOnUse to objectBoundingBox
* Converts gradients from userSpaceOnUse to objectBoundingBox.
* @function module:svgcanvas.SvgCanvas#convertGradients
* @param {Element} elem
* @returns {undefined}
@@ -4259,7 +4268,7 @@ const convertGradients = this.convertGradients = function (elem) {
};
/**
* Converts selected/given `<use>` or child SVG element to a group
* Converts selected/given `<use>` or child SVG element to a group.
* @function module:svgcanvas.SvgCanvas#convertToGroup
* @param {Element} elem
* @fires module:svgcanvas.SvgCanvas#event:selected
@@ -4831,7 +4840,7 @@ this.getVersion = function () {
};
/**
* Update interface strings with given values
* Update interface strings with given values.
* @function module:svgcanvas.SvgCanvas#setUiStrings
* @param {module:path.uiStrings} strs - Object with strings (see the [locales API]{@link module:locale.LocaleStrings} and the [tutorial]{@tutorial LocaleDocs})
* @returns {undefined}
@@ -4842,7 +4851,7 @@ this.setUiStrings = function (strs) {
};
/**
* Update configuration options with given values
* Update configuration options with given values.
* @function module:svgcanvas.SvgCanvas#setConfig
* @param {module:SVGEditor.Config} opts - Object with options
* @returns {undefined}
@@ -4870,7 +4879,7 @@ this.getTitle = function (elem) {
};
/**
* Sets the group/SVG's title content
* Sets the group/SVG's title content.
* @function module:svgcanvas.SvgCanvas#setGroupTitle
* @param {string} val
* @todo Combine this with `setDocumentTitle`
@@ -4916,7 +4925,7 @@ const getDocumentTitle = this.getDocumentTitle = function () {
/**
* Adds/updates a title element for the document with the given name.
* This is an undoable action
* This is an undoable action.
* @function module:svgcanvas.SvgCanvas#setDocumentTitle
* @param {string} newTitle - String with the new title
* @returns {undefined}
@@ -4951,7 +4960,7 @@ this.setDocumentTitle = function (newTitle) {
};
/**
* Returns the editor's namespace URL, optionally adding it to the root element
* Returns the editor's namespace URL, optionally adding it to the root element.
* @function module:svgcanvas.SvgCanvas#getEditorNS
* @param {boolean} [add] - Indicates whether or not to add the namespace value
* @returns {string} The editor's namespace URL
@@ -4964,10 +4973,10 @@ this.getEditorNS = function (add) {
};
/**
* Changes the document's dimensions to the given size
* Changes the document's dimensions to the given size.
* @function module:svgcanvas.SvgCanvas#setResolution
* @param {Float|"fit"} x - Number with the width of the new dimensions in user units.
* Can also be the string "fit" to indicate "fit to content"
* Can also be the string "fit" to indicate "fit to content".
* @param {Float} y - Number with the height of the new dimensions in user units.
* @fires module:svgcanvas.SvgCanvas#event:changed
* @returns {boolean} Indicates if resolution change was successful.
@@ -5047,7 +5056,7 @@ this.getOffset = function () {
* @property {module:utilities.BBoxObject} bbox
*/
/**
* Sets the zoom level on the canvas-side based on the given value
* Sets the zoom level on the canvas-side based on the given value.
* @function module:svgcanvas.SvgCanvas#setBBoxZoom
* @param {"selection"|"canvas"|"content"|"layer"|module:SVGEditor.BBoxObjectWithFactor} val - Bounding box object to zoom to or string indicating zoom option. Note: the object value type is defined in `svg-editor.js`
* @param {Integer} editorW - The editor's workarea box's width
@@ -5170,7 +5179,7 @@ this.setBBoxZoom = function (val, editorW, editorH) {
*/
/**
* Sets the zoom to the given level
* Sets the zoom to the given level.
* @function module:svgcanvas.SvgCanvas#setZoom
* @param {Float} zoomLevel - Float indicating the zoom level to change to
* @fires module:svgcanvas.SvgCanvas#event:ext-zoomChanged
@@ -5197,7 +5206,7 @@ this.getMode = function () {
};
/**
* Sets the editor's mode to the given string
* Sets the editor's mode to the given string.
* @function module:svgcanvas.SvgCanvas#setMode
* @param {string} name - String with the new mode to change to
* @returns {undefined}
@@ -5228,7 +5237,7 @@ this.getColor = function (type) {
};
/**
* Change the current stroke/fill color/gradient value
* Change the current stroke/fill color/gradient value.
* @function module:svgcanvas.SvgCanvas#setColor
* @param {string} type - String indicating fill or stroke
* @param {string} val - The value to set the stroke attribute to
@@ -5273,7 +5282,7 @@ this.setColor = function (type, val, preventUndo) {
};
/**
* Apply the current gradient to selected element's fill or stroke
* Apply the current gradient to selected element's fill or stroke.
* @function module:svgcanvas.SvgCanvas#setGradient
* @param {"fill"|"stroke"} type - String indicating "fill" or "stroke" to apply to an element
* @returns {undefined}
@@ -5297,7 +5306,7 @@ const setGradient = this.setGradient = function (type) {
};
/**
* Check if exact gradient already exists
* Check if exact gradient already exists.
* @function module:svgcanvas~findDuplicateGradient
* @param {SVGGradientElement} grad - The gradient DOM element to compare to others
* @returns {SVGGradientElement} The existing gradient if found, `null` if not
@@ -5358,7 +5367,7 @@ const findDuplicateGradient = function (grad) {
};
/**
* Set a color/gradient to a fill/stroke
* Set a color/gradient to a fill/stroke.
* @function module:svgcanvas.SvgCanvas#setPaint
* @param {"fill"|"stroke"} type - String with "fill" or "stroke"
* @param {module:jGraduate.jGraduatePaintOptions} paint - The jGraduate paint object to apply
@@ -5411,7 +5420,7 @@ this.getStrokeWidth = function () {
/**
* Sets the stroke width for the current selected elements.
* When attempting to set a line's width to 0, this changes it to 1 instead
* When attempting to set a line's width to 0, this changes it to 1 instead.
* @function module:svgcanvas.SvgCanvas#setStrokeWidth
* @param {Float} val - A Float indicating the new stroke width value
* @fires module:svgcanvas.SvgCanvas#event:changed
@@ -5448,7 +5457,7 @@ this.setStrokeWidth = function (val) {
};
/**
* Set the given stroke-related attribute the given value for selected elements
* Set the given stroke-related attribute the given value for selected elements.
* @function module:svgcanvas.SvgCanvas#setStrokeAttr
* @param {string} attr - String with the attribute name
* @param {string|Float} val - String or number with the attribute value
@@ -5504,7 +5513,7 @@ this.getStyle = function () {
this.getOpacity = getOpacity;
/**
* Sets the given opacity to the current selected elements
* Sets the given opacity on the current selected elements.
* @function module:svgcanvas.SvgCanvas#setOpacity
* @param {string} val
* @returns {undefined}
@@ -5531,7 +5540,7 @@ this.getStrokeOpacity = function () {
};
/**
* Sets the current fill/stroke opacity
* Sets the current fill/stroke opacity.
* @function module:svgcanvas.SvgCanvas#setPaintOpacity
* @param {string} type - String with "fill" or "stroke"
* @param {Float} val - Float with the new opacity value
@@ -5548,7 +5557,7 @@ this.setPaintOpacity = function (type, val, preventUndo) {
};
/**
* Gets the current fill/stroke opacity
* Gets the current fill/stroke opacity.
* @function module:svgcanvas.SvgCanvas#getPaintOpacity
* @param {"fill"|"stroke"} type - String with "fill" or "stroke"
* @returns {Float} Fill/stroke opacity
@@ -5558,7 +5567,7 @@ this.getPaintOpacity = function (type) {
};
/**
* Gets the `stdDeviation` blur value of the given element
* Gets the `stdDeviation` blur value of the given element.
* @function module:svgcanvas.SvgCanvas#getBlur
* @param {Element} elem - The element to check the blur value for
* @returns {string} stdDeviation blur attribute value
@@ -5585,7 +5594,7 @@ let filter = null;
let filterHidden = false;
/**
* Sets the `stdDeviation` blur value on the selected element without being undoable
* Sets the `stdDeviation` blur value on the selected element without being undoable.
* @function module:svgcanvas.SvgCanvas#setBlurNoUndo
* @param {Float} val - The new `stdDeviation` value
* @returns {undefined}
@@ -5625,7 +5634,7 @@ function finishChange () {
/**
* Sets the `x`, `y`, `width`, `height` values of the filter element in order to
* make the blur not be clipped. Removes them if not neeeded
* make the blur not be clipped. Removes them if not neeeded.
* @function module:svgcanvas.SvgCanvas#setBlurOffsets
* @param {Element} filter - The filter DOM element to update
* @param {Float} stdDev - The standard deviation value on which to base the offset size
@@ -5652,7 +5661,7 @@ canvas.setBlurOffsets = function (filter, stdDev) {
};
/**
* Adds/updates the blur filter to the selected element
* Adds/updates the blur filter to the selected element.
* @function module:svgcanvas.SvgCanvas#setBlur
* @param {Float} val - Float with the new `stdDeviation` blur value
* @param {boolean} complete - Whether or not the action should be completed (to add to the undo manager)
@@ -5721,7 +5730,7 @@ canvas.setBlur = function (val, complete) {
}());
/**
* Check whether selected element is bold or not
* Check whether selected element is bold or not.
* @function module:svgcanvas.SvgCanvas#getBold
* @returns {boolean} Indicates whether or not element is bold
*/
@@ -5736,7 +5745,7 @@ this.getBold = function () {
};
/**
* Make the selected element bold or normal
* Make the selected element bold or normal.
* @function module:svgcanvas.SvgCanvas#setBold
* @param {boolean} b - Indicates bold (`true`) or normal (`false`)
* @returns {undefined}
@@ -5753,7 +5762,7 @@ this.setBold = function (b) {
};
/**
* Check whether selected element is italic or not
* Check whether selected element is in italics or not.
* @function module:svgcanvas.SvgCanvas#getItalic
* @returns {boolean} Indicates whether or not element is italic
*/
@@ -5767,9 +5776,9 @@ this.getItalic = function () {
};
/**
* Make the selected element italic or normal
* Make the selected element italic or normal.
* @function module:svgcanvas.SvgCanvas#setItalic
* @param {boolean} b - Indicates italic (`true`) or normal (`false`)
* @param {boolean} i - Indicates italic (`true`) or normal (`false`)
* @returns {undefined}
*/
this.setItalic = function (i) {
@@ -5792,7 +5801,7 @@ this.getFontFamily = function () {
};
/**
* Set the new font family
* Set the new font family.
* @function module:svgcanvas.SvgCanvas#setFontFamily
* @param {string} val - String with the new font family
* @returns {undefined}
@@ -5806,7 +5815,7 @@ this.setFontFamily = function (val) {
};
/**
* Set the new font color
* Set the new font color.
* @function module:svgcanvas.SvgCanvas#setFontColor
* @param {string} val - String with the new font color
* @returns {undefined}
@@ -5833,7 +5842,7 @@ this.getFontSize = function () {
};
/**
* Applies the given font size to the selected element
* Applies the given font size to the selected element.
* @function module:svgcanvas.SvgCanvas#setFontSize
* @param {Float} val - Float with the new font size
* @returns {undefined}
@@ -5857,7 +5866,7 @@ this.getText = function () {
};
/**
* Updates the text element with the given string
* Updates the text element with the given string.
* @function module:svgcanvas.SvgCanvas#setTextContent
* @param {string} val - String with the new text
* @returns {undefined}
@@ -5870,7 +5879,7 @@ this.setTextContent = function (val) {
/**
* Sets the new image URL for the selected image element. Updates its size if
* a new URL is given
* a new URL is given.
* @function module:svgcanvas.SvgCanvas#setImageURL
* @param {string} val - String with the image URL/path
* @fires module:svgcanvas.SvgCanvas#event:changed
@@ -5947,7 +5956,8 @@ this.setLinkURL = function (val) {
};
/**
* Sets the `rx` and `ry` values to the selected `rect` element to change its corner radius
* Sets the `rx` and `ry` values to the selected `rect` element
* to change its corner radius.
* @function module:svgcanvas.SvgCanvas#setRectRadius
* @param {string|Float} val - The new radius
* @fires module:svgcanvas.SvgCanvas#event:changed
@@ -5967,7 +5977,7 @@ this.setRectRadius = function (val) {
};
/**
* Wraps the selected element(s) in an anchor element or converts group to one
* Wraps the selected element(s) in an anchor element or converts group to one.
* @function module:svgcanvas.SvgCanvas#makeHyperlink
* @param {string} url
* @returns {undefined}
@@ -6002,7 +6012,7 @@ this.setSegType = function (newType) {
};
/**
* Convert selected element to a path, or get the BBox of an element-as-path
* Convert selected element to a path, or get the BBox of an element-as-path.
* @function module:svgcanvas.SvgCanvas#convertToPath
* @todo (codedread): Remove the getBBox argument and split this function into two.
* @param {Element} elem - The DOM element to be converted
@@ -6166,7 +6176,7 @@ const changeSelectedAttributeNoUndo = function (attr, newValue, elems) {
* subset to this function in the `elems` argument.
* @function module:svgcanvas.SvgCanvas#changeSelectedAttribute
* @param {string} attr - String with the attribute name
* @param {string|Float} newValue - String or number with the new attribute value
* @param {string|Float} val - String or number with the new attribute value
* @param {Element[]} elems - The DOM elements to apply the change to
* @returns {undefined}
*/
@@ -6185,7 +6195,7 @@ const changeSelectedAttribute = this.changeSelectedAttribute = function (attr, v
/**
* Removes all selected elements from the DOM and adds the change to the
* history stack
* history stack.
* @function module:svgcanvas.SvgCanvas#deleteSelectedElements
* @fires module:svgcanvas.SvgCanvas#event:changed
* @returns {undefined}
@@ -6228,7 +6238,7 @@ this.deleteSelectedElements = function () {
/**
* Removes all selected elements from the DOM and adds the change to the
* history stack. Remembers removed elements on the clipboard
* history stack. Remembers removed elements on the clipboard.
* @function module:svgcanvas.SvgCanvas#cutSelectedElements
* @returns {undefined}
*/
@@ -6238,7 +6248,7 @@ this.cutSelectedElements = function () {
};
/**
* Remembers the current selected elements on the clipboard
* Remembers the current selected elements on the clipboard.
* @function module:svgcanvas.SvgCanvas#copySelectedElements
* @returns {undefined}
*/
@@ -6353,7 +6363,7 @@ this.pasteElements = function (type, x, y) {
};
/**
* Wraps all the selected elements in a group (`g`) element
* Wraps all the selected elements in a group (`g`) element.
* @function module:svgcanvas.SvgCanvas#groupSelectedElements
* @param {"a"|"g"} [type="g"] - type of element to group into, defaults to `<g>`
* @param {string} [urlArg]
@@ -6413,7 +6423,7 @@ this.groupSelectedElements = function (type, urlArg) {
/**
* Pushes all appropriate parent group properties down to its children, then
* removes them from the group
* removes them from the group.
* @function module:svgcanvas.SvgCanvas#pushGroupProperties
* @param {SVGAElement|SVGGElement} g
* @param {boolean} undoable
@@ -6600,7 +6610,7 @@ const pushGroupProperties = this.pushGroupProperties = function (g, undoable) {
/**
* Unwraps all the elements in a selected group (`g`) element. This requires
* significant recalculations to apply group's transforms, etc. to its children
* significant recalculations to apply group's transforms, etc. to its children.
* @function module:svgcanvas.SvgCanvas#ungroupSelectedElement
* @returns {undefined}
*/
@@ -6671,7 +6681,7 @@ this.ungroupSelectedElement = function () {
/**
* Repositions the selected element to the bottom in the DOM to appear on top of
* other elements
* other elements.
* @function module:svgcanvas.SvgCanvas#moveToTopSelectedElement
* @fires module:svgcanvas.SvgCanvas#event:changed
* @returns {undefined}
@@ -6694,7 +6704,7 @@ this.moveToTopSelectedElement = function () {
/**
* Repositions the selected element to the top in the DOM to appear under
* other elements
* other elements.
* @function module:svgcanvas.SvgCanvas#moveToBottomSelectedElement
* @fires module:svgcanvas.SvgCanvas#event:changed
* @returns {undefined}
@@ -6726,7 +6736,7 @@ this.moveToBottomSelectedElement = function () {
/**
* Moves the select element up or down the stack, based on the visibly
* intersecting elements
* intersecting elements.
* @function module:svgcanvas.SvgCanvas#moveUpDownSelected
* @param {"Up"|"Down"} dir - String that's either 'Up' or 'Down'
* @fires module:svgcanvas.SvgCanvas#event:changed
@@ -6767,7 +6777,7 @@ this.moveUpDownSelected = function (dir) {
};
/**
* Moves selected elements on the X/Y axis
* Moves selected elements on the X/Y axis.
* @function module:svgcanvas.SvgCanvas#moveSelectedElements
* @param {Float} dx - Float with the distance to move on the x-axis
* @param {Float} dy - Float with the distance to move on the y-axis
@@ -6838,7 +6848,7 @@ this.moveSelectedElements = function (dx, dy, undoable) {
/**
* Create deep DOM copies (clones) of all selected elements and move them slightly
* from their originals
* from their originals.
* @function module:svgcanvas.SvgCanvas#cloneSelectedElements
* @param {Float} x Float with the distance to move on the x-axis
* @param {Float} y Float with the distance to move on the y-axis
@@ -6879,7 +6889,7 @@ this.cloneSelectedElements = function (x, y) {
};
/**
* Aligns selected elements
* Aligns selected elements.
* @function module:svgcanvas.SvgCanvas#alignSelectedElements
* @param {string} type - String with single character indicating the alignment type
* @param {"selected"|"largest"|"smallest"|"page"} relativeTo
@@ -7001,7 +7011,7 @@ this.contentH = getResolution().h;
*/
/**
* Updates the editor canvas width/height/position after a zoom has occurred
* Updates the editor canvas width/height/position after a zoom has occurred.
* @function module:svgcanvas.SvgCanvas#updateCanvas
* @param {Float} w - Float with the new width
* @param {Float} h - Float with the new height
@@ -7064,7 +7074,7 @@ this.updateCanvas = function (w, h) {
};
/**
* Set the background of the editor (NOT the actual document)
* Set the background of the editor (NOT the actual document).
* @function module:svgcanvas.SvgCanvas#setBackground
* @param {string} color - String with fill color to apply
* @param {string} url - URL or path to image to use
@@ -7094,7 +7104,7 @@ this.setBackground = function (color, url) {
};
/**
* Select the next/previous element within the current layer
* Select the next/previous element within the current layer.
* @function module:svgcanvas.SvgCanvas#cycleElement
* @param {boolean} next - true = next and false = previous element
* @fires module:svgcanvas.SvgCanvas#event:selected

26
editor/svgicons/jQuery.svgIcons.js
View File

@@ -94,6 +94,7 @@ $(function() {
/**
* @function module:jQuerySVGIcons.jQuerySVGIcons
* @param {external:jQuery} $ Its keys include all icon IDs and the values, the icon as a jQuery object
* @returns {external:jQuery} The enhanced jQuery object
*/
export default function ($) {
const svgIcons = {};
@@ -102,27 +103,28 @@ export default function ($) {
/**
* @function external:jQuery.svgIcons
* @param {string} file The location of a local SVG or SVGz file
* @param {PlainObject} [options]
* @param {Float} [options.w] The icon widths
* @param {Float} [options.h] The icon heights
* @param {PlainObject.<string, string>} [options.fallback] List of raster images with each
* @param {PlainObject} [opts]
* @param {Float} [opts.w] The icon widths
* @param {Float} [opts.h] The icon heights
* @param {PlainObject.<string, string>} [opts.fallback] List of raster images with each
key being the SVG icon ID to replace, and the value the image file name
* @param {string} [options.fallback_path] The path to use for all images
* @param {string} [opts.fallback_path] The path to use for all images
listed under "fallback"
* @param {boolean} [options.replace] If set to `true`, HTML elements will be replaced by,
* @param {boolean} [opts.replace] If set to `true`, HTML elements will be replaced by,
rather than include the SVG icon.
* @param {PlainObject.<string, string>} [options.placement] List with selectors for keys and SVG icon ids
* @param {PlainObject.<string, string>} [opts.placement] List with selectors for keys and SVG icon ids
as values. This provides a custom method of adding icons.
* @param {PlainObject.<string, module:jQuerySVGIcons.Size>} [options.resize] List with selectors for keys and numbers
* @param {PlainObject.<string, module:jQuerySVGIcons.Size>} [opts.resize] List with selectors for keys and numbers
as values. This allows an easy way to resize specific icons.
* @param {module:jQuerySVGIcons.SVGIconsLoadedCallback} [options.callback] A function to call when all icons have been loaded.
* @param {boolean} [options.id_match=true] Automatically attempt to match SVG icon ids with
* @param {module:jQuerySVGIcons.SVGIconsLoadedCallback} [opts.callback] A function to call when all icons have been loaded.
* @param {boolean} [opts.id_match=true] Automatically attempt to match SVG icon ids with
corresponding HTML id
* @param {boolean} [options.no_img] Prevent attempting to convert the icon into an `<img>`
* @param {boolean} [opts.no_img] Prevent attempting to convert the icon into an `<img>`
element (may be faster, help for browser consistency)
* @param {boolean} [options.svgz] Indicate that the file is an SVGZ file, and thus not to
* @param {boolean} [opts.svgz] Indicate that the file is an SVGZ file, and thus not to
parse as XML. SVGZ files add compression benefits, but getting data from
them fails in Firefox 2 and older.
* @returns {undefined}
*/
$.svgIcons = function (file, opts = {}) {
const svgns = 'http://www.w3.org/2000/svg',

4
editor/svgtransformlist.js
View File

@@ -337,7 +337,7 @@ export let removeElementFromListMap = function (elem) {
};
/**
* Returns an object that behaves like a `SVGTransformList` for the given DOM element
* Returns an object that behaves like a `SVGTransformList` for the given DOM element.
* @function module:SVGTransformList.getTransformList
* @param {Element} elem - DOM element to get a transformlist from
* @todo The polyfill should have `SVGAnimatedTransformList` and this should use it
@@ -372,7 +372,7 @@ export const getTransformList = function (elem) {
* @param {Element} elem
*/
/**
* For unit-testing
* Replace `removeElementFromListMap` for unit-testing.
* @function module:SVGTransformList.changeRemoveElementFromListMap
* @param {module:SVGTransformList.removeElementFromListMap} cb Passed a single argument `elem`
* @returns {undefined}

4
editor/typedefs.js
View File

@@ -20,10 +20,10 @@
* This should only be used for objects known to be potentially arbitrary in form.
* For those whose determination has not yet been made, simply use type `object`
* (or type `?` if it may also be a primitive).
* @typedef {object} ArbitraryObject
* @typedef {Object} ArbitraryObject
*/
/**
* @typedef {object} ArbitraryModule
* @typedef {Object} ArbitraryModule
*/
/**
* This should only be used for objects known to be potentially arbitrary in form,

11
editor/units.js
View File

@@ -144,8 +144,10 @@ export const shortFloat = function (val) {
};
/**
* Converts the number to given unit or baseUnit
* Converts the number to given unit or baseUnit.
* @function module:units.convertUnit
* @param {string|Float} val
* @param {"em"|"ex"|"in"|"cm"|"mm"|"pt"|"pc"|"px"|"%"} [unit]
* @returns {Float}
*/
export const convertUnit = function (val, unit) {
@@ -212,7 +214,7 @@ const attrsToConvert = {
};
/**
* Converts all applicable attributes to the configured baseUnit
* Converts all applicable attributes to the configured baseUnit.
* @function module:units.convertAttrs
* @param {Element} element - A DOM element whose attributes should be converted
* @returns {undefined}
@@ -240,7 +242,7 @@ export const convertAttrs = function (element) {
/**
* Converts given values to numbers. Attributes must be supplied in
* case a percentage is given
* case a percentage is given.
*
* @function module:units.convertToNum
* @param {string} attr - Name of the attribute associated with the value
@@ -271,10 +273,11 @@ export const convertToNum = function (attr, val) {
};
/**
* Check if an attribute's value is in a valid format
* Check if an attribute's value is in a valid format.
* @function module:units.isValidUnit
* @param {string} attr - The name of the attribute associated with the value
* @param {string} val - The attribute value to check
* @param {Element} selectedElement
* @returns {boolean} Whether the unit is valid
*/
export const isValidUnit = function (attr, val, selectedElement) {

50
editor/utilities.js
View File

@@ -103,7 +103,7 @@ export const init = function (editorContext) {
};
/**
* Used to prevent the [Billion laughs attack]{@link https://en.wikipedia.org/wiki/Billion_laughs_attack}
* Used to prevent the [Billion laughs attack]{@link https://en.wikipedia.org/wiki/Billion_laughs_attack}.
* @function module:utilities.dropXMLInteralSubset
* @param {string} str String to be processed
* @returns {string} The string with entity declarations in the internal subset removed
@@ -145,7 +145,7 @@ export const fromXml = function (str) {
// also precalculate the size of the array needed.
/**
* Converts a string to base64
* Converts a string to base64.
* @function module:utilities.encode64
* @param {string} input
* @returns {string} Base64 output
@@ -188,7 +188,7 @@ export const encode64 = function (input) {
};
/**
* Converts a string from base64
* Converts a string from base64.
* @function module:utilities.decode64
* @param {string} input Base64-encoded input
* @returns {string} Decoded output
@@ -246,7 +246,7 @@ export const encodeUTF8 = function (argString) {
};
/**
* convert dataURL to object URL
* Convert dataURL to object URL.
* @function module:utilities.dataURLToObjectURL
* @param {string} dataurl
* @returns {string} object URL or empty string
@@ -267,7 +267,7 @@ export const dataURLToObjectURL = function (dataurl) {
};
/**
* get object URL for a blob object
* Get object URL for a blob object.
* @function module:utilities.createObjectURL
* @param {Blob} blob A Blob object or File object
* @returns {string} object URL or empty string
@@ -291,7 +291,7 @@ export const blankPageObjectURL = (function () {
})();
/**
* Converts a string to use XML references (for non-ASCII)
* Converts a string to use XML references (for non-ASCII).
* @function module:utilities.convertToXMLReferences
* @param {string} input
* @returns {string} Decimal numeric character references
@@ -310,8 +310,8 @@ export const convertToXMLReferences = function (input) {
};
/**
* Cross-browser compatible method of converting a string to an XML tree
* found this function [here]{@link http://groups.google.com/group/jquery-dev/browse_thread/thread/c6d11387c580a77f}
* Cross-browser compatible method of converting a string to an XML tree.
* Found this function [here]{@link http://groups.google.com/group/jquery-dev/browse_thread/thread/c6d11387c580a77f}.
* @function module:utilities.text2xml
* @param {string} sXML
* @throws {Error}
@@ -364,7 +364,7 @@ export const bboxToObj = function ({x, y, width, height}) {
*/
/**
* Walks the tree and executes the callback on each element in a top-down fashion
* Walks the tree and executes the callback on each element in a top-down fashion.
* @function module:utilities.walkTree
* @param {Element} elem - DOM element to traverse
* @param {module:utilities.TreeWalker} cbFn - Callback function to run on each element
@@ -381,7 +381,7 @@ export const walkTree = function (elem, cbFn) {
};
/**
* Walks the tree and executes the callback on each element in a depth-first fashion
* Walks the tree and executes the callback on each element in a depth-first fashion.
* @function module:utilities.walkTreePost
* @todo FIXME: Shouldn't this be calling walkTreePost?
* @param {Element} elem - DOM element to traverse
@@ -435,7 +435,7 @@ export let getHref = function (elem) {
};
/**
* Sets the given element's `xlink:href` value
* Sets the given element's `xlink:href` value.
* @function module:utilities.setHref
* @param {Element} elem
* @param {string} val
@@ -471,7 +471,7 @@ export const findDefs = function () {
/**
* Get correct BBox for a path in Webkit.
* Converted from code found [here]{@link http://blog.hackers-cafe.net/2009/06/how-to-calculate-bezier-curves-bounding.html}
* Converted from code found [here]{@link http://blog.hackers-cafe.net/2009/06/how-to-calculate-bezier-curves-bounding.html}.
* @function module:utilities.getPathBBox
* @param {SVGPathElement} path - The path DOM element to get the BBox for
* @returns {module:utilities.BBoxObject} A BBox-like object
@@ -595,7 +595,7 @@ function groupBBFix (selected) {
/**
* Get the given/selected element's bounding box object, convert it to be more
* usable when necessary
* usable when necessary.
* @function module:utilities.getBBox
* @param {Element} elem - Optional DOM element to get the BBox for
* @returns {module:utilities.BBoxObject} Bounding box object
@@ -808,7 +808,7 @@ export const getExtraAttributesForConvertToPath = function (elem) {
};
/**
* Get the BBox of an element-as-path
* Get the BBox of an element-as-path.
* @function module:utilities.getBBoxOfElementAsPath
* @param {Element} elem - The DOM element to be probed
* @param {module:utilities.EditorContext#addSVGElementFromJson} addSVGElementFromJson - Function to add the path element to the current layer. See canvas.addSVGElementFromJson
@@ -1027,7 +1027,7 @@ function getStrokeOffsetForBBox (elem) {
*/
/**
* Get the bounding box for one or more stroked and/or transformed elements
* Get the bounding box for one or more stroked and/or transformed elements.
* @function module:utilities.getStrokedBBox
* @param {Element[]} elems - Array with DOM elements to check
* @param {module:utilities.EditorContext#addSVGElementFromJson} addSVGElementFromJson - Function to add the path element to the current layer. See canvas.addSVGElementFromJson
@@ -1088,7 +1088,7 @@ export const getStrokedBBox = function (elems, addSVGElementFromJson, pathAction
/**
* Get all elements that have a BBox (excludes `<defs>`, `<title>`, etc).
* Note that 0-opacity, off-screen etc elements are still considered "visible"
* for this function
* for this function.
* @function module:utilities.getVisibleElements
* @param {Element} parent - The parent DOM element to search within
* @returns {Element[]} All "visible" elements.
@@ -1108,7 +1108,7 @@ export const getVisibleElements = function (parent) {
};
/**
* Get the bounding box for one or more stroked and/or transformed elements
* Get the bounding box for one or more stroked and/or transformed elements.
* @function module:utilities.getStrokedBBoxDefaultVisible
* @param {Element[]} elems - Array with DOM elements to check
* @returns {module:utilities.BBoxObject} A single bounding box object
@@ -1142,7 +1142,7 @@ export const getRotationAngleFromTransformList = function (tlist, toRad) {
};
/**
* Get the rotation angle of the given/selected DOM element
* Get the rotation angle of the given/selected DOM element.
* @function module:utilities.getRotationAngle
* @param {Element} [elem] - DOM element to get the angle for. Default to first of selected elements.
* @param {boolean} [toRad=false] - When true returns the value in radians rather than degrees
@@ -1156,7 +1156,7 @@ export let getRotationAngle = function (elem, toRad) {
};
/**
* Get the reference element associated with the given attribute value
* Get the reference element associated with the given attribute value.
* @function module:utilities.getRefElem
* @param {string} attrVal - The attribute value as a string
* @returns {Element} Reference element
@@ -1216,7 +1216,7 @@ export const assignAttributes = function (elem, attrs, suspendLength, unitCheck)
};
/**
* Remove unneeded (default) attributes, makes resulting SVG smaller
* Remove unneeded (default) attributes, making resulting SVG smaller.
* @function module:utilities.cleanupElement
* @param {Element} element - DOM element to clean up
* @returns {undefined}
@@ -1251,7 +1251,7 @@ export const cleanupElement = function (element) {
};
/**
* Round value to for snapping
* Round value to for snapping.
* @function module:utilities.snapToGrid
* @param {Float} value
* @returns {Integer}
@@ -1267,7 +1267,7 @@ export const snapToGrid = function (value) {
};
/**
* Escapes special characters in a regular expression
* Escapes special characters in a regular expression.
* @function module:utilities.regexEscape
* @param {string} str
* @returns {string}
@@ -1278,7 +1278,7 @@ export const regexEscape = function (str) {
};
/**
* Prevents default browser click behaviour on the given element
* Prevents default browser click behaviour on the given element.
* @function module:utilities.preventClickDefault
* @param {Element} img - The DOM element to prevent the click on
* @returns {undefined}
@@ -1292,7 +1292,7 @@ export const preventClickDefault = function (img) {
* @returns {string} The ID
*/
/**
* Create a clone of an element, updating its ID and its children's IDs when needed
* Create a clone of an element, updating its ID and its children's IDs when needed.
* @function module:utilities.copyElem
* @param {Element} el - DOM element to clone
* @param {module:utilities.GetNextID} getNextId - The getter of the next unique ID.
@@ -1344,7 +1344,7 @@ export const copyElem = function (el, getNextId) {
};
/**
* Unit testing
* Overwrite methods for unit testing.
* @function module:utilities.mock
* @returns {undefined}
*/

498
editor/xdomain-svgedit-config-iife.js
View File

File diff suppressed because it is too large Load Diff

9
jsdoc-check-overly-generic-types.js
View File

@@ -20,8 +20,8 @@ let results = await Promise.all(fileMatchPatterns.map(async (fileMatchPattern) =
{
// We grab to the end of the line as the `line` result for `find-in-files`
// only grabs from the beginning of the file to the end of the match.
term: `(@[^{\\n]*{[^}\\n]*(\\bobject|\\barray\\b|function|\\bnumber|\\*)[^}\\n]*}|@.*{}).*`,
flags: 'g'
term: `(@[^{\\n]*{[^}\\n]*(\\bobject|\\barray\\b|[^.]function|\\bnumber|\\*)[^}\\n]*}|@.*{}).*`,
flags: 'gi'
},
fileMatchPattern,
'([^n]|[^i]n|[^m]in|[^.]min).js$'
@@ -73,8 +73,9 @@ function reduceFalseMatches (file, res) {
res.line = res.line.filter((line) => {
return ![
'* @typedef {number} Float',
'* @typedef {object} ArbitraryObject',
'* @typedef {object} ArbitraryModule',
'* @typedef {Object} ArbitraryObject',
'* @typedef {Object} ArbitraryModule',
'* @typedef {Array} GenericArray',
'* @typedef {*} Any',
'* @param {...*} args Signature dependent on the function',
'* @returns {*} Return dependent on the function'

24
screencasts/svgopen2010/script.js
View File

@@ -124,10 +124,10 @@ Slide.prototype = {
const _t = this;
if (canTransition()) {
const l = function (evt) {
elem.parentNode.removeEventListener(transitionEnd, l, false);
elem.parentNode.removeEventListener(transitionEnd, l);
_t._runAutos();
};
elem.parentNode.addEventListener(transitionEnd, l, false);
elem.parentNode.addEventListener(transitionEnd, l);
elem.classList.remove('to-build');
} else {
setTimeout(function () {
@@ -161,17 +161,17 @@ const SlideShow = function (slides) {
this.current = isNaN(this.current) ? 1 : this.current;
const _t = this;
doc.addEventListener('keydown',
function (e) { _t.handleKeys(e); }, false);
function (e) { _t.handleKeys(e); });
doc.addEventListener('mousewheel',
function (e) { _t.handleWheel(e); }, false);
function (e) { _t.handleWheel(e); });
doc.addEventListener('DOMMouseScroll',
function (e) { _t.handleWheel(e); }, false);
function (e) { _t.handleWheel(e); });
doc.addEventListener('touchstart',
function (e) { _t.handleTouchStart(e); }, false);
function (e) { _t.handleTouchStart(e); });
doc.addEventListener('touchend',
function (e) { _t.handleTouchEnd(e); }, false);
function (e) { _t.handleTouchEnd(e); });
window.addEventListener('popstate',
function (e) { _t.go(e.state); }, false);
function (e) { _t.go(e.state); });
this._update();
};
@@ -274,10 +274,10 @@ SlideShow.prototype = {
// Initialize
/* const slideshow = */ new SlideShow(query('.slide')); // eslint-disable-line no-new
document.querySelector('#toggle-counter').addEventListener('click', toggleCounter, false);
document.querySelector('#toggle-size').addEventListener('click', toggleSize, false);
document.querySelector('#toggle-transitions').addEventListener('click', toggleTransitions, false);
document.querySelector('#toggle-gradients').addEventListener('click', toggleGradients, false);
document.querySelector('#toggle-counter').addEventListener('click', toggleCounter);
document.querySelector('#toggle-size').addEventListener('click', toggleSize);
document.querySelector('#toggle-transitions').addEventListener('click', toggleTransitions);
document.querySelector('#toggle-gradients').addEventListener('click', toggleGradients);
const counters = document.querySelectorAll('.counter');
const slides = document.querySelectorAll('.slide');

498
svgedit-config-iife.js
View File

File diff suppressed because it is too large Load Diff

4
test/qunit/qunit-assert-close.js
View File

@@ -8,6 +8,7 @@
* @param {Float} expected
* @param {Float} maxDifference (the maximum inclusive difference allowed between the actual and expected numbers)
* @param {string} [message] Defaults to structured message
* @returns {undefined}
*/
function close (actual, expected, maxDifference, message) {
const actualDiff = (actual === expected) ? 0 : Math.abs(actual - expected),
@@ -26,6 +27,7 @@ function close (actual, expected, maxDifference, message) {
* @param {Float} expected
* @param {Float} maxPercentDifference (the maximum inclusive difference percentage allowed between the actual and expected numbers)
* @param {string} [message] Defaults to a structured message
* @returns {undefined}
*/
function closePercent (actual, expected, maxPercentDifference, message) {
let actualDiff, result;
@@ -55,6 +57,7 @@ function closePercent (actual, expected, maxPercentDifference, message) {
* @param {Float} expected
* @param {Float} minDifference (the minimum exclusive difference allowed between the actual and expected numbers)
* @param {string} [message] Defaults to structured message
* @returns {undefined}
*/
function notClose (actual, expected, minDifference, message) {
const actualDiff = Math.abs(actual - expected),
@@ -73,6 +76,7 @@ function notClose (actual, expected, minDifference, message) {
* @param {Float} expected
* @param {Float} minPercentDifference (the minimum exclusive difference percentage allowed between the actual and expected numbers)
* @param {string} [message] Defaults to a structured message
* @returns {undefined}
*/
function notClosePercent (actual, expected, minPercentDifference, message) {
let actualDiff, result;