{"ast":null,"code":"/**\r\n * @author NHN Ent. FE Development Team <dl_javascript@nhn.com>\r\n * @fileoverview ColorFilter extending fabric.Image.filters.BaseFilter\r\n */\nimport fabric from 'fabric';\n/**\r\n * ColorFilter object\r\n * @class ColorFilter\r\n * @extends {fabric.Image.filters.BaseFilter}\r\n * @ignore\r\n */\n\nconst ColorFilter = fabric.util.createClass(fabric.Image.filters.BaseFilter,\n/** @lends BaseFilter.prototype */\n{\n  /**\r\n   * Filter type\r\n   * @param {String} type\r\n   * @default\r\n   */\n  type: 'ColorFilter',\n\n  /**\r\n   * Constructor\r\n   * @member fabric.Image.filters.ColorFilter.prototype\r\n   * @param {Object} [options] Options object\r\n   * @param {Number} [options.color='#FFFFFF'] Value of color (0...255)\r\n   * @param {Number} [options.threshold=45] Value of threshold (0...255)\r\n   * @override\r\n   */\n  initialize(options) {\n    if (!options) {\n      options = {};\n    }\n\n    this.color = options.color || '#FFFFFF';\n    this.threshold = options.threshold || 45;\n    this.x = options.x || null;\n    this.y = options.y || null;\n  },\n\n  /**\r\n   * Applies filter to canvas element\r\n   * @param {Object} canvas Canvas object passed by fabric\r\n   */\n  // eslint-disable-next-line complexity\n  applyTo(canvas) {\n    const {\n      canvasEl\n    } = canvas;\n    const context = canvasEl.getContext('2d');\n    const imageData = context.getImageData(0, 0, canvasEl.width, canvasEl.height);\n    const {\n      data\n    } = imageData;\n    const {\n      threshold\n    } = this;\n    let filterColor = fabric.Color.sourceFromHex(this.color);\n    let i, len;\n\n    if (this.x && this.y) {\n      filterColor = this._getColor(imageData, this.x, this.y);\n    }\n\n    for (i = 0, len = data.length; i < len; i += 4) {\n      if (this._isOutsideThreshold(data[i], filterColor[0], threshold) || this._isOutsideThreshold(data[i + 1], filterColor[1], threshold) || this._isOutsideThreshold(data[i + 2], filterColor[2], threshold)) {\n        continue;\n      }\n\n      data[i] = data[i + 1] = data[i + 2] = data[i + 3] = 0;\n    }\n\n    context.putImageData(imageData, 0, 0);\n  },\n\n  /**\r\n   * Check color if it is within threshold\r\n   * @param {Number} color1 source color\r\n   * @param {Number} color2 filtering color\r\n   * @param {Number} threshold threshold\r\n   * @returns {boolean} true if within threshold or false\r\n   */\n  _isOutsideThreshold(color1, color2, threshold) {\n    const diff = color1 - color2;\n    return Math.abs(diff) > threshold;\n  },\n\n  /**\r\n   * Get color at (x, y)\r\n   * @param {Object} imageData of canvas\r\n   * @param {Number} x left position\r\n   * @param {Number} y top position\r\n   * @returns {Array} color array\r\n   */\n  _getColor(imageData, x, y) {\n    const color = [0, 0, 0, 0];\n    const {\n      data,\n      width\n    } = imageData;\n    const bytes = 4;\n    const position = (width * y + x) * bytes;\n    color[0] = data[position];\n    color[1] = data[position + 1];\n    color[2] = data[position + 2];\n    color[3] = data[position + 3];\n    return color;\n  }\n\n});\nexport default ColorFilter;","map":{"version":3,"sources":["C:/Users/kkwan_000/Desktop/git/2017110269/minsung/src/js/extension/colorFilter.js"],"names":["fabric","ColorFilter","util","createClass","Image","filters","BaseFilter","type","initialize","options","color","threshold","x","y","applyTo","canvas","canvasEl","context","getContext","imageData","getImageData","width","height","data","filterColor","Color","sourceFromHex","i","len","_getColor","length","_isOutsideThreshold","putImageData","color1","color2","diff","Math","abs","bytes","position"],"mappings":"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","sourcesContent":["/**\r\n * @author NHN Ent. FE Development Team <dl_javascript@nhn.com>\r\n * @fileoverview ColorFilter extending fabric.Image.filters.BaseFilter\r\n */\r\nimport fabric from 'fabric';\r\n\r\n/**\r\n * ColorFilter object\r\n * @class ColorFilter\r\n * @extends {fabric.Image.filters.BaseFilter}\r\n * @ignore\r\n */\r\nconst ColorFilter = fabric.util.createClass(\r\n  fabric.Image.filters.BaseFilter,\r\n  /** @lends BaseFilter.prototype */ {\r\n    /**\r\n     * Filter type\r\n     * @param {String} type\r\n     * @default\r\n     */\r\n    type: 'ColorFilter',\r\n\r\n    /**\r\n     * Constructor\r\n     * @member fabric.Image.filters.ColorFilter.prototype\r\n     * @param {Object} [options] Options object\r\n     * @param {Number} [options.color='#FFFFFF'] Value of color (0...255)\r\n     * @param {Number} [options.threshold=45] Value of threshold (0...255)\r\n     * @override\r\n     */\r\n    initialize(options) {\r\n      if (!options) {\r\n        options = {};\r\n      }\r\n      this.color = options.color || '#FFFFFF';\r\n      this.threshold = options.threshold || 45;\r\n      this.x = options.x || null;\r\n      this.y = options.y || null;\r\n    },\r\n\r\n    /**\r\n     * Applies filter to canvas element\r\n     * @param {Object} canvas Canvas object passed by fabric\r\n     */\r\n    // eslint-disable-next-line complexity\r\n    applyTo(canvas) {\r\n      const { canvasEl } = canvas;\r\n      const context = canvasEl.getContext('2d');\r\n      const imageData = context.getImageData(0, 0, canvasEl.width, canvasEl.height);\r\n      const { data } = imageData;\r\n      const { threshold } = this;\r\n      let filterColor = fabric.Color.sourceFromHex(this.color);\r\n      let i, len;\r\n\r\n      if (this.x && this.y) {\r\n        filterColor = this._getColor(imageData, this.x, this.y);\r\n      }\r\n\r\n      for (i = 0, len = data.length; i < len; i += 4) {\r\n        if (\r\n          this._isOutsideThreshold(data[i], filterColor[0], threshold) ||\r\n          this._isOutsideThreshold(data[i + 1], filterColor[1], threshold) ||\r\n          this._isOutsideThreshold(data[i + 2], filterColor[2], threshold)\r\n        ) {\r\n          continue;\r\n        }\r\n        data[i] = data[i + 1] = data[i + 2] = data[i + 3] = 0;\r\n      }\r\n      context.putImageData(imageData, 0, 0);\r\n    },\r\n\r\n    /**\r\n     * Check color if it is within threshold\r\n     * @param {Number} color1 source color\r\n     * @param {Number} color2 filtering color\r\n     * @param {Number} threshold threshold\r\n     * @returns {boolean} true if within threshold or false\r\n     */\r\n    _isOutsideThreshold(color1, color2, threshold) {\r\n      const diff = color1 - color2;\r\n\r\n      return Math.abs(diff) > threshold;\r\n    },\r\n\r\n    /**\r\n     * Get color at (x, y)\r\n     * @param {Object} imageData of canvas\r\n     * @param {Number} x left position\r\n     * @param {Number} y top position\r\n     * @returns {Array} color array\r\n     */\r\n    _getColor(imageData, x, y) {\r\n      const color = [0, 0, 0, 0];\r\n      const { data, width } = imageData;\r\n      const bytes = 4;\r\n      const position = (width * y + x) * bytes;\r\n\r\n      color[0] = data[position];\r\n      color[1] = data[position + 1];\r\n      color[2] = data[position + 2];\r\n      color[3] = data[position + 3];\r\n\r\n      return color;\r\n    },\r\n  }\r\n);\r\n\r\nexport default ColorFilter;\r\n"]},"metadata":{},"sourceType":"module"}