fdc0fc6586e1a4c1598a0482ae8ee91a.json
20 KB
{"ast":null,"code":"import { assignmentForDestroy } from '../util';\nimport Range from './tools/range';\nimport Colorpicker from './tools/colorpicker';\nimport Submenu from './submenuBase';\nimport templateHtml from './template/submenu/text';\nimport { defaultTextRangeValus } from '../consts';\n/**\r\n * Crop ui class\r\n * @class\r\n * @ignore\r\n */\n\nexport default class Text extends Submenu {\n constructor(subMenuElement, {\n locale,\n makeSvgIcon,\n menuBarPosition,\n usageStatistics\n }) {\n super(subMenuElement, {\n locale,\n name: 'text',\n makeSvgIcon,\n menuBarPosition,\n templateHtml,\n usageStatistics\n });\n this.effect = {\n bold: false,\n italic: false,\n underline: false\n };\n this.align = 'left';\n this._els = {\n textEffectButton: this.selector('.tie-text-effect-button'),\n textAlignButton: this.selector('.tie-text-align-button'),\n textColorpicker: new Colorpicker(this.selector('.tie-text-color'), '#ffbb3b', this.toggleDirection, this.usageStatistics),\n textRange: new Range({\n slider: this.selector('.tie-text-range'),\n input: this.selector('.tie-text-range-value')\n }, defaultTextRangeValus)\n };\n }\n /**\r\n * Destroys the instance.\r\n */\n\n\n destroy() {\n this._removeEvent();\n\n this._els.textColorpicker.destroy();\n\n this._els.textRange.destroy();\n\n assignmentForDestroy(this);\n }\n /**\r\n * Add event for text\r\n * @param {Object} actions - actions for text\r\n * @param {Function} actions.changeTextStyle - change text style\r\n */\n\n\n addEvent(actions) {\n const setTextEffect = this._setTextEffectHandler.bind(this);\n\n const setTextAlign = this._setTextAlignHandler.bind(this);\n\n this.eventHandler = {\n setTextEffect,\n setTextAlign\n };\n this.actions = actions;\n\n this._els.textEffectButton.addEventListener('click', setTextEffect);\n\n this._els.textAlignButton.addEventListener('click', setTextAlign);\n\n this._els.textRange.on('change', this._changeTextRnageHandler.bind(this));\n\n this._els.textColorpicker.on('change', this._changeColorHandler.bind(this));\n }\n /**\r\n * Remove event\r\n * @private\r\n */\n\n\n _removeEvent() {\n const {\n setTextEffect,\n setTextAlign\n } = this.eventHandler;\n\n this._els.textEffectButton.removeEventListener('click', setTextEffect);\n\n this._els.textAlignButton.removeEventListener('click', setTextAlign);\n\n this._els.textRange.off();\n\n this._els.textColorpicker.off();\n }\n /**\r\n * Returns the menu to its default state.\r\n */\n\n\n changeStandbyMode() {\n this.actions.stopDrawingMode();\n }\n /**\r\n * Executed when the menu starts.\r\n */\n\n\n changeStartMode() {\n this.actions.modeChange('text');\n }\n\n set textColor(color) {\n this._els.textColorpicker.color = color;\n }\n /**\r\n * Get text color\r\n * @returns {string} - text color\r\n */\n\n\n get textColor() {\n return this._els.textColorpicker.color;\n }\n /**\r\n * Get text size\r\n * @returns {string} - text size\r\n */\n\n\n get fontSize() {\n return this._els.textRange.value;\n }\n /**\r\n * Set text size\r\n * @param {Number} value - text size\r\n */\n\n\n set fontSize(value) {\n this._els.textRange.value = value;\n }\n /**\r\n * get font style\r\n * @returns {string} - font style\r\n */\n\n\n get fontStyle() {\n return this.effect.italic ? 'italic' : 'normal';\n }\n /**\r\n * get font weight\r\n * @returns {string} - font weight\r\n */\n\n\n get fontWeight() {\n return this.effect.bold ? 'bold' : 'normal';\n }\n /**\r\n * get text underline text underline\r\n * @returns {boolean} - true or false\r\n */\n\n\n get underline() {\n return this.effect.underline;\n }\n\n setTextStyleStateOnAction(textStyle = {}) {\n const {\n fill,\n fontSize,\n fontStyle,\n fontWeight,\n textDecoration,\n textAlign\n } = textStyle;\n this.textColor = fill;\n this.fontSize = fontSize;\n this.setEffactState('italic', fontStyle);\n this.setEffactState('bold', fontWeight);\n this.setEffactState('underline', textDecoration);\n this.setAlignState(textAlign);\n }\n\n setEffactState(effactName, value) {\n const effactValue = value === 'italic' || value === 'bold' || value === 'underline';\n\n const button = this._els.textEffectButton.querySelector(`.tui-image-editor-button.${effactName}`);\n\n this.effect[effactName] = effactValue;\n button.classList[effactValue ? 'add' : 'remove']('active');\n }\n\n setAlignState(value) {\n const button = this._els.textAlignButton;\n button.classList.remove(this.align);\n button.classList.add(value);\n this.align = value;\n }\n /**\r\n * text effect set handler\r\n * @param {object} event - add button event object\r\n * @private\r\n */\n\n\n _setTextEffectHandler(event) {\n const button = event.target.closest('.tui-image-editor-button');\n const [styleType] = button.className.match(/(bold|italic|underline)/);\n const styleObj = {\n bold: {\n fontWeight: 'bold'\n },\n italic: {\n fontStyle: 'italic'\n },\n underline: {\n textDecoration: 'underline'\n }\n }[styleType];\n this.effect[styleType] = !this.effect[styleType];\n button.classList.toggle('active');\n this.actions.changeTextStyle(styleObj);\n }\n /**\r\n * text effect set handler\r\n * @param {object} event - add button event object\r\n * @private\r\n */\n\n\n _setTextAlignHandler(event) {\n const button = event.target.closest('.tui-image-editor-button');\n\n if (button) {\n const styleType = this.getButtonType(button, ['left', 'center', 'right']);\n event.currentTarget.classList.remove(this.align);\n\n if (this.align !== styleType) {\n event.currentTarget.classList.add(styleType);\n }\n\n this.actions.changeTextStyle({\n textAlign: styleType\n });\n this.align = styleType;\n }\n }\n /**\r\n * text align set handler\r\n * @param {number} value - range value\r\n * @param {boolean} isLast - Is last change\r\n * @private\r\n */\n\n\n _changeTextRnageHandler(value, isLast) {\n this.actions.changeTextStyle({\n fontSize: value\n }, !isLast);\n }\n /**\r\n * change color handler\r\n * @param {string} color - change color string\r\n * @private\r\n */\n\n\n _changeColorHandler(color) {\n color = color || 'transparent';\n this.actions.changeTextStyle({\n fill: color\n });\n }\n\n}","map":{"version":3,"sources":["C:/Users/kkwan_000/Desktop/git/2017110269/minsung/src/js/ui/text.js"],"names":["assignmentForDestroy","Range","Colorpicker","Submenu","templateHtml","defaultTextRangeValus","Text","constructor","subMenuElement","locale","makeSvgIcon","menuBarPosition","usageStatistics","name","effect","bold","italic","underline","align","_els","textEffectButton","selector","textAlignButton","textColorpicker","toggleDirection","textRange","slider","input","destroy","_removeEvent","addEvent","actions","setTextEffect","_setTextEffectHandler","bind","setTextAlign","_setTextAlignHandler","eventHandler","addEventListener","on","_changeTextRnageHandler","_changeColorHandler","removeEventListener","off","changeStandbyMode","stopDrawingMode","changeStartMode","modeChange","textColor","color","fontSize","value","fontStyle","fontWeight","setTextStyleStateOnAction","textStyle","fill","textDecoration","textAlign","setEffactState","setAlignState","effactName","effactValue","button","querySelector","classList","remove","add","event","target","closest","styleType","className","match","styleObj","toggle","changeTextStyle","getButtonType","currentTarget","isLast"],"mappings":"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","sourcesContent":["import { assignmentForDestroy } from '../util';\r\nimport Range from './tools/range';\r\nimport Colorpicker from './tools/colorpicker';\r\nimport Submenu from './submenuBase';\r\nimport templateHtml from './template/submenu/text';\r\nimport { defaultTextRangeValus } from '../consts';\r\n\r\n/**\r\n * Crop ui class\r\n * @class\r\n * @ignore\r\n */\r\nexport default class Text extends Submenu {\r\n constructor(subMenuElement, { locale, makeSvgIcon, menuBarPosition, usageStatistics }) {\r\n super(subMenuElement, {\r\n locale,\r\n name: 'text',\r\n makeSvgIcon,\r\n menuBarPosition,\r\n templateHtml,\r\n usageStatistics,\r\n });\r\n this.effect = {\r\n bold: false,\r\n italic: false,\r\n underline: false,\r\n };\r\n this.align = 'left';\r\n this._els = {\r\n textEffectButton: this.selector('.tie-text-effect-button'),\r\n textAlignButton: this.selector('.tie-text-align-button'),\r\n textColorpicker: new Colorpicker(\r\n this.selector('.tie-text-color'),\r\n '#ffbb3b',\r\n this.toggleDirection,\r\n this.usageStatistics\r\n ),\r\n textRange: new Range(\r\n {\r\n slider: this.selector('.tie-text-range'),\r\n input: this.selector('.tie-text-range-value'),\r\n },\r\n defaultTextRangeValus\r\n ),\r\n };\r\n }\r\n\r\n /**\r\n * Destroys the instance.\r\n */\r\n destroy() {\r\n this._removeEvent();\r\n this._els.textColorpicker.destroy();\r\n this._els.textRange.destroy();\r\n\r\n assignmentForDestroy(this);\r\n }\r\n\r\n /**\r\n * Add event for text\r\n * @param {Object} actions - actions for text\r\n * @param {Function} actions.changeTextStyle - change text style\r\n */\r\n addEvent(actions) {\r\n const setTextEffect = this._setTextEffectHandler.bind(this);\r\n const setTextAlign = this._setTextAlignHandler.bind(this);\r\n\r\n this.eventHandler = {\r\n setTextEffect,\r\n setTextAlign,\r\n };\r\n\r\n this.actions = actions;\r\n this._els.textEffectButton.addEventListener('click', setTextEffect);\r\n this._els.textAlignButton.addEventListener('click', setTextAlign);\r\n this._els.textRange.on('change', this._changeTextRnageHandler.bind(this));\r\n this._els.textColorpicker.on('change', this._changeColorHandler.bind(this));\r\n }\r\n\r\n /**\r\n * Remove event\r\n * @private\r\n */\r\n _removeEvent() {\r\n const { setTextEffect, setTextAlign } = this.eventHandler;\r\n\r\n this._els.textEffectButton.removeEventListener('click', setTextEffect);\r\n this._els.textAlignButton.removeEventListener('click', setTextAlign);\r\n this._els.textRange.off();\r\n this._els.textColorpicker.off();\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 }\r\n\r\n /**\r\n * Executed when the menu starts.\r\n */\r\n changeStartMode() {\r\n this.actions.modeChange('text');\r\n }\r\n\r\n set textColor(color) {\r\n this._els.textColorpicker.color = color;\r\n }\r\n\r\n /**\r\n * Get text color\r\n * @returns {string} - text color\r\n */\r\n get textColor() {\r\n return this._els.textColorpicker.color;\r\n }\r\n\r\n /**\r\n * Get text size\r\n * @returns {string} - text size\r\n */\r\n get fontSize() {\r\n return this._els.textRange.value;\r\n }\r\n\r\n /**\r\n * Set text size\r\n * @param {Number} value - text size\r\n */\r\n set fontSize(value) {\r\n this._els.textRange.value = value;\r\n }\r\n\r\n /**\r\n * get font style\r\n * @returns {string} - font style\r\n */\r\n get fontStyle() {\r\n return this.effect.italic ? 'italic' : 'normal';\r\n }\r\n\r\n /**\r\n * get font weight\r\n * @returns {string} - font weight\r\n */\r\n get fontWeight() {\r\n return this.effect.bold ? 'bold' : 'normal';\r\n }\r\n\r\n /**\r\n * get text underline text underline\r\n * @returns {boolean} - true or false\r\n */\r\n get underline() {\r\n return this.effect.underline;\r\n }\r\n\r\n setTextStyleStateOnAction(textStyle = {}) {\r\n const { fill, fontSize, fontStyle, fontWeight, textDecoration, textAlign } = textStyle;\r\n\r\n this.textColor = fill;\r\n this.fontSize = fontSize;\r\n this.setEffactState('italic', fontStyle);\r\n this.setEffactState('bold', fontWeight);\r\n this.setEffactState('underline', textDecoration);\r\n this.setAlignState(textAlign);\r\n }\r\n\r\n setEffactState(effactName, value) {\r\n const effactValue = value === 'italic' || value === 'bold' || value === 'underline';\r\n const button = this._els.textEffectButton.querySelector(\r\n `.tui-image-editor-button.${effactName}`\r\n );\r\n\r\n this.effect[effactName] = effactValue;\r\n\r\n button.classList[effactValue ? 'add' : 'remove']('active');\r\n }\r\n\r\n setAlignState(value) {\r\n const button = this._els.textAlignButton;\r\n button.classList.remove(this.align);\r\n button.classList.add(value);\r\n this.align = value;\r\n }\r\n\r\n /**\r\n * text effect set handler\r\n * @param {object} event - add button event object\r\n * @private\r\n */\r\n _setTextEffectHandler(event) {\r\n const button = event.target.closest('.tui-image-editor-button');\r\n const [styleType] = button.className.match(/(bold|italic|underline)/);\r\n const styleObj = {\r\n bold: { fontWeight: 'bold' },\r\n italic: { fontStyle: 'italic' },\r\n underline: { textDecoration: 'underline' },\r\n }[styleType];\r\n\r\n this.effect[styleType] = !this.effect[styleType];\r\n button.classList.toggle('active');\r\n this.actions.changeTextStyle(styleObj);\r\n }\r\n\r\n /**\r\n * text effect set handler\r\n * @param {object} event - add button event object\r\n * @private\r\n */\r\n _setTextAlignHandler(event) {\r\n const button = event.target.closest('.tui-image-editor-button');\r\n if (button) {\r\n const styleType = this.getButtonType(button, ['left', 'center', 'right']);\r\n\r\n event.currentTarget.classList.remove(this.align);\r\n if (this.align !== styleType) {\r\n event.currentTarget.classList.add(styleType);\r\n }\r\n this.actions.changeTextStyle({ textAlign: styleType });\r\n\r\n this.align = styleType;\r\n }\r\n }\r\n\r\n /**\r\n * text align set handler\r\n * @param {number} value - range value\r\n * @param {boolean} isLast - Is last change\r\n * @private\r\n */\r\n _changeTextRnageHandler(value, isLast) {\r\n this.actions.changeTextStyle(\r\n {\r\n fontSize: value,\r\n },\r\n !isLast\r\n );\r\n }\r\n\r\n /**\r\n * change color handler\r\n * @param {string} color - change color string\r\n * @private\r\n */\r\n _changeColorHandler(color) {\r\n color = color || 'transparent';\r\n this.actions.changeTextStyle({\r\n fill: color,\r\n });\r\n }\r\n}\r\n"]},"metadata":{},"sourceType":"module"}