- Security fix: 'extPath', 'imgPath', 'extIconsPath', 'canvgPath', 'langPath', 'jGraduatePath', and 'jspdfPath' were not being prevented

- Breaking change: Rename "svgutils.js" to "utilities.js" (make in conformity with JSDoc module naming convention)
- Breaking change: Rename "svgedit.js" to "namespaces.js" (to make clear purpose and avoid confusing with editor)
- Breaking change: Rename "jquery-svg.js" to "jQuery.attr.js"
- Breaking change: Rename "jquery.contextMenu.js" to "jQuery.contextMenu.js"
- Breaking change: Rename "jquery.jpicker.js" to "jQuery.jPicker.js"
- Breaking change: Rename "JQuerySpinBtn.css" to "jQuery.SpinButton.css"
- Breaking change: Rename "JQuerySpinBtn.js" to "jQuery.SpinButton.js" (to have file name more closely reflect name)
- Breaking change: Rename "jquery.svgicons.js" to "jQuery.svgIcons.js"
- Breaking change: Rename "jquery.jgraduate.js" to "jQuery.jGraduate.js"
- Breaking change: Rename "pathseg.js" to "svgpathseg.js" (as it is a poyfill of SVGPathSeg)
- Breaking change: Rename `addSvgElementFromJson()` to `addSVGElementFromJson` for consistency
- Breaking change: Rename `changeSvgContent()` to `changeSVGContent()` for consistency
- Breaking change: Have `exportPDF` resolve with `output` and `outputType` rather than `dataurlstring` (as type may vary)
- Breaking change: Rename `extensions/mathjax/MathJax.js` to `extensions/mathjax/MathJax.min.js`
- Breaking change: Avoid recent change to have editor ready callbacks return Promises (we're not using and advantageous to keep sequential)
- Breaking change: Avoid recent addition of locale-side function in ext-imagelib for l10n
- Breaking change: Change name of ext-arrows.js from `Arrows` to `arrows` for sake of file path (not localized anyways).
- Breaking change: Change `addlangData` extension event to `addLangData` for consistency with method name
- Breaking change: Have `readLang`  return lang and data but do not call `setLang`
- Fix: Have general locales load first so extensions may use
- Fix: Provide `importLocale` to extensions `init` so it may delay adding of the extension until locale data loaded
- Fix: Ensure call to `rasterExport` without `imgType` properly sets MIME type to PNG
- Fix: Wrong name for moinsave
- Update: Update WebAppFind per new API changes
- Enhancement: Make `setStrings` public on editor for late setting (used
  by `ext-shapes.js`)
- Enhancement: Add `extensions_added` event
- Enhancement: Add `message` event (Relay messages including those which
  have been been received prior to extension load)
- Enhancement: Allow SVGEdit to work out of the box--avoid need for copying sample config file. Should also help with Github-based file servers
- Enhancement: Allow avoiding "name" in extension export (just extract out of file name)
- Enhancement: Add stack blur to canvg by default (and refactoring it)
- Enhancement: Return `Promise` for `embedImage` (as with some other loading methods)
- Enhancement: Supply `importLocale` to `langReady` to facilitate extension locale loading
- Enhancement: Recover if an extension fails to load (just log and otherwise ignore)
- Enhancement: More i18n of extensions (also fixed issue with some console warnings about missing locale strings); i18nize Hello World too
- Enhancement: Allowing importing of locales within `addLangData`
- npm: Update devDeps
- Docs: Migrate copies of all old wiki pages to docs/from-old-wiki folder; intended for a possible move to Markdown, so raw HTML (with formatting) was not preserved, though named links had their absolute URL links preserved
- Docs: Begin deleting `SvgCanvas.md` as ensuring jsdoc has replacements
- Docs: Add Edtior doc file for help to general users
- Docs: Clarify/simplify install instructions
- npm/Docs (JSDoc): Add script to check for overly generic types
- Docs (JSDoc): For config/prefs and extension creating, link to tutorials (moved tutorials to own directory to avoid recursion problems by jsdoc)
- Docs (JSDoc): Add modules (upper case for usual main entrance files or regular names)
- Docs (JSDoc): Fill out missing areas; indicate return of `undefined`; consistency with `@returns`
- Docs (JSDoc): Add our own layout template to support overflow
- Docs (JSDoc): Use cleverLinks and disallow unknown tags
- Docs (JSDoc): Insist on "pedantic" flag; put output directory in config
- Docs (JSDoc): Use more precise Integer/Float over number, the specific type of array/function/object
- Docs (JSDoc): Use `@throws`, `@enum`, `@event`/`@fires`/`@listens`
- Docs: Generally update/improve docs (fixes #92)
- Docs: Update links to `latest` path (Avoid needing to update such references upon each release)
- Docs: 80 chars max
- Refactoring: Drop code for extension as function (already requiring export to be an object)
- Refactoring: Object destructuring, `Object.entries`, Object shorthand, array extras, more camelCase variable names
- Refactoring: Add a `Command` base class
- Refactoring: Simplify svgicons `callback` ready detection
- Refactoring: Put `let` or `const` closer to scope
- Refactoring: Remove unneeded `delimiter` from regex escaping utility
- Refactoring: Clearer variable names
- Refactoring: Use (non-deprecated) Event constructors
- Testing: Use new Sinon

.eslintignore

@@ -5,7 +5,6 @@ docs/jsdoc
 
 svgedit-config-es.js
 svgedit-config-iife.js
-svgedit-config-sample-iife.js
 svgedit-custom.css
 
 # Vendor/minified files

.gitignore

@@ -2,12 +2,6 @@ node_modules
 
 build/
 
-# For examples, see
-# svgedit-config-sample-es.js
-# svgedit-config-sample-iife.js
-svgedit-config-es.js
-svgedit-config-iife.js
-
 svgedit-custom.css
 
 docs/jsdoc

CHANGES.md

@@ -1,5 +1,37 @@
 # ?
 
+- Security fix: 'extPath', 'imgPath', 'extIconsPath', 'canvgPath',
+  'langPath', 'jGraduatePath', and 'jspdfPath' were not being prevented
+- Breaking change: Rename "svgutils.js" to "utilities.js" (make in
+  conformity with JSDoc module naming convention)
+- Breaking change: Rename "svgedit.js" to "namespaces.js" (to make clear
+  purpose and avoid confusing with editor)
+- Breaking change: Rename "jquery-svg.js" to "jQuery.attr.js"
+- Breaking change: Rename "jquery.contextMenu.js" to "jQuery.contextMenu.js"
+- Breaking change: Rename "jquery.jpicker.js" to "jQuery.jPicker.js"
+- Breaking change: Rename "JQuerySpinBtn.css" to "jQuery.SpinButton.css"
+- Breaking change: Rename "JQuerySpinBtn.js" to "jQuery.SpinButton.js" (to
+  have file name more closely reflect name)
+- Breaking change: Rename "jquery.svgicons.js" to "jQuery.svgIcons.js"
+- Breaking change: Rename "jquery.jgraduate.js" to "jQuery.jGraduate.js"
+- Breaking change: Rename "pathseg.js" to "svgpathseg.js" (as it is a
+  poyfill of SVGPathSeg)
+- Breaking change: Rename `addSvgElementFromJson()` to `addSVGElementFromJson`
+  for consistency
+- Breaking change: Rename `changeSvgContent()` to `changeSVGContent()` for
+  consistency
+- Breaking change: Have `exportPDF` resolve with `output` and `outputType`
+  rather than `dataurlstring` (as type may vary)
+- Breaking change: Rename `extensions/mathjax/MathJax.js` to
+  `extensions/mathjax/MathJax.min.js`
+- Breaking change: Avoid recent change to have editor ready callbacks
+  return Promises (we're not using and advantageous to keep sequential)
+- Breaking change: Avoid recent addition of locale-side function in
+  ext-imagelib for l10n
+- Breaking change: Change name of `ext-arrows.js` from `Arrows` to `arrows`
+  for sake of file path (not localized anyways).
+- Breaking change: Change `addlangData` extension event to `addLangData`
+  for consistency with method name
 - Breaking change: In interests of modularity/removing globals,
   remove `window.svgCanvas` and `svgCanvas.ready` as used by older
   extensions; use `svgEditor.canvas` and `svgEditor.ready` instead
@@ -13,14 +45,19 @@
   (`setStackBlurCanvasRGBA`) rather than global; `canvg` now a named export
 - Breaking change: Avoid passing `canvg`/`buildCanvgCallback` to extensions
   (have them import)
+- Breaking change: Have `readLang`  return lang and data but do not call
+  `setLang`
 - npm: Add `prepublishOnly` script to ensure building/testing before publish
-- npm: Update devDep Rollup, Sinon
+- npm: Update devDeps including Rollup, Sinon
 - Fix: Remove redundant (and incorrect) length set. (#256 ; fixes #255)
 - Fix: Detection of whether to keep ellipse (rx and ry when just created
   are now returning 0 instead of null); also with rectangle/square;
   fixes #262
 - Fix: Avoid erring during resize on encountering MathML (which have no
   `style`)
+- Fix: Have general locales load first so extensions may use
+- Fix: Provide `importLocale` to extensions `init` so it may delay
+  adding of the extension until locale data loaded
 - Fix: i18nize imaglib more deeply
 - Fix: Positioning of Document Properties dialog (Fixes #246)
 - Fix (regression): PDF Export (Fixes #249)
@@ -31,15 +68,37 @@
 - Fix (embedded editor): Fix backspace key in Firefox so it doesn't navigate
   out of frame
 - Fix: Alert if no `exportWindow` for PDF (e.g., if blocked)
+- Fix: Ensure call to `rasterExport` without `imgType` properly sets MIME
+  type to PNG
+- Fix: Wrong name for moinsave
 - Fix (Embedded API): Cross-domain may fail to even access `origin` or
   `contentDocument`
 - Fix (Embedded API): Avoid adding URL to iframe src if there are no arguments
 - Fix (Cross-domain usage): Recover from exceptions with `localStorage`
 - Fix regression (Imagelib): Fix path for non-module version
+- Update: Update WebAppFind per new API changes
+- Enhancement: Make `setStrings` public on editor for late setting (used
+  by `ext-shapes.js`)
+- Enhancement: Add `extensions_added` event
+- Enhancement: Add `message` event (Relay messages including those which
+  have been been received prior to extension load)
 - Enhancement: Sort SVG attributes alphabetically (#252 @Neil Fraser)
 - Enhancement: Allow callback argument and return promise
   for canvas methods: `rasterExport` and `exportPDF`
 - Enhancement: Add `pointsAdded` canvas event (Fixes #141)
+- Enhancement: Allow SVGEdit to work out of the box--avoid need for copying
+  sample config file. Should also help with Github-based file servers
+- Enhancement: Allow avoiding "name" in extension export (just extract out
+  of file name)
+- Enhancement: Add stack blur to canvg by default (and refactoring it)
+- Enhancement: Return `Promise` for `embedImage` (as with some other loading
+  methods)
+- Enhancement: Supply `importLocale` to `langReady` to facilitate extension
+  locale loading
+- Enhancement: Recover if an extension fails to load (just log and otherwise
+  ignore)
+- Enhancement: More i18n of extensions
+- Enhancement: Allowing importing of locales within `addLangData`
 - i18n: Clarify locale messages (where still available as English) to reflect
   fact that Chrome only has "Save as" via context menu/right-click, not via
   file menu (toward #192)
@@ -59,19 +118,55 @@
 - Refactoring: Fix `lang` and `dir` for locales (though not in use
   currently anyways)
 - Refactoring: Provide path config for canvg, jspdf
+- Refactoring: Drop code for extension as function (already requiring export
+  to be an object)
+- Refactoring: Object destructuring, `Object.entries`, Object shorthand,
+  array extras, more camelCase variable names
+- Refactoring: Add a `Command` base class
+- Refactoring: Simplify svgicons `callback` ready detection
+- Refactoring: Put `let` or `const` closer to scope
+- Refactoring: Remove unneeded `delimiter` from regex escaping utility
+- Refactoring: Clearer variable names
+- Refactoring: Use (non-deprecated) Event constructors
 - Refactoring (minor): variadic args through ellipsis
 - Refactoring (minor): `getIssues` to return codes and strings, lbs
 - Refactoring (minor): Use single quotes in PHP
 - Docs (Code comments): Coding standards within
-- Docs: Move jsdoc output to public directory so may be visible on releases
-  (while still having in a `.gitignore`)
-- Docs (JSDoc): Add items; fix table layout
-- Docs: Exclusions from jsdoc
 - Docs: Transfer some changes from ExtensionDocs on wiki (need to fully
   reconcile)
 - Docs: Reference JSDocs in README
 - Docs (ReleaseInstructions): Update
+- Docs: Migrate copies of all old wiki pages to docs/from-old-wiki
+  folder; intended for a possible move to Markdown, so raw HTML
+  (with formatting) was not preserved, though named links were carried over
+  with absolute URLs
+- Docs: Begin deleting `SvgCanvas.md` as ensuring jsdoc has replacements
+- Docs: Add Edtior doc file for help to general users
+- Docs: Clarify/simplify install instructions
+- Docs: Generally update/improve docs (fixes #92)
+- Docs: Update links to `latest` path (Avoid needing to update such
+  references upon each release)
+- Docs: 80 chars max
+- npm/Docs (JSDoc): Add script to check for overly generic types
+- Docs (JSDoc): Move jsdoc output to public directory so may be visible
+  on releases (while still having in a `.gitignore`)
+- Docs (JSDoc): Exclusions
+- Docs (JSDoc): Add items; fix table layout
+- Docs (JSDoc): For config/prefs and extension creating, link to tutorials
+  (moved tutorials to own directory to avoid recursion problems by jsdoc)
+- Docs (JSDoc): Add modules (upper case for usual main entrance files or
+  regular names)
+- Docs (JSDoc): Fill out missing areas; indicate return of `undefined`;
+  consistency with `@returns`
+- Docs (JSDoc): Use Markdown plugin over HTML
+- Docs (JSDoc): Add our own layout template to support overflow
+- Docs (JSDoc): Use cleverLinks and disallow unknown tags
+- Docs (JSDoc): Insist on "pedantic" flag; put output directory in config
+- Docs (JSDoc): Use more precise Integer/Float over number, the specific type
+  of array/function/object
+- Docs (JSDoc): Use `@throws`, `@enum`, `@event`/`@fires`/`@listens`
 - Linting (ESLint): Avoid linting jsdoc folder
+- Testing: Use new Sinon
 
 # 3.0.0-alpha.4
 
@@ -333,7 +428,7 @@ git log 4bb15e0..253b4bf
 - Potentially breaking API changes:
     * Disallowed "extPath", "imgPath", "langPath", and "jGraduatePath" setting via URL and prevent cross-domain/cross-folder extensions being set by URL (security enhancement)
     * Deprecated "pngsave" option called by setCustomHandlers() in favor of "exportImage" (to accommodate export of other image types). Second argument will now supply, in addition to "issues" and "svg", the properties "type" (currently 'PNG', 'JPEG', 'BMP', 'WEBP'), "mimeType", and "quality" (for 'JPEG' and 'WEBP' types).
-    * Default extensions will now always load (along with those supplied in the URL unless the latter is prohibited by configuration), so if you do not wish your old code to load all of the default extensions, you will need to add &noDefaultExtensions=true to the URL (or add equivalent configuration in config.js). ext-overview_window.js can now be excluded though it is still a default.
+    * Default extensions will now always load (along with those supplied in the URL unless the latter is prohibited by configuration), so if you do not wish your old code to load all of the default extensions, you will need to add `&noDefaultExtensions=true` to the URL (or add equivalent configuration in config.js). ext-overview_window.js can now be excluded though it is still a default.
     * Preferences and configuration options must be within the list supplied within svg-editor.js (should include those of all documented extensions).
     * Embedded messaging will no longer work by default for privacy/data integrity reasons. One must include the "ext-xdomain-messaging.js" extension and supply an array configuration item, "allowedOrigins" with potential values including: "\*" (to allow all domains--strongly discouraged!), "null" as a string to allow file:// access, window.location.origin (to allow same domain access), or specific trusted origins. The embedded editor works without the extension if the main editor is on the same domain, but if cross-domain control is needed, the "allowedOrigins" array must be supplied by a call to svgEditor.setConfig({allowedOrigins: [origin1, origin2, etc.]}) in the new config.js file.
 
@@ -357,7 +452,7 @@ git log 4bb15e0..253b4bf
 - Open Local Files (Firefox 3.6+ only)
 - Import SVG into Drawing (Firefox 3.6+ only)
 - Ability to create extensions/plugins
-- Main menu and overal interface improvements
+- Main menu and overall interface improvements
 - Create and select elements outside the canvas
 - Base support for the svg:use element
 - Add/Edit Sub-paths

Makefile

@@ -8,15 +8,15 @@ ZIP=zip
 # All files that will be compiled by the Closure compiler.
 
 JS_FILES=\
-	svgedit.js \
+	namespaces.js \
-	jquery-svg.js \
+	jQuery.attr.js \
-	contextmenu/jquery.contextMenu.js \
+	contextmenu/jQuery.contextMenu.js \
-	pathseg.js \
+	svgpathseg.js \
 	browser.js \
 	svgtransformlist.js \
 	math.js \
 	units.js \
-	svgutils.js \
+	utilities.js \
 	sanitize.js \
 	history.js \
 	historyrecording.js \
@@ -93,7 +93,7 @@ chrome:
 	cd build ; $(ZIP) -r $(PACKAGE)-crx.zip svgedit_app ; rm -rf svgedit_app; cd ..
 
 jgraduate:
-	java -jar $(CLOSURE) --js editor/jgraduate/jquery.jgraduate.js --js_output_file editor/jgraduate/jquery.jgraduate.min.js
+	java -jar $(CLOSURE) --js editor/jgraduate/jquery.jGraduate.js --js_output_file editor/jgraduate/jquery.jgraduate.min.js
 clean:
 	rm -rf config
 	rm -rf build/$(PACKAGE)

README.md

@@ -1,39 +1,80 @@
 # ![alt text](https://svg-edit.github.io/svgedit/images/logo48x48.svg "svg-edit logo of a pencil") SVG-edit
 
-SVG-edit is a fast, web-based, javascript-driven SVG drawing editor that works in any modern browser.
+SVG-edit is a fast, web-based, JavaScript-driven SVG drawing editor that
+works in any modern browser.
 
 ## Demo
 
-### [Try SVG-edit here](https://svg-edit.github.io/svgedit/releases/svg-edit-2.8.1/svg-editor.html)
+### [Try SVG-edit here](https://svg-edit.github.io/svgedit/releases/latest/editor/svg-editor.html)
 
-(Also available as a [download](https://github.com/SVG-Edit/svgedit/releases/download/svg-edit-2.8.1/svg-edit-2.8.1.zip) in [releases](https://github.com/SVG-Edit/svgedit/releases)).
+(Also available as a download in [releases](https://github.com/SVG-Edit/svgedit/releases)).
 
-You may also try the [pre-release](https://svg-edit.github.io/svgedit/releases/svg-edit-3.0.0-alpha.4/editor/svg-editor.html) (or the [ES6-Module](https://svg-edit.github.io/svgedit/releases/svg-edit-3.0.0-alpha.4/editor/svg-editor.html) version, assuming a modern browser).
+You may also try the [pre-release](https://svg-edit.github.io/svgedit/releases/latest/editor/svg-editor.html) (or its [ES6-Module](https://svg-edit.github.io/svgedit/releases/latest/editor/svg-editor.html) version, assuming a modern browser).
 
 ## Installation
 
-Note that steps 1-2 below are only necessary if you wish to integrate
+### Quick install
-SVG-edit into your own npm package; otherwise, you can skip those steps
-and instead of looking within `node_modules/svgedit`, look within your
-copy of the svgedit Git repo.
 
-1. Set up an npm package of your own: `npm init` (complete the fields).
+1. Clone or copy the repository contents (at least the `editor` directory).
-1. Install SVG-edit into your package: `npm i svgedit`
+1. If you need programmatic customization, see its section below.
-1. Copy `svgedit-config-sample-es.js` (in the SVG-edit project root;
+1. Otherwise, just add an iframe to your site, adding any extensions or
-    see `node_modules/svgedit`) to `svgedit-config-es.js`.
+  configuration (see `docs/tutorials/ConfigOptions.md`
-  1. This will enable `svg-editor-es.html` to work, an HTML file directly
+  ([ConfigOptions]{@tutorial ConfigOptions})) within the URL:
-    using ES6 modules. Note that this file only works on modern browsers.
+```html
-    The config file now imports the SVG edit code, minimizing the scripts
+<iframe src="svgedit/editor/svg-editor.html?extensions=" width="100%" height="100%"></iframe>
-    that need to be referenced in the HTML file.
+```
-1. To also build a rolled-up, Babelified, non-ES Modules (IIFE)
+
-  JavaScript file which will allow `svg-editor.html` to work, a file
+### Integrating SVG-edit into your own npm package
-  which does not rely on ES6 Modules support, follow these steps:
+
+These steps are only needed if you wish to set up your own npm package
+incorporating SVGEdit.
+
+1. Create your npm package: `npm init` (complete the fields).
+1. Install SVG-edit into your package:
+  `npm i svgedit`.
+1. Look within `node_modules/svgedit/`, e.g., `node_modules/svgedit/editor/svg-editor.html`
+  for the files your package needs and use accordingly.
+1. `npm publish`
+
+## Programmatic customization
+
+1. If you are not concerned about supporting ES6 Modules (see the
+  "ES6 Modules file" section), you can add your config directly to
+  `svgedit-config-iife.js` within the SVG-Edit project root.
+  1. Note: Do not remove the `import svgEditor...` code which is responsible for
+  importing the SVG edit code. Versions prior to 3.0 did not require this,
+  but the advantage is that your HTML does not need to be polluted with
+  extra script references.
+1. Modify or utilize any options. See `docs/tutorials/ConfigOptions.md`
+  ([ConfigOptions]{@tutorial ConfigOptions}).
+
+## ES6 Modules file
+
+1. `svg-editor-es.html` is an HTML file directly using ES6 modules.
+  It is only supported in the latest browsers. It is probably mostly
+  useful for debugging, as it requires more network requests.
+  If you would like to work with this file, you should make configuration
+  changes in `svgedit-config-es.js` (in the SVG-Edit project root).
+1. If you are working with the ES6 Modules config but also wish to work with
+  the normal `svg-editor.html` version (so your code can work in older
+  browsers or get the presumable performance benefits of this file which
+  references JavaScript rolled up into a single file), you can follow these
+  steps after any config changes you make, so that your changes can also be
+  automatically made available to both versions.
+  1. JavaScript:
     1. Run `npm install` within the `node_modules/svgedit` directory to
       install the build tools for SVG-edit.
     1. Run `npm run build-config` within the `node_modules/svgedit` directory.
-1. If you wish to make changes to the HTML, modify `svg-editor-es.html` and
+      1. This will rebuild `svgedit-config-iife.js` (applying Babel to allow
-  then run `npm run build-html` to have the changes properly copied to
+        it to work on older browsers and applying Rollup to build all
-  `svg-editor.html`.
+        JavaScript into one file). The file will then contain non-ES6 module
+        JavaScript that can work in older browsers. Note that it bundles all
+        of SVGEdit, so it is to be expected that this file will be much larger
+        in size than the original ES6 config file.
+  1. HTML:
+    1. If you wish to make changes to both HTML files, it is recommended that you
+      work and test on `svg-editor-es.html` and then run `npm run build-html`
+      to have the changes properly copied to `svg-editor.html`.
 
 ## Recent news
   * 2018-05-26 Published 3.0.0-alpha.2 with ES6 Modules support
@@ -54,18 +95,19 @@ copy of the svgedit Git repo.
 
 ## Supported browsers
 
-The following browsers had been tested for 2.6 or earlier and will probably continue to work with 2.8.
+The following browsers had been tested for 2.6 or earlier and will probably continue to work with 3.0.
-  * Firefox 1.5+
+
-  * Opera 9.50+
+- Firefox 1.5+
-  * Safari 4+
+- Opera 9.50+
-  * Chrome 1+
+- Safari 4+
-  * IE 9+ and Edge
+- Chrome 1+
+- IE 9+ and Edge
 
 ## Further reading and more information
 
- * See [docs](docs/) for more documentation. See the [JSDocs for our latest release](https://svg-edit.github.io/svgedit/releases/svg-edit-3.0.0-alpha.4/docs/jsdoc/index.html).
+ * See [docs](docs/) for more documentation. See the [JSDocs for our latest release](https://svg-edit.github.io/svgedit/releases/latest/docs/jsdoc/index.html).
  * [Acknowledgements](docs/Acknowledgements.md) lists open source projects used in svg-edit.
  * See [AUTHORS](AUTHORS) file for authors.
- * [Stackoverflow](https://stackoverflow.com/tags/svg-edit) group.
+ * [StackOverflow](https://stackoverflow.com/tags/svg-edit) group.
  * Join the [svg-edit mailing list](https://groups.google.com/forum/#!forum/svg-edit).
  * Join us on `#svg-edit` on `freenode.net` (or use the [web client](https://webchat.freenode.net/?channels=svg-edit)).

dist/canvg.js

@@ -151,6 +151,13 @@ var canvg = (function (exports) {
     }
   };
 
+  /**
+   * For parsing color values
+   * @module RGBColor
+   * @author Stoyan Stefanov <sstoo@gmail.com>
+   * @see https://www.phpied.com/rgb-color-parser-in-javascript/
+   * @license MIT
+  */
   var simpleColors = {
     aliceblue: 'f0f8ff',
     antiquewhite: 'faebd7',
@@ -320,12 +327,12 @@ var canvg = (function (exports) {
 
   /**
    * A class to parse color values
-   * @author Stoyan Stefanov <sstoo@gmail.com>
-   * @link   https://www.phpied.com/rgb-color-parser-in-javascript/
-   * @license MIT
    */
 
   var RGBColor = function () {
+    /**
+    * @param {string} colorString
+    */
     function RGBColor(colorString) {
       classCallCheck(this, RGBColor);
 
@@ -372,6 +379,9 @@ var canvg = (function (exports) {
     }
 
     // some getters
+    /**
+    * @returns {string}
+    */
 
 
     createClass(RGBColor, [{
@@ -379,6 +389,11 @@ var canvg = (function (exports) {
       value: function toRGB() {
         return 'rgb(' + this.r + ', ' + this.g + ', ' + this.b + ')';
       }
+
+      /**
+      * @returns {string}
+      */
+
     }, {
       key: 'toHex',
       value: function toHex() {
@@ -397,7 +412,10 @@ var canvg = (function (exports) {
         return '#' + r + g + b;
       }
 
-      // help
+      /**
+      * help
+      * @returns {HTMLUListElement}
+      */
 
     }, {
       key: 'getHelpXML',
@@ -434,28 +452,414 @@ var canvg = (function (exports) {
     return RGBColor;
   }();
 
-  /* eslint-disable new-cap */
+  /**
+  * StackBlur - a fast almost Gaussian Blur For Canvas
 
-  var stackBlurCanvasRGBA = void 0;
+  In case you find this class useful - especially in commercial projects -
-  var setStackBlurCanvasRGBA = function setStackBlurCanvasRGBA(value) {
+  I am not totally unhappy for a small donation to my PayPal account
-    stackBlurCanvasRGBA = value;
+  mario@quasimondo.de
+
+  Or support me on flattr:
+  https://flattr.com/thing/72791/StackBlur-a-fast-almost-Gaussian-Blur-Effect-for-CanvasJavascript
+
+  * @module StackBlur
+  * @version 0.5
+  * @author Mario Klingemann
+  Contact: mario@quasimondo.com
+  Website: http://www.quasimondo.com/StackBlurForCanvas/StackBlurDemo.html
+  Twitter: @quasimondo
+
+  * @copyright (c) 2010 Mario Klingemann
+
+  Permission is hereby granted, free of charge, to any person
+  obtaining a copy of this software and associated documentation
+  files (the "Software"), to deal in the Software without
+  restriction, including without limitation the rights to use,
+  copy, modify, merge, publish, distribute, sublicense, and/or sell
+  copies of the Software, and to permit persons to whom the
+  Software is furnished to do so, subject to the following
+  conditions:
+
+  The above copyright notice and this permission notice shall be
+  included in all copies or substantial portions of the Software.
+
+  THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
+  EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES
+  OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
+  NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT
+  HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY,
+  WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING
+  FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR
+  OTHER DEALINGS IN THE SOFTWARE.
+  */
+
+  var mulTable = [512, 512, 456, 512, 328, 456, 335, 512, 405, 328, 271, 456, 388, 335, 292, 512, 454, 405, 364, 328, 298, 271, 496, 456, 420, 388, 360, 335, 312, 292, 273, 512, 482, 454, 428, 405, 383, 364, 345, 328, 312, 298, 284, 271, 259, 496, 475, 456, 437, 420, 404, 388, 374, 360, 347, 335, 323, 312, 302, 292, 282, 273, 265, 512, 497, 482, 468, 454, 441, 428, 417, 405, 394, 383, 373, 364, 354, 345, 337, 328, 320, 312, 305, 298, 291, 284, 278, 271, 265, 259, 507, 496, 485, 475, 465, 456, 446, 437, 428, 420, 412, 404, 396, 388, 381, 374, 367, 360, 354, 347, 341, 335, 329, 323, 318, 312, 307, 302, 297, 292, 287, 282, 278, 273, 269, 265, 261, 512, 505, 497, 489, 482, 475, 468, 461, 454, 447, 441, 435, 428, 422, 417, 411, 405, 399, 394, 389, 383, 378, 373, 368, 364, 359, 354, 350, 345, 341, 337, 332, 328, 324, 320, 316, 312, 309, 305, 301, 298, 294, 291, 287, 284, 281, 278, 274, 271, 268, 265, 262, 259, 257, 507, 501, 496, 491, 485, 480, 475, 470, 465, 460, 456, 451, 446, 442, 437, 433, 428, 424, 420, 416, 412, 408, 404, 400, 396, 392, 388, 385, 381, 377, 374, 370, 367, 363, 360, 357, 354, 350, 347, 344, 341, 338, 335, 332, 329, 326, 323, 320, 318, 315, 312, 310, 307, 304, 302, 299, 297, 294, 292, 289, 287, 285, 282, 280, 278, 275, 273, 271, 269, 267, 265, 263, 261, 259];
+
+  var shgTable = [9, 11, 12, 13, 13, 14, 14, 15, 15, 15, 15, 16, 16, 16, 16, 17, 17, 17, 17, 17, 17, 17, 18, 18, 18, 18, 18, 18, 18, 18, 18, 19, 19, 19, 19, 19, 19, 19, 19, 19, 19, 19, 19, 19, 19, 20, 20, 20, 20, 20, 20, 20, 20, 20, 20, 20, 20, 20, 20, 20, 20, 20, 20, 21, 21, 21, 21, 21, 21, 21, 21, 21, 21, 21, 21, 21, 21, 21, 21, 21, 21, 21, 21, 21, 21, 21, 21, 21, 21, 21, 22, 22, 22, 22, 22, 22, 22, 22, 22, 22, 22, 22, 22, 22, 22, 22, 22, 22, 22, 22, 22, 22, 22, 22, 22, 22, 22, 22, 22, 22, 22, 22, 22, 22, 22, 22, 22, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24];
+
+  /**
+   * @param {string|HTMLCanvasElement} canvas
+   * @param {Integer} topX
+   * @param {Integer} topY
+   * @param {Integer} width
+   * @param {Integer} height
+   * @throws {Error}
+   * @returns {ImageData} See {@link https://html.spec.whatwg.org/multipage/canvas.html#imagedata}
+   */
+  function getImageDataFromCanvas(canvas, topX, topY, width, height) {
+    if (typeof canvas === 'string') {
+      canvas = document.getElementById(canvas);
+    }
+    if (!canvas || !('getContext' in canvas)) {
+      return;
+    }
+
+    var context = canvas.getContext('2d');
+
+    try {
+      return context.getImageData(topX, topY, width, height);
+    } catch (e) {
+      throw new Error('unable to access image data: ' + e);
+    }
+  }
+
+  /**
+   * @param {HTMLCanvasElement} canvas
+   * @param {Integer} topX
+   * @param {Integer} topY
+   * @param {Integer} width
+   * @param {Integer} height
+   * @param {Float} radius
+   * @returns {undefined}
+   */
+  function processCanvasRGBA(canvas, topX, topY, width, height, radius) {
+    if (isNaN(radius) || radius < 1) {
+      return;
+    }
+    radius |= 0;
+
+    var imageData = getImageDataFromCanvas(canvas, topX, topY, width, height);
+
+    imageData = processImageDataRGBA(imageData, topX, topY, width, height, radius);
+
+    canvas.getContext('2d').putImageData(imageData, topX, topY);
+  }
+
+  /**
+   * @param {ImageData} imageData
+   * @param {Integer} topX
+   * @param {Integer} topY
+   * @param {Integer} width
+   * @param {Integer} height
+   * @param {Float} radius
+   * @returns {ImageData}
+   */
+  function processImageDataRGBA(imageData, topX, topY, width, height, radius) {
+    var pixels = imageData.data;
+
+    var x = void 0,
+        y = void 0,
+        i = void 0,
+        p = void 0,
+        yp = void 0,
+        yi = void 0,
+        yw = void 0,
+        rSum = void 0,
+        gSum = void 0,
+        bSum = void 0,
+        aSum = void 0,
+        rOutSum = void 0,
+        gOutSum = void 0,
+        bOutSum = void 0,
+        aOutSum = void 0,
+        rInSum = void 0,
+        gInSum = void 0,
+        bInSum = void 0,
+        aInSum = void 0,
+        pr = void 0,
+        pg = void 0,
+        pb = void 0,
+        pa = void 0,
+        rbs = void 0;
+
+    var div = radius + radius + 1;
+    // const w4 = width << 2;
+    var widthMinus1 = width - 1;
+    var heightMinus1 = height - 1;
+    var radiusPlus1 = radius + 1;
+    var sumFactor = radiusPlus1 * (radiusPlus1 + 1) / 2;
+
+    var stackStart = new BlurStack();
+    var stack = stackStart;
+    var stackEnd = void 0;
+    for (i = 1; i < div; i++) {
+      stack = stack.next = new BlurStack();
+      if (i === radiusPlus1) {
+        stackEnd = stack;
+      }
+    }
+    stack.next = stackStart;
+    var stackIn = null;
+    var stackOut = null;
+
+    yw = yi = 0;
+
+    var mulSum = mulTable[radius];
+    var shgSum = shgTable[radius];
+
+    for (y = 0; y < height; y++) {
+      rInSum = gInSum = bInSum = aInSum = rSum = gSum = bSum = aSum = 0;
+
+      rOutSum = radiusPlus1 * (pr = pixels[yi]);
+      gOutSum = radiusPlus1 * (pg = pixels[yi + 1]);
+      bOutSum = radiusPlus1 * (pb = pixels[yi + 2]);
+      aOutSum = radiusPlus1 * (pa = pixels[yi + 3]);
+
+      rSum += sumFactor * pr;
+      gSum += sumFactor * pg;
+      bSum += sumFactor * pb;
+      aSum += sumFactor * pa;
+
+      stack = stackStart;
+
+      for (i = 0; i < radiusPlus1; i++) {
+        stack.r = pr;
+        stack.g = pg;
+        stack.b = pb;
+        stack.a = pa;
+        stack = stack.next;
+      }
+
+      for (i = 1; i < radiusPlus1; i++) {
+        p = yi + ((widthMinus1 < i ? widthMinus1 : i) << 2);
+        rSum += (stack.r = pr = pixels[p]) * (rbs = radiusPlus1 - i);
+        gSum += (stack.g = pg = pixels[p + 1]) * rbs;
+        bSum += (stack.b = pb = pixels[p + 2]) * rbs;
+        aSum += (stack.a = pa = pixels[p + 3]) * rbs;
+
+        rInSum += pr;
+        gInSum += pg;
+        bInSum += pb;
+        aInSum += pa;
+
+        stack = stack.next;
+      }
+
+      stackIn = stackStart;
+      stackOut = stackEnd;
+      for (x = 0; x < width; x++) {
+        pixels[yi + 3] = pa = aSum * mulSum >> shgSum;
+        if (pa !== 0) {
+          pa = 255 / pa;
+          pixels[yi] = (rSum * mulSum >> shgSum) * pa;
+          pixels[yi + 1] = (gSum * mulSum >> shgSum) * pa;
+          pixels[yi + 2] = (bSum * mulSum >> shgSum) * pa;
+        } else {
+          pixels[yi] = pixels[yi + 1] = pixels[yi + 2] = 0;
+        }
+
+        rSum -= rOutSum;
+        gSum -= gOutSum;
+        bSum -= bOutSum;
+        aSum -= aOutSum;
+
+        rOutSum -= stackIn.r;
+        gOutSum -= stackIn.g;
+        bOutSum -= stackIn.b;
+        aOutSum -= stackIn.a;
+
+        p = yw + ((p = x + radius + 1) < widthMinus1 ? p : widthMinus1) << 2;
+
+        rInSum += stackIn.r = pixels[p];
+        gInSum += stackIn.g = pixels[p + 1];
+        bInSum += stackIn.b = pixels[p + 2];
+        aInSum += stackIn.a = pixels[p + 3];
+
+        rSum += rInSum;
+        gSum += gInSum;
+        bSum += bInSum;
+        aSum += aInSum;
+
+        stackIn = stackIn.next;
+
+        rOutSum += pr = stackOut.r;
+        gOutSum += pg = stackOut.g;
+        bOutSum += pb = stackOut.b;
+        aOutSum += pa = stackOut.a;
+
+        rInSum -= pr;
+        gInSum -= pg;
+        bInSum -= pb;
+        aInSum -= pa;
+
+        stackOut = stackOut.next;
+
+        yi += 4;
+      }
+      yw += width;
+    }
+
+    for (x = 0; x < width; x++) {
+      gInSum = bInSum = aInSum = rInSum = gSum = bSum = aSum = rSum = 0;
+
+      yi = x << 2;
+      rOutSum = radiusPlus1 * (pr = pixels[yi]);
+      gOutSum = radiusPlus1 * (pg = pixels[yi + 1]);
+      bOutSum = radiusPlus1 * (pb = pixels[yi + 2]);
+      aOutSum = radiusPlus1 * (pa = pixels[yi + 3]);
+
+      rSum += sumFactor * pr;
+      gSum += sumFactor * pg;
+      bSum += sumFactor * pb;
+      aSum += sumFactor * pa;
+
+      stack = stackStart;
+
+      for (i = 0; i < radiusPlus1; i++) {
+        stack.r = pr;
+        stack.g = pg;
+        stack.b = pb;
+        stack.a = pa;
+        stack = stack.next;
+      }
+
+      yp = width;
+
+      for (i = 1; i <= radius; i++) {
+        yi = yp + x << 2;
+
+        rSum += (stack.r = pr = pixels[yi]) * (rbs = radiusPlus1 - i);
+        gSum += (stack.g = pg = pixels[yi + 1]) * rbs;
+        bSum += (stack.b = pb = pixels[yi + 2]) * rbs;
+        aSum += (stack.a = pa = pixels[yi + 3]) * rbs;
+
+        rInSum += pr;
+        gInSum += pg;
+        bInSum += pb;
+        aInSum += pa;
+
+        stack = stack.next;
+
+        if (i < heightMinus1) {
+          yp += width;
+        }
+      }
+
+      yi = x;
+      stackIn = stackStart;
+      stackOut = stackEnd;
+      for (y = 0; y < height; y++) {
+        p = yi << 2;
+        pixels[p + 3] = pa = aSum * mulSum >> shgSum;
+        if (pa > 0) {
+          pa = 255 / pa;
+          pixels[p] = (rSum * mulSum >> shgSum) * pa;
+          pixels[p + 1] = (gSum * mulSum >> shgSum) * pa;
+          pixels[p + 2] = (bSum * mulSum >> shgSum) * pa;
+        } else {
+          pixels[p] = pixels[p + 1] = pixels[p + 2] = 0;
+        }
+
+        rSum -= rOutSum;
+        gSum -= gOutSum;
+        bSum -= bOutSum;
+        aSum -= aOutSum;
+
+        rOutSum -= stackIn.r;
+        gOutSum -= stackIn.g;
+        bOutSum -= stackIn.b;
+        aOutSum -= stackIn.a;
+
+        p = x + ((p = y + radiusPlus1) < heightMinus1 ? p : heightMinus1) * width << 2;
+
+        rSum += rInSum += stackIn.r = pixels[p];
+        gSum += gInSum += stackIn.g = pixels[p + 1];
+        bSum += bInSum += stackIn.b = pixels[p + 2];
+        aSum += aInSum += stackIn.a = pixels[p + 3];
+
+        stackIn = stackIn.next;
+
+        rOutSum += pr = stackOut.r;
+        gOutSum += pg = stackOut.g;
+        bOutSum += pb = stackOut.b;
+        aOutSum += pa = stackOut.a;
+
+        rInSum -= pr;
+        gInSum -= pg;
+        bInSum -= pb;
+        aInSum -= pa;
+
+        stackOut = stackOut.next;
+
+        yi += width;
+      }
+    }
+    return imageData;
+  }
+
+  /**
+   *
+   */
+  var BlurStack = function BlurStack() {
+    classCallCheck(this, BlurStack);
+
+    this.r = 0;
+    this.g = 0;
+    this.b = 0;
+    this.a = 0;
+    this.next = null;
   };
 
-  // canvg(target, s)
+  /* eslint-disable new-cap */
-  // empty parameters: replace all 'svg' elements on page with 'canvas' elements
+
-  // target: canvas element or the id of a canvas element
+  var canvasRGBA_ = processCanvasRGBA;
-  // s: svg string, url to svg file, or xml document
+
-  // opts: optional hash of options
+  /**
-  //     ignoreMouse: true => ignore mouse events
+  * @callback module:canvg.StackBlurCanvasRGBA
-  //     ignoreAnimation: true => ignore animations
+  * @param {string} id
-  //     ignoreDimensions: true => does not try to resize canvas
+  * @param {Float} x
-  //     ignoreClear: true => does not clear canvas
+  * @param {Float} y
-  //     offsetX: int => draws at a x offset
+  * @param {Float} width
-  //     offsetY: int => draws at a y offset
+  * @param {Float} height
-  //     scaleWidth: int => scales horizontally to width
+  * @param {Float} blurRadius
-  //     scaleHeight: int => scales vertically to height
+  */
-  //     forceRedraw: function => will call the function on every frame, if it returns true, will redraw
+
-  // returns all the function after the first render is completed with dom
+  /**
+  * @callback module:canvg.ForceRedraw
+  * @returns {boolean}
+  */
+
+  /**
+  * @function module:canvg.setStackBlurCanvasRGBA
+  * @param {module:canvg.StackBlurCanvasRGBA} cb Will be passed the canvas ID, x, y, width, height, blurRadius
+  */
+  var setStackBlurCanvasRGBA = function setStackBlurCanvasRGBA(cb) {
+    canvasRGBA_ = cb;
+  };
+
+  /**
+  * @typedef {PlainObject} module:canvg.CanvgOptions
+  * @property {boolean} opts.ignoreMouse true => ignore mouse events
+  * @property {boolean} opts.ignoreAnimation true => ignore animations
+  * @property {boolean} opts.ignoreDimensions true => does not try to resize canvas
+  * @property {boolean} opts.ignoreClear true => does not clear canvas
+  * @property {Integer} opts.offsetX int => draws at a x offset
+  * @property {Integer} opts.offsetY int => draws at a y offset
+  * @property {Integer} opts.scaleWidth int => scales horizontally to width
+  * @property {Integer} opts.scaleHeight int => scales vertically to height
+  * @property {module:canvg.ForceRedraw} opts.forceRedraw function => will call the function on every frame, if it returns true, will redraw
+  * @property {boolean} opts.log Adds log function
+  * @property {boolean} opts.useCORS Whether to set CORS `crossOrigin` for the image to `Anonymous`
+  */
+
+  /**
+  * 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
+  * @param {module:canvg.CanvgOptions} [opts] Optional hash of options
+  * @returns {Promise} All the function after the first render is completed with dom
+  */
   var canvg = function canvg(target, s, opts) {
     // no parameters
     if (target == null && s == null && opts == null) {
@@ -497,6 +901,11 @@ var canvg = (function (exports) {
     return svg.load(ctx, s);
   };
 
+  /**
+  * @param {module:canvg.CanvgOptions} opts
+  * @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) {
     var svg = { opts: opts };
 
@@ -3635,16 +4044,17 @@ var canvg = (function (exports) {
       createClass(_class46, [{
         key: 'apply',
         value: function apply(ctx, x, y, width, height) {
-          if (typeof stackBlurCanvasRGBA === 'undefined') {
+          if (typeof canvasRGBA_ === 'undefined') {
             svg.log('ERROR: `setStackBlurCanvasRGBA` must be run for blur to work');
             return;
           }
 
+          // Todo: This might not be a problem anymore with out `instanceof` fix
           // StackBlur requires canvas be on document
           ctx.canvas.id = svg.UniqueId();
           ctx.canvas.style.display = 'none';
           document.body.append(ctx.canvas);
-          stackBlurCanvasRGBA(ctx.canvas.id, x, y, width, height, this.blurRadius);
+          canvasRGBA_(ctx.canvas.id, x, y, width, height, this.blurRadius);
           ctx.canvas.remove();
         }
       }]);

dist/extensions/ext-arrows.js

@@ -1,180 +1,54 @@
 var svgEditorExtension_arrows = (function () {
   'use strict';
 
-  /* globals jQuery */
+  var asyncToGenerator = function (fn) {
-  /*
+    return function () {
-   * ext-arrows.js
+      var gen = fn.apply(this, arguments);
-   *
+      return new Promise(function (resolve, reject) {
-   * Licensed under the MIT License
+        function step(key, arg) {
-   *
+          try {
-   * Copyright(c) 2010 Alexis Deveria
+            var info = gen[key](arg);
-   *
+            var value = info.value;
-   */
+          } catch (error) {
-  var extArrows = {
+            reject(error);
-    name: 'Arrows',
-    init: function init(S) {
-      var svgEditor = this;
-      var svgCanvas = svgEditor.canvas;
-      var $ = jQuery;
-      // {svgcontent} = S,
-      var addElem = S.addSvgElementFromJson,
-          nonce = S.nonce,
-          langList = {
-        en: [{ id: 'arrow_none', textContent: 'No arrow' }],
-        fr: [{ id: 'arrow_none', textContent: 'Sans flèche' }]
-      },
-          prefix = 'se_arrow_';
-
-
-      var selElems = void 0,
-          arrowprefix = void 0,
-          randomizeIds = S.randomize_ids;
-
-      function setArrowNonce(window, n) {
-        randomizeIds = true;
-        arrowprefix = prefix + n + '_';
-        pathdata.fw.id = arrowprefix + 'fw';
-        pathdata.bk.id = arrowprefix + 'bk';
-      }
-
-      function unsetArrowNonce(window) {
-        randomizeIds = false;
-        arrowprefix = prefix;
-        pathdata.fw.id = arrowprefix + 'fw';
-        pathdata.bk.id = arrowprefix + 'bk';
-      }
-
-      svgCanvas.bind('setnonce', setArrowNonce);
-      svgCanvas.bind('unsetnonce', unsetArrowNonce);
-
-      if (randomizeIds) {
-        arrowprefix = prefix + nonce + '_';
-      } else {
-        arrowprefix = prefix;
-      }
-
-      var pathdata = {
-        fw: { d: 'm0,0l10,5l-10,5l5,-5l-5,-5z', refx: 8, id: arrowprefix + 'fw' },
-        bk: { d: 'm10,0l-10,5l10,5l-5,-5l5,-5z', refx: 2, id: arrowprefix + 'bk' }
-      };
-
-      function getLinked(elem, attr) {
-        var str = elem.getAttribute(attr);
-        if (!str) {
-          return null;
-        }
-        var m = str.match(/\(#(.*)\)/);
-        if (!m || m.length !== 2) {
-          return null;
-        }
-        return S.getElem(m[1]);
-      }
-
-      function showPanel(on) {
-        $('#arrow_panel').toggle(on);
-        if (on) {
-          var el = selElems[0];
-          var end = el.getAttribute('marker-end');
-          var start = el.getAttribute('marker-start');
-          var mid = el.getAttribute('marker-mid');
-          var val = void 0;
-          if (end && start) {
-            val = 'both';
-          } else if (end) {
-            val = 'end';
-          } else if (start) {
-            val = 'start';
-          } else if (mid) {
-            val = 'mid';
-            if (mid.includes('bk')) {
-              val = 'mid_bk';
-            }
-          }
-
-          if (!start && !mid && !end) {
-            val = 'none';
-          }
-
-          $('#arrow_list').val(val);
-        }
-      }
-
-      function resetMarker() {
-        var el = selElems[0];
-        el.removeAttribute('marker-start');
-        el.removeAttribute('marker-mid');
-        el.removeAttribute('marker-end');
-      }
-
-      function addMarker(dir, type, id) {
-        // TODO: Make marker (or use?) per arrow type, since refX can be different
-        id = id || arrowprefix + dir;
-
-        var data = pathdata[dir];
-
-        if (type === 'mid') {
-          data.refx = 5;
-        }
-
-        var marker = S.getElem(id);
-        if (!marker) {
-          marker = addElem({
-            element: 'marker',
-            attr: {
-              viewBox: '0 0 10 10',
-              id: id,
-              refY: 5,
-              markerUnits: 'strokeWidth',
-              markerWidth: 5,
-              markerHeight: 5,
-              orient: 'auto',
-              style: 'pointer-events:none' // Currently needed for Opera
-            }
-          });
-          var arrow = addElem({
-            element: 'path',
-            attr: {
-              d: data.d,
-              fill: '#000000'
-            }
-          });
-          marker.append(arrow);
-          S.findDefs().append(marker);
-        }
-
-        marker.setAttribute('refX', data.refx);
-
-        return marker;
-      }
-
-      function setArrow() {
-        resetMarker();
-
-        var type = this.value;
-        if (type === 'none') {
             return;
           }
 
-        // Set marker on element
+          if (info.done) {
-        var dir = 'fw';
+            resolve(value);
-        if (type === 'mid_bk') {
+          } else {
-          type = 'mid';
+            return Promise.resolve(value).then(function (value) {
-          dir = 'bk';
+              step("next", value);
-        } else if (type === 'both') {
+            }, function (err) {
-          addMarker('bk', type);
+              step("throw", err);
-          svgCanvas.changeSelectedAttribute('marker-start', 'url(#' + pathdata.bk.id + ')');
+            });
-          type = 'end';
+          }
-          dir = 'fw';
-        } else if (type === 'start') {
-          dir = 'bk';
         }
 
-        addMarker(dir, type);
+        return step("next");
-        svgCanvas.changeSelectedAttribute('marker-' + type, 'url(#' + pathdata[dir].id + ')');
+      });
-        S.call('changed', selElems);
+    };
-      }
+  };
 
-      function colorChanged(elem) {
+  /* globals jQuery */
+  /**
+   * ext-arrows.js
+   *
+   * @license MIT
+   *
+   * @copyright 2010 Alexis Deveria
+   *
+   */
+  var extArrows = {
+    name: 'arrows',
+    init: function () {
+      var _ref = asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee2(S) {
+        var strings, svgEditor, svgCanvas, $, addElem, nonce, prefix, selElems, arrowprefix, randomizeIds, setArrowNonce, unsetArrowNonce, pathdata, getLinked, showPanel, resetMarker, addMarker, setArrow, colorChanged, contextTools;
+        return regeneratorRuntime.wrap(function _callee2$(_context2) {
+          while (1) {
+            switch (_context2.prev = _context2.next) {
+              case 0:
+                colorChanged = function colorChanged(elem) {
                   var color = elem.getAttribute('stroke');
                   var mtypes = ['start', 'mid', 'end'];
                   var defs = S.findDefs();
@@ -234,38 +108,215 @@ var svgEditorExtension_arrows = (function () {
                       $(marker).remove();
                     }
                   });
+                };
+
+                setArrow = function setArrow() {
+                  resetMarker();
+
+                  var type = this.value;
+                  if (type === 'none') {
+                    return;
                   }
 
-      return {
+                  // Set marker on element
-        name: 'Arrows',
+                  var dir = 'fw';
-        context_tools: [{
+                  if (type === 'mid_bk') {
+                    type = 'mid';
+                    dir = 'bk';
+                  } else if (type === 'both') {
+                    addMarker('bk', type);
+                    svgCanvas.changeSelectedAttribute('marker-start', 'url(#' + pathdata.bk.id + ')');
+                    type = 'end';
+                    dir = 'fw';
+                  } else if (type === 'start') {
+                    dir = 'bk';
+                  }
+
+                  addMarker(dir, type);
+                  svgCanvas.changeSelectedAttribute('marker-' + type, 'url(#' + pathdata[dir].id + ')');
+                  S.call('changed', selElems);
+                };
+
+                addMarker = function addMarker(dir, type, id) {
+                  // TODO: Make marker (or use?) per arrow type, since refX can be different
+                  id = id || arrowprefix + dir;
+
+                  var data = pathdata[dir];
+
+                  if (type === 'mid') {
+                    data.refx = 5;
+                  }
+
+                  var marker = S.getElem(id);
+                  if (!marker) {
+                    marker = addElem({
+                      element: 'marker',
+                      attr: {
+                        viewBox: '0 0 10 10',
+                        id: id,
+                        refY: 5,
+                        markerUnits: 'strokeWidth',
+                        markerWidth: 5,
+                        markerHeight: 5,
+                        orient: 'auto',
+                        style: 'pointer-events:none' // Currently needed for Opera
+                      }
+                    });
+                    var arrow = addElem({
+                      element: 'path',
+                      attr: {
+                        d: data.d,
+                        fill: '#000000'
+                      }
+                    });
+                    marker.append(arrow);
+                    S.findDefs().append(marker);
+                  }
+
+                  marker.setAttribute('refX', data.refx);
+
+                  return marker;
+                };
+
+                resetMarker = function resetMarker() {
+                  var el = selElems[0];
+                  el.removeAttribute('marker-start');
+                  el.removeAttribute('marker-mid');
+                  el.removeAttribute('marker-end');
+                };
+
+                showPanel = function showPanel(on) {
+                  $('#arrow_panel').toggle(on);
+                  if (on) {
+                    var el = selElems[0];
+                    var end = el.getAttribute('marker-end');
+                    var start = el.getAttribute('marker-start');
+                    var mid = el.getAttribute('marker-mid');
+                    var val = void 0;
+                    if (end && start) {
+                      val = 'both';
+                    } else if (end) {
+                      val = 'end';
+                    } else if (start) {
+                      val = 'start';
+                    } else if (mid) {
+                      val = 'mid';
+                      if (mid.includes('bk')) {
+                        val = 'mid_bk';
+                      }
+                    }
+
+                    if (!start && !mid && !end) {
+                      val = 'none';
+                    }
+
+                    $('#arrow_list').val(val);
+                  }
+                };
+
+                getLinked = function getLinked(elem, attr) {
+                  var str = elem.getAttribute(attr);
+                  if (!str) {
+                    return null;
+                  }
+                  var m = str.match(/\(#(.*)\)/);
+                  if (!m || m.length !== 2) {
+                    return null;
+                  }
+                  return S.getElem(m[1]);
+                };
+
+                unsetArrowNonce = function unsetArrowNonce(window) {
+                  randomizeIds = false;
+                  arrowprefix = prefix;
+                  pathdata.fw.id = arrowprefix + 'fw';
+                  pathdata.bk.id = arrowprefix + 'bk';
+                };
+
+                setArrowNonce = function setArrowNonce(window, n) {
+                  randomizeIds = true;
+                  arrowprefix = prefix + n + '_';
+                  pathdata.fw.id = arrowprefix + 'fw';
+                  pathdata.bk.id = arrowprefix + 'bk';
+                };
+
+                _context2.next = 10;
+                return S.importLocale();
+
+              case 10:
+                strings = _context2.sent;
+                svgEditor = this;
+                svgCanvas = svgEditor.canvas;
+                $ = jQuery;
+                // {svgcontent} = S,
+                addElem = S.addSVGElementFromJson, nonce = S.nonce, prefix = 'se_arrow_';
+                selElems = void 0, arrowprefix = void 0, randomizeIds = S.randomize_ids;
+
+
+                svgCanvas.bind('setnonce', setArrowNonce);
+                svgCanvas.bind('unsetnonce', unsetArrowNonce);
+
+                if (randomizeIds) {
+                  arrowprefix = prefix + nonce + '_';
+                } else {
+                  arrowprefix = prefix;
+                }
+
+                pathdata = {
+                  fw: { d: 'm0,0l10,5l-10,5l5,-5l-5,-5z', refx: 8, id: arrowprefix + 'fw' },
+                  bk: { d: 'm10,0l-10,5l10,5l-5,-5l5,-5z', refx: 2, id: arrowprefix + 'bk' }
+                };
+                contextTools = [{
                   type: 'select',
                   panel: 'arrow_panel',
-          title: 'Select arrow type',
                   id: 'arrow_list',
-          options: {
-            none: 'No arrow',
-            end: '---->',
-            start: '<----',
-            both: '<--->',
-            mid: '-->--',
-            mid_bk: '--<--'
-          },
                   defval: 'none',
                   events: {
                     change: setArrow
                   }
-        }],
+                }];
+                return _context2.abrupt('return', {
+                  name: strings.name,
+                  context_tools: strings.contextTools.map(function (contextTool, i) {
+                    return Object.assign(contextTools[i], contextTool);
+                  }),
                   callback: function callback() {
                     $('#arrow_panel').hide();
                     // Set ID so it can be translated in locale file
                     $('#arrow_list option')[0].id = 'connector_no_arrow';
                   },
-        addLangData: function addLangData(lang) {
+                  addLangData: function () {
-          return {
+                    var _ref3 = asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee(_ref2) {
-            data: langList[lang]
+                      var lang = _ref2.lang,
-          };
+                          importLocale = _ref2.importLocale;
-        },
+                      var strings;
+                      return regeneratorRuntime.wrap(function _callee$(_context) {
+                        while (1) {
+                          switch (_context.prev = _context.next) {
+                            case 0:
+                              _context.next = 2;
+                              return importLocale();
+
+                            case 2:
+                              strings = _context.sent;
+                              return _context.abrupt('return', {
+                                data: strings.langList
+                              });
+
+                            case 4:
+                            case 'end':
+                              return _context.stop();
+                          }
+                        }
+                      }, _callee, this);
+                    }));
+
+                    function addLangData(_x2) {
+                      return _ref3.apply(this, arguments);
+                    }
+
+                    return addLangData;
+                  }(),
                   selectedChanged: function selectedChanged(opts) {
                     // Use this to update the current selected elements
                     selElems = opts.elems;
@@ -295,8 +346,22 @@ var svgEditorExtension_arrows = (function () {
                       colorChanged(elem);
                     }
                   }
-      };
+                });
+
+              case 22:
+              case 'end':
+                return _context2.stop();
             }
+          }
+        }, _callee2, this);
+      }));
+
+      function init(_x) {
+        return _ref.apply(this, arguments);
+      }
+
+      return init;
+    }()
   };
 
   return extArrows;

dist/extensions/ext-closepath.js

@@ -1,25 +1,67 @@
 var svgEditorExtension_closepath = (function () {
   'use strict';
 
+  var asyncToGenerator = function (fn) {
+    return function () {
+      var gen = fn.apply(this, arguments);
+      return new Promise(function (resolve, reject) {
+        function step(key, arg) {
+          try {
+            var info = gen[key](arg);
+            var value = info.value;
+          } catch (error) {
+            reject(error);
+            return;
+          }
+
+          if (info.done) {
+            resolve(value);
+          } else {
+            return Promise.resolve(value).then(function (value) {
+              step("next", value);
+            }, function (err) {
+              step("throw", err);
+            });
+          }
+        }
+
+        return step("next");
+      });
+    };
+  };
+
   /* globals jQuery */
-  /*
+  /**
    * ext-closepath.js
    *
-   * Licensed under the MIT License
+   * @license MIT
    *
-   * Copyright(c) 2010 Jeff Schiller
+   * @copyright 2010 Jeff Schiller
    *
    */
 
   // This extension adds a simple button to the contextual panel for paths
   // The button toggles whether the path is open or closed
   var extClosepath = {
-    name: 'ClosePath',
+    name: 'closepath',
-    init: function init() {
+    init: function () {
-      var $ = jQuery;
+      var _ref2 = asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee(_ref) {
-      var svgEditor = this;
+        var importLocale = _ref.importLocale;
-      var selElems = void 0;
+        var strings, $, svgEditor, selElems, updateButton, showPanel, toggleClosed, buttons;
-      var updateButton = function updateButton(path) {
+        return regeneratorRuntime.wrap(function _callee$(_context) {
+          while (1) {
+            switch (_context.prev = _context.next) {
+              case 0:
+                _context.next = 2;
+                return importLocale();
+
+              case 2:
+                strings = _context.sent;
+                $ = jQuery;
+                svgEditor = this;
+                selElems = void 0;
+
+                updateButton = function updateButton(path) {
                   var seglist = path.pathSegList,
                       closed = seglist.getItem(seglist.numberOfItems - 1).pathSegType === 1,
                       showbutton = closed ? '#tool_openpath' : '#tool_closepath',
@@ -27,7 +69,8 @@ var svgEditorExtension_closepath = (function () {
                   $(hidebutton).hide();
                   $(showbutton).show();
                 };
-      var showPanel = function showPanel(on) {
+
+                showPanel = function showPanel(on) {
                   $('#closepath_panel').toggle(on);
                   if (on) {
                     var path = selElems[0];
@@ -36,7 +79,8 @@ var svgEditorExtension_closepath = (function () {
                     }
                   }
                 };
-      var toggleClosed = function toggleClosed() {
+
+                toggleClosed = function toggleClosed() {
                   var path = selElems[0];
                   if (path) {
                     var seglist = path.pathSegList,
@@ -51,14 +95,10 @@ var svgEditorExtension_closepath = (function () {
                   }
                 };
 
-      return {
+                buttons = [{
-        name: 'ClosePath',
-        svgicons: svgEditor.curConfig.extIconsPath + 'closepath_icons.svg',
-        buttons: [{
                   id: 'tool_openpath',
                   type: 'context',
                   panel: 'closepath_panel',
-          title: 'Open path',
                   events: {
                     click: function click() {
                       toggleClosed();
@@ -68,13 +108,18 @@ var svgEditorExtension_closepath = (function () {
                   id: 'tool_closepath',
                   type: 'context',
                   panel: 'closepath_panel',
-          title: 'Close path',
                   events: {
                     click: function click() {
                       toggleClosed();
                     }
                   }
-        }],
+                }];
+                return _context.abrupt('return', {
+                  name: strings.name,
+                  svgicons: svgEditor.curConfig.extIconsPath + 'closepath_icons.svg',
+                  buttons: strings.buttons.map(function (button, i) {
+                    return Object.assign(buttons[i], button);
+                  }),
                   callback: function callback() {
                     $('#closepath_panel').hide();
                   },
@@ -94,8 +139,22 @@ var svgEditorExtension_closepath = (function () {
                       }
                     }
                   }
-      };
+                });
+
+              case 11:
+              case 'end':
+                return _context.stop();
             }
+          }
+        }, _callee, this);
+      }));
+
+      function init(_x) {
+        return _ref2.apply(this, arguments);
+      }
+
+      return init;
+    }()
   };
 
   return extClosepath;

dist/extensions/ext-connector.js

@@ -1,217 +1,71 @@
 var svgEditorExtension_connector = (function () {
   'use strict';
 
+  var asyncToGenerator = function (fn) {
+    return function () {
+      var gen = fn.apply(this, arguments);
+      return new Promise(function (resolve, reject) {
+        function step(key, arg) {
+          try {
+            var info = gen[key](arg);
+            var value = info.value;
+          } catch (error) {
+            reject(error);
+            return;
+          }
+
+          if (info.done) {
+            resolve(value);
+          } else {
+            return Promise.resolve(value).then(function (value) {
+              step("next", value);
+            }, function (err) {
+              step("throw", err);
+            });
+          }
+        }
+
+        return step("next");
+      });
+    };
+  };
+
   /* globals jQuery */
-  /*
+  /**
    * ext-connector.js
    *
-   * Licensed under the MIT License
+   * @license MIT
    *
-   * Copyright(c) 2010 Alexis Deveria
+   * @copyright 2010 Alexis Deveria
    *
    */
 
   var extConnector = {
-    name: 'Connector',
+    name: 'connector',
-    init: function init(S) {
+    init: function () {
-      var $ = jQuery;
+      var _ref = asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee2(S) {
-      var svgEditor = this;
+        var $, svgEditor, svgCanvas, svgroot, getNextId, getElem, importLocale, addElem, selManager, connSel, elData, strings, startX, startY, curLine, startElem, endElem, seNs, svgcontent, started, connections, selElems, getBBintersect, getOffset, showPanel, setPoint, updateLine, findConnectors, updateConnectors, init, buttons;
-      var svgCanvas = svgEditor.canvas;
+        return regeneratorRuntime.wrap(function _callee2$(_context2) {
-      var svgroot = S.svgroot,
+          while (1) {
-          getNextId = S.getNextId,
+            switch (_context2.prev = _context2.next) {
-          getElem = S.getElem,
+              case 0:
-          addElem = S.addSvgElementFromJson,
+                init = function init() {
-          selManager = S.selectorManager,
+                  // Make sure all connectors have data set
-          connSel = '.se_connector',
+                  $(svgcontent).find('*').each(function () {
-          elData = $.data;
+                    var conn = this.getAttributeNS(seNs, 'connector');
-      var startX = void 0,
+                    if (conn) {
-          startY = void 0,
+                      this.setAttribute('class', connSel.substr(1));
-          curLine = void 0,
+                      var connData = conn.split(' ');
-          startElem = void 0,
+                      var sbb = svgCanvas.getStrokedBBox([getElem(connData[0])]);
-          endElem = void 0,
+                      var ebb = svgCanvas.getStrokedBBox([getElem(connData[1])]);
-          seNs = void 0,
+                      $(this).data('c_start', connData[0]).data('c_end', connData[1]).data('start_bb', sbb).data('end_bb', ebb);
-          svgcontent = S.svgcontent,
+                      svgCanvas.getEditorNS(true);
-          started = false,
-          connections = [],
-          selElems = [];
-
-
-      var langList = {
-        en: [{ id: 'mode_connect', title: 'Connect two objects' }],
-        fr: [{ id: 'mode_connect', title: 'Connecter deux objets' }]
-      };
-
-      function getBBintersect(x, y, bb, offset) {
-        if (offset) {
-          offset -= 0;
-          bb = $.extend({}, bb);
-          bb.width += offset;
-          bb.height += offset;
-          bb.x -= offset / 2;
-          bb.y -= offset / 2;
-        }
-
-        var midX = bb.x + bb.width / 2;
-        var midY = bb.y + bb.height / 2;
-        var lenX = x - midX;
-        var lenY = y - midY;
-
-        var slope = Math.abs(lenY / lenX);
-
-        var ratio = void 0;
-        if (slope < bb.height / bb.width) {
-          ratio = bb.width / 2 / Math.abs(lenX);
-        } else {
-          ratio = lenY ? bb.height / 2 / Math.abs(lenY) : 0;
-        }
-
-        return {
-          x: midX + lenX * ratio,
-          y: midY + lenY * ratio
-        };
-      }
-
-      function getOffset(side, line) {
-        var giveOffset = !!line.getAttribute('marker-' + side);
-        // const giveOffset = $(line).data(side+'_off');
-
-        // TODO: Make this number (5) be based on marker width/height
-        var size = line.getAttribute('stroke-width') * 5;
-        return giveOffset ? size : 0;
-      }
-
-      function showPanel(on) {
-        var connRules = $('#connector_rules');
-        if (!connRules.length) {
-          connRules = $('<style id="connector_rules"></style>').appendTo('head');
-        }
-        connRules.text(!on ? '' : '#tool_clone, #tool_topath, #tool_angle, #xy_panel { display: none !important; }');
-        $('#connector_panel').toggle(on);
-      }
-
-      function setPoint(elem, pos, x, y, setMid) {
-        var pts = elem.points;
-        var pt = svgroot.createSVGPoint();
-        pt.x = x;
-        pt.y = y;
-        if (pos === 'end') {
-          pos = pts.numberOfItems - 1;
-        }
-        // TODO: Test for this on init, then use alt only if needed
-        try {
-          pts.replaceItem(pt, pos);
-        } catch (err) {
-          // Should only occur in FF which formats points attr as "n,n n,n", so just split
-          var ptArr = elem.getAttribute('points').split(' ');
-          for (var i = 0; i < ptArr.length; i++) {
-            if (i === pos) {
-              ptArr[i] = x + ',' + y;
-            }
-          }
-          elem.setAttribute('points', ptArr.join(' '));
-        }
-
-        if (setMid) {
-          // Add center point
-          var ptStart = pts.getItem(0);
-          var ptEnd = pts.getItem(pts.numberOfItems - 1);
-          setPoint(elem, 1, (ptEnd.x + ptStart.x) / 2, (ptEnd.y + ptStart.y) / 2);
-        }
-      }
-
-      function updateLine(diffX, diffY) {
-        // Update line with element
-        var i = connections.length;
-        while (i--) {
-          var conn = connections[i];
-          var line = conn.connector;
-          // const {elem} = conn;
-
-          var pre = conn.is_start ? 'start' : 'end';
-          // const sw = line.getAttribute('stroke-width') * 5;
-
-          // Update bbox for this element
-          var bb = elData(line, pre + '_bb');
-          bb.x = conn.start_x + diffX;
-          bb.y = conn.start_y + diffY;
-          elData(line, pre + '_bb', bb);
-
-          var altPre = conn.is_start ? 'end' : 'start';
-
-          // Get center pt of connected element
-          var bb2 = elData(line, altPre + '_bb');
-          var srcX = bb2.x + bb2.width / 2;
-          var srcY = bb2.y + bb2.height / 2;
-
-          // Set point of element being moved
-          var pt = getBBintersect(srcX, srcY, bb, getOffset(pre, line)); // $(line).data(pre+'_off')?sw:0
-          setPoint(line, conn.is_start ? 0 : 'end', pt.x, pt.y, true);
-
-          // Set point of connected element
-          var pt2 = getBBintersect(pt.x, pt.y, elData(line, altPre + '_bb'), getOffset(altPre, line));
-          setPoint(line, conn.is_start ? 'end' : 0, pt2.x, pt2.y, true);
-        }
-      }
-
-      /**
-      *
-      * @param {array} [elem=selElems] Array of elements
-      */
-      function findConnectors() {
-        var elems = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : selElems;
-
-        var connectors = $(svgcontent).find(connSel);
-        connections = [];
-
-        // Loop through connectors to see if one is connected to the element
-        connectors.each(function () {
-          var addThis = void 0;
-          function add() {
-            if (elems.includes(this)) {
-              // Pretend this element is selected
-              addThis = true;
-            }
-          }
-
-          // Grab the ends
-          var parts = [];
-          ['start', 'end'].forEach(function (pos, i) {
-            var key = 'c_' + pos;
-            var part = elData(this, key);
-            if (part == null) {
-              part = document.getElementById(this.attributes['se:connector'].value.split(' ')[i]);
-              elData(this, 'c_' + pos, part.id);
-              elData(this, pos + '_bb', svgCanvas.getStrokedBBox([part]));
-            } else part = document.getElementById(part);
-            parts.push(part);
-          }.bind(this));
-
-          for (var i = 0; i < 2; i++) {
-            var cElem = parts[i];
-
-            addThis = false;
-            // The connected element might be part of a selected group
-            $(cElem).parents().each(add);
-
-            if (!cElem || !cElem.parentNode) {
-              $(this).remove();
-              continue;
-            }
-            if (elems.includes(cElem) || addThis) {
-              var bb = svgCanvas.getStrokedBBox([cElem]);
-              connections.push({
-                elem: cElem,
-                connector: this,
-                is_start: i === 0,
-                start_x: bb.x,
-                start_y: bb.y
-              });
-            }
                     }
                   });
-      }
+                  // updateConnectors();
+                };
 
-      function updateConnectors(elems) {
+                updateConnectors = function updateConnectors(elems) {
                   // Updates connector lines based on selected elements
                   // Is not used on mousemove, as it runs getStrokedBBox every time,
                   // which isn't necessary there.
@@ -263,7 +117,189 @@ var svgEditorExtension_connector = (function () {
                       }
                     }
                   }
+                };
+
+                findConnectors = function findConnectors() {
+                  var elems = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : selElems;
+
+                  var connectors = $(svgcontent).find(connSel);
+                  connections = [];
+
+                  // Loop through connectors to see if one is connected to the element
+                  connectors.each(function () {
+                    var addThis = void 0;
+                    function add() {
+                      if (elems.includes(this)) {
+                        // Pretend this element is selected
+                        addThis = true;
                       }
+                    }
+
+                    // Grab the ends
+                    var parts = [];
+                    ['start', 'end'].forEach(function (pos, i) {
+                      var key = 'c_' + pos;
+                      var part = elData(this, key);
+                      if (part == null) {
+                        part = document.getElementById(this.attributes['se:connector'].value.split(' ')[i]);
+                        elData(this, 'c_' + pos, part.id);
+                        elData(this, pos + '_bb', svgCanvas.getStrokedBBox([part]));
+                      } else part = document.getElementById(part);
+                      parts.push(part);
+                    }.bind(this));
+
+                    for (var i = 0; i < 2; i++) {
+                      var cElem = parts[i];
+
+                      addThis = false;
+                      // The connected element might be part of a selected group
+                      $(cElem).parents().each(add);
+
+                      if (!cElem || !cElem.parentNode) {
+                        $(this).remove();
+                        continue;
+                      }
+                      if (elems.includes(cElem) || addThis) {
+                        var bb = svgCanvas.getStrokedBBox([cElem]);
+                        connections.push({
+                          elem: cElem,
+                          connector: this,
+                          is_start: i === 0,
+                          start_x: bb.x,
+                          start_y: bb.y
+                        });
+                      }
+                    }
+                  });
+                };
+
+                updateLine = function updateLine(diffX, diffY) {
+                  // Update line with element
+                  var i = connections.length;
+                  while (i--) {
+                    var conn = connections[i];
+                    var line = conn.connector;
+                    // const {elem} = conn;
+
+                    var pre = conn.is_start ? 'start' : 'end';
+                    // const sw = line.getAttribute('stroke-width') * 5;
+
+                    // Update bbox for this element
+                    var bb = elData(line, pre + '_bb');
+                    bb.x = conn.start_x + diffX;
+                    bb.y = conn.start_y + diffY;
+                    elData(line, pre + '_bb', bb);
+
+                    var altPre = conn.is_start ? 'end' : 'start';
+
+                    // Get center pt of connected element
+                    var bb2 = elData(line, altPre + '_bb');
+                    var srcX = bb2.x + bb2.width / 2;
+                    var srcY = bb2.y + bb2.height / 2;
+
+                    // Set point of element being moved
+                    var pt = getBBintersect(srcX, srcY, bb, getOffset(pre, line)); // $(line).data(pre+'_off')?sw:0
+                    setPoint(line, conn.is_start ? 0 : 'end', pt.x, pt.y, true);
+
+                    // Set point of connected element
+                    var pt2 = getBBintersect(pt.x, pt.y, elData(line, altPre + '_bb'), getOffset(altPre, line));
+                    setPoint(line, conn.is_start ? 'end' : 0, pt2.x, pt2.y, true);
+                  }
+                };
+
+                setPoint = function setPoint(elem, pos, x, y, setMid) {
+                  var pts = elem.points;
+                  var pt = svgroot.createSVGPoint();
+                  pt.x = x;
+                  pt.y = y;
+                  if (pos === 'end') {
+                    pos = pts.numberOfItems - 1;
+                  }
+                  // TODO: Test for this on init, then use alt only if needed
+                  try {
+                    pts.replaceItem(pt, pos);
+                  } catch (err) {
+                    // Should only occur in FF which formats points attr as "n,n n,n", so just split
+                    var ptArr = elem.getAttribute('points').split(' ');
+                    for (var i = 0; i < ptArr.length; i++) {
+                      if (i === pos) {
+                        ptArr[i] = x + ',' + y;
+                      }
+                    }
+                    elem.setAttribute('points', ptArr.join(' '));
+                  }
+
+                  if (setMid) {
+                    // Add center point
+                    var ptStart = pts.getItem(0);
+                    var ptEnd = pts.getItem(pts.numberOfItems - 1);
+                    setPoint(elem, 1, (ptEnd.x + ptStart.x) / 2, (ptEnd.y + ptStart.y) / 2);
+                  }
+                };
+
+                showPanel = function showPanel(on) {
+                  var connRules = $('#connector_rules');
+                  if (!connRules.length) {
+                    connRules = $('<style id="connector_rules"></style>').appendTo('head');
+                  }
+                  connRules.text(!on ? '' : '#tool_clone, #tool_topath, #tool_angle, #xy_panel { display: none !important; }');
+                  $('#connector_panel').toggle(on);
+                };
+
+                getOffset = function getOffset(side, line) {
+                  var giveOffset = !!line.getAttribute('marker-' + side);
+                  // const giveOffset = $(line).data(side+'_off');
+
+                  // TODO: Make this number (5) be based on marker width/height
+                  var size = line.getAttribute('stroke-width') * 5;
+                  return giveOffset ? size : 0;
+                };
+
+                getBBintersect = function getBBintersect(x, y, bb, offset) {
+                  if (offset) {
+                    offset -= 0;
+                    bb = $.extend({}, bb);
+                    bb.width += offset;
+                    bb.height += offset;
+                    bb.x -= offset / 2;
+                    bb.y -= offset / 2;
+                  }
+
+                  var midX = bb.x + bb.width / 2;
+                  var midY = bb.y + bb.height / 2;
+                  var lenX = x - midX;
+                  var lenY = y - midY;
+
+                  var slope = Math.abs(lenY / lenX);
+
+                  var ratio = void 0;
+                  if (slope < bb.height / bb.width) {
+                    ratio = bb.width / 2 / Math.abs(lenX);
+                  } else {
+                    ratio = lenY ? bb.height / 2 / Math.abs(lenY) : 0;
+                  }
+
+                  return {
+                    x: midX + lenX * ratio,
+                    y: midY + lenY * ratio
+                  };
+                };
+
+                $ = jQuery;
+                svgEditor = this;
+                svgCanvas = svgEditor.canvas;
+                svgroot = S.svgroot, getNextId = S.getNextId, getElem = S.getElem, importLocale = S.importLocale, addElem = S.addSVGElementFromJson, selManager = S.selectorManager, connSel = '.se_connector', elData = $.data;
+                _context2.next = 14;
+                return importLocale();
+
+              case 14:
+                strings = _context2.sent;
+                startX = void 0, startY = void 0, curLine = void 0, startElem = void 0, endElem = void 0, seNs = void 0, svgcontent = S.svgcontent, started = false, connections = [], selElems = [];
+
+                /**
+                *
+                * @param {Element[]} [elem=selElems] Array of elements
+                */
 
                 // Do once
                 (function () {
@@ -286,21 +322,7 @@ var svgEditorExtension_connector = (function () {
                 })();
 
                 // Do on reset
-      function init() {
+
-        // Make sure all connectors have data set
-        $(svgcontent).find('*').each(function () {
-          var conn = this.getAttributeNS(seNs, 'connector');
-          if (conn) {
-            this.setAttribute('class', connSel.substr(1));
-            var connData = conn.split(' ');
-            var sbb = svgCanvas.getStrokedBBox([getElem(connData[0])]);
-            var ebb = svgCanvas.getStrokedBBox([getElem(connData[1])]);
-            $(this).data('c_start', connData[0]).data('c_end', connData[1]).data('start_bb', sbb).data('end_bb', ebb);
-            svgCanvas.getEditorNS(true);
-          }
-        });
-        // updateConnectors();
-      }
 
                 // $(svgroot).parent().mousemove(function (e) {
                 // // if (started
@@ -313,14 +335,10 @@ var svgEditorExtension_connector = (function () {
                 // // }
                 // });
 
-      return {
+                buttons = [{
-        name: 'Connector',
-        svgicons: svgEditor.curConfig.imgPath + 'conn.svg',
-        buttons: [{
                   id: 'mode_connect',
                   type: 'mode',
                   icon: svgEditor.curConfig.imgPath + 'cut.png',
-          title: 'Connect two objects',
                   includeWith: {
                     button: '#tool_line',
                     isDefault: false,
@@ -331,12 +349,39 @@ var svgEditorExtension_connector = (function () {
                       svgCanvas.setMode('connector');
                     }
                   }
-        }],
+                }];
-        addLangData: function addLangData(lang) {
+                return _context2.abrupt('return', {
-          return {
+                  name: strings.name,
-            data: langList[lang]
+                  svgicons: svgEditor.curConfig.imgPath + 'conn.svg',
-          };
+                  buttons: strings.buttons.map(function (button, i) {
-        },
+                    return Object.assign(buttons[i], button);
+                  }),
+                  addLangData: function () {
+                    var _ref3 = asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee(_ref2) {
+                      var lang = _ref2.lang,
+                          importLocale = _ref2.importLocale;
+                      return regeneratorRuntime.wrap(function _callee$(_context) {
+                        while (1) {
+                          switch (_context.prev = _context.next) {
+                            case 0:
+                              return _context.abrupt('return', {
+                                data: strings.langList
+                              });
+
+                            case 1:
+                            case 'end':
+                              return _context.stop();
+                          }
+                        }
+                      }, _callee, this);
+                    }));
+
+                    function addLangData(_x3) {
+                      return _ref3.apply(this, arguments);
+                    }
+
+                    return addLangData;
+                  }(),
                   mouseDown: function mouseDown(opts) {
                     var e = opts.event;
                     startX = opts.start_x;
@@ -613,8 +658,22 @@ var svgEditorExtension_connector = (function () {
                     }
                     $('#mode_connect').toggleClass('disabled', opts.nostroke);
                   }
-      };
+                });
+
+              case 19:
+              case 'end':
+                return _context2.stop();
             }
+          }
+        }, _callee2, this);
+      }));
+
+      function init(_x) {
+        return _ref.apply(this, arguments);
+      }
+
+      return init;
+    }()
   };
 
   return extConnector;

dist/extensions/ext-eyedropper.js

@@ -1,36 +1,55 @@
 var svgEditorExtension_eyedropper = (function () {
   'use strict';
 
+  var asyncToGenerator = function (fn) {
+    return function () {
+      var gen = fn.apply(this, arguments);
+      return new Promise(function (resolve, reject) {
+        function step(key, arg) {
+          try {
+            var info = gen[key](arg);
+            var value = info.value;
+          } catch (error) {
+            reject(error);
+            return;
+          }
+
+          if (info.done) {
+            resolve(value);
+          } else {
+            return Promise.resolve(value).then(function (value) {
+              step("next", value);
+            }, function (err) {
+              step("throw", err);
+            });
+          }
+        }
+
+        return step("next");
+      });
+    };
+  };
+
   /* globals jQuery */
-  /*
+  /**
    * ext-eyedropper.js
    *
-   * Licensed under the MIT License
+   * @license MIT
    *
-   * Copyright(c) 2010 Jeff Schiller
+   * @copyright 2010 Jeff Schiller
    *
    */
 
   var extEyedropper = {
     name: 'eyedropper',
-    init: function init(S) {
+    init: function () {
-      var svgEditor = this;
+      var _ref = asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee(S) {
-      var $ = jQuery;
+        var strings, svgEditor, $, ChangeElementCommand, svgCanvas, addToHistory, currentStyle, getStyle, buttons;
-      var ChangeElementCommand = S.ChangeElementCommand,
+        return regeneratorRuntime.wrap(function _callee$(_context) {
-          svgCanvas = svgEditor.canvas,
+          while (1) {
-          addToHistory = function addToHistory(cmd) {
+            switch (_context.prev = _context.next) {
-        svgCanvas.undoMgr.addCommandToHistory(cmd);
+              case 0:
-      },
+                getStyle = function getStyle(opts) {
-          currentStyle = {
-        fillPaint: 'red', fillOpacity: 1.0,
-        strokePaint: 'black', strokeOpacity: 1.0,
-        strokeWidth: 5, strokeDashArray: null,
-        opacity: 1.0,
-        strokeLinecap: 'butt',
-        strokeLinejoin: 'miter'
-      };
-
-      function getStyle(opts) {
                   // if we are in eyedropper mode, we don't want to disable the eye-dropper tool
                   var mode = svgCanvas.getMode();
                   if (mode === 'eyedropper') {
@@ -57,22 +76,40 @@ var svgEditorExtension_eyedropper = (function () {
                   } else {
                     tool.addClass('disabled');
                   }
-      }
+                };
 
-      return {
+                _context.next = 3;
-        name: 'eyedropper',
+                return S.importLocale();
-        svgicons: svgEditor.curConfig.extIconsPath + 'eyedropper-icon.xml',
+
-        buttons: [{
+              case 3:
+                strings = _context.sent;
+                svgEditor = this;
+                $ = jQuery;
+                ChangeElementCommand = S.ChangeElementCommand, svgCanvas = svgEditor.canvas, addToHistory = function addToHistory(cmd) {
+                  svgCanvas.undoMgr.addCommandToHistory(cmd);
+                }, currentStyle = {
+                  fillPaint: 'red', fillOpacity: 1.0,
+                  strokePaint: 'black', strokeOpacity: 1.0,
+                  strokeWidth: 5, strokeDashArray: null,
+                  opacity: 1.0,
+                  strokeLinecap: 'butt',
+                  strokeLinejoin: 'miter'
+                };
+                buttons = [{
                   id: 'tool_eyedropper',
                   type: 'mode',
-          title: 'Eye Dropper Tool',
-          key: 'I',
                   events: {
                     click: function click() {
                       svgCanvas.setMode('eyedropper');
                     }
                   }
-        }],
+                }];
+                return _context.abrupt('return', {
+                  name: strings.name,
+                  svgicons: svgEditor.curConfig.extIconsPath + 'eyedropper-icon.xml',
+                  buttons: strings.buttons.map(function (button, i) {
+                    return Object.assign(buttons[i], button);
+                  }),
 
                   // if we have selected an element, grab its paint and enable the eye dropper button
                   selectedChanged: getStyle,
@@ -124,8 +161,22 @@ var svgEditorExtension_eyedropper = (function () {
                       }
                     }
                   }
-      };
+                });
+
+              case 9:
+              case 'end':
+                return _context.stop();
             }
+          }
+        }, _callee, this);
+      }));
+
+      function init(_x) {
+        return _ref.apply(this, arguments);
+      }
+
+      return init;
+    }()
   };
 
   return extEyedropper;

dist/extensions/ext-foreignobject.js

@@ -1,63 +1,76 @@
 var svgEditorExtension_foreignobject = (function () {
   'use strict';
 
+  var asyncToGenerator = function (fn) {
+    return function () {
+      var gen = fn.apply(this, arguments);
+      return new Promise(function (resolve, reject) {
+        function step(key, arg) {
+          try {
+            var info = gen[key](arg);
+            var value = info.value;
+          } catch (error) {
+            reject(error);
+            return;
+          }
+
+          if (info.done) {
+            resolve(value);
+          } else {
+            return Promise.resolve(value).then(function (value) {
+              step("next", value);
+            }, function (err) {
+              step("throw", err);
+            });
+          }
+        }
+
+        return step("next");
+      });
+    };
+  };
+
   /* globals jQuery */
-  /*
+  /**
    * ext-foreignobject.js
    *
-   * Licensed under the Apache License, Version 2
+   * @license Apache-2.0
    *
-   * Copyright(c) 2010 Jacques Distler
+   * @copyright 2010 Jacques Distler, 2010 Alexis Deveria
-   * Copyright(c) 2010 Alexis Deveria
    *
    */
 
   var extForeignobject = {
-    name: 'foreignObject',
+    name: 'foreignobject',
-    init: function init(S) {
+    init: function () {
-      var svgEditor = this;
+      var _ref = asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee(S) {
-      var text2xml = S.text2xml,
+        var svgEditor, text2xml, NS, importLocale, $, svgCanvas, svgdoc, strings, properlySourceSizeTextArea, showPanel, toggleSourceButtons, selElems, started, newFO, editingforeign, setForeignString, showForeignEditor, setAttr, buttons, contextTools;
-          NS = S.NS;
+        return regeneratorRuntime.wrap(function _callee$(_context) {
-
+          while (1) {
-      var $ = jQuery;
+            switch (_context.prev = _context.next) {
-      var svgCanvas = svgEditor.canvas;
+              case 0:
-      var
+                setAttr = function setAttr(attr, val) {
-      // {svgcontent} = S,
+                  svgCanvas.changeSelectedAttribute(attr, val);
-      // addElem = S.addSvgElementFromJson,
+                  S.call('changed', selElems);
-      svgdoc = S.svgroot.parentNode.ownerDocument;
-
-      var properlySourceSizeTextArea = function properlySourceSizeTextArea() {
-        // TODO: remove magic numbers here and get values from CSS
-        var height = $('#svg_source_container').height() - 80;
-        $('#svg_source_textarea').css('height', height);
                 };
 
-      function showPanel(on) {
+                showForeignEditor = function showForeignEditor() {
-        var fcRules = $('#fc_rules');
+                  var elt = selElems[0];
-        if (!fcRules.length) {
+                  if (!elt || editingforeign) {
-          fcRules = $('<style id="fc_rules"></style>').appendTo('head');
+                    return;
-        }
-        fcRules.text(!on ? '' : ' #tool_topath { display: none !important; }');
-        $('#foreignObject_panel').toggle(on);
                   }
+                  editingforeign = true;
+                  toggleSourceButtons(true);
+                  elt.removeAttribute('fill');
 
-      function toggleSourceButtons(on) {
+                  var str = S.svgToString(elt, 0);
-        $('#tool_source_save, #tool_source_cancel').toggle(!on);
+                  $('#svg_source_textarea').val(str);
-        $('#foreign_save, #foreign_cancel').toggle(on);
+                  $('#svg_source_editor').fadeIn();
-      }
+                  properlySourceSizeTextArea();
+                  $('#svg_source_textarea').focus();
+                };
 
-      var selElems = void 0,
+                setForeignString = function setForeignString(xmlString) {
-          started = void 0,
-          newFO = void 0,
-          editingforeign = false;
-
-      /**
-      * This function sets the content of element elt to the input XML.
-      * @param {String} xmlString - The XML text.
-      * @param elt - the parent element to append to
-      * @returns {Boolean} This function returns false if the set was unsuccessful, true otherwise.
-      */
-      function setForeignString(xmlString) {
                   var elt = selElems[0];
                   try {
                     // convert string into XML document
@@ -73,36 +86,51 @@ var svgEditorExtension_foreignobject = (function () {
                   }
 
                   return true;
-      }
+                };
 
-      function showForeignEditor() {
+                toggleSourceButtons = function toggleSourceButtons(on) {
-        var elt = selElems[0];
+                  $('#tool_source_save, #tool_source_cancel').toggle(!on);
-        if (!elt || editingforeign) {
+                  $('#foreign_save, #foreign_cancel').toggle(on);
-          return;
+                };
-        }
-        editingforeign = true;
-        toggleSourceButtons(true);
-        elt.removeAttribute('fill');
 
-        var str = S.svgToString(elt, 0);
+                showPanel = function showPanel(on) {
-        $('#svg_source_textarea').val(str);
+                  var fcRules = $('#fc_rules');
-        $('#svg_source_editor').fadeIn();
+                  if (!fcRules.length) {
-        properlySourceSizeTextArea();
+                    fcRules = $('<style id="fc_rules"></style>').appendTo('head');
-        $('#svg_source_textarea').focus();
                   }
+                  fcRules.text(!on ? '' : ' #tool_topath { display: none !important; }');
+                  $('#foreignObject_panel').toggle(on);
+                };
 
-      function setAttr(attr, val) {
+                svgEditor = this;
-        svgCanvas.changeSelectedAttribute(attr, val);
+                text2xml = S.text2xml, NS = S.NS, importLocale = S.importLocale;
-        S.call('changed', selElems);
+                $ = jQuery;
-      }
+                svgCanvas = svgEditor.canvas;
+                svgdoc = S.svgroot.parentNode.ownerDocument;
+                _context.next = 12;
+                return importLocale();
 
-      return {
+              case 12:
-        name: 'foreignObject',
+                strings = _context.sent;
-        svgicons: svgEditor.curConfig.extIconsPath + 'foreignobject-icons.xml',
+
-        buttons: [{
+                properlySourceSizeTextArea = function properlySourceSizeTextArea() {
+                  // TODO: remove magic numbers here and get values from CSS
+                  var height = $('#svg_source_container').height() - 80;
+                  $('#svg_source_textarea').css('height', height);
+                };
+
+                selElems = void 0, started = void 0, newFO = void 0, editingforeign = false;
+
+                /**
+                * This function sets the content of element elt to the input XML.
+                * @param {string} xmlString - The XML text
+                * @param {Element} elt - the parent element to append to
+                * @returns {boolean} This function returns false if the set was unsuccessful, true otherwise.
+                */
+
+                buttons = [{
                   id: 'tool_foreign',
                   type: 'mode',
-          title: 'Foreign Object Tool',
                   events: {
                     click: function click() {
                       svgCanvas.setMode('foreign');
@@ -112,20 +140,16 @@ var svgEditorExtension_foreignobject = (function () {
                   id: 'edit_foreign',
                   type: 'context',
                   panel: 'foreignObject_panel',
-          title: 'Edit ForeignObject Content',
                   events: {
                     click: function click() {
                       showForeignEditor();
                     }
                   }
-        }],
+                }];
-
+                contextTools = [{
-        context_tools: [{
                   type: 'input',
                   panel: 'foreignObject_panel',
-          title: "Change foreignObject's width",
                   id: 'foreign_width',
-          label: 'w',
                   size: 3,
                   events: {
                     change: function change() {
@@ -135,9 +159,7 @@ var svgEditorExtension_foreignobject = (function () {
                 }, {
                   type: 'input',
                   panel: 'foreignObject_panel',
-          title: "Change foreignObject's height",
                   id: 'foreign_height',
-          label: 'h',
                   events: {
                     change: function change() {
                       setAttr('height', this.value);
@@ -146,9 +168,7 @@ var svgEditorExtension_foreignobject = (function () {
                 }, {
                   type: 'input',
                   panel: 'foreignObject_panel',
-          title: "Change foreignObject's font size",
                   id: 'foreign_font_size',
-          label: 'font-size',
                   size: 2,
                   defval: 16,
                   events: {
@@ -156,7 +176,16 @@ var svgEditorExtension_foreignobject = (function () {
                       setAttr('font-size', this.value);
                     }
                   }
-        }],
+                }];
+                return _context.abrupt('return', {
+                  name: strings.name,
+                  svgicons: svgEditor.curConfig.extIconsPath + 'foreignobject-icons.xml',
+                  buttons: strings.buttons.map(function (button, i) {
+                    return Object.assign(buttons[i], button);
+                  }),
+                  context_tools: strings.contextTools.map(function (contextTool, i) {
+                    return Object.assign(contextTools[i], contextTool);
+                  }),
                   callback: function callback() {
                     $('#foreignObject_panel').hide();
 
@@ -198,7 +227,7 @@ var svgEditorExtension_foreignobject = (function () {
 
                     if (svgCanvas.getMode() === 'foreign') {
                       started = true;
-            newFO = S.addSvgElementFromJson({
+                      newFO = S.addSVGElementFromJson({
                         element: 'foreignObject',
                         attr: {
                           x: opts.start_x,
@@ -264,8 +293,22 @@ var svgEditorExtension_foreignobject = (function () {
                   elementChanged: function elementChanged(opts) {
                     // const elem = opts.elems[0];
                   }
-      };
+                });
+
+              case 18:
+              case 'end':
+                return _context.stop();
             }
+          }
+        }, _callee, this);
+      }));
+
+      function init(_x) {
+        return _ref.apply(this, arguments);
+      }
+
+      return init;
+    }()
   };
 
   return extForeignobject;

dist/extensions/ext-grid.js

@@ -1,85 +1,66 @@
 var svgEditorExtension_grid = (function () {
   'use strict';
 
+  var asyncToGenerator = function (fn) {
+    return function () {
+      var gen = fn.apply(this, arguments);
+      return new Promise(function (resolve, reject) {
+        function step(key, arg) {
+          try {
+            var info = gen[key](arg);
+            var value = info.value;
+          } catch (error) {
+            reject(error);
+            return;
+          }
+
+          if (info.done) {
+            resolve(value);
+          } else {
+            return Promise.resolve(value).then(function (value) {
+              step("next", value);
+            }, function (err) {
+              step("throw", err);
+            });
+          }
+        }
+
+        return step("next");
+      });
+    };
+  };
+
   /* globals jQuery */
-  /*
+  /**
    * ext-grid.js
    *
-   * Licensed under the Apache License, Version 2
+   * @license Apache-2.0
    *
-   * Copyright(c) 2010 Redou Mine
+   * @copyright 2010 Redou Mine, 2010 Alexis Deveria
-   * Copyright(c) 2010 Alexis Deveria
    *
    */
 
   var extGrid = {
-    name: 'view_grid',
+    name: 'grid',
-    init: function init(_ref) {
+    init: function () {
+      var _ref2 = asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee(_ref) {
         var NS = _ref.NS,
-          getTypeMap = _ref.getTypeMap;
+            getTypeMap = _ref.getTypeMap,
+            importLocale = _ref.importLocale;
+        var strings, svgEditor, $, svgCanvas, svgdoc, assignAttributes, hcanvas, canvBG, units, intervals, showGrid, canvasGrid, gridPattern, gridimg, gridBox, updateGrid, gridUpdate, buttons;
+        return regeneratorRuntime.wrap(function _callee$(_context) {
+          while (1) {
+            switch (_context.prev = _context.next) {
+              case 0:
+                gridUpdate = function gridUpdate() {
+                  if (showGrid) {
+                    updateGrid(svgCanvas.getZoom());
+                  }
+                  $('#canvasGrid').toggle(showGrid);
+                  $('#view_grid').toggleClass('push_button_pressed tool_button');
+                };
 
-      var svgEditor = this;
+                updateGrid = function updateGrid(zoom) {
-      var $ = jQuery;
-      var svgCanvas = svgEditor.canvas;
-      var svgdoc = document.getElementById('svgcanvas').ownerDocument,
-          assignAttributes = svgCanvas.assignAttributes,
-          hcanvas = document.createElement('canvas'),
-          canvBG = $('#canvasBackground'),
-          units = getTypeMap(),
-          intervals = [0.01, 0.1, 1, 10, 100, 1000];
-
-      var showGrid = svgEditor.curConfig.showGrid || false;
-
-      $(hcanvas).hide().appendTo('body');
-
-      var canvasGrid = svgdoc.createElementNS(NS.SVG, 'svg');
-      assignAttributes(canvasGrid, {
-        id: 'canvasGrid',
-        width: '100%',
-        height: '100%',
-        x: 0,
-        y: 0,
-        overflow: 'visible',
-        display: 'none'
-      });
-      canvBG.append(canvasGrid);
-
-      // grid-pattern
-      var gridPattern = svgdoc.createElementNS(NS.SVG, 'pattern');
-      assignAttributes(gridPattern, {
-        id: 'gridpattern',
-        patternUnits: 'userSpaceOnUse',
-        x: 0, // -(value.strokeWidth / 2), // position for strokewidth
-        y: 0, // -(value.strokeWidth / 2), // position for strokewidth
-        width: 100,
-        height: 100
-      });
-
-      var gridimg = svgdoc.createElementNS(NS.SVG, 'image');
-      assignAttributes(gridimg, {
-        x: 0,
-        y: 0,
-        width: 100,
-        height: 100
-      });
-      gridPattern.append(gridimg);
-      $('#svgroot defs').append(gridPattern);
-
-      // grid-box
-      var gridBox = svgdoc.createElementNS(NS.SVG, 'rect');
-      assignAttributes(gridBox, {
-        width: '100%',
-        height: '100%',
-        x: 0,
-        y: 0,
-        'stroke-width': 0,
-        stroke: 'none',
-        fill: 'url(#gridpattern)',
-        style: 'pointer-events: none; display:visible;'
-      });
-      $('#canvasGrid').append(gridBox);
-
-      function updateGrid(zoom) {
                   // TODO: Try this with <line> elements, then compare performance difference
                   var unit = units[svgEditor.curConfig.baseUnit]; // 1 = 1px
                   var uMulti = unit * zoom;
@@ -129,17 +110,86 @@ var svgEditorExtension_grid = (function () {
                   gridimg.parentNode.setAttribute('width', bigInt);
                   gridimg.parentNode.setAttribute('height', bigInt);
                   svgCanvas.setHref(gridimg, datauri);
-      }
+                };
 
-      function gridUpdate() {
+                _context.next = 4;
-        if (showGrid) {
+                return importLocale();
-          updateGrid(svgCanvas.getZoom());
+
+              case 4:
+                strings = _context.sent;
+                svgEditor = this;
+                $ = jQuery;
+                svgCanvas = svgEditor.canvas;
+                svgdoc = document.getElementById('svgcanvas').ownerDocument, assignAttributes = svgCanvas.assignAttributes, hcanvas = document.createElement('canvas'), canvBG = $('#canvasBackground'), units = getTypeMap(), intervals = [0.01, 0.1, 1, 10, 100, 1000];
+                showGrid = svgEditor.curConfig.showGrid || false;
+
+
+                $(hcanvas).hide().appendTo('body');
+
+                canvasGrid = svgdoc.createElementNS(NS.SVG, 'svg');
+
+                assignAttributes(canvasGrid, {
+                  id: 'canvasGrid',
+                  width: '100%',
+                  height: '100%',
+                  x: 0,
+                  y: 0,
+                  overflow: 'visible',
+                  display: 'none'
+                });
+                canvBG.append(canvasGrid);
+
+                // grid-pattern
+                gridPattern = svgdoc.createElementNS(NS.SVG, 'pattern');
+
+                assignAttributes(gridPattern, {
+                  id: 'gridpattern',
+                  patternUnits: 'userSpaceOnUse',
+                  x: 0, // -(value.strokeWidth / 2), // position for strokewidth
+                  y: 0, // -(value.strokeWidth / 2), // position for strokewidth
+                  width: 100,
+                  height: 100
+                });
+
+                gridimg = svgdoc.createElementNS(NS.SVG, 'image');
+
+                assignAttributes(gridimg, {
+                  x: 0,
+                  y: 0,
+                  width: 100,
+                  height: 100
+                });
+                gridPattern.append(gridimg);
+                $('#svgroot defs').append(gridPattern);
+
+                // grid-box
+                gridBox = svgdoc.createElementNS(NS.SVG, 'rect');
+
+                assignAttributes(gridBox, {
+                  width: '100%',
+                  height: '100%',
+                  x: 0,
+                  y: 0,
+                  'stroke-width': 0,
+                  stroke: 'none',
+                  fill: 'url(#gridpattern)',
+                  style: 'pointer-events: none; display:visible;'
+                });
+                $('#canvasGrid').append(gridBox);
+
+                buttons = [{
+                  id: 'view_grid',
+                  type: 'context',
+                  panel: 'editor_panel',
+                  events: {
+                    click: function click() {
+                      svgEditor.curConfig.showGrid = showGrid = !showGrid;
+                      gridUpdate();
                     }
-        $('#canvasGrid').toggle(showGrid);
-        $('#view_grid').toggleClass('push_button_pressed tool_button');
                   }
-      return {
+                }];
-        name: 'view_grid',
+                return _context.abrupt('return', {
+                  name: strings.name,
                   svgicons: svgEditor.curConfig.extIconsPath + 'grid-icon.xml',
 
                   zoomChanged: function zoomChanged(zoom) {
@@ -153,20 +203,25 @@ var svgEditorExtension_grid = (function () {
                     }
                   },
 
-        buttons: [{
+                  buttons: strings.buttons.map(function (button, i) {
-          id: 'view_grid',
+                    return Object.assign(buttons[i], button);
-          type: 'context',
+                  })
-          panel: 'editor_panel',
+                });
-          title: 'Show/Hide Grid',
+
-          events: {
+              case 25:
-            click: function click() {
+              case 'end':
-              svgEditor.curConfig.showGrid = showGrid = !showGrid;
+                return _context.stop();
-              gridUpdate();
             }
           }
-        }]
+        }, _callee, this);
-      };
+      }));
+
+      function init(_x) {
+        return _ref2.apply(this, arguments);
       }
+
+      return init;
+    }()
   };
 
   return extGrid;

dist/extensions/ext-helloworld.js

@@ -1,30 +1,108 @@
 var svgEditorExtension_helloworld = (function () {
   'use strict';
 
+  var asyncToGenerator = function (fn) {
+    return function () {
+      var gen = fn.apply(this, arguments);
+      return new Promise(function (resolve, reject) {
+        function step(key, arg) {
+          try {
+            var info = gen[key](arg);
+            var value = info.value;
+          } catch (error) {
+            reject(error);
+            return;
+          }
+
+          if (info.done) {
+            resolve(value);
+          } else {
+            return Promise.resolve(value).then(function (value) {
+              step("next", value);
+            }, function (err) {
+              step("throw", err);
+            });
+          }
+        }
+
+        return step("next");
+      });
+    };
+  };
+
+  var slicedToArray = function () {
+    function sliceIterator(arr, i) {
+      var _arr = [];
+      var _n = true;
+      var _d = false;
+      var _e = undefined;
+
+      try {
+        for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) {
+          _arr.push(_s.value);
+
+          if (i && _arr.length === i) break;
+        }
+      } catch (err) {
+        _d = true;
+        _e = err;
+      } finally {
+        try {
+          if (!_n && _i["return"]) _i["return"]();
+        } finally {
+          if (_d) throw _e;
+        }
+      }
+
+      return _arr;
+    }
+
+    return function (arr, i) {
+      if (Array.isArray(arr)) {
+        return arr;
+      } else if (Symbol.iterator in Object(arr)) {
+        return sliceIterator(arr, i);
+      } else {
+        throw new TypeError("Invalid attempt to destructure non-iterable instance");
+      }
+    };
+  }();
+
   /* globals jQuery */
-  /*
+  /**
    * ext-helloworld.js
    *
-   * Licensed under the MIT License
+   * @license MIT
    *
-   * Copyright(c) 2010 Alexis Deveria
+   * @copyright 2010 Alexis Deveria
    *
    */
 
-  /*
+  /**
-    This is a very basic SVG-Edit extension. It adds a "Hello World" button in
+  * This is a very basic SVG-Edit extension. It adds a "Hello World" button in
-    the left panel. Clicking on the button, and then the canvas will show the
+  *  the left ("mode") panel. Clicking on the button, and then the canvas
-    user the point on the canvas that was clicked on.
+  *  will show the user the point on the canvas that was clicked on.
   */
-
   var extHelloworld = {
-    name: 'Hello World',
+    name: 'helloworld',
-    init: function init() {
+    init: function () {
-      var svgEditor = this;
+      var _ref2 = asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee(_ref) {
-      var $ = jQuery;
+        var importLocale = _ref.importLocale;
-      var svgCanvas = svgEditor.canvas;
+        var strings, svgEditor, $, svgCanvas;
-      return {
+        return regeneratorRuntime.wrap(function _callee$(_context) {
-        name: 'Hello World',
+          while (1) {
+            switch (_context.prev = _context.next) {
+              case 0:
+                _context.next = 2;
+                return importLocale();
+
+              case 2:
+                strings = _context.sent;
+                svgEditor = this;
+                $ = jQuery;
+                svgCanvas = svgEditor.canvas;
+                return _context.abrupt('return', {
+                  name: strings.name,
                   // For more notes on how to make an icon file, see the source of
                   // the helloworld-icon.xml
                   svgicons: svgEditor.curConfig.extIconsPath + 'helloworld-icon.xml',
@@ -39,7 +117,7 @@ var svgEditorExtension_helloworld = (function () {
                     type: 'mode',
 
                     // Tooltip text
-          title: "Say 'Hello World'",
+                    title: strings.buttons[0].title,
 
                     // Events
                     events: {
@@ -74,14 +152,37 @@ var svgEditorExtension_helloworld = (function () {
                       var x = opts.mouse_x / zoom;
                       var y = opts.mouse_y / zoom;
 
-            var text = 'Hello World!\n\nYou clicked here: ' + x + ', ' + y;
+                      // We do our own formatting
+                      var text = strings.text;
+
+                      [['x', x], ['y', y]].forEach(function (_ref3) {
+                        var _ref4 = slicedToArray(_ref3, 2),
+                            prop = _ref4[0],
+                            val = _ref4[1];
+
+                        text = text.replace('{' + prop + '}', val);
+                      });
 
                       // Show the text using the custom alert function
                       $.alert(text);
                     }
                   }
-      };
+                });
+
+              case 7:
+              case 'end':
+                return _context.stop();
             }
+          }
+        }, _callee, this);
+      }));
+
+      function init(_x) {
+        return _ref2.apply(this, arguments);
+      }
+
+      return init;
+    }()
   };
 
   return extHelloworld;

dist/extensions/ext-imagelib.js

@@ -30,193 +30,143 @@ var svgEditorExtension_imagelib = (function () {
     };
   };
 
-  var _extends = Object.assign || function (target) {
+  /* globals jQuery */
-    for (var i = 1; i < arguments.length; i++) {
+  /**
-      var source = arguments[i];
+   * ext-imagelib.js
-
+   *
-      for (var key in source) {
+   * @license MIT
-        if (Object.prototype.hasOwnProperty.call(source, key)) {
+   *
-          target[key] = source[key];
+   * @copyright 2010 Alexis Deveria
-        }
+   *
-      }
+   */
-    }
+  var extImagelib = {
-
+    name: 'imagelib',
-    return target;
+    init: function () {
-  };
+      var _ref2 = asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee(_ref) {
-
+        var decode64 = _ref.decode64,
-  // MIT License
+            importLocale = _ref.importLocale;
-  // From: https://github.com/uupaa/dynamic-import-polyfill/blob/master/importModule.js
+        var imagelibStrings, svgEditor, $, uiStrings, svgCanvas, closeBrowser, importImage, pending, mode, multiArr, transferStopped, preview, submit, toggleMulti, showBrowser, buttons;
-
-  function toAbsoluteURL(url) {
-    var a = document.createElement('a');
-    a.setAttribute('href', url); // <a href="hoge.html">
-    return a.cloneNode(false).href; // -> "http://example.com/hoge.html"
-  }
-
-  function addScriptAtts(script, atts) {
-    ['id', 'class', 'type'].forEach(function (prop) {
-      if (prop in atts) {
-        script[prop] = atts[prop];
-      }
-    });
-  }
-
-  // Additions by Brett
-  var importSetGlobalDefault = function () {
-    var _ref = asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee(url, config) {
         return regeneratorRuntime.wrap(function _callee$(_context) {
           while (1) {
             switch (_context.prev = _context.next) {
               case 0:
-              return _context.abrupt('return', importSetGlobal(url, _extends({}, config, { returnDefault: true })));
+                showBrowser = function showBrowser() {
+                  var browser = $('#imgbrowse');
+                  if (!browser.length) {
+                    $('<div id=imgbrowse_holder><div id=imgbrowse class=toolbar_button>' + '</div></div>').insertAfter('#svg_docprops');
+                    browser = $('#imgbrowse');
 
-            case 1:
+                    var allLibs = imagelibStrings.select_lib;
-            case 'end':
-              return _context.stop();
-          }
-        }
-      }, _callee, this);
-    }));
 
-    return function importSetGlobalDefault(_x, _x2) {
+                    var libOpts = $('<ul id=imglib_opts>').appendTo(browser);
-      return _ref.apply(this, arguments);
+                    var frame = $('<iframe/>').prependTo(browser).hide().wrap('<div id=lib_framewrap>');
-    };
-  }();
-  var importSetGlobal = function () {
-    var _ref3 = asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee2(url, _ref2) {
-      var global = _ref2.global,
-          returnDefault = _ref2.returnDefault;
-      var modularVersion;
-      return regeneratorRuntime.wrap(function _callee2$(_context2) {
-        while (1) {
-          switch (_context2.prev = _context2.next) {
-            case 0:
-              // Todo: Replace calls to this function with `import()` when supported
-              modularVersion = !('svgEditor' in window) || !window.svgEditor || window.svgEditor.modules !== false;
 
-              if (!modularVersion) {
+                    var header = $('<h1>').prependTo(browser).text(allLibs).css({
-                _context2.next = 3;
+                      position: 'absolute',
+                      top: 0,
+                      left: 0,
+                      width: '100%'
+                    });
+
+                    var cancel = $('<button>' + uiStrings.common.cancel + '</button>').appendTo(browser).on('click touchend', function () {
+                      $('#imgbrowse_holder').hide();
+                    }).css({
+                      position: 'absolute',
+                      top: 5,
+                      right: -10
+                    });
+
+                    var leftBlock = $('<span>').css({ position: 'absolute', top: 5, left: 10 }).appendTo(browser);
+
+                    var back = $('<button hidden>' + imagelibStrings.show_list + '</button>').appendTo(leftBlock).on('click touchend', function () {
+                      frame.attr('src', 'about:blank').hide();
+                      libOpts.show();
+                      header.text(allLibs);
+                      back.hide();
+                    }).css({
+                      'margin-right': 5
+                    }).hide();
+
+                    /* const type = */$('<select><option value=s>' + imagelibStrings.import_single + '</option><option value=m>' + imagelibStrings.import_multi + '</option><option value=o>' + imagelibStrings.open + '</option></select>').appendTo(leftBlock).change(function () {
+                      mode = $(this).val();
+                      switch (mode) {
+                        case 's':
+                        case 'o':
+                          toggleMulti(false);
+                          break;
+
+                        case 'm':
+                          // Import multiple
+                          toggleMulti(true);
                           break;
                       }
-
+                    }).css({
-              return _context2.abrupt('return', importModule(url, undefined, { returnDefault: returnDefault }));
+                      'margin-top': 10
-
-            case 3:
-              _context2.next = 5;
-              return importScript(url);
-
-            case 5:
-              return _context2.abrupt('return', window[global]);
-
-            case 6:
-            case 'end':
-              return _context2.stop();
-          }
-        }
-      }, _callee2, this);
-    }));
-
-    return function importSetGlobal(_x3, _x4) {
-      return _ref3.apply(this, arguments);
-    };
-  }();
-  // Addition by Brett
-  function importScript(url) {
-    var atts = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
-
-    if (Array.isArray(url)) {
-      return Promise.all(url.map(function (u) {
-        return importScript(u, atts);
-      }));
-    }
-    return new Promise(function (resolve, reject) {
-      var script = document.createElement('script');
-      var destructor = function destructor() {
-        script.onerror = null;
-        script.onload = null;
-        script.remove();
-        script.src = '';
-      };
-      script.defer = 'defer';
-      addScriptAtts(script, atts);
-      script.onerror = function () {
-        reject(new Error('Failed to import: ' + url));
-        destructor();
-      };
-      script.onload = function () {
-        resolve();
-        destructor();
-      };
-      script.src = url;
-
-      document.head.append(script);
                     });
-  }
 
-  function importModule(url) {
+                    cancel.prepend($.getSvgIcon('cancel', true));
-    var atts = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
+                    back.prepend($.getSvgIcon('tool_imagelib', true));
 
-    var _ref4 = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {},
+                    var modularVersion = !('svgEditor' in window) || !window.svgEditor || window.svgEditor.modules !== false;
-        _ref4$returnDefault = _ref4.returnDefault,
+                    $.each(imagelibStrings.imgLibs, function (i, _ref3) {
-        returnDefault = _ref4$returnDefault === undefined ? false : _ref4$returnDefault;
+                      var name = _ref3.name,
+                          url = _ref3.url,
+                          description = _ref3.description;
 
-    if (Array.isArray(url)) {
+                      $('<li>').appendTo(libOpts).text(name).on('click touchend', function () {
-      return Promise.all(url.map(function (u) {
+                        frame.attr('src',
-        return importModule(u, atts);
+                        // Todo: Adopt some standard formatting library like `fluent.js` instead
-      }));
+                        url.replace('{path}', svgEditor.curConfig.extIconsPath).replace('{modularVersion}', modularVersion ? imagelibStrings.moduleEnding || '-es' : '')).show();
-    }
+                        header.text(name);
-    return new Promise(function (resolve, reject) {
+                        libOpts.hide();
-      var vector = '$importModule$' + Math.random().toString(32).slice(2);
+                        back.show();
-      var script = document.createElement('script');
+                      }).append('<span>' + description + '</span>');
-      var destructor = function destructor() {
-        delete window[vector];
-        script.onerror = null;
-        script.onload = null;
-        script.remove();
-        URL.revokeObjectURL(script.src);
-        script.src = '';
-      };
-      addScriptAtts(script, atts);
-      script.defer = 'defer';
-      script.type = 'module';
-      script.onerror = function () {
-        reject(new Error('Failed to import: ' + url));
-        destructor();
-      };
-      script.onload = function () {
-        resolve(window[vector]);
-        destructor();
-      };
-      var absURL = toAbsoluteURL(url);
-      var loader = 'import * as m from \'' + absURL.replace(/'/g, "\\'") + '\'; window.' + vector + ' = ' + (returnDefault ? 'm.default || ' : '') + 'm;'; // export Module
-      var blob = new Blob([loader], { type: 'text/javascript' });
-      script.src = URL.createObjectURL(blob);
-
-      document.head.append(script);
                     });
+                  } else {
+                    $('#imgbrowse_holder').show();
                   }
+                };
 
-  /* globals jQuery */
+                toggleMulti = function toggleMulti(show) {
+                  $('#lib_framewrap, #imglib_opts').css({ right: show ? 200 : 10 });
+                  if (!preview) {
+                    preview = $('<div id=imglib_preview>').css({
+                      position: 'absolute',
+                      top: 45,
+                      right: 10,
+                      width: 180,
+                      bottom: 45,
+                      background: '#fff',
+                      overflow: 'auto'
+                    }).insertAfter('#lib_framewrap');
 
-  var extImagelib = {
+                    submit = $('<button disabled>Import selected</button>').appendTo('#imgbrowse').on('click touchend', function () {
-    name: 'imagelib',
+                      $.each(multiArr, function (i) {
-    init: function init(_ref) {
+                        var type = this[0];
-      var decode64 = _ref.decode64;
+                        var data = this[1];
-
+                        if (type === 'svg') {
-      var svgEditor = this;
+                          svgCanvas.importSvgString(data);
-      var imagelibStrings = void 0;
+                        } else {
-
+                          importImage(data);
-      var $ = jQuery;
+                        }
-      var uiStrings = svgEditor.uiStrings,
+                        svgCanvas.moveSelectedElements(i * 20, i * 20, false);
-          svgCanvas = svgEditor.canvas;
+                      });
-
+                      preview.empty();
-
+                      multiArr = [];
-      function closeBrowser() {
                       $('#imgbrowse_holder').hide();
+                    }).css({
+                      position: 'absolute',
+                      bottom: 10,
+                      right: -10
+                    });
                   }
 
-      function importImage(url) {
+                  preview.toggle(show);
-        var newImage = svgCanvas.addSvgElementFromJson({
+                  submit.toggle(show);
+                };
+
+                importImage = function importImage(url) {
+                  var newImage = svgCanvas.addSVGElementFromJson({
                     element: 'image',
                     attr: {
                       x: 0,
@@ -230,15 +180,26 @@ var svgEditorExtension_imagelib = (function () {
                   svgCanvas.clearSelection();
                   svgCanvas.addToSelection([newImage]);
                   svgCanvas.setImageURL(url);
-      }
+                };
 
-      var pending = {};
+                closeBrowser = function closeBrowser() {
+                  $('#imgbrowse_holder').hide();
+                };
+
+                _context.next = 6;
+                return importLocale();
+
+              case 6:
+                imagelibStrings = _context.sent;
+                svgEditor = this;
+                $ = jQuery;
+                uiStrings = svgEditor.uiStrings, svgCanvas = svgEditor.canvas;
+                pending = {};
+                mode = 's';
+                multiArr = [];
+                transferStopped = false;
+                preview = void 0, submit = void 0;
 
-      var mode = 's';
-      var multiArr = [];
-      var transferStopped = false;
-      var preview = void 0,
-          submit = void 0;
 
                 window.addEventListener('message', function (evt) {
                   // Receive `postMessage` data
@@ -428,152 +389,25 @@ var svgEditorExtension_imagelib = (function () {
                   }
                 }, true);
 
-      function toggleMulti(show) {
+                buttons = [{
-        $('#lib_framewrap, #imglib_opts').css({ right: show ? 200 : 10 });
-        if (!preview) {
-          preview = $('<div id=imglib_preview>').css({
-            position: 'absolute',
-            top: 45,
-            right: 10,
-            width: 180,
-            bottom: 45,
-            background: '#fff',
-            overflow: 'auto'
-          }).insertAfter('#lib_framewrap');
-
-          submit = $('<button disabled>Import selected</button>').appendTo('#imgbrowse').on('click touchend', function () {
-            $.each(multiArr, function (i) {
-              var type = this[0];
-              var data = this[1];
-              if (type === 'svg') {
-                svgCanvas.importSvgString(data);
-              } else {
-                importImage(data);
-              }
-              svgCanvas.moveSelectedElements(i * 20, i * 20, false);
-            });
-            preview.empty();
-            multiArr = [];
-            $('#imgbrowse_holder').hide();
-          }).css({
-            position: 'absolute',
-            bottom: 10,
-            right: -10
-          });
-        }
-
-        preview.toggle(show);
-        submit.toggle(show);
-      }
-
-      function showBrowser() {
-        var browser = $('#imgbrowse');
-        if (!browser.length) {
-          $('<div id=imgbrowse_holder><div id=imgbrowse class=toolbar_button>' + '</div></div>').insertAfter('#svg_docprops');
-          browser = $('#imgbrowse');
-
-          var allLibs = imagelibStrings.select_lib;
-
-          var libOpts = $('<ul id=imglib_opts>').appendTo(browser);
-          var frame = $('<iframe/>').prependTo(browser).hide().wrap('<div id=lib_framewrap>');
-
-          var header = $('<h1>').prependTo(browser).text(allLibs).css({
-            position: 'absolute',
-            top: 0,
-            left: 0,
-            width: '100%'
-          });
-
-          var cancel = $('<button>' + uiStrings.common.cancel + '</button>').appendTo(browser).on('click touchend', function () {
-            $('#imgbrowse_holder').hide();
-          }).css({
-            position: 'absolute',
-            top: 5,
-            right: -10
-          });
-
-          var leftBlock = $('<span>').css({ position: 'absolute', top: 5, left: 10 }).appendTo(browser);
-
-          var back = $('<button hidden>' + imagelibStrings.show_list + '</button>').appendTo(leftBlock).on('click touchend', function () {
-            frame.attr('src', 'about:blank').hide();
-            libOpts.show();
-            header.text(allLibs);
-            back.hide();
-          }).css({
-            'margin-right': 5
-          }).hide();
-
-          /* const type = */$('<select><option value=s>' + imagelibStrings.import_single + '</option><option value=m>' + imagelibStrings.import_multi + '</option><option value=o>' + imagelibStrings.open + '</option></select>').appendTo(leftBlock).change(function () {
-            mode = $(this).val();
-            switch (mode) {
-              case 's':
-              case 'o':
-                toggleMulti(false);
-                break;
-
-              case 'm':
-                // Import multiple
-                toggleMulti(true);
-                break;
-            }
-          }).css({
-            'margin-top': 10
-          });
-
-          cancel.prepend($.getSvgIcon('cancel', true));
-          back.prepend($.getSvgIcon('tool_imagelib', true));
-
-          var modularVersion = !('svgEditor' in window) || !window.svgEditor || window.svgEditor.modules !== false;
-          $.each(imagelibStrings.imgLibs, function (i, _ref2) {
-            var name = _ref2.name,
-                url = _ref2.url,
-                description = _ref2.description;
-
-            $('<li>').appendTo(libOpts).text(name).on('click touchend', function () {
-              frame.attr('src', url({
-                path: svgEditor.curConfig.extIconsPath,
-                modularVersion: modularVersion
-              })).show();
-              header.text(name);
-              libOpts.hide();
-              back.show();
-            }).append('<span>' + description + '</span>');
-          });
-        } else {
-          $('#imgbrowse_holder').show();
-        }
-      }
-
-      return {
-        svgicons: svgEditor.curConfig.extIconsPath + 'ext-imagelib.xml',
-        buttons: [{
                   id: 'tool_imagelib',
                   type: 'app_menu', // _flyout
                   position: 4,
-          title: 'Image library',
                   events: {
                     mouseup: showBrowser
                   }
-        }],
+                }];
-        langReady: function () {
+                return _context.abrupt('return', {
-          var _ref4 = asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee2(_ref3) {
+                  svgicons: svgEditor.curConfig.extIconsPath + 'ext-imagelib.xml',
-            var tryImport = function () {
+                  buttons: imagelibStrings.buttons.map(function (button, i) {
-              var _ref5 = asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee(lang) {
+                    return Object.assign(buttons[i], button);
-                var url;
+                  }),
-                return regeneratorRuntime.wrap(function _callee$(_context) {
+                  callback: function callback() {
-                  while (1) {
+                    $('<style>').text('#imgbrowse_holder {' + 'position: absolute;' + 'top: 0;' + 'left: 0;' + 'width: 100%;' + 'height: 100%;' + 'background-color: rgba(0, 0, 0, .5);' + 'z-index: 5;' + '}' + '#imgbrowse {' + 'position: absolute;' + 'top: 25px;' + 'left: 25px;' + 'right: 25px;' + 'bottom: 25px;' + 'min-width: 300px;' + 'min-height: 200px;' + 'background: #B0B0B0;' + 'border: 1px outset #777;' + '}' + '#imgbrowse h1 {' + 'font-size: 20px;' + 'margin: .4em;' + 'text-align: center;' + '}' + '#lib_framewrap,' + '#imgbrowse > ul {' + 'position: absolute;' + 'top: 45px;' + 'left: 10px;' + 'right: 10px;' + 'bottom: 10px;' + 'background: white;' + 'margin: 0;' + 'padding: 0;' + '}' + '#imgbrowse > ul {' + 'overflow: auto;' + '}' + '#imgbrowse > div {' + 'border: 1px solid #666;' + '}' + '#imglib_preview > div {' + 'padding: 5px;' + 'font-size: 12px;' + '}' + '#imglib_preview img {' + 'display: block;' + 'margin: 0 auto;' + 'max-height: 100px;' + '}' + '#imgbrowse li {' + 'list-style: none;' + 'padding: .5em;' + 'background: #E8E8E8;' + 'border-bottom: 1px solid #B0B0B0;' + 'line-height: 1.2em;' + 'font-style: sans-serif;' + '}' + '#imgbrowse li > span {' + 'color: #666;' + 'font-size: 15px;' + 'display: block;' + '}' + '#imgbrowse li:hover {' + 'background: #FFC;' + 'cursor: pointer;' + '}' + '#imgbrowse iframe {' + 'width: 100%;' + 'height: 100%;' + 'border: 0;' + '}').appendTo('head');
-                    switch (_context.prev = _context.next) {
+                  }
-                      case 0:
-                        url = svgEditor.curConfig.extPath + 'ext-locale/imagelib/' + lang + '.js';
-                        _context.next = 3;
-                        return importSetGlobalDefault(url, {
-                          global: 'svgEditorExtensionLocale_imagelib_' + lang
                 });
 
-                      case 3:
+              case 18:
-                        imagelibStrings = _context.sent;
-
-                      case 4:
               case 'end':
                 return _context.stop();
             }
@@ -581,49 +415,12 @@ var svgEditorExtension_imagelib = (function () {
         }, _callee, this);
       }));
 
-              return function tryImport(_x2) {
+      function init(_x) {
-                return _ref5.apply(this, arguments);
+        return _ref2.apply(this, arguments);
-              };
-            }();
-
-            var lang = _ref3.lang;
-            return regeneratorRuntime.wrap(function _callee2$(_context2) {
-              while (1) {
-                switch (_context2.prev = _context2.next) {
-                  case 0:
-                    _context2.prev = 0;
-                    _context2.next = 3;
-                    return tryImport(lang);
-
-                  case 3:
-                    _context2.next = 9;
-                    break;
-
-                  case 5:
-                    _context2.prev = 5;
-                    _context2.t0 = _context2['catch'](0);
-                    _context2.next = 9;
-                    return tryImport('en');
-
-                  case 9:
-                  case 'end':
-                    return _context2.stop();
-                }
-              }
-            }, _callee2, this, [[0, 5]]);
-          }));
-
-          function langReady(_x) {
-            return _ref4.apply(this, arguments);
       }
 
-          return langReady;
+      return init;
-        }(),
+    }()
-        callback: function callback() {
-          $('<style>').text('#imgbrowse_holder {' + 'position: absolute;' + 'top: 0;' + 'left: 0;' + 'width: 100%;' + 'height: 100%;' + 'background-color: rgba(0, 0, 0, .5);' + 'z-index: 5;' + '}' + '#imgbrowse {' + 'position: absolute;' + 'top: 25px;' + 'left: 25px;' + 'right: 25px;' + 'bottom: 25px;' + 'min-width: 300px;' + 'min-height: 200px;' + 'background: #B0B0B0;' + 'border: 1px outset #777;' + '}' + '#imgbrowse h1 {' + 'font-size: 20px;' + 'margin: .4em;' + 'text-align: center;' + '}' + '#lib_framewrap,' + '#imgbrowse > ul {' + 'position: absolute;' + 'top: 45px;' + 'left: 10px;' + 'right: 10px;' + 'bottom: 10px;' + 'background: white;' + 'margin: 0;' + 'padding: 0;' + '}' + '#imgbrowse > ul {' + 'overflow: auto;' + '}' + '#imgbrowse > div {' + 'border: 1px solid #666;' + '}' + '#imglib_preview > div {' + 'padding: 5px;' + 'font-size: 12px;' + '}' + '#imglib_preview img {' + 'display: block;' + 'margin: 0 auto;' + 'max-height: 100px;' + '}' + '#imgbrowse li {' + 'list-style: none;' + 'padding: .5em;' + 'background: #E8E8E8;' + 'border-bottom: 1px solid #B0B0B0;' + 'line-height: 1.2em;' + 'font-style: sans-serif;' + '}' + '#imgbrowse li > span {' + 'color: #666;' + 'font-size: 15px;' + 'display: block;' + '}' + '#imgbrowse li:hover {' + 'background: #FFC;' + 'cursor: pointer;' + '}' + '#imgbrowse iframe {' + 'width: 100%;' + 'height: 100%;' + 'border: 0;' + '}').appendTo('head');
-        }
-      };
-    }
   };
 
   return extImagelib;

dist/extensions/ext-locale/arrows/en.js

@@ -0,0 +1,22 @@
+var svgEditorExtensionLocale_arrows_en = (function () {
+  'use strict';
+
+  var en = {
+    name: 'Arrows',
+    langList: [{ id: 'arrow_none', textContent: 'No arrow' }],
+    contextTools: [{
+      title: 'Select arrow type',
+      options: {
+        none: 'No arrow',
+        end: '---->',
+        start: '<----',
+        both: '<--->',
+        mid: '-->--',
+        mid_bk: '--<--'
+      }
+    }]
+  };
+
+  return en;
+
+}());

dist/extensions/ext-locale/arrows/fr.js

@@ -0,0 +1,22 @@
+var svgEditorExtensionLocale_arrows_fr = (function () {
+  'use strict';
+
+  var fr = {
+    name: 'Arrows',
+    langList: [{ id: 'arrow_none', textContent: 'Sans flèche' }],
+    contextTools: [{
+      title: 'Select arrow type',
+      options: {
+        none: 'No arrow',
+        end: '---->',
+        start: '<----',
+        both: '<--->',
+        mid: '-->--',
+        mid_bk: '--<--'
+      }
+    }]
+  };
+
+  return fr;
+
+}());

dist/extensions/ext-locale/closepath/en.js

@@ -0,0 +1,15 @@
+var svgEditorExtensionLocale_closepath_en = (function () {
+  'use strict';
+
+  var en = {
+    name: 'ClosePath',
+    buttons: [{
+      title: 'Open path'
+    }, {
+      title: 'Close path'
+    }]
+  };
+
+  return en;
+
+}());

dist/extensions/ext-locale/connector/en.js

@@ -0,0 +1,14 @@
+var svgEditorExtensionLocale_connector_en = (function () {
+  'use strict';
+
+  var en = {
+    name: 'Connector',
+    langList: [{ id: 'mode_connect', title: 'Connect two objects' }],
+    buttons: [{
+      title: 'Connect two objects'
+    }]
+  };
+
+  return en;
+
+}());

dist/extensions/ext-locale/connector/fr.js

@@ -0,0 +1,14 @@
+var svgEditorExtensionLocale_connector_fr = (function () {
+  'use strict';
+
+  var fr = {
+    name: 'Connector',
+    langList: [{ id: 'mode_connect', title: 'Connecter deux objets' }],
+    buttons: [{
+      title: 'Connect two objects'
+    }]
+  };
+
+  return fr;
+
+}());

dist/extensions/ext-locale/eyedropper/en.js

@@ -0,0 +1,14 @@
+var svgEditorExtensionLocale_eyedropper_en = (function () {
+  'use strict';
+
+  var en = {
+    name: 'eyedropper',
+    buttons: [{
+      title: 'Eye Dropper Tool',
+      key: 'I'
+    }]
+  };
+
+  return en;
+
+}());

dist/extensions/ext-locale/foreignobject/en.js

@@ -0,0 +1,25 @@
+var svgEditorExtensionLocale_foreignobject_en = (function () {
+  'use strict';
+
+  var en = {
+    name: 'foreignObject',
+    buttons: [{
+      title: 'Foreign Object Tool'
+    }, {
+      title: 'Edit ForeignObject Content'
+    }],
+    contextTools: [{
+      title: "Change foreignObject's width",
+      label: 'w'
+    }, {
+      title: "Change foreignObject's height",
+      label: 'h'
+    }, {
+      title: "Change foreignObject's font size",
+      label: 'font-size'
+    }]
+  };
+
+  return en;
+
+}());

dist/extensions/ext-locale/grid/en.js

@@ -0,0 +1,13 @@
+var svgEditorExtensionLocale_grid_en = (function () {
+  'use strict';
+
+  var en = {
+    name: 'View Grid',
+    buttons: [{
+      title: 'Show/Hide Grid'
+    }]
+  };
+
+  return en;
+
+}());

dist/extensions/ext-locale/helloworld/en.js

@@ -0,0 +1,14 @@
+var svgEditorExtensionLocale_helloworld_en = (function () {
+  'use strict';
+
+  var en = {
+    name: 'Hello World',
+    text: 'Hello World!\n\nYou clicked here: {x}, {y}',
+    buttons: [{
+      title: "Say 'Hello World'"
+    }]
+  };
+
+  return en;
+
+}());

dist/extensions/ext-locale/imagelib/en.js

@@ -7,15 +7,12 @@ var svgEditorExtensionLocale_imagelib_en = (function () {
     import_single: 'Import single',
     import_multi: 'Import multiple',
     open: 'Open as new document',
+    buttons: [{
+      title: 'Image library'
+    }],
     imgLibs: [{
       name: 'Demo library (local)',
-      url: function url(_ref) {
+      url: '{path}imagelib/index{modularVersion}.html',
-        var path = _ref.path,
-            modularVersion = _ref.modularVersion;
-
-        return path + 'imagelib/index' + (modularVersion ? '-es' : '') + '.html';
-      },
-
       description: 'Demonstration library for SVG-edit on this server'
     }, {
       name: 'IAN Symbol Libraries',

dist/extensions/ext-locale/imagelib/fr.js

@@ -7,15 +7,12 @@ var svgEditorExtensionLocale_imagelib_fr = (function () {
     import_single: 'import_single',
     import_multi: 'import_multi',
     open: 'open',
+    buttons: [{
+      title: 'Image library'
+    }],
     imgLibs: [{
       name: 'Demo library (local)',
-      url: function url(_ref) {
+      url: '{path}imagelib/index{modularVersion}.html',
-        var path = _ref.path,
-            modularVersion = _ref.modularVersion;
-
-        return path + 'imagelib/index' + (modularVersion ? '-es' : '') + '.html';
-      },
-
       description: 'Demonstration library for SVG-edit on this server'
     }, {
       name: 'IAN Symbol Libraries',

dist/extensions/ext-locale/markers/en.js

@@ -0,0 +1,27 @@
+var svgEditorExtensionLocale_markers_en = (function () {
+  'use strict';
+
+  var en = {
+    name: 'Markers',
+    langList: [{ id: 'nomarker', title: 'No Marker' }, { id: 'leftarrow', title: 'Left Arrow' }, { id: 'rightarrow', title: 'Right Arrow' }, { id: 'textmarker', title: 'Text Marker' }, { id: 'forwardslash', title: 'Forward Slash' }, { id: 'reverseslash', title: 'Reverse Slash' }, { id: 'verticalslash', title: 'Vertical Slash' }, { id: 'box', title: 'Box' }, { id: 'star', title: 'Star' }, { id: 'xmark', title: 'X' }, { id: 'triangle', title: 'Triangle' }, { id: 'mcircle', title: 'Circle' }, { id: 'leftarrow_o', title: 'Open Left Arrow' }, { id: 'rightarrow_o', title: 'Open Right Arrow' }, { id: 'box_o', title: 'Open Box' }, { id: 'star_o', title: 'Open Star' }, { id: 'triangle_o', title: 'Open Triangle' }, { id: 'mcircle_o', title: 'Open Circle' }],
+    contextTools: [{
+      title: 'Start marker',
+      label: 's'
+    }, {
+      title: 'Select start marker type'
+    }, {
+      title: 'Middle marker',
+      label: 'm'
+    }, {
+      title: 'Select mid marker type'
+    }, {
+      title: 'End marker',
+      label: 'e'
+    }, {
+      title: 'Select end marker type'
+    }]
+  };
+
+  return en;
+
+}());

dist/extensions/ext-locale/mathjax/en.js

@@ -0,0 +1,13 @@
+var svgEditorExtensionLocale_mathjax_en = (function () {
+  'use strict';
+
+  var en = {
+    name: 'MathJax',
+    buttons: [{
+      title: 'Add Mathematics'
+    }]
+  };
+
+  return en;
+
+}());

dist/extensions/ext-locale/panning/en.js

@@ -0,0 +1,13 @@
+var svgEditorExtensionLocale_panning_en = (function () {
+  'use strict';
+
+  var en = {
+    name: 'Extension Panning',
+    buttons: [{
+      title: 'Panning'
+    }]
+  };
+
+  return en;
+
+}());

dist/extensions/ext-locale/polygon/en.js

@@ -0,0 +1,17 @@
+var svgEditorExtensionLocale_polygon_en = (function () {
+  'use strict';
+
+  var en = {
+    name: 'polygon',
+    buttons: [{
+      title: 'Polygon Tool'
+    }],
+    contextTools: [{
+      title: 'Number of Sides',
+      label: 'sides'
+    }]
+  };
+
+  return en;
+
+}());

dist/extensions/ext-locale/server_moinsave/en.js

@@ -0,0 +1,10 @@
+var svgEditorExtensionLocale_server_moinsave_en = (function () {
+  'use strict';
+
+  var en = {
+    saved: 'Saved! Return to Item View!'
+  };
+
+  return en;
+
+}());

dist/extensions/ext-locale/server_opensave/en.js

@@ -0,0 +1,10 @@
+var svgEditorExtensionLocale_server_opensave_en = (function () {
+  'use strict';
+
+  var en = {
+    uploading: 'Uploading...'
+  };
+
+  return en;
+
+}());

dist/extensions/ext-locale/shapes/en.js

@@ -0,0 +1,29 @@
+var svgEditorExtensionLocale_shapes_en = (function () {
+  'use strict';
+
+  var en = {
+    loading: 'Loading...',
+    categories: {
+      basic: 'Basic',
+      object: 'Objects',
+      symbol: 'Symbols',
+      arrow: 'Arrows',
+      flowchart: 'Flowchart',
+      animal: 'Animals',
+      game: 'Cards & Chess',
+      dialog_balloon: 'Dialog balloons',
+      electronics: 'Electronics',
+      math: 'Mathematical',
+      music: 'Music',
+      misc: 'Miscellaneous',
+      raphael_1: 'raphaeljs.com set 1',
+      raphael_2: 'raphaeljs.com set 2'
+    },
+    buttons: [{
+      title: 'Shape library'
+    }]
+  };
+
+  return en;
+
+}());

dist/extensions/ext-locale/shapes/fr.js

@@ -0,0 +1,29 @@
+var svgEditorExtensionLocale_shapes_fr = (function () {
+  'use strict';
+
+  var fr = {
+    loading: 'Loading...',
+    categories: {
+      basic: 'Basic',
+      object: 'Objects',
+      symbol: 'Symbols',
+      arrow: 'Arrows',
+      flowchart: 'Flowchart',
+      animal: 'Animals',
+      game: 'Cards & Chess',
+      dialog_balloon: 'Dialog balloons',
+      electronics: 'Electronics',
+      math: 'Mathematical',
+      music: 'Music',
+      misc: 'Miscellaneous',
+      raphael_1: 'raphaeljs.com set 1',
+      raphael_2: 'raphaeljs.com set 2'
+    },
+    buttons: [{
+      title: "Bibliothèque d'images"
+    }]
+  };
+
+  return fr;
+
+}());

dist/extensions/ext-locale/star/en.js

@@ -0,0 +1,23 @@
+var svgEditorExtensionLocale_star_en = (function () {
+  'use strict';
+
+  var en = {
+    name: 'star',
+    buttons: [{
+      title: 'Star Tool'
+    }],
+    contextTools: [{
+      title: 'Number of Sides',
+      label: 'points'
+    }, {
+      title: 'Pointiness',
+      label: 'Pointiness'
+    }, {
+      title: 'Twists the star',
+      label: 'Radial Shift'
+    }]
+  };
+
+  return en;
+
+}());

dist/extensions/ext-locale/webappfind/en.js

@@ -0,0 +1,13 @@
+var svgEditorExtensionLocale_webappfind_en = (function () {
+  'use strict';
+
+  var en = {
+    name: 'WebAppFind',
+    buttons: [{
+      title: 'Save Image back to Disk'
+    }]
+  };
+
+  return en;
+
+}());

dist/extensions/ext-markers.js

@@ -1,14 +1,42 @@
 var svgEditorExtension_markers = (function () {
   'use strict';
 
+  var asyncToGenerator = function (fn) {
+    return function () {
+      var gen = fn.apply(this, arguments);
+      return new Promise(function (resolve, reject) {
+        function step(key, arg) {
+          try {
+            var info = gen[key](arg);
+            var value = info.value;
+          } catch (error) {
+            reject(error);
+            return;
+          }
+
+          if (info.done) {
+            resolve(value);
+          } else {
+            return Promise.resolve(value).then(function (value) {
+              step("next", value);
+            }, function (err) {
+              step("throw", err);
+            });
+          }
+        }
+
+        return step("next");
+      });
+    };
+  };
+
   /* globals jQuery */
-  /*
+  /**
    * ext-markers.js
    *
-   * Licensed under the Apache License, Version 2
+   * @license Apache-2.0
    *
-   * Copyright(c) 2010 Will Schleter
+   * @copyright 2010 Will Schleter based on ext-arrows.js by Copyright(c) 2010 Alexis Deveria
-   *   based on ext-arrows.js by Copyright(c) 2010 Alexis Deveria
    *
    * This extension provides for the addition of markers to the either end
    * or the middle of a line, polyline, path, polygon.
@@ -27,119 +55,242 @@ var svgEditorExtension_markers = (function () {
    *    an application specific attribute - se_type - is added to each marker element
    *        to store the type of marker
    *
-   * TODO:
+   * @todo
    *    remove some of the restrictions above
    *    add option for keeping text aligned to horizontal
    *    add support for dimension extension lines
    *
   */
-
   var extMarkers = {
-    name: 'Markers',
+    name: 'markers',
-    init: function init(S) {
+    init: function () {
-      var svgEditor = this;
+      var _ref = asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee2(S) {
-      var $ = jQuery;
+        var strings, svgEditor, $, svgCanvas, addElem, mtypes, markerPrefix, idPrefix, markerTypes, getLinked, setIcon, selElems, showPanel, addMarker, convertline, setMarker, colorChanged, updateReferences, triggerTextEntry, showTextPrompt, setArrowFromButton, getTitle, buildButtonList, contextTools;
-      var svgCanvas = svgEditor.canvas;
+        return regeneratorRuntime.wrap(function _callee2$(_context2) {
-      var // {svgcontent} = S,
+          while (1) {
-      addElem = S.addSvgElementFromJson;
+            switch (_context2.prev = _context2.next) {
-      var mtypes = ['start', 'mid', 'end'];
+              case 0:
-      var markerPrefix = 'se_marker_';
+                buildButtonList = function buildButtonList(lang) {
-      var idPrefix = 'mkr_';
+                  var buttons = [];
-
+                  // const i = 0;
-      // note - to add additional marker types add them below with a unique id
+                  /*
-      // and add the associated icon(s) to marker-icons.svg
+                  buttons.push({
-      // the geometry is normallized to a 100x100 box with the origin at lower left
+                    id: idPrefix + 'markers_off',
-      // Safari did not like negative values for low left of viewBox
+                    title: 'Turn off all markers',
-      // remember that the coordinate system has +y downward
+                    type: 'context',
-      var markerTypes = {
+                    events: { click: setMarkerSet },
-        nomarker: {},
+                    panel: 'marker_panel'
-        leftarrow: { element: 'path', attr: { d: 'M0,50 L100,90 L70,50 L100,10 Z' } },
+                  });
-        rightarrow: { element: 'path', attr: { d: 'M100,50 L0,90 L30,50 L0,10 Z' } },
+                  buttons.push({
-        textmarker: { element: 'text', attr: { x: 0, y: 0, 'stroke-width': 0, stroke: 'none', 'font-size': 75, 'font-family': 'serif', 'text-anchor': 'left',
+                    id: idPrefix + 'markers_dimension',
-            'xml:space': 'preserve' } },
+                    title: 'Dimension',
-        forwardslash: { element: 'path', attr: { d: 'M30,100 L70,0' } },
+                    type: 'context',
-        reverseslash: { element: 'path', attr: { d: 'M30,0 L70,100' } },
+                    events: { click: setMarkerSet },
-        verticalslash: { element: 'path', attr: { d: 'M50,0 L50,100' } },
+                    panel: 'marker_panel'
-        box: { element: 'path', attr: { d: 'M20,20 L20,80 L80,80 L80,20 Z' } },
+                  });
-        star: { element: 'path', attr: { d: 'M10,30 L90,30 L20,90 L50,10 L80,90 Z' } },
+                  buttons.push({
-        xmark: { element: 'path', attr: { d: 'M20,80 L80,20 M80,80 L20,20' } },
+                    id: idPrefix + 'markers_label',
-        triangle: { element: 'path', attr: { d: 'M10,80 L50,20 L80,80 Z' } },
+                    title: 'Label',
-        mcircle: { element: 'circle', attr: { r: 30, cx: 50, cy: 50 } }
+                    type: 'context',
-      };
+                    events: { click: setMarkerSet },
-
+                    panel: 'marker_panel'
-      var langList = {
-        en: [{ id: 'start_marker_list', title: 'Select start marker type' }, { id: 'mid_marker_list', title: 'Select mid marker type' }, { id: 'end_marker_list', title: 'Select end marker type' }, { id: 'nomarker', title: 'No Marker' }, { id: 'leftarrow', title: 'Left Arrow' }, { id: 'rightarrow', title: 'Right Arrow' }, { id: 'textmarker', title: 'Text Marker' }, { id: 'forwardslash', title: 'Forward Slash' }, { id: 'reverseslash', title: 'Reverse Slash' }, { id: 'verticalslash', title: 'Vertical Slash' }, { id: 'box', title: 'Box' }, { id: 'star', title: 'Star' }, { id: 'xmark', title: 'X' }, { id: 'triangle', title: 'Triangle' }, { id: 'mcircle', title: 'Circle' }, { id: 'leftarrow_o', title: 'Open Left Arrow' }, { id: 'rightarrow_o', title: 'Open Right Arrow' }, { id: 'box_o', title: 'Open Box' }, { id: 'star_o', title: 'Open Star' }, { id: 'triangle_o', title: 'Open Triangle' }, { id: 'mcircle_o', title: 'Open Circle' }]
-      };
-
-      // duplicate shapes to support unfilled (open) marker types with an _o suffix
-      $.each(['leftarrow', 'rightarrow', 'box', 'star', 'mcircle', 'triangle'], function (i, v) {
-        markerTypes[v + '_o'] = markerTypes[v];
                   });
-
-      /**
-      * @param elem - A graphic element will have an attribute like marker-start
-      * @param attr - marker-start, marker-mid, or marker-end
-      * @returns The marker element that is linked to the graphic element
                   */
-      function getLinked(elem, attr) {
+                  $.each(mtypes, function (k, pos) {
-        var str = elem.getAttribute(attr);
+                    var listname = pos + '_marker_list';
-        if (!str) {
+                    var def = true;
-          return null;
+                    $.each(markerTypes, function (id, v) {
-        }
+                      var title = getTitle(String(id));
-        var m = str.match(/\(#(.*)\)/);
+                      buttons.push({
-        if (!m || m.length !== 2) {
+                        id: idPrefix + pos + '_' + id,
-          return null;
+                        svgicon: id,
-        }
+                        title: title,
-        return S.getElem(m[1]);
+                        type: 'context',
+                        events: { click: setArrowFromButton },
+                        panel: 'marker_panel',
+                        list: listname,
+                        isDefault: def
+                      });
+                      def = false;
+                    });
+                  });
+                  return buttons;
+                };
+
+                getTitle = function getTitle(id) {
+                  var langList = strings.langList;
+
+                  var item = langList.find(function (item) {
+                    return item.id === id;
+                  });
+                  return item ? item.title : id;
+                };
+
+                setArrowFromButton = function setArrowFromButton(obj) {
+                  var parts = this.id.split('_');
+                  var pos = parts[1];
+                  var val = parts[2];
+                  if (parts[3]) {
+                    val += '_' + parts[3];
                   }
 
-      function setIcon(pos, id) {
+                  if (val !== 'textmarker') {
-        if (id.substr(0, 1) !== '\\') {
+                    triggerTextEntry(pos, '\\' + val);
-          id = '\\textmarker';
-        }
-        var ci = '#' + idPrefix + pos + '_' + id.substr(1);
-        svgEditor.setIcon('#cur_' + pos + '_marker_list', $(ci).children());
-        $(ci).addClass('current').siblings().removeClass('current');
-      }
-
-      var selElems = void 0;
-      // toggles context tool panel off/on
-      // sets the controls with the selected element's settings
-      function showPanel(on) {
-        $('#marker_panel').toggle(on);
-
-        if (on) {
-          var el = selElems[0];
-
-          var val = void 0,
-              ci = void 0;
-          $.each(mtypes, function (i, pos) {
-            var m = getLinked(el, 'marker-' + pos);
-            var txtbox = $('#' + pos + '_marker');
-            if (!m) {
-              val = '\\nomarker';
-              ci = val;
-              txtbox.hide(); // hide text box
                   } else {
-              if (!m.attributes.se_type) {
+                    showTextPrompt(pos);
+                  }
+                };
+
+                showTextPrompt = function showTextPrompt(pos) {
+                  var def = $('#' + pos + '_marker').val();
+                  if (def.substr(0, 1) === '\\') {
+                    def = '';
+                  }
+                  $.prompt('Enter text for ' + pos + ' marker', def, function (txt) {
+                    if (txt) {
+                      triggerTextEntry(pos, txt);
+                    }
+                  });
+                };
+
+                triggerTextEntry = function triggerTextEntry(pos, val) {
+                  $('#' + pos + '_marker').val(val);
+                  $('#' + pos + '_marker').change();
+                  // const txtbox = $('#'+pos+'_marker');
+                  // if (val.substr(0,1)=='\\') {txtbox.hide();}
+                  // else {txtbox.show();}
+                };
+
+                updateReferences = function updateReferences(el) {
+                  $.each(mtypes, function (i, pos) {
+                    var id = markerPrefix + pos + '_' + el.id;
+                    var markerName = 'marker-' + pos;
+                    var marker = getLinked(el, markerName);
+                    if (!marker || !marker.attributes.se_type) {
                       return;
                     } // not created by this extension
-              val = '\\' + m.attributes.se_type.textContent;
+                    var url = el.getAttribute(markerName);
-              ci = val;
+                    if (url) {
-              if (val === '\\textmarker') {
+                      var len = el.id.length;
-                val = m.lastChild.textContent;
+                      var linkid = url.substr(-len - 1, len);
-                // txtbox.show(); // show text box
+                      if (el.id !== linkid) {
-              } else {
+                        var val = $('#' + pos + '_marker').attr('value');
-                txtbox.hide(); // hide text box
+                        addMarker(id, val);
+                        svgCanvas.changeSelectedAttribute(markerName, 'url(#' + id + ')');
+                        if (el.tagName === 'line' && pos === 'mid') {
+                          el = convertline(el);
+                        }
+                        S.call('changed', selElems);
                       }
                     }
-            txtbox.val(val);
-            setIcon(pos, ci);
                   });
+                };
+
+                colorChanged = function colorChanged(elem) {
+                  var color = elem.getAttribute('stroke');
+
+                  $.each(mtypes, function (i, pos) {
+                    var marker = getLinked(elem, 'marker-' + pos);
+                    if (!marker) {
+                      return;
                     }
+                    if (!marker.attributes.se_type) {
+                      return;
+                    } // not created by this extension
+                    var ch = marker.lastElementChild;
+                    if (!ch) {
+                      return;
+                    }
+                    var curfill = ch.getAttribute('fill');
+                    var curstroke = ch.getAttribute('stroke');
+                    if (curfill && curfill !== 'none') {
+                      ch.setAttribute('fill', color);
+                    }
+                    if (curstroke && curstroke !== 'none') {
+                      ch.setAttribute('stroke', color);
+                    }
+                  });
+                };
+
+                setMarker = function setMarker() {
+                  var poslist = { start_marker: 'start', mid_marker: 'mid', end_marker: 'end' };
+                  var pos = poslist[this.id];
+                  var markerName = 'marker-' + pos;
+                  var el = selElems[0];
+                  var marker = getLinked(el, markerName);
+                  if (marker) {
+                    $(marker).remove();
+                  }
+                  el.removeAttribute(markerName);
+                  var val = this.value;
+                  if (val === '') {
+                    val = '\\nomarker';
+                  }
+                  if (val === '\\nomarker') {
+                    setIcon(pos, val);
+                    S.call('changed', selElems);
+                    return;
+                  }
+                  // Set marker on element
+                  var id = markerPrefix + pos + '_' + el.id;
+                  addMarker(id, val);
+                  svgCanvas.changeSelectedAttribute(markerName, 'url(#' + id + ')');
+                  if (el.tagName === 'line' && pos === 'mid') {
+                    el = convertline(el);
+                  }
+                  S.call('changed', selElems);
+                  setIcon(pos, val);
+                };
+
+                convertline = function convertline(elem) {
+                  // this routine came from the connectors extension
+                  // it is needed because midpoint markers don't work with line elements
+                  if (!(elem.tagName === 'line')) {
+                    return elem;
                   }
 
-      function addMarker(id, val) {
+                  // Convert to polyline to accept mid-arrow
+
+                  var x1 = Number(elem.getAttribute('x1'));
+                  var x2 = Number(elem.getAttribute('x2'));
+                  var y1 = Number(elem.getAttribute('y1'));
+                  var y2 = Number(elem.getAttribute('y2'));
+                  var id = elem.id;
+
+
+                  var midPt = ' ' + (x1 + x2) / 2 + ',' + (y1 + y2) / 2 + ' ';
+                  var pline = addElem({
+                    element: 'polyline',
+                    attr: {
+                      points: x1 + ',' + y1 + midPt + x2 + ',' + y2,
+                      stroke: elem.getAttribute('stroke'),
+                      'stroke-width': elem.getAttribute('stroke-width'),
+                      fill: 'none',
+                      opacity: elem.getAttribute('opacity') || 1
+                    }
+                  });
+                  $.each(mtypes, function (i, pos) {
+                    // get any existing marker definitions
+                    var nam = 'marker-' + pos;
+                    var m = elem.getAttribute(nam);
+                    if (m) {
+                      pline.setAttribute(nam, elem.getAttribute(nam));
+                    }
+                  });
+
+                  var batchCmd = new S.BatchCommand();
+                  batchCmd.addSubCommand(new S.RemoveElementCommand(elem, elem.parentNode));
+                  batchCmd.addSubCommand(new S.InsertElementCommand(pline));
+
+                  $(elem).after(pline).remove();
+                  svgCanvas.clearSelection();
+                  pline.id = id;
+                  svgCanvas.addToSelection([pline]);
+                  S.addCommandToHistory(batchCmd);
+                  return pline;
+                };
+
+                addMarker = function addMarker(id, val) {
                   var txtBoxBg = '#ffffff';
                   var txtBoxBorder = 'none';
                   var txtBoxStrokeWidth = 0;
@@ -241,161 +392,124 @@ var svgEditorExtension_markers = (function () {
                   S.findDefs().append(marker);
 
                   return marker;
-      }
+                };
 
-      function convertline(elem) {
+                showPanel = function showPanel(on) {
-        // this routine came from the connectors extension
+                  $('#marker_panel').toggle(on);
-        // it is needed because midpoint markers don't work with line elements
-        if (!(elem.tagName === 'line')) {
-          return elem;
-        }
 
-        // Convert to polyline to accept mid-arrow
+                  if (on) {
-
-        var x1 = Number(elem.getAttribute('x1'));
-        var x2 = Number(elem.getAttribute('x2'));
-        var y1 = Number(elem.getAttribute('y1'));
-        var y2 = Number(elem.getAttribute('y2'));
-        var id = elem.id;
-
-
-        var midPt = ' ' + (x1 + x2) / 2 + ',' + (y1 + y2) / 2 + ' ';
-        var pline = addElem({
-          element: 'polyline',
-          attr: {
-            points: x1 + ',' + y1 + midPt + x2 + ',' + y2,
-            stroke: elem.getAttribute('stroke'),
-            'stroke-width': elem.getAttribute('stroke-width'),
-            fill: 'none',
-            opacity: elem.getAttribute('opacity') || 1
-          }
-        });
-        $.each(mtypes, function (i, pos) {
-          // get any existing marker definitions
-          var nam = 'marker-' + pos;
-          var m = elem.getAttribute(nam);
-          if (m) {
-            pline.setAttribute(nam, elem.getAttribute(nam));
-          }
-        });
-
-        var batchCmd = new S.BatchCommand();
-        batchCmd.addSubCommand(new S.RemoveElementCommand(elem, elem.parentNode));
-        batchCmd.addSubCommand(new S.InsertElementCommand(pline));
-
-        $(elem).after(pline).remove();
-        svgCanvas.clearSelection();
-        pline.id = id;
-        svgCanvas.addToSelection([pline]);
-        S.addCommandToHistory(batchCmd);
-        return pline;
-      }
-
-      function setMarker() {
-        var poslist = { start_marker: 'start', mid_marker: 'mid', end_marker: 'end' };
-        var pos = poslist[this.id];
-        var markerName = 'marker-' + pos;
                     var el = selElems[0];
-        var marker = getLinked(el, markerName);
+
-        if (marker) {
+                    var val = void 0,
-          $(marker).remove();
+                        ci = void 0;
-        }
+                    $.each(mtypes, function (i, pos) {
-        el.removeAttribute(markerName);
+                      var m = getLinked(el, 'marker-' + pos);
-        var val = this.value;
+                      var txtbox = $('#' + pos + '_marker');
-        if (val === '') {
+                      if (!m) {
                         val = '\\nomarker';
-        }
+                        ci = val;
-        if (val === '\\nomarker') {
+                        txtbox.hide(); // hide text box
-          setIcon(pos, val);
+                      } else {
-          S.call('changed', selElems);
+                        if (!m.attributes.se_type) {
                           return;
+                        } // not created by this extension
+                        val = '\\' + m.attributes.se_type.textContent;
+                        ci = val;
+                        if (val === '\\textmarker') {
+                          val = m.lastChild.textContent;
+                          // txtbox.show(); // show text box
+                        } else {
+                          txtbox.hide(); // hide text box
                         }
-        // Set marker on element
-        var id = markerPrefix + pos + '_' + el.id;
-        addMarker(id, val);
-        svgCanvas.changeSelectedAttribute(markerName, 'url(#' + id + ')');
-        if (el.tagName === 'line' && pos === 'mid') {
-          el = convertline(el);
                       }
-        S.call('changed', selElems);
+                      txtbox.val(val);
-        setIcon(pos, val);
+                      setIcon(pos, ci);
+                    });
                   }
+                };
+
+                setIcon = function setIcon(pos, id) {
+                  if (id.substr(0, 1) !== '\\') {
+                    id = '\\textmarker';
+                  }
+                  var ci = '#' + idPrefix + pos + '_' + id.substr(1);
+                  svgEditor.setIcon('#cur_' + pos + '_marker_list', $(ci).children());
+                  $(ci).addClass('current').siblings().removeClass('current');
+                };
+
+                getLinked = function getLinked(elem, attr) {
+                  var str = elem.getAttribute(attr);
+                  if (!str) {
+                    return null;
+                  }
+                  var m = str.match(/\(#(.*)\)/);
+                  if (!m || m.length !== 2) {
+                    return null;
+                  }
+                  return S.getElem(m[1]);
+                };
+
+                _context2.next = 15;
+                return S.importLocale();
+
+              case 15:
+                strings = _context2.sent;
+                svgEditor = this;
+                $ = jQuery;
+                svgCanvas = svgEditor.canvas;
+                addElem = S.addSVGElementFromJson;
+                mtypes = ['start', 'mid', 'end'];
+                markerPrefix = 'se_marker_';
+                idPrefix = 'mkr_';
+
+                // note - to add additional marker types add them below with a unique id
+                // and add the associated icon(s) to marker-icons.svg
+                // the geometry is normallized to a 100x100 box with the origin at lower left
+                // Safari did not like negative values for low left of viewBox
+                // remember that the coordinate system has +y downward
+
+                markerTypes = {
+                  nomarker: {},
+                  leftarrow: { element: 'path', attr: { d: 'M0,50 L100,90 L70,50 L100,10 Z' } },
+                  rightarrow: { element: 'path', attr: { d: 'M100,50 L0,90 L30,50 L0,10 Z' } },
+                  textmarker: { element: 'text', attr: { x: 0, y: 0, 'stroke-width': 0, stroke: 'none', 'font-size': 75, 'font-family': 'serif', 'text-anchor': 'left',
+                      'xml:space': 'preserve' } },
+                  forwardslash: { element: 'path', attr: { d: 'M30,100 L70,0' } },
+                  reverseslash: { element: 'path', attr: { d: 'M30,0 L70,100' } },
+                  verticalslash: { element: 'path', attr: { d: 'M50,0 L50,100' } },
+                  box: { element: 'path', attr: { d: 'M20,20 L20,80 L80,80 L80,20 Z' } },
+                  star: { element: 'path', attr: { d: 'M10,30 L90,30 L20,90 L50,10 L80,90 Z' } },
+                  xmark: { element: 'path', attr: { d: 'M20,80 L80,20 M80,80 L20,20' } },
+                  triangle: { element: 'path', attr: { d: 'M10,80 L50,20 L80,80 Z' } },
+                  mcircle: { element: 'circle', attr: { r: 30, cx: 50, cy: 50 } }
+                };
+
+                // duplicate shapes to support unfilled (open) marker types with an _o suffix
+
+                $.each(['leftarrow', 'rightarrow', 'box', 'star', 'mcircle', 'triangle'], function (i, v) {
+                  markerTypes[v + '_o'] = markerTypes[v];
+                });
+
+                /**
+                * @param {Element} elem - A graphic element will have an attribute like marker-start
+                * @param {"marker-start"|"marker-mid"|"marker-end"} attr
+                * @returns {Element} The marker element that is linked to the graphic element
+                */
+                selElems = void 0;
+                // toggles context tool panel off/on
+                // sets the controls with the selected element's settings
+
 
                 // called when the main system modifies an object
                 // this routine changes the associated markers to be the same color
-      function colorChanged(elem) {
-        var color = elem.getAttribute('stroke');
 
-        $.each(mtypes, function (i, pos) {
-          var marker = getLinked(elem, 'marker-' + pos);
-          if (!marker) {
-            return;
-          }
-          if (!marker.attributes.se_type) {
-            return;
-          } // not created by this extension
-          var ch = marker.lastElementChild;
-          if (!ch) {
-            return;
-          }
-          var curfill = ch.getAttribute('fill');
-          var curstroke = ch.getAttribute('stroke');
-          if (curfill && curfill !== 'none') {
-            ch.setAttribute('fill', color);
-          }
-          if (curstroke && curstroke !== 'none') {
-            ch.setAttribute('stroke', color);
-          }
-        });
-      }
 
                 // called when the main system creates or modifies an object
                 // primary purpose is create new markers for cloned objects
-      function updateReferences(el) {
+
-        $.each(mtypes, function (i, pos) {
-          var id = markerPrefix + pos + '_' + el.id;
-          var markerName = 'marker-' + pos;
-          var marker = getLinked(el, markerName);
-          if (!marker || !marker.attributes.se_type) {
-            return;
-          } // not created by this extension
-          var url = el.getAttribute(markerName);
-          if (url) {
-            var len = el.id.length;
-            var linkid = url.substr(-len - 1, len);
-            if (el.id !== linkid) {
-              var val = $('#' + pos + '_marker').attr('value');
-              addMarker(id, val);
-              svgCanvas.changeSelectedAttribute(markerName, 'url(#' + id + ')');
-              if (el.tagName === 'line' && pos === 'mid') {
-                el = convertline(el);
-              }
-              S.call('changed', selElems);
-            }
-          }
-        });
-      }
 
                 // simulate a change event a text box that stores the current element's marker type
-      function triggerTextEntry(pos, val) {
-        $('#' + pos + '_marker').val(val);
-        $('#' + pos + '_marker').change();
-        // const txtbox = $('#'+pos+'_marker');
-        // if (val.substr(0,1)=='\\') {txtbox.hide();}
-        // else {txtbox.show();}
-      }
 
-      function showTextPrompt(pos) {
-        var def = $('#' + pos + '_marker').val();
-        if (def.substr(0, 1) === '\\') {
-          def = '';
-        }
-        $.prompt('Enter text for ' + pos + ' marker', def, function (txt) {
-          if (txt) {
-            triggerTextEntry(pos, txt);
-          }
-        });
-      }
 
                 /*
                 function setMarkerSet(obj) {
@@ -421,93 +535,78 @@ var svgEditorExtension_markers = (function () {
                 }
                 */
                 // callback function for a toolbar button click
-      function setArrowFromButton(obj) {
-        var parts = this.id.split('_');
-        var pos = parts[1];
-        var val = parts[2];
-        if (parts[3]) {
-          val += '_' + parts[3];
-        }
 
-        if (val !== 'textmarker') {
-          triggerTextEntry(pos, '\\' + val);
-        } else {
-          showTextPrompt(pos);
-        }
-      }
-
-      function getTitle() {
-        var lang = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 'en';
-        var id = arguments[1];
-
-        var list = langList[lang];
-        for (var i in list) {
-          if (list.hasOwnProperty(i) && list[i].id === id) {
-            return list[i].title;
-          }
-        }
-        return id;
-      }
 
                 // build the toolbar button array from the marker definitions
-      function buildButtonList(lang) {
-        var buttons = [];
-        // const i = 0;
-        /*
-        buttons.push({
-          id: idPrefix + 'markers_off',
-          title: 'Turn off all markers',
-          type: 'context',
-          events: { click: setMarkerSet },
-          panel: 'marker_panel'
-        });
-        buttons.push({
-          id: idPrefix + 'markers_dimension',
-          title: 'Dimension',
-          type: 'context',
-          events: { click: setMarkerSet },
-          panel: 'marker_panel'
-        });
-        buttons.push({
-          id: idPrefix + 'markers_label',
-          title: 'Label',
-          type: 'context',
-          events: { click: setMarkerSet },
-          panel: 'marker_panel'
-        });
-        */
-        $.each(mtypes, function (k, pos) {
-          var listname = pos + '_marker_list';
-          var def = true;
-          $.each(markerTypes, function (id, v) {
-            var title = getTitle(lang, String(id));
-            buttons.push({
-              id: idPrefix + pos + '_' + id,
-              svgicon: id,
-              title: title,
-              type: 'context',
-              events: { click: setArrowFromButton },
-              panel: 'marker_panel',
-              list: listname,
-              isDefault: def
-            });
-            def = false;
-          });
-        });
-        return buttons;
-      }
 
-      var currentLang = void 0;
+                contextTools = [{
-      var ret = {
+                  type: 'input',
-        name: 'Markers',
+                  panel: 'marker_panel',
+                  id: 'start_marker',
+                  size: 3,
+                  events: { change: setMarker }
+                }, {
+                  type: 'button-select',
+                  panel: 'marker_panel',
+                  id: 'start_marker_list',
+                  colnum: 3,
+                  events: { change: setArrowFromButton }
+                }, {
+                  type: 'input',
+                  panel: 'marker_panel',
+                  id: 'mid_marker',
+                  defval: '',
+                  size: 3,
+                  events: { change: setMarker }
+                }, {
+                  type: 'button-select',
+                  panel: 'marker_panel',
+                  id: 'mid_marker_list',
+                  colnum: 3,
+                  events: { change: setArrowFromButton }
+                }, {
+                  type: 'input',
+                  panel: 'marker_panel',
+                  id: 'end_marker',
+                  size: 3,
+                  events: { change: setMarker }
+                }, {
+                  type: 'button-select',
+                  panel: 'marker_panel',
+                  id: 'end_marker_list',
+                  colnum: 3,
+                  events: { change: setArrowFromButton }
+                }];
+                return _context2.abrupt('return', {
+                  name: strings.name,
                   svgicons: svgEditor.curConfig.extIconsPath + 'markers-icons.xml',
                   callback: function callback() {
                     $('#marker_panel').addClass('toolset').hide();
                   },
-        addLangData: function addLangData(lang) {
+                  addLangData: function () {
-          currentLang = lang;
+                    var _ref3 = asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee(_ref2) {
-          return { data: langList[lang] };
+                      var importLocale = _ref2.importLocale,
-        },
+                          lang = _ref2.lang;
+                      return regeneratorRuntime.wrap(function _callee$(_context) {
+                        while (1) {
+                          switch (_context.prev = _context.next) {
+                            case 0:
+                              return _context.abrupt('return', { data: strings.langList });
+
+                            case 1:
+                            case 'end':
+                              return _context.stop();
+                          }
+                        }
+                      }, _callee, this);
+                    }));
+
+                    function addLangData(_x2) {
+                      return _ref3.apply(this, arguments);
+                    }
+
+                    return addLangData;
+                  }(),
                   selectedChanged: function selectedChanged(opts) {
                     // Use this to update the current selected elements
                     // console.log('selectChanged',opts);
@@ -537,69 +636,26 @@ var svgEditorExtension_markers = (function () {
                       updateReferences(elem);
                     }
                     // changing_flag = false; // Not apparently in use
-        }
-      };
-      // Todo: Check if the lang will be available in time
-      Object.defineProperties(ret, {
-        buttons: {
-          get: function get() {
-            return buildButtonList(currentLang);
-          }
                   },
-        context_tools: {
+
-          get: function get() {
+                  buttons: buildButtonList(),
-            return [{
+                  context_tools: contextTools
-              type: 'input',
-              panel: 'marker_panel',
-              title: 'Start marker',
-              id: 'start_marker',
-              label: 's',
-              size: 3,
-              events: { change: setMarker }
-            }, {
-              type: 'button-select',
-              panel: 'marker_panel',
-              title: getTitle(currentLang, 'start_marker_list'),
-              id: 'start_marker_list',
-              colnum: 3,
-              events: { change: setArrowFromButton }
-            }, {
-              type: 'input',
-              panel: 'marker_panel',
-              title: 'Middle marker',
-              id: 'mid_marker',
-              label: 'm',
-              defval: '',
-              size: 3,
-              events: { change: setMarker }
-            }, {
-              type: 'button-select',
-              panel: 'marker_panel',
-              title: getTitle(currentLang, 'mid_marker_list'),
-              id: 'mid_marker_list',
-              colnum: 3,
-              events: { change: setArrowFromButton }
-            }, {
-              type: 'input',
-              panel: 'marker_panel',
-              title: 'End marker',
-              id: 'end_marker',
-              label: 'e',
-              size: 3,
-              events: { change: setMarker }
-            }, {
-              type: 'button-select',
-              panel: 'marker_panel',
-              title: getTitle(currentLang, 'end_marker_list'),
-              id: 'end_marker_list',
-              colnum: 3,
-              events: { change: setArrowFromButton }
-            }];
-          }
-        }
                 });
-      return ret;
+
+              case 28:
+              case 'end':
+                return _context2.stop();
             }
+          }
+        }, _callee2, this);
+      }));
+
+      function init(_x) {
+        return _ref.apply(this, arguments);
+      }
+
+      return init;
+    }()
   };
 
   return extMarkers;

dist/extensions/ext-mathjax.js

@@ -47,6 +47,10 @@ var svgEditorExtension_mathjax = (function () {
   // MIT License
   // From: https://github.com/uupaa/dynamic-import-polyfill/blob/master/importModule.js
 
+  /**
+   * @module importModule
+   */
+
   function toAbsoluteURL(url) {
     var a = document.createElement('a');
     a.setAttribute('href', url); // <a href="hoge.html">
@@ -62,6 +66,17 @@ var svgEditorExtension_mathjax = (function () {
   }
 
   // Additions by Brett
+  /**
+  * @typedef {PlainObject} module:importModule.ImportConfig
+  * @property {string} global The variable name to set on `window` (when not using the modular version)
+  * @property {boolean} [returnDefault=false]
+  */
+  /**
+  * @function module:importModule.importSetGlobalDefault
+  * @param {string} url
+  * @param {module:importModule.ImportConfig} config
+  * @returns {*} The return depends on the export of the targeted module.
+  */
   var importSetGlobalDefault = function () {
     var _ref = asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee(url, config) {
       return regeneratorRuntime.wrap(function _callee$(_context) {
@@ -82,6 +97,12 @@ var svgEditorExtension_mathjax = (function () {
       return _ref.apply(this, arguments);
     };
   }();
+  /**
+  * @function module:importModule.importSetGlobal
+  * @param {string} url
+  * @param {module:importModule.ImportConfig} config
+  * @returns {ArbitraryModule|*} The return depends on the export of the targeted module.
+  */
   var importSetGlobal = function () {
     var _ref3 = asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee2(url, _ref2) {
       var global = _ref2.global,
@@ -200,59 +221,15 @@ var svgEditorExtension_mathjax = (function () {
 
   var extMathjax = {
     name: 'mathjax',
-    init: function init() {
+    init: function () {
-      var svgEditor = this;
+      var _ref2 = asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee(_ref) {
-      var $ = jQuery;
+        var importLocale = _ref.importLocale;
-      var svgCanvas = svgEditor.canvas;
+        var strings, svgEditor, $, svgCanvas, mathjaxSrcSecure, uiStrings, math, locationX, locationY, mathjaxLoaded, saveMath, buttons;
-
+        return regeneratorRuntime.wrap(function _callee$(_context) {
-      // Configuration of the MathJax extention.
+          while (1) {
-
+            switch (_context.prev = _context.next) {
-      // This will be added to the head tag before MathJax is loaded.
+              case 0:
-      /* mathjaxConfiguration = `<script type="text/x-mathjax-config">
+                saveMath = function saveMath() {
-      MathJax.Hub.Config({
-      extensions: ['tex2jax.js'],
-      jax: ['input/TeX', 'output/SVG'],
-      showProcessingMessages: true,
-      showMathMenu: false,
-      showMathMenuMSIE: false,
-      errorSettings: {
-        message: ['[Math Processing Error]'],
-        style: {color: '#CC0000', 'font-style': 'italic'}
-      },
-      elements: [],
-        tex2jax: {
-        ignoreClass: 'tex2jax_ignore2', processClass: 'tex2jax_process2',
-      },
-      TeX: {
-        extensions: ['AMSmath.js', 'AMSsymbols.js', 'noErrors.js', 'noUndefined.js']
-      },
-      SVG: {
-      }
-      });
-      </script>`, */
-      // mathjaxSrc = 'http://cdn.mathjax.org/mathjax/latest/MathJax.js',
-      // Had been on https://c328740.ssl.cf1.rackcdn.com/mathjax/latest/MathJax.js?config=TeX-AMS-MML_SVG.js
-      // Obtained Text-AMS-MML_SVG.js from https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.3/config/TeX-AMS-MML_SVG.js
-      var mathjaxSrcSecure = 'mathjax/MathJax.js?config=TeX-AMS-MML_SVG.js',
-          uiStrings = svgEditor.uiStrings;
-
-      var math = void 0,
-          locationX = void 0,
-          locationY = void 0,
-          mathjaxLoaded = false;
-
-      // TODO: Implement language support. Move these uiStrings to the locale files and the code to the langReady callback.
-      $.extend(uiStrings, {
-        mathjax: {
-          embed_svg: 'Save as mathematics',
-          embed_mathml: 'Save as figure',
-          svg_save_warning: 'The math will be transformed into a figure is manipulatable like everything else. You will not be able to manipulate the TeX-code anymore. ',
-          mathml_save_warning: 'Advised. The math will be saved as a figure.',
-          title: 'Mathematics code editor'
-        }
-      });
-
-      function saveMath() {
                   var code = $('#mathjax_code_textarea').val();
                   // displaystyle to force MathJax NOT to use the inline style. Because it is
                   // less fancy!
@@ -260,15 +237,15 @@ var svgEditorExtension_mathjax = (function () {
 
                   /*
                    * The MathJax library doesn't want to bloat your webpage so it creates
-         * every symbol (glymph) you need only once. These are saved in a <svg> on
+                   * every symbol (glymph) you need only once. These are saved in a `<svg>` on
                    * the top of your html document, just under the body tag. Each glymph has
-         * its unique id and is saved as a <path> in the <defs> tag of the <svg>
+                   * its unique id and is saved as a `<path>` in the `<defs>` tag of the `<svg>`
                    *
                    * Then when the symbols are needed in the rest of your html document they
-         * are refferd to by a <use> tag.
+                   * are refferd to by a `<use>` tag.
                    * Because of bug 1076 we can't just grab the defs tag on the top and add it
-         * to your formula's <svg> and copy the lot. So we have to replace each
+                   * to your formula's `<svg>` and copy the lot. So we have to replace each
-         * <use> tag by it's <path>.
+                   * `<use>` tag by its `<path>`.
                    */
                   MathJax.Hub.queue.Push(function () {
                     var mathjaxMath = $('.MathJax_SVG');
@@ -299,15 +276,64 @@ var svgEditorExtension_mathjax = (function () {
                     // This should only be once!
                     svgCanvas.moveSelectedElements(locationX, locationY, true);
                   });
-      }
+                };
 
-      return {
+                _context.next = 3;
-        name: 'MathJax',
+                return importLocale();
-        svgicons: svgEditor.curConfig.extIconsPath + 'mathjax-icons.xml',
+
-        buttons: [{
+              case 3:
+                strings = _context.sent;
+                svgEditor = this;
+                $ = jQuery;
+                svgCanvas = svgEditor.canvas;
+
+                // Configuration of the MathJax extention.
+
+                // This will be added to the head tag before MathJax is loaded.
+
+                /* mathjaxConfiguration = `<script type="text/x-mathjax-config">
+                MathJax.Hub.Config({
+                extensions: ['tex2jax.js'],
+                jax: ['input/TeX', 'output/SVG'],
+                showProcessingMessages: true,
+                showMathMenu: false,
+                showMathMenuMSIE: false,
+                errorSettings: {
+                  message: ['[Math Processing Error]'],
+                  style: {color: '#CC0000', 'font-style': 'italic'}
+                },
+                elements: [],
+                  tex2jax: {
+                  ignoreClass: 'tex2jax_ignore2', processClass: 'tex2jax_process2',
+                },
+                TeX: {
+                  extensions: ['AMSmath.js', 'AMSsymbols.js', 'noErrors.js', 'noUndefined.js']
+                },
+                SVG: {
+                }
+                });
+                </script>`, */
+                // mathjaxSrc = 'http://cdn.mathjax.org/mathjax/latest/MathJax.js',
+                // Had been on https://c328740.ssl.cf1.rackcdn.com/mathjax/latest/MathJax.js?config=TeX-AMS-MML_SVG.js
+                // Obtained Text-AMS-MML_SVG.js from https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.3/config/TeX-AMS-MML_SVG.js
+                mathjaxSrcSecure = 'mathjax/MathJax.min.js?config=TeX-AMS-MML_SVG.js', uiStrings = svgEditor.uiStrings;
+                math = void 0, locationX = void 0, locationY = void 0, mathjaxLoaded = false;
+
+                // TODO: Implement language support. Move these uiStrings to the locale files and the code to the langReady callback.
+
+                $.extend(uiStrings, {
+                  mathjax: {
+                    embed_svg: 'Save as mathematics',
+                    embed_mathml: 'Save as figure',
+                    svg_save_warning: 'The math will be transformed into a figure is manipulatable like everything else. You will not be able to manipulate the TeX-code anymore. ',
+                    mathml_save_warning: 'Advised. The math will be saved as a figure.',
+                    title: 'Mathematics code editor'
+                  }
+                });
+
+                buttons = [{
                   id: 'tool_mathjax',
                   type: 'mode',
-          title: 'Add Mathematics',
                   events: {
                     click: function click() {
                       // Only load Mathjax when needed, we don't want to strain Svg-Edit any more.
@@ -371,7 +397,13 @@ var svgEditorExtension_mathjax = (function () {
                       svgCanvas.setMode('mathjax');
                     }
                   }
-        }],
+                }];
+                return _context.abrupt('return', {
+                  name: strings.name,
+                  svgicons: svgEditor.curConfig.extIconsPath + 'mathjax-icons.xml',
+                  buttons: strings.buttons.map(function (button, i) {
+                    return Object.assign(buttons[i], button);
+                  }),
 
                   mouseDown: function mouseDown() {
                     if (svgCanvas.getMode() === 'mathjax') {
@@ -396,8 +428,22 @@ var svgEditorExtension_mathjax = (function () {
                     // Add the MathJax configuration.
                     // $(mathjaxConfiguration).appendTo('head');
                   }
-      };
+                });
+
+              case 12:
+              case 'end':
+                return _context.stop();
             }
+          }
+        }, _callee, this);
+      }));
+
+      function init(_x) {
+        return _ref2.apply(this, arguments);
+      }
+
+      return init;
+    }()
   };
 
   return extMathjax;

dist/extensions/ext-overview_window.js

@@ -2,12 +2,12 @@ var svgEditorExtension_overview_window = (function () {
   'use strict';
 
   /* globals jQuery */
-  /*
+  /**
    * ext-overview_window.js
    *
-   * Licensed under the MIT License
+   * @license MIT
    *
-   * Copyright(c) 2013 James Sacksteder
+   * @copyright 2013 James Sacksteder
    *
    */
   var extOverview_window = {

dist/extensions/ext-panning.js

@@ -1,37 +1,78 @@
 var svgEditorExtension_panning = (function () {
   'use strict';
 
-  /*
+  var asyncToGenerator = function (fn) {
+    return function () {
+      var gen = fn.apply(this, arguments);
+      return new Promise(function (resolve, reject) {
+        function step(key, arg) {
+          try {
+            var info = gen[key](arg);
+            var value = info.value;
+          } catch (error) {
+            reject(error);
+            return;
+          }
+
+          if (info.done) {
+            resolve(value);
+          } else {
+            return Promise.resolve(value).then(function (value) {
+              step("next", value);
+            }, function (err) {
+              step("throw", err);
+            });
+          }
+        }
+
+        return step("next");
+      });
+    };
+  };
+
+  /**
    * ext-panning.js
    *
-   * Licensed under the MIT License
+   * @license MIT
    *
-   * Copyright(c) 2013 Luis Aguirre
+   * @copyright 2013 Luis Aguirre
    *
    */
-
   /*
     This is a very basic SVG-Edit extension to let tablet/mobile devices pan without problem
   */
-
   var extPanning = {
-    name: 'ext-panning',
+    name: 'panning',
-    init: function init() {
+    init: function () {
-      var svgEditor = this;
+      var _ref2 = asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee(_ref) {
-      var svgCanvas = svgEditor.canvas;
+        var importLocale = _ref.importLocale;
-      return {
+        var strings, svgEditor, svgCanvas, buttons;
-        name: 'Extension Panning',
+        return regeneratorRuntime.wrap(function _callee$(_context) {
-        svgicons: svgEditor.curConfig.extIconsPath + 'ext-panning.xml',
+          while (1) {
-        buttons: [{
+            switch (_context.prev = _context.next) {
+              case 0:
+                _context.next = 2;
+                return importLocale();
+
+              case 2:
+                strings = _context.sent;
+                svgEditor = this;
+                svgCanvas = svgEditor.canvas;
+                buttons = [{
                   id: 'ext-panning',
                   type: 'mode',
-          title: 'Panning',
                   events: {
                     click: function click() {
                       svgCanvas.setMode('ext-panning');
                     }
                   }
-        }],
+                }];
+                return _context.abrupt('return', {
+                  name: strings.name,
+                  svgicons: svgEditor.curConfig.extIconsPath + 'ext-panning.xml',
+                  buttons: strings.buttons.map(function (button, i) {
+                    return Object.assign(buttons[i], button);
+                  }),
                   mouseDown: function mouseDown() {
                     if (svgCanvas.getMode() === 'ext-panning') {
                       svgEditor.setPanning(true);
@@ -47,8 +88,22 @@ var svgEditorExtension_panning = (function () {
                       };
                     }
                   }
-      };
+                });
+
+              case 7:
+              case 'end':
+                return _context.stop();
             }
+          }
+        }, _callee, this);
+      }));
+
+      function init(_x) {
+        return _ref2.apply(this, arguments);
+      }
+
+      return init;
+    }()
   };
 
   return extPanning;

dist/extensions/ext-php_savefile.js

@@ -7,7 +7,7 @@ var svgEditorExtension_php_savefile = (function () {
 
   var extPhp_savefile = {
     name: 'php_savefile',
-    callback: function callback() {
+    init: function init() {
       var svgEditor = this;
       var $ = jQuery;
       var svgCanvas = svgEditor.canvas;

dist/extensions/ext-polygon.js

@@ -1,29 +1,84 @@
 var svgEditorExtension_polygon = (function () {
   'use strict';
 
+  var asyncToGenerator = function (fn) {
+    return function () {
+      var gen = fn.apply(this, arguments);
+      return new Promise(function (resolve, reject) {
+        function step(key, arg) {
+          try {
+            var info = gen[key](arg);
+            var value = info.value;
+          } catch (error) {
+            reject(error);
+            return;
+          }
+
+          if (info.done) {
+            resolve(value);
+          } else {
+            return Promise.resolve(value).then(function (value) {
+              step("next", value);
+            }, function (err) {
+              step("throw", err);
+            });
+          }
+        }
+
+        return step("next");
+      });
+    };
+  };
+
   /* globals jQuery */
-  /*
+  /**
    * ext-polygon.js
    *
    *
-   * Copyright(c) 2010 CloudCanvas, Inc.
+   * @copyright 2010 CloudCanvas, Inc. All rights reserved
-   * All rights reserved
    *
    */
   var extPolygon = {
     name: 'polygon',
-    init: function init(S) {
+    init: function () {
-      var svgEditor = this;
+      var _ref = asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee(S) {
-      var $ = jQuery;
+        var svgEditor, $, svgCanvas, importLocale, editingitex, strings, selElems, started, newFO, showPanel, setAttr, cot, sec, buttons, contextTools;
-      var svgCanvas = svgEditor.canvas;
+        return regeneratorRuntime.wrap(function _callee$(_context) {
-      var selElems = void 0,
+          while (1) {
+            switch (_context.prev = _context.next) {
+              case 0:
+                sec = function sec(n) {
+                  return 1 / Math.cos(n);
+                };
 
-      // svgdoc = S.svgroot.parentNode.ownerDocument,
+                cot = function cot(n) {
-      // newFOG, newFOGParent, newDef, newImageName, newMaskID, modeChangeG,
+                  return 1 / Math.tan(n);
-      // edg = 0,
+                };
-      // undoCommand = 'Not image';
+
-      started = void 0,
+                setAttr = function setAttr(attr, val) {
-          newFO = void 0;
+                  svgCanvas.changeSelectedAttribute(attr, val);
+                  S.call('changed', selElems);
+                };
+
+                showPanel = function showPanel(on) {
+                  var fcRules = $('#fc_rules');
+                  if (!fcRules.length) {
+                    fcRules = $('<style id="fc_rules"></style>').appendTo('head');
+                  }
+                  fcRules.text(!on ? '' : ' #tool_topath { display: none !important; }');
+                  $('#polygon_panel').toggle(on);
+                };
+
+                svgEditor = this;
+                $ = jQuery;
+                svgCanvas = svgEditor.canvas;
+                importLocale = S.importLocale, editingitex = false;
+                _context.next = 10;
+                return importLocale();
+
+              case 10:
+                strings = _context.sent;
+                selElems = void 0, started = void 0, newFO = void 0;
 
                 // const ccZoom;
                 // const wEl, hEl;
@@ -39,14 +94,7 @@ var svgEditorExtension_polygon = (function () {
                  const height = $('#svg_source_container').height() - 80;
                  $('#svg_source_textarea').css('height', height);
                  }; */
-      function showPanel(on) {
+
-        var fcRules = $('#fc_rules');
-        if (!fcRules.length) {
-          fcRules = $('<style id="fc_rules"></style>').appendTo('head');
-        }
-        fcRules.text(!on ? '' : ' #tool_topath { display: none !important; }');
-        $('#polygon_panel').toggle(on);
-      }
 
                 /*
                 function toggleSourceButtons(on){
@@ -55,25 +103,12 @@ var svgEditorExtension_polygon = (function () {
                 }
                 */
 
-      function setAttr(attr, val) {
-        svgCanvas.changeSelectedAttribute(attr, val);
-        S.call('changed', selElems);
-      }
-
-      function cot(n) {
-        return 1 / Math.tan(n);
-      }
-
-      function sec(n) {
-        return 1 / Math.cos(n);
-      }
-
                 /**
                 * Obtained from http://code.google.com/p/passenger-top/source/browse/instiki/public/svg-edit/editor/extensions/ext-itex.js?r=3
                 * This function sets the content of of the currently-selected foreignObject element,
                 *   based on the itex contained in string.
                 * @param {string} tex The itex text.
-      * @returns This function returns false if the set was unsuccessful, true otherwise.
+                * @returns {boolean} This function returns false if the set was unsuccessful, true otherwise.
                 */
                 /*
                 function setItexString(tex) {
@@ -111,13 +146,9 @@ var svgEditorExtension_polygon = (function () {
                    return true;
                 }
                 */
-      return {
+                buttons = [{
-        name: 'polygon',
-        svgicons: svgEditor.curConfig.extIconsPath + 'polygon-icons.svg',
-        buttons: [{
                   id: 'tool_polygon',
                   type: 'mode',
-          title: 'Polygon Tool',
                   position: 11,
                   events: {
                     click: function click() {
@@ -125,14 +156,11 @@ var svgEditorExtension_polygon = (function () {
                       showPanel(true);
                     }
                   }
-        }],
+                }];
-
+                contextTools = [{
-        context_tools: [{
                   type: 'input',
                   panel: 'polygon_panel',
-          title: 'Number of Sides',
                   id: 'polySides',
-          label: 'sides',
                   size: 3,
                   defval: 5,
                   events: {
@@ -140,7 +168,16 @@ var svgEditorExtension_polygon = (function () {
                       setAttr('sides', this.value);
                     }
                   }
-        }],
+                }];
+                return _context.abrupt('return', {
+                  name: strings.name,
+                  svgicons: svgEditor.curConfig.extIconsPath + 'polygon-icons.svg',
+                  buttons: strings.buttons.map(function (button, i) {
+                    return Object.assign(buttons[i], button);
+                  }),
+                  context_tools: strings.contextTools.map(function (contextTool, i) {
+                    return Object.assign(contextTools[i], contextTool);
+                  }),
 
                   callback: function callback() {
                     $('#polygon_panel').hide();
@@ -149,7 +186,7 @@ var svgEditorExtension_polygon = (function () {
                     setTimeout(function () {
                       // Create source save/cancel buttons
                       /* const save = */$('#tool_source_save').clone().hide().attr('id', 'polygon_save').unbind().appendTo('#tool_source_back').click(function () {
-              {
+                        if (!editingitex) {
                           return;
                         }
                         // }
@@ -171,7 +208,7 @@ var svgEditorExtension_polygon = (function () {
                     if (svgCanvas.getMode() === 'polygon') {
                       started = true;
 
-            newFO = S.addSvgElementFromJson({
+                      newFO = S.addSVGElementFromJson({
                         element: 'polygon',
                         attr: {
                           cx: opts.start_x,
@@ -270,8 +307,22 @@ var svgEditorExtension_polygon = (function () {
                   elementChanged: function elementChanged(opts) {
                     // const elem = opts.elems[0];
                   }
-      };
+                });
+
+              case 15:
+              case 'end':
+                return _context.stop();
             }
+          }
+        }, _callee, this);
+      }));
+
+      function init(_x) {
+        return _ref.apply(this, arguments);
+      }
+
+      return init;
+    }()
   };
 
   return extPolygon;

dist/extensions/ext-server_moinsave.js

@@ -151,6 +151,13 @@ var svgEditorExtension_server_moinsave = (function () {
     }
   };
 
+  /**
+   * For parsing color values
+   * @module RGBColor
+   * @author Stoyan Stefanov <sstoo@gmail.com>
+   * @see https://www.phpied.com/rgb-color-parser-in-javascript/
+   * @license MIT
+  */
   var simpleColors = {
     aliceblue: 'f0f8ff',
     antiquewhite: 'faebd7',
@@ -320,12 +327,12 @@ var svgEditorExtension_server_moinsave = (function () {
 
   /**
    * A class to parse color values
-   * @author Stoyan Stefanov <sstoo@gmail.com>
-   * @link   https://www.phpied.com/rgb-color-parser-in-javascript/
-   * @license MIT
    */
 
   var RGBColor = function () {
+    /**
+    * @param {string} colorString
+    */
     function RGBColor(colorString) {
       classCallCheck(this, RGBColor);
 
@@ -372,6 +379,9 @@ var svgEditorExtension_server_moinsave = (function () {
     }
 
     // some getters
+    /**
+    * @returns {string}
+    */
 
 
     createClass(RGBColor, [{
@@ -379,6 +389,11 @@ var svgEditorExtension_server_moinsave = (function () {
       value: function toRGB() {
         return 'rgb(' + this.r + ', ' + this.g + ', ' + this.b + ')';
       }
+
+      /**
+      * @returns {string}
+      */
+
     }, {
       key: 'toHex',
       value: function toHex() {
@@ -397,7 +412,10 @@ var svgEditorExtension_server_moinsave = (function () {
         return '#' + r + g + b;
       }
 
-      // help
+      /**
+      * help
+      * @returns {HTMLUListElement}
+      */
 
     }, {
       key: 'getHelpXML',
@@ -434,25 +452,391 @@ var svgEditorExtension_server_moinsave = (function () {
     return RGBColor;
   }();
 
+  /**
+  * StackBlur - a fast almost Gaussian Blur For Canvas
+
+  In case you find this class useful - especially in commercial projects -
+  I am not totally unhappy for a small donation to my PayPal account
+  mario@quasimondo.de
+
+  Or support me on flattr:
+  https://flattr.com/thing/72791/StackBlur-a-fast-almost-Gaussian-Blur-Effect-for-CanvasJavascript
+
+  * @module StackBlur
+  * @version 0.5
+  * @author Mario Klingemann
+  Contact: mario@quasimondo.com
+  Website: http://www.quasimondo.com/StackBlurForCanvas/StackBlurDemo.html
+  Twitter: @quasimondo
+
+  * @copyright (c) 2010 Mario Klingemann
+
+  Permission is hereby granted, free of charge, to any person
+  obtaining a copy of this software and associated documentation
+  files (the "Software"), to deal in the Software without
+  restriction, including without limitation the rights to use,
+  copy, modify, merge, publish, distribute, sublicense, and/or sell
+  copies of the Software, and to permit persons to whom the
+  Software is furnished to do so, subject to the following
+  conditions:
+
+  The above copyright notice and this permission notice shall be
+  included in all copies or substantial portions of the Software.
+
+  THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
+  EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES
+  OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
+  NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT
+  HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY,
+  WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING
+  FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR
+  OTHER DEALINGS IN THE SOFTWARE.
+  */
+
+  var mulTable = [512, 512, 456, 512, 328, 456, 335, 512, 405, 328, 271, 456, 388, 335, 292, 512, 454, 405, 364, 328, 298, 271, 496, 456, 420, 388, 360, 335, 312, 292, 273, 512, 482, 454, 428, 405, 383, 364, 345, 328, 312, 298, 284, 271, 259, 496, 475, 456, 437, 420, 404, 388, 374, 360, 347, 335, 323, 312, 302, 292, 282, 273, 265, 512, 497, 482, 468, 454, 441, 428, 417, 405, 394, 383, 373, 364, 354, 345, 337, 328, 320, 312, 305, 298, 291, 284, 278, 271, 265, 259, 507, 496, 485, 475, 465, 456, 446, 437, 428, 420, 412, 404, 396, 388, 381, 374, 367, 360, 354, 347, 341, 335, 329, 323, 318, 312, 307, 302, 297, 292, 287, 282, 278, 273, 269, 265, 261, 512, 505, 497, 489, 482, 475, 468, 461, 454, 447, 441, 435, 428, 422, 417, 411, 405, 399, 394, 389, 383, 378, 373, 368, 364, 359, 354, 350, 345, 341, 337, 332, 328, 324, 320, 316, 312, 309, 305, 301, 298, 294, 291, 287, 284, 281, 278, 274, 271, 268, 265, 262, 259, 257, 507, 501, 496, 491, 485, 480, 475, 470, 465, 460, 456, 451, 446, 442, 437, 433, 428, 424, 420, 416, 412, 408, 404, 400, 396, 392, 388, 385, 381, 377, 374, 370, 367, 363, 360, 357, 354, 350, 347, 344, 341, 338, 335, 332, 329, 326, 323, 320, 318, 315, 312, 310, 307, 304, 302, 299, 297, 294, 292, 289, 287, 285, 282, 280, 278, 275, 273, 271, 269, 267, 265, 263, 261, 259];
+
+  var shgTable = [9, 11, 12, 13, 13, 14, 14, 15, 15, 15, 15, 16, 16, 16, 16, 17, 17, 17, 17, 17, 17, 17, 18, 18, 18, 18, 18, 18, 18, 18, 18, 19, 19, 19, 19, 19, 19, 19, 19, 19, 19, 19, 19, 19, 19, 20, 20, 20, 20, 20, 20, 20, 20, 20, 20, 20, 20, 20, 20, 20, 20, 20, 20, 21, 21, 21, 21, 21, 21, 21, 21, 21, 21, 21, 21, 21, 21, 21, 21, 21, 21, 21, 21, 21, 21, 21, 21, 21, 21, 21, 22, 22, 22, 22, 22, 22, 22, 22, 22, 22, 22, 22, 22, 22, 22, 22, 22, 22, 22, 22, 22, 22, 22, 22, 22, 22, 22, 22, 22, 22, 22, 22, 22, 22, 22, 22, 22, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24];
+
+  /**
+   * @param {string|HTMLCanvasElement} canvas
+   * @param {Integer} topX
+   * @param {Integer} topY
+   * @param {Integer} width
+   * @param {Integer} height
+   * @throws {Error}
+   * @returns {ImageData} See {@link https://html.spec.whatwg.org/multipage/canvas.html#imagedata}
+   */
+  function getImageDataFromCanvas(canvas, topX, topY, width, height) {
+    if (typeof canvas === 'string') {
+      canvas = document.getElementById(canvas);
+    }
+    if (!canvas || !('getContext' in canvas)) {
+      return;
+    }
+
+    var context = canvas.getContext('2d');
+
+    try {
+      return context.getImageData(topX, topY, width, height);
+    } catch (e) {
+      throw new Error('unable to access image data: ' + e);
+    }
+  }
+
+  /**
+   * @param {HTMLCanvasElement} canvas
+   * @param {Integer} topX
+   * @param {Integer} topY
+   * @param {Integer} width
+   * @param {Integer} height
+   * @param {Float} radius
+   * @returns {undefined}
+   */
+  function processCanvasRGBA(canvas, topX, topY, width, height, radius) {
+    if (isNaN(radius) || radius < 1) {
+      return;
+    }
+    radius |= 0;
+
+    var imageData = getImageDataFromCanvas(canvas, topX, topY, width, height);
+
+    imageData = processImageDataRGBA(imageData, topX, topY, width, height, radius);
+
+    canvas.getContext('2d').putImageData(imageData, topX, topY);
+  }
+
+  /**
+   * @param {ImageData} imageData
+   * @param {Integer} topX
+   * @param {Integer} topY
+   * @param {Integer} width
+   * @param {Integer} height
+   * @param {Float} radius
+   * @returns {ImageData}
+   */
+  function processImageDataRGBA(imageData, topX, topY, width, height, radius) {
+    var pixels = imageData.data;
+
+    var x = void 0,
+        y = void 0,
+        i = void 0,
+        p = void 0,
+        yp = void 0,
+        yi = void 0,
+        yw = void 0,
+        rSum = void 0,
+        gSum = void 0,
+        bSum = void 0,
+        aSum = void 0,
+        rOutSum = void 0,
+        gOutSum = void 0,
+        bOutSum = void 0,
+        aOutSum = void 0,
+        rInSum = void 0,
+        gInSum = void 0,
+        bInSum = void 0,
+        aInSum = void 0,
+        pr = void 0,
+        pg = void 0,
+        pb = void 0,
+        pa = void 0,
+        rbs = void 0;
+
+    var div = radius + radius + 1;
+    // const w4 = width << 2;
+    var widthMinus1 = width - 1;
+    var heightMinus1 = height - 1;
+    var radiusPlus1 = radius + 1;
+    var sumFactor = radiusPlus1 * (radiusPlus1 + 1) / 2;
+
+    var stackStart = new BlurStack();
+    var stack = stackStart;
+    var stackEnd = void 0;
+    for (i = 1; i < div; i++) {
+      stack = stack.next = new BlurStack();
+      if (i === radiusPlus1) {
+        stackEnd = stack;
+      }
+    }
+    stack.next = stackStart;
+    var stackIn = null;
+    var stackOut = null;
+
+    yw = yi = 0;
+
+    var mulSum = mulTable[radius];
+    var shgSum = shgTable[radius];
+
+    for (y = 0; y < height; y++) {
+      rInSum = gInSum = bInSum = aInSum = rSum = gSum = bSum = aSum = 0;
+
+      rOutSum = radiusPlus1 * (pr = pixels[yi]);
+      gOutSum = radiusPlus1 * (pg = pixels[yi + 1]);
+      bOutSum = radiusPlus1 * (pb = pixels[yi + 2]);
+      aOutSum = radiusPlus1 * (pa = pixels[yi + 3]);
+
+      rSum += sumFactor * pr;
+      gSum += sumFactor * pg;
+      bSum += sumFactor * pb;
+      aSum += sumFactor * pa;
+
+      stack = stackStart;
+
+      for (i = 0; i < radiusPlus1; i++) {
+        stack.r = pr;
+        stack.g = pg;
+        stack.b = pb;
+        stack.a = pa;
+        stack = stack.next;
+      }
+
+      for (i = 1; i < radiusPlus1; i++) {
+        p = yi + ((widthMinus1 < i ? widthMinus1 : i) << 2);
+        rSum += (stack.r = pr = pixels[p]) * (rbs = radiusPlus1 - i);
+        gSum += (stack.g = pg = pixels[p + 1]) * rbs;
+        bSum += (stack.b = pb = pixels[p + 2]) * rbs;
+        aSum += (stack.a = pa = pixels[p + 3]) * rbs;
+
+        rInSum += pr;
+        gInSum += pg;
+        bInSum += pb;
+        aInSum += pa;
+
+        stack = stack.next;
+      }
+
+      stackIn = stackStart;
+      stackOut = stackEnd;
+      for (x = 0; x < width; x++) {
+        pixels[yi + 3] = pa = aSum * mulSum >> shgSum;
+        if (pa !== 0) {
+          pa = 255 / pa;
+          pixels[yi] = (rSum * mulSum >> shgSum) * pa;
+          pixels[yi + 1] = (gSum * mulSum >> shgSum) * pa;
+          pixels[yi + 2] = (bSum * mulSum >> shgSum) * pa;
+        } else {
+          pixels[yi] = pixels[yi + 1] = pixels[yi + 2] = 0;
+        }
+
+        rSum -= rOutSum;
+        gSum -= gOutSum;
+        bSum -= bOutSum;
+        aSum -= aOutSum;
+
+        rOutSum -= stackIn.r;
+        gOutSum -= stackIn.g;
+        bOutSum -= stackIn.b;
+        aOutSum -= stackIn.a;
+
+        p = yw + ((p = x + radius + 1) < widthMinus1 ? p : widthMinus1) << 2;
+
+        rInSum += stackIn.r = pixels[p];
+        gInSum += stackIn.g = pixels[p + 1];
+        bInSum += stackIn.b = pixels[p + 2];
+        aInSum += stackIn.a = pixels[p + 3];
+
+        rSum += rInSum;
+        gSum += gInSum;
+        bSum += bInSum;
+        aSum += aInSum;
+
+        stackIn = stackIn.next;
+
+        rOutSum += pr = stackOut.r;
+        gOutSum += pg = stackOut.g;
+        bOutSum += pb = stackOut.b;
+        aOutSum += pa = stackOut.a;
+
+        rInSum -= pr;
+        gInSum -= pg;
+        bInSum -= pb;
+        aInSum -= pa;
+
+        stackOut = stackOut.next;
+
+        yi += 4;
+      }
+      yw += width;
+    }
+
+    for (x = 0; x < width; x++) {
+      gInSum = bInSum = aInSum = rInSum = gSum = bSum = aSum = rSum = 0;
+
+      yi = x << 2;
+      rOutSum = radiusPlus1 * (pr = pixels[yi]);
+      gOutSum = radiusPlus1 * (pg = pixels[yi + 1]);
+      bOutSum = radiusPlus1 * (pb = pixels[yi + 2]);
+      aOutSum = radiusPlus1 * (pa = pixels[yi + 3]);
+
+      rSum += sumFactor * pr;
+      gSum += sumFactor * pg;
+      bSum += sumFactor * pb;
+      aSum += sumFactor * pa;
+
+      stack = stackStart;
+
+      for (i = 0; i < radiusPlus1; i++) {
+        stack.r = pr;
+        stack.g = pg;
+        stack.b = pb;
+        stack.a = pa;
+        stack = stack.next;
+      }
+
+      yp = width;
+
+      for (i = 1; i <= radius; i++) {
+        yi = yp + x << 2;
+
+        rSum += (stack.r = pr = pixels[yi]) * (rbs = radiusPlus1 - i);
+        gSum += (stack.g = pg = pixels[yi + 1]) * rbs;
+        bSum += (stack.b = pb = pixels[yi + 2]) * rbs;
+        aSum += (stack.a = pa = pixels[yi + 3]) * rbs;
+
+        rInSum += pr;
+        gInSum += pg;
+        bInSum += pb;
+        aInSum += pa;
+
+        stack = stack.next;
+
+        if (i < heightMinus1) {
+          yp += width;
+        }
+      }
+
+      yi = x;
+      stackIn = stackStart;
+      stackOut = stackEnd;
+      for (y = 0; y < height; y++) {
+        p = yi << 2;
+        pixels[p + 3] = pa = aSum * mulSum >> shgSum;
+        if (pa > 0) {
+          pa = 255 / pa;
+          pixels[p] = (rSum * mulSum >> shgSum) * pa;
+          pixels[p + 1] = (gSum * mulSum >> shgSum) * pa;
+          pixels[p + 2] = (bSum * mulSum >> shgSum) * pa;
+        } else {
+          pixels[p] = pixels[p + 1] = pixels[p + 2] = 0;
+        }
+
+        rSum -= rOutSum;
+        gSum -= gOutSum;
+        bSum -= bOutSum;
+        aSum -= aOutSum;
+
+        rOutSum -= stackIn.r;
+        gOutSum -= stackIn.g;
+        bOutSum -= stackIn.b;
+        aOutSum -= stackIn.a;
+
+        p = x + ((p = y + radiusPlus1) < heightMinus1 ? p : heightMinus1) * width << 2;
+
+        rSum += rInSum += stackIn.r = pixels[p];
+        gSum += gInSum += stackIn.g = pixels[p + 1];
+        bSum += bInSum += stackIn.b = pixels[p + 2];
+        aSum += aInSum += stackIn.a = pixels[p + 3];
+
+        stackIn = stackIn.next;
+
+        rOutSum += pr = stackOut.r;
+        gOutSum += pg = stackOut.g;
+        bOutSum += pb = stackOut.b;
+        aOutSum += pa = stackOut.a;
+
+        rInSum -= pr;
+        gInSum -= pg;
+        bInSum -= pb;
+        aInSum -= pa;
+
+        stackOut = stackOut.next;
+
+        yi += width;
+      }
+    }
+    return imageData;
+  }
+
+  /**
+   *
+   */
+  var BlurStack = function BlurStack() {
+    classCallCheck(this, BlurStack);
+
+    this.r = 0;
+    this.g = 0;
+    this.b = 0;
+    this.a = 0;
+    this.next = null;
+  };
+
   /* eslint-disable new-cap */
 
-  var stackBlurCanvasRGBA = void 0;
+  var canvasRGBA_ = processCanvasRGBA;
 
-  // canvg(target, s)
+  /**
-  // empty parameters: replace all 'svg' elements on page with 'canvas' elements
+  * @typedef {PlainObject} module:canvg.CanvgOptions
-  // target: canvas element or the id of a canvas element
+  * @property {boolean} opts.ignoreMouse true => ignore mouse events
-  // s: svg string, url to svg file, or xml document
+  * @property {boolean} opts.ignoreAnimation true => ignore animations
-  // opts: optional hash of options
+  * @property {boolean} opts.ignoreDimensions true => does not try to resize canvas
-  //     ignoreMouse: true => ignore mouse events
+  * @property {boolean} opts.ignoreClear true => does not clear canvas
-  //     ignoreAnimation: true => ignore animations
+  * @property {Integer} opts.offsetX int => draws at a x offset
-  //     ignoreDimensions: true => does not try to resize canvas
+  * @property {Integer} opts.offsetY int => draws at a y offset
-  //     ignoreClear: true => does not clear canvas
+  * @property {Integer} opts.scaleWidth int => scales horizontally to width
-  //     offsetX: int => draws at a x offset
+  * @property {Integer} opts.scaleHeight int => scales vertically to height
-  //     offsetY: int => draws at a y offset
+  * @property {module:canvg.ForceRedraw} opts.forceRedraw function => will call the function on every frame, if it returns true, will redraw
-  //     scaleWidth: int => scales horizontally to width
+  * @property {boolean} opts.log Adds log function
-  //     scaleHeight: int => scales vertically to height
+  * @property {boolean} opts.useCORS Whether to set CORS `crossOrigin` for the image to `Anonymous`
-  //     forceRedraw: function => will call the function on every frame, if it returns true, will redraw
+  */
-  // returns all the function after the first render is completed with dom
+
+  /**
+  * 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
+  * @param {module:canvg.CanvgOptions} [opts] Optional hash of options
+  * @returns {Promise} All the function after the first render is completed with dom
+  */
   var canvg = function canvg(target, s, opts) {
     // no parameters
     if (target == null && s == null && opts == null) {
@@ -494,6 +878,11 @@ var svgEditorExtension_server_moinsave = (function () {
     return svg.load(ctx, s);
   };
 
+  /**
+  * @param {module:canvg.CanvgOptions} opts
+  * @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) {
     var svg = { opts: opts };
 
@@ -3632,16 +4021,17 @@ var svgEditorExtension_server_moinsave = (function () {
       createClass(_class46, [{
         key: 'apply',
         value: function apply(ctx, x, y, width, height) {
-          if (typeof stackBlurCanvasRGBA === 'undefined') {
+          if (typeof canvasRGBA_ === 'undefined') {
             svg.log('ERROR: `setStackBlurCanvasRGBA` must be run for blur to work');
             return;
           }
 
+          // Todo: This might not be a problem anymore with out `instanceof` fix
           // StackBlur requires canvas be on document
           ctx.canvas.id = svg.UniqueId();
           ctx.canvas.style.display = 'none';
           document.body.append(ctx.canvas);
-          stackBlurCanvasRGBA(ctx.canvas.id, x, y, width, height, this.blurRadius);
+          canvasRGBA_(ctx.canvas.id, x, y, width, height, this.blurRadius);
           ctx.canvas.remove();
         }
       }]);
@@ -3990,21 +4380,33 @@ var svgEditorExtension_server_moinsave = (function () {
   /* globals jQuery */
 
   var extServer_moinsave = {
-    name: 'server_opensave',
+    name: 'server_moinsave',
-    callback: function callback(_ref) {
+    init: function () {
-      var encode64 = _ref.encode64;
+      var _ref2 = asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee2(_ref) {
+        var encode64 = _ref.encode64,
+            importLocale = _ref.importLocale;
+        var strings, svgEditor, $, svgCanvas, saveSvgAction;
+        return regeneratorRuntime.wrap(function _callee2$(_context2) {
+          while (1) {
+            switch (_context2.prev = _context2.next) {
+              case 0:
+                _context2.next = 2;
+                return importLocale();
 
-      var svgEditor = this;
+              case 2:
-      var $ = jQuery;
+                strings = _context2.sent;
-      var svgCanvas = svgEditor.canvas;
+                svgEditor = this;
-      var saveSvgAction = '/+modify';
+                $ = jQuery;
+                svgCanvas = svgEditor.canvas;
+                saveSvgAction = '/+modify';
 
                 // Create upload target (hidden iframe)
-      /* const target = */$('<iframe name="output_frame" src="#"/>').hide().appendTo('body');
+                /* const target = */
+                $('<iframe name="output_frame" src="#"/>').hide().appendTo('body');
 
                 svgEditor.setCustomHandlers({
                   save: function () {
-          var _ref2 = asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee(win, data) {
+                    var _ref3 = asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee(win, data) {
                       var svg, qstr, name, svgData, c, datauri, pngData;
                       return regeneratorRuntime.wrap(function _callee$(_context) {
                         while (1) {
@@ -4036,7 +4438,7 @@ var svgEditorExtension_server_moinsave = (function () {
                                 action: saveSvgAction + '/' + name,
                                 target: 'output_frame'
                               }).append('<input type="hidden" name="png_data" value="' + pngData + '">').append('<input type="hidden" name="filepath" value="' + svgData + '">').append('<input type="hidden" name="filename" value="' + 'drawing.svg">').append('<input type="hidden" name="contenttype" value="application/x-svgdraw">').appendTo('body').submit().remove();
-                    alert('Saved! Return to Item View!');
+                              alert(strings.saved);
                               top.window.location = '/' + name;
 
                             case 15:
@@ -4047,14 +4449,28 @@ var svgEditorExtension_server_moinsave = (function () {
                       }, _callee, this);
                     }));
 
-          function save(_x, _x2) {
+                    function save(_x2, _x3) {
-            return _ref2.apply(this, arguments);
+                      return _ref3.apply(this, arguments);
                     }
 
                     return save;
                   }()
                 });
+
+              case 9:
+              case 'end':
+                return _context2.stop();
             }
+          }
+        }, _callee2, this);
+      }));
+
+      function init(_x) {
+        return _ref2.apply(this, arguments);
+      }
+
+      return init;
+    }()
   };
 
   return extServer_moinsave;

dist/extensions/ext-server_opensave.js

@@ -151,6 +151,13 @@ var svgEditorExtension_server_opensave = (function () {
     }
   };
 
+  /**
+   * For parsing color values
+   * @module RGBColor
+   * @author Stoyan Stefanov <sstoo@gmail.com>
+   * @see https://www.phpied.com/rgb-color-parser-in-javascript/
+   * @license MIT
+  */
   var simpleColors = {
     aliceblue: 'f0f8ff',
     antiquewhite: 'faebd7',
@@ -320,12 +327,12 @@ var svgEditorExtension_server_opensave = (function () {
 
   /**
    * A class to parse color values
-   * @author Stoyan Stefanov <sstoo@gmail.com>
-   * @link   https://www.phpied.com/rgb-color-parser-in-javascript/
-   * @license MIT
    */
 
   var RGBColor = function () {
+    /**
+    * @param {string} colorString
+    */
     function RGBColor(colorString) {
       classCallCheck(this, RGBColor);
 
@@ -372,6 +379,9 @@ var svgEditorExtension_server_opensave = (function () {
     }
 
     // some getters
+    /**
+    * @returns {string}
+    */
 
 
     createClass(RGBColor, [{
@@ -379,6 +389,11 @@ var svgEditorExtension_server_opensave = (function () {
       value: function toRGB() {
         return 'rgb(' + this.r + ', ' + this.g + ', ' + this.b + ')';
       }
+
+      /**
+      * @returns {string}
+      */
+
     }, {
       key: 'toHex',
       value: function toHex() {
@@ -397,7 +412,10 @@ var svgEditorExtension_server_opensave = (function () {
         return '#' + r + g + b;
       }
 
-      // help
+      /**
+      * help
+      * @returns {HTMLUListElement}
+      */
 
     }, {
       key: 'getHelpXML',
@@ -434,25 +452,391 @@ var svgEditorExtension_server_opensave = (function () {
     return RGBColor;
   }();
 
+  /**
+  * StackBlur - a fast almost Gaussian Blur For Canvas
+
+  In case you find this class useful - especially in commercial projects -
+  I am not totally unhappy for a small donation to my PayPal account
+  mario@quasimondo.de
+
+  Or support me on flattr:
+  https://flattr.com/thing/72791/StackBlur-a-fast-almost-Gaussian-Blur-Effect-for-CanvasJavascript
+
+  * @module StackBlur
+  * @version 0.5
+  * @author Mario Klingemann
+  Contact: mario@quasimondo.com
+  Website: http://www.quasimondo.com/StackBlurForCanvas/StackBlurDemo.html
+  Twitter: @quasimondo
+
+  * @copyright (c) 2010 Mario Klingemann
+
+  Permission is hereby granted, free of charge, to any person
+  obtaining a copy of this software and associated documentation
+  files (the "Software"), to deal in the Software without
+  restriction, including without limitation the rights to use,
+  copy, modify, merge, publish, distribute, sublicense, and/or sell
+  copies of the Software, and to permit persons to whom the
+  Software is furnished to do so, subject to the following
+  conditions:
+
+  The above copyright notice and this permission notice shall be
+  included in all copies or substantial portions of the Software.
+
+  THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
+  EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES
+  OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
+  NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT
+  HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY,
+  WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING
+  FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR
+  OTHER DEALINGS IN THE SOFTWARE.
+  */
+
+  var mulTable = [512, 512, 456, 512, 328, 456, 335, 512, 405, 328, 271, 456, 388, 335, 292, 512, 454, 405, 364, 328, 298, 271, 496, 456, 420, 388, 360, 335, 312, 292, 273, 512, 482, 454, 428, 405, 383, 364, 345, 328, 312, 298, 284, 271, 259, 496, 475, 456, 437, 420, 404, 388, 374, 360, 347, 335, 323, 312, 302, 292, 282, 273, 265, 512, 497, 482, 468, 454, 441, 428, 417, 405, 394, 383, 373, 364, 354, 345, 337, 328, 320, 312, 305, 298, 291, 284, 278, 271, 265, 259, 507, 496, 485, 475, 465, 456, 446, 437, 428, 420, 412, 404, 396, 388, 381, 374, 367, 360, 354, 347, 341, 335, 329, 323, 318, 312, 307, 302, 297, 292, 287, 282, 278, 273, 269, 265, 261, 512, 505, 497, 489, 482, 475, 468, 461, 454, 447, 441, 435, 428, 422, 417, 411, 405, 399, 394, 389, 383, 378, 373, 368, 364, 359, 354, 350, 345, 341, 337, 332, 328, 324, 320, 316, 312, 309, 305, 301, 298, 294, 291, 287, 284, 281, 278, 274, 271, 268, 265, 262, 259, 257, 507, 501, 496, 491, 485, 480, 475, 470, 465, 460, 456, 451, 446, 442, 437, 433, 428, 424, 420, 416, 412, 408, 404, 400, 396, 392, 388, 385, 381, 377, 374, 370, 367, 363, 360, 357, 354, 350, 347, 344, 341, 338, 335, 332, 329, 326, 323, 320, 318, 315, 312, 310, 307, 304, 302, 299, 297, 294, 292, 289, 287, 285, 282, 280, 278, 275, 273, 271, 269, 267, 265, 263, 261, 259];
+
+  var shgTable = [9, 11, 12, 13, 13, 14, 14, 15, 15, 15, 15, 16, 16, 16, 16, 17, 17, 17, 17, 17, 17, 17, 18, 18, 18, 18, 18, 18, 18, 18, 18, 19, 19, 19, 19, 19, 19, 19, 19, 19, 19, 19, 19, 19, 19, 20, 20, 20, 20, 20, 20, 20, 20, 20, 20, 20, 20, 20, 20, 20, 20, 20, 20, 21, 21, 21, 21, 21, 21, 21, 21, 21, 21, 21, 21, 21, 21, 21, 21, 21, 21, 21, 21, 21, 21, 21, 21, 21, 21, 21, 22, 22, 22, 22, 22, 22, 22, 22, 22, 22, 22, 22, 22, 22, 22, 22, 22, 22, 22, 22, 22, 22, 22, 22, 22, 22, 22, 22, 22, 22, 22, 22, 22, 22, 22, 22, 22, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24];
+
+  /**
+   * @param {string|HTMLCanvasElement} canvas
+   * @param {Integer} topX
+   * @param {Integer} topY
+   * @param {Integer} width
+   * @param {Integer} height
+   * @throws {Error}
+   * @returns {ImageData} See {@link https://html.spec.whatwg.org/multipage/canvas.html#imagedata}
+   */
+  function getImageDataFromCanvas(canvas, topX, topY, width, height) {
+    if (typeof canvas === 'string') {
+      canvas = document.getElementById(canvas);
+    }
+    if (!canvas || !('getContext' in canvas)) {
+      return;
+    }
+
+    var context = canvas.getContext('2d');
+
+    try {
+      return context.getImageData(topX, topY, width, height);
+    } catch (e) {
+      throw new Error('unable to access image data: ' + e);
+    }
+  }
+
+  /**
+   * @param {HTMLCanvasElement} canvas
+   * @param {Integer} topX
+   * @param {Integer} topY
+   * @param {Integer} width
+   * @param {Integer} height
+   * @param {Float} radius
+   * @returns {undefined}
+   */
+  function processCanvasRGBA(canvas, topX, topY, width, height, radius) {
+    if (isNaN(radius) || radius < 1) {
+      return;
+    }
+    radius |= 0;
+
+    var imageData = getImageDataFromCanvas(canvas, topX, topY, width, height);
+
+    imageData = processImageDataRGBA(imageData, topX, topY, width, height, radius);
+
+    canvas.getContext('2d').putImageData(imageData, topX, topY);
+  }
+
+  /**
+   * @param {ImageData} imageData
+   * @param {Integer} topX
+   * @param {Integer} topY
+   * @param {Integer} width
+   * @param {Integer} height
+   * @param {Float} radius
+   * @returns {ImageData}
+   */
+  function processImageDataRGBA(imageData, topX, topY, width, height, radius) {
+    var pixels = imageData.data;
+
+    var x = void 0,
+        y = void 0,
+        i = void 0,
+        p = void 0,
+        yp = void 0,
+        yi = void 0,
+        yw = void 0,
+        rSum = void 0,
+        gSum = void 0,
+        bSum = void 0,
+        aSum = void 0,
+        rOutSum = void 0,
+        gOutSum = void 0,
+        bOutSum = void 0,
+        aOutSum = void 0,
+        rInSum = void 0,
+        gInSum = void 0,
+        bInSum = void 0,
+        aInSum = void 0,
+        pr = void 0,
+        pg = void 0,
+        pb = void 0,
+        pa = void 0,
+        rbs = void 0;
+
+    var div = radius + radius + 1;
+    // const w4 = width << 2;
+    var widthMinus1 = width - 1;
+    var heightMinus1 = height - 1;
+    var radiusPlus1 = radius + 1;
+    var sumFactor = radiusPlus1 * (radiusPlus1 + 1) / 2;
+
+    var stackStart = new BlurStack();
+    var stack = stackStart;
+    var stackEnd = void 0;
+    for (i = 1; i < div; i++) {
+      stack = stack.next = new BlurStack();
+      if (i === radiusPlus1) {
+        stackEnd = stack;
+      }
+    }
+    stack.next = stackStart;
+    var stackIn = null;
+    var stackOut = null;
+
+    yw = yi = 0;
+
+    var mulSum = mulTable[radius];
+    var shgSum = shgTable[radius];
+
+    for (y = 0; y < height; y++) {
+      rInSum = gInSum = bInSum = aInSum = rSum = gSum = bSum = aSum = 0;
+
+      rOutSum = radiusPlus1 * (pr = pixels[yi]);
+      gOutSum = radiusPlus1 * (pg = pixels[yi + 1]);
+      bOutSum = radiusPlus1 * (pb = pixels[yi + 2]);
+      aOutSum = radiusPlus1 * (pa = pixels[yi + 3]);
+
+      rSum += sumFactor * pr;
+      gSum += sumFactor * pg;
+      bSum += sumFactor * pb;
+      aSum += sumFactor * pa;
+
+      stack = stackStart;
+
+      for (i = 0; i < radiusPlus1; i++) {
+        stack.r = pr;
+        stack.g = pg;
+        stack.b = pb;
+        stack.a = pa;
+        stack = stack.next;
+      }
+
+      for (i = 1; i < radiusPlus1; i++) {
+        p = yi + ((widthMinus1 < i ? widthMinus1 : i) << 2);
+        rSum += (stack.r = pr = pixels[p]) * (rbs = radiusPlus1 - i);
+        gSum += (stack.g = pg = pixels[p + 1]) * rbs;
+        bSum += (stack.b = pb = pixels[p + 2]) * rbs;
+        aSum += (stack.a = pa = pixels[p + 3]) * rbs;
+
+        rInSum += pr;
+        gInSum += pg;
+        bInSum += pb;
+        aInSum += pa;
+
+        stack = stack.next;
+      }
+
+      stackIn = stackStart;
+      stackOut = stackEnd;
+      for (x = 0; x < width; x++) {
+        pixels[yi + 3] = pa = aSum * mulSum >> shgSum;
+        if (pa !== 0) {
+          pa = 255 / pa;
+          pixels[yi] = (rSum * mulSum >> shgSum) * pa;
+          pixels[yi + 1] = (gSum * mulSum >> shgSum) * pa;
+          pixels[yi + 2] = (bSum * mulSum >> shgSum) * pa;
+        } else {
+          pixels[yi] = pixels[yi + 1] = pixels[yi + 2] = 0;
+        }
+
+        rSum -= rOutSum;
+        gSum -= gOutSum;
+        bSum -= bOutSum;
+        aSum -= aOutSum;
+
+        rOutSum -= stackIn.r;
+        gOutSum -= stackIn.g;
+        bOutSum -= stackIn.b;
+        aOutSum -= stackIn.a;
+
+        p = yw + ((p = x + radius + 1) < widthMinus1 ? p : widthMinus1) << 2;
+
+        rInSum += stackIn.r = pixels[p];
+        gInSum += stackIn.g = pixels[p + 1];
+        bInSum += stackIn.b = pixels[p + 2];
+        aInSum += stackIn.a = pixels[p + 3];
+
+        rSum += rInSum;
+        gSum += gInSum;
+        bSum += bInSum;
+        aSum += aInSum;
+
+        stackIn = stackIn.next;
+
+        rOutSum += pr = stackOut.r;
+        gOutSum += pg = stackOut.g;
+        bOutSum += pb = stackOut.b;
+        aOutSum += pa = stackOut.a;
+
+        rInSum -= pr;
+        gInSum -= pg;
+        bInSum -= pb;
+        aInSum -= pa;
+
+        stackOut = stackOut.next;
+
+        yi += 4;
+      }
+      yw += width;
+    }
+
+    for (x = 0; x < width; x++) {
+      gInSum = bInSum = aInSum = rInSum = gSum = bSum = aSum = rSum = 0;
+
+      yi = x << 2;
+      rOutSum = radiusPlus1 * (pr = pixels[yi]);
+      gOutSum = radiusPlus1 * (pg = pixels[yi + 1]);
+      bOutSum = radiusPlus1 * (pb = pixels[yi + 2]);
+      aOutSum = radiusPlus1 * (pa = pixels[yi + 3]);
+
+      rSum += sumFactor * pr;
+      gSum += sumFactor * pg;
+      bSum += sumFactor * pb;
+      aSum += sumFactor * pa;
+
+      stack = stackStart;
+
+      for (i = 0; i < radiusPlus1; i++) {
+        stack.r = pr;
+        stack.g = pg;
+        stack.b = pb;
+        stack.a = pa;
+        stack = stack.next;
+      }
+
+      yp = width;
+
+      for (i = 1; i <= radius; i++) {
+        yi = yp + x << 2;
+
+        rSum += (stack.r = pr = pixels[yi]) * (rbs = radiusPlus1 - i);
+        gSum += (stack.g = pg = pixels[yi + 1]) * rbs;
+        bSum += (stack.b = pb = pixels[yi + 2]) * rbs;
+        aSum += (stack.a = pa = pixels[yi + 3]) * rbs;
+
+        rInSum += pr;
+        gInSum += pg;
+        bInSum += pb;
+        aInSum += pa;
+
+        stack = stack.next;
+
+        if (i < heightMinus1) {
+          yp += width;
+        }
+      }
+
+      yi = x;
+      stackIn = stackStart;
+      stackOut = stackEnd;
+      for (y = 0; y < height; y++) {
+        p = yi << 2;
+        pixels[p + 3] = pa = aSum * mulSum >> shgSum;
+        if (pa > 0) {
+          pa = 255 / pa;
+          pixels[p] = (rSum * mulSum >> shgSum) * pa;
+          pixels[p + 1] = (gSum * mulSum >> shgSum) * pa;
+          pixels[p + 2] = (bSum * mulSum >> shgSum) * pa;
+        } else {
+          pixels[p] = pixels[p + 1] = pixels[p + 2] = 0;
+        }
+
+        rSum -= rOutSum;
+        gSum -= gOutSum;
+        bSum -= bOutSum;
+        aSum -= aOutSum;
+
+        rOutSum -= stackIn.r;
+        gOutSum -= stackIn.g;
+        bOutSum -= stackIn.b;
+        aOutSum -= stackIn.a;
+
+        p = x + ((p = y + radiusPlus1) < heightMinus1 ? p : heightMinus1) * width << 2;
+
+        rSum += rInSum += stackIn.r = pixels[p];
+        gSum += gInSum += stackIn.g = pixels[p + 1];
+        bSum += bInSum += stackIn.b = pixels[p + 2];
+        aSum += aInSum += stackIn.a = pixels[p + 3];
+
+        stackIn = stackIn.next;
+
+        rOutSum += pr = stackOut.r;
+        gOutSum += pg = stackOut.g;
+        bOutSum += pb = stackOut.b;
+        aOutSum += pa = stackOut.a;
+
+        rInSum -= pr;
+        gInSum -= pg;
+        bInSum -= pb;
+        aInSum -= pa;
+
+        stackOut = stackOut.next;
+
+        yi += width;
+      }
+    }
+    return imageData;
+  }
+
+  /**
+   *
+   */
+  var BlurStack = function BlurStack() {
+    classCallCheck(this, BlurStack);
+
+    this.r = 0;
+    this.g = 0;
+    this.b = 0;
+    this.a = 0;
+    this.next = null;
+  };
+
   /* eslint-disable new-cap */
 
-  var stackBlurCanvasRGBA = void 0;
+  var canvasRGBA_ = processCanvasRGBA;
 
-  // canvg(target, s)
+  /**
-  // empty parameters: replace all 'svg' elements on page with 'canvas' elements
+  * @typedef {PlainObject} module:canvg.CanvgOptions
-  // target: canvas element or the id of a canvas element
+  * @property {boolean} opts.ignoreMouse true => ignore mouse events
-  // s: svg string, url to svg file, or xml document
+  * @property {boolean} opts.ignoreAnimation true => ignore animations
-  // opts: optional hash of options
+  * @property {boolean} opts.ignoreDimensions true => does not try to resize canvas
-  //     ignoreMouse: true => ignore mouse events
+  * @property {boolean} opts.ignoreClear true => does not clear canvas
-  //     ignoreAnimation: true => ignore animations
+  * @property {Integer} opts.offsetX int => draws at a x offset
-  //     ignoreDimensions: true => does not try to resize canvas
+  * @property {Integer} opts.offsetY int => draws at a y offset
-  //     ignoreClear: true => does not clear canvas
+  * @property {Integer} opts.scaleWidth int => scales horizontally to width
-  //     offsetX: int => draws at a x offset
+  * @property {Integer} opts.scaleHeight int => scales vertically to height
-  //     offsetY: int => draws at a y offset
+  * @property {module:canvg.ForceRedraw} opts.forceRedraw function => will call the function on every frame, if it returns true, will redraw
-  //     scaleWidth: int => scales horizontally to width
+  * @property {boolean} opts.log Adds log function
-  //     scaleHeight: int => scales vertically to height
+  * @property {boolean} opts.useCORS Whether to set CORS `crossOrigin` for the image to `Anonymous`
-  //     forceRedraw: function => will call the function on every frame, if it returns true, will redraw
+  */
-  // returns all the function after the first render is completed with dom
+
+  /**
+  * 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
+  * @param {module:canvg.CanvgOptions} [opts] Optional hash of options
+  * @returns {Promise} All the function after the first render is completed with dom
+  */
   var canvg = function canvg(target, s, opts) {
     // no parameters
     if (target == null && s == null && opts == null) {
@@ -494,6 +878,11 @@ var svgEditorExtension_server_opensave = (function () {
     return svg.load(ctx, s);
   };
 
+  /**
+  * @param {module:canvg.CanvgOptions} opts
+  * @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) {
     var svg = { opts: opts };
 
@@ -3632,16 +4021,17 @@ var svgEditorExtension_server_opensave = (function () {
       createClass(_class46, [{
         key: 'apply',
         value: function apply(ctx, x, y, width, height) {
-          if (typeof stackBlurCanvasRGBA === 'undefined') {
+          if (typeof canvasRGBA_ === 'undefined') {
             svg.log('ERROR: `setStackBlurCanvasRGBA` must be run for blur to work');
             return;
           }
 
+          // Todo: This might not be a problem anymore with out `instanceof` fix
           // StackBlur requires canvas be on document
           ctx.canvas.id = svg.UniqueId();
           ctx.canvas.style.display = 'none';
           document.body.append(ctx.canvas);
-          stackBlurCanvasRGBA(ctx.canvas.id, x, y, width, height, this.blurRadius);
+          canvasRGBA_(ctx.canvas.id, x, y, width, height, this.blurRadius);
           ctx.canvas.remove();
         }
       }]);
@@ -3991,22 +4381,51 @@ var svgEditorExtension_server_opensave = (function () {
 
   var extServer_opensave = {
     name: 'server_opensave',
-    callback: function callback(_ref) {
+    init: function () {
+      var _ref2 = asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee2(_ref) {
         var decode64 = _ref.decode64,
-          encode64 = _ref.encode64;
+            encode64 = _ref.encode64,
+            importLocale = _ref.importLocale;
+        var strings, svgEditor, $, svgCanvas, getFileNameFromTitle, xhtmlEscape, clientDownloadSupport, saveSvgAction, saveImgAction, cancelled, openSvgAction, importSvgAction, importImgAction, openSvgForm, importSvgForm, importImgForm, rebuildInput;
+        return regeneratorRuntime.wrap(function _callee2$(_context2) {
+          while (1) {
+            switch (_context2.prev = _context2.next) {
+              case 0:
+                rebuildInput = function rebuildInput(form) {
+                  form.empty();
+                  var inp = $('<input type="file" name="svg_file">').appendTo(form);
 
-      var svgEditor = this;
+                  function submit() {
-      var $ = jQuery;
+                    // This submits the form, which returns the file data using svgEditor.processFile()
-      var svgCanvas = svgEditor.canvas;
+                    form.submit();
-      function getFileNameFromTitle() {
+
-        var title = svgCanvas.getDocumentTitle();
+                    rebuildInput(form);
-        // We convert (to underscore) only those disallowed Win7 file name characters
+                    $.process_cancel(strings.uploading, function () {
-        return title.trim().replace(/[/\\:*?"<>|]/g, '_');
+                      cancelled = true;
+                      $('#dialog_box').hide();
+                    });
                   }
-      function xhtmlEscape(str) {
+
-        return str.replace(/&(?!amp;)/g, '&amp;').replace(/"/g, '&quot;').replace(/</g, '&lt;'); // < is actually disallowed above anyways
+                  if (form[0] === openSvgForm[0]) {
+                    inp.change(function () {
+                      // This takes care of the "are you sure" dialog box
+                      svgEditor.openPrep(function (ok) {
+                        if (!ok) {
+                          rebuildInput(form);
+                          return;
                         }
-      function clientDownloadSupport(filename, suffix, uri) {
+                        submit();
+                      });
+                    });
+                  } else {
+                    inp.change(function () {
+                      // This submits the form, which returns the file data using svgEditor.processFile()
+                      submit();
+                    });
+                  }
+                };
+
+                clientDownloadSupport = function clientDownloadSupport(filename, suffix, uri) {
                   var support = $('<a>')[0].download === '';
                   var a = void 0;
                   if (support) {
@@ -4017,12 +4436,31 @@ var svgEditorExtension_server_opensave = (function () {
                     a[0].click();
                     return true;
                   }
-      }
+                };
-      var saveSvgAction = svgEditor.curConfig.extPath + 'filesave.php',
+
-          saveImgAction = svgEditor.curConfig.extPath + 'filesave.php';
+                xhtmlEscape = function xhtmlEscape(str) {
+                  return str.replace(/&(?!amp;)/g, '&amp;').replace(/"/g, '&quot;').replace(/</g, '&lt;'); // < is actually disallowed above anyways
+                };
+
+                getFileNameFromTitle = function getFileNameFromTitle() {
+                  var title = svgCanvas.getDocumentTitle();
+                  // We convert (to underscore) only those disallowed Win7 file name characters
+                  return title.trim().replace(/[/\\:*?"<>|]/g, '_');
+                };
+
+                _context2.next = 6;
+                return importLocale();
+
+              case 6:
+                strings = _context2.sent;
+                svgEditor = this;
+                $ = jQuery;
+                svgCanvas = svgEditor.canvas;
+                saveSvgAction = svgEditor.curConfig.extPath + 'filesave.php', saveImgAction = svgEditor.curConfig.extPath + 'filesave.php';
                 // Create upload target (hidden iframe)
 
-      var cancelled = false;
+                cancelled = false;
+
 
                 $('<iframe name="output_frame" src="#"/>').hide().appendTo('body');
                 svgEditor.setCustomHandlers({
@@ -4043,7 +4481,7 @@ var svgEditorExtension_server_opensave = (function () {
                   },
                   exportPDF: function exportPDF(win, data) {
                     var filename = getFileNameFromTitle(),
-              datauri = data.dataurlstring;
+                        datauri = data.output;
                     if (clientDownloadSupport(filename, '.pdf', datauri)) {
                       return;
                     }
@@ -4056,7 +4494,7 @@ var svgEditorExtension_server_opensave = (function () {
 
                   // Todo: Integrate this extension with a new built-in exportWindowType, "download"
                   exportImage: function () {
-          var _ref2 = asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee(win, data) {
+                    var _ref3 = asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee(win, data) {
                       var issues, mimeType, quality, c, datauri, pre, note, filename, suffix;
                       return regeneratorRuntime.wrap(function _callee$(_context) {
                         while (1) {
@@ -4119,8 +4557,8 @@ var svgEditorExtension_server_opensave = (function () {
                       }, _callee, this);
                     }));
 
-          function exportImage(_x, _x2) {
+                    function exportImage(_x2, _x3) {
-            return _ref2.apply(this, arguments);
+                      return _ref3.apply(this, arguments);
                     }
 
                     return exportImage;
@@ -4128,16 +4566,23 @@ var svgEditorExtension_server_opensave = (function () {
                 });
 
                 // Do nothing if client support is found
-      if (window.FileReader) {
+
-        return;
+                if (!window.FileReader) {
+                  _context2.next = 16;
+                  break;
                 }
 
+                return _context2.abrupt('return');
+
+              case 16:
+
                 // Change these to appropriate script file
-      var openSvgAction = svgEditor.curConfig.extPath + 'fileopen.php?type=load_svg';
+                openSvgAction = svgEditor.curConfig.extPath + 'fileopen.php?type=load_svg';
-      var importSvgAction = svgEditor.curConfig.extPath + 'fileopen.php?type=import_svg';
+                importSvgAction = svgEditor.curConfig.extPath + 'fileopen.php?type=import_svg';
-      var importImgAction = svgEditor.curConfig.extPath + 'fileopen.php?type=import_img';
+                importImgAction = svgEditor.curConfig.extPath + 'fileopen.php?type=import_img';
 
                 // Set up function for PHP uploader to use
+
                 svgEditor.processFile = function (str64, type) {
                   var xmlstr = void 0;
                   if (cancelled) {
@@ -4168,7 +4613,8 @@ var svgEditorExtension_server_opensave = (function () {
                 };
 
                 // Create upload form
-      var openSvgForm = $('<form>');
+                openSvgForm = $('<form>');
+
                 openSvgForm.attr({
                   enctype: 'multipart/form-data',
                   method: 'post',
@@ -4177,46 +4623,14 @@ var svgEditorExtension_server_opensave = (function () {
                 });
 
                 // Create import form
-      var importSvgForm = openSvgForm.clone().attr('action', importSvgAction);
+                importSvgForm = openSvgForm.clone().attr('action', importSvgAction);
 
                 // Create image form
-      var importImgForm = openSvgForm.clone().attr('action', importImgAction);
+
+                importImgForm = openSvgForm.clone().attr('action', importImgAction);
 
                 // It appears necessary to rebuild this input every time a file is
                 // selected so the same file can be picked and the change event can fire.
-      function rebuildInput(form) {
-        form.empty();
-        var inp = $('<input type="file" name="svg_file">').appendTo(form);
-
-        function submit() {
-          // This submits the form, which returns the file data using svgEditor.processFile()
-          form.submit();
-
-          rebuildInput(form);
-          $.process_cancel('Uploading...', function () {
-            cancelled = true;
-            $('#dialog_box').hide();
-          });
-        }
-
-        if (form[0] === openSvgForm[0]) {
-          inp.change(function () {
-            // This takes care of the "are you sure" dialog box
-            svgEditor.openPrep(function (ok) {
-              if (!ok) {
-                rebuildInput(form);
-                return;
-              }
-              submit();
-            });
-          });
-        } else {
-          inp.change(function () {
-            // This submits the form, which returns the file data using svgEditor.processFile()
-            submit();
-          });
-        }
-      }
 
                 // Create the input elements
                 rebuildInput(openSvgForm);
@@ -4227,7 +4641,21 @@ var svgEditorExtension_server_opensave = (function () {
                 $('#tool_open').show().prepend(openSvgForm);
                 $('#tool_import').show().prepend(importSvgForm);
                 $('#tool_image').prepend(importImgForm);
+
+              case 30:
+              case 'end':
+                return _context2.stop();
             }
+          }
+        }, _callee2, this);
+      }));
+
+      function init(_x) {
+        return _ref2.apply(this, arguments);
+      }
+
+      return init;
+    }()
   };
 
   return extServer_opensave;

dist/extensions/ext-shapes.js

@@ -1,44 +1,128 @@
 var svgEditorExtension_shapes = (function () {
   'use strict';
 
+  var asyncToGenerator = function (fn) {
+    return function () {
+      var gen = fn.apply(this, arguments);
+      return new Promise(function (resolve, reject) {
+        function step(key, arg) {
+          try {
+            var info = gen[key](arg);
+            var value = info.value;
+          } catch (error) {
+            reject(error);
+            return;
+          }
+
+          if (info.done) {
+            resolve(value);
+          } else {
+            return Promise.resolve(value).then(function (value) {
+              step("next", value);
+            }, function (err) {
+              step("throw", err);
+            });
+          }
+        }
+
+        return step("next");
+      });
+    };
+  };
+
   /* globals jQuery */
-  /*
+  /**
    * ext-shapes.js
    *
-   * Licensed under the MIT License
+   * @license MIT
    *
-   * Copyright(c) 2010 Christian Tzurcanu
+   * @copyright 2010 Christian Tzurcanu, 2010 Alexis Deveria
-   * Copyright(c) 2010 Alexis Deveria
    *
    */
   var extShapes = {
     name: 'shapes',
-    init: function init() {
+    init: function () {
-      var svgEditor = this;
+      var _ref2 = asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee(_ref) {
-      var $ = jQuery;
+        var importLocale = _ref.importLocale;
-      var canv = svgEditor.canvas;
+        var strings, svgEditor, $, canv, svgroot, lastBBox, categories, library, modeId, startClientPos, currentD, curShapeId, curShape, startX, startY, curLib, loadIcons, makeButtons, loadLibrary, buttons;
-      var svgroot = canv.getRootElem();
+        return regeneratorRuntime.wrap(function _callee$(_context) {
-      var lastBBox = {};
+          while (1) {
+            switch (_context.prev = _context.next) {
+              case 0:
+                loadLibrary = function loadLibrary(catId) {
+                  var lib = library[catId];
 
-      // This populates the category list
+                  if (!lib) {
-      var categories = {
+                    $('#shape_buttons').html(strings.loading);
-        basic: 'Basic',
+                    $.getJSON(svgEditor.curConfig.extIconsPath + 'shapelib/' + catId + '.json', function (result) {
-        object: 'Objects',
+                      curLib = library[catId] = {
-        symbol: 'Symbols',
+                        data: result.data,
-        arrow: 'Arrows',
+                        size: result.size,
-        flowchart: 'Flowchart',
+                        fill: result.fill
-        animal: 'Animals',
+                      };
-        game: 'Cards & Chess',
+                      makeButtons(catId, result);
-        dialog_balloon: 'Dialog balloons',
+                      loadIcons();
-        electronics: 'Electronics',
+                    });
-        math: 'Mathematical',
+                    return;
-        music: 'Music',
+                  }
-        misc: 'Miscellaneous',
+                  curLib = lib;
-        raphael_1: 'raphaeljs.com set 1',
+                  if (!lib.buttons.length) {
-        raphael_2: 'raphaeljs.com set 2'
+                    makeButtons(catId, lib);
+                  }
+                  loadIcons();
                 };
 
-      var library = {
+                makeButtons = function makeButtons(cat, shapes) {
+                  var size = curLib.size || 300;
+                  var fill = curLib.fill || false;
+                  var off = size * 0.05;
+                  var vb = [-off, -off, size + off * 2, size + off * 2].join(' ');
+                  var stroke = fill ? 0 : size / 30;
+                  var shapeIcon = new DOMParser().parseFromString('<svg xmlns="http://www.w3.org/2000/svg">' + '<svg viewBox="' + vb + '">' + '<path fill="' + (fill ? '#333' : 'none') + '" stroke="#000" stroke-width="' + stroke + '" /></svg></svg>', 'text/xml');
+
+                  var width = 24;
+                  var height = 24;
+                  shapeIcon.documentElement.setAttribute('width', width);
+                  shapeIcon.documentElement.setAttribute('height', height);
+                  var svgElem = $(document.importNode(shapeIcon.documentElement, true));
+
+                  var data = shapes.data;
+
+
+                  curLib.buttons = [];
+                  for (var id in data) {
+                    var pathD = data[id];
+                    var icon = svgElem.clone();
+                    icon.find('path').attr('d', pathD);
+
+                    var iconBtn = icon.wrap('<div class="tool_button">').parent().attr({
+                      id: modeId + '_' + id,
+                      title: id
+                    });
+                    // Store for later use
+                    curLib.buttons.push(iconBtn[0]);
+                  }
+                };
+
+                loadIcons = function loadIcons() {
+                  $('#shape_buttons').empty().append(curLib.buttons);
+                };
+
+                _context.next = 5;
+                return importLocale();
+
+              case 5:
+                strings = _context.sent;
+                svgEditor = this;
+                $ = jQuery;
+                canv = svgEditor.canvas;
+                svgroot = canv.getRootElem();
+                lastBBox = {};
+
+                // This populates the category list
+
+                categories = strings.categories;
+                library = {
                   basic: {
                     data: {
                       heart: 'm150,73c61,-175 300,0 0,225c-300,-225 -61,-400 0,-225z',
@@ -74,89 +158,25 @@ var svgEditorExtension_shapes = (function () {
                     buttons: []
                   }
                 };
-
+                modeId = 'shapelib';
-      var modeId = 'shapelib';
+                startClientPos = {};
-      var startClientPos = {};
+                currentD = void 0, curShapeId = void 0, curShape = void 0, startX = void 0, startY = void 0;
-
+                curLib = library.basic;
-      var currentD = void 0,
+                buttons = [{
-          curShapeId = void 0,
-          curShape = void 0,
-          startX = void 0,
-          startY = void 0;
-      var curLib = library.basic;
-
-      function loadIcons() {
-        $('#shape_buttons').empty().append(curLib.buttons);
-      }
-
-      function makeButtons(cat, shapes) {
-        var size = curLib.size || 300;
-        var fill = curLib.fill || false;
-        var off = size * 0.05;
-        var vb = [-off, -off, size + off * 2, size + off * 2].join(' ');
-        var stroke = fill ? 0 : size / 30;
-        var shapeIcon = new DOMParser().parseFromString('<svg xmlns="http://www.w3.org/2000/svg"><svg viewBox="' + vb + '"><path fill="' + (fill ? '#333' : 'none') + '" stroke="#000" stroke-width="' + stroke + '" /></svg></svg>', 'text/xml');
-
-        var width = 24;
-        var height = 24;
-        shapeIcon.documentElement.setAttribute('width', width);
-        shapeIcon.documentElement.setAttribute('height', height);
-        var svgElem = $(document.importNode(shapeIcon.documentElement, true));
-
-        var data = shapes.data;
-
-
-        curLib.buttons = [];
-        for (var id in data) {
-          var pathD = data[id];
-          var icon = svgElem.clone();
-          icon.find('path').attr('d', pathD);
-
-          var iconBtn = icon.wrap('<div class="tool_button">').parent().attr({
-            id: modeId + '_' + id,
-            title: id
-          });
-          // Store for later use
-          curLib.buttons.push(iconBtn[0]);
-        }
-      }
-
-      function loadLibrary(catId) {
-        var lib = library[catId];
-
-        if (!lib) {
-          $('#shape_buttons').html('Loading...');
-          $.getJSON(svgEditor.curConfig.extIconsPath + 'shapelib/' + catId + '.json', function (result) {
-            curLib = library[catId] = {
-              data: result.data,
-              size: result.size,
-              fill: result.fill
-            };
-            makeButtons(catId, result);
-            loadIcons();
-          });
-          return;
-        }
-        curLib = lib;
-        if (!lib.buttons.length) {
-          makeButtons(catId, lib);
-        }
-        loadIcons();
-      }
-
-      return {
-        svgicons: svgEditor.curConfig.extIconsPath + 'ext-shapes.xml',
-        buttons: [{
                   id: 'tool_shapelib',
                   type: 'mode_flyout', // _flyout
                   position: 6,
-          title: 'Shape library',
                   events: {
                     click: function click() {
                       canv.setMode(modeId);
                     }
                   }
-        }],
+                }];
+                return _context.abrupt('return', {
+                  svgicons: svgEditor.curConfig.extIconsPath + 'ext-shapes.xml',
+                  buttons: strings.buttons.map(function (button, i) {
+                    return Object.assign(buttons[i], button);
+                  }),
                   callback: function callback() {
                     $('<style>').text('#shape_buttons {' + 'overflow: auto;' + 'width: 180px;' + 'max-height: 300px;' + 'display: table-cell;' + 'vertical-align: middle;' + '}' + '#shape_cats {' + 'min-width: 110px;' + 'display: table-cell;' + 'vertical-align: middle;' + 'height: 300px;' + '}' + '#shape_cats > div {' + 'line-height: 1em;' + 'padding: .5em;' + 'border:1px solid #B0B0B0;' + 'background: #E8E8E8;' + 'margin-bottom: -1px;' + '}' + '#shape_cats div:hover {' + 'background: #FFFFCC;' + '}' + '#shape_cats div.current {' + 'font-weight: bold;' + '}').appendTo('head');
 
@@ -234,7 +254,7 @@ var svgEditorExtension_shapes = (function () {
                     startClientPos.x = opts.event.clientX;
                     startClientPos.y = opts.event.clientY;
 
-          curShape = canv.addSvgElementFromJson({
+                    curShape = canv.addSVGElementFromJson({
                       element: 'path',
                       curStyles: true,
                       attr: {
@@ -345,8 +365,22 @@ var svgEditorExtension_shapes = (function () {
                       started: false
                     };
                   }
-      };
+                });
+
+              case 19:
+              case 'end':
+                return _context.stop();
             }
+          }
+        }, _callee, this);
+      }));
+
+      function init(_x) {
+        return _ref2.apply(this, arguments);
+      }
+
+      return init;
+    }()
   };
 
   return extShapes;

dist/extensions/ext-star.js

@@ -1,53 +1,83 @@
 var svgEditorExtension_star = (function () {
   'use strict';
 
+  var asyncToGenerator = function (fn) {
+    return function () {
+      var gen = fn.apply(this, arguments);
+      return new Promise(function (resolve, reject) {
+        function step(key, arg) {
+          try {
+            var info = gen[key](arg);
+            var value = info.value;
+          } catch (error) {
+            reject(error);
+            return;
+          }
+
+          if (info.done) {
+            resolve(value);
+          } else {
+            return Promise.resolve(value).then(function (value) {
+              step("next", value);
+            }, function (err) {
+              step("throw", err);
+            });
+          }
+        }
+
+        return step("next");
+      });
+    };
+  };
+
   /* globals jQuery */
-  /*
+  /**
    * ext-star.js
    *
    *
-   * Copyright(c) 2010 CloudCanvas, Inc.
+   * @copyright 2010 CloudCanvas, Inc. All rights reserved
-   * All rights reserved
    *
    */
   var extStar = {
     name: 'star',
-    init: function init(S) {
+    init: function () {
-      var svgEditor = this;
+      var _ref = asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee(S) {
-      var $ = jQuery;
+        var svgEditor, $, svgCanvas, importLocale, selElems, started, newFO, strings, showPanel, setAttr, buttons, contextTools;
-      var svgCanvas = svgEditor.canvas;
+        return regeneratorRuntime.wrap(function _callee$(_context) {
+          while (1) {
+            switch (_context.prev = _context.next) {
+              case 0:
+                setAttr = function setAttr(attr, val) {
+                  svgCanvas.changeSelectedAttribute(attr, val);
+                  S.call('changed', selElems);
+                };
 
-      var // {svgcontent} = S,
+                showPanel = function showPanel(on) {
-      selElems = void 0,
-
-      // editingitex = false,
-      // svgdoc = S.svgroot.parentNode.ownerDocument,
-      started = void 0,
-          newFO = void 0;
-      // edg = 0,
-      // newFOG, newFOGParent, newDef, newImageName, newMaskID,
-      // undoCommand = 'Not image',
-      // modeChangeG, ccZoom, wEl, hEl, wOffset, hOffset, ccRgbEl, brushW, brushH;
-
-      function showPanel(on) {
                   var fcRules = $('#fc_rules');
                   if (!fcRules.length) {
                     fcRules = $('<style id="fc_rules"></style>').appendTo('head');
                   }
                   fcRules.text(!on ? '' : ' #tool_topath { display: none !important; }');
                   $('#star_panel').toggle(on);
-      }
+                };
 
-      /*
+                svgEditor = this;
-      function toggleSourceButtons(on){
+                $ = jQuery;
-        $('#star_save, #star_cancel').toggle(on);
+                svgCanvas = svgEditor.canvas;
-      }
+                importLocale = S.importLocale; // {svgcontent},
-      */
+
+                selElems = void 0, started = void 0, newFO = void 0;
+                // edg = 0,
+                // newFOG, newFOGParent, newDef, newImageName, newMaskID,
+                // undoCommand = 'Not image',
+                // modeChangeG, ccZoom, wEl, hEl, wOffset, hOffset, ccRgbEl, brushW, brushH;
+
+                _context.next = 9;
+                return importLocale();
+
+              case 9:
+                strings = _context.sent;
 
-      function setAttr(attr, val) {
-        svgCanvas.changeSelectedAttribute(attr, val);
-        S.call('changed', selElems);
-      }
 
                 /*
                 function cot(n){
@@ -57,14 +87,9 @@ var svgEditorExtension_star = (function () {
                   return 1 / Math.cos(n);
                 }
                 */
-
+                buttons = [{
-      return {
-        name: 'star',
-        svgicons: svgEditor.curConfig.extIconsPath + 'star-icons.svg',
-        buttons: [{
                   id: 'tool_star',
                   type: 'mode',
-          title: 'Star Tool',
                   position: 12,
                   events: {
                     click: function click() {
@@ -72,14 +97,11 @@ var svgEditorExtension_star = (function () {
                       svgCanvas.setMode('star');
                     }
                   }
-        }],
+                }];
-
+                contextTools = [{
-        context_tools: [{
                   type: 'input',
                   panel: 'star_panel',
-          title: 'Number of Sides',
                   id: 'starNumPoints',
-          label: 'points',
                   size: 3,
                   defval: 5,
                   events: {
@@ -90,17 +112,13 @@ var svgEditorExtension_star = (function () {
                 }, {
                   type: 'input',
                   panel: 'star_panel',
-          title: 'Pointiness',
                   id: 'starRadiusMulitplier',
-          label: 'Pointiness',
                   size: 3,
                   defval: 2.5
                 }, {
                   type: 'input',
                   panel: 'star_panel',
-          title: 'Twists the star',
                   id: 'radialShift',
-          label: 'Radial Shift',
                   size: 3,
                   defval: 0,
                   events: {
@@ -108,7 +126,16 @@ var svgEditorExtension_star = (function () {
                       setAttr('radialshift', this.value);
                     }
                   }
-        }],
+                }];
+                return _context.abrupt('return', {
+                  name: strings.name,
+                  svgicons: svgEditor.curConfig.extIconsPath + 'star-icons.svg',
+                  buttons: strings.buttons.map(function (button, i) {
+                    return Object.assign(buttons[i], button);
+                  }),
+                  context_tools: strings.contextTools.map(function (contextTool, i) {
+                    return Object.assign(contextTools[i], contextTool);
+                  }),
                   callback: function callback() {
                     $('#star_panel').hide();
                     // const endChanges = function(){};
@@ -123,7 +150,7 @@ var svgEditorExtension_star = (function () {
                     if (svgCanvas.getMode() === 'star') {
                       started = true;
 
-            newFO = S.addSvgElementFromJson({
+                      newFO = S.addSVGElementFromJson({
                         element: 'polygon',
                         attr: {
                           cx: opts.start_x,
@@ -242,8 +269,22 @@ var svgEditorExtension_star = (function () {
                   elementChanged: function elementChanged(opts) {
                     // const elem = opts.elems[0];
                   }
-      };
+                });
+
+              case 13:
+              case 'end':
+                return _context.stop();
             }
+          }
+        }, _callee, this);
+      }));
+
+      function init(_x) {
+        return _ref.apply(this, arguments);
+      }
+
+      return init;
+    }()
   };
 
   return extStar;

dist/extensions/ext-storage.js

@@ -30,174 +30,29 @@ var svgEditorExtension_storage = (function () {
     };
   };
 
-  var _extends = Object.assign || function (target) {
-    for (var i = 1; i < arguments.length; i++) {
-      var source = arguments[i];
-
-      for (var key in source) {
-        if (Object.prototype.hasOwnProperty.call(source, key)) {
-          target[key] = source[key];
-        }
-      }
-    }
-
-    return target;
-  };
-
-  // MIT License
-  // From: https://github.com/uupaa/dynamic-import-polyfill/blob/master/importModule.js
-
-  function toAbsoluteURL(url) {
-    var a = document.createElement('a');
-    a.setAttribute('href', url); // <a href="hoge.html">
-    return a.cloneNode(false).href; // -> "http://example.com/hoge.html"
-  }
-
-  function addScriptAtts(script, atts) {
-    ['id', 'class', 'type'].forEach(function (prop) {
-      if (prop in atts) {
-        script[prop] = atts[prop];
-      }
-    });
-  }
-
-  // Additions by Brett
-  var importSetGlobalDefault = function () {
-    var _ref = asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee(url, config) {
-      return regeneratorRuntime.wrap(function _callee$(_context) {
-        while (1) {
-          switch (_context.prev = _context.next) {
-            case 0:
-              return _context.abrupt('return', importSetGlobal(url, _extends({}, config, { returnDefault: true })));
-
-            case 1:
-            case 'end':
-              return _context.stop();
-          }
-        }
-      }, _callee, this);
-    }));
-
-    return function importSetGlobalDefault(_x, _x2) {
-      return _ref.apply(this, arguments);
-    };
-  }();
-  var importSetGlobal = function () {
-    var _ref3 = asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee2(url, _ref2) {
-      var global = _ref2.global,
-          returnDefault = _ref2.returnDefault;
-      var modularVersion;
-      return regeneratorRuntime.wrap(function _callee2$(_context2) {
-        while (1) {
-          switch (_context2.prev = _context2.next) {
-            case 0:
-              // Todo: Replace calls to this function with `import()` when supported
-              modularVersion = !('svgEditor' in window) || !window.svgEditor || window.svgEditor.modules !== false;
-
-              if (!modularVersion) {
-                _context2.next = 3;
-                break;
-              }
-
-              return _context2.abrupt('return', importModule(url, undefined, { returnDefault: returnDefault }));
-
-            case 3:
-              _context2.next = 5;
-              return importScript(url);
-
-            case 5:
-              return _context2.abrupt('return', window[global]);
-
-            case 6:
-            case 'end':
-              return _context2.stop();
-          }
-        }
-      }, _callee2, this);
-    }));
-
-    return function importSetGlobal(_x3, _x4) {
-      return _ref3.apply(this, arguments);
-    };
-  }();
-  // Addition by Brett
-  function importScript(url) {
-    var atts = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
-
-    if (Array.isArray(url)) {
-      return Promise.all(url.map(function (u) {
-        return importScript(u, atts);
-      }));
-    }
-    return new Promise(function (resolve, reject) {
-      var script = document.createElement('script');
-      var destructor = function destructor() {
-        script.onerror = null;
-        script.onload = null;
-        script.remove();
-        script.src = '';
-      };
-      script.defer = 'defer';
-      addScriptAtts(script, atts);
-      script.onerror = function () {
-        reject(new Error('Failed to import: ' + url));
-        destructor();
-      };
-      script.onload = function () {
-        resolve();
-        destructor();
-      };
-      script.src = url;
-
-      document.head.append(script);
-    });
-  }
-
-  function importModule(url) {
-    var atts = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
-
-    var _ref4 = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {},
-        _ref4$returnDefault = _ref4.returnDefault,
-        returnDefault = _ref4$returnDefault === undefined ? false : _ref4$returnDefault;
-
-    if (Array.isArray(url)) {
-      return Promise.all(url.map(function (u) {
-        return importModule(u, atts);
-      }));
-    }
-    return new Promise(function (resolve, reject) {
-      var vector = '$importModule$' + Math.random().toString(32).slice(2);
-      var script = document.createElement('script');
-      var destructor = function destructor() {
-        delete window[vector];
-        script.onerror = null;
-        script.onload = null;
-        script.remove();
-        URL.revokeObjectURL(script.src);
-        script.src = '';
-      };
-      addScriptAtts(script, atts);
-      script.defer = 'defer';
-      script.type = 'module';
-      script.onerror = function () {
-        reject(new Error('Failed to import: ' + url));
-        destructor();
-      };
-      script.onload = function () {
-        resolve(window[vector]);
-        destructor();
-      };
-      var absURL = toAbsoluteURL(url);
-      var loader = 'import * as m from \'' + absURL.replace(/'/g, "\\'") + '\'; window.' + vector + ' = ' + (returnDefault ? 'm.default || ' : '') + 'm;'; // export Module
-      var blob = new Blob([loader], { type: 'text/javascript' });
-      script.src = URL.createObjectURL(blob);
-
-      document.head.append(script);
-    });
-  }
-
   /* globals jQuery */
-
+  /**
+   * ext-storage.js
+   *
+   * This extension allows automatic saving of the SVG canvas contents upon
+   *  page unload (which can later be automatically retrieved upon future
+   *  editor loads).
+   *
+   *  The functionality was originally part of the SVG Editor, but moved to a
+   *  separate extension to make the setting behavior optional, and adapted
+   *  to inform the user of its setting of local data.
+   * Dependencies:
+   *
+   * 1. jQuery BBQ (for deparam)
+   * @license MIT
+   *
+   * @copyright 2010 Brett Zamir
+   * @todo Revisit on whether to use $.pref over directly setting curConfig in all
+   *   extensions for a more public API (not only for extPath and imagePath,
+   *   but other currently used config in the extensions)
+   * @todo We might provide control of storage settings through the UI besides the
+   *   initial (or URL-forced) dialog. *
+  */
   var extStorage = {
     name: 'storage',
     init: function init() {
@@ -312,74 +167,34 @@ var svgEditorExtension_storage = (function () {
       return {
         name: 'storage',
         langReady: function () {
-          var _ref2 = asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee2(_ref) {
+          var _ref2 = asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee(_ref) {
-            var tryImport = function () {
+            var importLocale = _ref.importLocale;
-              var _ref3 = asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee(lang) {
+
-                var url;
+            var _$$deparam$querystrin, storagePrompt, confirmSetStorage, message, storagePrefsAndContent, storagePrefsOnly, storagePrefs, storageNoPrefsOrContent, storageNoPrefs, rememberLabel, rememberTooltip, options, oldContainerWidth, oldContainerMarginLeft, oldContentHeight, oldContainerHeight;
+
             return regeneratorRuntime.wrap(function _callee$(_context) {
               while (1) {
                 switch (_context.prev = _context.next) {
                   case 0:
-                        url = svgEditor.curConfig.extPath + 'ext-locale/storage/' + lang + '.js';
+                    _$$deparam$querystrin = $.deparam.querystring(true), storagePrompt = _$$deparam$querystrin.storagePrompt;
                     _context.next = 3;
-                        return importSetGlobalDefault(url, {
+                    return importLocale();
-                          global: 'svgEditorExtensionLocale_storage_' + lang
-                        });
 
                   case 3:
                     confirmSetStorage = _context.sent;
-
+                    message = confirmSetStorage.message, storagePrefsAndContent = confirmSetStorage.storagePrefsAndContent, storagePrefsOnly = confirmSetStorage.storagePrefsOnly, storagePrefs = confirmSetStorage.storagePrefs, storageNoPrefsOrContent = confirmSetStorage.storageNoPrefsOrContent, storageNoPrefs = confirmSetStorage.storageNoPrefs, rememberLabel = confirmSetStorage.rememberLabel, rememberTooltip = confirmSetStorage.rememberTooltip;
-                      case 4:
-                      case 'end':
-                        return _context.stop();
-                    }
-                  }
-                }, _callee, this);
-              }));
-
-              return function tryImport(_x2) {
-                return _ref3.apply(this, arguments);
-              };
-            }();
-
-            var lang = _ref.lang;
-
-            var _$$deparam$querystrin, storagePrompt, confirmSetStorage, _confirmSetStorage, message, storagePrefsAndContent, storagePrefsOnly, storagePrefs, storageNoPrefsOrContent, storageNoPrefs, rememberLabel, rememberTooltip, options, oldContainerWidth, oldContainerMarginLeft, oldContentHeight, oldContainerHeight;
-
-            return regeneratorRuntime.wrap(function _callee2$(_context2) {
-              while (1) {
-                switch (_context2.prev = _context2.next) {
-                  case 0:
-                    _$$deparam$querystrin = $.deparam.querystring(true), storagePrompt = _$$deparam$querystrin.storagePrompt;
-                    confirmSetStorage = void 0;
-                    _context2.prev = 2;
-                    _context2.next = 5;
-                    return tryImport(lang);
-
-                  case 5:
-                    _context2.next = 11;
-                    break;
-
-                  case 7:
-                    _context2.prev = 7;
-                    _context2.t0 = _context2['catch'](2);
-                    _context2.next = 11;
-                    return tryImport('en');
-
-                  case 11:
-                    _confirmSetStorage = confirmSetStorage, message = _confirmSetStorage.message, storagePrefsAndContent = _confirmSetStorage.storagePrefsAndContent, storagePrefsOnly = _confirmSetStorage.storagePrefsOnly, storagePrefs = _confirmSetStorage.storagePrefs, storageNoPrefsOrContent = _confirmSetStorage.storageNoPrefsOrContent, storageNoPrefs = _confirmSetStorage.storageNoPrefs, rememberLabel = _confirmSetStorage.rememberLabel, rememberTooltip = _confirmSetStorage.rememberTooltip;
 
                     // No need to run this one-time dialog again just because the user
                     //   changes the language
 
                     if (!loaded) {
-                      _context2.next = 14;
+                      _context.next = 7;
                       break;
                     }
 
-                    return _context2.abrupt('return');
+                    return _context.abrupt('return');
 
-                  case 14:
+                  case 7:
                     loaded = true;
 
                     // Note that the following can load even if "noStorageOnLoad" is
@@ -476,12 +291,12 @@ var svgEditorExtension_storage = (function () {
                       setupBeforeUnloadListener();
                     }
 
-                  case 16:
+                  case 9:
                   case 'end':
-                    return _context2.stop();
+                    return _context.stop();
                 }
               }
-            }, _callee2, this, [[2, 7]]);
+            }, _callee, this);
           }));
 
           function langReady(_x) {

dist/extensions/ext-webappfind.js

@@ -1,18 +1,60 @@
 var svgEditorExtension_webappfind = (function () {
   'use strict';
 
-  /*
+  var asyncToGenerator = function (fn) {
-  Depends on Firefox add-on and executables from https://github.com/brettz9/webappfind
+    return function () {
+      var gen = fn.apply(this, arguments);
+      return new Promise(function (resolve, reject) {
+        function step(key, arg) {
+          try {
+            var info = gen[key](arg);
+            var value = info.value;
+          } catch (error) {
+            reject(error);
+            return;
+          }
 
-  Todos:
+          if (info.done) {
-  1. See WebAppFind Readme for SVG-related todos
+            resolve(value);
+          } else {
+            return Promise.resolve(value).then(function (value) {
+              step("next", value);
+            }, function (err) {
+              step("throw", err);
+            });
+          }
+        }
+
+        return step("next");
+      });
+    };
+  };
+
+  /**
+  * Depends on Firefox add-on and executables from {@link https://github.com/brettz9/webappfind}
+  * @author Brett Zamir
+  * @license MIT
+  * @todo See WebAppFind Readme for SVG-related todos
   */
 
   var extWebappfind = {
-    name: 'WebAppFind',
+    name: 'webappfind',
-    init: function init() {
+    init: function () {
-      var svgEditor = this;
+      var _ref2 = asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee(_ref) {
+        var importLocale = _ref.importLocale;
+        var strings, svgEditor, saveMessage, readMessage, excludedMessages, pathID, buttons;
+        return regeneratorRuntime.wrap(function _callee$(_context) {
+          while (1) {
+            switch (_context.prev = _context.next) {
+              case 0:
+                _context.next = 2;
+                return importLocale();
+
+              case 2:
+                strings = _context.sent;
+                svgEditor = this;
                 // Todo: Update to new API once released
+
                 window.addEventListener('message', function (e) {
                   if (e.origin !== window.location.origin || // PRIVACY AND SECURITY! (for viewing and saving, respectively)
                   !Array.isArray(e.data) || excludedMessages.includes(e.data[0]) // Validate format and avoid our post below
@@ -40,20 +82,14 @@ var svgEditorExtension_webappfind = (function () {
                       throw new Error('Unexpected mode');
                   }
                 }, false);
-      var saveMessage = 'webapp-save',
+                saveMessage = 'webapp-save', readMessage = 'webapp-read', excludedMessages = [readMessage, saveMessage];
-          readMessage = 'webapp-read',
+                pathID = void 0;
-          excludedMessages = [readMessage, saveMessage];
+
-      var pathID = void 0;
 
                 window.postMessage([readMessage], window.location.origin !== 'null' ? window.location.origin : '*'); // Avoid "null" string error for file: protocol (even though file protocol not currently supported by add-on)
-
+                buttons = [{
-      return {
-        name: 'WebAppFind',
-        svgicons: svgEditor.curConfig.extIconsPath + 'webappfind-icon.svg',
-        buttons: [{
                   id: 'webappfind_save', //
                   type: 'app_menu',
-          title: 'Save Image back to Disk',
                   position: 4, // Before 0-based index position 4 (after the regular "Save Image (S)")
                   events: {
                     click: function click() {
@@ -64,9 +100,29 @@ var svgEditorExtension_webappfind = (function () {
                       window.postMessage([saveMessage, pathID, svgEditor.canvas.getSvgString()], window.location.origin);
                     }
                   }
-        }]
+                }];
-      };
+                return _context.abrupt('return', {
+                  name: strings.name,
+                  svgicons: svgEditor.curConfig.extIconsPath + 'webappfind-icon.svg',
+                  buttons: strings.buttons.map(function (button, i) {
+                    return Object.assign(buttons[i], button);
+                  })
+                });
+
+              case 10:
+              case 'end':
+                return _context.stop();
             }
+          }
+        }, _callee, this);
+      }));
+
+      function init(_x) {
+        return _ref2.apply(this, arguments);
+      }
+
+      return init;
+    }()
   };
 
   return extWebappfind;

dist/extensions/ext-xdomain-messaging.js

@@ -28,7 +28,7 @@ var svgEditorExtension_xdomain_messaging = (function () {
             return;
           }
           // The default is not to allow any origins, including even the same domain or if run on a file:// URL
-          //  See config-sample.js for an example of how to configure
+          //  See svgedit-config-es.js for an example of how to configure
           var allowedOrigins = svgEditor.curConfig.allowedOrigins;
 
           if (!allowedOrigins.includes('*') && !allowedOrigins.includes(e.origin)) {

dist/jspdf.plugin.svgToPdf.js

@@ -73,6 +73,13 @@
     }
   };
 
+  /**
+   * For parsing color values
+   * @module RGBColor
+   * @author Stoyan Stefanov <sstoo@gmail.com>
+   * @see https://www.phpied.com/rgb-color-parser-in-javascript/
+   * @license MIT
+  */
   var simpleColors = {
     aliceblue: 'f0f8ff',
     antiquewhite: 'faebd7',
@@ -242,12 +249,12 @@
 
   /**
    * A class to parse color values
-   * @author Stoyan Stefanov <sstoo@gmail.com>
-   * @link   https://www.phpied.com/rgb-color-parser-in-javascript/
-   * @license MIT
    */
 
   var RGBColor = function () {
+    /**
+    * @param {string} colorString
+    */
     function RGBColor(colorString) {
       classCallCheck(this, RGBColor);
 
@@ -294,6 +301,9 @@
     }
 
     // some getters
+    /**
+    * @returns {string}
+    */
 
 
     createClass(RGBColor, [{
@@ -301,6 +311,11 @@
       value: function toRGB() {
         return 'rgb(' + this.r + ', ' + this.g + ', ' + this.b + ')';
       }
+
+      /**
+      * @returns {string}
+      */
+
     }, {
       key: 'toHex',
       value: function toHex() {
@@ -319,7 +334,10 @@
         return '#' + r + g + b;
       }
 
-      // help
+      /**
+      * help
+      * @returns {HTMLUListElement}
+      */
 
     }, {
       key: 'getHelpXML',

dist/locale/lang.af.js

@@ -103,7 +103,6 @@ var svgEditorLang_af = (function () {
       mode_select: 'mode_select',
       mode_fhpath: 'mode_fhpath',
       mode_line: 'mode_line',
-      mode_connect: 'mode_connect',
       mode_rect: 'mode_rect',
       mode_square: 'mode_square',
       mode_fhrect: 'mode_fhrect',
@@ -111,7 +110,6 @@ var svgEditorLang_af = (function () {
       mode_circle: 'mode_circle',
       mode_fhellipse: 'mode_fhellipse',
       mode_path: 'mode_path',
-      mode_shapelib: 'mode_shapelib',
       mode_text: 'mode_text',
       mode_image: 'mode_image',
       mode_zoom: 'mode_zoom',
@@ -121,7 +119,6 @@ var svgEditorLang_af = (function () {
       redo: 'redo',
       tool_source: 'tool_source',
       wireframe_mode: 'wireframe_mode',
-      toggle_grid: 'toggle_grid',
       clone: 'clone',
       del: 'del',
       group_elements: 'group_elements',

dist/locale/lang.ar.js

@@ -103,7 +103,6 @@ var svgEditorLang_ar = (function () {
       mode_select: 'mode_select',
       mode_fhpath: 'mode_fhpath',
       mode_line: 'mode_line',
-      mode_connect: 'mode_connect',
       mode_rect: 'mode_rect',
       mode_square: 'mode_square',
       mode_fhrect: 'mode_fhrect',
@@ -111,7 +110,6 @@ var svgEditorLang_ar = (function () {
       mode_circle: 'mode_circle',
       mode_fhellipse: 'mode_fhellipse',
       mode_path: 'mode_path',
-      mode_shapelib: 'mode_shapelib',
       mode_text: 'mode_text',
       mode_image: 'mode_image',
       mode_zoom: 'mode_zoom',
@@ -121,7 +119,6 @@ var svgEditorLang_ar = (function () {
       redo: 'redo',
       tool_source: 'tool_source',
       wireframe_mode: 'wireframe_mode',
-      toggle_grid: 'toggle_grid',
       clone: 'clone',
       del: 'del',
       group_elements: 'group_elements',

dist/locale/lang.az.js

@@ -103,7 +103,6 @@ var svgEditorLang_az = (function () {
       mode_select: 'mode_select',
       mode_fhpath: 'mode_fhpath',
       mode_line: 'mode_line',
-      mode_connect: 'mode_connect',
       mode_rect: 'mode_rect',
       mode_square: 'mode_square',
       mode_fhrect: 'mode_fhrect',
@@ -111,7 +110,6 @@ var svgEditorLang_az = (function () {
       mode_circle: 'mode_circle',
       mode_fhellipse: 'mode_fhellipse',
       mode_path: 'mode_path',
-      mode_shapelib: 'mode_shapelib',
       mode_text: 'mode_text',
       mode_image: 'mode_image',
       mode_zoom: 'mode_zoom',
@@ -121,7 +119,6 @@ var svgEditorLang_az = (function () {
       redo: 'redo',
       tool_source: 'tool_source',
       wireframe_mode: 'wireframe_mode',
-      toggle_grid: 'toggle_grid',
       clone: 'clone',
       del: 'del',
       group_elements: 'group_elements',

dist/locale/lang.be.js

@@ -103,7 +103,6 @@ var svgEditorLang_be = (function () {
       mode_select: 'mode_select',
       mode_fhpath: 'mode_fhpath',
       mode_line: 'mode_line',
-      mode_connect: 'mode_connect',
       mode_rect: 'mode_rect',
       mode_square: 'mode_square',
       mode_fhrect: 'mode_fhrect',
@@ -111,7 +110,6 @@ var svgEditorLang_be = (function () {
       mode_circle: 'mode_circle',
       mode_fhellipse: 'mode_fhellipse',
       mode_path: 'mode_path',
-      mode_shapelib: 'mode_shapelib',
       mode_text: 'mode_text',
       mode_image: 'mode_image',
       mode_zoom: 'mode_zoom',
@@ -121,7 +119,6 @@ var svgEditorLang_be = (function () {
       redo: 'redo',
       tool_source: 'tool_source',
       wireframe_mode: 'wireframe_mode',
-      toggle_grid: 'toggle_grid',
       clone: 'clone',
       del: 'del',
       group_elements: 'group_elements',

dist/locale/lang.bg.js

@@ -103,7 +103,6 @@ var svgEditorLang_bg = (function () {
       mode_select: 'mode_select',
       mode_fhpath: 'mode_fhpath',
       mode_line: 'mode_line',
-      mode_connect: 'mode_connect',
       mode_rect: 'mode_rect',
       mode_square: 'mode_square',
       mode_fhrect: 'mode_fhrect',
@@ -111,7 +110,6 @@ var svgEditorLang_bg = (function () {
       mode_circle: 'mode_circle',
       mode_fhellipse: 'mode_fhellipse',
       mode_path: 'mode_path',
-      mode_shapelib: 'mode_shapelib',
       mode_text: 'mode_text',
       mode_image: 'mode_image',
       mode_zoom: 'mode_zoom',
@@ -121,7 +119,6 @@ var svgEditorLang_bg = (function () {
       redo: 'redo',
       tool_source: 'tool_source',
       wireframe_mode: 'wireframe_mode',
-      toggle_grid: 'toggle_grid',
       clone: 'clone',
       del: 'del',
       group_elements: 'group_elements',

dist/locale/lang.ca.js

@@ -103,7 +103,6 @@ var svgEditorLang_ca = (function () {
       mode_select: 'mode_select',
       mode_fhpath: 'mode_fhpath',
       mode_line: 'mode_line',
-      mode_connect: 'mode_connect',
       mode_rect: 'mode_rect',
       mode_square: 'mode_square',
       mode_fhrect: 'mode_fhrect',
@@ -111,7 +110,6 @@ var svgEditorLang_ca = (function () {
       mode_circle: 'mode_circle',
       mode_fhellipse: 'mode_fhellipse',
       mode_path: 'mode_path',
-      mode_shapelib: 'mode_shapelib',
       mode_text: 'mode_text',
       mode_image: 'mode_image',
       mode_zoom: 'mode_zoom',
@@ -121,7 +119,6 @@ var svgEditorLang_ca = (function () {
       redo: 'redo',
       tool_source: 'tool_source',
       wireframe_mode: 'wireframe_mode',
-      toggle_grid: 'toggle_grid',
       clone: 'clone',
       del: 'del',
       group_elements: 'group_elements',

dist/locale/lang.cs.js

@@ -103,7 +103,6 @@ var svgEditorLang_cs = (function () {
       mode_select: 'mode_select',
       mode_fhpath: 'mode_fhpath',
       mode_line: 'mode_line',
-      mode_connect: 'mode_connect',
       mode_rect: 'mode_rect',
       mode_square: 'mode_square',
       mode_fhrect: 'mode_fhrect',
@@ -111,7 +110,6 @@ var svgEditorLang_cs = (function () {
       mode_circle: 'mode_circle',
       mode_fhellipse: 'mode_fhellipse',
       mode_path: 'mode_path',
-      mode_shapelib: 'mode_shapelib',
       mode_text: 'mode_text',
       mode_image: 'mode_image',
       mode_zoom: 'mode_zoom',
@@ -121,7 +119,6 @@ var svgEditorLang_cs = (function () {
       redo: 'redo',
       tool_source: 'tool_source',
       wireframe_mode: 'wireframe_mode',
-      toggle_grid: 'toggle_grid',
       clone: 'clone',
       del: 'del',
       group_elements: 'group_elements',

dist/locale/lang.cy.js

@@ -103,7 +103,6 @@ var svgEditorLang_cy = (function () {
       mode_select: 'mode_select',
       mode_fhpath: 'mode_fhpath',
       mode_line: 'mode_line',
-      mode_connect: 'mode_connect',
       mode_rect: 'mode_rect',
       mode_square: 'mode_square',
       mode_fhrect: 'mode_fhrect',
@@ -111,7 +110,6 @@ var svgEditorLang_cy = (function () {
       mode_circle: 'mode_circle',
       mode_fhellipse: 'mode_fhellipse',
       mode_path: 'mode_path',
-      mode_shapelib: 'mode_shapelib',
       mode_text: 'mode_text',
       mode_image: 'mode_image',
       mode_zoom: 'mode_zoom',
@@ -121,7 +119,6 @@ var svgEditorLang_cy = (function () {
       redo: 'redo',
       tool_source: 'tool_source',
       wireframe_mode: 'wireframe_mode',
-      toggle_grid: 'toggle_grid',
       clone: 'clone',
       del: 'del',
       group_elements: 'group_elements',

dist/locale/lang.da.js

@@ -103,7 +103,6 @@ var svgEditorLang_da = (function () {
       mode_select: 'mode_select',
       mode_fhpath: 'mode_fhpath',
       mode_line: 'mode_line',
-      mode_connect: 'mode_connect',
       mode_rect: 'mode_rect',
       mode_square: 'mode_square',
       mode_fhrect: 'mode_fhrect',
@@ -111,7 +110,6 @@ var svgEditorLang_da = (function () {
       mode_circle: 'mode_circle',
       mode_fhellipse: 'mode_fhellipse',
       mode_path: 'mode_path',
-      mode_shapelib: 'mode_shapelib',
       mode_text: 'mode_text',
       mode_image: 'mode_image',
       mode_zoom: 'mode_zoom',
@@ -121,7 +119,6 @@ var svgEditorLang_da = (function () {
       redo: 'redo',
       tool_source: 'tool_source',
       wireframe_mode: 'wireframe_mode',
-      toggle_grid: 'toggle_grid',
       clone: 'clone',
       del: 'del',
       group_elements: 'group_elements',

dist/locale/lang.de.js

@@ -103,7 +103,6 @@ var svgEditorLang_de = (function () {
       mode_select: 'mode_select',
       mode_fhpath: 'mode_fhpath',
       mode_line: 'mode_line',
-      mode_connect: 'mode_connect',
       mode_rect: 'mode_rect',
       mode_square: 'mode_square',
       mode_fhrect: 'mode_fhrect',
@@ -111,7 +110,6 @@ var svgEditorLang_de = (function () {
       mode_circle: 'mode_circle',
       mode_fhellipse: 'mode_fhellipse',
       mode_path: 'mode_path',
-      mode_shapelib: 'mode_shapelib',
       mode_text: 'mode_text',
       mode_image: 'mode_image',
       mode_zoom: 'mode_zoom',
@@ -121,7 +119,6 @@ var svgEditorLang_de = (function () {
       redo: 'redo',
       tool_source: 'tool_source',
       wireframe_mode: 'wireframe_mode',
-      toggle_grid: 'toggle_grid',
       clone: 'clone',
       del: 'del',
       group_elements: 'group_elements',

dist/locale/lang.el.js

@@ -103,7 +103,6 @@ var svgEditorLang_el = (function () {
       mode_select: 'mode_select',
       mode_fhpath: 'mode_fhpath',
       mode_line: 'mode_line',
-      mode_connect: 'mode_connect',
       mode_rect: 'mode_rect',
       mode_square: 'mode_square',
       mode_fhrect: 'mode_fhrect',
@@ -111,7 +110,6 @@ var svgEditorLang_el = (function () {
       mode_circle: 'mode_circle',
       mode_fhellipse: 'mode_fhellipse',
       mode_path: 'mode_path',
-      mode_shapelib: 'mode_shapelib',
       mode_text: 'mode_text',
       mode_image: 'mode_image',
       mode_zoom: 'mode_zoom',
@@ -121,7 +119,6 @@ var svgEditorLang_el = (function () {
       redo: 'redo',
       tool_source: 'tool_source',
       wireframe_mode: 'wireframe_mode',
-      toggle_grid: 'toggle_grid',
       clone: 'clone',
       del: 'del',
       group_elements: 'group_elements',

dist/locale/lang.en.js

@@ -111,7 +111,6 @@ var svgEditorLang_en = (function () {
       mode_circle: 'Circle',
       mode_fhellipse: 'Free-Hand Ellipse',
       mode_path: 'Path Tool',
-      mode_shapelib: 'Shape library',
       mode_text: 'Text Tool',
       mode_image: 'Image Tool',
       mode_zoom: 'Zoom Tool [Ctrl+Up/Down]',
@@ -121,7 +120,6 @@ var svgEditorLang_en = (function () {
       redo: 'Redo [Y]',
       tool_source: 'Edit Source [U]',
       wireframe_mode: 'Wireframe Mode [F]',
-      toggle_grid: 'Show/Hide Grid',
       clone: 'Duplicate Element [D]',
       del: 'Delete Element [Delete/Backspace]',
       group_elements: 'Group Elements [G]',

dist/locale/lang.es.js

@@ -103,7 +103,6 @@ var svgEditorLang_es = (function () {
       mode_select: 'mode_select',
       mode_fhpath: 'mode_fhpath',
       mode_line: 'mode_line',
-      mode_connect: 'mode_connect',
       mode_rect: 'mode_rect',
       mode_square: 'mode_square',
       mode_fhrect: 'mode_fhrect',
@@ -111,7 +110,6 @@ var svgEditorLang_es = (function () {
       mode_circle: 'mode_circle',
       mode_fhellipse: 'mode_fhellipse',
       mode_path: 'mode_path',
-      mode_shapelib: 'mode_shapelib',
       mode_text: 'mode_text',
       mode_image: 'mode_image',
       mode_zoom: 'mode_zoom',
@@ -121,7 +119,6 @@ var svgEditorLang_es = (function () {
       redo: 'redo',
       tool_source: 'tool_source',
       wireframe_mode: 'wireframe_mode',
-      toggle_grid: 'toggle_grid',
       clone: 'clone',
       del: 'del',
       group_elements: 'group_elements',

dist/locale/lang.et.js

@@ -103,7 +103,6 @@ var svgEditorLang_et = (function () {
       mode_select: 'mode_select',
       mode_fhpath: 'mode_fhpath',
       mode_line: 'mode_line',
-      mode_connect: 'mode_connect',
       mode_rect: 'mode_rect',
       mode_square: 'mode_square',
       mode_fhrect: 'mode_fhrect',
@@ -111,7 +110,6 @@ var svgEditorLang_et = (function () {
       mode_circle: 'mode_circle',
       mode_fhellipse: 'mode_fhellipse',
       mode_path: 'mode_path',
-      mode_shapelib: 'mode_shapelib',
       mode_text: 'mode_text',
       mode_image: 'mode_image',
       mode_zoom: 'mode_zoom',
@@ -121,7 +119,6 @@ var svgEditorLang_et = (function () {
       redo: 'redo',
       tool_source: 'tool_source',
       wireframe_mode: 'wireframe_mode',
-      toggle_grid: 'toggle_grid',
       clone: 'clone',
       del: 'del',
       group_elements: 'group_elements',

dist/locale/lang.fa.js

@@ -108,7 +108,6 @@ var svgEditorLang_fa = (function () {
       mode_circle: '‫دایره‬',
       mode_fhellipse: '‫بیضی با قابلیت تغییر پویا‬',
       mode_path: '‫ابزار مسیر ‬',
-      mode_shapelib: 'Shape library',
       mode_text: '‫ابزار متن ‬',
       mode_image: '‫ابزار تصویر ‬',
       mode_zoom: '‫ابزار بزرگ نمایی ‬',
@@ -118,7 +117,6 @@ var svgEditorLang_fa = (function () {
       redo: '‫ازنو ‬',
       tool_source: '‫ویرایش منبع ‬',
       wireframe_mode: '‫حالت نمایش لبه ها ‬',
-      toggle_grid: 'Show/Hide Grid',
       clone: 'Clone Element(s)',
       del: 'Delete Element(s)',
       group_elements: '‫قرار دادن عناصر در گروه ‬',

dist/locale/lang.fi.js

@@ -103,7 +103,6 @@ var svgEditorLang_fi = (function () {
       mode_select: 'mode_select',
       mode_fhpath: 'mode_fhpath',
       mode_line: 'mode_line',
-      mode_connect: 'mode_connect',
       mode_rect: 'mode_rect',
       mode_square: 'mode_square',
       mode_fhrect: 'mode_fhrect',
@@ -111,7 +110,6 @@ var svgEditorLang_fi = (function () {
       mode_circle: 'mode_circle',
       mode_fhellipse: 'mode_fhellipse',
       mode_path: 'mode_path',
-      mode_shapelib: 'mode_shapelib',
       mode_text: 'mode_text',
       mode_image: 'mode_image',
       mode_zoom: 'mode_zoom',
@@ -121,7 +119,6 @@ var svgEditorLang_fi = (function () {
       redo: 'redo',
       tool_source: 'tool_source',
       wireframe_mode: 'wireframe_mode',
-      toggle_grid: 'toggle_grid',
       clone: 'clone',
       del: 'del',
       group_elements: 'group_elements',

dist/locale/lang.fr.js

@@ -103,7 +103,6 @@ var svgEditorLang_fr = (function () {
       mode_select: 'mode_select',
       mode_fhpath: 'mode_fhpath',
       mode_line: 'mode_line',
-      mode_connect: 'mode_connect',
       mode_rect: 'mode_rect',
       mode_square: 'mode_square',
       mode_fhrect: 'mode_fhrect',
@@ -111,7 +110,6 @@ var svgEditorLang_fr = (function () {
       mode_circle: 'mode_circle',
       mode_fhellipse: 'mode_fhellipse',
       mode_path: 'mode_path',
-      mode_shapelib: "Bibliothèque d'images",
       mode_text: 'mode_text',
       mode_image: 'mode_image',
       mode_zoom: 'mode_zoom',
@@ -121,7 +119,6 @@ var svgEditorLang_fr = (function () {
       redo: 'redo',
       tool_source: 'tool_source',
       wireframe_mode: 'wireframe_mode',
-      toggle_grid: 'toggle_grid',
       clone: 'clone',
       del: 'del',
       group_elements: 'group_elements',

dist/locale/lang.fy.js

@@ -103,7 +103,6 @@ var svgEditorLang_fy = (function () {
       mode_select: 'mode_select',
       mode_fhpath: 'mode_fhpath',
       mode_line: 'mode_line',
-      mode_connect: 'mode_connect',
       mode_rect: 'mode_rect',
       mode_square: 'mode_square',
       mode_fhrect: 'mode_fhrect',
@@ -111,7 +110,6 @@ var svgEditorLang_fy = (function () {
       mode_circle: 'mode_circle',
       mode_fhellipse: 'mode_fhellipse',
       mode_path: 'mode_path',
-      mode_shapelib: 'mode_shapelib',
       mode_text: 'mode_text',
       mode_image: 'mode_image',
       mode_zoom: 'mode_zoom',
@@ -121,7 +119,6 @@ var svgEditorLang_fy = (function () {
       redo: "Op 'e nij",
       tool_source: 'tool_source',
       wireframe_mode: 'wireframe_mode',
-      toggle_grid: 'toggle_grid',
       clone: 'clone',
       del: 'del',
       group_elements: 'group_elements',

dist/locale/lang.ga.js

@@ -103,7 +103,6 @@ var svgEditorLang_ga = (function () {
       mode_select: 'mode_select',
       mode_fhpath: 'mode_fhpath',
       mode_line: 'mode_line',
-      mode_connect: 'mode_connect',
       mode_rect: 'mode_rect',
       mode_square: 'mode_square',
       mode_fhrect: 'mode_fhrect',
@@ -111,7 +110,6 @@ var svgEditorLang_ga = (function () {
       mode_circle: 'mode_circle',
       mode_fhellipse: 'mode_fhellipse',
       mode_path: 'mode_path',
-      mode_shapelib: 'mode_shapelib',
       mode_text: 'mode_text',
       mode_image: 'mode_image',
       mode_zoom: 'mode_zoom',
@@ -121,7 +119,6 @@ var svgEditorLang_ga = (function () {
       redo: 'redo',
       tool_source: 'tool_source',
       wireframe_mode: 'wireframe_mode',
-      toggle_grid: 'toggle_grid',
       clone: 'clone',
       del: 'del',
       group_elements: 'group_elements',

dist/locale/lang.gl.js

@@ -103,7 +103,6 @@ var svgEditorLang_gl = (function () {
       mode_select: 'mode_select',
       mode_fhpath: 'mode_fhpath',
       mode_line: 'mode_line',
-      mode_connect: 'mode_connect',
       mode_rect: 'mode_rect',
       mode_square: 'mode_square',
       mode_fhrect: 'mode_fhrect',
@@ -111,7 +110,6 @@ var svgEditorLang_gl = (function () {
       mode_circle: 'mode_circle',
       mode_fhellipse: 'mode_fhellipse',
       mode_path: 'mode_path',
-      mode_shapelib: 'mode_shapelib',
       mode_text: 'mode_text',
       mode_image: 'mode_image',
       mode_zoom: 'mode_zoom',
@@ -121,7 +119,6 @@ var svgEditorLang_gl = (function () {
       redo: 'redo',
       tool_source: 'tool_source',
       wireframe_mode: 'wireframe_mode',
-      toggle_grid: 'toggle_grid',
       clone: 'clone',
       del: 'del',
       group_elements: 'group_elements',

dist/locale/lang.he.js

@@ -103,7 +103,6 @@ var svgEditorLang_he = (function () {
       mode_select: 'mode_select',
       mode_fhpath: 'mode_fhpath',
       mode_line: 'mode_line',
-      mode_connect: 'mode_connect',
       mode_rect: 'mode_rect',
       mode_square: 'mode_square',
       mode_fhrect: 'mode_fhrect',
@@ -111,7 +110,6 @@ var svgEditorLang_he = (function () {
       mode_circle: 'mode_circle',
       mode_fhellipse: 'mode_fhellipse',
       mode_path: 'mode_path',
-      mode_shapelib: 'mode_shapelib',
       mode_text: 'mode_text',
       mode_image: 'mode_image',
       mode_zoom: 'mode_zoom',
@@ -121,7 +119,6 @@ var svgEditorLang_he = (function () {
       redo: 'redo',
       tool_source: 'tool_source',
       wireframe_mode: 'wireframe_mode',
-      toggle_grid: 'toggle_grid',
       clone: 'clone',
       del: 'del',
       group_elements: 'group_elements',

dist/locale/lang.hi.js

@@ -103,7 +103,6 @@ var svgEditorLang_hi = (function () {
       mode_select: 'mode_select',
       mode_fhpath: 'mode_fhpath',
       mode_line: 'mode_line',
-      mode_connect: 'mode_connect',
       mode_rect: 'mode_rect',
       mode_square: 'mode_square',
       mode_fhrect: 'mode_fhrect',
@@ -111,7 +110,6 @@ var svgEditorLang_hi = (function () {
       mode_circle: 'mode_circle',
       mode_fhellipse: 'mode_fhellipse',
       mode_path: 'mode_path',
-      mode_shapelib: 'mode_shapelib',
       mode_text: 'mode_text',
       mode_image: 'mode_image',
       mode_zoom: 'mode_zoom',
@@ -121,7 +119,6 @@ var svgEditorLang_hi = (function () {
       redo: 'redo',
       tool_source: 'tool_source',
       wireframe_mode: 'wireframe_mode',
-      toggle_grid: 'toggle_grid',
       clone: 'clone',
       del: 'del',
       group_elements: 'group_elements',

dist/locale/lang.hr.js

@@ -103,7 +103,6 @@ var svgEditorLang_hr = (function () {
       mode_select: 'mode_select',
       mode_fhpath: 'mode_fhpath',
       mode_line: 'mode_line',
-      mode_connect: 'mode_connect',
       mode_rect: 'mode_rect',
       mode_square: 'mode_square',
       mode_fhrect: 'mode_fhrect',
@@ -111,7 +110,6 @@ var svgEditorLang_hr = (function () {
       mode_circle: 'mode_circle',
       mode_fhellipse: 'mode_fhellipse',
       mode_path: 'mode_path',
-      mode_shapelib: 'mode_shapelib',
       mode_text: 'mode_text',
       mode_image: 'mode_image',
       mode_zoom: 'mode_zoom',
@@ -121,7 +119,6 @@ var svgEditorLang_hr = (function () {
       redo: 'redo',
       tool_source: 'tool_source',
       wireframe_mode: 'wireframe_mode',
-      toggle_grid: 'toggle_grid',
       clone: 'clone',
       del: 'del',
       group_elements: 'group_elements',

dist/locale/lang.hu.js

@@ -103,7 +103,6 @@ var svgEditorLang_hu = (function () {
       mode_select: 'mode_select',
       mode_fhpath: 'mode_fhpath',
       mode_line: 'mode_line',
-      mode_connect: 'mode_connect',
       mode_rect: 'mode_rect',
       mode_square: 'mode_square',
       mode_fhrect: 'mode_fhrect',
@@ -111,7 +110,6 @@ var svgEditorLang_hu = (function () {
       mode_circle: 'mode_circle',
       mode_fhellipse: 'mode_fhellipse',
       mode_path: 'mode_path',
-      mode_shapelib: 'mode_shapelib',
       mode_text: 'mode_text',
       mode_image: 'mode_image',
       mode_zoom: 'mode_zoom',
@@ -121,7 +119,6 @@ var svgEditorLang_hu = (function () {
       redo: 'redo',
       tool_source: 'tool_source',
       wireframe_mode: 'wireframe_mode',
-      toggle_grid: 'toggle_grid',
       clone: 'clone',
       del: 'del',
       group_elements: 'group_elements',

dist/locale/lang.hy.js

@@ -103,7 +103,6 @@ var svgEditorLang_hy = (function () {
       mode_select: 'mode_select',
       mode_fhpath: 'mode_fhpath',
       mode_line: 'mode_line',
-      mode_connect: 'mode_connect',
       mode_rect: 'mode_rect',
       mode_square: 'mode_square',
       mode_fhrect: 'mode_fhrect',
@@ -111,7 +110,6 @@ var svgEditorLang_hy = (function () {
       mode_circle: 'mode_circle',
       mode_fhellipse: 'mode_fhellipse',
       mode_path: 'mode_path',
-      mode_shapelib: 'mode_shapelib',
       mode_text: 'mode_text',
       mode_image: 'mode_image',
       mode_zoom: 'mode_zoom',
@@ -121,7 +119,6 @@ var svgEditorLang_hy = (function () {
       redo: 'redo',
       tool_source: 'tool_source',
       wireframe_mode: 'wireframe_mode',
-      toggle_grid: 'toggle_grid',
       clone: 'clone',
       del: 'del',
       group_elements: 'group_elements',

dist/locale/lang.id.js

@@ -103,7 +103,6 @@ var svgEditorLang_id = (function () {
       mode_select: 'mode_select',
       mode_fhpath: 'mode_fhpath',
       mode_line: 'mode_line',
-      mode_connect: 'mode_connect',
       mode_rect: 'mode_rect',
       mode_square: 'mode_square',
       mode_fhrect: 'mode_fhrect',
@@ -111,7 +110,6 @@ var svgEditorLang_id = (function () {
       mode_circle: 'mode_circle',
       mode_fhellipse: 'mode_fhellipse',
       mode_path: 'mode_path',
-      mode_shapelib: 'mode_shapelib',
       mode_text: 'mode_text',
       mode_image: 'mode_image',
       mode_zoom: 'mode_zoom',
@@ -121,7 +119,6 @@ var svgEditorLang_id = (function () {
       redo: 'redo',
       tool_source: 'tool_source',
       wireframe_mode: 'wireframe_mode',
-      toggle_grid: 'toggle_grid',
       clone: 'clone',
       del: 'del',
       group_elements: 'group_elements',

dist/locale/lang.is.js

@@ -103,7 +103,6 @@ var svgEditorLang_is = (function () {
       mode_select: 'mode_select',
       mode_fhpath: 'mode_fhpath',
       mode_line: 'mode_line',
-      mode_connect: 'mode_connect',
       mode_rect: 'mode_rect',
       mode_square: 'mode_square',
       mode_fhrect: 'mode_fhrect',
@@ -111,7 +110,6 @@ var svgEditorLang_is = (function () {
       mode_circle: 'mode_circle',
       mode_fhellipse: 'mode_fhellipse',
       mode_path: 'mode_path',
-      mode_shapelib: 'mode_shapelib',
       mode_text: 'mode_text',
       mode_image: 'mode_image',
       mode_zoom: 'mode_zoom',
@@ -121,7 +119,6 @@ var svgEditorLang_is = (function () {
       redo: 'redo',
       tool_source: 'tool_source',
       wireframe_mode: 'wireframe_mode',
-      toggle_grid: 'toggle_grid',
       clone: 'clone',
       del: 'del',
       group_elements: 'group_elements',

dist/locale/lang.it.js

@@ -103,7 +103,6 @@ var svgEditorLang_it = (function () {
       mode_select: 'mode_select',
       mode_fhpath: 'mode_fhpath',
       mode_line: 'mode_line',
-      mode_connect: 'mode_connect',
       mode_rect: 'mode_rect',
       mode_square: 'mode_square',
       mode_fhrect: 'mode_fhrect',
@@ -111,7 +110,6 @@ var svgEditorLang_it = (function () {
       mode_circle: 'mode_circle',
       mode_fhellipse: 'mode_fhellipse',
       mode_path: 'mode_path',
-      mode_shapelib: 'mode_shapelib',
       mode_text: 'mode_text',
       mode_image: 'mode_image',
       mode_zoom: 'mode_zoom',
@@ -121,7 +119,6 @@ var svgEditorLang_it = (function () {
       redo: 'redo',
       tool_source: 'tool_source',
       wireframe_mode: 'wireframe_mode',
-      toggle_grid: 'toggle_grid',
       clone: 'clone',
       del: 'del',
       group_elements: 'group_elements',

dist/locale/lang.ja.js

@@ -103,7 +103,6 @@ var svgEditorLang_ja = (function () {
       mode_select: 'mode_select',
       mode_fhpath: 'mode_fhpath',
       mode_line: 'mode_line',
-      mode_connect: 'mode_connect',
       mode_rect: 'mode_rect',
       mode_square: 'mode_square',
       mode_fhrect: 'mode_fhrect',
@@ -111,7 +110,6 @@ var svgEditorLang_ja = (function () {
       mode_circle: 'mode_circle',
       mode_fhellipse: 'mode_fhellipse',
       mode_path: 'mode_path',
-      mode_shapelib: 'mode_shapelib',
       mode_text: 'mode_text',
       mode_image: 'mode_image',
       mode_zoom: 'mode_zoom',
@@ -121,7 +119,6 @@ var svgEditorLang_ja = (function () {
       redo: 'redo',
       tool_source: 'tool_source',
       wireframe_mode: 'wireframe_mode',
-      toggle_grid: 'toggle_grid',
       clone: 'clone',
       del: 'del',
       group_elements: 'group_elements',

dist/locale/lang.ko.js

@@ -103,7 +103,6 @@ var svgEditorLang_ko = (function () {
       mode_select: 'mode_select',
       mode_fhpath: 'mode_fhpath',
       mode_line: 'mode_line',
-      mode_connect: 'mode_connect',
       mode_rect: 'mode_rect',
       mode_square: 'mode_square',
       mode_fhrect: 'mode_fhrect',
@@ -111,7 +110,6 @@ var svgEditorLang_ko = (function () {
       mode_circle: 'mode_circle',
       mode_fhellipse: 'mode_fhellipse',
       mode_path: 'mode_path',
-      mode_shapelib: 'mode_shapelib',
       mode_text: 'mode_text',
       mode_image: 'mode_image',
       mode_zoom: 'mode_zoom',
@@ -121,7 +119,6 @@ var svgEditorLang_ko = (function () {
       redo: 'redo',
       tool_source: 'tool_source',
       wireframe_mode: 'wireframe_mode',
-      toggle_grid: 'toggle_grid',
       clone: 'clone',
       del: 'del',
       group_elements: 'group_elements',

dist/locale/lang.lt.js

@@ -103,7 +103,6 @@ var svgEditorLang_lt = (function () {
       mode_select: 'mode_select',
       mode_fhpath: 'mode_fhpath',
       mode_line: 'mode_line',
-      mode_connect: 'mode_connect',
       mode_rect: 'mode_rect',
       mode_square: 'mode_square',
       mode_fhrect: 'mode_fhrect',
@@ -111,7 +110,6 @@ var svgEditorLang_lt = (function () {
       mode_circle: 'mode_circle',
       mode_fhellipse: 'mode_fhellipse',
       mode_path: 'mode_path',
-      mode_shapelib: 'mode_shapelib',
       mode_text: 'mode_text',
       mode_image: 'mode_image',
       mode_zoom: 'mode_zoom',
@@ -121,7 +119,6 @@ var svgEditorLang_lt = (function () {
       redo: 'redo',
       tool_source: 'tool_source',
       wireframe_mode: 'wireframe_mode',
-      toggle_grid: 'toggle_grid',
       clone: 'clone',
       del: 'del',
       group_elements: 'group_elements',

dist/locale/lang.lv.js

@@ -103,7 +103,6 @@ var svgEditorLang_lv = (function () {
       mode_select: 'mode_select',
       mode_fhpath: 'mode_fhpath',
       mode_line: 'mode_line',
-      mode_connect: 'mode_connect',
       mode_rect: 'mode_rect',
       mode_square: 'mode_square',
       mode_fhrect: 'mode_fhrect',
@@ -111,7 +110,6 @@ var svgEditorLang_lv = (function () {
       mode_circle: 'mode_circle',
       mode_fhellipse: 'mode_fhellipse',
       mode_path: 'mode_path',
-      mode_shapelib: 'mode_shapelib',
       mode_text: 'mode_text',
       mode_image: 'mode_image',
       mode_zoom: 'mode_zoom',
@@ -121,7 +119,6 @@ var svgEditorLang_lv = (function () {
       redo: 'redo',
       tool_source: 'tool_source',
       wireframe_mode: 'wireframe_mode',
-      toggle_grid: 'toggle_grid',
       clone: 'clone',
       del: 'del',
       group_elements: 'group_elements',

dist/locale/lang.mk.js

@@ -103,7 +103,6 @@ var svgEditorLang_mk = (function () {
       mode_select: 'mode_select',
       mode_fhpath: 'mode_fhpath',
       mode_line: 'mode_line',
-      mode_connect: 'mode_connect',
       mode_rect: 'mode_rect',
       mode_square: 'mode_square',
       mode_fhrect: 'mode_fhrect',
@@ -111,7 +110,6 @@ var svgEditorLang_mk = (function () {
       mode_circle: 'mode_circle',
       mode_fhellipse: 'mode_fhellipse',
       mode_path: 'mode_path',
-      mode_shapelib: 'mode_shapelib',
       mode_text: 'mode_text',
       mode_image: 'mode_image',
       mode_zoom: 'mode_zoom',
@@ -121,7 +119,6 @@ var svgEditorLang_mk = (function () {
       redo: 'redo',
       tool_source: 'tool_source',
       wireframe_mode: 'wireframe_mode',
-      toggle_grid: 'toggle_grid',
       clone: 'clone',
       del: 'del',
       group_elements: 'group_elements',

dist/locale/lang.ms.js

@@ -103,7 +103,6 @@ var svgEditorLang_ms = (function () {
       mode_select: 'mode_select',
       mode_fhpath: 'mode_fhpath',
       mode_line: 'mode_line',
-      mode_connect: 'mode_connect',
       mode_rect: 'mode_rect',
       mode_square: 'mode_square',
       mode_fhrect: 'mode_fhrect',
@@ -111,7 +110,6 @@ var svgEditorLang_ms = (function () {
       mode_circle: 'mode_circle',
       mode_fhellipse: 'mode_fhellipse',
       mode_path: 'mode_path',
-      mode_shapelib: 'mode_shapelib',
       mode_text: 'mode_text',
       mode_image: 'mode_image',
       mode_zoom: 'mode_zoom',
@@ -121,7 +119,6 @@ var svgEditorLang_ms = (function () {
       redo: 'redo',
       tool_source: 'tool_source',
       wireframe_mode: 'wireframe_mode',
-      toggle_grid: 'toggle_grid',
       clone: 'clone',
       del: 'del',
       group_elements: 'group_elements',

dist/locale/lang.mt.js

@@ -103,7 +103,6 @@ var svgEditorLang_mt = (function () {
       mode_select: 'mode_select',
       mode_fhpath: 'mode_fhpath',
       mode_line: 'mode_line',
-      mode_connect: 'mode_connect',
       mode_rect: 'mode_rect',
       mode_square: 'mode_square',
       mode_fhrect: 'mode_fhrect',
@@ -111,7 +110,6 @@ var svgEditorLang_mt = (function () {
       mode_circle: 'mode_circle',
       mode_fhellipse: 'mode_fhellipse',
       mode_path: 'mode_path',
-      mode_shapelib: 'mode_shapelib',
       mode_text: 'mode_text',
       mode_image: 'mode_image',
       mode_zoom: 'mode_zoom',
@@ -121,7 +119,6 @@ var svgEditorLang_mt = (function () {
       redo: 'redo',
       tool_source: 'tool_source',
       wireframe_mode: 'wireframe_mode',
-      toggle_grid: 'toggle_grid',
       clone: 'clone',
       del: 'del',
       group_elements: 'group_elements',

dist/locale/lang.nl.js

@@ -103,7 +103,6 @@ var svgEditorLang_nl = (function () {
       mode_select: 'mode_select',
       mode_fhpath: 'mode_fhpath',
       mode_line: 'mode_line',
-      mode_connect: 'mode_connect',
       mode_rect: 'mode_rect',
       mode_square: 'mode_square',
       mode_fhrect: 'mode_fhrect',
@@ -111,7 +110,6 @@ var svgEditorLang_nl = (function () {
       mode_circle: 'mode_circle',
       mode_fhellipse: 'mode_fhellipse',
       mode_path: 'mode_path',
-      mode_shapelib: 'mode_shapelib',
       mode_text: 'mode_text',
       mode_image: 'mode_image',
       mode_zoom: 'mode_zoom',
@@ -121,7 +119,6 @@ var svgEditorLang_nl = (function () {
       redo: 'redo',
       tool_source: 'tool_source',
       wireframe_mode: 'wireframe_mode',
-      toggle_grid: 'toggle_grid',
       clone: 'clone',
       del: 'del',
       group_elements: 'group_elements',

dist/locale/lang.no.js

@@ -103,7 +103,6 @@ var svgEditorLang_no = (function () {
       mode_select: 'mode_select',
       mode_fhpath: 'mode_fhpath',
       mode_line: 'mode_line',
-      mode_connect: 'mode_connect',
       mode_rect: 'mode_rect',
       mode_square: 'mode_square',
       mode_fhrect: 'mode_fhrect',
@@ -111,7 +110,6 @@ var svgEditorLang_no = (function () {
       mode_circle: 'mode_circle',
       mode_fhellipse: 'mode_fhellipse',
       mode_path: 'mode_path',
-      mode_shapelib: 'mode_shapelib',
       mode_text: 'mode_text',
       mode_image: 'mode_image',
       mode_zoom: 'mode_zoom',
@@ -121,7 +119,6 @@ var svgEditorLang_no = (function () {
       redo: 'redo',
       tool_source: 'tool_source',
       wireframe_mode: 'wireframe_mode',
-      toggle_grid: 'toggle_grid',
       clone: 'clone',
       del: 'del',
       group_elements: 'group_elements',

dist/locale/lang.pl.js

@@ -103,7 +103,6 @@ var svgEditorLang_pl = (function () {
       mode_select: 'mode_select',
       mode_fhpath: 'mode_fhpath',
       mode_line: 'mode_line',
-      mode_connect: 'mode_connect',
       mode_rect: 'mode_rect',
       mode_square: 'mode_square',
       mode_fhrect: 'mode_fhrect',
@@ -111,7 +110,6 @@ var svgEditorLang_pl = (function () {
       mode_circle: 'mode_circle',
       mode_fhellipse: 'mode_fhellipse',
       mode_path: 'mode_path',
-      mode_shapelib: 'mode_shapelib',
       mode_text: 'mode_text',
       mode_image: 'mode_image',
       mode_zoom: 'mode_zoom',
@@ -121,7 +119,6 @@ var svgEditorLang_pl = (function () {
       redo: 'redo',
       tool_source: 'tool_source',
       wireframe_mode: 'wireframe_mode',
-      toggle_grid: 'toggle_grid',
       clone: 'clone',
       del: 'del',
       group_elements: 'group_elements',

dist/locale/lang.pt-BR.js

@@ -103,7 +103,6 @@ var svgEditorLang_pt_BR = (function () {
       mode_select: 'mode_select',
       mode_fhpath: 'mode_fhpath',
       mode_line: 'mode_line',
-      mode_connect: 'mode_connect',
       mode_rect: 'mode_rect',
       mode_square: 'mode_square',
       mode_fhrect: 'mode_fhrect',
@@ -111,7 +110,6 @@ var svgEditorLang_pt_BR = (function () {
       mode_circle: 'mode_circle',
       mode_fhellipse: 'mode_fhellipse',
       mode_path: 'mode_path',
-      mode_shapelib: 'mode_shapelib',
       mode_text: 'mode_text',
       mode_image: 'mode_image',
       mode_zoom: 'mode_zoom',
@@ -121,7 +119,6 @@ var svgEditorLang_pt_BR = (function () {
       redo: 'redo',
       tool_source: 'tool_source',
       wireframe_mode: 'wireframe_mode',
-      toggle_grid: 'toggle_grid',
       clone: 'clone',
       del: 'del',
       group_elements: 'group_elements',

dist/locale/lang.pt-PT.js

@@ -103,7 +103,6 @@ var svgEditorLang_pt_PT = (function () {
       mode_select: 'mode_select',
       mode_fhpath: 'mode_fhpath',
       mode_line: 'mode_line',
-      mode_connect: 'mode_connect',
       mode_rect: 'mode_rect',
       mode_square: 'mode_square',
       mode_fhrect: 'mode_fhrect',
@@ -111,7 +110,6 @@ var svgEditorLang_pt_PT = (function () {
       mode_circle: 'mode_circle',
       mode_fhellipse: 'mode_fhellipse',
       mode_path: 'mode_path',
-      mode_shapelib: 'mode_shapelib',
       mode_text: 'mode_text',
       mode_image: 'mode_image',
       mode_zoom: 'mode_zoom',
@@ -121,7 +119,6 @@ var svgEditorLang_pt_PT = (function () {
       redo: 'redo',
       tool_source: 'tool_source',
       wireframe_mode: 'wireframe_mode',
-      toggle_grid: 'toggle_grid',
       clone: 'clone',
       del: 'del',
       group_elements: 'group_elements',

dist/locale/lang.ro.js

@@ -103,7 +103,6 @@ var svgEditorLang_ro = (function () {
       mode_select: 'mode_select',
       mode_fhpath: 'mode_fhpath',
       mode_line: 'mode_line',
-      mode_connect: 'mode_connect',
       mode_rect: 'mode_rect',
       mode_square: 'mode_square',
       mode_fhrect: 'mode_fhrect',
@@ -111,7 +110,6 @@ var svgEditorLang_ro = (function () {
       mode_circle: 'mode_circle',
       mode_fhellipse: 'mode_fhellipse',
       mode_path: 'mode_path',
-      mode_shapelib: 'mode_shapelib',
       mode_text: 'mode_text',
       mode_image: 'mode_image',
       mode_zoom: 'mode_zoom',
@@ -121,7 +119,6 @@ var svgEditorLang_ro = (function () {
       redo: 'redo',
       tool_source: 'tool_source',
       wireframe_mode: 'wireframe_mode',
-      toggle_grid: 'toggle_grid',
       clone: 'clone',
       del: 'del',
       group_elements: 'group_elements',

dist/locale/lang.ru.js

@@ -103,7 +103,6 @@ var svgEditorLang_ru = (function () {
       mode_select: 'mode_select',
       mode_fhpath: 'mode_fhpath',
       mode_line: 'mode_line',
-      mode_connect: 'mode_connect',
       mode_rect: 'mode_rect',
       mode_square: 'mode_square',
       mode_fhrect: 'mode_fhrect',
@@ -111,7 +110,6 @@ var svgEditorLang_ru = (function () {
       mode_circle: 'mode_circle',
       mode_fhellipse: 'mode_fhellipse',
       mode_path: 'mode_path',
-      mode_shapelib: 'mode_shapelib',
       mode_text: 'mode_text',
       mode_image: 'mode_image',
       mode_zoom: 'mode_zoom',
@@ -121,7 +119,6 @@ var svgEditorLang_ru = (function () {
       redo: 'redo',
       tool_source: 'tool_source',
       wireframe_mode: 'wireframe_mode',
-      toggle_grid: 'toggle_grid',
       clone: 'clone',
       del: 'del',
       group_elements: 'group_elements',

dist/locale/lang.sk.js

@@ -103,7 +103,6 @@ var svgEditorLang_sk = (function () {
       mode_select: 'mode_select',
       mode_fhpath: 'mode_fhpath',
       mode_line: 'mode_line',
-      mode_connect: 'mode_connect',
       mode_rect: 'mode_rect',
       mode_square: 'mode_square',
       mode_fhrect: 'mode_fhrect',
@@ -111,7 +110,6 @@ var svgEditorLang_sk = (function () {
       mode_circle: 'mode_circle',
       mode_fhellipse: 'mode_fhellipse',
       mode_path: 'mode_path',
-      mode_shapelib: 'mode_shapelib',
       mode_text: 'mode_text',
       mode_image: 'mode_image',
       mode_zoom: 'mode_zoom',
@@ -121,7 +119,6 @@ var svgEditorLang_sk = (function () {
       redo: 'redo',
       tool_source: 'tool_source',
       wireframe_mode: 'wireframe_mode',
-      toggle_grid: 'toggle_grid',
       clone: 'clone',
       del: 'del',
       group_elements: 'group_elements',

dist/locale/lang.sl.js

@@ -103,7 +103,6 @@ var svgEditorLang_sl = (function () {
       mode_select: 'mode_select',
       mode_fhpath: 'mode_fhpath',
       mode_line: 'mode_line',
-      mode_connect: 'mode_connect',
       mode_rect: 'mode_rect',
       mode_square: 'mode_square',
       mode_fhrect: 'mode_fhrect',
@@ -111,7 +110,6 @@ var svgEditorLang_sl = (function () {
       mode_circle: 'mode_circle',
       mode_fhellipse: 'mode_fhellipse',
       mode_path: 'mode_path',
-      mode_shapelib: 'mode_shapelib',
       mode_text: 'mode_text',
       mode_image: 'mode_image',
       mode_zoom: 'mode_zoom',
@@ -121,7 +119,6 @@ var svgEditorLang_sl = (function () {
       redo: 'redo',
       tool_source: 'tool_source',
       wireframe_mode: 'wireframe_mode',
-      toggle_grid: 'toggle_grid',
       clone: 'clone',
       del: 'del',
       group_elements: 'group_elements',

dist/locale/lang.sq.js

@@ -103,7 +103,6 @@ var svgEditorLang_sq = (function () {
       mode_select: 'mode_select',
       mode_fhpath: 'mode_fhpath',
       mode_line: 'mode_line',
-      mode_connect: 'mode_connect',
       mode_rect: 'mode_rect',
       mode_square: 'mode_square',
       mode_fhrect: 'mode_fhrect',
@@ -111,7 +110,6 @@ var svgEditorLang_sq = (function () {
       mode_circle: 'mode_circle',
       mode_fhellipse: 'mode_fhellipse',
       mode_path: 'mode_path',
-      mode_shapelib: 'mode_shapelib',
       mode_text: 'mode_text',
       mode_image: 'mode_image',
       mode_zoom: 'mode_zoom',
@@ -121,7 +119,6 @@ var svgEditorLang_sq = (function () {
       redo: 'redo',
       tool_source: 'tool_source',
       wireframe_mode: 'wireframe_mode',
-      toggle_grid: 'toggle_grid',
       clone: 'clone',
       del: 'del',
       group_elements: 'group_elements',