4378250be65d87733039c61338d08fbe.json
18.1 KB
{"ast":null,"code":"/**\r\n * @author NHN Ent. FE Development Team <dl_javascript@nhn.com>\r\n * @fileoverview Add icon module\r\n */\nimport fabric from 'fabric';\nimport snippet from 'tui-code-snippet';\nimport { Promise } from '../util';\nimport Component from '../interface/component';\nimport { eventNames as events, rejectMessages, componentNames, fObjectOptions } from '../consts';\nconst pathMap = {\n arrow: 'M 0 90 H 105 V 120 L 160 60 L 105 0 V 30 H 0 Z',\n cancel: 'M 0 30 L 30 60 L 0 90 L 30 120 L 60 90 L 90 120 L 120 90 ' + 'L 90 60 L 120 30 L 90 0 L 60 30 L 30 0 Z'\n};\n/**\r\n * Icon\r\n * @class Icon\r\n * @param {Graphics} graphics - Graphics instance\r\n * @extends {Component}\r\n * @ignore\r\n */\n\nclass Icon extends Component {\n constructor(graphics) {\n super(componentNames.ICON, graphics);\n /**\r\n * Default icon color\r\n * @type {string}\r\n */\n\n this._oColor = '#000000';\n /**\r\n * Path value of each icon type\r\n * @type {Object}\r\n */\n\n this._pathMap = pathMap;\n /**\r\n * Type of the drawing icon\r\n * @type {string}\r\n * @private\r\n */\n\n this._type = null;\n /**\r\n * Color of the drawing icon\r\n * @type {string}\r\n * @private\r\n */\n\n this._iconColor = null;\n /**\r\n * Event handler list\r\n * @type {Object}\r\n * @private\r\n */\n\n this._handlers = {\n mousedown: this._onFabricMouseDown.bind(this),\n mousemove: this._onFabricMouseMove.bind(this),\n mouseup: this._onFabricMouseUp.bind(this)\n };\n }\n /**\r\n * Set states of the current drawing shape\r\n * @ignore\r\n * @param {string} type - Icon type ('arrow', 'cancel', custom icon name)\r\n * @param {string} iconColor - Icon foreground color\r\n */\n\n\n setStates(type, iconColor) {\n this._type = type;\n this._iconColor = iconColor;\n }\n /**\r\n * Start to draw the icon on canvas\r\n * @ignore\r\n */\n\n\n start() {\n const canvas = this.getCanvas();\n canvas.selection = false;\n canvas.on('mouse:down', this._handlers.mousedown);\n }\n /**\r\n * End to draw the icon on canvas\r\n * @ignore\r\n */\n\n\n end() {\n const canvas = this.getCanvas();\n canvas.selection = true;\n canvas.off({\n 'mouse:down': this._handlers.mousedown\n });\n }\n /**\r\n * Add icon\r\n * @param {string} type - Icon type\r\n * @param {Object} options - Icon options\r\n * @param {string} [options.fill] - Icon foreground color\r\n * @param {string} [options.left] - Icon x position\r\n * @param {string} [options.top] - Icon y position\r\n * @returns {Promise}\r\n */\n\n\n add(type, options) {\n return new Promise((resolve, reject) => {\n const canvas = this.getCanvas();\n const path = this._pathMap[type];\n const selectionStyle = fObjectOptions.SELECTION_STYLE;\n const icon = path ? this._createIcon(path) : null;\n this._icon = icon;\n\n if (!icon) {\n reject(rejectMessages.invalidParameters);\n }\n\n icon.set(snippet.extend({\n type: 'icon',\n fill: this._oColor\n }, selectionStyle, options, this.graphics.controlStyle));\n canvas.add(icon).setActiveObject(icon);\n resolve(this.graphics.createObjectProperties(icon));\n });\n }\n /**\r\n * Register icon paths\r\n * @param {{key: string, value: string}} pathInfos - Path infos\r\n */\n\n\n registerPaths(pathInfos) {\n snippet.forEach(pathInfos, (path, type) => {\n this._pathMap[type] = path;\n }, this);\n }\n /**\r\n * Set icon object color\r\n * @param {string} color - Color to set\r\n * @param {fabric.Path}[obj] - Current activated path object\r\n */\n\n\n setColor(color, obj) {\n this._oColor = color;\n\n if (obj && obj.get('type') === 'icon') {\n obj.set({\n fill: this._oColor\n });\n this.getCanvas().renderAll();\n }\n }\n /**\r\n * Get icon color\r\n * @param {fabric.Path}[obj] - Current activated path object\r\n * @returns {string} color\r\n */\n\n\n getColor(obj) {\n return obj.fill;\n }\n /**\r\n * Create icon object\r\n * @param {string} path - Path value to create icon\r\n * @returns {fabric.Path} Path object\r\n */\n\n\n _createIcon(path) {\n return new fabric.Path(path);\n }\n /**\r\n * MouseDown event handler on canvas\r\n * @param {{target: fabric.Object, e: MouseEvent}} fEvent - Fabric event object\r\n * @private\r\n */\n\n\n _onFabricMouseDown(fEvent) {\n const canvas = this.getCanvas();\n this._startPoint = canvas.getPointer(fEvent.e);\n const {\n x: left,\n y: top\n } = this._startPoint;\n this.add(this._type, {\n left,\n top,\n fill: this._iconColor\n }).then(() => {\n this.fire(events.ADD_OBJECT, this.graphics.createObjectProperties(this._icon));\n canvas.on('mouse:move', this._handlers.mousemove);\n canvas.on('mouse:up', this._handlers.mouseup);\n });\n }\n /**\r\n * MouseMove event handler on canvas\r\n * @param {{target: fabric.Object, e: MouseEvent}} fEvent - Fabric event object\r\n * @private\r\n */\n\n\n _onFabricMouseMove(fEvent) {\n const canvas = this.getCanvas();\n\n if (!this._icon) {\n return;\n }\n\n const moveOriginPointer = canvas.getPointer(fEvent.e);\n const scaleX = (moveOriginPointer.x - this._startPoint.x) / this._icon.width;\n const scaleY = (moveOriginPointer.y - this._startPoint.y) / this._icon.height;\n\n this._icon.set({\n scaleX: Math.abs(scaleX * 2),\n scaleY: Math.abs(scaleY * 2)\n });\n\n this._icon.setCoords();\n\n canvas.renderAll();\n }\n /**\r\n * MouseUp event handler on canvas\r\n * @private\r\n */\n\n\n _onFabricMouseUp() {\n const canvas = this.getCanvas();\n this.fire(events.OBJECT_ADDED, this.graphics.createObjectProperties(this._icon));\n this._icon = null;\n canvas.off('mouse:down', this._handlers.mousedown);\n canvas.off('mouse:move', this._handlers.mousemove);\n canvas.off('mouse:up', this._handlers.mouseup);\n }\n\n}\n\nexport default Icon;","map":{"version":3,"sources":["C:/Users/kkwan_000/Desktop/git/2017110269/minsung/src/js/component/icon.js"],"names":["fabric","snippet","Promise","Component","eventNames","events","rejectMessages","componentNames","fObjectOptions","pathMap","arrow","cancel","Icon","constructor","graphics","ICON","_oColor","_pathMap","_type","_iconColor","_handlers","mousedown","_onFabricMouseDown","bind","mousemove","_onFabricMouseMove","mouseup","_onFabricMouseUp","setStates","type","iconColor","start","canvas","getCanvas","selection","on","end","off","add","options","resolve","reject","path","selectionStyle","SELECTION_STYLE","icon","_createIcon","_icon","invalidParameters","set","extend","fill","controlStyle","setActiveObject","createObjectProperties","registerPaths","pathInfos","forEach","setColor","color","obj","get","renderAll","getColor","Path","fEvent","_startPoint","getPointer","e","x","left","y","top","then","fire","ADD_OBJECT","moveOriginPointer","scaleX","width","scaleY","height","Math","abs","setCoords","OBJECT_ADDED"],"mappings":"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","sourcesContent":["/**\r\n * @author NHN Ent. FE Development Team <dl_javascript@nhn.com>\r\n * @fileoverview Add icon module\r\n */\r\nimport fabric from 'fabric';\r\nimport snippet from 'tui-code-snippet';\r\nimport { Promise } from '../util';\r\nimport Component from '../interface/component';\r\nimport { eventNames as events, rejectMessages, componentNames, fObjectOptions } from '../consts';\r\n\r\nconst pathMap = {\r\n arrow: 'M 0 90 H 105 V 120 L 160 60 L 105 0 V 30 H 0 Z',\r\n cancel:\r\n 'M 0 30 L 30 60 L 0 90 L 30 120 L 60 90 L 90 120 L 120 90 ' +\r\n 'L 90 60 L 120 30 L 90 0 L 60 30 L 30 0 Z',\r\n};\r\n\r\n/**\r\n * Icon\r\n * @class Icon\r\n * @param {Graphics} graphics - Graphics instance\r\n * @extends {Component}\r\n * @ignore\r\n */\r\nclass Icon extends Component {\r\n constructor(graphics) {\r\n super(componentNames.ICON, graphics);\r\n\r\n /**\r\n * Default icon color\r\n * @type {string}\r\n */\r\n this._oColor = '#000000';\r\n\r\n /**\r\n * Path value of each icon type\r\n * @type {Object}\r\n */\r\n this._pathMap = pathMap;\r\n\r\n /**\r\n * Type of the drawing icon\r\n * @type {string}\r\n * @private\r\n */\r\n this._type = null;\r\n\r\n /**\r\n * Color of the drawing icon\r\n * @type {string}\r\n * @private\r\n */\r\n this._iconColor = null;\r\n\r\n /**\r\n * Event handler list\r\n * @type {Object}\r\n * @private\r\n */\r\n this._handlers = {\r\n mousedown: this._onFabricMouseDown.bind(this),\r\n mousemove: this._onFabricMouseMove.bind(this),\r\n mouseup: this._onFabricMouseUp.bind(this),\r\n };\r\n }\r\n\r\n /**\r\n * Set states of the current drawing shape\r\n * @ignore\r\n * @param {string} type - Icon type ('arrow', 'cancel', custom icon name)\r\n * @param {string} iconColor - Icon foreground color\r\n */\r\n setStates(type, iconColor) {\r\n this._type = type;\r\n this._iconColor = iconColor;\r\n }\r\n\r\n /**\r\n * Start to draw the icon on canvas\r\n * @ignore\r\n */\r\n start() {\r\n const canvas = this.getCanvas();\r\n canvas.selection = false;\r\n canvas.on('mouse:down', this._handlers.mousedown);\r\n }\r\n\r\n /**\r\n * End to draw the icon on canvas\r\n * @ignore\r\n */\r\n end() {\r\n const canvas = this.getCanvas();\r\n\r\n canvas.selection = true;\r\n canvas.off({\r\n 'mouse:down': this._handlers.mousedown,\r\n });\r\n }\r\n\r\n /**\r\n * Add icon\r\n * @param {string} type - Icon type\r\n * @param {Object} options - Icon options\r\n * @param {string} [options.fill] - Icon foreground color\r\n * @param {string} [options.left] - Icon x position\r\n * @param {string} [options.top] - Icon y position\r\n * @returns {Promise}\r\n */\r\n add(type, options) {\r\n return new Promise((resolve, reject) => {\r\n const canvas = this.getCanvas();\r\n const path = this._pathMap[type];\r\n const selectionStyle = fObjectOptions.SELECTION_STYLE;\r\n const icon = path ? this._createIcon(path) : null;\r\n this._icon = icon;\r\n\r\n if (!icon) {\r\n reject(rejectMessages.invalidParameters);\r\n }\r\n\r\n icon.set(\r\n snippet.extend(\r\n {\r\n type: 'icon',\r\n fill: this._oColor,\r\n },\r\n selectionStyle,\r\n options,\r\n this.graphics.controlStyle\r\n )\r\n );\r\n\r\n canvas.add(icon).setActiveObject(icon);\r\n\r\n resolve(this.graphics.createObjectProperties(icon));\r\n });\r\n }\r\n\r\n /**\r\n * Register icon paths\r\n * @param {{key: string, value: string}} pathInfos - Path infos\r\n */\r\n registerPaths(pathInfos) {\r\n snippet.forEach(\r\n pathInfos,\r\n (path, type) => {\r\n this._pathMap[type] = path;\r\n },\r\n this\r\n );\r\n }\r\n\r\n /**\r\n * Set icon object color\r\n * @param {string} color - Color to set\r\n * @param {fabric.Path}[obj] - Current activated path object\r\n */\r\n setColor(color, obj) {\r\n this._oColor = color;\r\n\r\n if (obj && obj.get('type') === 'icon') {\r\n obj.set({ fill: this._oColor });\r\n this.getCanvas().renderAll();\r\n }\r\n }\r\n\r\n /**\r\n * Get icon color\r\n * @param {fabric.Path}[obj] - Current activated path object\r\n * @returns {string} color\r\n */\r\n getColor(obj) {\r\n return obj.fill;\r\n }\r\n\r\n /**\r\n * Create icon object\r\n * @param {string} path - Path value to create icon\r\n * @returns {fabric.Path} Path object\r\n */\r\n _createIcon(path) {\r\n return new fabric.Path(path);\r\n }\r\n\r\n /**\r\n * MouseDown event handler on canvas\r\n * @param {{target: fabric.Object, e: MouseEvent}} fEvent - Fabric event object\r\n * @private\r\n */\r\n _onFabricMouseDown(fEvent) {\r\n const canvas = this.getCanvas();\r\n\r\n this._startPoint = canvas.getPointer(fEvent.e);\r\n const { x: left, y: top } = this._startPoint;\r\n\r\n this.add(this._type, {\r\n left,\r\n top,\r\n fill: this._iconColor,\r\n }).then(() => {\r\n this.fire(events.ADD_OBJECT, this.graphics.createObjectProperties(this._icon));\r\n canvas.on('mouse:move', this._handlers.mousemove);\r\n canvas.on('mouse:up', this._handlers.mouseup);\r\n });\r\n }\r\n\r\n /**\r\n * MouseMove event handler on canvas\r\n * @param {{target: fabric.Object, e: MouseEvent}} fEvent - Fabric event object\r\n * @private\r\n */\r\n _onFabricMouseMove(fEvent) {\r\n const canvas = this.getCanvas();\r\n\r\n if (!this._icon) {\r\n return;\r\n }\r\n const moveOriginPointer = canvas.getPointer(fEvent.e);\r\n\r\n const scaleX = (moveOriginPointer.x - this._startPoint.x) / this._icon.width;\r\n const scaleY = (moveOriginPointer.y - this._startPoint.y) / this._icon.height;\r\n\r\n this._icon.set({\r\n scaleX: Math.abs(scaleX * 2),\r\n scaleY: Math.abs(scaleY * 2),\r\n });\r\n\r\n this._icon.setCoords();\r\n canvas.renderAll();\r\n }\r\n\r\n /**\r\n * MouseUp event handler on canvas\r\n * @private\r\n */\r\n _onFabricMouseUp() {\r\n const canvas = this.getCanvas();\r\n\r\n this.fire(events.OBJECT_ADDED, this.graphics.createObjectProperties(this._icon));\r\n\r\n this._icon = null;\r\n\r\n canvas.off('mouse:down', this._handlers.mousedown);\r\n canvas.off('mouse:move', this._handlers.mousemove);\r\n canvas.off('mouse:up', this._handlers.mouseup);\r\n }\r\n}\r\n\r\nexport default Icon;\r\n"]},"metadata":{},"sourceType":"module"}