914dd5b098aa926182327d2bf2c861c6.json 19.9 KB
{"ast":null,"code":"import Colorpicker from './tools/colorpicker';\nimport Range from './tools/range';\nimport Submenu from './submenuBase';\nimport templateHtml from './template/submenu/shape';\nimport { toInteger, assignmentForDestroy } from '../util';\nimport { defaultShapeStrokeValus } from '../consts';\nconst SHAPE_DEFAULT_OPTION = {\n  stroke: '#ffbb3b',\n  fill: '',\n  strokeWidth: 3\n};\n/**\r\n * Shape ui class\r\n * @class\r\n * @ignore\r\n */\n\nclass Shape extends Submenu {\n  constructor(subMenuElement, {\n    locale,\n    makeSvgIcon,\n    menuBarPosition,\n    usageStatistics\n  }) {\n    super(subMenuElement, {\n      locale,\n      name: 'shape',\n      makeSvgIcon,\n      menuBarPosition,\n      templateHtml,\n      usageStatistics\n    });\n    this.type = null;\n    this.options = SHAPE_DEFAULT_OPTION;\n    this._els = {\n      shapeSelectButton: this.selector('.tie-shape-button'),\n      shapeColorButton: this.selector('.tie-shape-color-button'),\n      strokeRange: new Range({\n        slider: this.selector('.tie-stroke-range'),\n        input: this.selector('.tie-stroke-range-value')\n      }, defaultShapeStrokeValus),\n      fillColorpicker: new Colorpicker(this.selector('.tie-color-fill'), '', this.toggleDirection, this.usageStatistics),\n      strokeColorpicker: new Colorpicker(this.selector('.tie-color-stroke'), '#ffbb3b', this.toggleDirection, this.usageStatistics)\n    };\n    this.colorPickerControls.push(this._els.fillColorpicker);\n    this.colorPickerControls.push(this._els.strokeColorpicker);\n  }\n  /**\r\n   * Destroys the instance.\r\n   */\n\n\n  destroy() {\n    this._removeEvent();\n\n    this._els.strokeRange.destroy();\n\n    this._els.fillColorpicker.destroy();\n\n    this._els.strokeColorpicker.destroy();\n\n    assignmentForDestroy(this);\n  }\n  /**\r\n   * Add event for shape\r\n   * @param {Object} actions - actions for shape\r\n   *   @param {Function} actions.changeShape - change shape mode\r\n   *   @param {Function} actions.setDrawingShape - set dreawing shape\r\n   */\n\n\n  addEvent(actions) {\n    this.eventHandler.shapeTypeSelected = this._changeShapeHandler.bind(this);\n    this.actions = actions;\n\n    this._els.shapeSelectButton.addEventListener('click', this.eventHandler.shapeTypeSelected);\n\n    this._els.strokeRange.on('change', this._changeStrokeRangeHandler.bind(this));\n\n    this._els.fillColorpicker.on('change', this._changeFillColorHandler.bind(this));\n\n    this._els.strokeColorpicker.on('change', this._changeStrokeColorHandler.bind(this));\n\n    this._els.fillColorpicker.on('changeShow', this.colorPickerChangeShow.bind(this));\n\n    this._els.strokeColorpicker.on('changeShow', this.colorPickerChangeShow.bind(this));\n  }\n  /**\r\n   * Remove event\r\n   * @private\r\n   */\n\n\n  _removeEvent() {\n    this._els.shapeSelectButton.removeEventListener('click', this.eventHandler.shapeTypeSelected);\n\n    this._els.strokeRange.off();\n\n    this._els.fillColorpicker.off();\n\n    this._els.strokeColorpicker.off();\n  }\n  /**\r\n   * Set Shape status\r\n   * @param {Object} options - options of shape status\r\n   *   @param {string} strokeWidth - stroke width\r\n   *   @param {string} strokeColor - stroke color\r\n   *   @param {string} fillColor - fill color\r\n   */\n\n\n  setShapeStatus({\n    strokeWidth,\n    strokeColor,\n    fillColor\n  }) {\n    this._els.strokeRange.value = strokeWidth;\n    this._els.strokeColorpicker.color = strokeColor;\n    this._els.fillColorpicker.color = fillColor;\n    this.options.stroke = strokeColor;\n    this.options.fill = fillColor;\n    this.options.strokeWidth = strokeWidth;\n    this.actions.setDrawingShape(this.type, {\n      strokeWidth\n    });\n  }\n  /**\r\n   * Executed when the menu starts.\r\n   */\n\n\n  changeStartMode() {\n    this.actions.stopDrawingMode();\n  }\n  /**\r\n   * Returns the menu to its default state.\r\n   */\n\n\n  changeStandbyMode() {\n    this.type = null;\n    this.actions.changeSelectableAll(true);\n\n    this._els.shapeSelectButton.classList.remove('circle');\n\n    this._els.shapeSelectButton.classList.remove('triangle');\n\n    this._els.shapeSelectButton.classList.remove('rect');\n  }\n  /**\r\n   * set range stroke max value\r\n   * @param {number} maxValue - expect max value for change\r\n   */\n\n\n  setMaxStrokeValue(maxValue) {\n    let strokeMaxValue = maxValue;\n\n    if (strokeMaxValue <= 0) {\n      strokeMaxValue = defaultShapeStrokeValus.max;\n    }\n\n    this._els.strokeRange.max = strokeMaxValue;\n  }\n  /**\r\n   * Set stroke value\r\n   * @param {number} value - expect value for strokeRange change\r\n   */\n\n\n  setStrokeValue(value) {\n    this._els.strokeRange.value = value;\n\n    this._els.strokeRange.trigger('change');\n  }\n  /**\r\n   * Get stroke value\r\n   * @returns {number} - stroke range value\r\n   */\n\n\n  getStrokeValue() {\n    return this._els.strokeRange.value;\n  }\n  /**\r\n   * Change icon color\r\n   * @param {object} event - add button event object\r\n   * @private\r\n   */\n\n\n  _changeShapeHandler(event) {\n    const button = event.target.closest('.tui-image-editor-button');\n\n    if (button) {\n      this.actions.stopDrawingMode();\n      this.actions.discardSelection();\n      const shapeType = this.getButtonType(button, ['circle', 'triangle', 'rect']);\n\n      if (this.type === shapeType) {\n        this.changeStandbyMode();\n        return;\n      }\n\n      this.changeStandbyMode();\n      this.type = shapeType;\n      event.currentTarget.classList.add(shapeType);\n      this.actions.changeSelectableAll(false);\n      this.actions.modeChange('shape');\n    }\n  }\n  /**\r\n   * Change stroke range\r\n   * @param {number} value - stroke range value\r\n   * @param {boolean} isLast - Is last change\r\n   * @private\r\n   */\n\n\n  _changeStrokeRangeHandler(value, isLast) {\n    this.options.strokeWidth = toInteger(value);\n    this.actions.changeShape({\n      strokeWidth: value\n    }, !isLast);\n    this.actions.setDrawingShape(this.type, this.options);\n  }\n  /**\r\n   * Change shape color\r\n   * @param {string} color - fill color\r\n   * @private\r\n   */\n\n\n  _changeFillColorHandler(color) {\n    color = color || 'transparent';\n    this.options.fill = color;\n    this.actions.changeShape({\n      fill: color\n    });\n  }\n  /**\r\n   * Change shape stroke color\r\n   * @param {string} color - fill color\r\n   * @private\r\n   */\n\n\n  _changeStrokeColorHandler(color) {\n    color = color || 'transparent';\n    this.options.stroke = color;\n    this.actions.changeShape({\n      stroke: color\n    });\n  }\n\n}\n\nexport default Shape;","map":{"version":3,"sources":["C:/Users/kkwan_000/Desktop/git/2017110269/minsung/src/js/ui/shape.js"],"names":["Colorpicker","Range","Submenu","templateHtml","toInteger","assignmentForDestroy","defaultShapeStrokeValus","SHAPE_DEFAULT_OPTION","stroke","fill","strokeWidth","Shape","constructor","subMenuElement","locale","makeSvgIcon","menuBarPosition","usageStatistics","name","type","options","_els","shapeSelectButton","selector","shapeColorButton","strokeRange","slider","input","fillColorpicker","toggleDirection","strokeColorpicker","colorPickerControls","push","destroy","_removeEvent","addEvent","actions","eventHandler","shapeTypeSelected","_changeShapeHandler","bind","addEventListener","on","_changeStrokeRangeHandler","_changeFillColorHandler","_changeStrokeColorHandler","colorPickerChangeShow","removeEventListener","off","setShapeStatus","strokeColor","fillColor","value","color","setDrawingShape","changeStartMode","stopDrawingMode","changeStandbyMode","changeSelectableAll","classList","remove","setMaxStrokeValue","maxValue","strokeMaxValue","max","setStrokeValue","trigger","getStrokeValue","event","button","target","closest","discardSelection","shapeType","getButtonType","currentTarget","add","modeChange","isLast","changeShape"],"mappings":"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","sourcesContent":["import Colorpicker from './tools/colorpicker';\r\nimport Range from './tools/range';\r\nimport Submenu from './submenuBase';\r\nimport templateHtml from './template/submenu/shape';\r\nimport { toInteger, assignmentForDestroy } from '../util';\r\nimport { defaultShapeStrokeValus } from '../consts';\r\n\r\nconst SHAPE_DEFAULT_OPTION = {\r\n  stroke: '#ffbb3b',\r\n  fill: '',\r\n  strokeWidth: 3,\r\n};\r\n\r\n/**\r\n * Shape ui class\r\n * @class\r\n * @ignore\r\n */\r\nclass Shape extends Submenu {\r\n  constructor(subMenuElement, { locale, makeSvgIcon, menuBarPosition, usageStatistics }) {\r\n    super(subMenuElement, {\r\n      locale,\r\n      name: 'shape',\r\n      makeSvgIcon,\r\n      menuBarPosition,\r\n      templateHtml,\r\n      usageStatistics,\r\n    });\r\n    this.type = null;\r\n    this.options = SHAPE_DEFAULT_OPTION;\r\n\r\n    this._els = {\r\n      shapeSelectButton: this.selector('.tie-shape-button'),\r\n      shapeColorButton: this.selector('.tie-shape-color-button'),\r\n      strokeRange: new Range(\r\n        {\r\n          slider: this.selector('.tie-stroke-range'),\r\n          input: this.selector('.tie-stroke-range-value'),\r\n        },\r\n        defaultShapeStrokeValus\r\n      ),\r\n      fillColorpicker: new Colorpicker(\r\n        this.selector('.tie-color-fill'),\r\n        '',\r\n        this.toggleDirection,\r\n        this.usageStatistics\r\n      ),\r\n      strokeColorpicker: new Colorpicker(\r\n        this.selector('.tie-color-stroke'),\r\n        '#ffbb3b',\r\n        this.toggleDirection,\r\n        this.usageStatistics\r\n      ),\r\n    };\r\n\r\n    this.colorPickerControls.push(this._els.fillColorpicker);\r\n    this.colorPickerControls.push(this._els.strokeColorpicker);\r\n  }\r\n\r\n  /**\r\n   * Destroys the instance.\r\n   */\r\n  destroy() {\r\n    this._removeEvent();\r\n    this._els.strokeRange.destroy();\r\n    this._els.fillColorpicker.destroy();\r\n    this._els.strokeColorpicker.destroy();\r\n\r\n    assignmentForDestroy(this);\r\n  }\r\n\r\n  /**\r\n   * Add event for shape\r\n   * @param {Object} actions - actions for shape\r\n   *   @param {Function} actions.changeShape - change shape mode\r\n   *   @param {Function} actions.setDrawingShape - set dreawing shape\r\n   */\r\n  addEvent(actions) {\r\n    this.eventHandler.shapeTypeSelected = this._changeShapeHandler.bind(this);\r\n    this.actions = actions;\r\n\r\n    this._els.shapeSelectButton.addEventListener('click', this.eventHandler.shapeTypeSelected);\r\n    this._els.strokeRange.on('change', this._changeStrokeRangeHandler.bind(this));\r\n    this._els.fillColorpicker.on('change', this._changeFillColorHandler.bind(this));\r\n    this._els.strokeColorpicker.on('change', this._changeStrokeColorHandler.bind(this));\r\n    this._els.fillColorpicker.on('changeShow', this.colorPickerChangeShow.bind(this));\r\n    this._els.strokeColorpicker.on('changeShow', this.colorPickerChangeShow.bind(this));\r\n  }\r\n\r\n  /**\r\n   * Remove event\r\n   * @private\r\n   */\r\n  _removeEvent() {\r\n    this._els.shapeSelectButton.removeEventListener('click', this.eventHandler.shapeTypeSelected);\r\n    this._els.strokeRange.off();\r\n    this._els.fillColorpicker.off();\r\n    this._els.strokeColorpicker.off();\r\n  }\r\n\r\n  /**\r\n   * Set Shape status\r\n   * @param {Object} options - options of shape status\r\n   *   @param {string} strokeWidth - stroke width\r\n   *   @param {string} strokeColor - stroke color\r\n   *   @param {string} fillColor - fill color\r\n   */\r\n  setShapeStatus({ strokeWidth, strokeColor, fillColor }) {\r\n    this._els.strokeRange.value = strokeWidth;\r\n    this._els.strokeColorpicker.color = strokeColor;\r\n    this._els.fillColorpicker.color = fillColor;\r\n    this.options.stroke = strokeColor;\r\n    this.options.fill = fillColor;\r\n    this.options.strokeWidth = strokeWidth;\r\n\r\n    this.actions.setDrawingShape(this.type, { strokeWidth });\r\n  }\r\n\r\n  /**\r\n   * Executed when the menu starts.\r\n   */\r\n  changeStartMode() {\r\n    this.actions.stopDrawingMode();\r\n  }\r\n\r\n  /**\r\n   * Returns the menu to its default state.\r\n   */\r\n  changeStandbyMode() {\r\n    this.type = null;\r\n    this.actions.changeSelectableAll(true);\r\n    this._els.shapeSelectButton.classList.remove('circle');\r\n    this._els.shapeSelectButton.classList.remove('triangle');\r\n    this._els.shapeSelectButton.classList.remove('rect');\r\n  }\r\n\r\n  /**\r\n   * set range stroke max value\r\n   * @param {number} maxValue - expect max value for change\r\n   */\r\n  setMaxStrokeValue(maxValue) {\r\n    let strokeMaxValue = maxValue;\r\n    if (strokeMaxValue <= 0) {\r\n      strokeMaxValue = defaultShapeStrokeValus.max;\r\n    }\r\n    this._els.strokeRange.max = strokeMaxValue;\r\n  }\r\n\r\n  /**\r\n   * Set stroke value\r\n   * @param {number} value - expect value for strokeRange change\r\n   */\r\n  setStrokeValue(value) {\r\n    this._els.strokeRange.value = value;\r\n    this._els.strokeRange.trigger('change');\r\n  }\r\n\r\n  /**\r\n   * Get stroke value\r\n   * @returns {number} - stroke range value\r\n   */\r\n  getStrokeValue() {\r\n    return this._els.strokeRange.value;\r\n  }\r\n\r\n  /**\r\n   * Change icon color\r\n   * @param {object} event - add button event object\r\n   * @private\r\n   */\r\n  _changeShapeHandler(event) {\r\n    const button = event.target.closest('.tui-image-editor-button');\r\n    if (button) {\r\n      this.actions.stopDrawingMode();\r\n      this.actions.discardSelection();\r\n      const shapeType = this.getButtonType(button, ['circle', 'triangle', 'rect']);\r\n\r\n      if (this.type === shapeType) {\r\n        this.changeStandbyMode();\r\n\r\n        return;\r\n      }\r\n      this.changeStandbyMode();\r\n      this.type = shapeType;\r\n      event.currentTarget.classList.add(shapeType);\r\n      this.actions.changeSelectableAll(false);\r\n      this.actions.modeChange('shape');\r\n    }\r\n  }\r\n\r\n  /**\r\n   * Change stroke range\r\n   * @param {number} value - stroke range value\r\n   * @param {boolean} isLast - Is last change\r\n   * @private\r\n   */\r\n  _changeStrokeRangeHandler(value, isLast) {\r\n    this.options.strokeWidth = toInteger(value);\r\n    this.actions.changeShape(\r\n      {\r\n        strokeWidth: value,\r\n      },\r\n      !isLast\r\n    );\r\n\r\n    this.actions.setDrawingShape(this.type, this.options);\r\n  }\r\n\r\n  /**\r\n   * Change shape color\r\n   * @param {string} color - fill color\r\n   * @private\r\n   */\r\n  _changeFillColorHandler(color) {\r\n    color = color || 'transparent';\r\n    this.options.fill = color;\r\n    this.actions.changeShape({\r\n      fill: color,\r\n    });\r\n  }\r\n\r\n  /**\r\n   * Change shape stroke color\r\n   * @param {string} color - fill color\r\n   * @private\r\n   */\r\n  _changeStrokeColorHandler(color) {\r\n    color = color || 'transparent';\r\n    this.options.stroke = color;\r\n    this.actions.changeShape({\r\n      stroke: color,\r\n    });\r\n  }\r\n}\r\n\r\nexport default Shape;\r\n"]},"metadata":{},"sourceType":"module"}