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

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

Browse Source 
- 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
This commit is contained in:
Brett Zamir
2018-06-06 15:26:20 +08:00
parent 057f5a5dc2
commit a3f0b8e501
334 changed files with 60808 additions and 16650 deletions
Download Patch File Download Diff File Expand all files Collapse all files

50
docs/Acknowledgements.md
View File

@@ -1,36 +1,64 @@
# Projects used by SVG-edit
Like many open source projects, SVG-edit depends on other open source projects. This page acknowledges these projects and the many software developers across the globe without which our software would be sorely lacking.
Like many open source projects, SVG-edit depends on other open source
projects. This page acknowledges these projects and the many software
developers across the globe without which our software would be sorely
lacking.
## jQuery
Jonathan Resig's [jQuery library](https://jquery.com) was chosen as a basis for the project since the beginning. The power of jQuery really lets us focus on the functionality and not worry about all the intricacies of mixing with the HTML, CSS and SVG DOM.
Jonathan Resig's [jQuery library](https://jquery.com) was chosen as a
basis for the project since the beginning. The power of jQuery really
lets us focus on the functionality and not worry about all the intricacies
of mixing with the HTML, CSS and SVG DOM.
## jPicker
Christopher Tillman's awesome [jPicker](http://www.digitalmagicpro.com/jPicker) is used as our fill/stroke picker. The source code repository is now hosted at GoogleCode.
Christopher was gracious enough to take suggestions from Pavol on how to incorporate opacity and some callback functionality back upstream into jPicker.
Christopher Tillman's awesome [jPicker](http://www.digitalmagicpro.com/jPicker/)
is used as our fill/stroke picker. The source code repository is now
hosted at GoogleCode.
Christopher was gracious enough to take suggestions from Pavol on how to
incorporate opacity and some callback functionality back upstream into
jPicker.
## jGraduate
Jeff Schiller created the excellent [jGraduate](https://code.google.com/p/jgraduate/) plugin to select SVG gradients in SVG-edit.
Jeff Schiller created the excellent [jGraduate](https://code.google.com/p/jgraduate/)
plugin to select SVG gradients in SVG-edit.
## canvg
Gabe Lerner's excellent [canvg](https://github.com/gabelerner/canvg) library has helped us bypass browsers' inability to save SVG files an PNGs, by first rendering SVG images in an HTML5 Canvas element.
Gabe Lerner's excellent [canvg](https://github.com/gabelerner/canvg) library
has helped us bypass browsers' inability to save SVG files an PNGs, by
first rendering SVG images in an HTML5 Canvas element.
## jQuery UI
We use [jQuery-UI](https://jqueryui.com) for making the dialog boxes (color picker, document properties) draggable, as well as for the opacity slider.
We use [jQuery-UI](https://jqueryui.com) for making the dialog boxes (color
picker, document properties) draggable, as well as for the opacity slider.
## js-hotkeys
[js-hotkeys](https://github.com/jeresig/jquery.hotkeys) is used to bind all keyboard events in the editor.
[js-hotkeys](https://github.com/jeresig/jquery.hotkeys) is used to bind all
keyboard events in the editor.
## JQuery Web Spin-Button
George Adamson's [Web Spin-Button](http://www.softwareunity.com/jquery/JQuerySpinBtn) provided a starting point to implementing a cross-browser spin control in SVG-edit. A few bugs were fixed with compatibility and sent back to George for hopeful inclusion in the next version of his jQuery plugin.
George Adamson's [Web Spin-Button](http://www.softwareunity.com/jquery/JQuerySpinBtn)
provided a starting point to implementing a cross-browser spin control in
SVG-edit. A few bugs were fixed with compatibility and sent back to George
for hopeful inclusion in the next version of his jQuery plugin.
## SVG Icon Loader
Alexis Deveria's [svg-icon-loader](https://code.google.com/p/svg-icon-loader/) is used to load in all the SVG icons for the SVG-edit user interface.
Alexis Deveria's [svg-icon-loader](https://code.google.com/p/svg-icon-loader/)
is used to load in all the SVG icons for the SVG-edit user interface.
## Icons
Many of the icons used in SVG-edit come from the [Tango Desktop Project](http://tango.freedesktop.org/Tango_Desktop_Project) which are released into the public domain. We also used a couple of icons from the [Silk Icon Project](http://famfamfam.com/lab/icons/silk), which is licensed under the Creative Commons Attribution 2.5 License. Finally, some of the icons were hand-drawn (in SVG-edit itself).
Many of the icons used in SVG-edit come from the [Tango Desktop Project](http://tango.freedesktop.org/Tango_Desktop_Project)
which are released into the public domain. We also used a couple of icons
from the [Silk Icon Project](http://famfamfam.com/lab/icons/silk),
which is licensed under the Creative Commons Attribution 2.5 License.
Finally, some of the icons were hand-drawn (in SVG-edit itself).

120
docs/ConfigOptions.md
View File

@@ -1,120 +0,0 @@
# Introduction
As of version 2.5, SVG-edit has several configuration settings that can be overridden either by adding URL parameters or by setting the options in JavaScript. As of version 2.7, a few among these options related to paths are disallowed via URL though they can still be set by `svgEditor.setConfig`.
## How to set the options
Options can be set using `svgEditor.setConfig(options)`, where `options` is an object literal of keys and values. This must be run before the actual page or DOM is loaded, otherwise it will have no effect. Note that one may create a `svgedit-config-iife.js` file within the project root directory and add such configuration directives to it without needing to modify the repository editor code (and note version 2.8 adds support for a custom.css file for the same purpose).
## Example:
```js
svgEditor.setConfig({
dimensions: [320, 240],
canvas_expansion: 5,
initFill: {
color: '0000FF'
}
});
```
This will set the default width/height of the image, the size of the outside canvas, and the default "fill" color.
The same options can be set in the URL like this:
```
.../svg-editor.html?dimensions=300,240&canvas_expansion=5&initFill[color]=0000FF
```
As of version 2.7, if options are set both using `.setConfig()` as well as in the URL, the `.setConfig()` value will be used. The reverse was true in previous versions but was changed for security reasons.
One may optionally pass another object to `.setConfig()` as the second argument to further adjust configuration behavior.
If an `overwrite` boolean is set to false on this additional object, it will, as occurs with all URL type configurations, prevent the current configuration from overwriting any explicitly set previous configurations. The default is true except for URLs which always are false.
If an `allowInitialUserOverride` boolean is set to true, it will allow subsequent configuration overwriting via URL (e.g., if you do want the user to have the option to override certain or your (`svgedit-config-iife.js`) `.setConfig()` directives via URL while still wishing to provide them with your own default value, you should add this property).
## Configurable options
Note that those items marked as preferences are configuration items which can also be set via the UI (and specifically via Editor Options except where mentioned). Those items which appear in the UI but are not treated internally as preferences are marked with "Maybe" as their status may change.
| Property | Description | Default | Preference |
|:---------|:------------|:--------|:-----------|
| `lang` | Two-letter language code. The language must exist in the Editor Preferences language list | Default to "en" if `locale.js` detection does not detect another language | Yes |
| `bkgd_url` | Background raster image URL. This image will fill the background of the document, useful for tracing purposes | (none) | Yes |
| `img_save` | Defines whether included raster images should be saved as Data URIs when possible, or as URL references. Must be either 'embed' or 'ref'. Settable in the Document Properties dialog. | embed | Yes |
| `dimensions` | The default width/height of a new document. Use an array in `setConfig` (e.g., `[800, 600]`) and comma separated numbers in the URL | `[640, 480]` | Maybe |
| `initFill[color]` | The initial fill color. Must be a hex code string. | FF0000 (solid red) | No |
| `initFill[opacity]` | The initial fill opacity. Must be a number between 0 and 1 | 1 | No |
| `initStroke[color]` | The initial stroke color. Must be a hex code. | 000000 (solid black) | No |
| `initStroke[width]` | The initial stroke width. Must be a positive number. | 5 | No |
| `initStroke[opacity]` | The initial stroke opacity. Must be a number between 0 and 1 | 1 | No |
| `initTool` | The initially selected tool. Must be either the ID of the button for the tool, or the ID without "tool_" prefix_| select | No |
| `exportWindowType` | New as of 2.8. Can be "new" or "same" to indicate whether new windows will be generated for each export; the window.name of the export window is namespaced based on the `canvasName` (and incremented if "new" is selected as the type) | new | No |
| `imgPath` | The path where the SVG icons are located, with trailing slash. Note that as of version 2.7, this is not configurable by URL for security reasons. | `images/` | No |
| `jGraduatePath` | The path where jGraduate images are located. Note that as of version 2.7, this is not configurable by URL for security reasons. | `jgraduate/images/` | No |
| `langPath` | The path where the language files are located, with trailing slash. Note that as of version 2.7, this is not configurable by URL for security reasons. | `locale/` | No |
| `extPath` | The path used for extension files, with trailing slash. Note that as of version 2.7, this is not configurable by URL for security reasons. | `extensions/` | No |
| `extensions` | Extensions to load on startup. Use an array in setConfig and comma separated file names in the URL. Note that as of version 2.7, paths containing "/", "\", or ":", are disallowed for security reasons. Although previous versions of this list would entirely override the default list, as of version 2.7, the defaults will always be added to this explicit list unless the configuration `noDefaultExtensions` is included. | `['ext-overview_window.js','ext-markers.js','ext-connector.js','ext-eyedropper.js','ext-shapes.js','ext-imagelib.js','ext-grid.js','ext-polygon.js','ext-star.js','ext-panning.js','ext-storage.js']` | No |
| `showlayers` | Open the layers side-panel by default | `false` | No |
| `wireframe` | Start in wireframe mode | `false` | No |
| `gridSnapping` | Enable snap to grid by default. Set in Editor Options. | `false` | Maybe |
| `gridColor` | Set in Editor Options. | #000 (black) | Maybe |
| `baseUnit` | Set in Editor Options. | px | Maybe |
| `snappingStep` | Set the default grid snapping value. Set in Editor Options. | 10 | Maybe |
| `showRulers` | Initial state of ruler display (v2.6). Set in Editor Options. | `true` | Maybe |
| `no_save_warning` | A boolean that when `true` prevents the warning dialog box from appearing when closing/reloading the page. Mostly useful for testing. | `false` | No |
| `canvas_expansion` | The minimum area visible outside the canvas, as a multiple of the image dimensions. The larger the number, the more one can scroll outside the canvas. | 3 | No |
| `show_outside_canvas` | A boolean that defines whether or not elements outside the canvas should be visible; set by `svgcanvas.js` | `true` | No |
| `iconsize` | Size of the toolbar icons. Must be one of the following: 's', 'm', 'l', 'xl' | Will default to 's' if the window height is smaller than the minimum height and 'm' otherwise | Yes |
| `bkgd_color` | Canvas background color | #FFF (white) | Yes |
| `selectNew` | Initial state of option to automatically select objects after they are created (v2.6) | `true` | No |
| `save_notice_done` | Used to track alert status | `false` | Yes |
| `export_notice_done` | Used to track alert status | `false` | Yes |
| `allowedOrigins` | Used by `ext-xdomain-messaging.js` to indicate which origins are permitted for cross-domain messaging (e.g., between the embedded editor and main editor code). Besides explicit domains, one might add '' to allow all domains (not recommended for privacy/data integrity of your user's content!), `window.location.origin` for allowing the same origin (should be safe if you trust all apps on your domain), 'null' to allow `file://` URL usage| `[]` | Maybe |
| `canvasName` | Used to namespace storage provided via `ext-storage.js`; you can use this if you wish to have multiple independent instances of SVG Edit on the same domain | default | No |
| `initOpacity` | Initial opacity (multiplied by 100) | 1 | No |
| `colorPickerCSS` | Object of CSS properties mapped to values (for jQuery) to apply to the color picker. A `null` value (the default) will cause the CSS to default to `left` with a position equal to that of the fill_color or stroke_color element minus 140, and a `bottom` equal to 40 | `null` (see description) | No |
| `preventAllURLConfig` | Set to `true` (in `svgedit-config-iife.js`; extension loading is too late!) to override the ability for URLs to set non-content configuration (including extension config) | `false` | No |
| `preventURLContentLoading` | Set to `true` (in `svgedit-config-iife.js`; extension loading is too late!) to override the ability for URLs to set URL-based SVG content | `false` | No |
| `lockExtensions` | Set to `true` (in `svgedit-config-iife.js`; extension loading is too late!) to override the ability for URLs to set their own extensions; disallowed in URL setting. There is no need for this when `preventAllURLConfig` is used. | `false` | No |
| `noDefaultExtensions` | If set to `true`, prohibits automatic inclusion of default extensions (though "extensions" can still be used to add back any desired default extensions along with any other extensions); can only be meaningfully used in `svgedit-config-iife.js` or in the URL | `false` | No |
| `showGrid` | Set by `ext-grid.js`; determines whether or not to show the grid by default | `false` | No |
| `noStorageOnLoad` | Some interaction with `ext-storage.js`; prevents even the loading of previously saved local storage | `false` | No |
| `forceStorage` | Some interaction with `ext-storage.js`; strongly discouraged from modification as it bypasses user privacy by preventing them from choosing whether to keep local storage or not | `false` | No |
| `emptyStorageOnDecline` | Used by `ext-storage.js`; empty any prior storage if the user declines to store | `false` | No |
| `paramurl` | This is available via URL only. Deprecated and removed in trunk. Allowed an un-encoded URL within the query string (use "url" or "source" with a data: URI instead) | (None) | No |
| `selectNew` | Set by svgcanvas.js; used by mouseUp; it true, will replace the selection with the current element and show grips | `true` | No |
| `stylesheets` | An array of required stylesheets to load in parallel; include the value `'@default'` within this array to ensure all default stylesheets are loaded | `['@default']` | No |
## Preload a file
It is also possible to start the editor with preloaded SVG file, using the following methods.
However, one should bear in mind that if one wishes to immediately set a particular string, especially if in `svgedit-config-iife.js` (and prevent the user from saving their own text), one should first set the config option "noStorageOnLoad" to false or otherwise any previous local storage may overwrite your own string.
```js
// Serialized string:
svgEditor.loadFromString('...');
// Data URI:
svgEditor.loadFromDataURI('data:image/svg+xml;base64,...');
// Local URL:
svgEditor.loadFromURL('images/logo.svg');
```
Or as URL parameter:
```js
// Data URI
'?source=' + encodeURIComponent('data:image/svg+xml;utf8,') + encodeURIComponent(/*...*/)
// Data URI (base 64):
'?source=' + encodeURIComponent('data:image/svg+xml;base64,' + /* ... */); // data%3Aimage%2Fsvg%2Bxml%3Bbase64%2C ...
// Local URL:
'?url=' + encodeURIComponent('images/logo.svg'); // images%2Flogo.svg
```
**Note:** There is currently a bug that prevents data URIs ending with equals (=) characters from being parsed. Removing these characters seem to allow the import to work as expected.

319
docs/ExtensionDocs.md
View File

@@ -1,319 +0,0 @@
# Introduction
As of version 2.5, SVG-Edit has support for extensions. This an (in-progress) guide for creating SVG-Edit plugins.
## Basic format
SVG-Edit plugins are standalone JavaScript files that can be either included in the HTML file or loaded using setConfig or through the URL (see ConfigOptions for usage).
Note that if you create a `svgedit-config-iife.js` file in the project root directory, this will be used to execute commands before extensions are loaded, e.g., if you wish to make configuration changes which affect extension loading behavior. Normally, however, it should be preferable for modularity to use the extension mechanism, as this can allow you or users to customize which extensions are loaded (whereas `svgedit-config-iife.js` will always run if present).
This is the general format for an extension:
```js
svgEditor.addExtension('extensionName', function (methods) {
return extensionData;
});
```
The first parameter (`extensionName`) is the unique name for this extension.
The second parameter is a function that supplies methods and variables from svgCanvas and can return an object that includes properties and functions related to the extension.
The basic Hello world extension can be used as an example on how to create a basic extension. This extension adds a "mode" button to the bottom of the left panel that changes the mode, then shows a "Hello world" message whenever the canvas is clicked on. See [extension in action](https://svg-edit.github.io/svgedit/releases/svg-edit-2.8.1/svg-editor.html?extensions=ext-helloworld.js).
The basic structure of this plugin looks like this:
```js
svgEditor.addExtension('Hello World', function () {
// Returning an object is optional as of v2.7+
return {
// name: '', // A name has traditionally been added but apparently not needed?
svgicons: 'extensions/helloworld-icon.xml',
buttons: [{...}],
mouseDown() {
...
},
mouseUp(opts) {
...
}
};
});
```
Note how the returned properties include information on the buttons, as well as the functions that should be run when certain events take place.
An object can be provided in place of a function in which case, `callback` will be bound with the same arguments supplied to the callback.
The callback is invoked upon addition of the extension, or, if svgicons are set, then after the icons are ready.
## Creating buttons
Buttons can appear either in the mode panel (left panel) or the context panel (top panel, changes depending on selection). Their icons can either consist of SVG icons (recommended) or just raster images.
Each button is an object with the following properties (added to the array "buttons" on the object provided by the extension):
| Property | Description | Required? |
|:---------|:------------|:----------|
| `id` (string) | A unique identifier for this button. If SVG icons are used, this must match the ID used in the icon file. | Yes |
| `type` (string) | Type of button. Must be either 'mode' or 'context' | Yes |
| `title` (string) | The tooltip text that will appear when the user hovers over the icon | Yes |
| `icon` (string) | The file path to the raster version of the icon. | Only if no svgicons is supplied |
| `svgicon` (string) | If absent, will utilize the button "id"; used to set "placement" on the svgIcons call | No |
| `list` (string) | Points to the "id" of a context_tools item of type "button-select" into which the button will be added as a panel list item | No |
| `position` (integer) | The numeric index for placement; defaults to last position (as of the time of extension addition) if not present | No |
| `panel` (string) | The ID of the context panel to be included, if type is "context". | Only if type is "context" |
| `events` (object) | DOM event names with associated functions. Example: {click: function() { alert('Button was clicked') } } | Yes |
| `includeWith` (object) | Object with flyout menu data (see following properties) | No |
| `includeWith[button]` (string) | jQuery selector of the existing button to be joined. Example: '#tool_line' | Yes (if includeWith is used) |
| `includeWith[isDefault]` (boolean) | Option indicating whether button is default in flyout list or not | No |
| `isDefault` (boolean) | Whether or not the default is the default | No |
| `includeWith[position]` (integer) | Position of icon in flyout list, will be added to end if not indicated | No |
| `key` (string) | The key to bind to the button | No |
## Creating SVG icons
The SVG-Edit project uses icons created using basic SVG (generally using SVG-Edit as design tool), and extensions are encouraged to do so too. This allows the interface toolbars to be resized and icons to be reused at various sizes. If your extension uses multiple icons, they can all be stored in the same file. To specify icon file used, set the path under the extension's returned svgicons property.
An SVG icon file is an XML document that consists of a root SVG element with child group elements (`<g></g>`). Each of these has an ID that should match the ID specified in the associated button object. Its content should be the SVG source of the icon. See the Hello World icon as an example.
For further information, see the SVG Icon Loader project.
## Creating context tools
Context tools appear in the top toolbar whenever a certain type of element is selected.
These are added by the extension returning an object with the property "context_tools".
| Property | Description | Required? |
|:---------|:------------|:----------|
| `panel` (string) | The ID of the existing panel for the tool to be added to | Yes |
| `container_id` (string) | The ID to be given to the tool's container element | No |
| `type` (string) | The type of tool being added. Must be one of the following: 'tool_button', 'select', 'input' | Yes |
| `id` (string) | The ID of the actual tool element | Yes |
| `events` (object) | DOM event names with associated functions. Example: {change: function() { alert('Option was changed') } } | Yes |
| `options` (object) | List of options and their labels for select tools. Example: `{1: 'One', 2: 'Two', all: 'All' } | Only for "select" tools |
| `defval` (string) | Default value | No |
| `label` (string) | Label associated with the tool, visible in the UI | No |
| `title` (string) | The tooltip text that will appear when the user hovers over the tool | Yes |
| `size` (integer) | Value of the "size" attribute of the tool input | No |
| `spindata` (object) | When added to a tool of type "input", this tool becomes a "spinner" which allows the number to be in/decreased. For data required see The SpinButton script | No |
| `colnum` (integer) | Added as part of the option list class. | No |
## SVG-Edit events
Most plugins will want to run functions when certain events are triggered. This is a list of the current events that can be hooked onto. All events are optional.
| Event | Description | Parameters | Return value expected |
|:------|:------------|:-----------|:----------------------|
| `mouseDown` | The main (left) mouse button is held down on the canvas area | Supplies an object with these properties: `evt` (the event object), `start_x` (x coordinate on canvas), `start_y` (y coordinate on canvas), `selectedElements` (an array of the selected Elements) | An optional object with started: true to indicate that creating/editing has started |
| `mouseMove` | The mouse is moved on the canvas area | Same as for `mouseDown`, but with a selected property that refers to the first selected element | None |
| `mouseUp` | The main (left) mouse button is released (anywhere) | Same as for `mouseDown` | An optional object with these properties: `element` (the element being affected), `keep` (boolean that indicates if the current element should be kept) `started` (boolean that indicates if editing should still be considered as "started") |
| `zoomChanged` | The zoom level is changed | Supplies the new zoom level as a number (not percentage) | None |
| `selectedChanged` | The element selection has changed (elements were added/removed from selection | Supplies an object with these properties: `elems` (array of the newly selected elements), `selectedElement` (the single selected element), `multiselected` (a boolean that indicates whether one or more elements was selected) | None |
| `elementChanged` | One or more elements were changed | Object with properties: `elems` (array of the affected elements) | None |
| `elementTransition` | Called when part of element is in process of changing, generally on mousemove actions like rotate, move, etc. | Object with properties: `elems` (array of transitioning elements) | None |
| `toolButtonStateUpdate` | The bottom panel was updated | Object with these properties: `nofill` (boolean that indicates fill is disabled), `nostroke` (boolean that indicates stroke is disabled) | None |
| `langChanged` | The language was changed | Two-letter code of the new language | None |
| `langReady` | Invoked as soon as the locale is ready | An object with properties "lang" containing the two-letter language code and "uiStrings" as an alias for svgEditor.uiStrings | None |
| `addlangData` | Means for an extension to add locale data | The two-letter language code | Object with "data" property set to an object containing two-letter language codes keyed to an array of objects with "id" and "title" or "textContent" properties |
| `canvasUpdated` | Invoked upon updates to the canvas | Object with properties: new_x, new_y, old_x, old_y, d_x, d_y | None |
| `IDsUpdated` | When `pasteElements` called from paste action (context menu or key) | An object with `elems` array and `changes` object (mapping past ID (on attribute) to current ID) Object with `remove` array containing string IDs (used by `ext-connector.js`)
| `onNewDocument` | Called when new image is created | None | None |
| `workareaResized` | Called when sidepanel is resized or toggled | None | None |
## Helper functions
A variety of methods can be accessed within plugins. In the future, we hope to have them all properly documented, for now here is the current list of function/variable names.
## `svgCanvas` variables
These are supplied in an object through the first parameter of the extension function (see "methods" variable in above example).
| Name | Description |
|:-----|:------------|
| `svgroot` (element) | The workarea's root SVG element. NOT the root SVG element of the image being edited |
| `svgcontent` (element) | The root SVG element of the image being edited |
| `nonce` (number) | The unique identifier given to this image |
| `selectorManager` (object) | The object that manages selection information |
## `svgEditor` public methods
| Name | Description | Params | Return value |
|:-----|:------------|:-------|:-------------|
| `setCustomHandlers()` | Override default SVG open, save, and export behaviors | Accepts object with all optional properties, `open`, `save`, and `exportImage`; `open` is not passed any parameters; `saved` is passed a string containing the SVG; `exportImage` is passed an object containing the properties: `svg` with the SVG contents as a string, `datauri` with the contents as a data URI, `issues` with an array of UI strings pertaining to relevant known CanVG issues, `type` indicating the chosen image type ("PNG", "JPEG", "BMP", "WEBP") (or, as planned for 3.0.0, "PDF" type), `mimeType` for the MIME type, `exportWindowName` as a convenience for passing along a window.name to target a window on which the export could be added, and `quality` as a decimal between 0 and 1 (for use with JPEG or WEBP) | (None) | | ... | ... | ... | ... |
## `svgCanvas` private methods
These are supplied in an object through the first parameter of the extension function (see `methods` variable in above example).
| Name | Description |
|:-----|:------------|
| `addCommandToHistory()` | |
| `addGradient()` | |
| `addSvgElementFromJson()` | |
| `assignAttributes()` | |
| `BatchCommand()` | |
| `call()` | |
| `ChangeElementCommand()` | |
| `cleanupElement()` | |
| `copyElem()` | |
| `ffClone()` | |
| `findDefs()` | |
| `findDuplicateGradient()` | |
| `fromXml()` | |
| `getElem()` | |
| `getId()` | |
| `getIntersectionList()` | |
| `getNextId()` | |
| `getPathBBox()` | |
| `getUrlFromAttr()` | |
| `hasMatrixTransform()` | |
| `identifyLayers()` | |
| `InsertElementCommand()` | |
| `isIdentity()` | |
| `logMatrix()` | |
| `matrixMultiply()` | |
| `MoveElementCommand()` | |
| `preventClickDefault()` | |
| `recalculateAllSelectedDimensions()` | |
| `recalculateDimensions()` | |
| `remapElement()` | |
| `RemoveElementCommand()` | |
| `removeUnusedGrads()` | |
| `resetUndoStack()` | |
| `round()` | |
| `runExtensions()` | |
| `sanitizeSvg()` | |
| `Selector()` | |
| `SelectorManager()` | |
| `shortFloat()` | |
| `svgCanvasToString()` | |
| `SVGEditTransformList()` | |
| `svgToString()` | |
| `toString()` | |
| `toXml()` | |
| `transformBox()` | |
| `transformListToTransform()` | |
| `transformPoint()` | |
| `transformToObj()` | |
| `walkTree()` | |
## `svgCanvas` public methods
| Name | Description |
|:-----|:------------|
| `addToSelection()` | |
| `alignSelectedElements()` | |
| `beginUndoableChange()` | |
| `bind()` | |
| `changeSelectedAttribute()` | |
| `changeSelectedAttributeNoUndo()` | |
| `clear()` | |
| `clearSelection()` | |
| `cloneSelectedElements()` | |
| `convertToPath()` | |
| `createLayer()` | |
| `cycleElement()` | |
| `deleteCurrentLayer()` | |
| `deleteSelectedElements()` | |
| `each()` | |
| `embedImage()` | |
| `finishUndoableChange()` | |
| `fixOperaXML()` | |
| `getBBox()` | |
| `getBold()` | |
| `getContentElem()` | |
| `getCurrentLayer()` | |
| `getEditorNS()` | |
| `getFillColor()` | |
| `getFillOpacity()` | |
| `getFontFamily()` | |
| `getFontSize()` | |
| `getHistoryPosition()` | |
| `getImageTitle()` | |
| `getItalic()` | |
| `getLayer()` | |
| `getLayerOpacity()` | |
| `getLayerVisibility()` | |
| `getMode()` | |
| `getNextRedoCommandText()` | |
| `getNextUndoCommandText()` | |
| `getNumLayers()` | |
| `getOffset()` | |
| `getOpacity()` | |
| `getPrivateMethods()` | |
| `getRedoStackSize()` | |
| `getResolution()` | |
| `getRootElem()` | |
| `getRotationAngle()` | |
| `getSelectedElems()` | |
| `getStrokeColor()` | |
| `getStrokeOpacity()` | |
| `getStrokeStyle()` | |
| `getStrokeWidth()` | |
| `getStrokedBBox()` | |
| `getSvgString()` | |
| `getText()` | |
| `getTransformList()` | |
| `getUndoStackSize()` | |
| `getUrlFromAttr()` | |
| `getVersion()` | |
| `getVisibleElements()` | |
| `getZoom()` | |
| `groupSelectedElements()` | |
| `importSvgString()` | |
| `isValidUnit()` | |
| `linkControlPoints()` | |
| `matrixMultiply()` | |
| `moveSelectedElements()` | |
| `moveSelectedToLayer()` | |
| `moveToBottomSelectedElement()` | |
| `moveToTopSelectedElement()` | |
| `open()` | |
| `randomizeIds()` | |
| `ready()` | |
| `redo()` | |
| `removeFromSelection()` | |
| `renameCurrentLayer()` | |
| `runExtensions()` | |
| `save()` | |
| `selectAllInCurrentLayer()` | |
| `setBBoxZoom()` | |
| `setBackground()` | |
| `setBold()` | |
| `setConfig()` | |
| `setCurrentLayer()` | |
| `setCurrentLayerPosition()` | |
| `setFillColor()` | |
| `setFillOpacity()` | |
| `setFillPaint()` | |
| `setFontFamily()` | |
| `setFontSize()` | |
| `setIdPrefix()` | |
| `setImageTitle()` | |
| `setImageURL()` | |
| `setItalic()` | |
| `setLayerOpacity()` | |
| `setLayerVisibility()` | |
| `setMode()` | |
| `setOpacity()` | |
| `setRectRadius()` | |
| `setResolution()` | |
| `setRotationAngle()` | |
| `setSegType()` | |
| `setStrokeColor()` | |
| `setStrokeOpacity()` | |
| `setStrokePaint()` | |
| `setStrokeStyle()` | |
| `setStrokeWidth()` | |
| `setSvgString()` | |
| `setTextContent()` | |
| `setUiStrings()` | |
| `setZoom()` | |
| `smoothControlPoints()` | |
| `undo()` | |
| `ungroupSelectedElement()` | |
| `updateCanvas()` | |
| `updateElementFromJson()` | |

54
docs/FrequentlyAskedQuestions.md
View File

@@ -1,54 +0,0 @@
**NOTE: The following may contain outdated content.**
**Q: Why doesn't SVG-edit work in Internet Explorer 6-7-8?**
A: SVG-edit only works in IE6-7-8 if you have installed the Google Chrome Frame plugin. Internet Explorer 8 and under do not natively support Scalable Vector Graphics (SVG), however IE9+ does, and thus is supported starting in SVG-edit 2.6
In theory there are several other possibilities that could allow SVG-edit to work in IE: * someone gets it to work with the SVG Web shim * someone gets it to work with IE and the Adobe SVG Viewer * someone gets it to work with another SVG plugin
**Q: How can I make SVG-edit save files on my server?**
A: As of SVG-edit 2.5.1, an extension is available that overrides the default open/save behavior and instead uses PHP files to allow proper open/save dialog boxes. You can include the extension by adding `ext-server_opensave.js` to the `curConfig.extension` array in `svg-editor.js` or through other methods mentioned on our ConfigOptions page.
For other server-saving behavior you'll want to modify `ext-server_opensave.js` or the `filesave.php` file, both available under `editor/extensions/`.
**Q: How can I set the stroke to 'none'?**
A: Shift-clicking palette squares sets the Stroke paint value. Thus, you can shift-click on the None box (red x on white background) to clear the Stroke paint.
**Q: How can I help?**
A: See How to participate
**Q: How can I select an element when it's hidden or behind another one?**
A: Select an object. Shift+O will select the previous object Shift+P will select the next object. Using the wireframe mode may also help in seeing hidden objects.
**Q: How can I edit shapes that have been grouped?**
A: Double-click the group and you will shift the editing context to the group. The rest of the image will not be editable while you are in the group context. Once you are done editing inside the group, press Escape.
**Q: Can I trace over a raster (PNG, JPEG...) image?**
A: Yes, there are two methods you can use as of SVG-edit 2.4. 1. Go to the Document Properties, and enter the URL of the image under "Editor Background". This image will then fill the background without being saved as part of the image.
Add a layer from the layer panel. Then draw a raster image (image icon) and enter your URL. Use the layer above this one to trace over the image without moving. Note that you can also hide/show layers to help your work.
**Q: How do I use the Wave Gadget?**
A: (Note that this information refers to the SVG-edit 2.3 Wave Gadget, the Wave Gadget has not been worked on for years though) Go to this wave wavesandbox.com!w+W7VzCLZk%A and there will be a button on the bottom that says "Install" and when you are editing things, you will see a SVG-edit icon in your toolbar that you can click to include the gadget into any blip.
**Q: How do I copy the style of an object to other(s)?**
A:
- Select the object you want to copy the style from. You'll see its Fill and Stroke style attributes displayed in the bottom toolbar.
- Holding Shift to keep the first object selected, select one or several other objects.
- Open the colorpicker by clicking on the color blocks in the bottom toolbar. If you want to copy the fill, select the Fill block. If you want to copy the stroke, select the Stroke block.
- Hit "Ok" in the colorpicker
The other objects will get the Fill or the Stroke of the first object.
**Q: How can I serve SVG graphic editor from my own server?**
A: You need to download the latest version to your server and unzip. The exact commands/instructions are here: <http://howik.com/Improve_your_user%27s_experience_by_adding_svg_graphic_editor_to_your_website_in_less_than_2_minutes>

20
docs/ReleaseInstructions.md
View File

@@ -1,5 +1,17 @@
# Creating a new svg-edit release
## Prepare
1. `npm test` - Ensure tests are passing
1. `npm run build-doc` - Ensure JSDoc can build
1. `npm run grep-doc` - For JSDoc, we ensure that a minimum of generic types
have been added (e.g., "number" should instead be "Float" or "Array",
and "object", "function", or "array" should be replaced by more specific
`@interface`s, `@typdef`s, or `@callback`. Deriving types can use
`PlainObject` or `GenericArray` to indicate the simple base type was
intentional. `*` should also be checked. The script reports all failing
matches within `editor`. There should be none.
## Update the main project
<!--
1. Update the VERSION variable in Makefile.
@@ -22,8 +34,8 @@ The above steps can be done on a fork and committed via a pull request.
1. Ensure you are on the `master` branch with `git checkout master`.
1. Switch to the `gh-pages` branch with `git checkout gh-pages`.
1. Copy the `svg-edit-X.Y` directory to `releases/svg-edit-X.Y` (minus
`.git` and `.gitignore` and including the working built
1. Copy the `svg-edit-X.Y` directory to `releases/svg-edit-X.Y` and to
`latest/` (minus `.git` and `.gitignore` and including the working built
`svgedit-config-es.js` and `svgedit-config-iife.js` files).
1. Commit these changes with `git commit -m "Updating files for release X.Y"`.
1. Switch back to the `master` branch with `git checkout master`.
@@ -55,4 +67,6 @@ You will need to be a member of the SVG-Edit GitHub group to do this step.
## Update the project docs
Update `README.md` with references and links to the shiny new release.
Ensure `README.md` has references and links to the shiny new release.
This will probably not be needed if the `latest` directory continues to
be preferred over hard-coding links to particular releases.

2017
docs/SvgCanvas.md
View File

File diff suppressed because it is too large Load Diff

11
docs/Testing.md Normal file
View File

@@ -0,0 +1,11 @@
# Testing
1. Ensure tests are passing via `npm test`. This will lint and build
files and run `/test/all_tests.html`.
2. Spot check extensions (until we have tests). The following URL includes all:
http://localhost:8000/editor/svg-editor-es.html?extensions=ext-arrows.js,ext-closepath.js,ext-connector.js,ext-eyedropper.js,ext-foreignobject.js,ext-grid.js,ext-helloworld.js,ext-imagelib.js,ext-markers.js,ext-mathjax.js,ext-overview_window.js,ext-panning.js,ext-php_savefile.js,ext-polygon.js,ext-server_moinsave.js,ext-server_opensave.js,ext-shapes.js,ext-star.js,ext-storage.js,ext-webappfind.js,ext-xdomain-messaging.js
3. Ensure both the ES6 Modules HTML file (`svg-editor-es.html`) and
regular file (`svg-editor.html`) are working.

1
docs/from-old-wiki/BigBlueButton.md Normal file
View File

@@ -0,0 +1 @@
http://www.bigbluebutton.org/

151
docs/from-old-wiki/BrowserBugs.md Normal file
View File

@@ -0,0 +1,151 @@
Introduction
While working on SVG-edit, a number of SVG-related browser bugs were encountered. This page serves to highlight these bugs so they can hopefully be fixed in future versions by the browser makers.
Bugs
Firefox
SVG Files in data: cannot reference elements internally
If you click 'Save' in the browser-based editor, Firefox will show all gradients as black and all markers will be invisible. This is because Firefox doesn't support fragment URIs within a data: URI.
Version(s): 4.0-
Bug Report: https://bugzilla.mozilla.org/show_bug.cgi?id=308590
Workaround in SVG-edit: None. This is now only a problem for obsolete versions of Firefox.
Symbol elements cannot reference elements internally
Importing an image with a symbol element that includes gradients results in all the gradient-filled elements being black.
Version(s): 4.0-
Bug Report: https://bugzilla.mozilla.org/show_bug.cgi?id=353575
Workaround in SVG-edit: None yet
Group Opacity has terrible performance
Problem: When an image has many elements with the opacity attribute set to values less than 1.0, the image (and the editor) cause Firefox to become very slow.
Version(s): 3.5-
Bug Report: https://bugzilla.mozilla.org/show_bug.cgi?id=309782
Other bugs related to Bug 309782: * https://bugzilla.mozilla.org/show_bug.cgi?id=523481 * https://bugzilla.mozilla.org/show_bug.cgi?id=524089
Workaround in SVG-edit: Not really. One option is to avoid using the group_opacity control and change the stroke-opacity and fill-opacity instead.
Rotating text element with gradient
Problem: When a text element has a gradient set and is rotated, the individual glyphs are incorrectly repositioned.
Version(s): All, but only on Mac OSX 10.5 (10.6 is fine)
Bug report: https://bugzilla.mozilla.org/show_bug.cgi?id=519472
Workaround in SVG-edit: No, does not appear possible.
BBoxes for groups and symbols ignore horizontal/vertical lines
Problem: When a group or symbol element contains a horizontal or vertical line, getBBox() ignores the line and thus provides an incorrect rectangle.
Version(s): All
Bug report: None yet
Workaround in SVG-edit: Resource-heavy workaround script (for 2.6)
Opera
Does not support the W3C File API
Problem: Cannot open local files in the browser version of SVG-edit in Opera.
Workaround: Use the widget version.
Webkit
Path Segments and Points Normalized
Problem: Webkit internally normalizes path segments and point lists and does not provide the original string.
Version(s): All, Safari & Chrome
Bug reports: * https://bugs.webkit.org/show_bug.cgi?id=26487 * https://bugs.webkit.org/show_bug.cgi?id=29870
Workaround in SVG-edit: Handle all path segment types and check if commas are present in the point list.
Relative Path Segments Cannot be Added/Removed
Problem: Manipulating segments using insertItemBefore, removeItem, etc fail to actually affect path elements made of relative segments.
Version(s): All, Safari & Chrome
Bug reports: * https://bugs.webkit.org/show_bug.cgi?id=30219
Workaround in SVG-edit: Convert all paths to use absolute segments.
@transform value is unreliable (Safari only)
Problem: WebKit fails to update the value of the @transform attribute after changes are made to its transformlist.
Version(s): Safari (should be fixed in next version after 5)
Bug reports: * None yet, related bug here: https://bugs.webkit.org/show_bug.cgi?id=31119
Workaround in SVG-edit: Implement our own "shim" version of SVGTransformList
getBBox on paths with curves includes control points
Problem: Calling getBBox() on a path with curves returns a box that is too big, as the control points are incorrectly included in the size.
Version(s): All, Safari & Chrome
Bug reports: * https://bugs.webkit.org/show_bug.cgi?id=53512
Workaround in SVG-edit: Implement our own "shim" version of getBBox for paths.
USE element is not repositioned when moved to x=0 y=0 through script
Problem: Attempting to set any USE element (like when importing SVGs) to position 0,0 has no visible effect. This may occur by doing undo after moving it or by setting the values as attributes.
Version(s): All, Safari & Chrome
Bug reports: * https://bugs.webkit.org/show_bug.cgi?id=53767
Workaround in SVG-edit: Removing then re-adding the element seems to take care of this.
Failure to detect camelCase elements
Problem: WebKit is unable to detect elements like linearGradient using querySelectorAll or getElementsByTagName.
Bug reports: * https://bugs.webkit.org/show_bug.cgi?id=46800
Workaround in SVG-edit: Search through all elements, then check their tagName value
Data URL page cannot be saved (Chrome only)
Problem: When using the default save handler, the SVG image is opened in a new tab, but there is no method to save the file.
Version(s): Chrome 5+
Bug reports: * http://code.google.com/p/chromium/issues/detail?id=46735
Workaround in SVG-edit: Open the source editor instead, advising user to copy & paste from there
Does not support the W3C File API (Safari only)
Problem: Cannot open local files in browser-based version of SVG-edit
Bug Reports: * https://bugs.webkit.org/show_bug.cgi?id=32624
Workaround: Copy contents of file and paste in via SVG-edit source editor
BBoxes for groups and symbols ignore horizontal/vertical lines
Problem: When a group or symbol element contains a horizontal or vertical line, getBBox() ignores the line and thus provides an incorrect rectangle.
Version(s): All
Bug report: None yet
Workaround in SVG-edit: Resource-heavy workaround script (for 2.6)
Missing SVG support desired in SVG-edit
Internet Explorer
Feature: Native support of SVG, Version(s): IE8-, Workaround: For all versions prior to IE9, use the Google Chrome Frame plugin. IE9 supported in SVG-edit 2.6
Firefox
Feature: SMIL (animation), Version(s): All, Workaround: None
Feature: SVG Text Selection, Version(s): All, Workaround: None
Webkit
Feature: SVG Filters, Version(s): Safari 5-, Chrome 4-, Workaround: Wait, SVG Filters are now implemented in the WebKit trunk
Feature: Save as SVG in Safari, Version: Windows, Workaround: None, https://bugs.webkit.org/show_bug.cgi?id=25265
Feature: Non-Scaling-Stroke, Version(s): Safari 5- Workaround: Re-calculate stroke manually, wait until Safari is updated (fixed in WebKit trunk)

49
docs/from-old-wiki/CodeRefactoring.md Normal file
View File

@@ -0,0 +1,49 @@
Introduction
SVG-edit started out as a much tinier project contained in just two JS files: svg-editor.js (essentially the editor UI) and svgcanvas.js (everything else). Over time, as SVG-edit has gained more and more features, these files naturally grew in size. And while extensions were introduced as one mechanism to separate features from the main code base, by Oct 2010, svgcanvas.js had reached 11,600 lines of JavaScript.
My main concern with this was that one giant JS file, no matter how well-commented and organized, cannot attract new developers. It's just too daunting to try and find out how the project works when it's one giant file. In a project that relies on casual contributors finding spare time, this is a huge problem. I experienced this first hand, since I had stopped heavily contributing to the project earlier in 2010 and then tried to come back near the end of 2010 and found myself lost.
The other problem is that the only realistic way of testing any new change was to invoke the editor and try out the feature. While this is a really good way to ensure your new feature works, it doesn't catch if you've broken other existing features. Over time, codebases that only rely on manual testing are bound to make less and less progress.
History
I'll note that a call to split out JS functionality into separate files was made by Narendra back in 2009 (when he had gone away from the project and tried to come back). He had even contributed new code in the form of a separate script to deal with localization, which was great. But at the time I didn't really know how I wanted to deal with modularization in a web app. I didn't want to be making separate GET requests for every script tag, and even his attempt with locale.js bothered me just a little. Plus, development was hot and heavy on new features ;)
But now that I was in Narendra's shoes and the amount of code had gone up by an order of magnitude, I realized how important it was. With this in mind, I set out to try and break apart the code a little bit. Starting with [r1817](https://code.google.com/p/svg-edit/source/detail?r=1817), I managed to split out some bits of code into a separate JS file. My goal in the refactoring was to make incremental changes that carefully started to split apart the code but didn't introduce any new bugs. I haven't been entirely successful in this, but there haven't been any major disasters, at least.
I eventually worked things out such that code that had been refactored lived somewhere under the 'svgedit' global namespace. The end goal is for everything to live under this namespace, but for now there are pieces that don't (svgEditor and svgCanvas).
For instance, browser.js introduces the following:
svgedit.browser.isOpera() svgedit.browser.isWebkit() svgedit.browser.isGecko() svgedit.browser.supportsSelectors() svgedit.browser.supportsPathReplaceItem() etc...
Here's a bullet-point summary of the state of affairs:
Development versions of SVG-edit now have many <script> tags that load in all the JS modules.
The dependencies between these files are currently maintained manually, the JS files must be loaded in the correct order
Each new JS module has a corresponding test file under test/.
The Makefile has been updated to compile all the JS modules using the Closure Compiler. This collapses all the JS into one compiled file and reduces the number of GET requests back to a sane level for a release version of SVG-edit.
NOTE: This is an ongoing effort. It's not done, and I don't know if it will ever be done. Currently svgcanvas.js is still around 8800 lines of code and occasionally growing. My silly benchmark for this effort is to have every file browsable online in Google Code :) Don't browse to svgcanvas.js in googlecode today. My browser grinds to a halt.
Unit Tests
As I refactor, I am taking the opportunity to add unit tests for each module/function/class refactored. As of Jan 2010, we are close to 500 unit tests. They are all ran at http://svg-edit.googlecode.com/svn/trunk/test/all_tests.html
Current Tasks
1) I introduced the concept of a Drawing earlier on that would encapsulate the state of a single open SVG document. The SVG editor has a handle to the current drawing and uses that instead of accessing svg DOM elements directly. Eventually all code that deals with layers, current editing context, document history and more will be moved into draw.js but for now, much of that code still lives in svgcanvas.js.
2) I'm in the process of migrating a large chunk of svgcanvas.js called "pathActions" into its own module (path.js). This piece of code did have a lot of dependencies so moving it piece-by-piece seemed like the right way to go. Currently it's about half-way migrated, with most of the 'public API' still living in svgcanvas.js.
TODOs
Finish moving layers functionality into the Drawing class
Move current_group and context functionality into Drawing
Move setSvgString() and importSvgString() into a module
Move pathActions into its own module
Regenerate API documentation
Determine how to convince the Closure Compiler to compile svgedit.browser.isOpera() into svgedit$browser$isOpera() so that it can also be optimized (reduces compiled file size and saves in run-time cost).
...
I have some other things I intend to investigate:
Moving to something that uses jscode instead of our existing documentation style
Moving to using a bit of Closure (for goog.require/provide). My concern with this is that there is significant overlap between Closure and jQuery and I'd want to make sure we are not pulling in code that we don't need.

28
docs/from-old-wiki/CommitPolicy.md Normal file
View File

@@ -0,0 +1,28 @@
If you want commit access, just ask marclaporte at gmail.com. We need your Gmail or Google account. Keep in mind that SVG-edit is widely used and changes can have unexpected consequences. If you are planning major changes, it's a good idea to discuss them on the mailing list (and link to a wiki page if you feel it's appropriate)
Please join these two mailing lists: * [General discussion](http://groups.google.com/group/svg-edit) * [All commits, including changes to wiki pages](http://groups.google.com/group/svg-edit-commit)
Where to commit
If it's a translation: just commit directly. You can even use the web-based interface (awesome!)
Go to https://code.google.com/p/svg-edit/source/browse/trunk/editor/locale/
Click on your language file
Click "Edit file"
Edit the translation file
File in the box to describe your changes
Click "Commit"
If you are sure: just commit
If you are pretty sure, but have some doubts: commit and ask for a review -> https://code.google.com/p/support/wiki/CodeReviews
If you want some feedback before committing: add a patch to the issue tracker (or if it's simple, can be on the mailing list)
If you want to do something really radical, make an experimental branch
A corollary to a lower threshold to commit access (than most projets) is quick rollbacks, so don't be offended if your commit is rolled back. This is part of the process of learning and collaborating.
How to give feedback on a commit
You can just comment the commit as per this example: https://code.google.com/p/svg-edit/source/detail?r=2274
If you feel it deserves more eyeballs, send a message to the mailing list.
You can also use the Code Review system: https://code.google.com/p/support/wiki/CodeReviews
How to commit
We use Subversion: https://code.google.com/p/support/wiki/SubversionFAQ

139
docs/from-old-wiki/CommunityConferenceCall.md Normal file
View File

@@ -0,0 +1,139 @@
The recording is at: http://tiki.bigbluebutton.org/playback/slides/playback.html?meetingId=c986d4c28a45e0f8bab246354ebfe0422683e9de-1354632865808
Actual meeting lasted about 3.5 hours! The recording lasts 5 hours because some people arrived early and some stayed after the meeting. Just use the slider to skip ahead to 1h 06min 25sec. Over 30 people participated and the interest/energy level is high. The meeting lasted way longer than planned because there were so many people (a great problem to have!) You can see image of web conference here. Thank you to BigBlueButton for the awesome web conferencing solution!
Main conclusions & notes: * Introduction of participants * It is incredible to see the diverse ways people use SVG-edit. There were over a dozen presentations. * 2.6 release * Release is planned for January 15th, 2013 * trunk is in "risk freeze" until then (don't make major changes that can affect existing implementations) * Adding new optional features is OK until December 31st 2012 (January 1-15 should be bug fixes and translations only) * Ahmad will handle 2 of the remaining blockers in December * Release managers: Chance and Jordan (It's their first time so anyone familiar with release process: please help them) * Translators: we are counting on you to complete translations for all languages :-) * Wiki edit rights * Everyone will be given access. * We want more people to use it for planning and documentation. Long thoughtful posts on the mailing list should perhaps be more in the wiki with a link in the mailing list. * Commit access policy * We open as per the proposal at CommitPolicy with an additional caution to people that SVG-edit is widely used and changes can have unexpected consequences. Wait for after 2.6 release (and thus trunk re-opening) for any bigger changes. * Convergence of energy / modularization / themeing / etc. * Another conference call will be set up in February 2013 (after the release of 2.6) to discuss this in more detail. But in general everybody agreed some architectural changes are necessary and all participants want to contribute back. (the big question is "how?") * Some of the participants expressed an interest in sponsoring development (ex.: allocate some of their development resources) * Wikipedia * The MediaWiki extension was presented. Getting SVG-edit on Wikipedia is a top priority. Further discussions are to be held to determine clear roadmap: https://bugzilla.wikimedia.org/show_bug.cgi?id=38271#c16 * Browser support * This will need more discussion to have a clear policy * Release cycle * Active devs will reconvene for exact formula on this but it is agreed that it should never be more than one year. * Consulting ecosystem * This is essential in a healthy community. All consultants, please add yourself to Consulting * Translations * All translators will have commit access and they can use web interface or SVN. 2.6 will be released January 15th. If you can commit your translations in December, that would be awesome. * Roadmap: see point above on Convergence of energy / modularization / themeing
Apologies to Moritz Wissenbach (and anyone else affected) because he couldn't present his [Image Annotation project](https://faustedition.uni-wuerzburg.de/public/text-image-links.jpg). Although there is no limit to BigBlueButton for the number of people that can connect, the phone gateway we use is limited to 4 connections. So there are likely other people that got a busy signal. This number has since been increased to 8 so we should be OK for the next meeting.
The list of people varied but at one point, here were the names: * Reimar Bauer * Moritz Wissenbach * Michel Buffa * Harry Burt * Dan Nickchen * Ahmad Syazwan * Chuck Weissman (no mic) * Emmanuel Harguindey * Boris Goldowsky * Ludovic Dubost (XWiki) * Marc Laporte * Luigi Capra * Mark MacKay * NICHOLAS KYRIAKIDES * Harman Dandiwal * Mark Nickel * ctzurcanu * Senthil Kumar * edroid * luciash d' being * Caleb * robertplummer * Mark Medinger * Jo Segaert * Flint O'Brien * Chance Roth * Alexander Widera * Jordan Mendler * John Sebok
When
The meeting is confirmed for December 4th, 2012 16h00 UTC
Please check for [the time in your time zone](http://www.timeanddate.com/worldclock/fixedtime.html?iso=20121204T1600)
Where
We will be using the Free and Open Source [BigBlueButton](http://bigbluebutton.org/) Web conferencing platform
It will be possible to join
With a regular phone with a call to a North American number
Via the BigBlueButton web interface (in Flash) (please have a headset)
With Skype (please have a headset)
The meeting room is at http://tiki.org/SVG-edit+2012-12+community+meeting and you can already try it out.
Topics
Introduction of participants
Each person takes a minute or two to introduce themselves. This also serves to make sure sound is OK for all. Please have a headset.
Where do you live?
How do you use SVG-edit? (if this takes more than 30 seconds, please add as a presentation below)
Where do you want to see the project in the future?
Demos/explanation of how SVG-edit is used/integrated
Each project presents in 2-5 minutes an overview of how they use SVG-edit. Presenters: you'll be able to [share URLs in the chatroom, or you can upload PDFs to the presentation tool](http://www.bigbluebutton.org/overview/)
[CWM Draw Tool](https://code.google.com/p/cwm-drawtool/) (Boris Goldowsky)
[Awwation](http://awwation.com/) (Aditya Bhatt)
[Method Draw](https://github.com/duopixel/Method-Draw) (Mark MacKay)
[MediaWiki integration](https://www.mediawiki.org/wiki/Extension:SVGEdit) (Brion Vibber)
[TranslateSvg](https://www.mediawiki.org/wiki/Extension:TranslateSvg) (Harry Burt)
Various improvements by Michel Buffa (Touch, multiline)
[ownCloud integration](http://sourceforge.net/projects/ocsvg/) (Florian Hülsmann)
[A schematic editor (one-line diagrams for electric utilities)](https://groups.google.com/d/msg/svg-edit/8uYm9I4KheQ/kMLggZdytuoJ) (Flint O'Brien)
[Drupal SVG](https://drupal.org/sandbox/josegaert/1511596) (Jo Segaert)
[CloudCanvas](http://www.cloud-canvas.com/) (Chance Roth)
Sapiens Mapping Project
[The Veloz Group has been using SVG Edit for a lot of our companies](http://www.thevelozgroup.com/) ([Jordan Mendler](http://www.thevelozgroup.com/about/executive-team#Jordan-Mendler), [Yarong Guo](http://www.thevelozgroup.com/internships#engineering-internships), [Shangcheng Ying](http://www.thevelozgroup.com/internships#engineering-internships))
[Tiki Screen capture](http://doc.tiki.org/Screencast), [Tiki Draw](https://doc.tiki.org/Draw) and [CartoGraf](http://profiles.tiki.org/CartoGraf) (Marc Laporte & Robert Plummer)
[XWiki SVG Macro](http://extensions.xwiki.org/xwiki/bin/view/Extension/SVG+Macro) Ludovic Dubost
[Image Annotation](https://faustedition.uni-wuerzburg.de/public/text-image-links.jpg) Moritz Wissenbach
Reimar Bauer has added a [save extension](https://bitbucket.org/ReimarBauer/xstatic-svg-edit-moin/src/tip/xstatic/pkg/svgedit_moin/data/editor/extensions/ext-server_moinsave.js?at=default) for the [MoinMoin Wiki Software project](http://moinmo.in/MoinMoin2.0) and packaged it as [XStatic package](http://pypi.python.org/pypi/XStatic-svg-edit-moin) for PyPI
2.6 Release
What is the code status in trunk?
[The current list of issues tagged needed for 2.6](https://code.google.com/p/svg-edit/issues/list?can=2&q=NeededFor%3D2.6)
Discuss blockers for a 2.6 release
If we can't release quickly, perhaps just branch so trunk is open again for development?
Wiki edit rights
How should we use the wiki?
Used more for community planning discussion?
Explicit way for people to gain edit access
Commit access policy
SVG-edit is awesome. And all the people who worked on it have done a superb contribution to the Free and Open Source ecosystem. The main contributors according to https://www.ohloh.net/p/svg-edit/contributors?query=&sort=commits are: Alexis, Jeff, Pavol and of course, thank you to Narendra for starting all this.
Now, time goes by, great people get busy with new projects and it's time for renewal within the SVG-edit community. There is a great bit of talent and energy on the mailing lists and the issue tracker. We hope to always count on Alexis, Jeff, Pavol and Narendra when there is a big problem, but we want the community to be sustainable and growing.
The commit activity has slowed in recent years: https://www.ohloh.net/p/svg-edit/commits/summary
Yet, there are patches in the issue tracker: https://code.google.com/p/svg-edit/issues/list?can=2&q=patch How can we increase the odds that 1- they become appropriate for and 2- they are committed to the main code base?
What should our commit access policy be?
Marc Laporte proposes to think about this: http://info.tiki.org/article188-Tiki-reaches-500-contributors-with-commit-access and to move progressively in this direction. It's a little scary at first but listen to the podcast on that link :-)
Also, as an example, Ben has a simple commit, how do we make it efficient? Ref: https://groups.google.com/d/topic/svg-edit/4Try3YB7pMo/discussion
See proposal at: CommitPolicy
Convergence of energy
There are many applications that are based on SVG-edit (CWM Draw Tool, Method Draw, Awwation, etc.) Super! Now, many of these enhancements are obviously suitable for upstream as the new default, and some are suitable as an option. * Let's discuss when this is a "good"/acceptable/best scenario to keep things separate vs when we feel this work should be part of SVG-edit. * Let's discuss a way to reduce the number of forks and make projects closer and have everyone work in the same code base (with branches, distros, alternate themes, or something!)
Wikipedia
We have: * https://www.mediawiki.org/wiki/Extension:SVGEdit * https://www.mediawiki.org/wiki/Extension:TranslateSvg * https://bugzilla.wikimedia.org/show_bug.cgi?id=38271 * https://code.google.com/p/svg-edit/issues/detail?id=1006
Being used for Wikipedia will be the biggest surge of usage for SVG-edit (Wikipedia being a top-10 site in the World)
What are the next steps to get there?
Browser support
More or less half the web uses rapid release browsers (Chrome & Firefox). What happens if we want to improve SVG-edit but need something that is not yet available in some of the browsers? (or very difficult to do)
What should our policy be?
Release cycle
We don't need to decide anything today but let's start the discussion. And we should eventually come up with some realistic and commonly understood guidelines. Some examples: * A release every 6 months like Ubuntu (October and April) * Release at any time (when energy and features are there), but never more than 12 month between releases.
Consulting ecosystem
There are people (ex.: on the mailing list) that are willing to sponsor SVG-edit work. How do we leverage this? * Consulting (add yourself!) * What else?
Translations
[Translation overhaul discussion](https://groups.google.com/d/topic/svg-edit/suxArdPZcqI/discussion)
Or we use Google Code web-based commits
Roadmap
Let's discuss as a project where we want to be in 3-5 years. What are the features / use cases we would cover if we had tons of contributors the project vs what is outside the scope of the project?
SVG-edit is a https://en.wikipedia.org/wiki/Vector_graphics_editor. Will it become a https://en.wikipedia.org/wiki/Raster_graphics_editor as well? Ex.: [Pixastic Image Processing Library](https://code.google.com/p/svg-edit/issues/detail?id=893)
[SVG-edit can draw on images. Will it one day draw on videos?](https://code.google.com/p/svg-edit/issues/detail?id=985)
[How about realtime collaborative editing?](https://code.google.com/p/svg-edit/issues/detail?id=947)
There are some non-linear presentation tools like use SVG-edit as a base. Should SVG-edit become a such editor? [Awwation: "The editor is built upon the core of SVG-edit, and uses the Sozi library for zooming animations"](https://github.com/adityab/Awwation#readme)
How good will SVG-edit become for [Concept Maps, Mind Maps, Topic Maps, Flow Charts and Org Charts](http://www.mind-mapping.org/web-based-mindmappers/graphical.html)?
For example, I want something like http://drichard.org/mindmaps/ Should I work to add this to SVG-edit?
Who
If you are interested to participate, please indicate your name, city or time zone and ideal dates/times/periods. We'll likely use an online service to pick the date
Marc Laporte, Montréal (any time)
Pavol Rusnak, Prague (any time)
Chance Roth, San Diego (any time)
Mark MacKay (any time)
Ahmad Syazwan, Kuala Lumpur (?)
Bdkzero, Italy
Brion Vibber, San Francisco
Jordan Mendler (http://www.thevelozgroup.com), Los Angeles
Moritz Wissenbach, Germany
You?
Who else should we make sure is present?
You can confirm here as well: https://www.facebook.com/events/469279513113470/
Your thoughts
What do you think? Let us know what is on your mind :-)

99
docs/from-old-wiki/CommunityConferenceCall2.md Normal file
View File

@@ -0,0 +1,99 @@
You can listen to the recording of the previous one here (and read up on meeting notes) The next call is here
The recording is here: http://tiki.bigbluebutton.org/playback/slides/playback.html?meetingId=c986d4c28a45e0f8bab246354ebfe0422683e9de-1360684740601
Summary of discussions
Jacques presented SVG-edit integrated in Instiki
We discussed a VersionLifecycle, to be improved/proposed.
Discussion about testing and unit testing -> Testing
Convergence of energy / theming -> Theming
Look at TinyMCE on how they do it in terms of theming and extending functionality
Report areas that need overrides as bugs / todos / issues on the new Theming page
Wikipedia: Brion presented the test suite and general objectives
Example of changes to SVG implementation in the browser [suspend/unsuspend Redraw Implementation](http://dschulze.com/blog/articles/4/efficient-redrawing-on-svg-or-why-suspendredraw-is-a-lie)
Presented Unhosted.org
We reviewed stats of https://www.ohloh.net/p/svg-edit
We will have Community Conference calls every 2-3 months
When
The meeting will be February 12th, 2013 (at 16h00 UTC like the previous one)
Please check for [the time in your time zone](http://www.timeanddate.com/worldclock/fixedtime.html?iso=20130212T1600)
Where
We will be using the Free and Open Source [BigBlueButton](http://bigbluebutton.org/) Web conferencing platform
It will be possible to join
With a regular phone with a call to a toll-free North American number
Via the BigBlueButton web interface (in Flash) (please have a headset)
With Skype (please have a headset) (It is a free call since you'll be calling a toll-free number)
The meeting room is at http://tiki.org/SVG-edit+2013-02+community+meeting
Topics
Introduction of participants
Each person takes a minute or two to introduce themselves. This also serves to make sure sound is OK for all. Please have a headset.
Where do you live?
How do you use SVG-edit? (if this takes more than 30 seconds, please add as a presentation below)
What is on your mind for this meeting (which topic of the agenda interests you the most)?
Demos/explanation of how SVG-edit is used/integrated
Each project presents in 2-5 minutes an overview of how they use SVG-edit. Presenters: you'll be able to [share URLs in the chatroom, or you can upload PDFs to the presentation tool](http://www.bigbluebutton.org/overview/)
This is for projects that didn't present in the previous call or that have something new to share.
Wikipedia
Being used for Wikipedia will be the biggest surge of usage for SVG-edit (Wikipedia being a top-10 site in the World)
[A round-trip test suite is now in place.](https://groups.google.com/forum/#!topic/svg-edit/SfTVM4OPXiA/discussion)
Related links: * https://code.google.com/p/svg-edit/wiki/Wikipedia * https://www.mediawiki.org/wiki/Extension:SVGEdit * https://www.mediawiki.org/wiki/Extension:TranslateSvg * https://bugzilla.wikimedia.org/show_bug.cgi?id=38271 * https://code.google.com/p/svg-edit/issues/detail?id=1006
What are the next steps to get there? Who can help?
Release cycle
Let's start the discussion. And we should eventually come up with some realistic and commonly understood guidelines. Some examples: * A release every 6 months like Ubuntu (October and April) * Release at any time (when energy and features are there), but never more than 12 month between releases.
2.7 Release
What is the code status in trunk?
[The current list of issues tagged needed for 2.7](https://code.google.com/p/svg-edit/issues/list?can=2&q=NeededFor%3D2.7)
Let's discuss "real" blockers for a 2.7 release, because the list above is quite long!
Ease of use and skinning platform
Convergence of energy / Roadmap / Revamp
Please present your ideas and proposals. Ideally, in writing before the meeting so people can read and be ready with questions.
[Gauging reception for a full redesign (Mark MacKay)](https://groups.google.com/d/topic/svg-edit/MvAHo1-4xpU/discussion)
[Proposal: svg-edit and svg-view (Christian Tzurcanu)](https://groups.google.com/d/topic/svg-edit/O1XLHrLZLYg/discussion)
[Modular design and customizations (Aditya Bhatt)](https://groups.google.com/d/topic/svg-edit/aua4-cy8hvI/discussion)
Add your proposal! :-)
Unhosted
https://unhosted.org/apps/
http://2013.unhosted.org/
Who
Optional: You can indicate your name, city or time zone.
Marc Laporte, Montréal
Ílson Bolzan, Porto Alegre
Who else should we make sure is present?
You can confirm here as well: https://www.facebook.com/events/322796481155915/
Your thoughts
What do you think? Let us know what is on your mind :-)
Promotion of this conference call
https://www.facebook.com/events/322796481155915/
http://www.linkedin.com/groups/SVGedit-2nd-Community-Conference-Call-4712151.S.206831551
https://twitter.com/SVGedit/status/293632047895937024
https://plus.google.com/107010604858430492390/posts/j1NMXR8ufGb
https://groups.google.com/d/msg/svg-edit/EFpAFKJV9kA/82ZWvmORicIJ
https://code.google.com/p/svg-edit/ (on front page)
https://bugzilla.wikimedia.org/show_bug.cgi?id=38271#c19

19
docs/from-old-wiki/CommunityConferenceCall3.md Normal file
View File

@@ -0,0 +1,19 @@
The recording is [here](http://tiki.bigbluebutton.org/playback/slides/playback.html?meetingId=c986d4c28a45e0f8bab246354ebfe0422683e9de-1365523345940)
Previous calls: CommunityConferenceCall CommunityConferenceCall2
When
The meeting will be April 9th, 2013 (at 16h00 UTC like the previous one)
Please check for [the time in your time zone](http://www.timeanddate.com/worldclock/fixedtime.html?iso=20130409T1600)
Topics
Follow-up on Wikipedia progress and the dashboard
Related links
https://plus.google.com/107010604858430492390/posts/CMUWKL72cw3
https://twitter.com/SVGedit/status/307888404673216512
http://www.linkedin.com/groups/SVGedit-3rd-Community-Conference-Call-4712151.S.219028241
http://www.facebook.com/events/277075235756953/
https://identi.ca/notice/99881582

31
docs/from-old-wiki/CommunityConferenceCall4.md Normal file
View File

@@ -0,0 +1,31 @@
The recording is here: http://tiki.bigbluebutton.org/playback/slides/playback.html?meetingId=c986d4c28a45e0f8bab246354ebfe0422683e9de-1381420089478
Previous calls: CommunityConferenceCall CommunityConferenceCall2 CommunityConferenceCall3
Next call: CommunityConferenceCall5
When
The meeting will be October 10th, 2013 (at 16h00 UTC like the previous one) Please check for the [time in your time zone](http://www.timeanddate.com/worldclock/fixedtime.html?iso=20131010T1600)
Where
Online with BigBlueButton here (no registration required)
Topics
demo of WebAppFind (Brett Zamir)
Follow-up on Wikipedia progress (Brion Vibber)
RoundtripTests dashboard (Mike Baynton)
Security fixes
2.7 release
Github discussion (Daniel Shapiro)
Who
Everyone is invited. Add your name below to confirm your participation. * Marc Laporte * Mike Baynton * Brion Vibber * Daniel Shapiro
Related links
Add links here when it's official
https://plus.google.com/107010604858430492390/posts/KkYbnyfLe5T
https://twitter.com/SVGedit/status/385489947689369600
http://www.linkedin.com/groups/SVGedit-4th-Community-Conference-Call-4712151.S.278209989
https://www.facebook.com/events/161235787405818/
https://identi.ca/

29
docs/from-old-wiki/CommunityConferenceCall5.md Normal file
View File

@@ -0,0 +1,29 @@
Previous calls: CommunityConferenceCall CommunityConferenceCall2 CommunityConferenceCall3 CommunityConferenceCall4
The recording is here: http://tiki.bigbluebutton.org/playback/slides/playback.html?meetingId=c986d4c28a45e0f8bab246354ebfe0422683e9de-1383839952270
When
The meeting will be November 7th, 2013 (at 16h00 UTC like the previous one but your daylight saving time may have changed) Please check for [the time in your time zone](http://www.timeanddate.com/worldclock/fixedtime.html?iso=20131107T1600)
Where
Online with BigBlueButton [here](http://tiki.org/SVG-edit+2013-11+community+meeting) (no registration required)
Topics
demo of WebAppFind (Brett Zamir)
Follow-up on Wikipedia progress (Brion Vibber)
RoundtripTests dashboard (Mike Baynton)
Security fixes
2.7 release
Github discussion (Daniel Shapiro)
Who
Everyone is invited. Add your name below to confirm your participation. * Marc Laporte
Related links
Add links here when it's official
https://plus.google.com/
https://twitter.com/
http://www.linkedin.com/
https://www.facebook.com/
https://identi.ca/

19
docs/from-old-wiki/Consulting.md Normal file
View File

@@ -0,0 +1,19 @@
As per the [MIT license](https://en.wikipedia.org/wiki/MIT_License), you do not have to pay anything to anyone to use or integrate SVG-edit. If you code, we hope that you will choose to re-contribute your fixes and enhancements. Additionally, you may choose to pay for support, training, bug fixes and enhancements.
While there is no official endorsement from the point of view of SVG-edit, below is a list of self-identified consultants, who offer services. We ask that all consultants listed here be active within the community and upstream fixes and enhancements, when it's possible/relevant. Some enhancements are just too specific and it may not be acceptable for the official project code base.
Robert Plummer
Website: http://visop-dev.com
Email: rplummer@visop-dev.com
LinkedIn: http://www.linkedin.com/pub/robert-plummer/18/89/a36
Github: https://github.com/robertleeplummerjr
Expert developer in web technologies (php, mysql, javascript, jquery, .net, t-sql). Help to create the cwm draw tool (http://code.google.com/p/cwm-drawtool/) and implemented svg-editor into Tiki wiki cms groupware (http://tiki.org).
Ben McDonald
Email: mcdonald.ben@gmail.com
Website: http://yaks.co.nz/web-apps/
Three years experience working on SVG graphic editors and SVG-edit code. I can help you make high quality SVG-edit based apps. Creator of [Vector Paint](http://vectorpaint.yaks.co.nz/) which makes use of svg-edit code.
(other consultants: add yourself to this page)

3
docs/from-old-wiki/Contact.md Normal file
View File

@@ -0,0 +1,3 @@
In general, to contact the SVG-edit community, please see HowToParticipate
For media inquiries or if you need to ask something in private, you can contact marclaporte --at-- gmail --dot-- com

60
docs/from-old-wiki/DevelopmentProcess.md Normal file
View File

@@ -0,0 +1,60 @@
If you use SVG-edit, add to your Ohloh.net stacks: <wiki:gadget url="http://www.ohloh.net/p/325148/widgets/project_users.xml" height="100" border="0"/>
The Development Phases of a Release
NOTE: The duration of each of the phases below has not been defined at this time.
Pre-Alpha
During this phase, the trunk is completely open to contributions: new features, bug fixes, radical architectural changes. In this phase, the scope of the release will be locked down (features will be decided upon, new features will be voted and accepted for release targeting).
The trunk spends most of its lifetime in Pre-Alpha mode.
Alpha
During this phase, the majority of the features have been implemented on the trunk. Some minor features may still not be implemented yet. Portions of major features may be in a rough state during the Alpha phase.
No new features will be considered for the release, the scope is locked down.
Beta
During this phase, all feature work has been complete. The release has now gone into bug fix mode. Only fixes deemed critical to the release will be considered for check-in to the trunk.
Release
During this phase, the trunk will be branched to svn/branches/X.X (where X.X is the release number) and the following steps need to be performed:
Update the HTML to reference the aggregated minified JS file, svgedit.compiled.js (switch HTML comments)
Update the HTML to point to the Google CDN version of jQuery (switch HTML comments)
Change the version stored at the top of the Makefile
Run the Makefile, which does the following automatically
JS files will be minified on the branch
all files will be packaged up as a downloadable zip file
the Firefox extension will be packaged into an xpi file
the Opera widget will be packaged into a wgt file
[Opera Widgets are being phased out](http://my.opera.com/addons/blog/2012/04/24/sunsetting-unite-and-widgets)
Commit the now built minified JS file, svgedit.compiled.js
Project owner: ~~upload the zip, xpi and wgt files to the Google Code download section~~ (Commit the packaged files and/or add to Google Drive since new project downloads [now disabled](http://google-opensource.blogspot.hk/2013/05/a-change-to-google-code-download-service.html)?)
update the stable branch to refer to the new release branch via: $ svn delete -m "Removing old stable branch" https://svg-edit.googlecode.com/svn/branches/stable $ svn copy https://svg-edit.googlecode.com/svn/branches/2.3 https://svg-edit.googlecode.com/svn/branches/stable -m "Pointing stable branch to 2.3 branch"
A project owner should move the old version information from [Project home](https://code.google.com/p/svg-edit/) page to the VersionHistory page and move any information on the new release from the Roadmap to the [Project home](https://code.google.com/p/svg-edit/).
Update the Roadmap to refer to the next planned release (and keep updated with any new features added to trunk).
At this point, the trunk is now opened up again and enters Pre-Alpha phase for the next release.
If bugs are encountered with a released version, those fixes must be merged to both the release branch and the trunk (as well as to the "stable" branch if the bug is for the stable version).
Creating a Branch
For big experimental features, you may want to branch the repository to separate your work from the trunk. A branch in SVN is just a copy:
svn copy https://svg-edit.googlecode.com/svn/trunk/ https://svg-edit.googlecode.com/svn/branches/rotate-selector -m "Making a branch for..."
This will create the branch on the server. Then you can check it out as a working copy:
svn co https://svg-edit.googlecode.com/svn/branches/rotate-selector/ svg-edit-rotater
Then hack away in the 'svg-edit-rotater' folder and freely check in your changes (these will only be updating the rotate-selector branch in the repository. You can share your changes, have them reviewed, etc.
Once your happy with the branch, you can merge it in.
Rolling Back a Bad Commit
Let's say you accidentally committed your change when you didn't mean to as [revision 2075](https://code.google.com/p/svg-edit/source/detail?r=2075).
svn merge -r2075:2074 . svn ci -m "Rollback bad revision 2075"
TODO: instructions on automatically merging back to trunk
TODO: instructions for keeping up to date in the branch (i.e. merging from trunk to branch)

13
docs/from-old-wiki/Governance.md Normal file
View File

@@ -0,0 +1,13 @@
SVG-edit is a community-managed project with the general principles of Free and Open Source software and Open Organizations.
The current admins are: * Ahmad Syazwan * Brion Vibber * Jeff Schiller * Marc Laporte * Pavol Rusnak
Admins rarely need to vote because decisions are usually consensual and it's a [doOcracy](http://www.communitywiki.org/en/DoOcracy). When a vote is required, these are the people (ex.: for legal/political reasons such as a formal motion needed for external needs). Admins are voted in by other admins.
Ongoing responsibilities of the Admins
Add/remove commit access for contributors
They also act as a safe guard, as a last resort, to deal with [Difficult People](http://producingoss.com/en/difficult-people.html) or [Poisonous People](http://www.youtube.com/watch?v=ZSFDm3UYkeE).
References
[Producing Open Source Software - How to Run a Successful Free Software Project - by Karl Fogel](http://producingoss.com/)

3
docs/from-old-wiki/HallOfFame.md Normal file
View File

@@ -0,0 +1,3 @@
Lukas Reschke
Special thanks to Lukas Reschke - [statuscode.ch](http://statuscode.ch/) for reporting http://code.google.com/p/svg-edit/source/detail?r=2080

67
docs/from-old-wiki/HomePage.md Normal file
View File

@@ -0,0 +1,67 @@
The items below need to be migrated or deleted.
## Features
SVG-edit is an online vector graphics editor that uses only JavaScript, HTML5, CSS and SVG (i.e. no server-side functionality). SVG-edit has the following features:
- Free-hand drawing
- Lines, Polylines
- Rects/Squares
- Ellipses/Circles
- Polygons/Curved Paths
- Stylable Text
- Raster Images
- Select/move/resize/rotate
- Undo/Redo
- Color/Gradient picker
- Group/ungroup
- Align
- Zoom
- Layers
- Convert Shapes to Path
- Wireframe Mode
- Save drawing to SVG
- Linear Gradient Picking
- View and Edit SVG Source
- UI Localization
- Resizable Canvas
- Change Background
- Draggable Dialogs
- Resizable UI (SVG icons)
- Open Local Files
- Import SVG into Drawing
- Connector lines and Arrows
- Plugin Architecture
- Smoother freehand paths
- Editing outside the canvas
- Increased support for SVG elements
- Add/edit Sub-paths
- Multiple path segment selection
- Support for foreign markup (MathML)
- Radial Gradients
- Configurable Options
- Eye-dropper tool
- Stroke linejoin and linecap
- Export to PNG
SVG-edit works directly in the browser. There have been several side projects: A Firefox Add-on, an Opera Widget, a Google Wave Gadget (no longer maintained).
In browsers that support the W3C File API, this editor allows you to open local files. The set of browsers in which this supported is: Firefox 3.6+, Chrome 6+, Safari 5+, and Opera 11.10+ (builds from 2011-04-05 onwards).
Supported browsers
## Support the project
If you use SVG-edit, add to your Ohloh.net stacks:
## Further Reading
* Projects that use SVG-edit
* Reviews
* How to participate
* Frequently Asked Questions
* Tips and Tricks
* Roadmap
* Governance
* Code Refactoring
* Version History (release notes)
* This editor depends on many other open-source projects. See Acknowledgements for details.

73
docs/from-old-wiki/HowToParticipate.md Normal file
View File

@@ -0,0 +1,73 @@
Mailing lists
[General discussion](http://groups.google.com/group/svg-edit)
[All commits, including changes to wiki pages](http://groups.google.com/group/svg-edit-commit)
IRC chatroom
svg-edit on Freenode.net
Or use the web-basd version: http://webchat.freenode.net/?channels=svg-edit
The logs are at: http://irc.tiki.org/irclogger_log/svg-edit
Pavol Rusnak is the channel operator.
Conference calls
CommunityConferenceCall
CommunityConferenceCall2
CommunityConferenceCall3
CommunityConferenceCall4
CommunityConferenceCall5
Wiki access
To get wiki edit access, ask for it on the mailing list: https://groups.google.com/forum/#!forum/svg-edit or directly to marclaporte --at-- gmail --dot-- com and indicate what is your Google account or gmail address (Note: check if there is a way to skip this step)
Feature requests
Please add to https://code.google.com/p/svg-edit/issues/list once you have checked that it's not already there
Bug Reports
Please add to https://code.google.com/p/svg-edit/issues/list once you have checked that it's not already there
Security vulnerability reports
Please email [project owners listed here](https://code.google.com/p/svg-edit/people/list) with a report (and please do give us a bit of time to fix the issue and release a new version) and we'll add you to the Hall of Fame
Translations
Please see: Translation Guidelines
Developers and Commit access
If you have done some HTML/JS/CSS programming before, look at this list of [good first bugs](http://code.google.com/p/svg-edit/issues/list?can=2&q=label%3AGood-First-Bug) and ask for your commit access.
We have started to document the developer API here: http://svg-edit.googlecode.com/svn/trunk/docs/index.html
We have started to gather some unit tests for SVG-edit here: http://svg-edit.googlecode.com/svn/trunk/test/all_tests.html
Please see Commit policy, Development Process and Extension Docs
Interoperability or re-use
If you integrate / enhance / use SVG-edit in any way, please add to ProjectsThatUseSvgEdit
Networks
http://www.linkedin.com/groups/SVGedit-4712151
http://www.facebook.com/groups/447646278605459/
http://plus.google.com/107010604858430492390/
http://twitter.com/SVGedit
http://code.google.com/p/svg-edit/ (Please star SVG-edit!)
http://jster.net/library/svg-edit
http://alternativeto.net/software/svg-edit/ (Add a "like" there!)
If you use SVG-edit, add to your Ohloh.net stacks: <wiki:gadget url="http://www.ohloh.net/p/325148/widgets/project_users.xml" height="100" border="0"/>
Also see: http://www.ohloh.net/p/svg-edit
Consulting
You can become or hire a consultant -> Consulting
Events
Please see: Events
Anything and anything else
Please ask for it on the [General discussion mailing list](http://groups.google.com/group/svg-edit)
If you need to ask something in private
You can contact marclaporte --at-- gmail --dot-- com

46
docs/from-old-wiki/InfoWorld2013interview.md Normal file
View File

@@ -0,0 +1,46 @@
The article is here: http://www.infoworld.com/slideshow/131924/8-svg-tools-jazzing-the-web-232506#slide9
Below is information provided.
What is the purpose of SVG-edit?
SVG-edit is an online vector graphics editor that uses only JavaScript, HTML5, CSS and SVG (i.e. no server-side functionality). It is designed to be embedded in a web application (Wiki, CMS, Groupware, etc.)
What are its main functions?
Supports all modern browsers
Integrated with many applications
Stores drawing data in SVG
Free-hand drawing, Lines, Polylines, Rectanges, etc.
Layers
And many more: https://code.google.com/p/svg-edit/#Features
What does SVG-edit do that other SVG tools do not?
Most SVG tools are desktop applications, which makes it more complicated to collaborate.
I am pretty sure it's the Free and Open Source (FOSS) web-based SVG editor with the most features. If there are other projects out there with more / different features, please do get in touch with us so we may collaborate. We have developed an SVG test suite that would surely be useful to you too!
It's also likely the Free and Open Source (FOSS) web-based SVG editor with the most contributors.
Who developed it?
According to Ohloh.net "SVG-edit has had 1,749 commits made by 36 contributors representing 50,115 lines of code" https://www.ohloh.net/p/svg-edit
Is SVG-edit an open source or commercial product? If it is commercial, Can you provide a price range per-seat?
SVG-edit is Free and Open Source software, and community-managed. The license is MIT. So you can embed in your commercial or FOSS project.
How important is SVG, from your perspective?
It is very important to have standards for all data formats, as much as possible. If the tool you use to generate SVG stops being developed, you maintain your assets and can move to a more modern tool. It also protects you against vendor lock-in.
Can you provide some screen shots or URLs with visuals of SVG-edit?
Here is demo of the stable version: http://svg-edit.googlecode.com/svn/branches/2.6/editor/svg-editor.html
Here is a demo of the upcoming version: http://svg-edit.googlecode.com/svn/trunk/editor/svg-editor.html
Any other comments about SVG-edit?
SVG-edit is a community-managed project with a open contribution policy. Join us in making it as good as it can possibly be! We have community conference calls and want to have as many contributors as possible. See: https://code.google.com/p/svg-edit/wiki/HowToParticipate
We also have a project to get SVG-edit used on Wikipedia for over half million SVG images there.
There have been 113 000 downloads on Google Code since 2009: https://code.google.com/p/svg-edit/downloads/list Also, SVG-edit is embedded in other projects, and we have no way of tracking how many downloads there.
Who is your employer and what is your title there?
I (Marc Laporte) am a volunteer project administrator for SVG-edit, along with others. We do have some consultants which are available to integrate SVG-edit in your application or for adding additional functionality (and let's work together so those features are added to SVG-edit!)

26
docs/from-old-wiki/PossibleRename.md Normal file
View File

@@ -0,0 +1,26 @@
NOTE: This page is obsolete now - the name is fixed at SVG-edit now.
Possible Names
Put all name ideas here:
Savage Editor
Carve: from an [earlier project](http://codedread.com/carve/) by codedread
SViGgy (the friendly SVG editor)
(alternative spellings are possible, such as SViiGy, SViiGgy, SViiGee, etc.)
Wizzy the Vector Wizzard (or Vizzy)
VectAble VectorAble
AniVector NodeSVG
Resizable Graphics
AllSize Move & Graphic
Vectigo
ScalarDraw
Possible Re-versioning
It was also brought up that the current version numbering (2.3) does not really match with what people consider version 1.0 software (there are several things missing from what one would expect of a basic vector graphics editor). If we rename the project it is an opportunity to also rectify this.
What version number would you assign to SVG-edit 2.3 ? Put your thoughts below:
codedread: I would give SVG-edit 2.3 a version number of 0.8, with the next release (currently 2.4) as 0.9. I think 1.0 would be for when the editor can support a good percentage of SVG found throughout the web and supports all basic manipulation.

70
docs/from-old-wiki/ProjectsThatUseSvgEdit.md Normal file
View File

@@ -0,0 +1,70 @@
Integrate as-is means that it uses some or all of the functionality of SVG-edit but it doesn't extend them. Think "SVG-edit as a finished product"
Heavy modification means SVG-edit was used as a base, but application has important changes. Think "SVG-edit as a platform/framework/starting point"
FOSS Web apps
Free and Open Source Web applications that you can download and install on your own server
Integrate as-is
[Tiki Wiki CMS Groupware](http://doc.tiki.org/Draw) (aka Tiki Draw)
[Experimental MediaWiki extension](http://www.mediawiki.org/wiki/Extension:SVGEdit)
[Dokuwiki](http://www.dokuwiki.org/plugin:svgedit) (plugin)
[MoinMoin Extension](http://moinmo.in/ReimarBauer/SvgEditor) and a [save extension](https://bitbucket.org/ReimarBauer/xstatic-svg-edit-moin/src/tip/xstatic/pkg/svgedit_moin/data/editor/extensions/ext-server_moinsave.js?at=default) for the [MoinMoin Wiki Software project](http://moinmo.in/MoinMoin2.0) and packaged as [XStatic package](http://pypi.python.org/pypi/XStatic-svg-edit-moin) for PyPI
[Chamilo LMS](http://www.chamilo.org/)
[Instiki](http://golem.ph.utexas.edu/~distler/blog/archives/002168.html)
[Integrating SVG-edit with TiddlyWiki](http://www.autohotkey.com/forum/topic52732.html)
[XWiki](http://extensions.xwiki.org/xwiki/bin/view/Extension/SVG+Macro) (via macro)
[Project Eduvid](http://eduvid.techfandu.org/)
[Yanel CMS](http://trac.yanel-contribution.3k3.org/wiki/svg-edit) (as a 3rd-party resource)
[WISE 4.0 Learning environment](http://wise4.telscenter.org/webapp/index.html) (drawing component)
ownCloud
[Drupal](https://drupal.org/sandbox/josegaert/1511596)
[WebAppFind](https://github.com/brettz9/webappfind) - Allows desktop invocation of web apps (currently Windows only; UPDATE: Newest incarnation is currently Mac only); contains a demo SVG type handler using SVG-edit
Extension
[ext-sozi](http://asyazwan.github.com/ext-sozi/) SVG-edit extension to use Sozi in your SVGs. Create Sozi SVGs in your browser, 100% client-side. See also illustrated guide
[ext-mathjax](https://github.com/josegaert/ext-mathjax) SVG-edit extension to use the MathJax javaScript library to transform LaTeX math into nicely typeset SVG figures.
Heavy modification
[Awwation](http://adityab.github.com/Awwation/)
[CWM Draw Tool](https://code.google.com/p/cwm-drawtool/)
[Method Draw](https://github.com/duopixel/Method-Draw)
[LIVEyearbook Inc.](https://www.liveyearbook.com/) NOTE: svg-edit is not accessible to public
Online services
Directly available online, via a web browser. No need or way to download or install anything.
Use as-is
[Framavectoriel](http://framavectoriel.org/) (in French)
[Project Sesame](http://projectsesame.appspot.com/) (2.4)
http://www.ezadspro.com/
Heavy modification
[ImageBot](http://www.flamingtext.com/imagebot/)
[Clker.com](http://www.clker.com/) (clip art site)
[CloudCanvas](http://editor.cloud-canvas.com/)
[InstantTee](http://instanttee.co.nr/)
[Vector Paint](http://www.vector-paint.com/)
[Chromics](http://dev.chromics.com/master/editor/svg-editor.html)
Installable application
Integrating SVG-edit in a desktop application, which you download and use on your computer.
Integrate as-is
[Online Paint](https://chrome.google.com/webstore/detail/hnbpdiengicdefcjecjbnjnoifekhgdo) (Chrome Web App)
Heavy modification
[BlueGriffon Web Editor](http://bluegriffon.org/)
Others
[A text/image tool](https://faustedition.uni-wuerzburg.de/public/text-image-links.jpg)
[SVG-edit on tablets and devices](http://code.google.com/p/svg-edit/issues/detail?id=252)
And many [forks on Github](https://github.com/search?q=%22svg-edit%22&repo=&p=1&type=Repositories&l=)

23
docs/from-old-wiki/RelatedLinks.md Normal file
View File

@@ -0,0 +1,23 @@
See also Events
SVG
Great videos: http://www.adrianparr.com/?p=389
http://www.w3.org/Graphics/SVG/
http://en.wikipedia.org/wiki/SVG_Working_Group
JavaScript
http://www.adrianparr.com/?p=457
http://www.adrianparr.com/?p=463
https://www.youtube.com/user/dotconferences
Other
http://srguiwiz.github.com/adj-js/user-docs/
http://leosbog.nrvr.com/2013/02/20/writing-svg-to-disk/
http://www.linkedin.com/groups/Using-SVG-realtime-displays-factory-2549009.S.216775723
https://code.google.com/p/nanoblok/
jHotDraw
http://www.randelshofer.ch/oop/jhotdraw/Documentation/index.html
http://jhotdraw.org/
http://svgjs.com/

14
docs/from-old-wiki/Reviews.md Normal file
View File

@@ -0,0 +1,14 @@
[Short Introduction to SVG-edit](http://ehmdunque.altervista.org/i-informatica/manuali/Short_intro_SVG-edit.html) by Luigi D. CAPRA
[Ohloh page](http://www.ohloh.net/p/svg-edit)
[Announcement](http://stick.gk2.sk/blog/2009/06/svg-edit-a-web-based-svg-editor/) on Pavol's blog
[How to embed in your web page](http://blog.codedread.com/archives/2009/06/19/embed-an-svg-editor-on-your-web-page/) from Jeff's blog
[Firefox Add-On](https://addons.mozilla.org/en-US/firefox/addon/14186/) (dead link)
[gjolesuns's review of Arbelos](http://giizii.com/?p=449)
[Michael MacNaughton's review of Arbelos](http://www.texaswebdevelopers.com/blog/template_permalink.asp?id=131&utm_source=twitterfeed&utm_medium=twitter)
[Drawing on your Nokia N900 with SVG-Edit](http://www.jappit.com/blog/2010/02/05/drawing-on-nokia-n900-with-svg-edit/)
[SitePoint.com review of Arbelos](http://www.sitepoint.com/svg-edit-online-vector-graphics-editor/)
[Standalone Widget version of Arbelos by Opera](http://my.opera.com/ODIN/blog/2010/02/18/svg-edit-standalone-widget)
[Another review of SVG-edit 2.4](http://journal.mycom.co.jp/articles/2010/02/24/svgedit/index.html) (Japanese)
[PC-World article mentioning the SVG-edit Firefox add-on](http://www.pcworld.com/article/190614/svgedit_24.html) (dead link)
[Download Squad review](http://www.downloadsquad.com/2010/11/15/svg-edit-is-a-surprisingly-powerful-in-browser-vector-image-edit/)

55
docs/from-old-wiki/RoadMap.md Normal file
View File

@@ -0,0 +1,55 @@
Introduction
This document covers future versions of SVG-edit. For the current release and previous versions, see the VersionHistory.
Although there is no set date to do so, one important project is to get SVG-edit used on Wikipedia.
Starting with 2.4, development versions of SVG-edit are given an alphabetic codename that corresponds to the name of a shape. See potential lists here: * http://en.wikipedia.org/wiki/List_of_curves * http://en.wikipedia.org/wiki/List_of_regular_polytopes
You can follow all [code commits here](https://code.google.com/p/svg-edit/source/list) to see any features that have been developed since the latest stable release.
Version 2.8 (Devil's curve in trunk; not yet released)
Proposed Features
[next version](http://code.google.com/p/svg-edit/issues/list?can=2&q=label%3ANeededFor-nextversion) ([Bugs only](https://code.google.com/p/svg-edit/issues/list?can=2&q=label:NeededFor-nextversion%20type=Defect&colspec=ID%20Type%20Status%20Priority%20NeededFor%20Browser%20Owner%20Summary))
[future version](https://code.google.com/p/svg-edit/issues/list?can=2&q=NeededFor%3AFuture&colspec=ID+Type+Status+Priority+NeededFor+Browser+Owner+Summary&cells=tiles)
Implemented Features (subject to further alteration before release)
[already fixed/implemented](https://code.google.com/p/svg-edit/issues/list?can=1&q=NeededFor%3Dnextversion+status%3AFixed%2CDone&colspec=ID+Type+Status+Priority+NeededFor+Browser+Owner+Summary&cells=tiles)
Enhancement (Experimental): Client-side PDF export ([issue #1156](https://code.google.com/p/svg-edit/issues/detail?id=#1156)) (to data: URI) and server-side PDF export (where not supported in browser and using ext-server_opensave.js); uses jsPDF library
Enhancement: For image exports, provided "datauri" property to "exported" event.
Enhancement: Allow config "exportWindowType" of value "new" or "same" to indicate whether to reuse the same export window upon subsequent exports
Enhancement: Added openclipart support to imagelib extension
Enhancement: allow showGrid to be set before load
Enhancement: Support loading of (properly URL encoded) non-base64 "data:image/svg+xml;utf8,"-style data URIs
Enhancement: More clear naming of labels: "Open Image"->"Open SVG" and "Import SVG"->"Import Image" ([issue #1206](https://code.google.com/p/svg-edit/issues/detail?id=#1206))
Enhancement: Included reference to (repository-ignored) custom.css file which once created by the user, as with config.js, allows customization without modifying the repo
Demo enhancement: Support and demonstrate export in embedded editor
Upgrade: canvg version
Fix: Avoid error in ungrouping function when no elements selected (was impacting MathJax "Ok" button).
Fix: [issue #1205](https://code.google.com/p/svg-edit/issues/detail?id=1205) with Snap to Grid preventing editing
Fix: bug in exportImage if svgEditor.setCustomHandlers calls made
Fix: Ensure "loading..." message closes upon completion or error
Fix: Ensure all dependencies are first available before canvg (and jsPDF) usage
Fix: Allow for empty images
Fix: Minor improvement in display when icon size is set to small
Fix: Based64-encoding issues with Unicode text (e.g., in data URIs or icons)
Fix: 2.7 regression in filesave.php for SVG saving (used by ext-server_opensave.js when client doesn't support the download attribute)
Potentially breaking API changes (subject to further alteration before release):
Remove 2.7-deprecated "pngsave" (in favor of "exportImage")
Data URIs must be properly URL encoded (use encodeURIComponent() on the "data:..." prefix and double encodeURIComponent() the remaining content)
Remove "paramurl" parameter (use "url" or "source" with a data: URI instead)
svgCanvas.rasterExport now takes an optional window name as the third argument, with the supplied name also being provided as a "exportWindowName" property on the object passed to the exportImage method optionally supplied to svgEditor.setCustomHandlers.
Change 2.7 allowance of "PDF" as a type in the canvas "rasterExport" method and the "exported" event to instead be moved to the canvas "exportPDF" method and "exportedPDF" event respectively.
Release Date
TBD
Future
Proposed Features
Animation
SVG-edit should provide a means of animating SVG content using SMIL so that it can be played back in any browser. This becomes increasingly important as more browsers come online with SMIL functionality (Webkit and soon Mozilla).
The Inkscape folks have thoughts here: http://wiki.inkscape.org/wiki/index.php/Animation-%28Timeline%29

71
docs/from-old-wiki/RoundtripTests.md Normal file
View File

@@ -0,0 +1,71 @@
Roundtrip Tests
Primarily in an effort to make SVG-edit suitable for Wikipedia, there are some tests that determine how accurately SVG-edit reproduces an original svg document when it is loaded into SVG-edit and immediately saved back out.
Hosted tests
The tests automate SVG-edit to perform a series of load-save operations on svg documents randomly selected from the Wikimedia Commons, but SVG-edit's output is sent back to a server for analysis and permanent storage. Currently, the main test server is https://www.mbaynton.com/svg-edit/2.6/test/roundtrip-test-src/launcher.php'>https://www.mbaynton.com/svg-edit/2.6/test/roundtrip-test-src/launcher.php'>https://www.mbaynton.com/svg-edit/2.6/test/roundtrip-test-src/launcher.php. Anyone who wants to help out can donate some cycles and bandwidth to the tests just by visiting this URL. We test hundreds of svg's on many browsers and many SVG-edit code revisions, so there's probably tests to be run.
The Error Score is based on how many pixels differ between the rasterized version of the original SVG document and the rasterized version of the SVG document that ran through SVG-edit. The closer to 0 the better. In the present interface you can also see a highlighted view of which pixels differ in each test, and compare the C14N-canonicalized input xml with the C14N-canonicalized SVG-edit output in a side-by-side diff.
In revisions of SVG-edit as of this writing, one of the first tests (352) will pause at "uploading saved source..." for a very long time due to the wildly inaccurate dimensions of the image that SVG-edit reports back to the server. Be patient.
Identified Issues
This section lists some issues that the roundtrip tests have revealed
Inline style attributes are not preserved
Wildly inaccurate dimensions of saved document, as exemplified by test 352
2013-10-03 Firefox on Windows eats up over 2 gigs of RAM and eventually crashes (reported by marclaporte)
Test code and dependencies
This section is only of interest if you wanted to set up a new roundtrip test environment on your own server.
I've checked in the code in a new branch at /svn/branches/roundtrip-diff-tests/2.6/test/roundtrip-test-src. Those with more ownership of the project can feel free to reorganize and/or merge it into trunk if you like.
To get this working on your server:
Create a MySQL database and apply the svg-edit-test.sql file to it to create two empty tables. Configure permissions to this database as you desire; you'll need to give php credentials to read and write.
Create a settings.php file in the same directory as test-runner.php, replacing the variable values for your environment:
<?php
$dbhost = "localhost";
$dbuser = "www";
$dbpass = "";
$dbschema = "svg-edit-test"; // name of database you created
$baseURL = "http://www.mbaynton.com/svg-edit-test/2.6/test/roundtrip-test-src";
?>
Load a set of svg files ("tests") into your database from Wikimedia Commons via the Tests-generator.php command-line script. Verify everything is working by loading a single document with
$ php Tests-generator.php
If this is successful, you can load some n SVG documents with
$ php Tests-generator.php n
Once you're satisfied with the set of tests you've loaded, you probably shouldn't change them again. It will be easier to compare test runs that way.
A (probably incomplete) list of dependencies on the server:
PHP cURL extension
SVN Functions for PHP
ImageMagick and its PHP extension
(Optionally) a W3C markup validator. The validator is web based and so doesn't need to be local; the one it uses should be in settings.php but is currently hardcoded in helper-functions.php (function testSvgStrictValidity).
# Future Enhancements #
Use http://www.mergely.com/ for textual diffs
Allow tests to run from svg-edit hosted on arbitrary servers, so developers can evaluate changes before checking them in.
Plenty more...
Related links

27
docs/from-old-wiki/SVG_Open_2010.md Normal file
View File

@@ -0,0 +1,27 @@
Info
8th International Conference on Scalable Vector Graphics August 30 to September 1, 2010 Paris, France
Abstract
Paper title: SVG-edit
Paper subtitle: A complete vector graphics editor in the browser
Authors: Rusnak, Pavol
Paper topic: SVG Authoring Tools and Techniques
Abstract:
SVG-edit is a fast, web-based, Javascript-driven SVG editor that works in any modern browser. It is inspired by Inkscape and despite its youth (slightly more than a year of development) already provides a good set of features to create advanced vector drawings. Open-source components like jQuery are used and SVG-edit itself is also licensed under a liberal Apache License 2.0, which makes it very easy to embed the editor in both commercial and non-commercial projects. The talk will focus on a short history plus overview of the project and the new features implemented in the last SVG-edit releases. We will mention various challenges we faced during the development and also describe the browser missing features which would make life a lot easier. We'll conclude the talk with a live demonstration of the editor and other projects that already use embedded SVG-edit.
Remarks:
codedread's comments
Pavol, I would recommend talking about the new features in 2.4, 2.5 (and if it is released prior to the conference, 2.6). Also, I would recommend discussing some of the challenges so that browsers are more aware of them. Please feel free to take comments from this list of challenges to weave them into your talk:
browser support of content-editable in HTML does not extend to HTML-inside-SVG (using foreignObject) in an interoperable way. This prevents rich text in SVG-edit. Try the T+ button on this experimental branch: http://svg-edit.googlecode.com/svn/branches/enhtext/editor/svg-editor.html
need all browsers to support the [W3C File API](http://www.w3.org/TR/FileAPI/) (to allow local files to be loaded into SVG-edit). Specifically Safari, Opera, IE9 and Chrome (Google has plans to support this in Chrome 5).
want browsers to start implementing the [W3C FileWriter](http://dev.w3.org/2009/dap/file-system/file-writer.html) interface (I think Chrome has plans for Version 5)
want browsers to allow better Canvas-SVG integration (i.e. export Canvas to SVG, [export SVG to PNG](http://dev.w3.org/html5/canvas-api/canvas-2d-api.html#todataurl-method), embed canvas directly in SVG for raster effects)
consistent support of SVG DOM interfaces, specifically things like SVGPathSegList (adeveria has more details, I'm sure), more details on the BrowserBugs page

22
docs/from-old-wiki/Stakeholders.md Normal file
View File

@@ -0,0 +1,22 @@
The goal of this page is for everyone in the community to be aware of how different community members use and rely on SVG-edit. Please see ProjectsThatUseSvgEdit for the list of projects.
FOSS Web apps
Wiki engines
Content Management Systems
E-learning tools
etc.
Typical example: http://www.dokuwiki.org/plugin:svgedit
Online services with drawing needs
Drawings for products
T-shirts
Web to print
etc.
Typical example: http://instanttee.co.nr/
Installable application
Integrating SVG-edit in a desktop application, which you download and use on your computer, like http://bluegriffon.org/
See also: Consulting

158
docs/from-old-wiki/Summer_of_Code_2010.md Normal file
View File

@@ -0,0 +1,158 @@
Introduction
This is our page of ideas for the [Google Summer of Code 2010](http://socghop.appspot.com/). If you are a student, you can participate by developing one of the projects we describe here (or propose an idea of your own!), and get paid through a stipend by Google. Read the [Google Summer of Code 2010 FAQ](http://socghop.appspot.com/document/show/gsoc_program/google/gsoc2010/faqs) for more details about the program.
Important dates
March 08 to March 12 - Mentor organization application period
March 18 - Announcement of accepted mentor organizations.
March 29 to April 09 - Student application period
April 26 - Announcement of accepted students
May 24 to August 16 - Coding period
See the [authorative timeline](http://socghop.appspot.com/document/show/gsoc_program/google/gsoc2010/timeline) for more details.
Information for students
The Google Summer of Code is a program for students in most countries. You will participate by writing code for a free software project. Students who finish their work satisfactorily will get a stipend of 4500 US Dollars.
Do this if you want to participate:
Start by reading the [Google Summer of Code FAQ](http://socghop.appspot.com/document/show/gsoc_program/google/gsoc2010/faqs)
See which of the Ideas below you find interesting or come up with your own idea.
Get in contact with the community
Submit your proposal on the Google Summer of Code website
Your proposal should include this information:
Give a detailed idea of what you want to accomplish in your project. Don't just quote what the project's abstract says! Think of how you will actually implement it, and describe that.
Give a general idea of your skills. If you have participated in a free software project before, say so and if possible point to your contributions.
Give a rough timeline for your work, with milestones. For example: "week 1, get the code to build and start familiarizing myself with it. Week 2, implement the first refactoring patch. Week 3, try such and such thing."
Basically, let us know why you are the perfect person to implement the project you picked :)
Ideas
This is a list of ideas for projects which could be done as part of the Google Summer of Code program. If you have an idea and want to mentor it, please add it to the list.
If you are a student and want to work on an idea, submit a proposal. You are not limited to the ideas listed here. If you have an own idea or want to approach an idea in a completely different way, feel free to submit this as proposal as well. Sometimes these are the best projects. Creativity and initiative are highly appreciated.
Path Tool Enhancements
Required knowledge: SVG, JS, CSS, jQuery
Skill level: Advanced
Mentor: TBD
Student: TBD
Description:
add/delete arbitrary points on a path
join points/paths
continue from endpoint
click-drag makes curve/bezier point instead of corner point
simplify path algorithms
drag from lines as well as points
Objects on Path
Required knowledge: SVG, JS, CSS, jQuery
Skill level: Experienced
Mentor: TBD
Student: TBD
Description:
Multiple duplicate object/instances along a path with either evenly spaced (user configurable) or at each point on the path.
Object along Path Enhancements
Required knowledge: SVG, JS, CSS, jQuery
Skill level: Advanced
Mentor: TBD
Student: TBD
Description:
Object A is stretched along a path B.
Union/Intersection/Difference for shapes
Required knowledge: SVG, JS, CSS, jQuery
Skill level: Advanced
Mentor: TBD
Student: TBD
Description:
2 or more overlapping objects when selected are either a) Combined to make one object from the outline of both or b) Like a Venn diagram we take only the shared intersecting area or c) Take the area of the two objects that are not intersecting
Rulers/Guides/Units Enhancements
Required knowledge: SVG, JS, CSS, jQuery
Skill level: Experienced
Mentor: TBD
Student: TBD
Description:
Add rules and guides with configurable units
Bring forward/Send backward incremental
Required knowledge: SVG, JS, CSS, jQuery
Skill level: Experienced
Mentor: TBD
Student: TBD
Description:
Currently moving an object all the way forward or backward is the only option, but adding the functionality to move forward or backward one object at a time is much better.
Layer Drag and Drop Enhancement
Required knowledge: JS, CSS, jQuery
Skill level: Novice
Mentor: TBD
Student: TBD
Description:
Enable Users to move the layers around by dragging them to change the order
History Interface in Sidebar
Required knowledge: JS, CSS, jQuery
Skill level: Novice
Mentor: TBD
Student: TBD
Description:
A visual representation of the undo/redo stack with the ability to go back n number of steps at will.
Pattern Fills
Required knowledge: SVG, JS, CSS, jQuery
Skill level: Experienced
Mentor: TBD
Student: TBD
Description:
Use a pattern to define a fill pattern
Documentation Enhancements
Required knowledge: Must possess technical writing skills and experience with graphics applications is a big plus.
Skill level: Novice
Mentor: TBD
Student: TBD
Description:
User Docs and Guides
API/Extensions
{IDEA_TITLE_TO_BE_REPLACED}
Required knowledge: What does the prospective student need to know before attempting this idea?.
Skill level: How difficult would this idea be to implement if the student has the required knowledge
Mentor: Your name and contact will go here.
Student: Your name and contact will go here.
Description of idea goes here, try and be as detailed as possible.
Links
http://socghop.appspot.com/document/show/gsoc_program/google/gsoc2010/faqs'>Google Summer of Code FAQ
http://code.google.com/soc/'>Google Summer of Code main page

46
docs/from-old-wiki/Summer_of_Code_2013.md Normal file
View File

@@ -0,0 +1,46 @@
Introduction
This is our page of ideas for the [Google Summer of Code 2013](http://www.google-melange.com/gsoc/homepage/google/gsoc2013). If you are a student, you can participate by developing one of the projects we describe here (or propose an idea of your own!), and get paid through a stipend by Google. Read the [Google Summer of Code 2013 FAQ](http://www.google-melange.com/gsoc/document/show/gsoc_program/google/gsoc2013/help_page) for more details about the program.
Important dates
March 18 to March 29 - Mentor organization application period
April 8 - Announcement of accepted mentor organizations.
April 22 to May 3 - Student application period
May 27 - Announcement of accepted students
June 17 to September 23 - Coding period
See the [authorative timeline](http://www.google-melange.com/gsoc/events/google/gsoc2013) for more details.
Information for students
The Google Summer of Code is a program for students in most countries. You will participate by writing code for a free software project. Students who finish their work satisfactorily will get a stipend of 4500 US Dollars.
Do this if you want to participate:
Start by reading the [Google Summer of Code FAQ](http://www.google-melange.com/gsoc/document/show/gsoc_program/google/gsoc2013/help_page)
See which of the Ideas below you find interesting or come up with your own idea.
Get in contact with the community
Submit your proposal on the Google Summer of Code website
Your proposal should include this information:
Give a detailed idea of what you want to accomplish in your project. Don't just quote what the project's abstract says! Think of how you will actually implement it, and describe that.
Give a general idea of your skills. If you have participated in a free software project before, say so and if possible point to your contributions.
Give a rough timeline for your work, with milestones. For example: "week 1, get the code to build and start familiarizing myself with it. Week 2, implement the first refactoring patch. Week 3, try such and such thing."
Basically, let us know why you are the perfect person to implement the project you picked :)
Ideas
This is a list of ideas for projects which could be done as part of the Google Summer of Code program. If you have an idea and want to mentor it, please add it to the list.
If you are a student and want to work on an idea, submit a proposal. You are not limited to the ideas listed here. If you have an own idea or want to approach an idea in a completely different way, feel free to submit this as proposal as well. Sometimes these are the best projects. Creativity and initiative are highly appreciated.
{IDEA_TITLE_TO_BE_REPLACED}
Required knowledge: What does the prospective student need to know before attempting this idea?.
Skill level: How difficult would this idea be to implement if the student has the required knowledge
Mentor: Your name and contact will go here.
Student: Your name and contact will go here.
Description of idea goes here, try and be as detailed as possible.

20
docs/from-old-wiki/SvgSupport.md Normal file
View File

@@ -0,0 +1,20 @@
SVG Element and Attribute Whitelist
I apologize up-front for the poor format of this table, I blame the wiki markup allowed in Google Code.
Anything not listed here is not supported by SVG-edit and will be stripped out upon import. SVG-edit supports the following elements and attributes:
| Element | Attributes | |:------------|:---------------| | All Elements | class, filter, id, requiredFeatures, style, systemLanguage | | All Shapes | clip-path, fill, fill-opacity, fill-rule, marker-end, marker-mid, marker-start, pattern, stroke, stroke-dasharray, stroke-dashoffset, stroke-linecap, stroke-linejoin, stroke-miterlimit, stroke-opacity, stroke-width, transform | | a | xlink:href | | circle | cx, cy, r | | clipPath | clipPathUnits | | defs | | | desc | | | ellipse | cx, cy, rx, ry | | feGaussianBlur | stdDeviation | | filter | filterRes, filterUnits, height, primitiveUnits, width, x, xlink:href, y | | g | | | image | xlink:href, xlink:title | | line | x1, x2, y1, y2 | | linearGradient | gradientTransform, gradientUnits, spreadMethod, x1, x2, y1, y2 | | marker | markerHeight, markerUnits, markerWidth, orient, refX, refY | | path | d | | pattern | height, patternContentUnits, patternTransform, patternUnits, width, x, xlink:href, y | | polygon | points | | polyline | points | | radialGradient | cx, cy, fx, fy, gradientTransform, gradientUnits, r, spreadMethod | | stop | offset, stop-color, stop-opacity | | symbol | preserveAspectRatio, viewBox | | svg | height, preserveAspectRatio, viewBox, width, xmlns, xmlns:xlink | | switch | | | rect | height, rx, ry, width, x, y | | text | font-size, font-family, font-style, font-weight, text-anchor, x, xml:space, y | | textPath | method, spacing, startOffset, xlink:href | | tspan | dx, dy, rotate, textLength, x, y | | title | | | use | height, width, x, xlink:href, y |
Non-Editable Items
At this time, the following attributes cannot be edited in the user interface of SVG-edit (but they can be tweaked using the SVG source editor within SVG-edit):
fill-rule
stroke-dashoffset
stroke-miterlimit
xlink:href on a use element
In addition, there is no way within jGraduate (the color picker used in SVG-edit) to:
create a radial gradient
add stops to any gradient (limited to two stops only)

13
docs/from-old-wiki/Testing.md Normal file
View File

@@ -0,0 +1,13 @@
There are some unit tests here: https://svg-edit.googlecode.com/svn/trunk/test/
All the tests can be run at once from [this page](https://svg-edit.googlecode.com/svn/trunk/test/all_tests.html).
To do
List all tests that need to be written
In particular, it seems that the existing tests are lower level tests. That's good, but we probably also need higher level "acceptance testing" kinds of tests.
It seems also we need to organize and document these tests a bit better, so that:
people don't end up writing a test that already exists
when people want to add a new test, they know where to add it
people know that those tests exist, and have access to easy tutorials on how to write them.
Related: * For Wikipedia, we have a round-trip testing suite: https://github.com/brion/svg-edit-test

11
docs/from-old-wiki/Theming.md Normal file
View File

@@ -0,0 +1,11 @@
We need to make it easier to theme svg-edit and tweak the interface. Currently the presentation, markup and logic are mixed in css, html and javascript. Ideally an approach similar to the [CSS Zen Garden](http://www.csszengarden.com/).
Open questions
What needs to be changed in the code to make this separation happen?
What sorts of interface changes would we want possible? Perhaps take inspiration from other editors like [Method Draw](http://editor.method.ac/) and [CWM Draw Tool](https://code.google.com/p/cwm-drawtool/)
Related links
[Gauging reception for a full redesign (Mark MacKay)](https://groups.google.com/d/topic/svg-edit/MvAHo1-4xpU/discussion)
[Proposal: svg-edit and svg-view (Christian Tzurcanu)](https://groups.google.com/d/topic/svg-edit/O1XLHrLZLYg/discussion)
[Modular design and customizations (Aditya Bhatt)](https://groups.google.com/d/topic/svg-edit/aua4-cy8hvI/discussion)

21
docs/from-old-wiki/TipsAndTricks.md Normal file
View File

@@ -0,0 +1,21 @@
Unexpected svgEditor.ready doesn't exist when load svg-editor from parent using iframe
Situation: You have a web page where you use an iframe to load svg-edit. Since the jQuery ready function does not wait for all JavaScript to load, you may get some unexpected behavior, such as svgEditor.ready not existing. You may thus need to catch this exception and wait a little longer to try again:
svg_frame is the id for the svg-editor iframe
``` $('#svg_frame').ready(function() {
var ifrm = $('#svg_frame')[0];
// waiting for real load
(function(){
try {
ifrm.contentWindow.svgEditor.ready(function() { editor_ready();});
}
catch (Ex){
setTimeout(arguments.callee, 1000);
}
})();
}) ```

758
docs/from-old-wiki/TranslationGuidelines.md Normal file
View File

@@ -0,0 +1,758 @@
To commit translations to the main code base, please see: CommitPolicy
Under construction
http://imgh.us/SVG-edit_Languages.svg http://imgh.us/SVG-edit_Languages.jpg]
shows the status of translations for each SVG-edit language file.
'>
Introduction Explanation of this document.
IDs Details Describes the IDs.
js_strings Describes the JavaScript strings.
Introduction
This page lists the existing IDs in the language files, and explains what they "technically" represent, for a meaningful - yet simple - translation of the SVG-edit interface.
New ID since the last version
Active ID
ID made obsolete last version
Obsolete ID
There is also a block of JavaScript strings, at the end of each language file. Their second part needs to be translated.
The current available languages files can be found here. Click on the language file you want, then select "View Raw file" to display the file and save it as a .js file that you can edit.
This page is sorted in the same order as the language files themselves.
Notes: * a '%string' is a value and must not be translated. Ex: '%s'. * \n inside a long line:
Long lines are sometimes split with a
\nwhich must not be translated. It may be moved
\ninto the sentences
\nfor verbose languages.
References to shortcuts (numbers or words inside a pair of "[ ]" brackets still appearing in a language file must be deleted from the line.
IDs Details
align_relative_to
DescriptionVerb. To align objects relatively to either objects or the page. Default languageAlign relative to ... In use since2.4 Obsolete since-
angleLabel
DescriptionNoun. The angle of rotation applied to an object. Default languageangle: In use since2.4 Obsolete since2.5
bkgnd_color
DescriptionVerb. To change the background color / the opacity. Default languageChange background color/opacity In use since2.4 Obsolete since-
circle_cx
DescriptionVerb. To change the horizontal coordinate cx of a circle. Default languageChange circle's cx coordinate In use since2.4 Obsolete since-
circle_cy
DescriptionVerb. To change the vertical coordinate cy of a circle. Default languageChange circle's cy coordinate In use since2.4 Obsolete since-
circle_r
DescriptionVerb. To change the radius of a circle. Default languageChange circle's radius In use since2.4 Obsolete since-
connector_no_arrow
DescriptionNoun. Option indicating that the line should not have arrows. Default languageNo arrow In use since2.5 Obsolete since-
copyrightLabel
DescriptionSentence start. Prefix to "SVG-edit" credit in bottom-right corner. Default languagePowered by In use since2.5 Obsolete since-
cornerRadiusLabel
DescriptionVerb. Value of the radius of the corners, for a rectangle with rounded corners. Note: This text used to be "Corner Radius:" and was a label. As of 2.5 it refers to the tooltip text Default languageChange Rectangle Corner Radius In use since2.4 Obsolete since
curve_segments
DescriptionNoun. Type of segment: curved segment, as opposed to straight line. Default languageCurve In use since2.4 Obsolete since-
ellipse_cx
DescriptionVerb. To change the horizontal coordinate cx of an ellipse. Default languageChange ellipse's cx coordinate In use since2.4 Obsolete since-
ellipse_cy
DescriptionVerb. To change the vertical coordinate cy of an ellipse. Default languageChange ellipse's cy coordinate In use since2.4 Obsolete since-
ellipse_rx
DescriptionVerb. To change the horizontal radius x of an ellipse. Default languageChange ellipse's x radius In use since2.4 Obsolete since-
ellipse_ry
DescriptionVerb. To change the vertical radius y of an ellipse. Default languageChange ellipse's y radius In use since2.4 Obsolete since-
fill_color
DescriptionVerb. To change the fill color of an object. Default languageChange fill color In use since2.4 Obsolete since-
fill_tool_bottom
DescriptionNoun. The inner painting of an object. Default languagefill: In use since2.4 Obsolete since2.5
fitToContent
DescriptionAdjective or past participle. Adjusted to the content of the drawing, cropped. Default languageFit to Content In use since2.4 Obsolete since-
fit_to_all
DescriptionVerb. To adjust the zoom level to include everything drawn in all layers. Default languageFit to all content In use since2.4 Obsolete since-
fit_to_canvas
DescriptionVerb. To adjust the zoom level to the canvas dimensions. Default languageFit to canvas In use since2.4 Obsolete since-
fit_to_layer_content
DescriptionVerb. To adjust the zoom level to include everything in the current layer. Default languageFit to layer content In use since2.4 Obsolete since-
fit_to_sel
DescriptionVerb. To adjust the zoom level to include all the selected objects. Default languageFit to selection In use since2.4 Obsolete since-
font_family
DescriptionVerb. To change the font-family of a text element. Default languageChange Font Family In use since2.4 Obsolete since-
idLabel
DescriptionVerb. To change the ID of an element. Default languageIdentify the element In use since2.5 Obsolete since-
icon_large
DescriptionAdjective. Large, for the size of the icons. Default languageLarge In use since2.4 Obsolete since-
icon_medium
DescriptionAdjective. Average, for the size of the icons. Default languageMedium In use since2.4 Obsolete since-
icon_small
DescriptionAdjective. Small, for the size of the icons. Default languageSmall In use since2.4 Obsolete since-
icon_xlarge
DescriptionAdjective. Extra large, for the size of the icons. Default languageExtra Large In use since2.4 Obsolete since-
iheightLabel
DescriptionNoun. Height. Default languageheight: In use since2.4 Obsolete since2.5
image_height
DescriptionVerb. To change the height of an image. Default languageChange image height In use since2.4 Obsolete since-
image_opt_embed
DescriptionVerb. To embed (include, integrate) the images as data (for local files) Default languageEmbed data (local files) In use since2.4 Obsolete since-
image_opt_ref
DescriptionVerb. To use the reference of the images (URLs of the images, instead of embedding them Default languageUse file reference In use since2.4 Obsolete since-
image_url
DescriptionVerb. To change the URL of an image. Default languageChange URL In use since2.4 Obsolete since-
image_width
DescriptionVerb. To change the width of an image. Default languageChange image width In use since2.4 Obsolete since-
includedImages
DescriptionAdjective or past participle. Included, integrated, embedded images. Default languageIncluded Images In use since2.4 Obsolete since-
iwidthLabel
DescriptionNoun. Width. Default languagewidth: In use since2.4 Obsolete since2.5
largest_object
DescriptionSuperlative adjective. The largest object. Default languagelargest object In use since2.4 Obsolete since-
layer_delete
DescriptionVerb. To delete the current layer. Default languageDelete Layer In use since2.4 Obsolete since-
layer_down
DescriptionVerb. To move the current layer down in the layer table. Default languageMove Layer Down In use since2.4 Obsolete since-
layer_new
DescriptionNoun. A new layer. Default languageNew Layer In use since2.4 Obsolete since-
layer_rename
DescriptionVerb. To give a new name to the current layer. Default languageRename Layer In use since2.4 Obsolete since-
layer_up
DescriptionVerb. To move the current layer up in the layer table. Default languageMove Layer Up In use since2.4 Obsolete since-
layersLabel
DescriptionNoun. The layers. Default languageLayers: In use since2.4 Obsolete since-
line_x1
DescriptionVerb. To change the horizontal coordinate x of the starting point, for a line. Default languageChange line's starting x coordinate In use since2.4 Obsolete since-
line_x2
DescriptionVerb. To change the horizontal coordinate x of the ending point, for a line. Default languageChange line's ending x coordinate In use since2.4 Obsolete since-
line_y1
DescriptionVerb. To change the vertical coordinate y of the starting point, for a line. Default languageChange line's starting y coordinate In use since2.4 Obsolete since-
line_y2
DescriptionVerb. To change the vertical coordinate y of the ending point, for a line. Default languageChange line's ending y coordinate In use since2.4 Obsolete since-
linecap_butt
DescriptionNoun. To made the end of a line stop exactly at its end coordinate. Default languageLinecap: Butt In use since2.5 Obsolete since-
linecap_round
DescriptionNoun. To made the end of a line end rounded. Default languageLinecap: Round In use since2.5 Obsolete since-
linecap_round
DescriptionNoun. To made the end of a line end square. Default languageLinecap: Square In use since2.5 Obsolete since-
linejoin_bevel
DescriptionNoun. To make line joints use straight, cut off edges. Default languageLinejoin: Bevel In use since2.5 Obsolete since-
linejoin_miter
DescriptionNoun. To make line joints use regular, usually pointy edges. Default languageLinejoin: Miter In use since2.5 Obsolete since-
linejoin_round
DescriptionNoun. To make line joints use round edges. Default languageLinejoin: Round In use since2.5 Obsolete since-
main_icon
DescriptionNoun. The main (application) menu. Default languageMain Menu In use since2.5 Obsolete since-
mode_connect
DescriptionVerb. Option to connect two objects with a line. Default languageConnect two objects In use since2.5 Obsolete since-
page
DescriptionNoun. The page. Default languagepage In use since2.4 Obsolete since-
palette
DescriptionNoun. The palette, the painter's tool which holds all the available colors. Default languageClick to change fill color, shift-click to change stroke color In use since2.4 Obsolete since-
path_node_x
DescriptionVerb. To change the horizontal coordinate x, for a node (point). Default languageChange node's x coordinate In use since2.4 Obsolete since-
path_node_y
DescriptionVerb. To change the vertical coordinate y, for a node (point). Default languageChange node's y coordinate In use since2.4 Obsolete since-
rect_height
DescriptionVerb. To change the height of a rectangle. Default languageChange rectangle height In use since2.4 Obsolete since-
rect_rx
DescriptionVerb. To change the value of the radius of the corners, for a rectangle with rounded corners. Default languageChange Rectangle Corner Radius In use since2.4 Obsolete since-
rect_width
DescriptionVerb. To change the width of a rectangle. Default languageChange rectangle width In use since2.4 Obsolete since-
relativeToLabel
DescriptionAdverb. (Objects aligned) relatively to either objects, or the page. Default languagerelative to: In use since2.4 Obsolete since-
rheightLabel
DescriptionNoun. Height. Default languageheight: In use since2.4 Obsolete since2.5
rwidthLabel
DescriptionNoun. Width. Default languagewidth: In use since2.4 Obsolete since2.5
seg_type
DescriptionVerb. To change the type of a segment. Default languageChange Segment type In use since2.4 Obsolete since-
selLayerLabel
DescriptionVerb. To move elements to (another layer): Default languageMove elements to: In use since2.4 Obsolete since-
selLayerNames
DescriptionVerb. To move selected elements to a different layer. Default languageMove selected elements to a different layer In use since2.4 Obsolete since-
selectedPredefined
DescriptionVerb. To select predifined values, for the canvas dimensions. Default languageSelect predefined: In use since2.4 Obsolete since-
selected_objects
DescriptionPast participle. Objects which are selected. Default languageselected objects In use since2.4 Obsolete since-
selected_x
DescriptionVerb. To change the horizontal coordinate X. Default languageChange X coordinate In use since2.4 Obsolete since-
selected_y
DescriptionVerb. To change the vertical coordinate Y. Default languageChange Y coordinate In use since2.4 Obsolete since-
smallest_object
DescriptionSuperlative adjective. The smallest object. Default languagesmallest object In use since2.4 Obsolete since-
straight_segments
DescriptionNoun. Type of segment: straight line, as opposed to curve. Default languageStraight In use since2.4 Obsolete since-
stroke_color
DescriptionVerb. To change the color of the outline (exterior) of an element. Default languageChange stroke color In use since2.4 Obsolete since-
stroke_style
DescriptionVerb. To change the style of dashes, for the outline (exterior) of an element. Default languageChange stroke dash style In use since2.4 Obsolete since-
stroke_tool_bottom
DescriptionNoun. The outline (exterior) of an element. This includes the color/opacity, the line thicknes and the line style (dashes and/or dots). Default languagestroke: In use since2.4 Obsolete since2.5
stroke_width
DescriptionVerb. To change the width of the outline (exterior) of an element. Default languageChange stroke width by 1, shift-click to change by 0.1 In use since2.4 Obsolete since-
svginfo_bg_note
DescriptionNote : Background will not be saved with the image. Default languageNote: Background will not be saved with image. In use since2.4 Obsolete since-
svginfo_change_background
DescriptionNoun. The background color or image of the editor. Default languageEditor Background In use since2.4 Obsolete since-
svginfo_dim
DescriptionNoun. The dimensions of the canvas. Default languageCanvas Dimensions In use since2.4 Obsolete since-
svginfo_editor_prefs
DescriptionNoun. The preferences of the editor. Default languageEditor Preferences In use since2.4 Obsolete since-
svginfo_height
DescriptionNoun. Height. Default languageHeight: In use since2.4 Obsolete since-
svginfo_icons
DescriptionNoun. Size of the icons. Default languageIcon size In use since2.4 Obsolete since-
svginfo_image_props
DescriptionNoun. The properties of the image. Default languageImage Properties In use since2.4 Obsolete since-
svginfo_lang
DescriptionNoun. Language (of the editor). Default languageLanguage In use since2.4 Obsolete since-
svginfo_title
DescriptionNoun. Title (of the image). Default languageTitle In use since2.4 Obsolete since-
svginfo_width
DescriptionNoun. Width (of the image). Default languageWidth: In use since2.4 Obsolete since-
text
DescriptionNoun. Text, content of a text element. Default languageChange text contents In use since2.4 Obsolete since-
toggle_stroke_tools
DescriptionVerb. To show/hide the additional stroke tools Default languageShow/hide more stroke tools In use since2.5 Obsolete since-
tool_alignbottom
DescriptionVerb. To align the bottom of selected elements. Default languageAlign Bottom In use since2.4 Obsolete since-
tool_aligncenter
DescriptionVerb. To center vertically, relatively to the vertical axis Default languageAlign Center In use since2.4 Obsolete since-
tool_alignleft
DescriptionVerb. To align the left sides of selected elements. Default languageAlign Left In use since2.4 Obsolete since-
tool_alignmiddle
DescriptionVerb. To center horizontally, relatively to the horizontal axis Default languageAlign Middle In use since2.4 Obsolete since-
tool_alignright
DescriptionVerb. To align the right sides of selected elements. Default languageAlign Right In use since2.4 Obsolete since-
tool_aligntop
DescriptionVerb. To align the top sides of selected elements. Default languageAlign Top In use since2.4 Obsolete since-
tool_angle (was: angle)
DescriptionVerb. To change the angle of rotation applied to an object. Default languageChange rotation angle In use since2.4 Obsolete since-
tool_blur
DescriptionVerb. To change the gaussian blur value of an object. Default languageChange gaussian blur value In use since2.5 Obsolete since-
tool_bold
DescriptionAdjective. Bold text Default languageBold Text In use since2.4 Obsolete since-
tool_circle
DescriptionNoun. Circle. Default languageCircle In use since2.4 Obsolete since-
tool_clear
DescriptionAdjective. New Image Default languageNew Image In use since2.4 Obsolete since-
tool_clone
DescriptionVerb. To clone an element Default languageClone Element In use since2.4 Obsolete since-
tool_clone_multi
DescriptionVerb. To clone elements Default languageClone Elements In use since2.4 Obsolete since-
tool_delete
DescriptionVerb. To delete an element Default languageDelete Element In use since2.4 Obsolete since-
tool_delete_multi
DescriptionVerb. To delete selected elements Default languageDelete Selected Elements In use since2.4 Obsolete since-
tool_docprops
DescriptionNoun. The document properties Default languageDocument Properties In use since2.4 Obsolete since-
tool_docprops_cancel
DescriptionVerb. To cancel Default languageCancel In use since2.4 Obsolete since-
tool_docprops_save
DescriptionNoun. OK (does not mean "Save") Default languageOK In use since2.4 Obsolete since-
tool_ellipse
DescriptionNoun. Ellipse Default languageEllipse In use since2.4 Obsolete since-
tool_export
DescriptionVerb. To save the image as a PNG, JPEG, BMP, or WEBP file Default languageExport In use since2.5 Obsolete since-
tool_eyedropper
DescriptionVerb. Tool for copying the style from one element to another Default languageEye Dropper Tool In use since2.5 Obsolete since-
tool_fhellipse
DescriptionNoun. Free-hand ellipse Default languageFree-Hand Ellipse In use since2.4 Obsolete since-
tool_fhpath
DescriptionNoun. Pencil tool Default languagePencil Tool In use since2.4 Obsolete since-
tool_fhrect
DescriptionNoun. Free-hand rectangle Default languageFree-Hand Rectangle In use since2.4 Obsolete since-
tool_font_size (was: font_size)
DescriptionVerb. To change the font size of a text element. Default languageChange Font Size In use since2.4 Obsolete since-
tool_group
DescriptionVerb. To group elements Default languageGroup Elements In use since2.4 Obsolete since-
tool_image
DescriptionNoun. Image tool Default languageImage Tool In use since2.4 Obsolete since-
tool_import
DescriptionVerb. To import an SVG file into the image. Default languageImport SVG In use since2.5 Obsolete since-
tool_opacity (was: group_opacity)
DescriptionVerb. To change the opacity of selected items. Default languageChange selected item opacity In use since2.4 Obsolete since-
tool_openclose_path
DescriptionVerb. To make a path or part of a path open or closed Default languageOpen/close sub-path In use since2.5 Obsolete since-
tool_italic
DescriptionAdjective. Italic text Default languageItalic Text In use since2.4 Obsolete since-
tool_line
DescriptionNoun. Line tool Default languageLine Tool In use since2.4 Obsolete since-
tool_move_bottom
DescriptionVerb. To move (the selected element) to the bottom Default languageMove to Bottom In use since2.4 Obsolete since-
tool_move_top
DescriptionVerb. To move (the selected element) to the top Default languageMove to Top In use since2.4 Obsolete since-
tool_node_clone
DescriptionVerb. To clone a node Default languageClone Node In use since2.4 Obsolete since-
tool_node_delete
DescriptionVerb. To delete a node Default languageDelete Node In use since2.4 Obsolete since-
tool_node_link
DescriptionVerb. To link control points: to make the two handles of a node move together, with solidarity, instead of individually. Default languageLink Control Points In use since2.4 Obsolete since-
tool_open
DescriptionVerb. To open an image Default languageOpen Image In use since2.4 Obsolete since-
tool_path
DescriptionNoun. Path tool. The chosen word musn't mean Polygon. Default languagePath Tool In use since2.3 Obsolete since2.4
tool_position
DescriptionVerb. To align a single element in reference to the page Default languageAlign Element to Page In use since2.5 Obsolete since-
tool_rect
DescriptionNoun. Rectangle Default languageRectangle In use since2.4 Obsolete since-
tool_redo
DescriptionVerb. To redo Default languageRedo In use since2.4 Obsolete since-
tool_reorient
DescriptionVerb. (to) Reorient (a) path: For a previously rotated object, make its bounding box parallel to the canvas, and with a rotation angle of 0°. Resets the bounding box origin. Default languageReorient path In use since2.4 Obsolete since-
tool_save
DescriptionVerb. To save the image Default languageSave Image In use since2.4 Obsolete since-
tool_select
DescriptionNoun. Select (selection) tool Default languageSelect Tool In use since2.4 Obsolete since-
tool_source
DescriptionVerb. To edit the source (opens the source editor) Default languageEdit Source In use since2.4 Obsolete since-
tool_source_cancel
DescriptionVerb. To cancel, discard changes. Default languageCancel In use since2.4 Obsolete since-
tool_source_save
DescriptionVerb. (to) Apply changes, accept changes. (does not mean "Save") Default languageApply Changes In use since2.4 Obsolete since-
tool_square
DescriptionNoun. Square Default languageSquare In use since2.4 Obsolete since-
tool_text
DescriptionNoun. Text tool Default languageText Tool In use since2.4 Obsolete since-
tool_topath
DescriptionVerb. To convert (a regular shape, circle, ellipse, rectangle...) in a path (with editable segments) Default languageConvert to Path In use since2.4 Obsolete since-
tool_undo
DescriptionVerb. To undo Default languageUndo In use since2.4 Obsolete since-
tool_ungroup
DescriptionVerb. To ungroup elements (previously grouped) Default languageUngroup Elements In use since2.4 Obsolete since-
tool_wireframe
DescriptionNoun. Wireframe, outline mode (shows the outline of the elements, with no colors) Default languageWireframe Mode In use since2.4 Obsolete since-
tool_zoom
DescriptionNoun. Zoom tool Default languageZoom Tool In use since2.4 Obsolete since-
tools_ellipse_show
DescriptionNoun. Ellipse/Circle tool Default languageEllipse/Circle Tool In use since2.4 Obsolete since2.5 r1333
tools_rect_show
DescriptionNoun. Square/Rectangle tool Default languageSquare/Rect Tool In use since2.4 Obsolete since2.5 r1333
url_notice
DescriptionSentence. Notice given to indicate the raster image cannot be embedded and depends on the given path to appear Default languageNOTE: This image cannot be embedded. It will depend on this path to be displayed In use since2.5 Obsolete since-
zoom_panel (was: zoom)
DescriptionVerb. To change the zoom level Default languageChange zoom level In use since2.5 Obsolete since-
zoomLabel
DescriptionNoun. Zoom: Default languagezoom: In use since2.4 Obsolete since2.5
sidepanel_handle
DescriptionVerb, then Noun. To drag left/right (in order) to resize the side panel, then, L a y e r s. Default languageDrag left/right to resize side panel Default languageL a y e r s In use since2.4 Obsolete since-
JavaScript strings (js_strings)
QerrorsRevertToSource
DescriptionSentence. States that there were errors while parsing the manually given SVG source code. Asks if it should go back to the original code. Default languageThere were parsing errors in your SVG source.\nRevert back to original SVG source? In use since2.4 Obsolete since-
QignoreSourceChanges
DescriptionSentence. Verifies that the changes made to the SVG source code can be rolled back. Default languageIgnore changes made to SVG source? In use since2.4 Obsolete since-
QmoveElemsToLayer
DescriptionSentence. Verifies that the selected items must be moved to another (already specified) layer. ('%s' must not be translated or changed.) Default languageMove selected elements to layer '%s'? In use since2.4 Obsolete since-
QwantToClear
DescriptionSentence. Verifies if the entire drawing, including the undo history, should be discarded. Default languageDo you want to clear the drawing?\nThis will also erase your undo history! In use since2.4 Obsolete since-
cancel
DescriptionVerb. Cancels a given command and returns back to the state before that. Default languageCancel In use since2.4 Obsolete since-
dupeLayerName
DescriptionSentence. Is displayed if a layer is created with a name of an already existing layer. Default languageThere is already a layer named that! In use since2.4 Obsolete since-
enterNewImgURL
DescriptionVerb. Lets you edit the URL of an inserted image. Default languageEnter the new image URL In use since2.4 Obsolete since-
enterNewLayerName
DescriptionSentence. Asks for a new layer name. A layer name identifies a layer. Default languagePlease enter the new layer name In use since2.4 Obsolete since-
enterUniqueLayerName
DescriptionSentence. Asks for a unique layer name. Default languagePlease enter a unique layer name In use since2.4 Obsolete since-
featNotSupported
DescriptionNoun. States that a function is not supported. Default languageFeature not supported In use since2.4 Obsolete since-
invalidAttrValGiven
DescriptionAdjective. States that a given value is not correct. Eg some text is given while a number is required. Default languageInvalid value given In use since2.4 Obsolete since-
defsFailOnSave
DescriptionSentence. Provides a message for Firefox users indicating that gradients, markers, etc will not appear as expected when saving. Default languageNOTE: Due to a bug in your browser, this image may appear wrong (missing gradients or elements). It will however appear correct once actually saved. In use since2.5 Obsolete since-
loadingImage
DescriptionSentence. Text that briefly appears on the page when the "Export" option is chosen Default languageLoading image, please wait... In use since2.5 Obsolete since-
saveFromBrowser
DescriptionSentence. Text that appears in popup on the new window with a SVG or image (%s = PNG, JPEG, BMP, WEBP, SVG) Default languageSelect \"Save As...\" in your browser to save this image as a %s file. In use since2.5 Obsolete since-
noteTheseIssues
DescriptionSentence. On "Export", the prefix text to indicate there are issues. Default languageAlso note the following issues: In use since2.5 Obsolete since-
key_backspace
DescriptionNoun. Name of the keyboard key: backspace Default languagebackspace In use since2.4 Obsolete since-
key_del
DescriptionNoun. Name of the keyboard key: delete Default languagedelete In use since2.4 Obsolete since-
key_down
DescriptionNoun. Name of the keyboard key: down Default languagedown In use since2.4 Obsolete since-
key_up
DescriptionNoun. Name of the keyboard key: up Default languageup In use since2.4 Obsolete since-
layer
DescriptionNoun. Gives the name for a layer. An image can have multiple layers that can group a number of elements. Default languageLayer In use since2.4 Obsolete since-
layerHasThatName
DescriptionSentence. States that the new layer name is the same as the old layer name. Default languageLayer already has that name In use since2.4 Obsolete since-
noContentToFitTo
DescriptionSentence. States that the command to resize the canvas to all content could not be executed, because there is no content. Default languageNo content to fit to In use since2.4 Obsolete since-
ok
DescriptionNoun. Executes the action and commits the changes that have been made. Default languageOK In use since2.4 Obsolete since-
pathCtrlPtTooltip
DescriptionVerb. States that the point that is being hovered can be dragged elsewhere. This will change the curve of the matching line. Default languageDrag control point to adjust curve properties In use since2.4 Obsolete since-
pathNodeTooltip
DescriptionVerb. States that the point that is being hovered can be dragged elsewhere. This will change the shape. The point can also be double-clicked, which will change the matching line type. Default languageDrag node to move it. Double-click node to change segment type In use since2.4 Obsolete since-
exportNoBlur
DescriptionSentence. Note that blur is not supported on image export Default languageBlurred elements will appear as un-blurred In use since2.5 Obsolete since-
exportNoImage
DescriptionSentence. Note that Image elements are not supported on image export Default languageImage elements will not appear In use since2.5 Obsolete since-
exportNoforeignObject
DescriptionSentence. Note that foreignObject elements are not supported on image export Default languageforeignObject elements will not appear In use since2.5 Obsolete since-
exportNoDashArray
DescriptionSentence. Note that stroke-dasharray is not supported on image export (will appear as regular stroke instead) Default languageStrokes will appear filled In use since2.5 Obsolete since-
exportNoText
DescriptionSentence. Note that text is not supported on image export (will only appear in browsers that don't support Canvas Text API) Default languageText may not appear as expected In use since2.5 Obsolete since-

283
docs/from-old-wiki/VersionHistory.md Normal file
View File

@@ -0,0 +1,283 @@
Introduction
This page describes the current release and previous versions of SVG-edit. For planned future versions (or current trunk-only features), see the Roadmap.
You can see the changes of the upcoming version here: http://code.google.com/p/svg-edit/source/list
As of 2011-09-29 (and for 2.6+ versions), the license was changed from Apache License v2.0 to MIT.
Current release: 2.7.1 (applied to 2.7 branch)
Fix important ID situation with embedded API
Update functions available to embedded editor
Version 2.7 ([Deltoid curve](https://en.wikipedia.org/wiki/Deltoid_curve))
New Features
Export to PNG, JPEG, BMP, WEBP (including quality control for JPEG/WEBP) for default editor and for the server_opensave extension
Added Star, Polygon, and Panning Extensions [r2318](https://code.google.com/p/svg-edit/source/detail?r=2318) [r2319](https://code.google.com/p/svg-edit/source/detail?r=2319) [r2333](https://code.google.com/p/svg-edit/source/detail?r=2333)
Added non-default extension, ext-xdomain-messaging.js, moving cross-domain messaging code (as used by the embedded editor) out of core and requiring, when the extension IS included, that configuration (an array "allowedOrigins") be set in order to allow access by any domain (even same domain).
Cause embedded editor to pass on URL arguments to the child editor (child iframe)
Added default extension, ext-storage.js moving storage setting code into this (optional) extension; contains dialog to ask user whether they wish to utilize local storage for prefs and/or content; provides configuration options to tweak behaviors.
Allow for a new file config.js within the editor folder (but not committed to SVN and ignored) which is always loaded and can be used for supplying configuration which happens early enough to affect URL or user storage configuration, in addition to extension behavior configuration. Provided config-sample.js to indicate types of configuration one could use (see also defaultPrefs, defaultExtensions, and defaultConfig within svg-editor.js )
Added configuration "preventAllURLConfig", "lockExtensions", and/or "preventURLContentLoading" for greater control of what can be configured via URL.
Allow second argument object to setConfig containing "allowInitialUserOverride" booleans to allow for preference config in config.js to be overridden by URL or preferences in user storage; also can supply "overwrite" boolean in 2nd argument object if set to false to prevent overwriting of any prior-set configuration (URL config/pref setting occurs in this manner automatically for security reasons).
Allow server_opensave extension to work wholly client-side (if browser [supports](http://caniuse.com/#feat=download) the download attribute)
Added [WebAppFind](https://github.com/brettz9/webappfind) extension
Added new php_savefile extension to replace outdated, non-functioning server-save code; requires user to create "savefile_config.php" file and do any validation there (for their own security)
Use addEventListener for 'beforeunload' event so user can add their own if desired
Changed locale behavior to always load from locale file, including English. Allow extensions to add new "langReady" callback which is passed an object with "lang" and "uiStrings" properties whenever the locale data is first made available or changed by the user (this callback will not be invoked until the locale data is available). Extensions can add strings to all locales and utilize this mechanism.
Made fixes impacting path issues and also ext-connector.js
Fixed a bug where the position number supplied on an extension object was too high (e.g., if too few other extensions were included, the extension might not show up because its position was set too high).
Added Polish locale
Zoom features
Make extension paths relative within extensions (issue [1184](https://code.google.com/p/svg-edit/issues/detail?id=1184&can=1&sort=-id&colspec=ID%20Type%20Status%20Priority%20NeededFor%20Browser%20Owner%20Summary))
Security improvements and other fixes
Embedded editor can now work same domain without JSON parsing and the consequent potential loss of arguments or return values.
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.
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.
[http://code.google.com/p/svg-edit/issues/list?can=1&q=NeededFor%3D2.6&colspec=ID+Type+Status+Priority+NeededFor+Browser+Owner+Summary&cells=tiles many more] '>
Release date
April 7th, 2014
Demo
http://svg-edit.googlecode.com/svn/branches/2.7/editor/svg-editor.html
Version 2.6 ([Cycloid](http://en.wikipedia.org/wiki/Cycloid))
New Features
[Support for Internet Explorer 9](http://code.google.com/p/svg-edit/issues/detail?id=120)
Context menu
[Cut/Copy/Paste/Paste in Place options](http://code.google.com/p/svg-edit/issues/detail?id=612)
[Gridlines, snap to grid](http://code.google.com/p/svg-edit/issues/detail?id=131)
Merge layers
Duplicate layer
[Image library](http://code.google.com/p/svg-edit/issues/detail?id=71)
[Shape library](http://code.google.com/p/svg-edit/issues/detail?id=541)
[Basic Server-based tools for file opening/saving](http://code.google.com/p/svg-edit/issues/detail?id=582)
In-group editing
Cut/Copy/Paste
[full list](http://code.google.com/p/svg-edit/issues/list?can=1&q=label%3ANeededFor-2.6)
Release Date
[January 15th, 2013](http://code.google.com/p/svg-edit/source/detail?r=2281)
Demo
http://svg-edit.googlecode.com/svn/branches/2.6/editor/svg-editor.html
Version 2.5 ([Bicorn](http://en.wikipedia.org/wiki/Bicorn))
New Features
[Open Local Files](http://code.google.com/p/svg-edit/issues/detail?id=392) (Firefox 3.6+ only)
[Import SVG into Drawing](http://code.google.com/p/svg-edit/issues/detail?id=72) (Firefox 3.6+ only)
[Ability to create extensions/plugins](http://code.google.com/p/svg-edit/issues/detail?id=310)
[Main menu and overal interface improvements](http://code.google.com/p/svg-edit/issues/detail?id=313)
[Create and select elements outside the canvas](http://code.google.com/p/svg-edit/issues/detail?id=185)
[Base support for the svg:use element](http://code.google.com/p/svg-edit/issues/detail?id=424)
[Add/Edit Sub-paths](http://code.google.com/p/svg-edit/issues/detail?id=443)
[Multiple path segment selection](http://code.google.com/p/svg-edit/issues/detail?id=277)
[Radial Gradient support](http://code.google.com/p/svg-edit/issues/detail?id=298)
[Connector lines](http://code.google.com/p/svg-edit/issues/detail?id=200)
[Arrows & Markers](http://code.google.com/p/svg-edit/issues/detail?id=308)
[Smoother freehand paths](http://code.google.com/p/svg-edit/issues/detail?id=341)
Foreign markup support (ForeignObject/MathML)
[Configurable options](http://code.google.com/p/svg-edit/issues/detail?id=427)
[File-loading options](http://code.google.com/p/svg-edit/issues/detail?id=65)
[Eye-dropper tool (copy element style)](http://code.google.com/p/svg-edit/issues/detail?id=115)
[Stroke linejoin and linecap options](http://code.google.com/p/svg-edit/issues/detail?id=440)
[Export to PNG](http://code.google.com/p/svg-edit/issues/detail?id=70)
[Blur tool](http://code.google.com/p/svg-edit/issues/detail?id=75)
[Page-align single elements](http://code.google.com/p/svg-edit/issues/detail?id=135)
[Inline text editing](http://code.google.com/p/svg-edit/issues/detail?id=364)
[Line draw snapping with Shift key](http://code.google.com/p/svg-edit/issues/detail?id=520)
Release Date
June 15th, 2010
Demo
http://svg-edit.googlecode.com/svn/branches/2.5/editor/svg-editor.html
Version 2.4 ([Arbelos](http://en.wikipedia.org/wiki/Arbelos))
New Features
[Raster Images](http://code.google.com/p/svg-edit/issues/detail?id=57)
[Select Non-Adjacent Elements](http://code.google.com/p/svg-edit/issues/detail?id=119)
[Group/Ungroup](http://code.google.com/p/svg-edit/issues/detail?id=40)
[Zoom](http://code.google.com/p/svg-edit/issues/detail?id=38)
[Layers](http://code.google.com/p/svg-edit/issues/detail?id=73)
[Curve Segments in Paths](http://code.google.com/p/svg-edit/issues/detail?id=118)
[UI Localization](http://code.google.com/p/svg-edit/issues/detail?id=64)
[Wireframe Mode](http://code.google.com/p/svg-edit/issues/detail?id=106)
[Change Background](http://code.google.com/p/svg-edit/issues/detail?id=39)
[Convert Shapes to Path](http://code.google.com/p/svg-edit/issues/detail?id=68)
Release Date
January 11th, 2010
Demo
http://svg-edit.googlecode.com/svn/branches/2.4/editor/svg-editor.html
Full Release Notes
New SVG support
Raster Images
Raster images (PNGs, JPEGs, etc) can now be added and where possible can be entirely embedded in the SVG file.
Group elements
Elements can be added into a group, and each group can be transformed like any other element. Any groups can also be ungrouped.
Add/Remove path nodes
After a path has been created, nodes can now be added or removed.
Curved Paths
After a path has been created, the straight segments (lines between nodes) can be turned into curved segments. Curves can be finely tuned by adjusting their control points.
Floating point values for all attributes
Attribute values are no longer restricted to integers.
Text fields for all attributes
Attributes values are no longer limited to those given in dropdown lists, any (valid) value can now be entered.
Title element
Images and layer groups can now be given a title.
New Interface features
Zoom
The canvas can now be zoomed in or out using a variety of methods:
Using the up/down buttons on the zoom spinner tool in the bottom-left corner
Using the dropdown button next to the zoom spinner tool (includes several "Fit to..." options)
Clicking on the magnifier icon to draw a zoom box, or just click/shift-click on an area to zoom in/out
Double-click tho magnifier icon to return to 100% zoom
Hold the shift key and use the scroll wheel on your mouse to zoom in/out on the area the cursor is on
Layers
Using the panel on the right (click or drag the "Layers" handle), additional layers can be created. Layers can be shown/hidden by clicking on the eye icon, and re-arranged by using the up and down buttons. To move one or more elements to another layer: select the elements, then choose the destination layer from the dropdown list under the layer list.
UI Localization
In addition to English, there are now several language options available for the SVG-Edit interface. When loaded for the first time, SVG-Edit will automatically switch to the language the browser has been set to. Else it will use the language specified in the Document Properties interface. Current supported languages are:
Czech
Dutch
Farsi
French
German
Romanian
Slovak
Spanish
Wireframe Mode
Clicking on the wireframe button (the outlined square and circle icon on the top panel) makes all shapes appear only as outlines, allowing shapes to be seen regardless of their position or opacity level.
Resizable UI (SVG icons)
A dropdown list for the "Icon size" has been added in the Document Properties. This allows toolbars to be set at a smaller or larger size than the default. By using SVG, the icons will appear as intended at any size.
Set background color and/or image (for tracing)
The default white background of the canvas can now be changed to a different color in the Document Properties. Additionally, a URL to an image can be given that can be used to trace over.
Convert Shapes to Paths
All shapes (except text and raster images) can now be converted to path elements by clicking on the "Convert to Path" icon in the context menu. This then allows the shapes to be modified by editing their nodes and segments.
X, Y coordinates for all elements
Elements that do not actually have base x and y values can now be positioned using them anyway, based on the top-left coordinates of their bounding box.
Draggable Dialog boxes
The color/gradient picker and other dialog boxes can now be dragged around.
Select Non-Adjacent Elements
Previously selecting multiple elements was only possible by dragging, you can now select/deselect elements by shift-clicking them while in "select" mode.
Fixed-ratio resize
While resizing elements, you can now hold the shift key to keep the width/height ratio the same.
Automatic Tool Switching
After drawing an element, you will remain in the same mode you were in. However, if you simply click on another element, you will automatically go into "Select" mode.
Version 2.3
New Features
[Align Objects](http://code.google.com/p/svg-edit/issues/detail?id=52)
[Rotate Objects](http://code.google.com/p/svg-edit/issues/detail?id=42)
[Clone Objects](http://code.google.com/p/svg-edit/issues/detail?id=51)
[Select Next/Prev Object](http://code.google.com/p/svg-edit/issues/detail?id=102)
[Edit SVG Source](http://code.google.com/p/svg-edit/issues/detail?id=59)
[Gradient picking](http://code.google.com/p/svg-edit/issues/detail?id=33)
[Polygon Mode](http://code.google.com/p/svg-edit/issues/detail?id=34) (Path Editing, Phase 1)
[(full list)](http://code.google.com/p/svg-edit/issues/list?can=1&q=label%3ANeededFor-2.3)
Release Date
September 8th, 2009
Demo
http://svg-edit.googlecode.com/svn/branches/2.3/editor/svg-editor.html
Version 2.2
New Features
[Multiselect Mode](http://code.google.com/p/svg-edit/issues/detail?id=31)
[Undo/Redo Actions](http://code.google.com/p/svg-edit/issues/detail?id=19)
[Resize Elements](http://code.google.com/p/svg-edit/issues/detail?id=27)
Contextual tools for rect, circle, ellipse, line, text elements
Some updated button images
Stretched the UI to fit the browser window
Resizing of the SVG canvas
Upgraded to jPicker 1.0.8
[(full list)](http://code.google.com/p/svg-edit/issues/list?can=1&q=label%3ANeededFor-2.2)
Release Date
July 8th, 2009
Demo
http://svg-edit.googlecode.com/svn/branches/2.2/editor/svg-editor.html
Version 2.1
New Features
tooltips added to all UI elements
edit of fill opacity, stroke opacity, group opacity
selection of elements
move/drag of elements
save SVG file to separate tab
create and edit text elements
contextual panel of tools
change rect radius, font-family, font-size
keystroke handling
[(full list)](http://code.google.com/p/svg-edit/issues/list?can=1&q=label%3ANeededFor-2.1)
Release Date
June 17th, 2009
Demo
http://svg-edit.googlecode.com/svn/branches/2.1/editor/svg-editor.html
Version 2.0
New Features
draw ellipse, square
change stroke-dasharray (line style)
rearranged whole code to OOP
GUI enhancement
Release Date
[June 3rd, 2009](http://code.google.com/p/svg-edit/source/detail?r=24)
Demo
http://svg-edit.googlecode.com/svn/branches/2.0/svg-editor.html
Version 1.0
New Features
draw path, line, freehand-circle, rect
clear drawn image
delete element
save image
[Release Date](http://code.google.com/p/svg-edit/source/detail?r=9)
Feb 13, 2009
Demo
http://svg-edit.googlecode.com/svn/branches/1.0/svg-editor.html

3
docs/from-old-wiki/VersionLifecycle.md Normal file
View File

@@ -0,0 +1,3 @@
Proposal
The release is by default planned for 12 months after the previous release. However, we can release at any time earlier. For example: * When energy and features are there * Just before a major refactor in trunk

23
docs/from-old-wiki/Wikipedia.md Normal file
View File

@@ -0,0 +1,23 @@
What
There are over 600k SVG images total on [Wikipedia Commons](https://commons.wikimedia.org/). Imagine if all this free content was editable via SVG-edit! (and eventually translatable as well)
The 1st thing we need is RoundtripTests (worked on by Mike Baynton, based on initial ideas / work by Brion Vibber)
Who
Brion Vibber
Mike Baynton
Marc Laporte
You? (join us!)
Related links
http://lists.wikimedia.org/pipermail/wikitech-l/2012-November/064472.html
https://bugzilla.wikimedia.org/show_bug.cgi?id=38271
https://github.com/brion/svg-edit-test
http://leuksman.com/misc/svg-edit-test/ (round-trip tester pulling SVGs from Wikimedia Commons)
https://groups.google.com/forum/#!topic/svg-edit/SfTVM4OPXiA/discussion
https://www.mediawiki.org/wiki/Extension:SVGEdit
https://www.mediawiki.org/wiki/Extension:TranslateSvg
https://code.google.com/p/svg-edit/issues/detail?id=1006
Maybe https://github.com/svg/svgo can be useful?

19
docs/jsdoc-config.json
View File

@@ -1,4 +1,8 @@
{
"plugins": ["plugins/markdown"],
"markdown": {
"tags": []
},
"recurseDepth": 10,
"source": {
"exclude": [
@@ -13,16 +17,19 @@
},
"sourceType": "module",
"tags": {
"allowUnknownTags": true
"allowUnknownTags": false
},
"templates": {
"cleverLinks": false,
"monospaceLinks": false
"cleverLinks": true,
"monospaceLinks": false,
"default": {
"layoutFile": "docs/layout.tmpl"
}
},
"opts":{
"recurse": true,
"verbose": true,
"destination": ".jsdoc/out"
},
"plugins": ["plugins/markdown"]
"destination": "docs/jsdoc",
"tutorials": "docs/tutorials"
}
}

45
docs/layout.tmpl Normal file
View File

@@ -0,0 +1,45 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>JSDoc: <?js= title ?></title>
<script src="scripts/prettify/prettify.js"> </script>
<script src="scripts/prettify/lang-css.js"> </script>
<!--[if lt IE 9]>
<script src="//html5shiv.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
<link type="text/css" rel="stylesheet" href="styles/prettify-tomorrow.css">
<link type="text/css" rel="stylesheet" href="styles/jsdoc-default.css">
<!-- The one customization we are adding for SVGEdit;
`module-SVGEditor.Config.html` was otherwise overflowing -->
<style>
#main {
overflow: auto;
}
</style>
</head>
<body>
<div id="main">
<h1 class="page-title"><?js= title ?></h1>
<?js= content ?>
</div>
<nav>
<?js= this.nav ?>
</nav>
<br class="clear">
<footer>
Documentation generated by <a href="https://github.com/jsdoc3/jsdoc">JSDoc <?js= env.version.number ?></a><?js if(env.conf.templates && env.conf.templates.default && env.conf.templates.default.includeDate !== false) { ?> on <?js= (new Date()) ?><?js } ?>
</footer>
<script> prettyPrint(); </script>
<script src="scripts/linenumber.js"> </script>
</body>
</html>

20
docs/tutorials/CanvasAPI.md Normal file
View File

@@ -0,0 +1,20 @@
# Canvas
While the Canvas works with the [Editor]{@tutorial EditorAPI}, it can also
work on its own.
Its methods can be summarized here.
See also the [JSDocs entry for Canvas]{@link module:svgcanvas}.
## Exposed `svgCanvas` private methods and properties
These are supplied in an object supplied as the first parameter to each
extension function (see [ExtensionDocs]{@tutorial ExtensionDocs} for
an example and information).
See their [JSDocs API]{@link module:svgcanvas.PrivateMethods}.
## Canvas events
See [Events]{@tutorial Events} (under "Canvas events").

170
docs/tutorials/ConfigOptions.md Normal file
View File

@@ -0,0 +1,170 @@
# Introduction
SVG-edit has several options that can be overridden either by adding URL
parameters or by setting the options in JavaScript (since v2.5).
Options may be divided into "config" (which is not meant to be customized
via UI by the user) and "preferences" (which are meant to be customized
by UI).
See the API definition of
[Config]{@link module:SVGEditor.Config}
for the allowable values, defaults, and uses of config.
See the API definition of [Preferences]{@link module:SVGEditor.Prefs}
for their information.
A few among these options related to paths are disallowed via URL though
they can still be set by `svgEditor.setConfig()` (since v2.7).
These are covered in the sections below.
One may preload a file. See "Preloading a file" below.
One may also configure stylesheets expected by the default HTML
(`svgedit-custom.css` (v3.0+) or `custom.css` (v2.8))).
One may also add stylesheets programmatically (since v3.0).
See "Customizing stylesheets" below.
## How to set the options
### Setting options programmatically
Options of either type can be set using `svgEditor.setConfig(options)`,
where `options` is an object literal of keys and values. This must be
run before the actual page or DOM is loaded, otherwise it will have no
effect.
Note that one may create a `svgedit-config-iife.js` file within the project
root directory as of v3.0 (or for v2.8, within `editor/config.js`) and
add such configuration directives to it without needing to modify the
repository editor code
```js
svgEditor.setConfig({
dimensions: [320, 240],
canvas_expansion: 5,
initFill: {
color: '0000FF'
}
});
```
This will set the default width/height of the image, the size of the outside
canvas, and the default "fill" color.
#### Overwrite configuration
For programmatic config setting, one may optionally pass (another)
object to `.setConfig()` as the second argument to further adjust
configuration behavior.
If an `overwrite` boolean is set to `false` on this additional object,
it will, as occurs with all URL type configurations, prevent the current
configuration from overwriting any explicitly set previous configurations.
The default is `true` except for URLs which always are `false`.
If an `allowInitialUserOverride` boolean is set to `true`, this will allow
subsequent configuration overwriting via URL (e.g., if you want the
user to have the option to override certain of your (`svgedit-config-iife.js`)
`.setConfig()` directives via URL while still providing them with
your own default value, you should add this property).
### Setting options via URL
The same options from the "Setting options programmatically" section can be
set in the URL as follows:
```
.../svg-editor.html?dimensions=300,240&canvas_expansion=5&initFill[color]=0000FF
```
## Priority of programmatically-set config vs. URL config
If options are set both using `.setConfig()` as well as in the URL, the
`.setConfig()` value will be used (as of v2.7). (The reverse was true in
previous versions but was changed for security reasons.)
See section "Overwrite configuration" above on changing this behavior.
## Note to developers of SVGEdit on preferences vs. configuration
Those items marked as preferences are intended to be configuration items
which can also be set via the UI (and specifically via Editor Options
except where mentioned). Config and preferences should therefore not
share the same name.
There are, however, some items set in the UI which are currently
stored as config, whereas a few "preferences" are not meant to be set
by the user. A future version may adjust these types.
## Preloading a file
It is possible to start the editor with preloaded SVG file, using either
of the following approahces.
### Preload a file (Programmatically)
One should bear in mind that if one wishes to immediately set a
particular string regardless of previous saves by the user, especially when
from the config file (`svgedit-config-iife.js` in v3.0 or `editor/config.js`
in v2.8) which runs early, one should first set the config option
`noStorageOnLoad` to `true` or otherwise any
previous local storage that is found will overwrite your own string.
Bear in mind that if this option is set, the user will be prevented thereby
from saving their own text locally.
If you wish to store a one-time default and let the user subsequently save
locally, you do not need to set `noStorageOnLoad` as storage will only be
set if storage is found.
```js
// Serialized string:
svgEditor.loadFromString('<svg xmlns="...">...</svg>');
// Data URI:
svgEditor.loadFromDataURI('data:image/svg+xml;base64,...');
// Local URL:
svgEditor.loadFromURL('images/logo.svg');
```
### Preload a file (by URL)
As a URL parameter, one can pre-load an SVG file in the following manner:
```js
// Data URI
'?source=' + encodeURIComponent('data:image/svg+xml;utf8,' + /*...*/);
// Data URI (base 64):
'?source=' + encodeURIComponent('data:image/svg+xml;base64,' + /* ... */); // data%3Aimage%2Fsvg%2Bxml%3Bbase64%2C ...
// Local URL:
'?url=' + encodeURIComponent('images/logo.svg'); // images%2Flogo.svg
```
**Note:** There is currently a bug that prevents data URIs ending with
equals (=) characters from being parsed. Removing these characters seem
to allow the import to work as expected.
<!-- Todo: Is this still occurring? -->
## Customizing stylesheets
As of version 3.0, stylesheets can be indicated dynamically (and
asynchronously loaded though applied serially) via
`svgEditor.setConfig({stylesheets: [...]})`.
To add your own stylesheets along with the default stylesheets, ensure
`"@default"` is present in the array along with your own. For example:
```js
svgEditor.setConfig({stylesheets: ['@default', 'myStylesheet.css']});
```
(In version 2.8, the CSS file `editor/custom.css` was included by default,
whether the file existed or not. With version 3.0, the move was made to
be fully modular and let plugins add their default stylesheets to
`$.loadingStylesheets` which SVGEdit would load dynamically, so that HTML
would not need to indicate such style-information in a non-modular fashion.)

21
docs/tutorials/Editor.md Normal file
View File

@@ -0,0 +1,21 @@
# Editor
This document is for detailing usage of the Editor by regular users (as
opposed to the [API of the Editor for programmers]{@tutorial EditorAPI}).
Until we may flesh this document out further, we may begin with tips on the
features which are more non-obvious as to usage (including for novices to
graphic design). Feel free to file an issue to request documentation on a
particular feature.
See also some possibly out-of-date documentation at
[FrequentlyAskedQuestions]{@tutorial FrequentlyAskedQuestions}.
## Paths
When working with a path (as created by the Path tool left ("mode")
toolbar item or "Convert to Path" in the "context" toolbar at the
top), chosen by the "Select" left-toolbar item, clicking the item once
will allow the normal resizing/rotation, and clicking the item again
will allow for independent manipulation of the path and display a
different context-dependent toolbar at the top of the screen.

11
docs/tutorials/EditorAPI.md Normal file
View File

@@ -0,0 +1,11 @@
# Editor API
This is an entry point that summarizes the documentation on the Editor.
For user-facing information about the Editor, see [Editor]{@tutorial Editor}.
The main API entrance point is with the [Editor JSDocs]{@link module:Editor}.
## Canvas-specific methods
See [Canvas]{@tutorial Canvas}.

128
docs/tutorials/Events.md Normal file
View File

@@ -0,0 +1,128 @@
# Introduction
## `save`, `open`, `exportImage` (`setCustomHandlers`)
You can hook to the save event (e.g. in an extension), to handle saving
the SVG file differently:
### Example
```js
svgEditor.setCustomHandlers({
save (win, data) {
// Save svg
}
});
```
Other methods corresponding to UI events that may be supplied are `open`
and `exportImage`.
See [`CustomHandler`]{@link module:SVGEditor.CustomHandler} for the required
format of the object to be passed to
[`setCustomHandlers`]{@link module:SVGEditor.setCustomHandlers}.
## Parent/Opening window events
### `svgEditorReady`
The `svgEditorReady` event is triggered on a containing `document` (of
`window.opener` or `window.parent`) when the editor is loaded.
See [svgEditorReadyEvent]{@link module:SVGEditor#event:svgEditorReadyEvent}
for the JSDocs.
### Example
```js
$(document).bind('svgEditorReady', function () {
const svg = `
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN"
"http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg xmlns="http://www.w3.org/2000/svg" width="100" height="50">
<ellipse cx="50" cy="25" rx="50" ry="25" style="fill:blue;"/>
</svg>`;
$('iframe.svgedit')[0].contentWindow.svgCanvas.setSvgString(svg);
});
```
If you are acting within the frame, you may use `svgEditor.ready`
(see [Within-frame events](#Editor-within-frame-events-svgEditor) below).
## Editor (within-frame) events (`svgEditor`)
### `svgEditor.canvas`
- Canvas object. See [Canvas events](#Canvas-events).
### `svgEditor.canvas.bind(eventName, function () {})`
- Method for listening to canvas events. See [Canvas events](#Canvas-events).
### `svgEditor.ready(function () {})`
Method for listening to editor callbacks. Used internally as well.
No arguments passed to callback.
See [`SVGEditor.ready`]{@link module:SVGEditor.ready}.
## Extension events
Most extensions will want to run functions when certain events are
triggered. This is a list of the current events that can be hooked
onto. All events are optional.
See the `vars` param of
[`runExtensions`]{@link module:svgcanvas.SvgCanvas#runExtensions}
for some of the available extension events and their descriptions and types.
See [`ExtensionStatus`]{@link module:svgcanvas.ExtensionStatus} for the
values to be returned by the corresponding extension methods listening
for these extension event types.
## Canvas events
Canvas events are listened to with the bind method
([JSDocs API]{@link module:svgcanvas.SvgCanvas#bind}):
```js
canvas.bind(eventName, callback);
```
Canvas events are passed between the editor and canvas and should mostly
only of be of interest to those working with the [Canvas]{@tutorial CanvasAPI}
alone or those developing SVGEdit).
`callback` (see [`EventHandler`]{@link module:svgcanvas.EventHandler}) will be passed the
`window` object and a single argument specific to the event
(see [`GenericCanvasEvent`]{@link module:svgcanvas.SvgCanvas#event:GenericCanvasEvent}).
The `bind` method will return any previous callback attached to the given
event name.
The method used to trigger these bound events is `call()`
([JSDocs]{@link module:svgcanvas.SvgCanvas#call}).
All events below are currently called from within `svgcanvas.js` except where
noted. All events are also defined internally within `svg-editor.js` except
where noted.
|Event|Where bound/defined (besides editor)|Where called/triggered (besides canvas)|
|-----|------------------------------------|-----------------------------|
|`changed` | | (Also called from `draw.js`, `ext-arrows.js`, `ext-foreignObject.js`, `ext-markers.js`, `ext-polygon.js`, `ext-star.js`, and `path.js`) |
|`cleared` | Not bound/defined in SVGEdit. | |
|`contextset` | | Only called from `draw.js`|
|`exported` | | |
|`exportedPDF` | | |
|`extension_added` | | |
|`extensions_added` | | Only called from `svg-editor.js` |
|`message` | Only bound/defined in `ext-webappfind.js` | Only called from `svg-editor.js` |
|`pointsAdded` | Not bound/defined in SVGEdit. | |
|`saved` | | |
|`selected` | | Also called from `path.js` |
|`setnonce` | Only bound/defined in `ext-arrows.js` | |
|`transition` | | |
|`updateCanvas` | | |
|`unsetnonce` | Only bound/defined in `ext-arrows.js` | |
|`zoomed` | | |
|`zoomDone` | | |

223
docs/tutorials/ExtensionDocs.md Normal file
View File

@@ -0,0 +1,223 @@
# Introduction
SVG-Edit has support for extensions (as of v2.5). This is a guide for
creating SVG-Edit extensions.
## Means to have extensions loaded
SVG-Edit extensions are standalone JavaScript files that can be either
included in the HTML file, loaded using `setConfig`, or indicated through
the URL (see [ConfigOptions]{@tutorial ConfigOptions} for usage).
Note that, as of v3.0, if you create a `svgedit-config-iife.js` file in
the project root directory (`config.js` in the `editor` directory for
v2.8), this will be used to execute commands before extensions are loaded,
e.g., if you wish to make configuration changes which affect extension
loading behavior. Normally, however, it should be preferable for modularity
to use the extension mechanism, as this can allow you or users to customize
which extensions are loaded (whereas `svgedit-config-iife.js` will always
run if present).
## Basic format
This is the general format for an extension:
```js
export default {
name: 'extensionname',
init (methods) {
return extensionData;
}
};
```
Extensions must export an object. (For the API docs of this object, see
[ExtensionObject]{@link module:SVGEditor.ExtensionObject}.)
The first property on the object exported above, `name`, is the unique
ID for this extension. It can actually be omitted, in which case the
ID (not shown visually) will instead be determined from the file name
(omitting the initial "ext-" and ending ".js"). These are not displayed
visually, so the only purpose is to avoid name conflicts with other
extensions.
The other property above (`init`) is a function (see
[`ExtensionInitCallback`]{@link module:svgcanvas.ExtensionInitCallback}
for its API) that is supplied methods and variables from svgCanvas (see
[`ExtensionArgumentObject`]{@link module:svgcanvas.ExtensionArgumentObject})
and can return an object that includes properties and functions that may
be required for further processing by
the extension, depending on the type of methods desired by the extension
being added. See [`ExtensionInitResponse`]{@link module:svgcanvas.ExtensionInitResponse}
for API documentation on the response type(s) available for `init`.
Its `this` value is bound to the editor, so
[those methods]{@link module:SVGEditor} are also available.
In order to await execution of set-up such as calls to `langReady` and
`svgIcons`, the callback `callback` can be added to the object returned with
the call to `init`. The callback is invoked upon addition of the extension,
or, if svgicons are set, then after the icons are ready. See
[`ExtensionInitResponse#callback`]{@link module:svgcanvas.ExtensionInitResponse#callback}
in the API for more on this.
## Example
The basic Hello world extension (in `/editor/extensions/ext-helloworld.js`)
can be seen as an example on how to create a basic extension. This extension
adds a "mode" button to the bottom of the left panel that changes the mode,
then shows a "Hello world" message whenever the canvas is clicked on. See
[extension in action](https://svg-edit.github.io/svgedit/releases/latest/editor/svg-editor.html?extensions=ext-helloworld.js).
The basic structure of this extension looks like this:
```js
export default {
name: 'helloworld',
init () {
return {
svgicons: 'extensions/helloworld-icon.xml',
buttons: [{...}],
mouseDown () {
...
},
mouseUp (opts) {
...
}
};
}
};
```
Note how the returned properties may include information on the buttons,
as well as the functions that should be run when certain events take place.
The "Hello World" extension also demonstrates internationalization (see
the next section).
## Internationalization of extensions
The locale files for extensions (which need translation as with the main
locales) are hosted in `editor/extensions/ext-locale/<ext name>/`.
Both `addLangData`
([JSDocs]{@link module:svgcanvas.ExtensionInitResponse#addLangData})
(invoked early)
and `langReady`
([JSDocs]{@link module:svgcanvas.ExtensionInitResponse#langReady})
are passed objects with an `importLocale` function
([JSDocs]{@link module:SVGEditor~ImportLocale}) that you can use to
import your own extension locales hosted in the above-mentioned directory.
The `importLocale` function will use the detected locale and detected
extension name by default (no need for arguments), and returns a
`Promise` that will resolve to the locale strings found within a
file you place at:
`${svgEditor.curConfig.extPath}ext-locale/<extNameWithoutExtPrefix>/<lang>.js`
(`<lang>` is the detected `lang` returned on
[`langReady`]{@link module:SVGEditor.ExtensionVars_langReady} and
`<extNameWithoutExtPrefix>` is your extension name without the initial
required "ext-" prefix and without the trailing ".js").
The resolved `Promise` value is expected to adhere to
[`LocaleStrings`]{@link module:locale.LocaleStrings} (as with SVGEdit's
global locale files).
You could also use your own means to store and retrieve locale data for
your extension (and
[`importSetGlobalDefault`]{@link module:importModule.importSetGlobalDefault}
is available should this be of assistance) in which case the `global`
property should follow the format
`svgEditorExtensionLocale_<extNameWithoutExtPrefix>_<lang>` to avoid global
naming conflicts in the non-modular version of SVGEdit.
```js
import {importSetGlobalDefault} from '../external/dynamic-import-polyfill/importModule.js';
// ...
(async () => {
const url = `${svgEditor.curConfig.extPath}ext-locale/<extNameWithoutExtPrefix>/<lang>.js`;
const localeStrings = await importSetGlobalDefault(url, {
global: 'svgEditorExtensionLocale_imagelib_' + lang
});
// Use `localeStrings`
})();
```
In addition to your own extension's locale strings,
[`langReady`]{@link module:svgcanvas.ExtensionInitResponse#langReady}
also has access to the global internationalization strings through the
`uiStrings` property on the object passed to it (see
[event:ext-langReady]{@link module:svgcanvas.SvgCanvas#event:ext-langReady}).
See also [LocaleDocs]{@tutorial LocaleDocs}, including for information on
formatting of locale strings (the current lack of any standard beyond a
convention of using brackets for variables).
## Creating buttons
Buttons can appear either in the "mode" panel (left panel) or the "context"
panel (top panel, changes depending on selection). Their icons can
either consist of SVG icons (recommended) or just raster images.
Each button is an object (added to the
array "buttons" on the object returned by the extension's `init` method).
Its properties are outlined at
[`SVGEditor.Button`]{@link module:SVGEditor.Button}.
## Creating SVG icons
The SVG-Edit project uses icons created using basic SVG (generally
using SVG-Edit as design tool), and extensions are encouraged to do so
too. This allows the interface toolbars to be resized and icons to be
reused at various sizes. If your extension uses multiple icons, they can
all be stored in the same file. To specify icon file used, set the path
under the extension's returned `svgicons` property.
An SVG icon file is an XML document that consists of a root SVG element
with child group elements (`<g></g>`). Each of these has an ID that
should match the ID specified in the associated button object.
Its content should be the SVG source of the icon. See the "Hello World"
icon as an example.
For further information, see the SVG Icon Loader project.
## Creating context tools
Context tools appear in the top toolbar whenever a certain type of
element is selected.
These are added by the extension returning an object with the
property "context_tools". See [this object's API]{@link module:SVGEditor.ContextTool}
for details.
## SVG-Edit extension events
See [Events]{@tutorial Events} for the events that lead to the triggering
of extension callbacks. (Mostly of relevance for developers of SVGEdit itself.)
## Helpers
A variety of properties and methods can be accessed within extensions.
### `svgCanvas` properties and methods
These are supplied in an object through the first parameter of the
extension function (see "methods" variable in above example).
See
[`ExtensionArgumentObject`]{@link module:svgcanvas.ExtensionArgumentObject}.
Note that this object also has these
[surfaced private methods and properties from Canvas]{@link module:svgcanvas.PrivateMethods}.
### `svgEditor` public properties and methods
The `this` value of the `init`
([JSDocs]{@link module:svgcanvas.ExtensionInitCallback}) method
is the [Editor object]{@link module:SVGEditor}. Its methods may be invoked
from on `this` within that method.

89
docs/tutorials/FrequentlyAskedQuestions.md Normal file
View File

@@ -0,0 +1,89 @@
**NOTE: The following may contain outdated content.**
**Q: Why doesn't SVG-edit work in Internet Explorer 6-7-8?**
A: SVG-edit only works in IE6-7-8 if you have installed the Google Chrome
Frame plugin. Internet Explorer 8 and under do not natively support Scalable
Vector Graphics (SVG), however IE9+ does, and thus is supported starting
in SVG-edit 2.6
In theory there are several other possibilities that could allow SVG-edit
to work in IE:
* someone gets it to work with the SVG Web shim
* someone gets it to work with IE and the Adobe SVG Viewer
* someone gets it to work with another SVG plugin
**Q: How can I make SVG-edit save files on my server?**
A: As of SVG-edit 2.5.1, an extension is available that overrides the
default open/save behavior and instead uses PHP files to allow proper
open/save dialog boxes. You can include the extension by adding
`ext-server_opensave.js` to the `curConfig.extension` array in
`svg-editor.js` or through other methods mentioned on our ConfigOptions page.
For other server-saving behavior you'll want to modify
`ext-server_opensave.js` or the `filesave.php` file, both available
under `editor/extensions/`.
**Q: How can I set the stroke to 'none'?**
A: Shift-clicking palette squares sets the Stroke paint value. Thus,
you can `shift-click` on the None box (red x on white background) to
clear the Stroke paint.
**Q: How can I help?**
A: See How to participate
**Q: How can I select an element when it's hidden or behind another one?**
A: Select an object. `Shift+O` will select the previous object `Shift+P`
will select the next object. Using the wireframe mode may also help in
seeing hidden objects.
**Q: How can I edit shapes that have been grouped?**
A: Double-click the group and you will shift the editing context to the
group. The rest of the image will not be editable while you are in the
group context. Once you are done editing inside the group, press Escape.
**Q: Can I trace over a raster (PNG, JPEG...) image?**
A: Yes, there are two methods you can use as of SVG-edit 2.4.
1. Go to the Document Properties, and enter the URL of the image under
"Editor Background". This image will then fill the background without
being saved as part of the image.
1. Add a layer from the layer panel. Then draw a raster image (image icon)
and enter your URL. Use the layer above this one to trace over the image
without moving. Note that you can also hide/show layers to help your work.
**Q: How do I use the Wave Gadget?**
A: (Note that this information refers to the SVG-edit 2.3 Wave Gadget,
the Wave Gadget has not been worked on for years though) Go to this wave
wavesandbox.com!w+W7VzCLZk%A and there will be a button on the bottom
that says "Install" and when you are editing things, you will see a
SVG-edit icon in your toolbar that you can click to include the gadget
into any blip.
**Q: How do I copy the style of an object to other(s)?**
A:
- Select the object you want to copy the style from. You'll see its Fill and
Stroke style attributes displayed in the bottom toolbar.
- Holding Shift to keep the first object selected, select one or several
other objects.
- Open the colorpicker by clicking on the color blocks in the bottom
toolbar. If you want to copy the fill, select the Fill block. If you
want to copy the stroke, select the Stroke block.
- Hit "Ok" in the colorpicker
The other objects will get the Fill or the Stroke of the first object.
**Q: How can I serve SVG graphic editor from my own server?**
A: You need to download the latest version to your server and unzip.
The exact commands/instructions are here: <http://howik.com/Improve_your_user%27s_experience_by_adding_svg_graphic_editor_to_your_website_in_less_than_2_minutes>

43
docs/tutorials/LocaleDocs.md Normal file
View File

@@ -0,0 +1,43 @@
# Introduction
As of v3.0, locale files are defined as an object exported as
an ES6 Module default. See `editor/locale` for some example files.
(In previous versions, the locale files were required to call
`svgEditor.readLang`.)
## Expected format
You may also see the [LocaleStrings API]{@link module:locale.LocaleStrings}
for the programmatic definition of the expected object (i.e., an object of
strings and a potential recursion of other such subobjects or an array of
strings and such objects). This is true for extenions as well.
However, we are not currently processing any formatting of such strings
(besides using the convention of using brackets to surround variables
`{variableToSubstitute}`). In the absence of such, you may wish to use
your own formatting such as with
[Fluent.js](https://github.com/projectfluent/fluent.js).
While it is possible we may move to accept JSON in future versions
(to avoid maintainers needing to worry about JavaScript execution),
the ES6 Modules export allows for cleaner objects; there is no need for
quoted keys when alphanumeric keys are used, and there is the opportunity
to use less-distracting single quotes if not
[ES6 Template Literals](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Template_literals)).
## Special properties
While not currently in use, the `dir` property should be used to indicate
the default directionality of the language of the locale, while the `lang`
should define its HTML `lang` value (which should probably always be the
same as "<lang>" within the "lang.<lang>.js" file name).
## Location of locale files (including for extensions)
While `editor/locale` hosts the main locale files, internationalizable
extensions define their own locale files (better supporting modularity). In
our project, these can be found within `editor/extensions/ext-locale/<ext name>/`.
See [ExtensionDocs]{@tutorial ExtensionDocs} if you are implementing an
internationalized extension.

17
docs/tutorials/tutorials.json Normal file
View File

@@ -0,0 +1,17 @@
{
"ExtensionDocs": {
"title": "Extension Docs"
},
"ConfigOptions": {
"title": "Config Options"
},
"Editor": {
"children": ["ConfigOptions", "ExtensionDocs", "LocaleDocs"]
},
"FrequentlyAskedQuestions": {
"title": "Frequently Asked Questions (FAQ)"
},
"LocaleDocs": {
"title": "Locale Docs"
}
}