fabric-rails 1.0.12.1 → 1.2.1

data/vendor/assets/javascripts/fabric/{observable.mixin.js → mixins/observable.mixin.js}

@@ -1,16 +1,14 @@
-/**
- * @namespace
- */
-fabric.Observable = {
+(function(){
 
   /**
    * Observes specified event
-   * @method observe
-   * @depracated Since 0.8.34. Use `on` instead.
+   * @deprecated `observe` deprecated since 0.8.34 (use `on` instead)
+   * @memberOf fabric.Observable
+   * @alias on
    * @param {String} eventName
    * @param {Function} handler
    */
-  observe: function(eventName, handler) {
+  function observe(eventName, handler) {
     if (!this.__eventListeners) {
       this.__eventListeners = { };
     }
@@ -26,16 +24,17 @@ fabric.Observable = {
       }
       this.__eventListeners[eventName].push(handler);
     }
-  },
+  }
 
   /**
    * Stops event observing for a particular event handler
-   * @method stopObserving
-   * @depracated Since 0.8.34. Use `off` instead.
+   * @deprecated `stopObserving` deprecated since 0.8.34 (use `off` instead)
+   * @memberOf fabric.Observable
+   * @alias off
    * @param {String} eventName
    * @param {Function} handler
    */
-  stopObserving: function(eventName, handler) {
+  function stopObserving(eventName, handler) {
     if (!this.__eventListeners) {
       this.__eventListeners = { };
     }
@@ -47,16 +46,17 @@ fabric.Observable = {
         this.__eventListeners[eventName].length = 0;
       }
     }
-  },
+  }
 
   /**
    * Fires event with an optional options object
-   * @deprecated since 1.0.7
-   * @method fire
+   * @deprecated `fire` deprecated since 1.0.7 (use `trigger` instead)
+   * @memberOf fabric.Observable
+   * @alias trigger
    * @param {String} eventName
    * @param {Object} [options]
    */
-  fire: function(eventName, options) {
+  function fire(eventName, options) {
     if (!this.__eventListeners) {
       this.__eventListeners = { };
     }
@@ -67,25 +67,17 @@ fabric.Observable = {
       listenersForEvent[i](options || { });
     }
   }
-};
-
-/**
- * Alias for observe
- * @method observe
- * @type function
- */
-fabric.Observable.on = fabric.Observable.observe;
 
-/**
- * Alias for stopObserving
- * @method off
- * @type function
- */
-fabric.Observable.off = fabric.Observable.stopObserving;
+  /**
+   * @namespace fabric.Observable
+   */
+  fabric.Observable = {
+    observe: observe,
+    stopObserving: stopObserving,
+    fire: fire,
 
-/**
- * Alias for fire
- * @method trigger
- * @type function
- */
-fabric.Observable.trigger = fabric.Observable.fire;
+    on: observe,
+    off: stopObserving,
+    trigger: fire
+  };
+})();

data/vendor/assets/javascripts/fabric/mixins/stateful.mixin.js

@@ -0,0 +1,45 @@
+/*
+  Depends on `stateProperties`
+*/
+fabric.util.object.extend(fabric.Object.prototype, /** @lends fabric.Object.prototype */ {
+
+  /**
+   * Returns true if object state (one of its state properties) was changed
+   * @return {Boolean} true if instance' state has changed since `{@link fabric.Object#saveState}` was called
+   */
+  hasStateChanged: function() {
+    return this.stateProperties.some(function(prop) {
+      return this[prop] !== this.originalState[prop];
+    }, this);
+  },
+
+  /**
+   * Saves state of an object
+   * @param {Object} [options] Object with additional `stateProperties` array to include when saving state
+   * @return {fabric.Object} thisArg
+   */
+  saveState: function(options) {
+    this.stateProperties.forEach(function(prop) {
+      this.originalState[prop] = this.get(prop);
+    }, this);
+
+    if (options && options.stateProperties) {
+      options.stateProperties.forEach(function(prop) {
+        this.originalState[prop] = this.get(prop);
+      }, this);
+    }
+
+    return this;
+  },
+
+  /**
+   * Setups state of an object
+   * @return {fabric.Object} thisArg
+   */
+  setupState: function() {
+    this.originalState = { };
+    this.saveState();
+
+    return this;
+  }
+});

