in progress
|
@ -3,7 +3,7 @@
|
|||
<head>
|
||||
<meta charset="utf-8" />
|
||||
<meta http-equiv="X-UA-Compatible" content="chrome=1"/>
|
||||
<link rel="icon" type="image/png" href="images/logo.png"/>
|
||||
<link rel="icon" type="image/png" href="images/logo.svg"/>
|
||||
<link rel="stylesheet" href="svgedit.css"/>
|
||||
<title>Browser does not support SVG | SVG-edit</title>
|
||||
<style>
|
||||
|
@ -35,7 +35,7 @@
|
|||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<img id="logo" src="images/logo.png" width="48" height="48" alt="SVG-edit logo" />
|
||||
<img id="logo" src="images/logo.svg" width="48" height="48" alt="SVG-edit logo" />
|
||||
<p>Sorry, but your browser does not support SVG. Below is a list of
|
||||
alternate browsers and versions that support SVG and SVG-edit
|
||||
(from <a href="https://caniuse.com/#cats=SVG">caniuse.com</a>).
|
||||
|
|
|
@ -221,7 +221,7 @@ export class FlyingButton extends HTMLElement {
|
|||
break;
|
||||
case 'SE-BUTTON':
|
||||
// change to the current action
|
||||
this.setAttribute('src', ev.target.getAttribute('src'));
|
||||
this.$img.setAttribute('src', ev.target.getAttribute('src'));
|
||||
this.currentAction = ev.target;
|
||||
this.setAttribute('pressed', 'pressed');
|
||||
// and close the menu
|
||||
|
|
|
@ -3,7 +3,7 @@
|
|||
<head>
|
||||
<meta charset="utf-8" />
|
||||
<title>Embed API</title>
|
||||
<link rel="icon" type="image/png" href="images/logo.png"/>
|
||||
<link rel="icon" type="image/png" href="images/logo.svg"/>
|
||||
<script src="jquery.min.js"></script>
|
||||
<script type="module" src="embedapi-dom.js"></script>
|
||||
</head>
|
||||
|
|
|
@ -361,7 +361,6 @@ export default {
|
|||
/** @todo JFH special flag */
|
||||
newUI: true,
|
||||
name: strings.name,
|
||||
svgicons: 'conn.svg',
|
||||
buttons: strings.buttons.map((button, i) => {
|
||||
return Object.assign(buttons[i], button);
|
||||
}),
|
||||
|
|
|
@ -74,7 +74,6 @@ export default {
|
|||
const buttons = [
|
||||
{
|
||||
id: 'tool_eyedropper',
|
||||
icon: 'eyedropper.png',
|
||||
type: 'mode',
|
||||
events: {
|
||||
click () {
|
||||
|
@ -86,7 +85,7 @@ export default {
|
|||
|
||||
return {
|
||||
name: strings.name,
|
||||
svgicons: 'eyedropper-icon.xml',
|
||||
newUI: true,
|
||||
buttons: strings.buttons.map((button, i) => {
|
||||
return Object.assign(buttons[i], button);
|
||||
}),
|
||||
|
|
|
@ -3,7 +3,7 @@
|
|||
<head>
|
||||
<meta charset="utf-8" />
|
||||
<title>-</title>
|
||||
<link rel="icon" type="image/png" href="../../images/logo.png" />
|
||||
<link rel="icon" type="image/png" href="../../images/logo.svg" />
|
||||
|
||||
<!-- Lacking browser support -->
|
||||
<script nomodule="" src="../../redirect-on-no-module-support.js"></script>
|
||||
|
@ -19,7 +19,7 @@
|
|||
<h1>Select an image:</h1>
|
||||
<a href="smiley.svg">smiley.svg</a>
|
||||
<br/>
|
||||
<a href="../../images/logo.png">logo.png</a>
|
||||
<a href="../../images/logo.svg">logo.svg</a>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
|
|
|
@ -3,7 +3,7 @@
|
|||
<head>
|
||||
<meta charset="utf-8" />
|
||||
<title>-</title>
|
||||
<link rel="icon" type="image/png" href="../../images/logo.png" />
|
||||
<link rel="icon" type="image/svg" href="../../images/logo.svg" />
|
||||
|
||||
<!-- Lacking browser support -->
|
||||
<script nomodule="" src="../../redirect-on-no-module-support.js"></script>
|
||||
|
|
|
@ -39,8 +39,8 @@ export default {
|
|||
}
|
||||
}];
|
||||
return {
|
||||
newUI: true,
|
||||
name: strings.name,
|
||||
svgicons: 'ext-panning.xml',
|
||||
buttons: strings.buttons.map((button, i) => {
|
||||
return Object.assign(buttons[i], button);
|
||||
}),
|
||||
|
|
|
@ -164,8 +164,8 @@ export default {
|
|||
}
|
||||
}];
|
||||
return {
|
||||
newUI: true,
|
||||
name: strings.name,
|
||||
svgicons: 'polygon-icons.svg',
|
||||
buttons: strings.buttons.map((button, i) => {
|
||||
return Object.assign(buttons[i], button);
|
||||
}),
|
||||
|
|
|
@ -154,7 +154,7 @@ export default {
|
|||
loadIcons();
|
||||
}
|
||||
const buttons = [{
|
||||
id: 'tool_shapelib',
|
||||
id: 'tool_shapelib_show',
|
||||
icon: 'shapes.png',
|
||||
type: 'mode_flyout',
|
||||
position: 6,
|
||||
|
@ -166,6 +166,7 @@ export default {
|
|||
}];
|
||||
|
||||
return {
|
||||
newUI: true,
|
||||
svgicons: 'ext-shapes.xml',
|
||||
buttons: strings.buttons.map((button, i) => {
|
||||
return Object.assign(buttons[i], button);
|
||||
|
|
|
@ -120,6 +120,7 @@ export default {
|
|||
}];
|
||||
|
||||
return {
|
||||
newUI: true,
|
||||
name: strings.name,
|
||||
svgicons: 'star-icons.svg',
|
||||
buttons: strings.buttons.map((button, i) => {
|
||||
|
|
|
@ -1,6 +1,3 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg">
|
||||
|
||||
<g id="tool_eyedropper">
|
||||
<svg viewBox="0 0 320 320" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
|
||||
<!-- Created with SVG-edit - https://github.com/SVG-Edit/svgedit -->
|
||||
<defs>
|
||||
|
@ -28,7 +25,3 @@
|
|||
<path d="m71.425034,212.350006l9.050888,-20.022537l51.516724,-49.327469l8.507355,0.97197l-69.074966,68.378036z" id="svg_16" fill="url(#eyedropper_svg_19)" stroke-width="5"/>
|
||||
</g>
|
||||
</svg>
|
||||
</g>
|
||||
|
||||
<g id="svg_eof"/>
|
||||
</svg>
|
Before Width: | Height: | Size: 2.3 KiB After Width: | Height: | Size: 2.2 KiB |
Before Width: | Height: | Size: 799 B |
Before Width: | Height: | Size: 3.2 KiB |
|
@ -60,11 +60,6 @@
|
|||
<path stroke-width="10" stroke="#ff7f00" fill="#ff7f00" d="m-30,-30l0,60l60,0l0,-60z"/>
|
||||
</svg>
|
||||
</g>
|
||||
<g id="star">
|
||||
<svg viewBox="-60 -60 120 120" xmlns="http://www.w3.org/2000/svg">
|
||||
<path stroke-width="10" stroke="#ff7f00" fill="#ff7f00" d="m-40,-20l80,0l-70,60l30,-80l30,80z"/>
|
||||
</svg>
|
||||
</g>
|
||||
<g id="box_o">
|
||||
<svg viewBox="-60 -60 120 120" xmlns="http://www.w3.org/2000/svg">
|
||||
<path stroke-width="10" stroke="#ff7f00" fill="none" d="m-30,-30l0,60l60,0l0,-60z"/>
|
||||
|
|
Before Width: | Height: | Size: 5.3 KiB After Width: | Height: | Size: 5.1 KiB |
Before Width: | Height: | Size: 6.5 KiB |
|
@ -1,6 +1,4 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg">
|
||||
<g id="ext-panning">
|
||||
|
||||
<svg xmlns:xlink="http://www.w3.org/1999/xlink" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 300 300">
|
||||
<path d="m8.00038,150.84583l51.60005,-51.78485l0,25.89205l26.28711,0l35.45559,-0.20444l-0.72941,-24.34613l0.93304,-37.61812l-25.79949,0l51.5997,-51.78508l51.60047,51.78508l-25.80024,0l0,33.87256l1.13677,26.21891l21.45996,2.07722l39.3497,0l0,-25.89205l51.60043,51.78485l-51.60043,51.78563l0,-25.89281l-38.41666,-0.93639l-20.52692,0.20445l-3.00285,42.13754l0,20.76308l25.80024,0l-51.60047,51.78561l-51.5997,-51.78561l25.79949,0l0,-20.76308l0.72941,-41.20115l-41.98688,-0.20445l-20.68886,0l0,25.89281l-51.60005,-51.78563z" fill="#b2b2b2" id="svg_1" stroke="#000000" stroke-width="10"/> </svg>
|
||||
</g>
|
||||
</svg>
|
||||
<path d="m8.00038,150.84583l51.60005,-51.78485l0,25.89205l26.28711,0l35.45559,-0.20444l-0.72941,-24.34613l0.93304,-37.61812l-25.79949,0l51.5997,-51.78508l51.60047,51.78508l-25.80024,0l0,33.87256l1.13677,26.21891l21.45996,2.07722l39.3497,0l0,-25.89205l51.60043,51.78485l-51.60043,51.78563l0,-25.89281l-38.41666,-0.93639l-20.52692,0.20445l-3.00285,42.13754l0,20.76308l25.80024,0l-51.60047,51.78561l-51.5997,-51.78561l25.79949,0l0,-20.76308l0.72941,-41.20115l-41.98688,-0.20445l-20.68886,0l0,25.89281l-51.60005,-51.78563z" fill="#b2b2b2" id="svg_1" stroke="#000000" stroke-width="10"/>
|
||||
</svg>
|
Before Width: | Height: | Size: 789 B After Width: | Height: | Size: 713 B |
|
@ -1,14 +0,0 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg">
|
||||
<g id="tool_polygon">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="-1 -2 25 24">
|
||||
<defs>
|
||||
<linearGradient y2="1" x2="1" y1="0.10156" x1="0.36328" id="svg_i22">
|
||||
<stop stop-opacity="1" stop-color="#ffffff" offset="0"/>
|
||||
<stop stop-opacity="1" stop-color="#666666" offset="1"/>
|
||||
</linearGradient>
|
||||
</defs>
|
||||
<polygon points="6.09251,19.6032 0.577744,10.0516 6.09251,0.5 17.1217,0.5 22.6365,10.0516 17.1217,19.6032" stroke="#000000" fill="url(#svg_i22)"/> </svg>
|
||||
</g>
|
||||
|
||||
<g id="svg_eof"/>
|
||||
</svg>
|
Before Width: | Height: | Size: 619 B |
Before Width: | Height: | Size: 16 KiB |
|
@ -1,76 +1,14 @@
|
|||
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
|
||||
<svg
|
||||
xmlns:dc="http://purl.org/dc/elements/1.1/"
|
||||
xmlns:svg="http://www.w3.org/2000/svg"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
xmlns:xlink="http://www.w3.org/1999/xlink"
|
||||
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
|
||||
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
|
||||
version="1.1"
|
||||
width="22.000000px"
|
||||
height="22.000000px"
|
||||
id="svg8728"
|
||||
sodipodi:docname="polygon.svg"
|
||||
inkscape:version="0.92.4 (5da689c313, 2019-01-14)">
|
||||
<metadata id="license">
|
||||
This file is released under the MIT license.
|
||||
</metadata>
|
||||
<sodipodi:namedview
|
||||
pagecolor="#ffffff"
|
||||
bordercolor="#666666"
|
||||
borderopacity="1"
|
||||
objecttolerance="10"
|
||||
gridtolerance="10"
|
||||
guidetolerance="10"
|
||||
inkscape:pageopacity="0"
|
||||
inkscape:pageshadow="2"
|
||||
inkscape:window-width="1414"
|
||||
inkscape:window-height="1016"
|
||||
id="namedview989"
|
||||
showgrid="false"
|
||||
inkscape:zoom="9.8636364"
|
||||
inkscape:cx="2.1014226"
|
||||
inkscape:cy="26.429249"
|
||||
inkscape:window-x="0"
|
||||
inkscape:window-y="0"
|
||||
inkscape:window-maximized="0"
|
||||
inkscape:current-layer="layer1" />
|
||||
<defs
|
||||
id="defs3">
|
||||
<linearGradient
|
||||
id="linearGradient928">
|
||||
<stop
|
||||
style="stop-color:#777777;stop-opacity:1;"
|
||||
offset="0"
|
||||
id="stop924" />
|
||||
<stop
|
||||
style="stop-color:#ffffff;stop-opacity:0"
|
||||
offset="1.0000000"
|
||||
id="stop926" />
|
||||
<svg xmlns="http://www.w3.org/2000/svg">
|
||||
<g id="tool_polygon">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="-1 -2 25 24">
|
||||
<defs>
|
||||
<linearGradient y2="1" x2="1" y1="0.10156" x1="0.36328" id="svg_i22">
|
||||
<stop stop-opacity="1" stop-color="#ffffff" offset="0"/>
|
||||
<stop stop-opacity="1" stop-color="#666666" offset="1"/>
|
||||
</linearGradient>
|
||||
<radialGradient
|
||||
gradientUnits="userSpaceOnUse"
|
||||
gradientTransform="matrix(1.0033963,-0.00853162,0.00155275,0.18261755,-0.31483228,15.390226)"
|
||||
r="9.9786386"
|
||||
fy="18.71875"
|
||||
fx="10.531251"
|
||||
cy="18.71875"
|
||||
cx="10.531251"
|
||||
id="radialGradient919"
|
||||
xlink:href="#linearGradient928" />
|
||||
</defs>
|
||||
<g
|
||||
id="layer1">
|
||||
<path
|
||||
id="path911"
|
||||
style="opacity:1;fill:url(#radialGradient919);fill-opacity:1;stroke:none;stroke-width:0.98000002;stroke-linecap:square;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:304.81887817;stroke-opacity:1"
|
||||
ry="1.9786382"
|
||||
rx="9.9786386"
|
||||
cy="18.71875"
|
||||
cx="10.281251" />
|
||||
<path
|
||||
d="M 10.312501,3.499999 18.198468,9.2294899 15.186297,18.5 5.438705,18.5 2.4265338,9.2294894 Z"
|
||||
id="path909"
|
||||
style="opacity:1;fill:#ffffda;fill-opacity:1;stroke:#000000;stroke-width:1.00000001;stroke-linecap:square;stroke-linejoin:bevel;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:304.81887817;stroke-opacity:1" />
|
||||
<polygon points="6.09251,19.6032 0.577744,10.0516 6.09251,0.5 17.1217,0.5 22.6365,10.0516 17.1217,19.6032" stroke="#000000" fill="url(#svg_i22)"/> </svg>
|
||||
</g>
|
||||
|
||||
<g id="svg_eof"/>
|
||||
</svg>
|
||||
|
|
Before Width: | Height: | Size: 2.6 KiB After Width: | Height: | Size: 619 B |
Before Width: | Height: | Size: 379 B |
Before Width: | Height: | Size: 656 B |
Before Width: | Height: | Size: 646 B |
Before Width: | Height: | Size: 389 B |
Before Width: | Height: | Size: 731 B |
|
@ -1,10 +1,6 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg">
|
||||
<g id="tool_shapelib">
|
||||
<svg xmlns:xlink="http://www.w3.org/1999/xlink" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 300 300">
|
||||
<path fill="#c0c0c0" stroke-linejoin="round" stroke-width="14" stroke="#202020" fill-rule="nonzero" d="m70,194.72501l0,0c0,-10.30901 35.8172,-18.666 80,-18.666c44.18298,0 80,8.35699 80,18.666l0,74.66699c0,10.30899 -35.81702,18.66699 -80,18.66699c-44.1828,0 -80,-8.358 -80,-18.66699l0,-74.66699z"/>
|
||||
<path fill="#c0c0c0" stroke-linejoin="round" stroke-width="14" stroke="#202020" fill-rule="nonzero" d="m70,114.608l0,0c0,-10.309 35.8172,-18.6668 80,-18.6668c44.18298,0 80,8.3578 80,18.6668l0,74.66699c0,10.30901 -35.81702,18.666 -80,18.666c-44.1828,0 -80,-8.35699 -80,-18.666l0,-74.66699z"/>
|
||||
<path fill="#c0c0c0" stroke-linejoin="round" stroke-width="14" stroke="#202020" fill-rule="nonzero" d="m70,33.6667l0,0c0,-10.3094 35.8172,-18.6667 80,-18.6667c44.18298,0 80,8.3573 80,18.6667l0,74.6663c0,10.31 -35.81702,18.667 -80,18.667c-44.1828,0 -80,-8.357 -80,-18.667l0,-74.6663z"/>
|
||||
<path id="svg_1" fill="#c0c0c0" stroke-linejoin="round" stroke-width="14" stroke="#202020" fill-rule="nonzero" d="m230,32.33334c0,10.30931 -35.81726,18.66666 -80,18.66666c-44.1828,0 -80,-8.35735 -80,-18.66666"/>
|
||||
</svg>
|
||||
</g>
|
||||
</svg>
|
Before Width: | Height: | Size: 1.3 KiB After Width: | Height: | Size: 1.2 KiB |
Before Width: | Height: | Size: 893 B |
Before Width: | Height: | Size: 328 B |
Before Width: | Height: | Size: 14 KiB |
Before Width: | Height: | Size: 687 B After Width: | Height: | Size: 687 B |
Before Width: | Height: | Size: 938 B |
Before Width: | Height: | Size: 837 B |
Before Width: | Height: | Size: 268 B |
Before Width: | Height: | Size: 1.0 KiB |
|
@ -385,24 +385,29 @@
|
|||
<div id="tools_left" class="tools_panel">
|
||||
<se-button id="tool_select" title="Select Tool" src="./images/select.svg"></se-button>
|
||||
<se-button id="tool_fhpath" title="Pencil Tool" src="./images/pencil.svg" shortcut="Q"></se-button>
|
||||
<se-flyingbutton id="_tools_line_show" title="Line Tool (L)/Connect two objects">
|
||||
<se-flyingbutton id="tools_line_show" title="Line Tool (L)/Connect two objects">
|
||||
<se-button id="tool_line" title="Line Tool" src="./images/pen.svg" shortcut="L"></se-button>
|
||||
<se-button id="mode_connect" title="Connect two objects" src="./images/conn.svg"></se-button>
|
||||
</se-flyingbutton>
|
||||
<se-flyingbutton id="_tools_rect_show" title="Square/Rect Tool">
|
||||
<se-button id="_tool_rect" title="Rectangle" src="./images/rect.svg"></se-button>
|
||||
<se-button id="_tool_square" title="Square" src="./images/square.svg"></se-button>
|
||||
<se-button id="_tool_fhrect" title="Free-Hand Rectangle" src="./images/fh_rect.svg"></se-button>
|
||||
<se-flyingbutton id="tools_rect" title="Square/Rect Tool">
|
||||
<se-button id="tool_rect" title="Rectangle" src="./images/rect.svg" shortcut="R"></se-button>
|
||||
<se-button id="tool_square" title="Square" src="./images/square.svg"></se-button>
|
||||
<se-button id="tool_fhrect" title="Free-Hand Rectangle" src="./images/fh_rect.svg"></se-button>
|
||||
</se-flyingbutton>
|
||||
<se-flyingbutton id="_tools_ellipse_show" title="Ellipse/Circle Tool">
|
||||
<se-button id="_tool_ellipse" title="Rectangle" src="./images/ellipse.svg"></se-button>
|
||||
<se-button id="_tool_circle" title="Square" src="./images/circle.svg"></se-button>
|
||||
<se-button id="_tool_fhellipse" title="Free-Hand Rectangle" src="./images/fh_ellipse.svg"></se-button>
|
||||
<se-flyingbutton id="tools_ellipse_show" title="Ellipse/Circle Tool">
|
||||
<se-button id="tool_ellipse" title="Rectangle" src="./images/ellipse.svg" shortcut="E"></se-button>
|
||||
<se-button id="tool_circle" title="Square" src="./images/circle.svg"></se-button>
|
||||
<se-button id="tool_fhellipse" title="Free-Hand Rectangle" src="./images/fh_ellipse.svg"></se-button>
|
||||
</se-flyingbutton>
|
||||
<se-button id="tool_path" title="Path Tool" src="./images/path.svg" shortcut="P"></se-button>
|
||||
<se-button id="tool_shapelib_show" title="Shape library" src="./images/shapelib.svg"></se-button>
|
||||
<se-button id="tool_text" title="Text Tool" src="./images/text.svg" shortcut="T"></se-button>
|
||||
<se-button id="tool_image" title="Image Tool" src="./images/image.svg"></se-button>
|
||||
<se-button id="tool_zoom" title="Zoom Tool" src="./images/zoom.svg" shortcut="Z"></se-button>
|
||||
<se-button id="tool_eyedropper" title="Eye Dropper Tool" src="./images/eye_dropper.svg" shortcut="I"></se-button>
|
||||
<se-button id="ext-panning" title="Panning" src="./images/panning.svg"></se-button>
|
||||
<se-button id="tool_star" title="Star Tool" src="./images/star.svg"></se-button>
|
||||
<se-button id="tool_polygon" title="Polygon Tool" src="./images/polygon.svg"></se-button>
|
||||
</div> <!-- tools_left -->
|
||||
<div id="tools_bottom" class="tools_panel">
|
||||
<!-- Zoom buttons -->
|
||||
|
|
|
@ -279,12 +279,12 @@ export const readLang = function (langData) {
|
|||
text: properties.text_contents,
|
||||
toggle_stroke_tools: ui.toggle_stroke_tools,
|
||||
tool_add_subpath: tools.add_subpath,
|
||||
tool_alignbottom: tools.align_bottom,
|
||||
tool_aligncenter: tools.align_center,
|
||||
tool_alignleft: tools.align_left,
|
||||
tool_alignmiddle: tools.align_middle,
|
||||
tool_alignright: tools.align_right,
|
||||
tool_aligntop: tools.align_top,
|
||||
tool_align_bottom: tools.align_bottom,
|
||||
tool_align_center: tools.align_center,
|
||||
tool_align_left: tools.align_left,
|
||||
tool_align_middle: tools.align_middle,
|
||||
tool_align_right: tools.align_right,
|
||||
tool_align_top: tools.align_top,
|
||||
tool_angle: properties.angle,
|
||||
tool_blur: properties.blur,
|
||||
tool_bold: properties.bold,
|
||||
|
|
|
@ -956,7 +956,7 @@ editor.init = () => {
|
|||
// Todo: Set `alts: {}` with keys as the IDs in fallback set to
|
||||
// `uiStrings` (localized) values
|
||||
fallback: {
|
||||
logo: 'logo.png',
|
||||
logo: 'logo.svg',
|
||||
select_node: 'select_node.png',
|
||||
square: 'square.png',
|
||||
rect: 'rect.png',
|
||||
|
@ -1151,7 +1151,7 @@ editor.init = () => {
|
|||
|
||||
let resizeTimer, curScrollPos;
|
||||
let exportWindow = null,
|
||||
defaultImageURL = curConfig.imgPath + 'logo.png',
|
||||
defaultImageURL = curConfig.imgPath + 'logo.svg',
|
||||
zoomInIcon = 'crosshair',
|
||||
zoomOutIcon = 'crosshair',
|
||||
uiContext = 'toolbars';
|
||||
|
@ -1442,23 +1442,6 @@ editor.init = () => {
|
|||
$(opt).addClass('current').siblings().removeClass('current');
|
||||
}
|
||||
|
||||
/**
|
||||
* This is a common function used when a tool has been clicked (chosen).
|
||||
* It does several common things:
|
||||
* - Removes the `tool_button_current` class from whatever tool currently has it.
|
||||
* - Adds the `tool_button_current` class to the button passed in.
|
||||
* @function module:SVGEditor.toolButtonClick
|
||||
* @param {string|Element} button The DOM element or string selector representing the toolbar button
|
||||
* @returns {boolean} Whether the button was disabled or not
|
||||
*/
|
||||
const toolButtonClick = editor.toolButtonClick = function (button) {
|
||||
if ($(button).hasClass('disabled')) { return false; }
|
||||
$('#styleoverrides').text('');
|
||||
workarea.css('cursor', 'auto');
|
||||
$('.tool_button_current').removeClass('tool_button_current').addClass('tool_button');
|
||||
$(button).addClass('tool_button_current').removeClass('tool_button');
|
||||
return true;
|
||||
};
|
||||
/**
|
||||
* This is a common function used when a tool has been clicked (chosen).
|
||||
* It does several common things:
|
||||
|
@ -2784,7 +2767,7 @@ editor.init = () => {
|
|||
button.bind(name, func);
|
||||
} else {
|
||||
button.bind(name, function () {
|
||||
if (toolButtonClick(button)) {
|
||||
if (updateLeftPanel(button)) {
|
||||
func();
|
||||
}
|
||||
});
|
||||
|
@ -2831,6 +2814,7 @@ editor.init = () => {
|
|||
// Set button up according to its type
|
||||
switch (btn.type) {
|
||||
case 'mode_flyout':
|
||||
case 'mode':
|
||||
$id(btn.id).addEventListener('click', () => {
|
||||
if (updateLeftPanel(btn.id)) {
|
||||
btn.events.click();
|
||||
|
@ -3440,7 +3424,7 @@ editor.init = () => {
|
|||
*
|
||||
* @returns {void}
|
||||
*/
|
||||
const clickFHPath = function () {
|
||||
const clickFHPath = () => {
|
||||
if (updateLeftPanel('tool_fhpath')) {
|
||||
svgCanvas.setMode('fhpath');
|
||||
}
|
||||
|
@ -3450,7 +3434,7 @@ editor.init = () => {
|
|||
*
|
||||
* @returns {void}
|
||||
*/
|
||||
const clickLine = function () {
|
||||
const clickLine = () => {
|
||||
if (updateLeftPanel('tool_line')) {
|
||||
svgCanvas.setMode('line');
|
||||
}
|
||||
|
@ -3460,8 +3444,8 @@ editor.init = () => {
|
|||
*
|
||||
* @returns {void}
|
||||
*/
|
||||
const clickSquare = function () {
|
||||
if (toolButtonClick('#tool_square')) {
|
||||
const clickSquare = () => {
|
||||
if (updateLeftPanel('tool_square')) {
|
||||
svgCanvas.setMode('square');
|
||||
}
|
||||
};
|
||||
|
@ -3470,8 +3454,8 @@ editor.init = () => {
|
|||
*
|
||||
* @returns {void}
|
||||
*/
|
||||
const clickRect = function () {
|
||||
if (toolButtonClick('#tool_rect')) {
|
||||
const clickRect = () => {
|
||||
if (updateLeftPanel('tool_rect')) {
|
||||
svgCanvas.setMode('rect');
|
||||
}
|
||||
};
|
||||
|
@ -3480,8 +3464,8 @@ editor.init = () => {
|
|||
*
|
||||
* @returns {void}
|
||||
*/
|
||||
const clickFHRect = function () {
|
||||
if (toolButtonClick('#tool_fhrect')) {
|
||||
const clickFHRect = () => {
|
||||
if (updateLeftPanel('tool_fhrect')) {
|
||||
svgCanvas.setMode('fhrect');
|
||||
}
|
||||
};
|
||||
|
@ -3490,8 +3474,8 @@ editor.init = () => {
|
|||
*
|
||||
* @returns {void}
|
||||
*/
|
||||
const clickCircle = function () {
|
||||
if (toolButtonClick('#tool_circle')) {
|
||||
const clickCircle = () => {
|
||||
if (updateLeftPanel('tool_circle')) {
|
||||
svgCanvas.setMode('circle');
|
||||
}
|
||||
};
|
||||
|
@ -3500,8 +3484,8 @@ editor.init = () => {
|
|||
*
|
||||
* @returns {void}
|
||||
*/
|
||||
const clickEllipse = function () {
|
||||
if (toolButtonClick('#tool_ellipse')) {
|
||||
const clickEllipse = () => {
|
||||
if (updateLeftPanel('tool_ellipse')) {
|
||||
svgCanvas.setMode('ellipse');
|
||||
}
|
||||
};
|
||||
|
@ -3510,8 +3494,8 @@ editor.init = () => {
|
|||
*
|
||||
* @returns {void}
|
||||
*/
|
||||
const clickFHEllipse = function () {
|
||||
if (toolButtonClick('#tool_fhellipse')) {
|
||||
const clickFHEllipse = () => {
|
||||
if (updateLeftPanel('tool_fhellipse')) {
|
||||
svgCanvas.setMode('fhellipse');
|
||||
}
|
||||
};
|
||||
|
@ -3520,7 +3504,7 @@ editor.init = () => {
|
|||
*
|
||||
* @returns {void}
|
||||
*/
|
||||
const clickImage = function () {
|
||||
const clickImage = () => {
|
||||
if (updateLeftPanel('tool_image')) {
|
||||
svgCanvas.setMode('image');
|
||||
}
|
||||
|
@ -3555,8 +3539,8 @@ editor.init = () => {
|
|||
*
|
||||
* @returns {void}
|
||||
*/
|
||||
const dblclickZoom = function () {
|
||||
if (toolButtonClick('#tool_zoom')) {
|
||||
const dblclickZoom = () => {
|
||||
if (updateLeftPanel('tool_zoom')) {
|
||||
zoomImage();
|
||||
clickSelect();
|
||||
}
|
||||
|
@ -4542,7 +4526,7 @@ editor.init = () => {
|
|||
|
||||
// Test for embedImage support (use timeout to not interfere with page load)
|
||||
setTimeout(function () {
|
||||
svgCanvas.embedImage('images/logo.png', function (datauri) {
|
||||
svgCanvas.embedImage('images/logo.svg', function (datauri) {
|
||||
if (!datauri) {
|
||||
// Disable option
|
||||
$('#image_save_opts [value=embed]').attr('disabled', 'disabled');
|
||||
|
@ -4903,9 +4887,16 @@ editor.init = () => {
|
|||
$id('tool_text').addEventListener('click', clickText);
|
||||
$id('tool_image').addEventListener('click', clickImage);
|
||||
$id('tool_zoom').addEventListener('click', clickZoom);
|
||||
$id('tool_zoom').addEventListener('dblclick', dblclickZoom);
|
||||
$id('tool_path').addEventListener('click', clickPath);
|
||||
$id('tool_line').addEventListener('click', clickLine);
|
||||
// $id('tool_').addEventListener('click', clickP);
|
||||
// flyout
|
||||
$id('tool_rect').addEventListener('click', clickRect);
|
||||
$id('tool_square').addEventListener('click', clickSquare);
|
||||
$id('tool_fhrect').addEventListener('click', clickFHRect);
|
||||
$id('tool_ellipse').addEventListener('click', clickEllipse);
|
||||
$id('tool_circle').addEventListener('click', clickCircle);
|
||||
$id('tool_fhellipse').addEventListener('click', clickFHEllipse);
|
||||
|
||||
// register actions for layer toolbar
|
||||
$id('layer_new').addEventListener('click', newLayer);
|
||||
|
@ -4915,18 +4906,6 @@ editor.init = () => {
|
|||
$id('layer_rename').addEventListener('click', layerRename);
|
||||
|
||||
const toolButtons = [
|
||||
{sel: '#tool_rect', fn: clickRect, evt: 'mouseup',
|
||||
key: ['R', true], parent: '#tools_rect', icon: 'rect'},
|
||||
{sel: '#tool_square', fn: clickSquare, evt: 'mouseup',
|
||||
parent: '#tools_rect', icon: 'square'},
|
||||
{sel: '#tool_fhrect', fn: clickFHRect, evt: 'mouseup',
|
||||
parent: '#tools_rect', icon: 'fh_rect'},
|
||||
{sel: '#tool_ellipse', fn: clickEllipse, evt: 'mouseup',
|
||||
key: ['E', true], parent: '#tools_ellipse', icon: 'ellipse'},
|
||||
{sel: '#tool_circle', fn: clickCircle, evt: 'mouseup',
|
||||
parent: '#tools_ellipse', icon: 'circle'},
|
||||
{sel: '#tool_fhellipse', fn: clickFHEllipse, evt: 'mouseup',
|
||||
parent: '#tools_ellipse', icon: 'fh_ellipse'},
|
||||
{sel: '#tool_clear', fn: clickClear, evt: 'mouseup', key: ['N', true]},
|
||||
{sel: '#tool_save', fn () {
|
||||
if (editingsource) {
|
||||
|
@ -5105,8 +5084,6 @@ editor.init = () => {
|
|||
selectPrev();
|
||||
}
|
||||
});
|
||||
|
||||
$('#tool_zoom').dblclick(dblclickZoom);
|
||||
},
|
||||
/**
|
||||
* @returns {void}
|
||||
|
|
|
@ -954,7 +954,7 @@ class SvgCanvas {
|
|||
|
||||
let
|
||||
// String with image URL of last loadable image
|
||||
lastGoodImgUrl = curConfig.imgPath + 'logo.png',
|
||||
lastGoodImgUrl = curConfig.imgPath + 'logo.svg',
|
||||
|
||||
// Boolean indicating whether or not a draw action has been started
|
||||
started = false,
|
||||
|
|