Fix Issue 30: Add bold/italic buttons for text elements

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

editor/svg-editor.html

@@ -120,6 +120,8 @@
 
 	<div id="text_panel">
 		<img class="tool_sep" src="images/sep.png" alt="|"/>
+		<img class="tool_button" id="tool_bold" src="images/bold.png" title="Bold Text [B]" alt="Bold"/>
+		<img class="tool_button" id="tool_italic" src="images/italic.png" title="Italic Text [I]" alt="Italic"/>
 		<select id="font_family" class="text_tool" title="Change Font Family">
 			<option selected="selected" value="serif">serif</option>
 			<option value="sans-serif">sans-serif</option>
@@ -203,7 +205,7 @@
 
 	<div id="tools_bottom_3">
 		<div id="palette_holder"><div id="palette" title="Click to change fill color, shift-click to change stroke color"></div></div>
-		<div id="copyright">SVG-edit v2.2-Alpha @ <a href="http://svg-edit.googlecode.com/" target="_blank">http://svg-edit.googlecode.com/</a></div>
+		<div id="copyright">Powered by <a href="http://svg-edit.googlecode.com/" target="_blank">SVG-edit v2.2-Alpha</a></div>
 	</div>
 </div>
 

editor/svg-editor.js

@@ -134,6 +134,18 @@ function svg_edit_setup() {
 				case "text":
 					// jquery's show() always sets display to block
 					$('#text_panel').show().css("display", "inline");
+					if (svgCanvas.getItalic()) {
+						$('#tool_italic').addClass('tool_button_current');
+					}
+					else {
+						$('#tool_italic').removeClass('tool_button_current');
+					}
+					if (svgCanvas.getBold()) {
+						$('#tool_bold').addClass('tool_button_current');
+					}
+					else {
+						$('#tool_bold').removeClass('tool_button_current');
+					}
 					$('#font_family').val(elem.getAttribute("font-family"));
 					$('#font_size').val(elem.getAttribute("font-size"));
 					$('#text').val(elem.textContent);
@@ -354,6 +366,16 @@ function svg_edit_setup() {
 			updateContextPanel();
 		}
 	}
+	
+	var clickBold = function(){
+		svgCanvas.setBold( !svgCanvas.getBold() );
+		updateContextPanel();
+	};
+	
+	var clickItalic = function(){
+		svgCanvas.setItalic( !svgCanvas.getItalic() );
+		updateContextPanel();
+	};
 
 	var clickSave = function(){
 		svgCanvas.save();
@@ -390,6 +412,8 @@ function svg_edit_setup() {
 	// these two lines are required to make Opera work properly with the new flyout mechanism
 	$('#tools_rect_show').click(clickSquare);
 	$('#tools_ellipse_show').click(clickCircle);
+	$('#tool_bold').mousedown(clickBold);
+	$('#tool_italic').mousedown(clickItalic);
 
 	// added these event handlers for all the push buttons so they
 	// behave more like buttons being pressed-in and not images

editor/svgcanvas.js

@@ -1360,6 +1360,45 @@ function SvgCanvas(c)
 	this.setIdPrefix = function(p) {
 		idprefix = p;
 	};
+	
+	this.getBold = function() {
+		// should only have one element selected
+		var selected = selectedElements[0];
+		if (selected != null && selected.tagName  == "text" &&
+			selectedElements[1] == null) 
+		{
+			return (selected.getAttribute("font-weight") == "bold");
+		}
+		return false;
+	};
+	
+	this.setBold = function(b) {
+		var selected = selectedElements[0];
+		if (selected != null && selected.tagName  == "text" &&
+			selectedElements[1] == null) 
+		{
+			selected.setAttribute("font-weight", b ? "bold" : "normal");
+		}
+	};
+	
+	this.getItalic = function() {
+		var selected = selectedElements[0];
+		if (selected != null && selected.tagName  == "text" &&
+			selectedElements[1] == null) 
+		{
+			return (selected.getAttribute("font-style") == "italic");
+		}
+		return false;
+	};
+	
+	this.setItalic = function(i) {
+		var selected = selectedElements[0];
+		if (selected != null && selected.tagName  == "text" &&
+			selectedElements[1] == null) 
+		{
+			selected.setAttribute("font-style", i ? "italic" : "normal");
+		}
+	};
 
 	this.getFontFamily = function() {
 		return current_font_family;