data/vendor/assets/javascripts/fabric/node.js

@@ -7,27 +7,29 @@
   var DOMParser = new require('xmldom').DOMParser,
       URL = require('url'),
       HTTP = require('http'),
+      HTTPS = require('https'),
 
       Canvas = require('canvas'),
       Image = require('canvas').Image;
 
   /** @private */
   function request(url, encoding, callback) {
-    var oURL = URL.parse(url),
-        client = HTTP.createClient(oURL.port, oURL.hostname),
-        req = client.request('GET', oURL.pathname, { 'host': oURL.hostname });
+    var oURL = URL.parse(url);
 
-    client.addListener('error', function(err) {
-      if (err.errno === process.ECONNREFUSED) {
-        fabric.log('ECONNREFUSED: connection refused to ' + client.host + ':' + client.port);
-      }
-      else {
-        fabric.log(err.message);
-      }
-    });
+    // detect if http or https is used
+    if ( !oURL.port ) {
+      oURL.port = ( oURL.protocol.indexOf('https:') === 0 ) ? 443 : 80;
+    }
 
-    req.end();
-    req.on('response', function (response) {
+    // assign request handler based on protocol
+    var reqHandler = ( oURL.port === 443 ) ? HTTPS : HTTP;
+
+    var req = reqHandler.request({
+      hostname: oURL.hostname,
+      port: oURL.port,
+      path: oURL.path,
+      method: 'GET'
+    }, function(response){
       var body = "";
       if (encoding) {
         response.setEncoding(encoding);
@@ -41,29 +43,64 @@
         }
       });
     });
+
+    req.on('error', function(err) {
+      if (err.errno === process.ECONNREFUSED) {
+        fabric.log('ECONNREFUSED: connection refused to ' + oURL.hostname + ':' + oURL.port);
+      }
+      else {
+        fabric.log(err.message);
+      }
+    });
+
+    req.end();
+  }
+
+  /** @private */
+  function request_fs(url, callback){
+    var fs = require('fs'),
+    stream = fs.createReadStream(url),
+    body = '';
+    stream.on('data', function(chunk){
+        body += chunk;
+    });
+    stream.on('end', function(){
+      callback(body);
+    });
   }
 
   fabric.util.loadImage = function(url, callback, context) {
+    var createImageAndCallBack = function(data){
+      img.src = new Buffer(data, 'binary');
+      // preserving original url, which seems to be lost in node-canvas
+      img._src = url;
+      callback && callback.call(context, img);
+    };
     var img = new Image();
-    if (url && url.indexOf('data') === 0) {
+    if (url && (url instanceof Buffer || url.indexOf('data') === 0)) {
       img.src = img._src = url;
       callback && callback.call(context, img);
     }
+    else if (url && url.indexOf('http') !== 0) {
+      request_fs(url, createImageAndCallBack);
+    }
     else if (url) {
-      request(url, 'binary', function(body) {
-        img.src = new Buffer(body, 'binary');
-        // preserving original url, which seems to be lost in node-canvas
-        img._src = url;
-        callback && callback.call(context, img);
-      });
+      request(url, 'binary', createImageAndCallBack);
     }
   };
 
   fabric.loadSVGFromURL = function(url, callback) {
     url = url.replace(/^\n\s*/, '').replace(/\?.*$/, '').trim();
-    request(url, '', function(body) {
-      fabric.loadSVGFromString(body, callback);
-    });
+    if (url.indexOf('http') !== 0) {
+      request_fs(url, function(body) {
+        fabric.loadSVGFromString(body, callback);
+      });
+    }
+    else {
+      request(url, '', function(body) {
+        fabric.loadSVGFromString(body, callback);
+      });
+    }
   };
 
   fabric.loadSVGFromString = function(string, callback) {
@@ -92,7 +129,6 @@
 
   /**
    * Only available when running fabric on node.js
-   * @method createCanvasForNode
    * @param width Canvas width
    * @param height Canvas height
    * @return {Object} wrapped canvas instance
@@ -128,7 +164,7 @@
 
   var origSetWidth = fabric.StaticCanvas.prototype.setWidth;
   fabric.StaticCanvas.prototype.setWidth = function(width) {
-    origSetWidth.call(this);
+    origSetWidth.call(this, width);
     this.nodeCanvas.width = width;
     return this;
   };
@@ -138,7 +174,7 @@
 
   var origSetHeight = fabric.StaticCanvas.prototype.setHeight;
   fabric.StaticCanvas.prototype.setHeight = function(height) {
-    origSetHeight.call(this);
+    origSetHeight.call(this, height);
     this.nodeCanvas.height = height;
     return this;
   };

data/vendor/assets/javascripts/fabric/parser.js

@@ -10,23 +10,42 @@
   var fabric = global.fabric || (global.fabric = { }),
       extend = fabric.util.object.extend,
       capitalize = fabric.util.string.capitalize,
-      clone = fabric.util.object.clone;
+      clone = fabric.util.object.clone,
+      toFixed = fabric.util.toFixed,
+      multiplyTransformMatrices = fabric.util.multiplyTransformMatrices;
+
+  fabric.SHARED_ATTRIBUTES = [
+    "transform",
+    "fill", "fill-opacity", "fill-rule",
+    "opacity",
+    "stroke", "stroke-dasharray", "stroke-linecap", "stroke-linejoin", "stroke-miterlimit", "stroke-opacity", "stroke-width"
+  ];
 
   var attributesMap = {
+    'fill-opacity':     'fillOpacity',
+    'fill-rule':        'fillRule',
+    'font-family':      'fontFamily',
+    'font-size':        'fontSize',
+    'font-style':       'fontStyle',
+    'font-weight':      'fontWeight',
     'cx':               'left',
     'x':                'left',
-    'cy':               'top',
-    'y':                'top',
     'r':                'radius',
-    'fill-opacity':     'opacity',
-    'fill-rule':        'fillRule',
+    'stroke-dasharray': 'strokeDashArray',
+    'stroke-linecap':   'strokeLineCap',
+    'stroke-linejoin':  'strokeLineJoin',
+    'stroke-miterlimit':'strokeMiterLimit',
+    'stroke-opacity':   'strokeOpacity',
     'stroke-width':     'strokeWidth',
-    'transform':        'transformMatrix',
     'text-decoration':  'textDecoration',
-    'font-size':        'fontSize',
-    'font-weight':      'fontWeight',
-    'font-style':       'fontStyle',
-    'font-family':      'fontFamily'
+    'cy':               'top',
+    'y':                'top',
+    'transform':        'transformMatrix'
+  };
+
+  var colorAttributes = {
+    'stroke': 'strokeOpacity',
+    'fill':   'fillOpacity'
   };
 
   function normalizeAttr(attr) {
@@ -37,12 +56,57 @@
     return attr;
   }
 
+  function normalizeValue(attr, value, parentAttributes) {
+    var isArray;
+
+    if ((attr === 'fill' || attr === 'stroke') && value === 'none') {
+      value = '';
+    }
+    else if (attr === 'fillRule') {
+      value = (value === 'evenodd') ? 'destination-over' : value;
+    }
+    else if (attr === 'strokeDashArray') {
+      value = value.replace(/,/g, ' ').split(/\s+/);
+    }
+    else if (attr === 'transformMatrix') {
+      if (parentAttributes && parentAttributes.transformMatrix) {
+        value = multiplyTransformMatrices(
+          parentAttributes.transformMatrix, fabric.parseTransformAttribute(value));
+      }
+      else {
+        value = fabric.parseTransformAttribute(value);
+      }
+    }
+
+    isArray = Object.prototype.toString.call(value) === '[object Array]';
+
+    // TODO: need to normalize em, %, pt, etc. to px (!)
+    var parsed = isArray ? value.map(parseFloat) : parseFloat(value);
+
+    return (!isArray && isNaN(parsed) ? value : parsed);
+  }
+
+  /**
+   * @private
+   * @param {Object} attributes Array of attributes to parse
+   */
+  function _setStrokeFillOpacity(attributes) {
+    for (var attr in colorAttributes) {
+      if (!attributes[attr] || typeof attributes[colorAttributes[attr]] === 'undefined') continue;
+
+      var color = new fabric.Color(attributes[attr]);
+      attributes[attr] = color.setAlpha(toFixed(color.getAlpha() * attributes[colorAttributes[attr]], 2)).toRgba();
+
+      delete attributes[colorAttributes[attr]];
+    }
+    return attributes;
+  }
+
   /**
    * Returns an object of attributes' name/value, given element and an array of attribute names;
    * Parses parent "g" nodes recursively upwards.
    * @static
    * @memberOf fabric
-   * @method parseAttributes
    * @param {DOMElement} element Element to parse
    * @param {Array} attributes Array of attributes to parse
    * @return {Object} object containing parsed attributes' names/values
@@ -54,7 +118,6 @@
     }
 
     var value,
-        parsed,
         parentAttributes = { };
 
     // if there's a parent container (`g` node), parse its attributes recursively upwards
@@ -64,20 +127,11 @@
 
     var ownAttributes = attributes.reduce(function(memo, attr) {
       value = element.getAttribute(attr);
-      parsed = parseFloat(value);
       if (value) {
-        // "normalize" attribute values
-        if ((attr === 'fill' || attr === 'stroke') && value === 'none') {
-          value = '';
-        }
-        if (attr === 'fill-rule') {
-          value = (value === 'evenodd') ? 'destination-over' : value;
-        }
-        if (attr === 'transform') {
-          value = fabric.parseTransformAttribute(value);
-        }
         attr = normalizeAttr(attr);
-        memo[attr] = isNaN(parsed) ? value : parsed;
+        value = normalizeValue(attr, value, parentAttributes);
+
+        memo[attr] = value;
       }
       return memo;
     }, { });
@@ -85,8 +139,9 @@
     // add values parsed from style, which take precedence over attributes
     // (see: http://www.w3.org/TR/SVG/styling.html#UsingPresentationAttributes)
 
-    ownAttributes = extend(ownAttributes, extend(getGlobalStylesForElement(element), fabric.parseStyleAttribute(element)));
-    return extend(parentAttributes, ownAttributes);
+    ownAttributes = extend(ownAttributes,
+      extend(getGlobalStylesForElement(element), fabric.parseStyleAttribute(element)));
+    return _setStrokeFillOpacity(extend(parentAttributes, ownAttributes));
   }
 
   /**
@@ -94,7 +149,6 @@
    * @static
    * @function
    * @memberOf fabric
-   * @method parseTransformAttribute
    * @param attributeValue {String} string containing attribute value
    * @return {Array} array of 6 elements representing transformation matrix
    */
@@ -177,12 +231,13 @@
         reTransformList = new RegExp(transform_list),
         // == end transform regexp
 
-        reTransform = new RegExp(transform);
+        reTransform = new RegExp(transform, 'g');
 
     return function(attributeValue) {
 
       // start with identity matrix
       var matrix = iMatrix.concat();
+      var matrices = [ ];
 
       // return if no argument was given or
       // an argument does not match transform attribute regexp
@@ -218,8 +273,19 @@
             matrix = args;
             break;
         }
+
+        // snapshot current matrix into matrices array
+        matrices.push(matrix.concat());
+        // reset
+        matrix = iMatrix.concat();
       });
