Update setGradient and addColorStop interface

- setGradient('fill', {x1: 50, y2: 10, colorStops: {'0.7', 'rgba(0,153,153,0.5)'}});
- addColorStop({'0.4', 'blue'});

src/gradient.class.js

@@ -88,11 +88,14 @@
     /**
      * Adds another colorStop
      * @method add
-     * @param {Object} colorStop Object with offset, color and opacity
+     * @param {Object} colorStop Object with offset and color
      * @return {fabric.Gradient} thisArg
      */
     addColorStop: function(colorStop) {
-      this.colorStops.push(colorStop);
+      for (var position in colorStop) {
+        var color = new fabric.Color(colorStop[position]);
+        this.colorStops.push({offset: position, color: color.toRgb(), opacity: color.getAlpha()});
+      }
       return this;
     },
 

src/object.class.js

@@ -861,7 +861,29 @@
      * @param {Object} [options] Options object
      */
     setGradient: function(property, options) {
-      this.set(property, fabric.Gradient.forObject(this, options));
+      options || (options = { });
+
+      var gradient = {colorStops: []};
+
+      gradient.type = options.type || (options.r1 || options.r2 ? 'radial' : 'linear');
+      gradient.coords = {
+        x1: options.x1,
+        y1: options.y1,
+        x2: options.x2,
+        y2: options.y2
+      };
+
+      if (options.r1 || options.r2) {
+        gradient.coords.r1 = options.r1;
+        gradient.coords.r2 = options.r2;
+      }
+
+      for (var position in options.colorStops) {
+        var color = new fabric.Color(options.colorStops[position]);
+        gradient.colorStops.push({offset: position, color: color.toRgb(), opacity: color.getAlpha()});
+      }
+
+      this.set(property, fabric.Gradient.forObject(this, gradient));
     },
 
     /**