Made some minor code optimization, added more icon labels (blur by Christian Tzurcanu)

git-svn-id: http://svg-edit.googlecode.com/svn/trunk@1530 eee81c28-f429-11dd-99c0-75d572ba1ddd

editor/images/svg_edit_icons.svg

@@ -695,24 +695,24 @@
 </svg>
 </g>
 
-<!-- Currently does not work with svg-icons... -->
-<!-- 
 <g id="blur">
-<svg width="24" height="24" xmlns="http://www.w3.org/2000/svg">
+<svg width="300" height="300" xmlns="http://www.w3.org/2000/svg">
+ <!-- Created with SVG-edit - http://svg-edit.googlecode.com/ -->
  <defs>
-  <linearGradient id="svg_2" x1="0.36328" y1="0.10156" x2="1" y2="1">
+  <filter id="svg_4_blur" x="-50%" y="-50%" width="200%" height="200%">
-   <stop offset="0" stop-color="#ffffff"/>
+   <feGaussianBlur stdDeviation="25"/>
-   <stop offset="1" stop-color="#3b7e9b"/>
-  </linearGradient>
-  <filter id="svg_4_blur">
-   <feGaussianBlur stdDeviation="0.8" in="SourceGraphic"/>
   </filter>
  </defs>
-  <path id="svg_1" d="m11.625,18l-9.625,0l0,-12l9.625,0" stroke="#000000" fill="url(#svg_2)"/>
+  <circle fill="#000000" stroke="#000000" stroke-width="5" stroke-dasharray="null" cx="150" cy="150" r="91.80151" id="svg_4" filter="url(#svg_4_blur)"/>
-  <path filter="url(#svg_4_blur)" id="svg_4" d="m11.75,6l10.25,0l0,12l-10.25,0" stroke="#000000" fill="url(#svg_2)"/>
+</svg>
+</g>
+
+<g id="fontsize">
+<svg width="50" height="50" xmlns="http://www.w3.org/2000/svg" xmlns:xml="http://www.w3.org/XML/1998/namespace">
+  <text fill="#606060" stroke="#AAAAAA" stroke-width="0" x="14.451" y="41.4587" id="svg_2" font-size="26" font-family="serif" text-anchor="middle" xml:space="preserve">T</text>
+  <text fill="#000000" stroke="#AAAAAA" stroke-width="0" x="28.853" y="41.8685" font-size="52" font-family="serif" text-anchor="middle" xml:space="preserve" id="svg_3">T</text>
 </svg>
 </g>
- -->
 
 <g id="align">
 	<svg width="22" height="22" xmlns="http://www.w3.org/2000/svg">

editor/svg-editor.html

@@ -173,7 +173,7 @@ script type="text/javascript" src="locale/locale.min.js"></script-->
 		
 		<div class="toolset" id="tool_blur">
 			<label>
-				<span id="blurLabel">blur:</span>
+				<span id="blurLabel" class="icon_label"></span>
 				<input id="blur" title="Change gaussian blur value" size="2" value="0" type="text"/>
 			</label>
 			<div id="blur_dropdown" class="dropdown">
@@ -345,7 +345,7 @@ script type="text/javascript" src="locale/locale.min.js"></script-->
 		</div>
 
 		<label id="tool_font_size">
-			<span id="font_sizeLabel">size:</span>
+			<span id="font_sizeLabel" class="icon_label"></span>
 			<input id="font_size" title="Change Font Size" size="3" value="0" type="text"/>
 		</label>
 		

editor/svg-editor.js

@@ -341,6 +341,8 @@
 					'#tool_fill label': 'fill',
 					'#tool_stroke .icon_label': 'stroke',
 					'#group_opacityLabel': 'opacity',
+					'#blurLabel': 'blur',
+					'#font_sizeLabel': 'fontsize',
 					
 					'.flyout_arrow_horiz':'arrow_right',
 					'.dropdown button, #main_button .dropdown':'arrow_down',