-      return matrix;
+
+      var combinedMatrix = matrices[0];
+      while (matrices.length > 1) {
+        matrices.shift();
+        combinedMatrix = fabric.util.multiplyTransformMatrices(combinedMatrix, matrices[0]);
+      }
+      return combinedMatrix;
     };
   })();
 
@@ -227,7 +293,6 @@
    * Parses "points" attribute, returning an array of values
    * @static
    * @memberOf fabric
-   * @method parsePointsAttribute
    * @param points {String} points attribute string
    * @return {Array} array of points
    */
@@ -267,38 +332,76 @@
     return parsedPoints;
   }
 
+  function parseFontDeclaration(value, oStyle) {
+
+    // TODO: support non-px font size
+    var match = value.match(/(normal|italic)?\s*(normal|small-caps)?\s*(normal|bold|bolder|lighter|100|200|300|400|500|600|700|800|900)?\s*(\d+)px\s+(.*)/);
+
+    if (!match) return;
+
+    var fontStyle = match[1];
+    // Font variant is not used
+    // var fontVariant = match[2];
+    var fontWeight = match[3];
+    var fontSize = match[4];
+    var fontFamily = match[5];
+
+    if (fontStyle) {
+      oStyle.fontStyle = fontStyle;
+    }
+    if (fontWeight) {
+      oStyle.fontSize = isNaN(parseFloat(fontWeight)) ? fontWeight : parseFloat(fontWeight);
+    }
+    if (fontSize) {
+      oStyle.fontSize = parseFloat(fontSize);
+    }
+    if (fontFamily) {
+      oStyle.fontFamily = fontFamily;
+    }
+  }
+
   /**
    * Parses "style" attribute, retuning an object with values
    * @static
    * @memberOf fabric
-   * @method parseStyleAttribute
    * @param {SVGElement} element Element to parse
    * @return {Object} Objects with values parsed from style attribute of an element
    */
   function parseStyleAttribute(element) {
     var oStyle = { },
-        style = element.getAttribute('style');
+        style = element.getAttribute('style'),
+        attr, value;
 
     if (!style) return oStyle;
 
     if (typeof style === 'string') {
-      style = style.replace(/;$/, '').split(';').forEach(function (current) {
+      style.replace(/;$/, '').split(';').forEach(function (chunk) {
+        var pair = chunk.split(':');
 
-        var attr = current.split(':');
-        var value = attr[1].trim();
+        attr = normalizeAttr(pair[0].trim().toLowerCase());
+        value = normalizeValue(attr, pair[1].trim());
 
-        // TODO: need to normalize em, %, pt, etc. to px (!)
-        var parsed = parseFloat(value);
-
-        oStyle[normalizeAttr(attr[0].trim().toLowerCase())] = isNaN(parsed) ? value : parsed;
+        if (attr === 'font') {
+          parseFontDeclaration(value, oStyle);
+        }
+        else {
+          oStyle[attr] = value;
+        }
       });
     }
     else {
       for (var prop in style) {
         if (typeof style[prop] === 'undefined') continue;
 
-        var parsed = parseFloat(style[prop]);
-        oStyle[normalizeAttr(prop.toLowerCase())] = isNaN(parsed) ? style[prop] : parsed;
+        attr = normalizeAttr(prop.toLowerCase());
+        value = normalizeValue(attr, style[prop]);
+
+        if (attr === 'font') {
+          parseFontDeclaration(value, oStyle);
+        }
+        else {
+          oStyle[attr] = value;
+        }
       }
     }
 
@@ -325,7 +428,6 @@
    * Transforms an array of svg elements to corresponding fabric.* instances
    * @static
    * @memberOf fabric
-   * @method parseElements
    * @param {Array} elements Array of elements to parse
    * @param {Function} callback Being passed an array of fabric instances (transformed from SVG elements)
    * @param {Object} [options] Options object
@@ -356,7 +458,7 @@
                 instances.splice(index, 0, obj);
                 checkIfDone();
               };
-            })(index), options);
+            })(index, el), options);
           }
           else {
             var obj = klass.fromElement(el, options);
@@ -380,7 +482,6 @@
    * @static
    * @function
    * @memberOf fabric
-   * @method getCSSRules
    * @param {SVGDocument} doc SVG document to parse
    * @return {Object} CSS rules of this document
    */
@@ -451,7 +552,6 @@
    * @static
    * @function
    * @memberOf fabric
-   * @method parseSVGDocument
    * @param {SVGDocument} doc SVG document to parse
    * @param {Function} callback Callback to call when parsing is finished; It's being passed an array of elements (parsed from a document).
    * @param {Function} [reviver] Method for further parsing of SVG elements, called after each fabric object created.
@@ -546,15 +646,13 @@
     };
   })();
 
