2ea01b87553a7e3caa0f7f84f3b224c6.json 11.4 KB
{"ast":null,"code":"import snippet from 'tui-code-snippet';\nimport Submenu from './submenuBase';\nimport { assignmentForDestroy } from '../util';\nimport templateHtml from './template/submenu/crop';\n/**\r\n * Crop ui class\r\n * @class\r\n * @ignore\r\n */\n\nclass Crop extends Submenu {\n  constructor(subMenuElement, {\n    locale,\n    makeSvgIcon,\n    menuBarPosition,\n    usageStatistics\n  }) {\n    super(subMenuElement, {\n      locale,\n      name: 'crop',\n      makeSvgIcon,\n      menuBarPosition,\n      templateHtml,\n      usageStatistics\n    });\n    this.status = 'active';\n    this._els = {\n      apply: this.selector('.tie-crop-button .apply'),\n      cancel: this.selector('.tie-crop-button .cancel'),\n      preset: this.selector('.tie-crop-preset-button')\n    };\n    this.defaultPresetButton = this._els.preset.querySelector('.preset-none');\n  }\n  /**\r\n   * Destroys the instance.\r\n   */\n\n\n  destroy() {\n    this._removeEvent();\n\n    assignmentForDestroy(this);\n  }\n  /**\r\n   * Add event for crop\r\n   * @param {Object} actions - actions for crop\r\n   *   @param {Function} actions.crop - crop action\r\n   *   @param {Function} actions.cancel - cancel action\r\n   *   @param {Function} actions.preset - draw rectzone at a predefined ratio\r\n   */\n\n\n  addEvent(actions) {\n    const apply = this._applyEventHandler.bind(this);\n\n    const cancel = this._cancelEventHandler.bind(this);\n\n    const cropzonePreset = this._cropzonePresetEventHandler.bind(this);\n\n    this.eventHandler = {\n      apply,\n      cancel,\n      cropzonePreset\n    };\n    this.actions = actions;\n\n    this._els.apply.addEventListener('click', apply);\n\n    this._els.cancel.addEventListener('click', cancel);\n\n    this._els.preset.addEventListener('click', cropzonePreset);\n  }\n  /**\r\n   * Remove event\r\n   * @private\r\n   */\n\n\n  _removeEvent() {\n    this._els.apply.removeEventListener('click', this.eventHandler.apply);\n\n    this._els.cancel.removeEventListener('click', this.eventHandler.cancel);\n\n    this._els.preset.removeEventListener('click', this.eventHandler.cropzonePreset);\n  }\n\n  _applyEventHandler() {\n    this.actions.crop();\n\n    this._els.apply.classList.remove('active');\n  }\n\n  _cancelEventHandler() {\n    this.actions.cancel();\n\n    this._els.apply.classList.remove('active');\n  }\n\n  _cropzonePresetEventHandler(event) {\n    const button = event.target.closest('.tui-image-editor-button.preset');\n\n    if (button) {\n      const [presetType] = button.className.match(/preset-[^\\s]+/);\n\n      this._setPresetButtonActive(button);\n\n      this.actions.preset(presetType);\n    }\n  }\n  /**\r\n   * Executed when the menu starts.\r\n   */\n\n\n  changeStartMode() {\n    this.actions.modeChange('crop');\n  }\n  /**\r\n   * Returns the menu to its default state.\r\n   */\n\n\n  changeStandbyMode() {\n    this.actions.stopDrawingMode();\n\n    this._setPresetButtonActive();\n  }\n  /**\r\n   * Change apply button status\r\n   * @param {Boolean} enableStatus - apply button status\r\n   */\n\n\n  changeApplyButtonStatus(enableStatus) {\n    if (enableStatus) {\n      this._els.apply.classList.add('active');\n    } else {\n      this._els.apply.classList.remove('active');\n    }\n  }\n  /**\r\n   * Set preset button to active status\r\n   * @param {HTMLElement} button - event target element\r\n   * @private\r\n   */\n\n\n  _setPresetButtonActive(button = this.defaultPresetButton) {\n    snippet.forEach([].slice.call(this._els.preset.querySelectorAll('.preset')), presetButton => {\n      presetButton.classList.remove('active');\n    });\n\n    if (button) {\n      button.classList.add('active');\n    }\n  }\n\n}\n\nexport default Crop;","map":{"version":3,"sources":["C:/Users/kkwan_000/Desktop/git/2017110269/minsung/src/js/ui/crop.js"],"names":["snippet","Submenu","assignmentForDestroy","templateHtml","Crop","constructor","subMenuElement","locale","makeSvgIcon","menuBarPosition","usageStatistics","name","status","_els","apply","selector","cancel","preset","defaultPresetButton","querySelector","destroy","_removeEvent","addEvent","actions","_applyEventHandler","bind","_cancelEventHandler","cropzonePreset","_cropzonePresetEventHandler","eventHandler","addEventListener","removeEventListener","crop","classList","remove","event","button","target","closest","presetType","className","match","_setPresetButtonActive","changeStartMode","modeChange","changeStandbyMode","stopDrawingMode","changeApplyButtonStatus","enableStatus","add","forEach","slice","call","querySelectorAll","presetButton"],"mappings":"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","sourcesContent":["import snippet from 'tui-code-snippet';\r\nimport Submenu from './submenuBase';\r\nimport { assignmentForDestroy } from '../util';\r\nimport templateHtml from './template/submenu/crop';\r\n\r\n/**\r\n * Crop ui class\r\n * @class\r\n * @ignore\r\n */\r\nclass Crop extends Submenu {\r\n  constructor(subMenuElement, { locale, makeSvgIcon, menuBarPosition, usageStatistics }) {\r\n    super(subMenuElement, {\r\n      locale,\r\n      name: 'crop',\r\n      makeSvgIcon,\r\n      menuBarPosition,\r\n      templateHtml,\r\n      usageStatistics,\r\n    });\r\n\r\n    this.status = 'active';\r\n\r\n    this._els = {\r\n      apply: this.selector('.tie-crop-button .apply'),\r\n      cancel: this.selector('.tie-crop-button .cancel'),\r\n      preset: this.selector('.tie-crop-preset-button'),\r\n    };\r\n\r\n    this.defaultPresetButton = this._els.preset.querySelector('.preset-none');\r\n  }\r\n\r\n  /**\r\n   * Destroys the instance.\r\n   */\r\n  destroy() {\r\n    this._removeEvent();\r\n\r\n    assignmentForDestroy(this);\r\n  }\r\n\r\n  /**\r\n   * Add event for crop\r\n   * @param {Object} actions - actions for crop\r\n   *   @param {Function} actions.crop - crop action\r\n   *   @param {Function} actions.cancel - cancel action\r\n   *   @param {Function} actions.preset - draw rectzone at a predefined ratio\r\n   */\r\n  addEvent(actions) {\r\n    const apply = this._applyEventHandler.bind(this);\r\n    const cancel = this._cancelEventHandler.bind(this);\r\n    const cropzonePreset = this._cropzonePresetEventHandler.bind(this);\r\n\r\n    this.eventHandler = {\r\n      apply,\r\n      cancel,\r\n      cropzonePreset,\r\n    };\r\n\r\n    this.actions = actions;\r\n    this._els.apply.addEventListener('click', apply);\r\n    this._els.cancel.addEventListener('click', cancel);\r\n    this._els.preset.addEventListener('click', cropzonePreset);\r\n  }\r\n\r\n  /**\r\n   * Remove event\r\n   * @private\r\n   */\r\n  _removeEvent() {\r\n    this._els.apply.removeEventListener('click', this.eventHandler.apply);\r\n    this._els.cancel.removeEventListener('click', this.eventHandler.cancel);\r\n    this._els.preset.removeEventListener('click', this.eventHandler.cropzonePreset);\r\n  }\r\n\r\n  _applyEventHandler() {\r\n    this.actions.crop();\r\n    this._els.apply.classList.remove('active');\r\n  }\r\n\r\n  _cancelEventHandler() {\r\n    this.actions.cancel();\r\n    this._els.apply.classList.remove('active');\r\n  }\r\n\r\n  _cropzonePresetEventHandler(event) {\r\n    const button = event.target.closest('.tui-image-editor-button.preset');\r\n    if (button) {\r\n      const [presetType] = button.className.match(/preset-[^\\s]+/);\r\n\r\n      this._setPresetButtonActive(button);\r\n      this.actions.preset(presetType);\r\n    }\r\n  }\r\n\r\n  /**\r\n   * Executed when the menu starts.\r\n   */\r\n  changeStartMode() {\r\n    this.actions.modeChange('crop');\r\n  }\r\n\r\n  /**\r\n   * Returns the menu to its default state.\r\n   */\r\n  changeStandbyMode() {\r\n    this.actions.stopDrawingMode();\r\n    this._setPresetButtonActive();\r\n  }\r\n\r\n  /**\r\n   * Change apply button status\r\n   * @param {Boolean} enableStatus - apply button status\r\n   */\r\n  changeApplyButtonStatus(enableStatus) {\r\n    if (enableStatus) {\r\n      this._els.apply.classList.add('active');\r\n    } else {\r\n      this._els.apply.classList.remove('active');\r\n    }\r\n  }\r\n\r\n  /**\r\n   * Set preset button to active status\r\n   * @param {HTMLElement} button - event target element\r\n   * @private\r\n   */\r\n  _setPresetButtonActive(button = this.defaultPresetButton) {\r\n    snippet.forEach([].slice.call(this._els.preset.querySelectorAll('.preset')), (presetButton) => {\r\n      presetButton.classList.remove('active');\r\n    });\r\n\r\n    if (button) {\r\n      button.classList.add('active');\r\n    }\r\n  }\r\n}\r\n\r\nexport default Crop;\r\n"]},"metadata":{},"sourceType":"module"}