@@ -2861,47 +2863,48 @@
 			var SIDEPANEL_MAXWIDTH = 300;
 			var SIDEPANEL_OPENWIDTH = 150;
 			var sidedrag = -1, sidedragging = false;
+				
+			var resizePanel = function(evt) {
+				if (sidedrag == -1) return;
+				sidedragging = true;
+				var deltax = sidedrag - evt.pageX;
+	
+				var sidepanels = $('#sidepanels');
+				var sidewidth = parseInt(sidepanels.css('width'));
+				if (sidewidth+deltax > SIDEPANEL_MAXWIDTH) {
+					deltax = SIDEPANEL_MAXWIDTH - sidewidth;
+					sidewidth = SIDEPANEL_MAXWIDTH;
+				}
+				else if (sidewidth+deltax < 2) {
+					deltax = 2 - sidewidth;
+					sidewidth = 2;
+				}
+	
+				if (deltax == 0) return;
+				sidedrag -= deltax;
+	
+				var layerpanel = $('#layerpanel');
+				workarea.css('right', parseInt(workarea.css('right'))+deltax);
+				sidepanels.css('width', parseInt(sidepanels.css('width'))+deltax);
+				layerpanel.css('width', parseInt(layerpanel.css('width'))+deltax);
+			}
+			
 			$('#sidepanel_handle')
-				.mousedown(function(evt) {sidedrag = evt.pageX;})
+				.mousedown(function(evt) {
+					sidedrag = evt.pageX;
+					$(window).mousemove(resizePanel);
+					
+				})
 				.mouseup(function(evt) {
 					if (!sidedragging) toggleSidePanel();
 					sidedrag = -1;
 					sidedragging = false;
 				});
-			$('#svg_editor')
+
-				.mouseup(function(){sidedrag=-1;})
+			$(window).mouseup(function() {
-				.mouseout(function(evt){
+				sidedrag = -1;
-					if (sidedrag == -1) return;
+				sidedragging = false;
-					// if we've moused out of the browser window, then we can stop dragging 
+				$('#svg_editor').unbind('mousemove', resizePanel);
-					// and close the drawer
-					if (evt.pageX > this.clientWidth) {
-						sidedrag = -1;
-						toggleSidePanel(true);
-					}
-				})
-				.mousemove(function(evt) {
-					if (sidedrag == -1) return;
-					sidedragging = true;
-					var deltax = sidedrag - evt.pageX;
-		
-					var sidepanels = $('#sidepanels');
-					var sidewidth = parseInt(sidepanels.css('width'));
-					if (sidewidth+deltax > SIDEPANEL_MAXWIDTH) {
-						deltax = SIDEPANEL_MAXWIDTH - sidewidth;
-						sidewidth = SIDEPANEL_MAXWIDTH;
-					}
-					else if (sidewidth+deltax < 2) {
-						deltax = 2 - sidewidth;
-						sidewidth = 2;
-					}
-		
-					if (deltax == 0) return;
-					sidedrag -= deltax;
-		
-					var layerpanel = $('#layerpanel');
-					workarea.css('right', parseInt(workarea.css('right'))+deltax);
-					sidepanels.css('width', parseInt(sidepanels.css('width'))+deltax);
-					layerpanel.css('width', parseInt(layerpanel.css('width'))+deltax);
 			});
 			
 			// if width is non-zero, then fully close it, otherwise fully open it

editor/svgicons/jquery.svgicons.js

@@ -377,6 +377,8 @@ $(function() {
 					if(this.getAttribute('xlink:href') == '#' + id) {
 						this.setAttributeNS(xlinkns,'href','#' + new_id);
 					}
+				}).end().find('[filter="url(#' + id + ')"]').each(function() {
+					$(this).attr('filter', 'url(#' + new_id + ')');
 				});
 			});
 			return svg_el;