-  /**
+   /**
     * Used for caching SVG documents (loaded via `fabric.Canvas#loadSVGFromURL`)
-    * @property
     * @namespace
     */
    var svgCache = {
 
      /**
-      * @method has
       * @param {String} name
       * @param {Function} callback
       */
@@ -563,7 +661,6 @@
      },
 
      /**
-      * @method get
       * @param {String} url
       * @param {Function} callback
       */
@@ -572,7 +669,6 @@
      },
 
      /**
-      * @method set
       * @param {String} url
       * @param {Object} object
       */
@@ -582,8 +678,7 @@
    };
 
    /**
-    * Takes url corresponding to an SVG document, and parses it into a set of fabric objects
-    * @method loadSVGFromURL
+    * Takes url corresponding to an SVG document, and parses it into a set of fabric objects. Note that SVG is fetched via XMLHttpRequest, so it needs to conform to SOP (Same Origin Policy)
     * @memberof fabric
     * @param {String} url
     * @param {Function} callback
@@ -630,8 +725,8 @@
    }
 
   /**
-  * @method _enlivenCachedObject
-  */
+   * @private
+   */
   function _enlivenCachedObject(cachedObject) {
 
    var objects = cachedObject.objects,
@@ -646,7 +741,6 @@
 
   /**
     * Takes string corresponding to an SVG document, and parses it into a set of fabric objects
-    * @method loadSVGFromString
     * @memberof fabric
     * @param {String} string
     * @param {Function} callback
@@ -675,7 +769,6 @@
 
   /**
    * Creates markup containing SVG font faces
-   * @method createSVGFontFacesMarkup
    * @param {Array} objects Array of fabric objects
    * @return {String}
    */
@@ -708,7 +801,6 @@
 
   /**
    * Creates markup containing SVG referenced elements like patterns, gradients etc.
-   * @method createSVGRefElementsMarkup
    * @param {fabric.Canvas} canvas instance of fabric.Canvas
    * @return {String}
    */
@@ -732,6 +824,35 @@
     return markup;
   }
 
