6b393d5d5e540306cf7df76afcaa3db4.json
12.7 KB
{"ast":null,"code":"import { assignmentForDestroy, getRgb } from '../util';\nimport Colorpicker from './tools/colorpicker';\nimport Range from './tools/range';\nimport Submenu from './submenuBase';\nimport templateHtml from './template/submenu/draw';\nimport { defaultDrawRangeValus } from '../consts';\nconst DRAW_OPACITY = 0.7;\n/**\r\n * Draw ui class\r\n * @class\r\n * @ignore\r\n */\n\nclass Draw extends Submenu {\n constructor(subMenuElement, {\n locale,\n makeSvgIcon,\n menuBarPosition,\n usageStatistics\n }) {\n super(subMenuElement, {\n locale,\n name: 'draw',\n makeSvgIcon,\n menuBarPosition,\n templateHtml,\n usageStatistics\n });\n this._els = {\n lineSelectButton: this.selector('.tie-draw-line-select-button'),\n drawColorPicker: new Colorpicker(this.selector('.tie-draw-color'), '#00a9ff', this.toggleDirection, this.usageStatistics),\n drawRange: new Range({\n slider: this.selector('.tie-draw-range'),\n input: this.selector('.tie-draw-range-value')\n }, defaultDrawRangeValus)\n };\n this.type = null;\n this.color = this._els.drawColorPicker.color;\n this.width = this._els.drawRange.value;\n }\n /**\r\n * Destroys the instance.\r\n */\n\n\n destroy() {\n this._removeEvent();\n\n this._els.drawColorPicker.destroy();\n\n this._els.drawRange.destroy();\n\n assignmentForDestroy(this);\n }\n /**\r\n * Add event for draw\r\n * @param {Object} actions - actions for crop\r\n * @param {Function} actions.setDrawMode - set draw mode\r\n */\n\n\n addEvent(actions) {\n this.eventHandler.changeDrawType = this._changeDrawType.bind(this);\n this.actions = actions;\n\n this._els.lineSelectButton.addEventListener('click', this.eventHandler.changeDrawType);\n\n this._els.drawColorPicker.on('change', this._changeDrawColor.bind(this));\n\n this._els.drawRange.on('change', this._changeDrawRange.bind(this));\n }\n /**\r\n * Remove event\r\n * @private\r\n */\n\n\n _removeEvent() {\n this._els.lineSelectButton.removeEventListener('click', this.eventHandler.changeDrawType);\n\n this._els.drawColorPicker.off();\n\n this._els.drawRange.off();\n }\n /**\r\n * set draw mode - action runner\r\n */\n\n\n setDrawMode() {\n this.actions.setDrawMode(this.type, {\n width: this.width,\n color: getRgb(this.color, DRAW_OPACITY)\n });\n }\n /**\r\n * Returns the menu to its default state.\r\n */\n\n\n changeStandbyMode() {\n this.type = null;\n this.actions.stopDrawingMode();\n this.actions.changeSelectableAll(true);\n\n this._els.lineSelectButton.classList.remove('free');\n\n this._els.lineSelectButton.classList.remove('line');\n }\n /**\r\n * Executed when the menu starts.\r\n */\n\n\n changeStartMode() {\n this.type = 'free';\n\n this._els.lineSelectButton.classList.add('free');\n\n this.setDrawMode();\n }\n /**\r\n * Change draw type event\r\n * @param {object} event - line select event\r\n * @private\r\n */\n\n\n _changeDrawType(event) {\n const button = event.target.closest('.tui-image-editor-button');\n\n if (button) {\n const lineType = this.getButtonType(button, ['free', 'line']);\n this.actions.discardSelection();\n\n if (this.type === lineType) {\n this.changeStandbyMode();\n return;\n }\n\n this.changeStandbyMode();\n this.type = lineType;\n\n this._els.lineSelectButton.classList.add(lineType);\n\n this.setDrawMode();\n }\n }\n /**\r\n * Change drawing color\r\n * @param {string} color - select drawing color\r\n * @private\r\n */\n\n\n _changeDrawColor(color) {\n this.color = color || 'transparent';\n\n if (!this.type) {\n this.changeStartMode();\n } else {\n this.setDrawMode();\n }\n }\n /**\r\n * Change drawing Range\r\n * @param {number} value - select drawing range\r\n * @private\r\n */\n\n\n _changeDrawRange(value) {\n this.width = value;\n\n if (!this.type) {\n this.changeStartMode();\n } else {\n this.setDrawMode();\n }\n }\n\n}\n\nexport default Draw;","map":{"version":3,"sources":["C:/Users/kkwan_000/Desktop/git/2017110269/minsung/src/js/ui/draw.js"],"names":["assignmentForDestroy","getRgb","Colorpicker","Range","Submenu","templateHtml","defaultDrawRangeValus","DRAW_OPACITY","Draw","constructor","subMenuElement","locale","makeSvgIcon","menuBarPosition","usageStatistics","name","_els","lineSelectButton","selector","drawColorPicker","toggleDirection","drawRange","slider","input","type","color","width","value","destroy","_removeEvent","addEvent","actions","eventHandler","changeDrawType","_changeDrawType","bind","addEventListener","on","_changeDrawColor","_changeDrawRange","removeEventListener","off","setDrawMode","changeStandbyMode","stopDrawingMode","changeSelectableAll","classList","remove","changeStartMode","add","event","button","target","closest","lineType","getButtonType","discardSelection"],"mappings":"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","sourcesContent":["import { assignmentForDestroy, getRgb } from '../util';\r\nimport Colorpicker from './tools/colorpicker';\r\nimport Range from './tools/range';\r\nimport Submenu from './submenuBase';\r\nimport templateHtml from './template/submenu/draw';\r\nimport { defaultDrawRangeValus } from '../consts';\r\nconst DRAW_OPACITY = 0.7;\r\n\r\n/**\r\n * Draw ui class\r\n * @class\r\n * @ignore\r\n */\r\nclass Draw extends Submenu {\r\n constructor(subMenuElement, { locale, makeSvgIcon, menuBarPosition, usageStatistics }) {\r\n super(subMenuElement, {\r\n locale,\r\n name: 'draw',\r\n makeSvgIcon,\r\n menuBarPosition,\r\n templateHtml,\r\n usageStatistics,\r\n });\r\n\r\n this._els = {\r\n lineSelectButton: this.selector('.tie-draw-line-select-button'),\r\n drawColorPicker: new Colorpicker(\r\n this.selector('.tie-draw-color'),\r\n '#00a9ff',\r\n this.toggleDirection,\r\n this.usageStatistics\r\n ),\r\n drawRange: new Range(\r\n {\r\n slider: this.selector('.tie-draw-range'),\r\n input: this.selector('.tie-draw-range-value'),\r\n },\r\n defaultDrawRangeValus\r\n ),\r\n };\r\n\r\n this.type = null;\r\n this.color = this._els.drawColorPicker.color;\r\n this.width = this._els.drawRange.value;\r\n }\r\n\r\n /**\r\n * Destroys the instance.\r\n */\r\n destroy() {\r\n this._removeEvent();\r\n this._els.drawColorPicker.destroy();\r\n this._els.drawRange.destroy();\r\n\r\n assignmentForDestroy(this);\r\n }\r\n\r\n /**\r\n * Add event for draw\r\n * @param {Object} actions - actions for crop\r\n * @param {Function} actions.setDrawMode - set draw mode\r\n */\r\n addEvent(actions) {\r\n this.eventHandler.changeDrawType = this._changeDrawType.bind(this);\r\n\r\n this.actions = actions;\r\n this._els.lineSelectButton.addEventListener('click', this.eventHandler.changeDrawType);\r\n this._els.drawColorPicker.on('change', this._changeDrawColor.bind(this));\r\n this._els.drawRange.on('change', this._changeDrawRange.bind(this));\r\n }\r\n\r\n /**\r\n * Remove event\r\n * @private\r\n */\r\n _removeEvent() {\r\n this._els.lineSelectButton.removeEventListener('click', this.eventHandler.changeDrawType);\r\n this._els.drawColorPicker.off();\r\n this._els.drawRange.off();\r\n }\r\n\r\n /**\r\n * set draw mode - action runner\r\n */\r\n setDrawMode() {\r\n this.actions.setDrawMode(this.type, {\r\n width: this.width,\r\n color: getRgb(this.color, DRAW_OPACITY),\r\n });\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.stopDrawingMode();\r\n this.actions.changeSelectableAll(true);\r\n this._els.lineSelectButton.classList.remove('free');\r\n this._els.lineSelectButton.classList.remove('line');\r\n }\r\n\r\n /**\r\n * Executed when the menu starts.\r\n */\r\n changeStartMode() {\r\n this.type = 'free';\r\n this._els.lineSelectButton.classList.add('free');\r\n this.setDrawMode();\r\n }\r\n\r\n /**\r\n * Change draw type event\r\n * @param {object} event - line select event\r\n * @private\r\n */\r\n _changeDrawType(event) {\r\n const button = event.target.closest('.tui-image-editor-button');\r\n if (button) {\r\n const lineType = this.getButtonType(button, ['free', 'line']);\r\n this.actions.discardSelection();\r\n\r\n if (this.type === lineType) {\r\n this.changeStandbyMode();\r\n\r\n return;\r\n }\r\n\r\n this.changeStandbyMode();\r\n this.type = lineType;\r\n this._els.lineSelectButton.classList.add(lineType);\r\n this.setDrawMode();\r\n }\r\n }\r\n\r\n /**\r\n * Change drawing color\r\n * @param {string} color - select drawing color\r\n * @private\r\n */\r\n _changeDrawColor(color) {\r\n this.color = color || 'transparent';\r\n if (!this.type) {\r\n this.changeStartMode();\r\n } else {\r\n this.setDrawMode();\r\n }\r\n }\r\n\r\n /**\r\n * Change drawing Range\r\n * @param {number} value - select drawing range\r\n * @private\r\n */\r\n _changeDrawRange(value) {\r\n this.width = value;\r\n if (!this.type) {\r\n this.changeStartMode();\r\n } else {\r\n this.setDrawMode();\r\n }\r\n }\r\n}\r\n\r\nexport default Draw;\r\n"]},"metadata":{},"sourceType":"module"}