diff --git a/editor/extensions/closepath_icons.svg b/editor/extensions/closepath_icons.svg
new file mode 100644
index 00000000..f33f6be7
--- /dev/null
+++ b/editor/extensions/closepath_icons.svg
@@ -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>
\ No newline at end of file
diff --git a/editor/extensions/ext-closepath.js b/editor/extensions/ext-closepath.js
index 2f943d02..28afd61c 100644
--- a/editor/extensions/ext-closepath.js
+++ b/editor/extensions/ext-closepath.js
@@ -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();
diff --git a/editor/svg-editor.html b/editor/svg-editor.html
index c3d8fb05..01b1b504 100644
--- a/editor/svg-editor.html
+++ b/editor/svg-editor.html
@@ -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>
diff --git a/editor/svg-editor.js b/editor/svg-editor.js
index a7456018..4f66bcb1 100644
--- a/editor/svg-editor.js
+++ b/editor/svg-editor.js
@@ -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 {