+  /**
+   * Parses an SVG document, returning all of the gradient declarations found in it
+   * @static
+   * @function
+   * @memberOf fabric
+   * @param {SVGDocument} doc SVG document to parse
+   * @return {Object} Gradient definitions; key corresponds to element id, value -- to gradient definition element
+   */
+  function getGradientDefs(doc) {
+    var linearGradientEls = doc.getElementsByTagName('linearGradient'),
+        radialGradientEls = doc.getElementsByTagName('radialGradient'),
+        el, i,
+        gradientDefs = { };
+
+    i = linearGradientEls.length;
+    for (; i--; ) {
+      el = linearGradientEls[i];
+      gradientDefs[el.getAttribute('id')] = el;
+    }
+
+    i = radialGradientEls.length;
+    for (; i--; ) {
+      el = radialGradientEls[i];
+      gradientDefs[el.getAttribute('id')] = el;
+    }
+
+    return gradientDefs;
+  }
+
   extend(fabric, {
 
     parseAttributes:            parseAttributes,
@@ -744,7 +865,9 @@
     loadSVGFromString:          loadSVGFromString,
 
     createSVGFontFacesMarkup:   createSVGFontFacesMarkup,
-    createSVGRefElementsMarkup: createSVGRefElementsMarkup
+    createSVGRefElementsMarkup: createSVGRefElementsMarkup,
+
+    getGradientDefs:            getGradientDefs
   });
 
 })(typeof exports !== 'undefined' ? exports : this);