allow css color names for setStrokeStyle and setFillStyle

annotation plugin should use current page (not last page)
move c2d context object into plugin scope
added missing comma in object definition
added c2d test cases

Author: Flamenco

jspdf.js

@@ -966,10 +966,14 @@ var jsPDF = (function(global) {
 			},
 			'pages' : pages,
 			'out' : out,
-			'f2' : f2
+			'f2' : f2,
 			'getPageInfo' : function(pageNumberOneBased){
 				var objId = (pageNumberOneBased - 1) * 2 + 3;
-				return {objId:objId};
+				return {objId:objId, pageNumber:pageNumberOneBased};
+			},
+			'getCurrentPageInfo' : function(){
+				var objId = (currentPage - 1) * 2 + 3;
+				return {objId:objId, pageNumber:currentPage};
 			}
 		};
 

jspdf.plugin.annotations.js

@@ -153,7 +153,7 @@
 	 */
 	jsPDFAPI.link = function(x,y,w,h,options) {
 		'use strict';
-		this.annotationPlugin.annotations[this.internal.getNumberOfPages()].push({
+		this.annotationPlugin.annotations[this.internal.getCurrentPageInfo().pageNumber].push({
 			x : x,
 			y : y,
 			w : w,

jspdf.plugin.context2d.js

@@ -76,6 +76,12 @@
 		},
 
 		setFillStyle : function(style) {
+			if (style.charAt(0) != '#') {
+				style = this.internal.colorNameToHex(style);
+				if (!style) {
+					style = '#000000';
+				}
+			}
 			this.ctx.fillStyle = style;
 			var r = this.ctx.fillStyle.substring(1, 3);
 			r = parseInt(r, 16);
@@ -88,6 +94,12 @@
 		},
 
 		setStrokeStyle : function(style) {
+			if (style.charAt(0) != '#') {
+				style = this.internal.colorNameToHex(style);
+				if (!style) {
+					style = '#000000';
+				}
+			}
 			this.ctx.strokeStyle = style;
 			var r = this.ctx.strokeStyle.substring(1, 3);
 			r = parseInt(r, 16);
@@ -177,9 +189,10 @@
 			var rx = /data:image\/(\w+).*/i;
 			var m = rx.exec(img);
 			if (m != null) {
-				format = m[1]
+				format = m[1];
 			} else {
-				format = "jpeg";
+				//format = "jpeg";
+				format = "png";
 			}
 			this.pdf.addImage(img, format, x, y, w, h);
 		},
@@ -271,7 +284,7 @@
 
 		_getBaseline : function(y) {
 			var height = parseInt(this.pdf.internal.getFontSize());
-			//TODO Get this from font
+			//TODO Get descent from font descriptor
 			var descent = height * .25;
 			switch (this.ctx.textBaseline) {
 			case 'bottom':
@@ -283,6 +296,7 @@
 			case 'middle':
 				return y + height / 2 - descent;
 			case 'ideographic':
+				//TODO not implemented
 				return y;
 			case 'alphabetic':
 			default:
@@ -421,27 +435,177 @@
 		};
 	}
 
-	return this;
-})(jsPDF.API);
+	c2d.internal.colorNameToHex = function(color) {
+		var colors = {
+			"aliceblue" : "#f0f8ff",
+			"antiquewhite" : "#faebd7",
+			"aqua" : "#00ffff",
+			"aquamarine" : "#7fffd4",
+			"azure" : "#f0ffff",
+			"beige" : "#f5f5dc",
+			"bisque" : "#ffe4c4",
+			"black" : "#000000",
+			"blanchedalmond" : "#ffebcd",
+			"blue" : "#0000ff",
+			"blueviolet" : "#8a2be2",
+			"brown" : "#a52a2a",
+			"burlywood" : "#deb887",
+			"cadetblue" : "#5f9ea0",
+			"chartreuse" : "#7fff00",
+			"chocolate" : "#d2691e",
+			"coral" : "#ff7f50",
+			"cornflowerblue" : "#6495ed",
+			"cornsilk" : "#fff8dc",
+			"crimson" : "#dc143c",
+			"cyan" : "#00ffff",
+			"darkblue" : "#00008b",
+			"darkcyan" : "#008b8b",
+			"darkgoldenrod" : "#b8860b",
+			"darkgray" : "#a9a9a9",
+			"darkgreen" : "#006400",
+			"darkkhaki" : "#bdb76b",
+			"darkmagenta" : "#8b008b",
+			"darkolivegreen" : "#556b2f",
+			"darkorange" : "#ff8c00",
+			"darkorchid" : "#9932cc",
+			"darkred" : "#8b0000",
+			"darksalmon" : "#e9967a",
+			"darkseagreen" : "#8fbc8f",
+			"darkslateblue" : "#483d8b",
+			"darkslategray" : "#2f4f4f",
+			"darkturquoise" : "#00ced1",
+			"darkviolet" : "#9400d3",
+			"deeppink" : "#ff1493",
+			"deepskyblue" : "#00bfff",
+			"dimgray" : "#696969",
+			"dodgerblue" : "#1e90ff",
+			"firebrick" : "#b22222",
+			"floralwhite" : "#fffaf0",
+			"forestgreen" : "#228b22",
+			"fuchsia" : "#ff00ff",
+			"gainsboro" : "#dcdcdc",
+			"ghostwhite" : "#f8f8ff",
+			"gold" : "#ffd700",
+			"goldenrod" : "#daa520",
+			"gray" : "#808080",
+			"green" : "#008000",
+			"greenyellow" : "#adff2f",
+			"honeydew" : "#f0fff0",
+			"hotpink" : "#ff69b4",
+			"indianred " : "#cd5c5c",
+			"indigo" : "#4b0082",
+			"ivory" : "#fffff0",
+			"khaki" : "#f0e68c",
+			"lavender" : "#e6e6fa",
+			"lavenderblush" : "#fff0f5",
+			"lawngreen" : "#7cfc00",
+			"lemonchiffon" : "#fffacd",
+			"lightblue" : "#add8e6",
+			"lightcoral" : "#f08080",
+			"lightcyan" : "#e0ffff",
+			"lightgoldenrodyellow" : "#fafad2",
+			"lightgrey" : "#d3d3d3",
+			"lightgreen" : "#90ee90",
+			"lightpink" : "#ffb6c1",
+			"lightsalmon" : "#ffa07a",
+			"lightseagreen" : "#20b2aa",
+			"lightskyblue" : "#87cefa",
+			"lightslategray" : "#778899",
+			"lightsteelblue" : "#b0c4de",
+			"lightyellow" : "#ffffe0",
+			"lime" : "#00ff00",
+			"limegreen" : "#32cd32",
+			"linen" : "#faf0e6",
+			"magenta" : "#ff00ff",
+			"maroon" : "#800000",
+			"mediumaquamarine" : "#66cdaa",
+			"mediumblue" : "#0000cd",
+			"mediumorchid" : "#ba55d3",
+			"mediumpurple" : "#9370d8",
+			"mediumseagreen" : "#3cb371",
+			"mediumslateblue" : "#7b68ee",
+			"mediumspringgreen" : "#00fa9a",
+			"mediumturquoise" : "#48d1cc",
+			"mediumvioletred" : "#c71585",
+			"midnightblue" : "#191970",
+			"mintcream" : "#f5fffa",
+			"mistyrose" : "#ffe4e1",
+			"moccasin" : "#ffe4b5",
+			"navajowhite" : "#ffdead",
+			"navy" : "#000080",
+			"oldlace" : "#fdf5e6",
+			"olive" : "#808000",
+			"olivedrab" : "#6b8e23",
+			"orange" : "#ffa500",
+			"orangered" : "#ff4500",
+			"orchid" : "#da70d6",
+			"palegoldenrod" : "#eee8aa",
+			"palegreen" : "#98fb98",
+			"paleturquoise" : "#afeeee",
+			"palevioletred" : "#d87093",
+			"papayawhip" : "#ffefd5",
+			"peachpuff" : "#ffdab9",
+			"peru" : "#cd853f",
+			"pink" : "#ffc0cb",
+			"plum" : "#dda0dd",
+			"powderblue" : "#b0e0e6",
+			"purple" : "#800080",
+			"red" : "#ff0000",
+			"rosybrown" : "#bc8f8f",
+			"royalblue" : "#4169e1",
+			"saddlebrown" : "#8b4513",
+			"salmon" : "#fa8072",
+			"sandybrown" : "#f4a460",
+			"seagreen" : "#2e8b57",
+			"seashell" : "#fff5ee",
+			"sienna" : "#a0522d",
+			"silver" : "#c0c0c0",
+			"skyblue" : "#87ceeb",
+			"slateblue" : "#6a5acd",
+			"slategray" : "#708090",
+			"snow" : "#fffafa",
+			"springgreen" : "#00ff7f",
+			"steelblue" : "#4682b4",
+			"tan" : "#d2b48c",
+			"teal" : "#008080",
+			"thistle" : "#d8bfd8",
+			"tomato" : "#ff6347",
+			"turquoise" : "#40e0d0",
+			"violet" : "#ee82ee",
+			"wheat" : "#f5deb3",
+			"white" : "#ffffff",
+			"whitesmoke" : "#f5f5f5",
+			"yellow" : "#ffff00",
+			"yellowgreen" : "#9acd32"
+		};
 
-function context() {
-	this.fillStyle = '#000000';
-	this.strokeStyle = '#000000';
-	this.font = "12pt times";
-	this.textBaseline = 'alphabetic'; //top,bottom,middle,ideographic,alphabetic,hanging
-	this.lineWidth = 1;
-	this.lineJoin = 'miter'; //round, bevel, miter
-	this.lineCap = 'butt'; //butt, round, square
-	//TODO miter limit //default 10
-
-	this.copy = function(ctx) {
-		this.fillStyle = ctx.fillStyle;
-		this.strokeStyle = ctx.strokeStyle;
-		this.font = ctx.font;
-		this.lineWidth = ctx.lineWidth;
-		this.lineJoin = ctx.lineJoin;
-		this.lineCap = ctx.lineCap;
-		this.textBaseline = ctx.textBaseline;
-		this._fontSize = ctx._fontSize;
+		if (typeof colors[color.toLowerCase()] != 'undefined')
+			return colors[color.toLowerCase()];
+
+		return false;
 	};
-}
+
+	function context() {
+		this.fillStyle = '#000000';
+		this.strokeStyle = '#000000';
+		this.font = "12pt times";
+		this.textBaseline = 'alphabetic'; //top,bottom,middle,ideographic,alphabetic,hanging
+		this.lineWidth = 1;
+		this.lineJoin = 'miter'; //round, bevel, miter
+		this.lineCap = 'butt'; //butt, round, square
+		//TODO miter limit //default 10
+
+		this.copy = function(ctx) {
+			this.fillStyle = ctx.fillStyle;
+			this.strokeStyle = ctx.strokeStyle;
+			this.font = ctx.font;
+			this.lineWidth = ctx.lineWidth;
+			this.lineJoin = ctx.lineJoin;
+			this.lineCap = ctx.lineCap;
+			this.textBaseline = ctx.textBaseline;
+			this._fontSize = ctx._fontSize;
+		};
+	}
+
+	return this;
+})(jsPDF.API);

test/test_context2d.html

@@ -70,6 +70,24 @@
 
     ctx.restore();
 
+    // CSS Color Names
+    ctx.save();
+    ctx.fillText("Testing CSS color names", 20, y + textHeight);
+    y += textHeight + pad;
+    
+    ctx.setFillStyle('red');
+    ctx.fillText("Red", 20, y + textHeight);
+    y += textHeight + pad;
+
+    ctx.setFillStyle('green');
+    ctx.fillText("Green", 20, y + textHeight);
+    y += textHeight + pad;
+   
+    ctx.setStrokeStyle('blue');
+    ctx.strokeText("Blue", 20, y + textHeight);
+    y += textHeight + pad;
+    ctx.restore();
+    
     //
     // Text baseline
     //