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

A little more work on the closepath extension (still doesn't show SVG icons yet) 

git-svn-id: http://svg-edit.googlecode.com/svn/trunk@1412 eee81c28-f429-11dd-99c0-75d572ba1ddd
master
Jeff Schiller 2010-02-19 16:55:08 +00:00
parent 7236577141
commit 796cee60e1
4 changed files with 76 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

44
editor/extensions/closepath_icons.svg Normal file
View File

@ -0,0 +1,44 @@
<svg xmlns="http://www.w3.org/2000/svg">
<g id="tool_closepath">
<svg viewBox="0 0 300 300" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<defs>
<marker viewBox="0 0 10 10" id="close_arrow_fw2" refY="5" markerUnits="strokeWidth" markerWidth="5" markerHeight="5" orient="auto" refX="8">
<path d="m0,0l10,5l-10,5l5,-5l-5,-5z" fill="#f00"/>
</marker>
</defs>
<g>
<title>Layer 1</title>
<path stroke="#000" stroke-width="15" fill="#ffc8c8" d="m121.5,40l-84,106l27,115l166,2l29,-111"/>
<line x1="240" y1="136" x2="169.5" y2="74" stroke="#f00" stroke-width="15" fill="none" marker-end="url(#close_arrow_fw2)"/>
<g stroke-width="15" stroke="#00f" fill="#00ffff">
<circle r="30" cy="41" cx="123"/>
<circle r="30" cy="146" cx="40"/>
<circle r="30" cy="260" cx="69"/>
<circle r="30" cy="260" cx="228"/>
<circle r="30" cy="148" cx="260"/>
</g>
</g>
</svg>
</g>
<g id="tool_openpath">
<svg viewBox="0 0 300 300" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<g>
<title>Layer 1</title>
<path stroke="#000" stroke-width="15" fill="#ffc8c8" d="m123.5,38l-84,106l27,115l166,2l29,-111"/>
<line x1="276.5" y1="153" x2="108.5" y2="24" stroke="#000" stroke-width="10" fill="none"/>
<g stroke-width="15" stroke="#00f" fill="#0ff">
<circle r="30" cy="41" cx="123"/>
<circle r="30" cy="146" cx="40"/>
<circle r="30" cy="260" cx="69"/>
<circle r="30" cy="260" cx="228"/>
<circle r="30" cy="148" cx="260"/>
</g>
<g stroke="#f00" stroke-width="20" fill="none">
<line x1="168" y1="24.00001" x2="210" y2="150"/>
<line x1="210" y1="24.00001" x2="168" y2="150"/>
</g>
</g>
</svg>
</g>
<g id="svg_eof"/>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 1.8 KiB

33
editor/extensions/ext-closepath.js
View File

@ -14,8 +14,11 @@ $(function() {
var selElems,
updateButton = function(path) {
var seglist = path.pathSegList,
button = $('#closepath_panel > div.tool_button')[0];
$(button).html(seglist.getItem(seglist.numberOfItems - 1).pathSegType==1 ? "open":"close");
closed = seglist.getItem(seglist.numberOfItems - 1).pathSegType==1,
showbutton = closed ? '#tool_openpath' : '#tool_closepath',
hidebutton = closed ? '#tool_closepath' : '#tool_openpath';
$(hidebutton).hide();
$(showbutton).show();
},
showPanel = function(on) {
$('#closepath_panel').toggle(on);
@ -43,12 +46,28 @@ $(function() {
return {
name: "ClosePath",
context_tools: [{
type: "tool_button",
svgicons: "extensions/closepath-icons.svg",
buttons: [{
id: "tool_openpath",
type: "context",
panel: "closepath_panel",
title: "Open or Close path",
id: "close",
events: { mousedown: toggleClosed }
title: "Open path",
events: {
'click': function() {
toggleClosed();
}
}
},
{
id: "tool_closepath",
type: "context",
panel: "closepath_panel",
title: "Close path",
events: {
'click': function() {
toggleClosed();
}
}
}],
callback: function() {
$('#closepath_panel').hide();

2
editor/svg-editor.html
View File

@ -21,7 +21,7 @@
<script type="text/javascript" src="extensions/ext-closepath.js"></script>
<script type="text/javascript" src="extensions/ext-arrows.js"></script>
<script type="text/javascript" src="extensions/ext-connector.js"></script>
<!-- <script type="text/javascript" src="extensions/ext-foreignobject.js"></script> -->
<script type="text/javascript" src="extensions/ext-foreignobject.js"></script>
<!-- Release version of script tags: >
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js"></script>

9
editor/svg-editor.js
View File

@ -423,9 +423,9 @@ function svg_edit_setup() {
var panel = $('#' + tool.panel);
if(!panel.length) {
// create the panel if it doesn't exist
if(!panel.length)
panel = $('<div>', {id: tool.panel}).appendTo("#tools_top");
}
// TODO: Allow support for other types, or adding to existing tool
switch (tool.type) {
@ -487,7 +487,6 @@ function svg_edit_setup() {
var fallback_obj = {},
placement_obj = {},
svgicons = ext.svgicons;
var holders = {};
@ -520,6 +519,9 @@ function svg_edit_setup() {
case 'context':
cls = 'tool_button';
parent = "#" + btn.panel;
// create the panel if it doesn't exist
if(!$(parent).length)
$('<div>', {id: btn.panel}).appendTo("#tools_top");
break;
}
@ -527,7 +529,6 @@ function svg_edit_setup() {
.attr("id", id)
.attr("title", btn.title)
.addClass(cls);
if(!btn.includeWith) {
button.appendTo(parent);
} else {