fontStyle params for Text objects

Specify css font-variant|font-style options via the fontStyle parameter

Also getFontStyle and setFontStyle functions for this object.

dist/kinetic-core.js

@@ -2385,10 +2385,13 @@ Kinetic.Text = function(config) {
     if(config.padding === undefined) {
         config.padding = 0;
     }
+    if(config.fontStyle === undefined) {
+        config.fontStyle = 'normal';
+    }
 
     config.drawFunc = function() {
         var context = this.getContext();
-        context.font = this.fontSize + 'pt ' + this.fontFamily;
+        context.font = this.fontStyle + ' ' + this.fontSize + 'pt ' + this.fontFamily;
         context.textBaseline = 'middle';
         var metrics = context.measureText(this.text);
         var textHeight = textHeight = parseInt(this.fontSize, 10);
@@ -2477,6 +2480,21 @@ Kinetic.Text.prototype = {
     getFontSize: function() {
         return this.fontSize;
     },
+    /**
+     * set font style using same rules as the first argument for the css spec's shorthand font property:
+	 *		http://www.w3.org/TR/CSS21/fonts.html#propdef-font
+	 *	i.e. [ <'font-style'> || <'font-variant'> || <'font-weight'> ]
+     * @param {String} fontStyle
+     */
+    setFontStyle: function(fontStyle) {
+        this.fontStyle = fontStyle;
+    },
+    /**
+     * get font style
+     */
+    getFontStyle: function() {
+        return this.fontStyle;
+    },
     /**
      * set text fill color
      * @param {String} textFill

src/shapes/Text.js

@@ -28,10 +28,13 @@ Kinetic.Text = function(config) {
     if(config.padding === undefined) {
         config.padding = 0;
     }
+    if(config.fontStyle === undefined) {
+        config.fontStyle = 'normal';
+    }
 
     config.drawFunc = function() {
         var context = this.getContext();
-        context.font = this.fontSize + 'pt ' + this.fontFamily;
+        context.font = this.fontStyle + ' ' + this.fontSize + 'pt ' + this.fontFamily;
         context.textBaseline = 'middle';
         var metrics = context.measureText(this.text);
         var textHeight = textHeight = parseInt(this.fontSize, 10);
@@ -120,6 +123,21 @@ Kinetic.Text.prototype = {
     getFontSize: function() {
         return this.fontSize;
     },
+    /**
+     * set font style using same rules as the first argument for the css spec's shorthand font property:
+	 *		http://www.w3.org/TR/CSS21/fonts.html#propdef-font
+	 *	i.e. [ <'font-style'> || <'font-variant'> || <'font-weight'> ]
+     * @param {String} fontStyle
+     */
+    setFontStyle: function(fontStyle) {
+        this.fontStyle = fontStyle;
+    },
+    /**
+     * get font style
+     */
+    getFontStyle: function() {
+        return this.fontStyle;
+    },
     /**
      * set text fill color
      * @param {String} textFill

tests/js/unitTests.js

@@ -828,6 +828,7 @@ Test.prototype.tests = {
             text: 'Hello World!',
             fontSize: 60,
             fontFamily: 'Calibri',
+			fontStyle: 'normal',
             textFill: '#888',
             textStroke: '#333',
             padding: 10,
@@ -851,6 +852,7 @@ Test.prototype.tests = {
         text.setText('Bye World!');
         test(text.getText() === 'Bye World!', 'text should be Bye World!');
         test(text.getPadding() === 10, 'padding should be 10');
+		test(text.getFontStyle() == 'normal', 'font style should be normal');
         text.setPadding(20);
         test(text.getPadding() === 20, 'padding should be 20');
 
@@ -858,6 +860,7 @@ Test.prototype.tests = {
 
         text.setFontFamily('Arial');
         text.setFontSize(30);
+        text.setFontStyle('italic');
         text.setAlign('right');
         text.setVerticalAlign('top');
         text.setTextFill('blue');
@@ -866,6 +869,7 @@ Test.prototype.tests = {
 
         test(text.getFontFamily() === 'Arial', 'font family should be Arial');
         test(text.getFontSize() === 30, 'text size should be 30');
+		test(text.getFontStyle() == 'italic', 'font style should be italic');
         test(text.getAlign() === 'right', 'text align should be right');
         test(text.getVerticalAlign() === 'top', 'vertical align should be top');
         test(text.getTextFill() === 'blue', 'text fill should be blue');